:root {
  color-scheme: dark;
  --ink:#fff; --muted:#8b929a; --line:#262b31; --orange:#ff4a2f; --blue:#239bf0; --green:#56e59c;
  --prompt-size:64px; --side-padding:6%;
  font-family:"Bahnschrift SemiCondensed","Segoe UI Variable Display",sans-serif;
}
*{box-sizing:border-box} html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#000;color:var(--ink)}
button,input{font:inherit} button{color:inherit;cursor:pointer}
.stage{position:fixed;inset:0;width:100dvw;height:100dvh;overflow:hidden;background:#000}
.mirror-layer{position:absolute;inset:0;min-width:0;min-height:0;display:grid;grid-template-rows:46px minmax(0,1fr);padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));background:radial-gradient(circle at 50% 35%,#101316 0,#000 62%);transition:transform .2s ease}
.stage[data-mirror="true"] .mirror-layer{transform:scaleX(-1)}
.topbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 4px 8px}
.brand{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:900;letter-spacing:.18em}.brand-mark{display:grid;place-items:center;width:26px;height:26px;background:var(--orange);color:#000;transform:skew(-8deg)}
.status{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:11px}.status i{width:7px;height:7px;border-radius:50%;background:#f6bd4c;box-shadow:0 0 12px currentColor}.status.online i{background:var(--green)}
.hidden{display:none!important}.eyebrow{display:flex;justify-content:space-between;color:var(--orange);font-size:11px;font-weight:900;letter-spacing:.16em}
.panel{align-self:center;justify-self:center;width:min(760px,90%);padding:32px 40px;border:1px solid var(--line);background:#0c0f12;box-shadow:0 26px 90px #000}
.panel h1{font-size:48px;line-height:.95;letter-spacing:-.045em;margin:12px 0 24px}.login{width:min(520px,86%);display:flex;flex-direction:column;max-height:calc(100% - 34px);overflow:auto}
label{display:grid;gap:5px;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
input{width:100%;padding:12px 0;border:0;border-bottom:1px solid #59616a;outline:0;background:transparent;color:#fff;font-size:19px;text-transform:none;letter-spacing:0}input:focus{border-color:var(--orange)}
.pin{text-align:center;font-size:42px;letter-spacing:.42em;min-height:64px}.pin::placeholder{color:#4e545b;opacity:1}.login-help{margin:10px 0 0;text-align:center;color:var(--muted);font-size:11px}
.primary{width:100%;display:flex;justify-content:space-between;margin-top:24px;padding:14px 18px;border:0;background:var(--orange);color:#080808;font-weight:950}.error{min-height:18px;color:#ff806f;font-size:12px}.recent{margin-top:14px;color:var(--muted);font-size:11px;max-height:72px;overflow:auto}
.setup{align-self:stretch;justify-self:stretch;width:100%;height:100%;padding:18px clamp(16px,8vw,90px) max(96px,calc(env(safe-area-inset-bottom) + 72px));overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;touch-action:pan-y;-webkit-overflow-scrolling:touch}.setup h1{font-size:clamp(34px,6vw,52px);margin:8px 0 14px}.setup-help{margin:0 0 12px;color:var(--muted);font-size:14px;line-height:1.4}.ai-suggest{margin:0;min-height:52px}.suggestion-status{min-height:18px;margin:8px 0;color:var(--muted);font-size:11px}.suggestions{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px}.suggestion-card{display:grid;grid-template-columns:1fr auto;gap:5px 10px;min-height:76px;padding:12px 14px;border:1px solid var(--line);background:#15191d;text-align:left}.suggestion-card b{font-size:15px;line-height:1.2}.suggestion-card small{grid-column:1;color:var(--muted);font-size:10px}.suggestion-card span{grid-column:2;grid-row:1/3;align-self:center;color:var(--green);font-size:9px;font-weight:900}.section-label{margin:16px 0 8px;color:var(--orange);font-size:10px;font-weight:900;letter-spacing:.14em}.recent{display:grid;gap:8px;max-height:none;overflow:visible;margin-top:0}.prepared-chat{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;min-height:58px;border:1px solid var(--line);background:#15191d;padding:13px 15px;text-align:left}.prepared-chat b{color:#fff;font-size:15px}.prepared-chat span{flex:0 0 auto;color:var(--green);font-size:9px;font-weight:900;letter-spacing:.08em}.prepared-chat:disabled,.suggestion-card:disabled{opacity:.65}.setup-actions{padding:12px 0 0;display:grid;grid-template-columns:auto 1fr;gap:8px}.secondary,.pc-link{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);padding:11px 12px;margin:0;background:#15191d;color:#dce2e7;text-decoration:none;font-size:10px;font-weight:900;letter-spacing:.05em}.pc-link:hover,.secondary:hover{border-color:var(--orange);color:var(--orange)}
.login-button{min-height:62px;align-items:center;font-size:18px;letter-spacing:.08em;flex:0 0 auto}.login-button:disabled{opacity:.65;cursor:wait}
.interview{min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:8px;padding-bottom:2px}
.prompt-shell{min-height:0;padding:12px var(--side-padding) 6px;border:0;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.prompt-window{min-height:0;max-height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scroll-behavior:smooth;touch-action:pan-y;-webkit-overflow-scrolling:touch}
.prompt-window h1{margin:6px 0;font-size:clamp(25px,5vmin,54px);line-height:1.08;letter-spacing:-.025em;font-weight:600;text-wrap:balance}
.interview .eyebrow{justify-content:flex-end}.interview #currentTopic{display:none}
.prompt-supports,.hint{display:none}
.listen-dock{display:flex;justify-content:center;align-items:center;min-height:82px;padding:6px 10px calc(8px + env(safe-area-inset-bottom));border:0;background:transparent;position:sticky;bottom:0;z-index:8}.listen-button{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;border:1px solid #394149;background:#20262c;color:#fff;box-shadow:0 8px 28px #000a}.listen-button.active{background:var(--green);color:#06110b;box-shadow:0 0 0 8px #56e59c18,0 0 34px #56e59c66}.listen-copy{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.mic-icon{position:relative;width:15px;height:24px;border:3px solid currentColor;border-radius:9px}.mic-icon::after{content:"";position:absolute;left:50%;top:17px;width:24px;height:14px;transform:translateX(-50%);border:3px solid currentColor;border-top:0;border-radius:0 0 12px 12px}
.voice-setup{margin:14px 0;border:1px solid var(--line);padding:12px 14px;background:#101419;color:#dce2e7}.voice-setup summary{cursor:pointer;color:var(--green);font-size:11px;font-weight:900;letter-spacing:.06em}.voice-setup p{color:var(--muted);font-size:11px}.key-row{display:grid;grid-template-columns:1fr auto;gap:8px}.key-row button{border:0;background:var(--green);color:#07110c;font-weight:900;padding:0 15px}
.controls{display:flex;justify-content:center;align-items:center;gap:7px}.controls>button,.control-group button,.utility button{border:1px solid var(--line);background:#171a1e;padding:8px 12px;font-size:11px;font-weight:850}.controls>button:hover,.control-group button:hover,.utility button:hover{border-color:var(--orange)}
.control-group{display:flex;align-items:center;gap:5px;border:1px solid var(--line);padding:4px;background:#0c0f12}.control-group>span{color:var(--muted);font-size:9px;letter-spacing:.12em;margin:0 4px}.control-group b{min-width:35px;text-align:center;font-size:11px}.control-group button{width:33px;padding:7px 0;font-size:18px}
.controls .mic{width:48px;height:48px;border-radius:50%;padding:0;background:var(--orange);border-color:var(--orange);position:relative}.mic span{position:absolute;left:50%;top:50%;width:12px;height:20px;transform:translate(-50%,-60%);border:3px solid #050505;border-radius:8px}.mic span::after{content:"";position:absolute;left:50%;top:14px;width:20px;height:12px;transform:translateX(-50%);border:3px solid #050505;border-top:0;border-radius:0 0 10px 10px}.mic.active{box-shadow:0 0 0 7px #ff4a2f2d,0 0 30px #ff4a2f88;animation:pulse 1.3s infinite}@keyframes pulse{50%{box-shadow:0 0 0 12px #ff4a2f0c,0 0 42px #ff4a2f99}}
.active-toggle{border-color:var(--blue)!important;color:#a9d9ff}.active-toggle.off{border-color:var(--line)!important;color:var(--muted)}
.utility{position:absolute;right:max(15px,env(safe-area-inset-right));left:auto;top:max(58px,calc(env(safe-area-inset-top) + 52px));display:flex;gap:5px;z-index:20}.utility button{padding:8px 11px;color:var(--muted)}.utility span{font-size:8px}.utility .fullscreen-button{border-color:var(--orange);background:var(--orange);color:#050505}
@media (orientation:portrait){
  .stage{width:100dvh;height:100dvw;left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-50%) rotate(90deg);transform-origin:center}
  .mirror-layer{padding:max(8px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom))}
  .setup{padding:12px clamp(18px,7vw,72px) 74px}.suggestions{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.setup-actions{grid-template-columns:auto 1fr}
  .interview{padding-top:0}.listen-button{width:64px}.utility{top:44px;right:10px}.utility span{display:none}
}
@media (max-height:520px) and (orientation:landscape){.mirror-layer{grid-template-rows:34px minmax(0,1fr);padding:6px max(9px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(9px,env(safe-area-inset-left))}.topbar{padding-bottom:4px}.brand-mark{width:21px;height:21px}.prompt-shell{padding-top:10px}.listen-dock{min-height:62px}.listen-button{height:48px}.utility{top:41px}.panel{padding:22px 30px}.panel h1{font-size:38px;margin:9px 0 18px}}
