:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:dark;--bg:#101619;--panel:#1a2328;--ink:#ecf2ef;--muted:#9eafab;--line:#33413f;--accent:#a6d6be;--button-ink:#14271e;--danger:#f0a89d;background:var(--bg);color:var(--ink)}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink)}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.5;cursor:wait}button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}header{max-width:760px;margin:auto;padding:22px 20px 16px;display:flex;justify-content:space-between;align-items:center;padding-top:max(22px,env(safe-area-inset-top))}.eyebrow{font-size:10px;letter-spacing:.16em;color:var(--muted);font-weight:700}h1{font-size:28px;letter-spacing:-.04em;margin:5px 0 0}h2{font-size:20px;letter-spacing:-.02em;margin:8px 0}p{color:var(--muted);line-height:1.5}main{max-width:760px;margin:auto;padding:0 16px calc(100px + env(safe-area-inset-bottom))}.icon{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);color:var(--ink);background:var(--panel);font-size:24px}.segments{display:flex;padding:4px;border:1px solid var(--line);border-radius:16px;gap:4px;background:var(--panel)}.segments button{flex:1;min-width:0;padding:11px 4px;border:0;background:transparent;color:var(--muted);border-radius:12px;font-size:13px;font-weight:650}.segments button.active{background:var(--accent);color:var(--button-ink)}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:18px 2px 8px;gap:8px}#connection{font-size:11px;color:var(--muted)}.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px;margin:10px 0}#screen-text{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65;font-size:15px}#buttons{display:grid;gap:8px}.button-row{display:flex;gap:8px}.action{flex:1;min-width:0;border:1px solid var(--line);border-radius:13px;padding:13px 10px;background:var(--panel);color:var(--ink);line-height:1.35;overflow-wrap:anywhere}.action.record{font-size:14px;text-align:left;padding:17px 14px;border-left:3px solid var(--accent)}.action.danger{color:var(--danger)}.action:hover{border-color:var(--accent)}form{display:grid;gap:12px;margin-top:16px}label{font-size:13px;color:var(--muted)}input{width:100%;min-width:0;border:1px solid var(--line);border-radius:12px;padding:13px;background:var(--bg);color:var(--ink);font-size:16px}.primary,.secondary{border:0;border-radius:12px;padding:13px 16px;font-weight:650}.primary{background:var(--accent);color:var(--button-ink)}.secondary{background:var(--bg);color:var(--ink);border:1px solid var(--line)}.form-actions{display:flex;gap:8px;justify-content:flex-end}.progress{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:13px;font-size:14px;margin-bottom:12px}.progress small{display:block;color:var(--muted);margin-top:4px;font-size:11px}.spinner{width:18px;height:18px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}nav{position:fixed;bottom:0;left:0;right:0;max-width:760px;margin:auto;display:flex;background:var(--panel);border:1px solid var(--line);border-radius:20px 20px 0 0;padding:7px 5px max(9px,env(safe-area-inset-bottom));z-index:3}nav button{background:none;border:0;color:var(--muted);flex:1;min-width:0;border-radius:12px;font-size:10px;padding:7px 2px}nav button span{display:block;font-size:23px;margin-bottom:4px}nav button.active{color:var(--accent);background:var(--bg)}#error{border:1px solid var(--danger);color:var(--danger);background:var(--panel);border-radius:14px;padding:14px;margin-top:14px;line-height:1.5;overflow-wrap:anywhere}#voices audio{width:100%;margin-top:16px}.commands{margin:20px 4px;color:var(--muted);font-size:12px}.commands summary{cursor:pointer}.commands form{display:flex}.commands input{flex:1}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){.spinner{animation:none}}@media(min-width:600px){header{padding-top:32px}main{padding-left:20px;padding-right:20px}.action{padding:16px}nav{bottom:12px;border-radius:20px}h1{font-size:32px}}@media(prefers-color-scheme:light){:root{color-scheme:light;--bg:#f3f5f1;--panel:#fff;--ink:#17261f;--muted:#63736a;--line:#dce4dd;--accent:#c7e5d3;--button-ink:#163a25;--danger:#a83b2b}}