:root{color-scheme:dark;--bg:#111518;--panel:#1b2125;--panel2:#232b30;--line:#354047;--cream:#fff7ed;--muted:#9ca8af;--accent:#e6b894;--red:#ff766e;--font:30px;font-family:system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--cream);min-height:100vh}button,input,textarea{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.4;cursor:not-allowed}.app-header{height:74px;padding:0 clamp(16px,4vw,52px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:12px}.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:40px;height:40px;border:1px solid #806a5d;background:#342921;border-radius:13px;display:grid;place-items:center;font-weight:900;font-size:24px;color:var(--accent)}.brand-mark span{color:#e8dbcd}.brand strong,.brand small{display:block}.brand small{font-size:11px;color:var(--muted);margin-top:2px}.header-actions{display:flex;align-items:center;gap:14px}.status-indicator{font-size:12px;color:var(--muted);max-width:135px;text-align:right}.small-button,.outlined-button{background:transparent;border:1px solid #53616a;border-radius:12px;color:var(--cream);padding:11px 13px;font-size:13px;font-weight:650}.small-button:hover,.outlined-button:hover{background:var(--panel2)}.main{max-width:1120px;margin:0 auto;padding:20px 18px 48px}.intro{margin:14px 0 26px}.eyebrow{font-size:10px;letter-spacing:.16em;color:var(--accent);font-weight:700}.intro h1{font-size:clamp(28px,4vw,42px);line-height:1.09;letter-spacing:-.05em;margin:10px 0}.intro h1 em{font-style:normal;color:var(--accent)}.intro p{font-size:14px;color:var(--muted);margin:0;max-width:560px;line-height:1.6}.workspace{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:23px;align-items:start}.prompter-column{max-width:520px;width:100%;margin:0 auto}.device-top{height:38px;display:flex;gap:8px;align-items:center;color:#b6c0c5;font-size:12px;justify-content:flex-start}.device-top #recTimer{margin-left:auto;font-variant-numeric:tabular-nums}.live-dot{width:8px;height:8px;border-radius:50%;background:#77848c;box-shadow:0 0 0 3px #233039}.live-dot.recording{background:var(--red);box-shadow:0 0 0 4px #5d292e;animation:pulse 1.1s infinite}@keyframes pulse{50%{opacity:.45}}.stage{height:min(70vh,635px);min-height:410px;position:relative;border:1px solid #535f64;border-radius:22px;overflow:hidden;background:radial-gradient(circle at 60% 16%,#435151 0%,#1c282e 42%,#0c1012 90%)}#cameraPreview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1);display:none}.stage.camera-on #cameraPreview{display:block}.camera-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;text-align:center;padding-bottom:95px;color:#d1d9da}.camera-circle{font-size:52px;opacity:.15}.camera-placeholder p{font-weight:700;font-size:14px;margin:5px 0}.camera-placeholder small{font-size:12px;color:#a4afb2}.stage.camera-on .camera-placeholder{display:none}.fade-top{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(6,11,15,.94),rgba(6,11,15,.70) 43%,rgba(6,11,15,.15) 72%,rgba(6,11,15,.43) 100%)}.lines-window{position:absolute;top:7%;left:5%;right:5%;min-height:45%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:12px;text-align:center;pointer-events:none}.active-line{font-size:var(--font);line-height:1.28;font-weight:800;letter-spacing:-.028em;margin:0;color:#fff7eb;text-shadow:0 2px 9px rgba(0,0,0,.5);overflow-wrap:break-word;max-width:100%}.neighbor{font-size:clamp(14px,calc(var(--font)*.57),23px);line-height:1.38;margin:0;color:#b7c6c9;opacity:.82;max-width:94%;overflow-wrap:break-word}.prev-line{opacity:.5}.stage-bottom{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:16px 18px 18px;background:linear-gradient(transparent,rgba(4,8,10,.8));font-size:12px;font-weight:700;color:#d5dfdf}.stage-nav{display:flex;gap:9px}.stage-nav button{width:47px;height:43px;background:rgba(25,34,39,.85);border:1px solid #a7b4ba;border-radius:12px;color:white;font-size:24px}.stage-nav button:active{background:#7b634e}.timeline{height:5px;background:#27343a;margin:12px 1px 0;border-radius:20px;overflow:hidden}.timeline>span{display:block;height:100%;background:var(--accent);width:0;transition:width .2s}.diagnostic{background:#20282c;border:1px solid #364248;border-radius:14px;display:flex;align-items:flex-start;justify-content:space-between;padding:12px;gap:10px;margin-top:14px}.diagnostic>div{min-width:0}.diag-title{display:block;color:var(--muted);font-size:10px;margin-bottom:4px}.diagnostic #heardText{font-size:12px;display:block;overflow-wrap:anywhere;line-height:1.4}.track-state{font-size:11px;color:#f0c5a7;flex-shrink:0}.control-panel{display:flex;flex-direction:column;gap:14px;padding-top:39px}.panel-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px}.panel-card h2{font-size:15px;margin:0 0 14px;letter-spacing:-.02em}.section-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.section-head h2{margin:0 0 14px}.soft-pill{font-size:11px;background:#2c3438;border-radius:30px;padding:5px 10px;color:#cad4d8}.mode-select{display:flex;gap:4px;background:#111719;border:1px solid #38454b;border-radius:13px;padding:4px}.mode-select button{flex:1;background:transparent;color:#c6d0d3;border:0;border-radius:9px;font-size:12px;font-weight:650;padding:11px 4px}.mode-select button.selected{background:#4b3a2d;color:#ffdab8}.mode-help{font-size:12px;min-height:50px;color:var(--muted);line-height:1.55;margin:14px 0}.primary-button,.record-button{display:block;width:100%;padding:14px 13px;border:0;border-radius:12px;font-size:14px;font-weight:800;background:var(--accent);color:#241a14}.primary-button:active{filter:brightness(.85)}.btn-row{display:flex;gap:9px;margin-top:10px}.btn-row>button{flex:1}.panel-copy{color:var(--muted);font-size:12px;line-height:1.6;margin:0 0 14px}.record-button{background:#d66461;color:#fff}.full-width{width:100%}.download-button{margin-top:10px;display:block;background:#295a42;text-decoration:none;border-radius:12px;text-align:center;color:#d3ffe7;padding:13px 8px;font-size:13px;font-weight:800}.hidden{display:none!important}.tiny{color:#95a1a7;font-size:11px;line-height:1.6;margin:12px 0 0}.range-label{display:flex;justify-content:space-between;margin:15px 0 9px;font-size:12px;color:#ccd4d7}.range-label output{color:var(--accent);font-size:11px}input[type=range]{accent-color:var(--accent);width:100%;cursor:pointer}.foot-note{font-size:11px;line-height:1.7;color:#88989d;max-width:870px;margin:28px auto 0}.foot-note strong{color:#bac5c8}.editor-dialog{color:var(--cream);background:#1a2328;border:1px solid #586268;border-radius:18px;padding:0;width:min(calc(100vw - 24px),750px);max-height:90dvh;box-shadow:0 20px 80px #000b}.editor-dialog::backdrop{background:#020506ca}.editor-dialog form{padding:20px}.editor-head{display:flex;justify-content:space-between;gap:10px;margin-bottom:12px}.editor-head strong{display:block}.editor-head small{display:block;color:var(--muted);font-size:12px;margin-top:4px}.icon-btn{background:transparent;border:1px solid #53616a;border-radius:9px;color:white;width:39px;height:39px}.editor-dialog textarea{resize:vertical;max-height:61dvh;min-height:250px;width:100%;line-height:1.65;font-size:14px;color:var(--cream);background:#12181c;border:1px solid #4a5b62;border-radius:12px;padding:14px}.editor-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:12px}.editor-actions button{width:auto}.toast{position:fixed;bottom:calc(20px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:10;background:#34454d;color:#fff;border:1px solid #86989e;border-radius:12px;padding:14px 17px;text-align:center;font-size:13px;max-width:calc(100vw - 30px);box-shadow:0 10px 30px #0008}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:850px){.workspace{display:flex;flex-direction:column;gap:14px}.prompter-column{width:100%;max-width:550px}.control-panel{width:100%;max-width:550px;margin:0 auto;padding-top:0}.intro{margin:8px auto 16px;max-width:550px}.intro h1{font-size:27px}.intro p{font-size:12px}.stage{height:min(65dvh,615px);min-height:390px}.app-header{height:66px}.status-indicator{display:none}}@media(max-width:420px){.main{padding:14px 12px 35px}.app-header{padding:0 13px}.small-button{padding:10px}.brand-mark{width:36px;height:36px}.intro h1{font-size:26px}.stage{min-height:390px}.active-line{line-height:1.24}.lines-window{top:8%}.panel-card{padding:15px}.editor-actions{flex-wrap:wrap}.editor-actions button{flex:1}}