:root{--bay: #0b0b0c;--bg: #121214;--desk: #18181b;--surface: #1f1f23;--surface-2: #26262b;--hairline: rgba(255,255,255,.08);--hairline-strong: rgba(255,255,255,.18);--text: #ececee;--text-mute: #8f8f97;--timecode: #f2b866;--accent: #f2b866;--ok: #4cc38a;--err: #f26d6d;--mono: ui-monospace, SFMono-Regular, Menlo, monospace}*{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,system-ui,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button:disabled{opacity:.45;cursor:default}input{font:inherit;color:var(--text);background:var(--bay);border:1px solid var(--hairline);border-radius:6px;padding:9px 10px;width:100%;outline:none}input:focus{border-color:var(--hairline-strong)}b{font-weight:600}.screen{min-height:100%;display:flex;flex-direction:column}.screen.center{align-items:center;justify-content:center;padding:24px}.topbar{display:flex;align-items:center;gap:14px;height:44px;padding:0 16px;border-bottom:1px solid var(--hairline);background:var(--desk)}.wordmark{font-weight:700;letter-spacing:-.01em;font-size:16px}.wordmark.big{font-size:28px;margin-bottom:6px}.spacer{flex:1}.page{width:100%;max-width:760px;margin:0 auto;padding:8px 16px 40px}.mono{font-family:var(--mono);font-size:12px}.label{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute)}.dim{color:var(--text-mute)}.small{font-size:13px}.pad{padding:12px 0}.err{color:var(--err);margin:8px 0 0}.name{font-weight:600}.name.big{font-size:18px}.row{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--hairline);min-height:44px}.row.head{border-bottom-color:var(--hairline-strong)}.row.link:hover{background:var(--surface);margin:0 -8px;padding-left:8px;padding-right:8px;border-radius:6px}.row.form input{flex:1}.row.conn{align-items:flex-start}.col{display:flex;flex-direction:column;gap:4px}.chip{padding:5px 10px;border-radius:999px;border:1px solid var(--hairline-strong);font-size:13px;white-space:nowrap}.chip:hover{background:var(--surface)}.primary{background:var(--accent);color:#111;font-weight:600;padding:9px 14px;border-radius:6px}.card{background:var(--desk);border:1px solid var(--hairline);border-radius:10px;padding:18px;display:flex;flex-direction:column;gap:10px}.card.narrow{width:min(420px,100%)}.card.form{margin:10px 0}.card p{margin:0}.status{padding:1px 6px;border-radius:4px;background:var(--surface-2);color:var(--text-mute)}.status.connected{color:var(--ok)}.status.error{color:var(--err)}.caps{display:flex;flex-wrap:wrap;gap:6px 10px;margin-top:2px}.cap{color:var(--text-mute)}.cap.on{color:var(--timecode)}.choice{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:12px 14px;border:1px solid var(--hairline-strong);border-radius:8px;background:var(--surface)}.choice:hover{border-color:var(--accent)}.card .row{border-bottom:0;padding:0;min-height:0}.seg{display:inline-flex;border:1px solid var(--hairline-strong);border-radius:999px;padding:2px;gap:2px;align-self:flex-start}.seg button{padding:4px 10px;border-radius:999px;font-size:13px;color:var(--text-mute)}.seg button.on{background:var(--surface-2);color:var(--text)}.page.wide{max-width:1280px}select{font:inherit;color:var(--text);background:var(--bay);border:1px solid var(--hairline);border-radius:6px;padding:8px 10px;width:100%}.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.field{display:flex;flex-direction:column;gap:4px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;padding:12px 0}.tile{display:flex;flex-direction:column;gap:4px;text-align:left;padding:6px;border-radius:8px;border:1px solid transparent}.tile:hover{background:var(--surface)}.tile.on{border-color:var(--accent)}.thumb{aspect-ratio:1;background:var(--bay);border-radius:6px;overflow:hidden;display:grid;place-items:center}.thumb img{width:100%;height:100%;object-fit:contain}.cap{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sheet{position:sticky;bottom:0;background:var(--desk);border-top:1px solid var(--hairline-strong);padding:6px 16px 14px;margin:0 -16px;max-height:60vh;overflow:auto}.strip{display:flex;gap:10px;overflow-x:auto;padding:8px 0}.strip figure{margin:0;flex:0 0 auto;width:220px}.strip img{width:220px;height:220px;object-fit:contain;background:var(--bay);border-radius:6px}.strip figcaption{font-size:11px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gate{--pitch: #0B0A09;--gild-lo: #A9762E;--gild: #E8B45C;--gild-hi: #FFE9BC;--chalk: #EDE7DD;--dust: #9C9289;position:fixed;top:0;right:0;bottom:0;left:0;background:var(--pitch);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:28px 24px;text-align:center}.gate .seal{width:30px;height:30px;border-radius:8px;margin-bottom:26px;background:linear-gradient(142deg,var(--gild-hi),var(--gild) 46%,var(--gild-lo));box-shadow:0 6px 24px #e8b45c38,inset 0 1px #fff6}.gate .gate-mark{font-family:Bodoni Moda,Didot,Bodoni MT,Georgia,serif;font-weight:700;font-size:clamp(31px,6.4vw,58px);line-height:1;letter-spacing:-.021em;white-space:nowrap;margin:0 0 18px;background-image:linear-gradient(98deg,var(--gild-lo) 0%,var(--gild) 16%,var(--gild-hi) 27%,var(--gild) 38%,var(--gild-lo) 54%,var(--gild) 72%,var(--gild-hi) 84%,var(--gild-lo) 100%);background-size:280% 100%;background-position:18% 0;-webkit-background-clip:text;background-clip:text;color:transparent}.gate .gate-say{color:var(--chalk);font-size:16px;line-height:1.45;max-width:32ch;margin:0 0 30px}.gate .gate-in{font-weight:600;font-size:15px;color:var(--pitch);background:linear-gradient(168deg,var(--gild-hi),var(--gild) 58%,#D79F42);padding:13px 26px;border-radius:999px;box-shadow:0 8px 26px #e8b45c33;transition:filter .18s ease,box-shadow .18s ease}.gate .gate-in:hover{filter:brightness(1.07);box-shadow:0 10px 34px #e8b45c52}.gate .gate-in:active{transform:translateY(1px)}.gate .gate-back{margin-top:34px;font-size:12px;letter-spacing:.085em;text-transform:uppercase;color:var(--dust);border-bottom:1px solid transparent;transition:color .18s ease,border-color .18s ease}.gate .gate-back:hover{color:var(--chalk);border-bottom-color:#e8b45c80}.gate .err{color:#f2a0a0;margin:14px 0 0;font-size:14px}.gate :focus-visible{outline:2px solid var(--gild);outline-offset:3px;border-radius:6px}