:root {
  --ink: #17201c;
  --muted: #66736c;
  --soft: #f4f1ea;
  --paper: #fffdf8;
  --line: #ded8ca;
  --accent: #315c45;
  --accent-2: #c58542;
  --good: #2f6f53;
  --danger: #9f3f35;
  --shadow: 0 24px 80px rgba(32, 40, 34, 0.11);
  --radius: 28px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: radial-gradient(circle at 20% 0%, #faf5e8 0, transparent 32rem), linear-gradient(180deg, #fbf7ef 0%, #f2eee4 100%);
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.app-shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.hero { padding-top: 18px; }
.topbar {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 12px; border: 1px solid rgba(23,32,28,.08); border-radius: 24px;
  background: rgba(255,253,248,.72); backdrop-filter: blur(18px); position: sticky; top: 12px; z-index: 10;
}
.brand { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.brand-mark { display:grid; place-items:center; width:48px; height:48px; border-radius:16px; background:var(--ink); color:#fff; font-weight:800; }
.brand small { display:block; color:var(--muted); margin-top:2px; }
.nav-actions { display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.nav-link { border:0; background:transparent; padding:11px 14px; border-radius:14px; color:var(--muted); min-height:44px; }
.nav-link.active, .nav-link:hover { background:#ede7d9; color:var(--ink); }
.hero-grid { display:grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 28px; padding: 64px 0 28px; align-items: stretch; }
.hero-copy, .today-card, .panel, .route-panel, .settings-card, .metric-card { background: rgba(255,253,248,.82); border:1px solid rgba(23,32,28,.08); box-shadow: var(--shadow); }
.hero-copy { padding: clamp(28px, 5vw, 58px); border-radius: var(--radius); }
.eyebrow { color:var(--accent); font-size:.78rem; text-transform:uppercase; letter-spacing:.14em; font-weight:800; margin:0 0 12px; }
h1 { font-size: clamp(2.7rem, 7vw, 6.7rem); line-height:.92; letter-spacing:-.07em; margin:0; max-width: 820px; text-wrap: balance; }
h2 { font-size: clamp(1.8rem, 3vw, 3.2rem); line-height:1; letter-spacing:-.045em; margin:0 0 12px; text-wrap: balance; }
h3 { margin:0 0 10px; letter-spacing:-.02em; }
.lede { color:var(--muted); font-size: clamp(1.05rem, 1.8vw, 1.35rem); line-height:1.55; max-width:720px; margin:28px 0; }
.hero-actions, .button-row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.modal-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; position:sticky; bottom:-28px; margin:22px -28px -28px; padding:16px 28px; background:linear-gradient(180deg, rgba(255,253,248,.82), var(--paper) 35%); border-top:1px solid rgba(222,216,202,.7); }
.primary-action, .secondary-action, .danger-action, .file-button {
  border:1px solid transparent; border-radius:999px; min-height:48px; padding: 0 19px; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:800; text-decoration:none;
}
.primary-action { background:var(--ink); color:#fff; }
.primary-action:hover { background:#26362f; }
.secondary-action, .file-button { background:#fffaf0; color:var(--ink); border-color:var(--line); }
.danger-action { color:#fff; background:var(--danger); }
.small { min-height:40px; padding:0 14px; font-size:.92rem; }
.today-card { border-radius: var(--radius); padding: 30px; display:flex; flex-direction:column; justify-content:space-between; min-height:360px; background: linear-gradient(160deg, #22362d, #17201c); color:#fff; }
.today-card p { color:rgba(255,255,255,.72); line-height:1.55; }
.card-label { color:#d7b27a; text-transform:uppercase; letter-spacing:.12em; font-size:.78rem; font-weight:800; }
.dashboard-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:14px; margin: 10px 0 14px; }
.metric-card { border-radius:24px; padding:22px; box-shadow:none; }
.metric-card span, .metric-card small { color:var(--muted); display:block; }
.metric-card strong { font-size:2.2rem; display:block; margin:8px 0 2px; letter-spacing:-.04em; }
.metric-card.calm { background:#e6efe8; }
.panel, .route-panel { border-radius: var(--radius); padding: 26px; margin: 14px 0; }
.section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:20px; }
.pinned-kpis { display:grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap:12px; }
.kpi-card { background:#fffaf0; border:1px solid var(--line); border-radius:22px; padding:18px; min-height:130px; }
.kpi-card .icon { font-size:1.7rem; }
.kpi-card strong { display:block; font-size:1.9rem; margin-top:10px; }
.muted { color:var(--muted); line-height:1.55; }
.filters { display:grid; grid-template-columns: 1.3fr repeat(3, .8fr); gap:12px; margin-bottom:18px; }
.filters label, .long-note { color:var(--muted); font-size:.9rem; font-weight:700; }
input, select, textarea { width:100%; margin-top:6px; border:1px solid var(--line); background:#fffdf8; color:var(--ink); border-radius:16px; padding:13px 14px; min-height:46px; outline:none; }
input:focus, select:focus, textarea:focus, button:focus-visible { outline:3px solid rgba(49,92,69,.22); outline-offset:2px; }
.item-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:14px; }
.item-card { border:1px solid var(--line); background:#fffdf8; border-radius:24px; padding:18px; display:flex; flex-direction:column; gap:14px; min-height:330px; }
.item-card h3 { font-size:1.25rem; }
.item-card p { color:var(--muted); line-height:1.45; margin:0; }
.chips { display:flex; gap:7px; flex-wrap:wrap; }
.chip { border:1px solid #e7dfd1; background:#f8f3e8; border-radius:999px; padding:6px 9px; color:#59645f; font-size:.78rem; font-weight:750; }
.card-actions { margin-top:auto; display:flex; gap:8px; flex-wrap:wrap; }
.route-panel { display:none; }
.route-panel.active { display:block; }
.wins-list { display:grid; gap:12px; }
.win-row { border:1px solid var(--line); background:#fffdf8; border-radius:20px; padding:16px; display:grid; gap:8px; }
.impact-pills { display:flex; gap:7px; flex-wrap:wrap; }
.impact-pill { background:#e8f0ea; border-radius:999px; padding:6px 9px; font-weight:750; font-size:.83rem; }
.settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.settings-card { border-radius:24px; padding:22px; box-shadow:none; }
.file-button { position:relative; overflow:hidden; }
.file-button input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.modal { border:0; border-radius: 30px; padding:0; width:min(860px, calc(100vw - 26px)); background:transparent; }
.modal::backdrop { background: rgba(15,20,17,.45); backdrop-filter: blur(10px); }
.modal-content { background: var(--paper); border:1px solid var(--line); border-radius:30px; padding:28px; box-shadow: var(--shadow); position:relative; max-height: min(92vh, 920px); overflow-y:auto; }
.detail-modal { width:min(920px, calc(100vw - 26px)); }
.detail-content { padding-top:34px; }
.detail-promise { color:var(--muted); font-size:1.08rem; line-height:1.55; margin: 0 0 18px; max-width:720px; }
.detail-meta { display:flex; flex-wrap:wrap; gap:8px; margin: 16px 0 22px; }
.detail-section { border-top:1px solid rgba(222,216,202,.8); padding-top:18px; margin-top:18px; }
.detail-section p { color:var(--muted); line-height:1.55; margin:0; }
.detail-two-col { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.step-list { display:grid; gap:10px; padding-left: 1.35rem; margin:0; color:var(--muted); line-height:1.5; }
.step-list li::marker { color:var(--accent); font-weight:900; }
.detail-actions { justify-content:flex-end; }
.icon-close { position:absolute; top:16px; right:16px; width:42px; height:42px; border-radius:50%; border:1px solid var(--line); background:#fffaf0; font-size:24px; }
.choice-grid, .impact-grid, .custom-impact-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(185px, 1fr)); gap:10px; margin:18px 0; }
.choice, .impact-button { border:1px solid var(--line); background:#fffaf0; border-radius:20px; padding:15px; text-align:left; min-height:86px; }
.choice.selected, .impact-button.selected { background:#e6efe8; border-color:#8caf9b; }
.choice b, .impact-button b { display:block; margin-bottom:4px; }
.choice span, .impact-button span { color:var(--muted); font-size:.88rem; line-height:1.35; }
.kpi-impact-card { border:1px solid var(--line); background:#fffaf0; border-radius:20px; padding:15px; display:grid; gap:12px; }
.kpi-impact-head b { display:block; margin-bottom:4px; }
.kpi-impact-head span { color:var(--muted); font-size:.88rem; line-height:1.35; }
.value-row { display:flex; flex-wrap:wrap; gap:8px; }
.value-chip { min-height:42px; border-radius:999px; border:1px solid var(--line); background:#fffdf8; color:var(--ink); padding:0 13px; font-weight:850; }
.value-chip.selected { background:var(--accent); color:#fff; border-color:var(--accent); }
.value-chip.subtle { color:var(--muted); font-weight:750; }
.value-chip.subtle.selected { background:#fffdf8; color:var(--muted); border-color:var(--line); }
.log-section { margin-top:18px; }
.toast { position:fixed; left:50%; bottom:22px; transform: translateX(-50%) translateY(24px); background:var(--ink); color:#fff; padding:13px 17px; border-radius:999px; opacity:0; transition:.2s ease; z-index:20; box-shadow:var(--shadow); }
.toast.show { opacity:1; transform: translateX(-50%) translateY(0); }
.empty { border:1px dashed var(--line); border-radius:22px; padding:24px; text-align:center; color:var(--muted); background:#fffaf0; }
@media (max-width: 900px) {
  .hero-grid, .settings-grid { grid-template-columns: 1fr; }
  .dashboard-grid { grid-template-columns: repeat(2, 1fr); }
  .filters { grid-template-columns: 1fr 1fr; }
  .item-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topbar { align-items:flex-start; flex-direction:column; position:static; }
}
@media (max-width: 640px) {
  .app-shell { width:min(100% - 20px, 1180px); }
  .hero-grid { padding-top:28px; }
  h1 { font-size:3.2rem; }
  .dashboard-grid, .filters, .item-grid { grid-template-columns:1fr; }
  .panel, .route-panel, .modal-content { padding:18px; border-radius:22px; }
  .detail-two-col { grid-template-columns:1fr; }
  .detail-actions { justify-content:stretch; }
  .detail-actions .primary-action, .detail-actions .secondary-action { flex:1 1 140px; }
  .modal-actions { margin:18px -18px -18px; padding:14px 18px; bottom:-18px; }
  .section-heading { flex-direction:column; }
  .nav-actions { width:100%; display:grid; grid-template-columns:1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior:auto !important; transition:none !important; } }