/* INOVIA: warm, playful surfaces; clear actions in the clinical workspace. */
:root{--ink:#243f40;--text:#243f40;--muted:#657774;--indigo:#23695d;--indigo-dark:#185347;--primary:#23695d;--primary-dark:#185347;--primary-soft:#e8f2e8;--line:#e0e7e1;--border:#e0e7e1;--bg:#faf9f5;--card:#fff;--radius:20px;--danger:#b04e53;--err:#b04e53;--ok:#32764f}
*{box-sizing:border-box}body{font-size:14px;background:var(--bg);color:var(--ink);font-family:ui-rounded,'SF Pro Rounded',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.5}button,input,select,textarea{font-family:inherit}button,a{-webkit-tap-highlight-color:transparent}button,input,select{font-size:14px}button:not(.cue),.link-button,.head-button,.ghost{min-height:44px}button:disabled{cursor:not-allowed;opacity:.55}h1,h2,h3{letter-spacing:-.035em;font-weight:720}a{color:var(--indigo)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #3a816c;outline-offset:3px}.primary,.btn-primary{background:var(--indigo);box-shadow:none}.primary:hover,.btn-primary:hover{background:var(--indigo-dark)}input,select,textarea{background:#fff;border:1px solid var(--line);border-radius:12px;min-height:46px}input[type=checkbox],input[type=radio],input[type=range]{min-height:0;accent-color:var(--indigo)}.card{box-shadow:none;border-radius:20px;background:#fff}.eyebrow{font-size:9px;letter-spacing:.12em;color:#718c7b}.link-button,.head-button,.ghost,.install-button{background:#fff;color:var(--indigo);border:1px solid var(--line);border-radius:12px}.link-button:hover,.head-button:hover,.ghost:hover{background:#eef4e9;border-color:#b8d0bc}.beta-tag{display:inline-flex;font-size:9px;letter-spacing:.04em;font-weight:650;background:#ede6f4;color:#795b91;padding:4px 7px;border-radius:7px}.skip-link{position:fixed;top:-100px;left:20px;background:#fff;padding:14px;z-index:20000}.skip-link:focus{top:8px}.beta-feedback{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fff3dc;border:1px solid #e9d5aa;border-radius:12px;padding:14px 18px;margin-bottom:20px}.beta-feedback button{flex:none;border:1px solid #c9b58e;background:#fff;border-radius:10px;padding:8px 14px}.beta-empty,.loading-state{padding:30px;text-align:center;color:var(--muted)}.beta-empty strong{display:block;color:var(--ink);font-size:16px}.beta-empty p{margin:7px 0}.error{color:var(--danger)}
/* Operator: one page scroll, stable primary controls, no nested scrolling panels. */
body.role-operator{position:static;inset:auto;width:100%;height:auto;min-height:100dvh;overflow:auto;touch-action:pan-x pan-y}
body.role-operator .wrap{display:block;width:100%;max-width:1480px;height:auto;min-height:0;padding:20px 32px 36px;margin:0 auto;overflow:visible}
.beta-session-nav{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted);margin:0 0 15px;padding:0;min-height:24px}.beta-session-nav a{display:inline-flex;align-items:center;min-height:32px;color:var(--muted);text-decoration:none}.beta-session-nav .beta-tag{margin-left:auto}
body.role-operator .head{gap:22px;padding:0 0 20px;margin:0 0 20px;min-height:74px;align-items:center;border-bottom:1px solid var(--line);flex-wrap:wrap}
body.role-operator .brand-session{flex:1;min-width:220px;gap:13px}body.role-operator .logo{width:50px;height:52px;background:#f7dfce;border-radius:16px;padding:7px}body.role-operator .head-title-row h1{font-size:12px;letter-spacing:.05em;color:#7b8c80;margin-bottom:4px}body.role-operator .head-patient{display:block;font-size:18px;line-height:1.3;max-width:420px;white-space:normal;overflow:visible;text-overflow:clip;letter-spacing:-.03em}.head-session-label{display:none!important}
body.role-operator .head-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;flex:none;min-width:0}body.role-operator .head-actions .head-button{width:auto;padding:10px 13px;min-width:42px;min-height:42px}body.role-operator .head-actions .head-button b{display:block;position:static;clip-path:none;width:auto;height:auto;font-size:11px}.head-actions .head-link{display:none!important}body.role-operator .head .pill{font-size:9px;padding:6px 9px;border-radius:25px;min-height:25px;margin:0}
body.role-operator .cockpit-serial,body.role-operator .cockpit-meter{padding:7px 12px;min-height:44px;background:#fff;border:1px solid var(--line);border-radius:12px;gap:3px;box-shadow:none}body.role-operator .cockpit-serial strong,body.role-operator .cockpit-meter strong{font-size:16px}body.role-operator .cockpit-serial span,body.role-operator .cockpit-meter>span{font-size:8px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}body.role-operator .cockpit-serial em,body.role-operator .cockpit-meter em{font-size:8px}.cockpit-serial strong{text-transform:uppercase}.head-actions #conn{display:none}
body.role-operator .layar-nota.tampil{position:static;left:auto;bottom:auto;transform:none;width:auto;box-shadow:none;z-index:auto;margin:0 0 15px;padding:8px 12px;border-radius:10px;background:#faf1df;font-size:10px;color:#866c3b}
body.role-operator .global-status:not(:empty){position:fixed;left:50%;bottom:16px;transform:translateX(-50%);width:min(600px,calc(100% - 28px));font-size:12px;z-index:130;border-radius:12px}
body.role-operator.cockpit-ready .cockpit{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);grid-template-rows:auto;align-items:start;gap:22px;overflow:visible;min-height:0}
.cockpit .controls-panel{grid-column:1;grid-row:1;overflow:visible;padding:24px;min-height:0;height:auto;border-radius:20px}.cockpit .cockpit-top{display:flex;flex-direction:column;grid-column:2;grid-row:1;gap:20px;height:auto;min-height:0;overflow:visible}
.control-surface{border-radius:20px;border:1px solid var(--line);padding:22px;background:#fff}.control-surface .surface-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.control-surface .surface-head h2{font-size:20px;font-weight:720;line-height:1.2;margin:5px 0 0}.control-surface .eyebrow{font-size:9px}.control-head-actions{display:flex;flex-wrap:wrap;gap:10px;min-width:0}.controls-panel .control-head-actions{width:100%;justify-content:space-between;align-items:center;margin-top:9px;background:#f6f7f1;padding:11px 13px;border-radius:12px}.controls-panel .active-cue{min-width:0;text-align:left}.controls-panel .active-cue>span{font-size:8px;letter-spacing:.05em}.controls-panel .active-cue strong{display:block;font-size:12px;margin-top:4px}.controls-panel .playlist-open{min-height:36px;font-size:10px;padding:6px 11px;background:#fff}.beta-cue-note{font-size:11px;color:var(--muted);margin:16px 0 2px}
.controls-panel .cue-grid{display:block;margin:0}.cue-group h3{font-size:10px;font-weight:650;letter-spacing:.04em;text-transform:none;color:#7c887c;margin:20px 0 10px}.cue-group h3::before{content:'';display:inline-block;width:5px;height:5px;background:#a5b7a4;border-radius:50%;margin:0 7px 2px 0}.cue-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.controls-panel .cue{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;min-height:60px;padding:12px 13px;gap:10px;font-size:11px;font-weight:650;text-align:left;line-height:1.4;border:1px solid var(--line);border-radius:13px;background:#fff;box-shadow:0 2px 0 #30473107;color:var(--ink)}.controls-panel .cue .cue-ico{font-size:20px;width:24px;height:24px;flex:none;display:grid;place-items:center}.cue-ico svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.controls-panel .cue:hover{border-color:#93b49e;background:#f2f7ef}.controls-panel .cue.aktif{background:var(--indigo);border-color:var(--indigo);color:#fff;box-shadow:0 3px 0 #173a3418}.cue-essential{position:sticky;top:calc(var(--preview-offset,0px) + 6px);background:#fff;z-index:25;padding:0 0 8px}.cue-essential .cue-buttons{grid-template-columns:1fr 1fr}.cue-essential h3{padding-top:12px;margin-top:10px}.cue-essential .cue{min-height:63px}.cue-essential .cue-bicara{background:#ede5f6;border-color:#e5d9f0;color:#695288}.cue-essential .cue-jeda{background:#f8efd5;border-color:#f1e4c3;color:#8b733b}.cue-essential .cue-tenang{background:#e3f1e6;border-color:#cfe4d4;color:#367653}.cue-essential .cue-stop{background:#b55758;border-color:#a94d4f;color:white}.cue-essential .cue-stop:hover{background:#9e4347;border-color:#9e4347}.cue-session .cue-buttons{grid-template-columns:1fr 1fr}.cue-session .cue-selesai{background:#eaf4e5;border-color:#d5e6ce}.cue-session .cue-mulai{background:#e7f0eb}.cue-session .cue.aktif{background:var(--indigo);color:white}
.cockpit .stream-panel{height:auto;min-height:0;overflow:visible;display:block;flex:none}.cockpit .cermin-kotak{position:relative;height:auto;aspect-ratio:16/9;min-height:180px;margin-top:15px;border-radius:15px;overflow:hidden;background:#e9f0e5}.cockpit .cermin-waiting{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:18px;min-height:0;background:#eef3e8}.cockpit .cermin-waiting>img{width:62px;max-height:50px;object-fit:contain;opacity:.3;filter:none;margin-bottom:15px}.cockpit .cermin-waiting>strong{font-size:14px;color:#607b67}.cockpit .cermin-waiting>span:last-child{font-size:10px;color:#7e9180;text-align:center;max-width:250px;line-height:1.65}.cockpit .cermin-loader{display:none}.cockpit .cermin-fps{font-size:10px;min-height:33px;padding:6px 8px}.cockpit .stream-actions{gap:9px}.cockpit .cermin-sakelar{font-size:10px;gap:5px}.cockpit .stream-panel .sesi{font-size:10px;margin-top:8px}.cockpit #cermin-img{object-fit:contain;width:100%;height:100%}
.cockpit .monitor-card{height:auto;min-height:0;max-height:none;flex:none;overflow:visible}.monitor-card .surface-head{flex-wrap:wrap}.monitor-card .surface-head .pill{font-size:9px;border-radius:20px;margin:0}.monitor-card .gsr-alert{padding:13px;border-radius:12px;margin:16px 0 10px;background:#f7f7f1;border-color:#e8eadf;gap:5px}.monitor-card .gsr-alert strong{font-size:12px}.monitor-card .gsr-alert span{font-size:10px;line-height:1.6}.monitor-card .gsr-alert.tenang{background:#e8f7f1;border-color:#bde7d7}.monitor-card .gsr-alert.naik{background:#fff4e9;border-color:#f2d0aa}.monitor-card .gsr-alert.tinggi,.monitor-card .gsr-alert.gawat{background:#fff0f3;border-color:#efb8c3}.monitor-card .mon-head{display:flex;gap:5px;flex-wrap:wrap;margin:9px 0}.monitor-card .mon-badge{font-size:9px;padding:5px 8px}.monitor-card .mon-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:'gsr hr spo2';gap:8px;min-height:0;height:auto}.monitor-card .mon-sig{padding:12px 8px;background:#fafbf7;border:1px solid var(--line);border-radius:12px;min-height:0;overflow:hidden}.monitor-card .mon-label{font-size:9px}.monitor-card .mon-val{font-size:25px;margin:6px 0;color:var(--ink)}.monitor-card .mon-val.mati{color:#b4c0b3}.monitor-card .mon-chart{height:45px}.monitor-card .mon-mutu{font-size:8px}.monitor-card .mon-aksi{display:flex;flex-wrap:wrap;gap:10px;margin-top:15px;align-items:center}.monitor-card .mon-aksi .ghost{width:auto;min-height:40px;font-size:10px;padding:9px 12px;flex:1}.monitor-card .mon-auto{flex-basis:100%;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;font-size:11px;min-height:44px;background:#f4f7ef;border-radius:10px;padding:10px}.monitor-card .mon-scr{font-size:9px}.monitor-card .fsm-status{font-size:9px;white-space:normal;max-width:none}.monitor-empty{display:none}.tanpa-sensor .monitor-empty{display:block;background:#f4f6ee;border-radius:13px;padding:20px;margin-top:15px}.monitor-empty strong{font-size:13px;display:block}.monitor-empty p{font-size:11px;line-height:1.7;color:var(--muted);margin:7px 0 0}.tanpa-sensor .monitor-card>.gsr-alert,.tanpa-sensor .monitor-card>.mon-head,.tanpa-sensor .monitor-card>.mon-grid,.tanpa-sensor .monitor-card>.mon-aksi{display:none}
.cockpit .audio-panel{height:auto;min-height:0;padding:23px}.audio-stage{background:#f8f0df;border-radius:15px;padding:23px;margin-top:17px}.audio-wave i{background:#d7b37e}.audio-stage>strong{font-size:15px}.audio-stage>span{font-size:12px}.audio-stage .audio-note{font-size:11px}.audio-actions .primary{font-size:13px;min-height:47px}
/* Pairing: concrete next steps, then the operator's controls. */
body.role-operator .waiting-room{display:grid;grid-template-columns:minmax(200px,.85fr) minmax(300px,1fr);gap:40px;margin:30px auto 0;padding:0;background:#fff;max-width:1100px;min-height:0;overflow:hidden;border-radius:25px;align-items:stretch}
.waiting-orbit{display:none}.waiting-illustration{min-height:470px;position:relative;background:#f4f0df;overflow:hidden}.waiting-illustration img{height:100%;width:100%;object-fit:cover;position:absolute;inset:0}.waiting-illustration>span{position:absolute;bottom:20px;left:20px;right:20px;background:#fff9e9e8;padding:16px;border-radius:15px;font-size:14px;line-height:1.5;text-align:left;color:#4e654e;font-weight:650}
.waiting-copy{padding:32px 32px 32px 0;text-align:left}.waiting-copy h2{font-size:30px;letter-spacing:-.045em;line-height:1.2;margin:9px 0 12px}.waiting-copy>p{font-size:12px;line-height:1.75;color:var(--muted)}.waiting-token-box{background:#edf4e7;border:1px solid #d6e4cc;border-radius:15px;padding:17px;display:flex;align-items:center;justify-content:space-between;gap:12px}.waiting-token-box strong{font-size:29px;letter-spacing:.12em;color:#376c50}.waiting-token-box>div>span{font-size:9px;color:var(--muted)}.waiting-token-box button{font-size:10px;min-height:42px;background:white}.waiting-devices{margin-top:20px;gap:10px}.waiting-device{padding:13px 0;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;gap:10px}.waiting-device strong{font-size:12px}.waiting-device div>span{font-size:10px;line-height:1.65}.waiting-device em{font-size:9px}.waiting-copy .waiting-overall{font-size:11px;background:#faf6e9;padding:13px;border-radius:11px}.preview-cockpit-button{display:block;width:100%;font-size:12px;min-height:47px;border-radius:12px;background:var(--indigo);color:#fff;border:1px solid var(--indigo);padding:12px}.preview-cockpit-button:hover{background:var(--indigo-dark)}
/* Settings and secondary controls remain available in accessible dialogs. */
body.role-operator .settings-panel{inset:24px 12px;max-width:850px;padding:28px;border-radius:23px;overflow-y:auto}.settings-head{position:sticky;top:-28px;background:#fff;z-index:2;padding:12px 0 18px;margin-bottom:15px}.settings-head h2{font-size:24px}.settings-panel .modes{gap:10px}.settings-panel .mode-card{padding:17px;min-height:0}.settings-panel .mode-card strong{font-size:13px}.settings-panel .mode-card .desc{font-size:11px;line-height:1.65}.mode-card.selected{background:#edf5e8;border-color:#7eac88}.environment-card{background:#fff}.environment-card:has(input:checked){background:#edf5e8;border-color:#88ab87}.environment-card .environment-symbol{display:none}.environment-card::before{content:'';background:url('../assets/ui/ocean-welcome.png') center/cover;width:75px;min-height:65px;align-self:stretch;border-radius:11px;flex:none}.environment-card.zoo::before{background-image:url('../assets/ui/zoo-welcome.png')}.environment-card strong{font-size:12px}.environment-card small{font-size:10px}.environment-card .environment-check{color:var(--indigo)}body.role-operator .settings-panel .grid-settings{grid-template-columns:1fr 1fr;gap:15px}.settings-panel input,.settings-panel select{font-size:14px}.settings-panel .actions{position:sticky;bottom:-28px;background:#fff;z-index:2;padding:18px 0 0;margin-top:20px;border-top:1px solid var(--line)}.settings-panel .age-guidance{font-size:11px}.playlist-panel{padding:25px;border-radius:23px}.playlist-note,.stop-note{font-size:12px;line-height:1.7}.playlist-row{border-radius:12px}.stop-dialog{border-radius:23px;padding:27px}.stop-dialog .settings-head{position:static}.stop-dialog h2{font-size:26px}.stop-dialog .actions{gap:12px}.stop-dialog .actions button{font-size:12px}
/* Headset: a welcome and one large start action; operator settings become a summary. */
body.role-headset .wrap{max-width:940px;padding:24px;margin:auto}.role-headset .beta-session-nav{display:none}.role-headset .head{padding:0 0 16px;margin-bottom:20px}.role-headset .head h1{font-size:21px}.role-headset .head .sub{font-size:11px}.role-headset .session-card{display:none}.role-headset .headset-note{padding:30px 34px;background:#eef2e5;border:1px solid #dde6d4;border-radius:24px;position:relative;overflow:hidden;min-height:310px}.headset-welcome-art{display:none}.role-headset .headset-welcome-art{display:block;width:43%;height:100%;position:absolute;right:0;top:0;object-fit:cover;object-position:center}.role-headset .headset-note>h2,.role-headset .headset-note>p,.role-headset .headset-note>.eyebrow,.role-headset .headset-note>.actions,.role-headset #xr-note{position:relative;max-width:51%}.role-headset .headset-note h2{font-size:30px;line-height:1.15;letter-spacing:-.045em;margin:12px 0}.role-headset .headset-note p{font-size:12px;line-height:1.8}.role-headset .headset-note .actions{display:flex;flex-direction:column;align-items:stretch;gap:9px;margin-top:20px}.role-headset .headset-note .primary{font-size:15px;min-height:58px}.role-headset .headset-note .ghost{min-height:45px;font-size:12px;background:transparent}.role-headset #xr-note{font-size:10px}.role-headset .settings-panel{margin-top:22px;padding:25px}.role-headset .settings-head{position:static}.role-headset .settings-panel .modes,.role-headset .settings-panel .grid-settings{display:none}.role-headset .settings-panel>h3{display:none}.role-headset .environment-card:has(input:not(:checked)){display:none}.role-headset .environment-options{grid-template-columns:1fr}.role-headset #environment-note{display:none}.headset-summary{display:none}.role-headset .headset-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:10px 0}.headset-summary>div>span{font-size:10px;color:var(--muted);display:block}.headset-summary strong{font-size:14px;display:block;margin-top:5px;overflow-wrap:anywhere}.role-headset .environment-picker{margin-top:15px}.role-headset .foot{text-align:center;font-size:10px;color:var(--muted);margin-top:24px}.role-headset.previewing .wrap,body.role-operator.previewing .wrap{padding-top:calc(58vh + 20px)}
/* Supporting clinic tools share the same palette without hiding readings. */
.utility-nav{display:flex;gap:17px;align-items:center;padding:17px 0;border-bottom:1px solid var(--line);font-size:12px;flex-wrap:wrap}.utility-nav a{text-decoration:none}.admin-beta .admin-hero{background:#eaf1e3;border-color:#dce7d4;border-radius:23px}.admin-beta .admin-grid{align-items:start;gap:23px}.admin-beta .admin-grid>.card{padding:26px}.admin-beta .admin-list{max-height:none;overflow:visible}.admin-beta .admin-stats>div{border-color:#dce7d4}.sensor-beta .container{max-width:1360px}.sensor-beta .container .grid{grid-template-columns:minmax(0,1.5fr) minmax(300px,.75fr)}.sensor-beta .container>header{padding:20px 0}.sensor-beta .card{border-color:var(--line);box-shadow:none}.sensor-beta .chart-title{font-size:13px;color:var(--muted)}.sensor-beta .btn-primary{background:var(--indigo)}.sensor-beta .logo-caption{display:none}.sensor-beta .header-left>.logo{display:none}.sensor-beta .header-left>.logo-item{width:50px}.sensor-beta .header-left .logo-wide{max-width:50px;object-fit:contain}
@media(max-width:1100px){body.role-operator .wrap{padding:18px 24px 30px}.head-actions .cockpit-serial{display:none!important}body.role-operator .head-patient{max-width:320px;font-size:16px}.head-actions #btn-fullscreen{display:none}body.role-operator.cockpit-ready .cockpit{grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:17px}.cockpit .controls-panel,.control-surface{padding:19px}.controls-panel .cue{padding:11px 9px;font-size:10px;gap:7px}.controls-panel .cue .cue-ico{width:20px;font-size:18px}.controls-panel .cue-buttons{gap:7px}.monitor-card .mon-grid{grid-template-columns:1fr 1fr;grid-template-areas:'gsr gsr' 'hr spo2'}.monitor-card .mon-gsr{display:grid;grid-template-columns:1fr 2fr;gap:3px 10px}.monitor-card .mon-gsr .mon-chart{grid-column:2;grid-row:1/4}.monitor-card .mon-gsr .mon-val{grid-column:1;grid-row:2}.monitor-card .mon-gsr .mon-mutu{grid-column:1}.monitor-card .mon-aksi .ghost{flex-basis:100%}.waiting-illustration{min-height:450px}}
@media(max-width:800px){body.role-operator .head{gap:14px;align-items:center}body.role-operator .brand-session{min-width:190px}.head-actions .cockpit-meter{display:none!important}body.role-operator .head-actions .head-button{min-height:40px;padding:9px 11px}.head-actions #btn-refresh{display:none}body.role-operator.cockpit-ready .cockpit{grid-template-columns:1fr}.cockpit .controls-panel{grid-column:1;grid-row:1}.cockpit .cockpit-top{grid-column:1;grid-row:2}.controls-panel .cue{font-size:12px;min-height:59px;padding:12px}.control-surface .surface-head h2{font-size:22px}.cue-essential .cue-buttons{grid-template-columns:repeat(4,minmax(0,1fr))}.cue-essential .cue{flex-direction:column;align-items:center;text-align:center;gap:7px;min-height:79px;padding:12px 8px;font-size:11px}.cue-essential h3{font-size:10px}.cue-buttons{grid-template-columns:repeat(3,minmax(0,1fr))}.cue-session .cue-buttons{grid-template-columns:repeat(4,minmax(0,1fr))}.monitor-card .mon-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:'gsr hr spo2'}.monitor-card .mon-gsr{display:block}.monitor-card .mon-chart{height:60px}.monitor-card .mon-aksi .ghost{flex-basis:auto}.cockpit .cermin-kotak{min-height:0;max-height:340px}.sensor-beta .container .grid{grid-template-columns:1fr}.role-headset .headset-note h2{font-size:25px}body.role-operator .waiting-room{grid-template-columns:1fr 1.3fr;gap:25px}.waiting-copy{padding:24px 24px 24px 0}.waiting-copy h2{font-size:25px}.waiting-token-box{padding:13px}.waiting-token-box strong{font-size:23px}.waiting-token-box button{padding:8px;font-size:9px}}
@media(max-width:540px){body.role-operator .wrap{padding:12px 16px 28px}.beta-session-nav{margin-bottom:10px;font-size:10px}body.role-operator .head{padding-bottom:15px;margin-bottom:15px;gap:12px;flex-wrap:nowrap}body.role-operator .brand-session{min-width:0;gap:9px;flex:1}body.role-operator .logo{width:38px;height:40px;padding:6px;border-radius:13px}body.role-operator .head-patient{font-size:14px;max-width:none;line-height:1.4}body.role-operator .head-title-row h1{font-size:10px}body.role-operator .head-actions{gap:0}body.role-operator .head-actions .head-button{font-size:11px;padding:9px;gap:4px}body.role-operator .head-actions .head-button b{font-size:9px}body.role-operator .head-actions .head-button>span{font-size:13px}.cockpit .controls-panel,.control-surface{padding:20px 16px;border-radius:18px}.control-surface .surface-head h2{font-size:22px}.controls-panel .control-head-actions{padding:10px}.beta-cue-note{font-size:10px;line-height:1.7}.controls-panel .cue{min-height:64px;padding:10px 8px;gap:7px;flex-direction:column;align-items:center;text-align:center;font-size:10px}.cue-essential .cue-buttons{grid-template-columns:1fr 1fr}.cue-essential .cue{flex-direction:row;justify-content:flex-start;text-align:left;min-height:57px;padding:11px;font-size:11px}.cue-group h3{font-size:10px}.cue-session .cue-buttons{grid-template-columns:1fr 1fr}.cue-session .cue{flex-direction:row;text-align:left;padding:11px}.controls-panel .cue .cue-ico{width:21px;height:21px}.cue-essential{top:var(--preview-offset,0px)}.monitor-card .mon-grid{gap:6px}.monitor-card .mon-sig{padding:10px 6px}.monitor-card .mon-val{font-size:22px}.monitor-card .mon-mutu{font-size:8px}.monitor-card .mon-chart{height:45px}.monitor-card .mon-label{font-size:8px}.monitor-card .mon-label em{display:block;margin:3px 0}.monitor-card .mon-aksi .ghost{flex-basis:100%}
 body.role-operator .waiting-room{display:flex;flex-direction:column;gap:0;margin-top:18px;border-radius:21px}.waiting-illustration{min-height:0;height:160px;flex:none}.waiting-illustration img{object-position:50% 45%}.waiting-illustration>span{font-size:11px;left:14px;right:14px;bottom:12px;padding:11px;background:#fff9e9ed}.waiting-copy{padding:23px;text-align:left}.waiting-copy h2{font-size:27px}.waiting-copy>p{font-size:11px}.waiting-token-box strong{font-size:27px}.waiting-token-box button{font-size:10px;padding:9px 12px}.waiting-devices{grid-template-columns:1fr}.waiting-device em{font-size:9px}.waiting-copy .waiting-overall{font-size:10px}.preview-cockpit-button{font-size:12px}
 body.role-operator .settings-panel{inset:12px 8px;padding:22px 18px;border-radius:18px}.settings-head{top:-22px}.settings-head h2{font-size:23px}.settings-panel .actions{bottom:-22px}.settings-panel .modes{grid-template-columns:1fr}.settings-panel .mode-card{display:block;text-align:left;padding:16px}.mode-card .ico{float:left;margin-right:12px}.mode-card .desc{margin-top:6px}.environment-options{grid-template-columns:1fr}.environment-card{padding:12px}.environment-card::before{min-height:55px;width:65px}body.role-operator .settings-panel .grid-settings{grid-template-columns:1fr 1fr;gap:12px}.settings-panel .grid-settings label{font-size:11px}.settings-panel input,.settings-panel select{font-size:13px}.playlist-panel{padding:20px 16px}.playlist-row{grid-template-columns:23px 1fr 60px;gap:8px}.playlist-row select{font-size:12px}.playlist-duration input{width:50px}.playlist-footer{flex-wrap:wrap}.stop-dialog{padding:23px 18px}.stop-dialog .actions{flex-direction:column}.stop-dialog .actions button{width:100%}.stop-dialog h2{font-size:25px}
 body.role-headset .wrap{padding:18px}.role-headset .head .logo{width:42px;height:36px}.role-headset .headset-note{padding:178px 23px 25px;min-height:0}.role-headset .headset-welcome-art{height:155px;width:100%;object-position:center 45%}.role-headset .headset-note>h2,.role-headset .headset-note>p,.role-headset .headset-note>.eyebrow,.role-headset .headset-note>.actions,.role-headset #xr-note{max-width:none}.role-headset .headset-note h2{font-size:30px}.role-headset .settings-panel{padding:21px}.role-headset .headset-summary{grid-template-columns:1fr 1fr;gap:15px}.headset-summary strong{font-size:13px}.role-headset .settings-head h2{font-size:21px}.admin-beta .admin-grid{grid-template-columns:1fr}.admin-beta .admin-hero{grid-template-columns:1fr;gap:20px}.admin-beta .admin-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.admin-beta .admin-stats>div{padding:12px}.admin-beta .admin-hero h1{font-size:26px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* Patient context stays visible at every width, independently of toolbar tools. */
body.role-operator .session-stats{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:14px;margin:0 0 18px}
body.role-operator .session-stats .cockpit-serial,body.role-operator .session-stats .cockpit-meter{display:flex!important;flex-direction:column;align-items:flex-start;text-align:left;border:0;border-right:1px solid var(--line);background:transparent;border-radius:0;min-height:50px;padding:0 15px;gap:3px}
body.role-operator .session-stats>div:first-child{padding-left:0}body.role-operator .session-stats>div:last-child{border-right:0}
.session-stats .cockpit-serial strong{letter-spacing:.08em}.session-stats .cockpit-serial em{font-style:normal;color:var(--muted)}body.role-operator .head{margin-bottom:16px;padding-bottom:17px}
.beta-session-nav #conn{margin-left:auto;font-size:9px;min-height:23px;padding:3px 8px;border-radius:20px}.beta-session-nav .beta-tag{margin-left:0}
@media(max-width:540px){body.role-operator .session-stats{gap:7px;margin-bottom:15px}body.role-operator .session-stats .cockpit-serial,body.role-operator .session-stats .cockpit-meter{padding-inline:8px}body.role-operator .session-stats>div:first-child{padding-left:0}body.role-operator .session-stats strong{font-size:13px}body.role-operator .session-stats em{font-size:8px;white-space:normal}body.role-operator .session-stats .cockpit-serial span{display:block}.beta-session-nav .beta-tag{display:none}}
body.role-operator .controls-panel .active-cue{display:block}
body.role-operator.mode-audio .session-stats #cockpit-baterai{display:none!important}
body.role-operator.mode-audio .session-stats{grid-template-columns:1fr 1fr}
.tanpa-sensor #mon-status{display:none}
@media(max-width:800px){body.role-operator.mode-audio.cockpit-ready .cockpit{display:flex;flex-direction:column;align-items:stretch}.mode-audio .cockpit .cockpit-top{display:contents}.mode-audio .cockpit .audio-panel{order:-1}.mode-audio .cockpit .controls-panel{order:0}.mode-audio .cockpit .monitor-card{order:1}}

/* The child's screen preview uses the whole viewport, as the headset does. */
body.role-headset.previewing{overflow:hidden}
body.role-headset.previewing #scene{height:100dvh}
body.role-headset.previewing .wrap{display:none}

/* Three distinct worlds, with a single selected card on the child's summary. */
.environment-card.space::before{background-image:url('../assets/ui/space-welcome.png')}
.environment-card.space:has(input:checked){background:#f0edf8;border-color:#9485b3}
body.role-operator .settings-panel .environment-options{grid-template-columns:repeat(3,minmax(0,1fr))}
body.role-operator .settings-panel .environment-card{flex-direction:column;align-items:stretch;gap:9px;padding:11px;min-width:0}
body.role-operator .settings-panel .environment-card::before{width:100%;min-height:74px;flex-basis:74px;border-radius:9px}
body.role-operator .settings-panel .environment-card>span:not(.environment-symbol):not(.environment-check){min-width:0}
body.role-operator .settings-panel .environment-card strong{font-size:12px;line-height:1.4;overflow-wrap:anywhere}
body.role-operator .settings-panel .environment-card small{font-size:10px;line-height:1.45}
body.role-operator .settings-panel .environment-card .environment-check{position:absolute;top:17px;right:17px;margin:0;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#fff;color:var(--indigo);box-shadow:0 1px 6px #293d3320}
@media(max-width:540px){
 body.role-operator .settings-panel .environment-options{grid-template-columns:1fr}
 body.role-operator .settings-panel .environment-card{flex-direction:row;align-items:center;padding:10px;gap:12px}
 body.role-operator .settings-panel .environment-card::before{width:75px;min-height:58px;flex-basis:75px}
 body.role-operator .settings-panel .environment-card>span:not(.environment-symbol):not(.environment-check){padding-right:23px}
 body.role-operator .settings-panel .environment-card .environment-check{top:50%;right:12px;transform:translateY(-50%)}
}