:root{color-scheme:dark;--bg: #0b0d12;--surface: #141821;--surface-2: #1b2130;--border: #2b3344;--text: #eef2f8;--muted: #8b95a8;--accent: #7dd3c7;--record: #fb7185;--record-deep: #9f1239;--green: #4ade80}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(900px 420px at 8% -18%,rgba(251,113,133,.14),transparent),radial-gradient(700px 360px at 92% 0%,rgba(125,211,199,.1),transparent),var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5}.app{max-width:880px;margin:0 auto;padding:40px 20px 72px;display:flex;flex-direction:column;gap:18px}.header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}h1{margin:0;font-size:26px;letter-spacing:-.03em}h2{margin:0 0 8px;font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.subtitle{margin:6px 0 0;color:var(--muted);font-size:14px}.badges{display:flex;gap:8px}.badge{font-size:12px;padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--accent);white-space:nowrap}.badge-dim{color:var(--muted)}.card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:18px 20px}.stage{position:relative;overflow:hidden;border-radius:14px;background:#07080c;border:1px solid var(--border);aspect-ratio:16 / 9;display:grid;place-items:center}.stage video,.stage img.poster{width:100%;height:100%;object-fit:contain;background:#07080c}.stage-idle{text-align:center;color:var(--muted);padding:24px}.stage-idle strong{display:block;color:var(--text);font-size:18px;margin-bottom:6px}.countdown{position:absolute;inset:0;display:grid;place-items:center;background:#07080c8c;font-size:96px;font-weight:700;letter-spacing:-.06em}.rec-pill{position:absolute;top:14px;left:14px;display:flex;align-items:center;gap:8px;background:#07080cb8;border:1px solid var(--border);border-radius:999px;padding:6px 12px;font-variant-numeric:tabular-nums;font-size:13px}.rec-dot{width:8px;height:8px;border-radius:50%;background:var(--record);box-shadow:0 0 0 4px #fb718540;animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{50%{opacity:.45}}.controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}.label{display:block;font-size:13px;color:var(--muted);margin:0 0 8px}input[type=text]{width:100%;background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:10px 12px;font:inherit}input[type=text]:focus{outline:2px solid var(--accent);outline-offset:-1px}button,.file-label{font:inherit;cursor:pointer}.primary{background:var(--accent);color:#08201c;border:0;border-radius:10px;padding:10px 18px;font-weight:600}.primary:disabled{opacity:.5;cursor:wait}.record{background:var(--record);color:#3f0a14;border:0;border-radius:10px;padding:10px 18px;font-weight:700}.record:disabled{opacity:.5;cursor:wait}.stop{background:var(--surface-2);color:var(--text);border:1px solid var(--record);border-radius:10px;padding:10px 18px;font-weight:600}.ghost{background:transparent;color:var(--text);border:1px solid var(--border);border-radius:999px;padding:8px 14px;font-size:13px}.cam-toggle{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;-webkit-user-select:none;user-select:none}.hint,.error{font-size:13px;color:var(--muted)}.error{color:var(--record)}.share-box{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.share-box code{flex:1;min-width:180px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:10px 12px;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.progress{height:6px;background:var(--surface-2);border-radius:999px;overflow:hidden;margin-top:12px}.progress>span{display:block;height:100%;background:var(--accent);width:0%}.recent{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.recent a,.recent .empty{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;color:inherit;text-decoration:none;background:var(--surface-2)}.recent a:hover{border-color:var(--accent)}.meta{color:var(--muted);font-size:13px}.player{width:100%;border-radius:12px;background:#07080c;max-height:70vh}.back{color:var(--accent);text-decoration:none;font-size:14px}.back:hover{text-decoration:underline}.footer{color:var(--muted);font-size:13px}.footer a{color:var(--accent)}.hidden{display:none!important}@media(max-width:640px){h1{font-size:22px}.countdown{font-size:72px}}
