:root{--bg: #111214;--card: #1b1d21;--card-2: #24272c;--line: #333;--text: #e8e8ea;--muted: #9aa0a6;--accent: #3b82f6;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:15px/1.4 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.app{max-width:720px;margin:0 auto;height:100%;display:flex;flex-direction:column}.app-head{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px calc(12px + env(safe-area-inset-bottom,0));background:var(--bg);border-bottom:1px solid var(--line)}.app-title h1{font-size:18px;margin:0}.recorder{color:var(--muted);font-size:12px}.app-head-right{display:flex;align-items:center;gap:8px}.whoami{background:var(--card-2);color:var(--text);border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:13px;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.splash{display:grid;place-items:center;height:100%;color:var(--muted)}.namepicker{display:grid;place-items:center;height:100%;padding:20px}.namepicker-card{width:100%;max-width:360px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:12px}.namepicker-card h1{margin:0;font-size:20px}.namepicker-card p{margin:0;color:var(--muted);font-size:14px}.namepicker-card input{background:var(--card-2);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:12px;font-size:16px}.namepicker-card button{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:12px;font-size:15px;font-weight:600;cursor:pointer}.namepicker-card button:disabled{opacity:.5;cursor:default}.by{color:var(--muted);font-size:11px}.scene-status{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.lav-by{grid-column:1 / -1}.day-select,.picker select{background:var(--card-2);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:14px}.banner{margin:8px 14px;color:var(--muted)}.banner.error{color:#f87171}.scene-pager{flex:1;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain}.scene-pager::-webkit-scrollbar{display:none}.scene-panel{flex:0 0 100%;width:100%;scroll-snap-align:center;scroll-snap-stop:always;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px 14px 20px}.pager-indicator{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0));border-top:1px solid var(--line);background:var(--bg)}.pager-dots{display:flex;gap:5px;flex-wrap:wrap;justify-content:center}.pager-dot{width:6px;height:6px;border-radius:50%;background:var(--line);transition:background .15s}.pager-dot.active{background:var(--accent)}.pager-count{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}.scene-card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:12px}.scene-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}.scene-title{display:flex;flex-direction:column;gap:2px;min-width:0}.scene-num{font-weight:700;font-size:16px;display:flex;align-items:center;gap:8px}.scene-heading{color:var(--muted);font-size:13px}.nd-badge{font-size:10px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);background:var(--card-2);border:1px solid var(--line);border-radius:999px;padding:2px 8px}.no-lavs{margin:0;color:var(--muted);font-size:13px;font-style:italic}.lav-list{display:flex;flex-direction:column;gap:8px}.lav-row{display:grid;grid-template-columns:28px 1fr auto auto auto;align-items:center;gap:8px;background:var(--card-2);border-radius:8px;padding:8px}.lav-num{display:inline-grid;place-items:center;width:26px;height:26px;background:#000;border:1px solid var(--line);border-radius:6px;font-weight:700;font-size:13px}.lav-char{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lav-fader{color:var(--muted);font-size:12px;white-space:nowrap}.picker{display:inline-flex;align-items:center;gap:6px}.picker-dot{width:10px;height:10px;border-radius:50%;flex:none}@media (max-width: 480px){.lav-row{grid-template-columns:24px 1fr auto;row-gap:8px}.lav-row .picker{grid-column:span 3;justify-content:space-between}.lav-row .picker select{flex:1}}
