:root{--ground:#e7ebe6;--surface:#fbfcfa;--card:#ffffff;--ink:#15231d;--muted:#5b6a62;--line:#d9e0da;--brand:#16453a;--brand-ink:#f2f6f3;--brass:#b5832a;--brass-soft:#f4ead6;--good:#2f7a4f;--warn:#b26b12;--bad:#b03a2e;--warn-soft:#fbefdc;--bad-soft:#f8e3e0;--good-soft:#e2f1e7;--display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;--body:"Public Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--ground:#0c1311;--surface:#121b18;--card:#18241f;--ink:#e6eee9;--muted:#9aaba2;--line:#2a3832;--brand:#2d6b5b;--brand-ink:#f2f6f3;--brass:#d9a54c;--brass-soft:#3a2f1b;--good:#5cbf86;--warn:#e3a14a;--bad:#e8786b;--warn-soft:#3a2c17;--bad-soft:#3d201c;--good-soft:#1b3326;color-scheme:dark}}:root[data-theme=dark]{--ground:#0c1311;--surface:#121b18;--card:#18241f;--ink:#e6eee9;--muted:#9aaba2;--line:#2a3832;--brand:#2d6b5b;--brand-ink:#f2f6f3;--brass:#d9a54c;--brass-soft:#3a2f1b;--good:#5cbf86;--warn:#e3a14a;--bad:#e8786b;--warn-soft:#3a2c17;--bad-soft:#3d201c;--good-soft:#1b3326;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45}#root{height:100%;display:flex;justify-content:center;align-items:center;padding:24px 16px}.wrap{display:flex;gap:40px;justify-content:center;align-items:flex-start;flex-wrap:wrap;max-width:1000px;margin:0 auto}.side{max-width:300px;min-width:0;padding-top:20px}.side h1{font-family:var(--display);font-size:28px;line-height:1.1;margin:0 0 10px;text-wrap:balance}.side p{color:var(--muted);margin:0 0 12px}.side .tag{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--brass);font-weight:600;margin-bottom:8px}.side ul{padding-left:18px;color:var(--muted);margin:0 0 14px}.phone{width:390px;max-width:100%;height:780px;max-height:calc(100vh - 48px);min-height:600px;background:var(--surface);border-radius:34px;border:1px solid var(--line);box-shadow:0 30px 60px -30px #0a1e1459;overflow:hidden;display:flex;flex-direction:column;position:relative}@media(max-width:480px){#root{padding:0}.phone{width:100%;height:100%;max-height:none;min-height:0;border-radius:0;border:0;box-shadow:none}}.screen{flex:1;overflow-y:auto;padding:18px 18px 24px;min-height:0}.top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}.hello{font-size:13px;color:var(--muted)}.name{font-family:var(--display);font-size:22px;font-weight:700;line-height:1.1}h2{font-family:var(--display);font-size:20px;margin:0 0 4px;text-wrap:balance}h3{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:22px 0 8px;font-weight:600}.num{font-family:var(--mono);font-variant-numeric:tabular-nums}.avatar{width:38px;height:38px;border-radius:50%;background:var(--brass-soft);color:var(--brass);display:grid;place-items:center;font-weight:700;border:0;cursor:pointer;font-family:var(--display)}.hero{background:var(--brand);color:var(--brand-ink);border-radius:20px;padding:18px}.hero .lbl{font-size:12px;opacity:.8;text-transform:uppercase;letter-spacing:.08em}.hero .big{font-family:var(--display);font-size:34px;font-weight:700;margin:2px 0 10px}.hero .row{display:flex;gap:16px;flex-wrap:wrap}.hero .row div{min-width:0}.hero .row small{display:block;opacity:.75;font-size:12px}.bar{height:6px;border-radius:6px;background:#fff3;overflow:hidden;margin-top:12px}.bar i{display:block;height:100%;background:var(--brass)}.list{display:flex;flex-direction:column;gap:10px}.item{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;display:flex;gap:12px;align-items:center;cursor:pointer;text-align:left;width:100%;font:inherit;color:inherit}.item:hover{border-color:var(--brand)}.item .ic{width:40px;height:40px;border-radius:12px;background:var(--brass-soft);color:var(--brass);display:grid;place-items:center;flex:none}.item .ic svg{width:20px;height:20px}.item .mid{flex:1;min-width:0}.item .t{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item .s{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item .r{text-align:right;flex:none}.pill{display:inline-block;font-size:11px;font-weight:600;padding:3px 8px;border-radius:99px;white-space:nowrap}.pill.warn{background:var(--warn-soft);color:var(--warn)}.pill.bad{background:var(--bad-soft);color:var(--bad)}.pill.good{background:var(--good-soft);color:var(--good)}.pill.info{background:var(--brass-soft);color:var(--brass)}.alert{border-radius:14px;padding:12px 14px;border:1px solid var(--line);background:var(--card);display:flex;gap:10px;align-items:flex-start}.alert .dot{width:8px;height:8px;border-radius:50%;margin-top:7px;flex:none}.alert .dot.warn{background:var(--warn)}.alert .dot.bad{background:var(--bad)}.alert .dot.good{background:var(--good)}.alert .dot.info{background:var(--brass)}.alert b{display:block}.alert span{font-size:13px;color:var(--muted)}.btn{display:inline-flex;justify-content:center;align-items:center;gap:6px;border:0;border-radius:12px;padding:12px 16px;font:600 15px var(--body);cursor:pointer;background:var(--brand);color:var(--brand-ink);width:100%}.btn.ghost{background:transparent;color:var(--brand);border:1px solid var(--line)}:root[data-theme=dark] .btn.ghost{color:var(--ink)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .btn.ghost{color:var(--ink)}}.btn.brass{background:var(--brass);color:#1d1406}.btn:focus-visible,.item:focus-visible,.tab:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.chip:focus-visible,.back:focus-visible{outline:2px solid var(--brass);outline-offset:2px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stat{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;min-width:0}.stat small{display:block;color:var(--muted);font-size:12px}.stat b{font-size:17px}.tabs{display:flex;border-top:1px solid var(--line);background:var(--card);padding:6px 6px calc(8px + env(safe-area-inset-bottom,0px))}.tab{flex:1;background:none;border:0;color:var(--muted);font:500 11px var(--body);display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;cursor:pointer;border-radius:10px;position:relative}.tab svg{width:22px;height:22px}.tab.on{color:var(--brand);font-weight:600}:root[data-theme=dark] .tab.on{color:var(--brass)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .tab.on{color:var(--brass)}}.badge{position:absolute;top:2px;left:calc(50% + 6px);background:var(--bad);color:#fff;font-size:10px;border-radius:99px;padding:0 5px;line-height:16px}label{display:block;font-size:13px;font-weight:600;margin:12px 0 4px}input,select,textarea{width:100%;font:15px var(--body);padding:11px 12px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink)}textarea{min-height:80px;resize:vertical}.check{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--muted);margin-top:12px;font-weight:400}.check input{width:auto;margin-top:3px}.back{background:none;border:0;color:var(--muted);font:500 14px var(--body);cursor:pointer;padding:0;margin-bottom:10px;display:inline-flex;gap:4px;align-items:center}.kv{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}.kv span:first-child{color:var(--muted)}.chips{display:flex;gap:8px;flex-wrap:wrap}.chip{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:99px;padding:8px 12px;font:500 13px var(--body);cursor:pointer}.chip.on{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)}.note{font-size:12px;color:var(--muted);margin-top:10px}.sim{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px}.sim input[type=range]{padding:0;border:0;accent-color:var(--brass)}.lesson{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px}.lesson .k{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--brass);font-weight:600}.lesson b{display:block;margin:4px 0}.lesson p{margin:0;font-size:13px;color:var(--muted)}.welcome{display:flex;flex-direction:column;justify-content:space-between;height:100%;gap:20px}.mark{font-family:var(--display);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass);font-weight:700}.welcome h1{font-family:var(--display);font-size:36px;line-height:1.05;margin:10px 0;text-wrap:balance}.welcome p{color:var(--muted)}.ex{font-size:11px;color:var(--muted);text-align:center;margin-top:16px}.toast{position:absolute;left:16px;right:16px;bottom:84px;background:var(--ink);color:var(--surface);border-radius:12px;padding:12px 14px;font-size:14px}.split{display:flex;gap:4px;height:10px;border-radius:6px;overflow:hidden;margin:8px 0 4px}.split i{display:block;height:100%}@media(prefers-reduced-motion:no-preference){.screen>*{animation:in .25s ease both}@keyframes in{0%{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}}.phone{padding-top:env(safe-area-inset-top,0px)}.err{background:var(--bad-soft);color:var(--bad);border-radius:10px;padding:10px 12px;font-size:13px;margin-top:10px}.demo-bar{background:var(--brass-soft);color:var(--brass);font-size:12px;text-align:center;padding:6px 10px;font-weight:600}.center{display:grid;place-items:center;height:100%;color:var(--muted)}table{width:100%;border-collapse:collapse;font-size:13px}td,th{text-align:left;padding:8px 6px;border-bottom:1px solid var(--line);vertical-align:top}th{color:var(--muted);font-weight:600;font-size:12px}.scroll-x{overflow-x:auto}