/* Pine & Polish: forest, parchment and brushed brass. */
:root { --bg:#f2efe7; --surface:#fffdf7; --surface-2:#eae8de; --pine:#142e23; --pine-2:#254d3a; --line:#dcded2; --brass:#b89451; --brass-ink:#806029; --r:22px; --shadow:0 8px 30px #18352708; }
body { background:radial-gradient(ellipse at 85% 0,#dce4d5 0,transparent 48%),var(--bg); }
.app { max-width:1120px; }
.gut { padding-left:24px; padding-right:24px; }
.hdr { background:radial-gradient(ellipse at top right,#35573b 0,transparent 62%),#142e23; padding-block:30px; border-radius:0 0 32px 32px; overflow:hidden; box-shadow:0 16px 44px #142e2312; }
.brand { font-size:32px; letter-spacing:-1px; }
.hdr .sub { margin-top:8px; }
.eyebrow { color:#d5ba81; text-transform:uppercase; font-size:10px; letter-spacing:.24em; font-weight:800; margin-bottom:10px; }
.hdr .hub-title { font:500 clamp(30px,5vw,50px)/1.1 var(--display); margin:24px 0 8px; letter-spacing:-1.5px; color:#f9f3e5; }
.hub-caption { color:#c0cec2; max-width:530px; margin:0 0 25px; font-size:13px; }
.kpis { gap:12px; }
.kpi { padding:18px; border-radius:18px; background:#ffffff09; border-color:#d7dfc52b; transition:background .2s,transform .2s; }
.kpi b { font-size:28px; margin:6px 0; letter-spacing:-1px; }
.kpi span { font-size:10px; letter-spacing:.08em; }
.goalbar { height:4px; }
main { gap:22px; padding-top:25px; }
.banner { background:var(--surface-2); color:var(--muted); border:1px solid var(--line); font-size:11px; font-weight:500; line-height:1.6; }
.tile { background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:20px; padding:20px; min-height:140px; box-shadow:var(--shadow); transition:transform .2s,box-shadow .2s,border-color .2s; }
.tile .ic { background:var(--surface-2); color:var(--pine-2); width:42px; height:42px; border:1px solid var(--line); }
.tile small { color:var(--muted); font-size:11px; font-weight:500; margin-top:6px; }
.tile.wide { min-height:95px; background:var(--surface-2); box-shadow:none; }
.tile[data-v="coach"] { background:var(--pine); color:#fff8e6; border-color:#526143; }
.tile[data-v="coach"] small { color:#c8d4c7; }
.tile[data-v="coach"] .ic { background:#ffffff15; color:#e0c387; border-color:#ffffff20; }
.sec h2 { font-size:10px; letter-spacing:.18em; }
.empty { padding:30px; border:1px solid var(--line); background:var(--surface); box-shadow:var(--shadow); }
.empty b { font-family:var(--display); font-size:24px; font-weight:500; margin-bottom:8px; }
.btn { border-radius:12px; }
.nav { background:color-mix(in srgb,var(--surface) 93%,transparent); backdrop-filter:blur(18px); }
.nav-inner { max-width:1000px; }
.fab { right:max(24px,calc(50% - 530px)); }
.row,.job { border-radius:18px; }
.card { padding:22px; }
.ai-intro { padding:32px; background:var(--pine); color:#f9f3e5; border-radius:24px; }
.ai-intro h2 { font:500 34px/1.12 var(--display); margin:12px 0; }
.ai-intro p { color:#c3d0c4; font-size:13px; line-height:1.7; }
.ai-status { display:inline-flex; padding:5px 10px; border:1px solid #c3aa6e70; border-radius:20px; color:#e0c387; font-size:10px; letter-spacing:.09em; text-transform:uppercase; }
.ai-features { display:grid; gap:12px; grid-template-columns:repeat(3,1fr); }
.ai-feature { padding:20px; background:var(--surface); border:1px solid var(--line); border-radius:18px; }
.ai-feature b { display:block; margin:12px 0 6px; }
.ai-feature p { font-size:12px; color:var(--muted); margin:0; line-height:1.6; }
@media(min-width:760px) { .app { padding-top:24px; } .hdr { border-radius:28px; padding:34px; } .gut { padding-left:32px; padding-right:32px; } .kpis { grid-template-columns:repeat(4,minmax(0,1fr)); } .tiles { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; } .nav { left:50%; transform:translateX(-50%); bottom:14px; width:580px; border:1px solid var(--line); border-radius:22px; box-shadow:0 8px 32px #122c2314; } .nav .hubbtn .hb { margin-top:-16px; } }
@media(max-width:500px) { .gut { padding-left:18px; padding-right:18px; } .hdr { padding-top:24px; } .brand { font-size:27px; } .hub-title { font-size:34px; } .tile { padding:16px; min-height:130px; } .ai-features { grid-template-columns:1fr; } .ai-intro { padding:24px; } }
@media(hover:hover) { .tile:hover,.row:hover,.job:hover { transform:translateY(-3px); border-color:var(--brass); box-shadow:0 10px 24px #142e2310; } .kpi:hover { background:#ffffff15; transform:translateY(-2px); } }
@media(prefers-color-scheme:dark) { :root:not([data-theme="light"]) { --bg:#101a15; --surface:#19251e; --surface-2:#223128; --line:#334237; --ink:#f0eee4; --muted:#acb7a9; --pine-2:#b6cfb3; --brass-ink:#d9bc7b; } }
:root[data-theme="dark"] { --bg:#101a15; --surface:#19251e; --surface-2:#223128; --line:#334237; --ink:#f0eee4; --muted:#acb7a9; --pine-2:#b6cfb3; --brass-ink:#d9bc7b; }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; animation:none!important; } }