:root{--bg: #0b0c0f;--bg-raised: #14161c;--bg-hover: #1c1f28;--line: #2a2e38;--text: #e8e6df;--muted: #8b8f9a;--amber: #e6b84f;--amber-dim: #9a7530;--live: #3dcc8a;--danger: #e25b4c;--focus: #6ea8ff;--shadow: 0 24px 60px rgba(0, 0, 0, .45);--sans: "IBM Plex Sans", "Hiragino Sans", "Noto Sans JP", sans-serif;--mono: "IBM Plex Mono", "ui-monospace", monospace}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:var(--sans)}body{min-height:100dvh}a{color:inherit;text-decoration:none}button,input{font:inherit}.shell{min-height:100dvh;display:grid;grid-template-rows:auto 1fr}.topbar{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:baseline;gap:.7rem}.brand strong{letter-spacing:.08em;font-size:.95rem}.brand span{color:var(--muted);font-size:.8rem}.home{display:grid;place-items:center;padding:2rem 1.25rem 4rem}.home-inner{width:min(720px,100%)}.home h1{margin:0 0 .5rem;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:600;letter-spacing:-.03em}.lede{margin:0 0 2rem;color:var(--muted);line-height:1.6;max-width:40rem}.choices{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.choice{display:block;padding:1.4rem 1.3rem 1.3rem;background:var(--bg-raised);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);transition:border-color .15s ease,transform .15s ease}.choice:hover{border-color:var(--amber-dim);transform:translateY(-2px)}.choice h2{margin:0 0 .35rem;font-size:1.15rem}.choice p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.5}.page{display:grid;grid-template-columns:minmax(260px,340px) 1fr;min-height:0}.panel{padding:1.25rem;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:1.1rem;background:#101218}.stage{min-height:0;position:relative;background:#07080a;display:grid;place-items:center}.stage video{width:100%;height:100%;object-fit:contain;background:#000}.stage.viewer video{position:absolute;inset:0}.fs-toggle{position:absolute;right:1rem;bottom:1rem;z-index:2;appearance:none;border:1px solid var(--line);background:#0c0e12d1;color:var(--text);border-radius:10px;padding:.55rem .8rem;cursor:pointer}.fs-toggle:hover{background:#1c1f28f2}.stage.viewer:fullscreen,.stage.viewer:-webkit-full-screen{width:100vw;height:100vh;background:#000}.stage.viewer:fullscreen video,.stage.viewer:-webkit-full-screen video{object-fit:contain}.stage.viewer:fullscreen .placeholder,.stage.viewer:-webkit-full-screen .placeholder{display:none}.placeholder{color:var(--muted);text-align:center;padding:2rem}.token{font-family:var(--mono);font-size:clamp(2rem,4vw,2.8rem);letter-spacing:.22em;color:var(--amber);margin:.15rem 0 .6rem}.row{display:flex;gap:.6rem;flex-wrap:wrap}.btn{appearance:none;border:1px solid var(--line);background:var(--bg-raised);color:var(--text);border-radius:10px;padding:.7rem .95rem;cursor:pointer}.btn:hover{background:var(--bg-hover)}.btn-primary{background:var(--amber);color:#1a1406;border-color:#d4a63a;font-weight:600}.btn-primary:hover{background:#f0c66a}.btn-ghost{background:transparent}.btn-danger{border-color:#5a2c28;color:#ffb0a8}.btn:disabled{opacity:.45;cursor:not-allowed}.stack{display:grid;gap:.7rem}.status{display:flex;align-items:center;gap:.5rem;color:var(--muted);font-size:.92rem}.dot{width:.55rem;height:.55rem;border-radius:50%;background:var(--muted)}.dot.wait{background:var(--amber)}.dot.live{background:var(--live)}.dot.err{background:var(--danger)}.hint{color:var(--muted);font-size:.85rem;line-height:1.5;margin:0}label{display:grid;gap:.4rem;font-size:.85rem;color:var(--muted)}input[type=text]{background:#0b0d12;border:1px solid var(--line);color:var(--text);border-radius:10px;padding:.85rem .9rem;font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;font-size:1.15rem}input:focus,button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.banner{position:absolute;inset:auto 1rem 1rem;background:#14100ceb;border:1px solid var(--amber-dim);color:var(--text);padding:.85rem 1rem;border-radius:12px;display:none}.banner.show{display:block}.stats{font-family:var(--mono);font-size:.8rem;color:var(--muted)}@media(max-width:840px){.page{grid-template-columns:1fr;grid-template-rows:auto 1fr}.panel{border-right:0;border-bottom:1px solid var(--line)}.choices{grid-template-columns:1fr}.stage{min-height:52dvh}}