:root{color-scheme:dark;--base:#14191f;--rail:#10151a;--card:#1c232b;--edge:#343f4b;--text:#f0f3f6;--muted:#a7b1be;--amber:#ffc05e;--green:#86d5a7;--danger:#ffaaa3;font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--base);color:var(--text)}[hidden]{display:none!important}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible{outline:2px solid var(--amber);outline-offset:3px}h1,h2,p{margin:0}p{color:var(--muted)}h1{font-size:clamp(2rem,4vw,3.1rem);line-height:1.12;letter-spacing:-.045em;margin:.3rem 0 .55rem}h2{font-size:1.35rem;letter-spacing:-.02em}
.brand{display:flex;align-items:center;gap:.8rem;line-height:1.2}.brand strong{display:block;letter-spacing:.11em}.brand small{color:var(--muted)}.mark{width:39px;height:32px;display:grid;place-items:center;border:2px solid var(--amber);border-radius:5px;color:var(--amber);font-size:1.5rem;position:relative}.mark:after{content:"";position:absolute;bottom:-7px;left:10px;right:10px;border-bottom:2px solid var(--amber)}
.login-shell{min-height:100dvh;display:grid;place-items:center;padding:1.2rem;background:radial-gradient(ellipse at 50% 20%,#293546 0%,var(--base) 61%)}.login-card{background:var(--card);border:1px solid var(--edge);border-radius:18px;padding:clamp(1.4rem,5vw,2.3rem);width:min(100%,450px)}.login-card h1{font-size:2rem;margin-top:1.8rem}.login-card form{display:grid;gap:1rem;margin-top:1.5rem}.login-card form p:empty{display:none}.login-card form p{color:var(--danger)}
.shell{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:100dvh}aside{background:var(--rail);border-right:1px solid var(--edge);padding:2rem 1.25rem;display:flex;flex-direction:column;gap:.75rem}.side-label{display:flex;align-items:center;justify-content:space-between;margin-top:2rem;padding-inline:.3rem}.side-label h2{font-size:.92rem}.side-label span{color:var(--muted);font-size:.8rem}nav{display:grid;gap:.35rem}.screen{border:1px solid transparent;background:transparent;color:var(--muted);text-align:left;border-radius:9px;padding:.65rem .7rem;display:flex;align-items:center;gap:.55rem;overflow-wrap:anywhere}.screen[aria-current=true]{color:var(--text);background:#292b2b;border-color:#6e542b}.dot{width:8px;height:8px;border-radius:50%;background:#7a8795;flex:none}.dot.online{background:var(--green)}.text-button{color:var(--muted);background:transparent;border:0;text-align:left;padding:.65rem .25rem;margin-top:auto}
main{padding:clamp(1rem,4vw,3.5rem);max-width:1500px;width:100%;margin:0 auto}header,.section-head{display:flex;justify-content:space-between;align-items:center;gap:1rem}header{margin-bottom:1.4rem}.eyebrow{color:var(--amber);font-size:.72rem;letter-spacing:.13em;font-weight:700}.workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.1rem;align-items:start}.card{background:var(--card);border:1px solid var(--edge);padding:1.25rem;border-radius:14px}.card p{font-size:.92rem;margin-top:.75rem}.section-head h2{margin-top:.2rem}.pill{background:#293440;color:var(--text);font-size:.76rem;border-radius:100px;padding:.25rem .55rem;white-space:nowrap}
button.primary,button.outline{border-radius:8px;padding:.58rem .8rem;font-size:.9rem;font-weight:700;min-height:40px}.primary{background:var(--amber);border:1px solid var(--amber);color:#241807}.primary:hover:not(:disabled){background:#ffd090}.outline{background:transparent;border:1px solid var(--edge);color:var(--text)}.outline:hover:not(:disabled){border-color:var(--amber)}.wide{width:100%;margin-top:1rem}
.rows{list-style:none;display:grid;gap:.55rem;padding:0;margin:1rem 0 0}.row{border:1px solid var(--edge);border-radius:9px;background:#192027;display:flex;align-items:center;gap:.6rem;padding:.65rem}.row-details{flex:1;min-width:0;overflow-wrap:anywhere}.row-details strong{display:block;font-size:.92rem}.row-details small,.empty{color:var(--muted);font-size:.82rem}.badge{font-size:.68rem;font-weight:700;letter-spacing:.04em;color:var(--amber);background:#302820;border-radius:5px;padding:.2rem .4rem;white-space:nowrap}.row-controls{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:.3rem}.row-controls button{min-width:30px;min-height:34px;background:#28323e;color:var(--text);border:1px solid var(--edge);border-radius:5px}.row-controls input{width:62px;padding:.25rem}.row-controls label{font-size:.72rem}.empty{padding:.8rem 0}.order{color:var(--muted);font-size:.8rem;align-self:flex-start;margin-top:.2rem}.notice-error{color:var(--danger)}#notice:not(:empty){padding:.7rem 0 1rem}
dialog{color:var(--text);background:var(--card);border:1px solid var(--edge);border-radius:14px;padding:1.4rem;width:min(calc(100% - 2rem),460px)}dialog::backdrop{background:#0009}dialog p{margin:.6rem 0 1rem}label{display:grid;gap:.35rem;font-size:.9rem;color:var(--muted)}input{width:100%;background:#11171d;color:var(--text);border:1px solid var(--edge);border-radius:7px;padding:.55rem .65rem}output{display:block;text-align:center;background:#10151a;color:var(--amber);font:bold 1.85rem/1.7 ui-monospace,monospace;letter-spacing:.16em;border-radius:8px;padding:.2rem}.dialog-buttons{margin-top:1rem;display:flex;justify-content:flex-end;gap:.55rem}
@media(max-width:1050px){.workspace{grid-template-columns:minmax(0,1fr)}}@media(max-width:640px){.shell{grid-template-columns:1fr}aside{border-right:0;border-bottom:1px solid var(--edge);padding:1rem}.side-label{margin-top:.55rem}nav{grid-template-columns:repeat(auto-fit,minmax(125px,1fr))}.text-button{margin:0}header{align-items:flex-start;flex-wrap:wrap}.card{padding:1rem}.row{flex-wrap:wrap}}
.screen-actions{display:flex;flex-wrap:wrap;gap:.5rem}header>div:first-child{min-width:0;overflow-wrap:anywhere}
.member-count{margin-left:auto;white-space:nowrap;color:var(--muted)}
fieldset{margin:1rem 0 0;padding:.6rem;border:1px solid var(--edge);border-radius:8px}
legend{color:var(--muted);padding:0 .35rem;font-size:.9rem}
.member-list{display:grid;gap:.4rem;max-height:14rem;overflow:auto}
.member{display:flex;align-items:center;gap:.55rem;padding:.25rem}
.member input{width:1rem;height:1rem;margin:0;accent-color:var(--amber)}
.thumbnail{position:relative;display:grid;place-items:center;width:72px;aspect-ratio:16/9;flex:none;overflow:hidden;padding:0;border:1px solid var(--edge);border-radius:6px;background:#11171d;color:var(--muted)}
.thumbnail img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#11171d}
.thumbnail:hover,.outline.file-menu:hover{border-color:var(--amber)}
.outline.file-menu{padding:.2rem .45rem;font-size:1.15rem}
.duration-hold{color:var(--amber)}
.outline.danger{color:var(--danger)}
.dialog-buttons{flex-wrap:wrap;align-items:center}
.preview-dialog{width:min(calc(100% - 2rem),920px)}
#preview-content{margin-top:1rem;display:grid;place-items:center;background:#0d1117;border-radius:8px;overflow:hidden}
#preview-content img,#preview-content video{display:block;max-width:100%;max-height:66vh;object-fit:contain}
#preview-content video{width:100%}
.studio{width:min(calc(100% - 2rem),1160px);max-height:calc(100dvh - 2rem);overflow:auto}
.studio-layout{display:grid;grid-template-columns:minmax(0,1fr) 245px;gap:1rem;margin-top:1rem;align-items:start}
.studio-stage,.studio-tools{display:grid;gap:.65rem}
.studio-pages,.studio-pair{display:flex;gap:.5rem;flex-wrap:wrap}
.studio-pair label{flex:1;min-width:4rem}
.studio-pages [aria-current=true]{border-color:var(--amber);color:var(--amber)}
.studio select,.studio textarea{width:100%;padding:.45rem .55rem;border:1px solid var(--edge);border-radius:7px;background:#11171d;color:var(--text);font:inherit}
.studio input[type=color]{padding:.15rem;height:35px;cursor:pointer}
#deck-canvas{width:100%;height:auto;display:block;aspect-ratio:16/9;border:1px solid var(--edge);border-radius:8px;touch-action:none;cursor:crosshair}
#deck-canvas:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
#deck-help,.studio-precise summary{color:var(--muted);font-size:.85rem}
.studio-precise summary{cursor:pointer}
.studio-precise[open] summary{margin-bottom:.55rem}
@media(max-width:720px){.studio-layout{grid-template-columns:1fr}.thumbnail{width:62px}}
.dot.connecting{background:#ffd066;box-shadow:0 0 7px #ffd06690}
.dot.offline{background:#ff6e79;box-shadow:0 0 7px #ff6e7980}
.dot.online{box-shadow:0 0 7px #86d5a780}
.notice-toggle{display:flex;align-items:center;justify-content:space-between;gap:.55rem}
.notices-dialog{width:min(calc(100% - 2rem),670px);max-height:85dvh;overflow:auto}
.notice-row{align-items:flex-start}
.notice-row p{margin:.14rem 0;color:var(--text);font-size:.9rem}
.notice-code{flex:none;color:var(--danger);background:#372530;border-radius:5px;padding:.2rem .38rem}
.row-controls input[type=checkbox]{width:auto;margin-inline-start:.4rem;accent-color:var(--amber);vertical-align:middle}