/* Stage Game · light glass interface. Shared with the visual language of hub.html.
   Selectors address interface surfaces, not canvas, video, team colors or game worlds. */
@font-face{font-family:'SG Century';src:url('/brand/fonts/sg-century-regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'SG Century';src:url('/brand/fonts/sg-century-bold.woff2') format('woff2');font-weight:600 900;font-style:normal;font-display:swap}
@font-face{font-family:'SG Bounded';src:url('/brand/fonts/sg-bounded-regular.woff2') format('woff2');font-weight:400 600;font-style:normal;font-display:swap}
@font-face{font-family:'SG Bounded';src:url('/brand/fonts/sg-bounded-bold.woff2') format('woff2');font-weight:700 900;font-style:normal;font-display:swap}
html[data-sg-theme="glass"]{
 --sg-ink:#15354e;--sg-muted:#536b7d;--sg-blue:#0875b9;--sg-lime:#ceff00;
 --sg-paper:#f4f8fc;--sg-edge:rgba(255,255,255,.94);--sg-line:#d3e0e9;
 --sg-glass:linear-gradient(145deg,rgba(255,255,255,.92),rgba(238,247,255,.72));
 --sg-shadow:inset 0 1px 0 #fff,0 4px 8px #234d6c04,0 16px 42px #234d6c0a;
 --sg-focus:0 0 0 4px #0875b91a;--sg-body:'SG Century',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
 --sg-heading:'SG Bounded','SG Century',sans-serif;
}
body[data-sg-view]:not([data-sg-view="print"]){font-family:var(--sg-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"],[data-sg-view="lobby"],[data-sg-view="guest"],[data-sg-view="host"]){
 --bg:var(--sg-paper);--panel:rgba(255,255,255,.82);--line:var(--sg-line);--tx:var(--sg-ink);--dim:var(--sg-muted);
 --acc:var(--sg-blue);--acc2:#e8f4ff;--go:var(--sg-lime);--err:#bd303f;--ok:#197149;
 color:var(--sg-ink);background:radial-gradient(ellipse at 1% 0%,#ddf2b880,transparent 45%),radial-gradient(ellipse at 96% 5%,#c4e5ff9c,transparent 47%),linear-gradient(150deg,#f8fbff,#f0f7fc 65%,#eaf4fa);background-attachment:fixed;
}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"],[data-sg-view="lobby"]){isolation:isolate}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"])::before{background:radial-gradient(ellipse at 1% 3%,#ddf2b887,transparent 45%),radial-gradient(ellipse at 100% 5%,#bde2ff87,transparent 46%),linear-gradient(145deg,#f7fbff,#eff7fc);pointer-events:none}
body[data-sg-view] :is(button,input,select,textarea){font-family:var(--sg-body)}
body[data-sg-view] :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #0875b9;outline-offset:3px}
body[data-sg-view] :is(button,a){-webkit-tap-highlight-color:transparent;touch-action:manipulation}
body[data-sg-view] :is(button,a){transition:background-color .18s,border-color .18s,box-shadow .18s,color .18s,opacity .18s}
body[data-sg-view] button:disabled{cursor:default}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"],[data-sg-view="lobby"],[data-sg-view="guest"]) h1{font-family:var(--sg-heading);font-weight:400;letter-spacing:-.055em;line-height:1.22;overflow-wrap:anywhere}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"]) h1{font-size:clamp(26px,3vw,38px);margin-bottom:12px;color:var(--sg-ink)}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"]) :is(h2,h3){color:var(--sg-ink)}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"]) .lead{color:var(--sg-muted);font-size:16px;line-height:1.65}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"],[data-sg-view="lobby"],[data-sg-view="guest"]) :is(.brand,.sg-brand){color:var(--sg-ink);background:none;-webkit-text-fill-color:currentColor;letter-spacing:.06em}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"],[data-sg-view="lobby"],[data-sg-view="guest"]) :is(.brand,.sg-brand) :is(svg,g,path){fill:currentColor!important}
/* Navigation, shared across the account, events, hall setup and remote control. */
body:is([data-sg-view="work"],[data-sg-view="hall"]) :is(.top,.sg-shell){gap:18px;margin-bottom:28px}
body[data-sg-view] :is(.nav,.sg-nav){border:1px solid #ffffffdf;border-radius:99px;padding:6px;background:var(--sg-glass);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--sg-shadow)}
body[data-sg-view] :is(.nav,.sg-nav)>a{min-height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:99px;padding:10px 16px;color:var(--sg-muted);font-size:13px;font-weight:700}
body[data-sg-view] :is(.nav,.sg-nav)>a.on{background:var(--sg-lime);color:#20351c;box-shadow:inset 0 1px 1px #fff9,0 4px 14px #8ea92424}
body[data-sg-view] :is(.nav,.sg-nav)>a:hover:not(.on){color:var(--sg-ink);background:#ffffffb3}
body[data-sg-view] .sg-control{border-radius:99px;background:#e5f2fc99;border-color:#d3e4ef;padding:3px;margin-left:4px}
body[data-sg-view] .sg-control>a{min-height:40px;border-radius:99px;font-family:var(--sg-body);font-size:12px;color:var(--sg-muted)}
body[data-sg-view] .sg-control>a.on{color:#155582;background:#d2eafb;box-shadow:inset 0 1px 0 #fff}
body[data-sg-view] .sg-control-label{font-size:9px;color:#586d7e}
body[data-sg-view] :is(.who,.sg-who){font-family:var(--sg-body);gap:8px}
body[data-sg-view] :is(.who b,.sg-who .nm){min-width:0;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body[data-sg-view] :is(.who,.sg-who) :is(button,a){min-height:40px;border:1px solid #d6e2ec;border-radius:99px;background:#ffffff70;display:inline-flex;align-items:center;padding:8px 13px}
body[data-sg-view] .sg-pop{font-family:var(--sg-body);background:#f9fcfffa;border-color:#fff;border-radius:22px;box-shadow:0 20px 60px #163c612b;color:var(--sg-ink)}
/* Working surfaces. Solid enough for long text, with glass in headers/overlays. */
body[data-sg-view="work"] :is(.card,.sec,.ev,.empty,.lobbyc,.accend,.fempty,.game,.balance-card,.client-card){border-radius:24px;border-color:#ffffffde;background:var(--sg-glass);box-shadow:var(--sg-shadow)}
body[data-sg-view="work"] .glass{background:var(--sg-glass)!important;border-color:#ffffffde!important;box-shadow:var(--sg-shadow)!important;-webkit-backdrop-filter:blur(18px) saturate(120%);backdrop-filter:blur(18px) saturate(120%)}
body[data-sg-view="work"] :is(.sec,.empty){padding:22px}
body[data-sg-view="work"] :is(.sugg,.cmenu,.menu){background:#f9fcfffa;border-color:#fff;border-radius:20px;box-shadow:0 18px 44px #1d4b7026}
body[data-sg-view="work"] :is(.savebar,.sheet){font-family:var(--sg-body)}
body[data-sg-view="work"] .savebar{background:#f9fcfff2;border-color:#fff;box-shadow:0 -8px 34px #204b6812;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
body[data-sg-view="work"] :is(.sbox,.finder input){border-radius:99px}
body[data-sg-view="work"] .sbox{background:#ffffffd9;border-color:#fff;box-shadow:var(--sg-shadow);min-height:52px}
body[data-sg-view="work"] .sbox .sfield input{background:transparent;box-shadow:none;border:0;padding-inline:0;min-height:50px}
body[data-sg-view="work"] .sfield :is(input,.ghost){font-family:var(--sg-body)}
body[data-sg-view="work"] :is(.badge,.topn,.soonb,.newb){border-radius:99px;padding:4px 10px;letter-spacing:.035em}
body[data-sg-view="work"] .ev.live{background:linear-gradient(140deg,#1c527c,#15354e);color:#fff;border-color:#1c527c}
body[data-sg-view="work"] .ev.live h3{color:#fff}
body[data-sg-view="work"] .ev.live :is(.d,.g){color:#d7e9f8}
/* Buttons and fields only in the interface, never in the game canvas/HUD. */
body:is([data-sg-view="work"],[data-sg-view="auth"]) :is(.go,.go2,.primary,.btn-primary):not(.alt):not(.lt):not(.ghost),
body[data-sg-view="host"] :is(.side,.gk-drawer) :is(.go,.go2):not(.alt):not(.lt){
 background:linear-gradient(130deg,#ddff66,#ceff00 80%);color:#20351c;border:1px solid #bde13d;border-radius:99px;box-shadow:inset 0 1px 1px #ffffffd9,0 7px 18px #9bc62d20;font-family:var(--sg-body);font-weight:700;min-height:44px;padding:11px 18px;text-decoration:none;
}
body:is([data-sg-view="work"],[data-sg-view="auth"]) :is(.go,.go2):is(.alt,.lt),
body[data-sg-view="host"] :is(.side,.gk-drawer) :is(.go.alt,.go.lt,.ghost,.ghostb){background:#ffffffb8;color:var(--sg-ink);border:1px solid #d4e1eb;border-radius:99px;box-shadow:inset 0 1px 0 #fff;min-height:44px;font-weight:600}
body:is([data-sg-view="work"],[data-sg-view="auth"]) :is(.ghost,.ghostb,.go2.lt,.btn-secondary){border-radius:99px;min-height:40px;background:#ffffffa6;color:var(--sg-ink);border-color:#d1e0eb}
body[data-sg-view] :is(.go,.go2):disabled{opacity:.48;box-shadow:none;filter:saturate(.65)}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="lobby"],[data-sg-view="guest"]) :is(input:not([type]),input[type="text"],input[type="password"],input[type="email"],input[type="tel"],input[type="search"],input[type="number"],input[type="date"],input[type="datetime-local"],select,textarea),
body[data-sg-view="host"] :is(.side,.gk-drawer) :is(input[type="text"],input[type="number"],select,textarea){
 background:#ffffffc7;border:1px solid #c8dce9;border-radius:14px;color:var(--sg-ink);font-family:var(--sg-body);font-size:15px;line-height:1.45;min-height:44px;padding:11px 13px;box-shadow:inset 0 1px 2px #25506a05;max-width:100%;
}
body[data-sg-view] input::placeholder,body[data-sg-view] textarea::placeholder{color:#667b8a;opacity:1}
body[data-sg-view] :is(input,select,textarea):focus-visible{border-color:var(--sg-blue);box-shadow:var(--sg-focus)}
body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="host"],[data-sg-view="lobby"]) input:is([type="checkbox"],[type="radio"]){accent-color:#0875b9}
/* Account catalogue, its category rail and the permanent guest QR. */
body[data-sg-page="account"] .wrap{padding-top:30px}
body[data-sg-page="account"] .top{margin-bottom:30px}
body[data-sg-page="account"] .snav{border-radius:26px;padding:10px}
body[data-sg-page="account"] .snav a{min-height:46px;border-radius:16px;padding:9px 10px;font-size:13px;gap:10px}
body[data-sg-page="account"] .snav a.on{background:#dff3ff;color:#15354e;box-shadow:inset 0 1px 0 #fff}
body[data-sg-page="account"] .snav a.on :is(small,.si){color:#196190}
body[data-sg-page="account"] .snav .sh{font-size:10px;letter-spacing:.11em;padding-block:14px 8px;color:#526d80}
body[data-sg-page="account"] :is(.fhead h2,.group .fhead h2){font-family:var(--sg-heading);font-size:20px;font-weight:400;letter-spacing:-.045em;line-height:1.3}
body[data-sg-page="account"] .frow{gap:16px;padding-block:4px 18px}
body[data-sg-page="account"] .frow .card{flex-basis:290px;padding:20px;gap:12px;transition:transform .2s,box-shadow .2s,border-color .2s}
body[data-sg-page="account"] .card h3{font-size:18px;line-height:1.3;letter-spacing:-.025em;color:var(--sg-ink)}
body[data-sg-page="account"] .card p{font-size:13px;line-height:1.6;color:var(--sg-muted)}
body[data-sg-page="account"] .card:not(.soon):hover{border-color:#b9d9ec;box-shadow:inset 0 1px 0 #fff,0 18px 40px #21537714;transform:translateY(-3px)}
body[data-sg-page="account"] #top .card{background:linear-gradient(145deg,#f8ffdc,#e8f9b5);border-color:#edfacb;box-shadow:var(--sg-shadow)}
body[data-sg-page="account"] #top .card p{color:#4e6536}
body[data-sg-page="account"] .lobbyc{border-radius:28px;background:linear-gradient(125deg,#ffffffed,#e9f4ffcc)!important}
body[data-sg-page="account"] .lobbyc .lq{background:#fff;border-radius:20px;border:1px solid #d8e5ef;box-shadow:0 8px 20px #204b6f08}
body[data-sg-page="account"] .lobbyc .ll :is(a,button){border-radius:99px;background:#ffffffb8;border-color:#c8dce9;color:#245b7e}
body[data-sg-page="account"] :is(.tseg,.accbar){border-radius:99px}
body[data-sg-page="account"] .accbar.warn{border-radius:20px}
body[data-sg-page="account"] .tseg button{border-radius:99px;min-height:36px}
body[data-sg-page="account"] .tseg button.on{background:#d9eeff;color:#1b4c71}
/* Game host: quiet glass controls, immersive stage retained. */
body[data-sg-view="host"]:not(.full)>.wrap{padding:14px;gap:14px;height:100dvh}
body[data-sg-view="host"] .side{border:1px solid #ffffffed;border-radius:26px;background:var(--sg-glass);box-shadow:var(--sg-shadow);padding:22px 18px;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);scrollbar-width:thin;scrollbar-color:#b6cddb transparent}
body[data-sg-view="host"]:not(.full)>.wrap>.stage{border:1px solid #ffffffbf;border-radius:26px;box-shadow:0 16px 44px #1436531a}
body[data-sg-view="host"] .side h1{font-family:var(--sg-heading);font-size:21px;font-weight:400;letter-spacing:-.05em;line-height:1.3;overflow-wrap:anywhere;color:var(--sg-ink)}
body[data-sg-view="host"] .side h3{color:var(--sg-muted);font-size:12px;font-weight:700;letter-spacing:.08em;margin-block:22px 9px}
body[data-sg-view="host"] .gk-top{gap:7px;margin-bottom:16px}
body[data-sg-view="host"] .gk-top h1{min-width:0}
body[data-sg-view="host"] .sg-gback{margin-bottom:22px}
body[data-sg-view="host"] .sg-gback a.sg-gbk{font-family:var(--sg-body)!important;min-height:40px;padding-inline:13px!important;background:#ffffffa6;color:var(--sg-muted)!important;border-color:#d4e2eb}
body[data-sg-view="host"] :is(.gk-q,.gk-x){border-radius:50%;height:42px;width:42px;min-width:42px;flex-shrink:0;background:#ffffffb8;border:1px solid #d2e1eb;color:#225572;box-shadow:inset 0 1px 0 #fff;font-family:var(--sg-body)}
body[data-sg-view="host"] .gk-q.gk-gear{background:#e7f3ff;border-color:#c9e2f2}
body[data-sg-view="host"] :is(.joy,.gk-remote,.memo,.gk-help){background:#ffffffb3;border:1px solid #d7e6ef;border-radius:20px;box-shadow:inset 0 1px 0 #fff;color:var(--sg-ink)}
body[data-sg-view="host"] .qrbox{background:#fff;border:1px solid #d6e4ec;border-radius:14px;box-shadow:0 4px 14px #234c6b08}
body[data-sg-view="host"] :is(.seg,.switch,.tabs){background:#dfedf6;border-radius:99px;padding:4px;border-color:#d1e1ec}
body[data-sg-view="host"] :is(.seg,.switch,.tabs) button{min-height:38px;border-radius:99px;font-size:12px;padding:8px 12px}
body[data-sg-view="host"] :is(.seg,.switch,.tabs) button.on{color:#15466c;background:#fff;box-shadow:0 2px 7px #1b456916}
body[data-sg-view="host"] :is(.people .person,.pstate,.micstate,.tm){border-radius:14px}
body[data-sg-view="host"] .person.on{background:#e3f3ff;border-color:#acd1eb}
body[data-sg-view="host"] .side :is(.hint,.dim,.joyr){line-height:1.65;color:var(--sg-muted)}
body[data-sg-view="host"] .side .host-tools{gap:8px}
body[data-sg-view="host"] .side .finish{border-color:#edbdc4;color:#aa2438;background:#fff3f4}
body[data-sg-view="host"] .gk-drawer{background:linear-gradient(160deg,#fbfdff,#eff7fd);color:var(--sg-ink);border-left:1px solid #fff;box-shadow:-20px 0 70px #0d2e4f2b;font-family:var(--sg-body)}
body[data-sg-view="host"] .gk-head{background:#ffffffa8;border-color:#dce8f1;padding:20px}
body[data-sg-view="host"] .gk-head>b{font-family:var(--sg-heading);font-size:21px;font-weight:400;letter-spacing:-.045em;color:var(--sg-ink)}
body[data-sg-view="host"] .gk-foot{background:#ffffffc4;border-color:#dce8f1;padding:16px 20px}
body[data-sg-view="host"] .gk-back{background:#15354e61;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
body[data-sg-view="host"] .gk-drawer :is(.gcard,.item,.box,.two .tm){border-radius:18px;border-color:#d2e3ef;background:#ffffffc7}
body[data-sg-view="host"] .gk-drawer .gcard.on{border-color:#5898c2;box-shadow:0 0 0 3px #80bcec26}
body[data-sg-view="host"] .lbh{font-family:var(--sg-body);background:linear-gradient(130deg,#faffed,#f1f8e5);border-color:#dce9bd;border-radius:20px;padding:13px;color:var(--sg-ink)}
body[data-sg-view="host"] .lbh-call{border-radius:99px;min-height:44px;font-family:var(--sg-body);font-size:13px;background:linear-gradient(135deg,#e0ff69,#ceff00);color:#20351c;box-shadow:inset 0 1px 0 #fff8}
body[data-sg-view="host"] .lbh-call.here{background:#e5f4eb;color:#1b6843}
body[data-sg-view="host"] .lbh :is(.lbh-st,.lbh-dn){color:#536b7d;line-height:1.65}
body[data-sg-view="host"] .lbh-back{background:#15354e61;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
body[data-sg-view="host"] .lbh-pan{background:linear-gradient(150deg,#fff,#edf7ff);color:var(--sg-ink);font-family:var(--sg-body);border:1px solid #fff;border-radius:28px;box-shadow:0 28px 90px #15354e3d}
body[data-sg-view="host"] .lbh-h>b{font-family:var(--sg-heading);font-size:22px;font-weight:400;letter-spacing:-.045em}
body[data-sg-view="host"] .lbh :is(.lbh-cnt,.lbh-dl button){font-family:var(--sg-body)}
body[data-sg-view="host"] .lbh-btn{border-radius:99px;min-height:44px;display:flex;align-items:center;justify-content:center;background:#ffffffba;border-color:#ccdfec;color:var(--sg-ink)}
body[data-sg-view="host"] .lbh-btn.warn{color:#ad2c41;background:#fff4f5;border-color:#e8bfc7}
body[data-sg-view="host"] .lbh-x{border-radius:50%;width:40px;height:40px;color:#385b75;background:#e8f2f9}
body[data-sg-view="host"] .lbh-in{border-radius:14px;min-height:44px;border-color:#ccdfec;background:#fff;font-family:var(--sg-body)}
body[data-sg-view="host"] .lbh-ask{font-family:var(--sg-body);border-radius:22px;background:#15354e;box-shadow:0 14px 45px #15354e40}
body[data-sg-view="host"] .lbh-ask button{border-radius:99px;min-height:40px}
body[data-sg-view="host"] .sgbg-pan{background:linear-gradient(150deg,#fff,#f0f8ff);border:1px solid #fff;border-radius:28px;color:var(--sg-ink);font-family:var(--sg-body);box-shadow:0 28px 80px #15354e30}
body[data-sg-view="host"] .sgbg-ph{border-color:#d7e7f0}
body[data-sg-view="host"] .sgbg-x{border-radius:50%;min-height:40px;min-width:40px;background:#e9f3fb;color:#335875}
body[data-sg-view="host"] .footbar{font-family:var(--sg-body);border-radius:99px}
body[data-sg-view="host"].full>.wrap{padding:0;gap:0}
body[data-sg-view="host"].full .stage,body[data-sg-view="host"] .stage:fullscreen{border:0!important;border-radius:0!important;box-shadow:none!important}
html:fullscreen body[data-sg-view="host"]:not(:has(.side:not([hidden])))>.wrap{padding:0;gap:0}
/* Modal content is readable on top of either a light dashboard or a dark game. */
body[data-sg-view] :is(.sgm,.terms){background:#15354e61;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
body[data-sg-view] :is(.sgm .mc,.terms .card2,.pk .pkbox){border:1px solid #fff;border-radius:28px;background:linear-gradient(150deg,#fff,#f0f7fd);box-shadow:0 28px 90px #15354e3d;color:var(--sg-ink);font-family:var(--sg-body)}
body[data-sg-view] :is(.sgm .mc,.terms .card2) h2{font-family:var(--sg-heading);font-size:23px;font-weight:400;line-height:1.3;letter-spacing:-.045em}
body[data-sg-view] :is(.sgm .mc,.terms .card2) :is(p,label){line-height:1.7}
body[data-sg-view] :is(.sgm .x,.pk .x){border-radius:50%;min-height:40px;min-width:40px;background:#eaf2f8;color:#38586f}
body[data-sg-view="work"] .buymsg{border-radius:18px;background:#eaf4fb;border-color:#d0e1ed;line-height:1.65}
body[data-sg-view] .sg-tutorial{font-family:var(--sg-body);border-radius:20px;box-shadow:inset 0 1px 0 #fff}
body[data-sg-view] .sg-tutorial-dialog{background:#f7fbff;border:1px solid #fff;border-radius:28px;color:var(--sg-ink);font-family:var(--sg-body);box-shadow:0 28px 90px #15354e40}
body[data-sg-view] .sg-tutorial-head{background:#f7fbff;color:var(--sg-ink)}
body[data-sg-view] .sg-tutorial-head h2{font-family:var(--sg-body);color:var(--sg-ink);font-weight:700}
body[data-sg-view] .sg-tutorial-close{border-radius:50%;min-width:40px;min-height:40px;background:#e6f2fa;color:#335875}
/* Sign-in and registration. */
body[data-sg-view="auth"]{font-size:15px;padding:clamp(20px,5vw,48px) 18px;min-height:100dvh}
body[data-sg-view="auth"]>.card{max-width:470px;width:100%;padding:38px;border-radius:32px;background:var(--sg-glass);border:1px solid #fff;box-shadow:inset 0 1px 0 #fff,0 24px 80px #244e6d12;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
body[data-sg-page="signup"]>.card{max-width:630px}
body[data-sg-view="auth"] .brand{display:inline-flex;margin-bottom:22px}
body[data-sg-view="auth"] h1{font-size:30px;margin-top:0;margin-bottom:24px}
body[data-sg-view="auth"] label{font-size:13px;color:var(--sg-muted);line-height:1.5}
body[data-sg-view="auth"] :is(.field,.row){margin-bottom:16px}
body[data-sg-view="auth"] :is(input[type="text"],input[type="email"],input[type="password"],input[type="tel"]){font-size:16px;min-height:50px;padding:13px 15px;border-radius:16px}
body[data-sg-view="auth"] input[type="password"]{padding-right:48px}
body[data-sg-view="auth"] .go{min-height:50px}
body[data-sg-view="auth"] .hint{color:var(--sg-muted);font-size:12px;line-height:1.8;margin-top:24px}
body[data-sg-view="auth"] .chk{padding-block:5px;font-size:13px;gap:10px}
body[data-sg-view="auth"] .chk input{flex-shrink:0;width:20px;height:20px;margin-top:2px}
/* Editors, event plans and commercial pages. */
body[data-sg-page="event"] :is(.evhead,.card,.program,.evsum){border-radius:24px}
body[data-sg-page="event"] .pk{background:#15354e61;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
body[data-sg-page="event"] .pk-in{border-radius:28px;background:#f7fbff;color:var(--sg-ink);border-color:#fff;box-shadow:0 28px 80px #15354e33}
body[data-sg-page="event"] .pk-x{border-radius:50%;min-height:40px;min-width:40px;background:#e8f2f9;color:#385b75}
body[data-sg-view="work"] .btn{font-family:var(--sg-body);border-radius:99px;min-height:44px}
body[data-sg-page="song_edit"] label.rights{display:block;position:relative;padding-left:30px;line-height:1.65}
body[data-sg-page="song_edit"] label.rights>input{position:absolute;left:0;top:3px;margin:0;width:18px;height:18px}
body[data-sg-page="song_edit"] label.rights>a{display:inline}
body[data-sg-page="event"] .pk .bar{background:#ffffffc9;border-color:#d9e7f1}
body[data-sg-page="event"] :is(.step,.pg,.sitem,.item){border-radius:18px}
body[data-sg-page="section"] .card{padding:24px;gap:14px}
body[data-sg-page="section"] .card h2{font-family:var(--sg-heading);font-size:23px;font-weight:400;letter-spacing:-.04em;line-height:1.3}
body[data-sg-page="section"] .card p{line-height:1.65;color:var(--sg-muted)}
body[data-sg-page="remote"] .game{padding:20px 22px;border-radius:24px}
body[data-sg-page="remote"] .game .go{color:var(--sg-blue);font-family:var(--sg-body)}
body[data-sg-page="remote"] .sheet{background:#f4f9fd;color:var(--sg-ink)}
body[data-sg-page="remote"] .sheet .bar{background:#ffffffd9;border-color:#d5e4ef}
body[data-sg-page="remote"] .remote-tools a{min-height:44px;display:inline-flex;align-items:center;border-radius:99px}
body[data-sg-page="tariffs"] .tar{border-radius:28px;background:var(--sg-glass);border-color:#fff;box-shadow:var(--sg-shadow);padding:26px}
body[data-sg-page="tariffs"] .tar.hot{background:linear-gradient(155deg,#f8ffde,#edfac5);border-color:#d3e99e}
body[data-sg-page="tariffs"] .tar h3{font-family:var(--sg-heading);font-size:25px;font-weight:400;letter-spacing:-.04em}
body[data-sg-page="tariffs"] .help{background:var(--sg-glass);border-color:#fff;border-radius:24px}
body[data-sg-page="admin"] .side{border-radius:26px}
body[data-sg-page="admin"] .side a.on{color:var(--sg-ink);background:#dff2ff}
body[data-sg-page="admin"] .tile.hi{background:linear-gradient(145deg,#f7ffdd,#e6f7b5);border-color:#e2efc3}
body[data-sg-page="admin"] :is(.tile .v,.money .v){font-family:var(--sg-heading);font-weight:400;font-size:30px;letter-spacing:-.05em}
/* Hall setup is light; when it becomes the hall screen it keeps its scene. */
body[data-sg-view="hall"].sg-config{--tx:var(--sg-ink);--dim:var(--sg-muted);--line:var(--sg-line);--acc:var(--sg-blue);background:radial-gradient(ellipse at 0 0,#e3f5bd,transparent 50%),radial-gradient(ellipse at 100% 0,#cde9ff,transparent 65%),#f4f8fc;color:var(--sg-ink);font-family:var(--sg-body)}
body[data-sg-view="hall"].sg-config .card{background:var(--sg-glass);border-color:#fff;border-radius:30px;box-shadow:var(--sg-shadow);color:var(--sg-ink);padding:30px}
body[data-sg-view="hall"].sg-config h1{font-family:var(--sg-heading);font-weight:400;letter-spacing:-.05em;line-height:1.25}
body[data-sg-view="hall"].sg-config .sg-brand{color:var(--sg-ink);background:none;-webkit-text-fill-color:currentColor}
/* Guests: ordinary forms and lobby get the same light design. */
body:is([data-sg-view="guest"],[data-sg-view="lobby"]){font-size:16px}
body:is([data-sg-view="guest"],[data-sg-view="lobby"]) h1{font-size:clamp(24px,6.2vw,32px);line-height:1.3;letter-spacing:-.055em}
body:is([data-sg-view="guest"],[data-sg-view="lobby"]) .brand{margin-bottom:24px;color:var(--sg-ink);font-size:11px;line-height:1.5}
body[data-sg-view="guest"] :is(#intro>p,.dim,.hint,.foot,.who,.sub,.state:not(.bad):not(.ok),#lead){color:var(--sg-muted);line-height:1.65}
body[data-sg-view="guest"] :is(#enter,.card,.question,.waitbox){background:var(--sg-glass);border:1px solid #fff;border-radius:24px;box-shadow:var(--sg-shadow);padding:20px}
body:is([data-sg-view="guest"],[data-sg-view="lobby"]) :is(input[type="text"],input:not([type])){font-size:16px;padding:14px 16px;min-height:52px;border-radius:16px}
body:is([data-sg-view="guest"],[data-sg-view="lobby"]) :is(.go,#join,#on,#mic,#start,#backIn,#sideGo){background:linear-gradient(135deg,#e0ff6b,#ceff00);color:#20351c;border:1px solid #badb46;border-radius:99px;min-height:52px;padding:14px 22px;font-family:var(--sg-body);font-size:16px;font-weight:700;box-shadow:inset 0 1px 0 #fff9,0 7px 20px #a0bd2524}
body[data-sg-view="guest"] :is(.alt,button.ghost){border-radius:99px;background:#ffffffc9;border-color:#c9dfea;color:var(--sg-ink);min-height:44px}
body[data-sg-view="guest"] :is(.pick button,.ans,.option){border-radius:16px}
body[data-sg-view="guest"] .meter{background:#d9e7f1}
body[data-sg-view="guest"] .team{color:#fff}
body:is([data-sg-view="guest"],[data-sg-view="lobby"]) .sg-name-hint{color:#536b7d!important;font-family:var(--sg-body)!important;line-height:1.65!important}
body:is([data-sg-view="guest"],[data-sg-view="lobby"]) #sg-privacy{color:#536b7d!important;font-size:12px!important;font-family:var(--sg-body)!important;line-height:1.55!important}
body[data-sg-view="guest"].alarm{background:#fff0f1;color:#93253b}
body[data-sg-view="lobby"] .wrap{max-width:580px;margin:0 auto;gap:20px}
body[data-sg-view="lobby"] .box{padding:28px 24px;border-radius:28px;border:1px solid #fff;background:var(--sg-glass);box-shadow:var(--sg-shadow);width:100%}
body[data-sg-view="lobby"] .box p{color:var(--sg-muted);line-height:1.7;font-size:15px}
body[data-sg-view="lobby"] .game{color:#22678f}
body[data-sg-view="lobby"] .host{color:var(--sg-muted)}
body[data-sg-view="lobby"] .err{color:#b52a3f}
/* 3D/camera phone worlds retain their themes. Brand typography and controls carry through. */
body:is([data-sg-view="immersive"],[data-sg-view="record"]) h1{font-family:var(--sg-heading);font-size:clamp(23px,6vw,30px);font-weight:400;letter-spacing:-.05em;line-height:1.3}
body:is([data-sg-view="immersive"],[data-sg-view="record"]) :is(.go,.btn):not(.alt){font-family:var(--sg-body);border-radius:99px;background:linear-gradient(135deg,#dfff68,#ceff00);color:#20351c;border:1px solid #bada42;box-shadow:inset 0 1px 0 #fff9,0 9px 24px #a6ca2a24;min-height:50px;font-weight:700}
body:is([data-sg-view="immersive"],[data-sg-view="record"]) :is(.alt,.btn.alt){font-family:var(--sg-body);border-radius:99px;min-height:44px}
body[data-sg-view="record"] #bStart{padding:22px;border-radius:28px;background:linear-gradient(140deg,#fffffff2,#e8f4ffe6);border:1px solid #fff;box-shadow:0 20px 50px #0002;color:#15354e}
body[data-sg-view="record"] #bStart :is(.sub,.agree){color:#486375;line-height:1.65}
body[data-sg-view="record"] #bStart h1 em{color:#15658d;font-style:normal;background:none;-webkit-text-fill-color:currentColor}
body[data-sg-view="record"] #bStart a{color:#086fae}
body[data-sg-view="record"] #bStart input[type="text"]{background:#fff;border:1px solid #c7dce9;border-radius:16px;color:#15354e;font-size:16px}
body[data-sg-view="record"] #bStart input[type="checkbox"]{accent-color:#0875b9;color-scheme:light;border-color:#7599b2;background:#fff;flex-shrink:0}
body[data-sg-view="record"] #bStart input[type="checkbox"]:checked{background:#0875b9;border-color:#0875b9}
body[data-sg-view="record"] #bStart input[type="checkbox"]:checked::after{border-color:#fff}
/* Legal pages keep a comfortable reading measure; no blur on a long document. */
body[data-sg-view="legal"]{font-size:16px;line-height:1.8;padding:28px 18px 60px}
body[data-sg-view="legal"]>.wrap{max-width:900px;padding:38px clamp(22px,5vw,56px) 44px;border:1px solid #fff;border-radius:30px;background:#ffffffc9;box-shadow:0 20px 70px #214e6b0c}
body[data-sg-view="legal"] h1{font-size:clamp(25px,3.2vw,34px);margin-top:28px}
body[data-sg-view="legal"] h2{font-size:20px;letter-spacing:-.02em;margin-top:32px}
body[data-sg-view="legal"] .legal-notice{background:linear-gradient(125deg,#eef7ff,#f8ffe2);border-color:#d7e7f0;border-radius:22px;line-height:1.8}
body[data-sg-view="legal"] :is(p,li,td){color:#2f4a5f}
body[data-sg-view="legal"] .brand{display:inline-flex}
body[data-sg-view="legal"] table{line-height:1.65}
/* Compact layouts. Existing game state visibility is deliberately not overridden. */
@media(min-width:1500px){body[data-sg-view="host"] .side{width:360px;flex-basis:360px;padding:24px 22px}}
@media(max-width:1100px){
 body[data-sg-view="work"] :is(.top,.sg-shell){gap:12px}
 body[data-sg-view] :is(.nav,.sg-nav)>a{padding-inline:12px;font-size:12px}
 body[data-sg-page="account"] .top .who{width:100%;margin-left:0;justify-content:flex-end}
}
@media(max-width:1023px){
 body[data-sg-page="account"] .snav{padding:5px;border-radius:20px}
 body[data-sg-page="account"] .snav a{padding:4px;min-height:44px;border-radius:14px}
 body[data-sg-page="account"] .snav a.on .si{background:transparent;color:#1b6a96}
 body[data-sg-page="account"] .snav a.on{background:#d8efff}
}
@media(max-width:980px){
 body[data-sg-view="host"]:not(.full){overflow-y:auto}
 body[data-sg-view="host"]:not(.full)>.wrap{height:auto;min-height:100dvh;flex-direction:column;padding:10px;gap:10px}
 body[data-sg-view="host"]:not(.full)>.wrap>.side{width:100%;flex:none;height:auto;max-height:none;padding:20px;border-radius:24px}
 body[data-sg-view="host"]:not(.full)>.wrap>.stage{height:62vh;min-height:340px;flex:none;width:100%;border-radius:24px}
 body[data-sg-view="host"] .gk-top h1{font-size:23px}
}
@media(max-width:600px){
 body:is([data-sg-view="work"],[data-sg-view="auth"],[data-sg-view="legal"]) h1{font-size:27px;letter-spacing:-.055em;line-height:1.3}
 body[data-sg-view="work"] :is(.top,.sg-shell){gap:12px;margin-bottom:24px}
 body[data-sg-view] :is(.nav,.sg-nav){border-radius:22px;padding:5px}
 body[data-sg-view] :is(.nav,.sg-nav)>a{padding:10px 12px;min-height:44px}
 body[data-sg-view] .sg-control{margin-left:4px}
 body[data-sg-view] .sg-control>a{min-height:44px}
 body[data-sg-view] :is(.who,.sg-who) :is(a,button){min-height:40px;font-size:12px}
 body[data-sg-view] :is(.who b,.sg-who .nm){max-width:150px}
 body[data-sg-page="account"] .top .who{width:auto;margin-left:auto;justify-content:normal}
 body[data-sg-page="account"] .wrap{padding-top:22px}
 body[data-sg-page="account"] .frow{gap:12px}
 body[data-sg-page="account"] .frow .card{flex-basis:min(270px,calc(100vw - 102px));padding:16px;border-radius:22px;gap:10px}
 body[data-sg-page="account"] :is(.fhead h2,.group .fhead h2){font-size:17px;line-height:1.35}
 body[data-sg-page="account"] .fhead{flex-wrap:wrap;gap:8px}
 body[data-sg-page="account"] .card h3{font-size:17px}
 body[data-sg-page="account"] .lobbyc{padding:18px;border-radius:24px}
 body[data-sg-page="account"] .lobbyc .ll{gap:8px}
 body[data-sg-page="account"] .lobbyc .lh h2{font-size:18px;line-height:1.35}
 body[data-sg-view="auth"]>.card{padding:28px 22px;border-radius:28px}
 body[data-sg-view="auth"] h1{font-size:27px;margin-bottom:22px}
 body[data-sg-view="work"] :is(.sec,.empty){padding:18px;border-radius:22px}
 body[data-sg-view="work"] :is(input[type="text"],input[type="email"],input[type="password"],input[type="tel"],textarea,select){font-size:16px}
 body[data-sg-view="work"] .savebar :is(button,a){min-height:44px}
 body[data-sg-page="event"] .pk-in{border-radius:24px}
 body[data-sg-page="tariffs"] .tar{padding:22px;border-radius:24px}
 body[data-sg-view="host"] .side h1{font-size:20px}
 body[data-sg-view="host"]:not(.full)>.wrap>.side{padding:18px 16px}
 body[data-sg-view="host"] :is(.gk-body,.gk-head,.gk-foot){padding-left:16px;padding-right:16px}
 body[data-sg-view="host"] .gk-q{height:40px;width:40px;min-width:40px}
 body[data-sg-view="lobby"] .wrap{padding-inline:18px}
 body[data-sg-view="lobby"] .box{padding:24px 20px;border-radius:26px}
 body[data-sg-view="legal"]{padding:14px 10px 32px}
 body[data-sg-view="legal"]>.wrap{padding:24px 18px 30px;border-radius:24px}
 body[data-sg-view="legal"] h1{font-size:25px;line-height:1.3}
 body[data-sg-view="legal"] h2{font-size:18px;line-height:1.5}
 body[data-sg-view="legal"] .legal-notice{padding:18px}
}
@supports not (backdrop-filter:blur(10px)){
 body[data-sg-view] :is(.glass,.sg-nav,.nav,.gk-drawer){background:#f7fbff!important}
}
@media(prefers-reduced-motion:reduce){
 body[data-sg-view] :is(button,a,.card,.gk-drawer,.gk-back,.sheet){transition:none!important;scroll-behavior:auto!important}
 body[data-sg-page="account"] .card:not(.soon):hover{transform:none}
}
@media print{
 body[data-sg-view]{background:#fff!important;color:#111!important;padding:0!important}
 body[data-sg-view="legal"]>.wrap{padding:0;border:0;border-radius:0;box-shadow:none;max-width:none;background:#fff}
 body[data-sg-view="legal"] .legal-notice{background:#fff}
 body[data-sg-view]::before{display:none!important}
}

/* Guest audit: readable service text on every painted/dark world. */
html body[data-sg-view][data-sg-page] #sg-privacy{background:#fffdf4f2!important;color:#405463!important;border:1px solid #d7dfd6;border-radius:12px;margin:8px auto max(8px,env(safe-area-inset-bottom));padding:8px 12px!important;font-size:12px!important;line-height:1.5!important;max-width:calc(100% - 24px);width:480px;box-sizing:border-box;flex-shrink:0;position:relative}
html body[data-sg-view][data-sg-page] #sg-privacy a{color:#22576a!important;text-underline-offset:2px}
body:is([data-sg-view=guest],[data-sg-view=immersive],[data-sg-view=record]) :is(input[type=text],input[type=search],textarea,select){min-width:0;max-width:100%;box-sizing:border-box}
body:is([data-sg-view=guest],[data-sg-view=immersive],[data-sg-view=record]) :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--sg-blue,#0f85ef);outline-offset:3px}
body:is([data-sg-view=guest],[data-sg-view=immersive],[data-sg-view=record]) :is(.err:not(:empty),.state.bad){color:#9e2637;background:#fff2f0f5;border-radius:12px;padding:9px 12px;line-height:1.45}

body:is([data-sg-view=guest],[data-sg-view=immersive],[data-sg-view=record]) .msg.on:not(.ok){background:#fff1eef5;color:#9e2637;border:1px solid #c38d8d;border-radius:12px;line-height:1.5}