:root{color-scheme:dark;font-family:Inter,"Segoe UI","Microsoft JhengHei",system-ui,sans-serif;color:#f2f2f5;background:#111114;line-height:1.6;font-synthesis:none;font-size:18px;--bg:#111114;--panel:#1a1a20;--border:#2b2b33;--muted:#92929f;--red:#ed3b52;--action:#c92d45;--action-hover:#b5263d;--red-hover:#ff4d64;--green:#59d69b}
*{box-sizing:border-box}
body{margin:0;min-width:320px;background:#111114}
button,input,a{-webkit-tap-highlight-color:transparent}
button,input{font:inherit;font-size:18px}
button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;border:1px solid #36363f;background:#24242c;color:#ececf1;border-radius:8px;padding:11px 16px;font-size:18px;font-weight:650;cursor:pointer;transition:background .16s,border-color .16s,transform .16s}
button:hover{background:#30303a;border-color:#50505d}
button:active{transform:translateY(1px)}
button:disabled{opacity:.42;cursor:not-allowed;transform:none}
button:focus-visible,a:focus-visible,input:focus-visible,#screen-wrap:focus-visible{outline:2px solid #ff7184;outline-offset:4px}
.primary{font-size:20px;font-weight:700;background:var(--action);border-color:var(--action);color:white;box-shadow:0 4px 20px #ed3b5215}
.primary:hover{background:var(--action-hover);border-color:var(--action-hover)}
.secondary{background:#292930;border-color:#35353e}
.ambient{position:absolute;z-index:0;pointer-events:none;top:0;right:0;left:0;height:590px;background:radial-gradient(ellipse at 65% -55%,#9c14342b,transparent 64%)}
main{position:relative;z-index:1;max-width:1440px;margin:0 auto;padding:0 44px}
.topbar{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0b}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
.brand-mark{width:38px;height:45px;display:grid;place-items:center;color:var(--red)}
.brand-mark svg{width:34px;height:39px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.brand-mark svg path:last-child{stroke:white}
.wordmark{font-size:28px;font-weight:850;letter-spacing:-1px;line-height:1.15}
.wordmark>span{color:var(--red);margin-left:3px}
.wordmark small{display:block;font-size:16px;letter-spacing:2.3px;font-weight:500;margin-top:7px;color:#b8b8c4}
.topbar-end{display:flex;align-items:center;gap:28px}
.private-label{font-size:16px;letter-spacing:2px;color:#b8b8c4}
.cloud-pill{display:flex;align-items:center;gap:8px;background:#232329;border:1px solid #34343c;border-radius:99px;font-size:16px;color:#c0c0ca;padding:6px 13px}
.cloud-pill i,.status-dot{display:inline-block;flex:0 0 auto;width:6px;height:6px;border-radius:50%;background:var(--green)}
.card{background:var(--panel);border:1px solid var(--border);border-radius:12px;min-width:0}
.eyebrow,.section-index{font-size:16px;letter-spacing:1.4px;font-weight:650;color:#b8b8c4}
.red-dot{display:inline-block;width:5px;height:5px;background:var(--red);border-radius:50%;margin-right:8px;vertical-align:2px}
h1,h2,h3,p{margin:0}
label{display:block;font-size:16px;font-weight:600;color:#c0c0cc;margin-bottom:9px}
input{display:block;width:100%;min-width:0;min-height:48px;border:1px solid #36363f;border-radius:7px;background:#121216;color:#f1f1f5;padding:11px 13px;font-size:18px;transition:border-color .15s}
input::placeholder{color:#b8b8c4}
input:focus{border-color:#bd3a50;outline:none;box-shadow:0 0 0 3px #ed3b5214}
.error{color:#ff8b9b!important}
.login-stage{display:grid;grid-template-columns:minmax(0,1fr) 410px;gap:70px;align-items:center;max-width:1100px;min-height:calc(100vh - 192px);margin:0 auto;padding:65px 0 76px}
.login-intro>.eyebrow{color:#b9a2a8}
.login-intro h1{font-size:58px;line-height:1.2;letter-spacing:-2px;font-weight:800;margin-top:19px}
.login-intro h1>span{color:var(--red)}
.intro-copy{font-size:18px;line-height:1.9;color:#b8b8c4;margin-top:22px}
.signal-visual{width:380px;max-width:100%;height:230px;position:relative;margin-top:16px;background-image:radial-gradient(#ffffff12 1px,transparent 1px);background-size:19px 19px;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 90%,transparent)}
.signal-ring{position:absolute;border:1px solid #ed3b5223;border-radius:50%;left:50%;top:48%;transform:translate(-50%,-50%)}
.ring-one{width:180px;height:180px;background:radial-gradient(circle,#ed3b520a,transparent 70%)}
.ring-two{width:278px;height:278px;border-color:#ed3b520c}
.signal-core{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%) rotate(-6deg);display:grid;place-items:center;width:94px;height:105px;background:linear-gradient(140deg,#46202c,#251c24);border:1px solid #8a3447;border-radius:24px;box-shadow:0 0 55px #ed3b5217}
.signal-core svg{width:45px;height:51px;fill:none;stroke:#ff7185;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.signal-core svg path:last-child{stroke:#ffe5e9}
.signal-tag{position:absolute;display:flex;align-items:center;gap:7px;font-size:16px;font-weight:600;border:1px solid #3c303a;border-radius:6px;background:#241c23;padding:6px 10px;color:#cabdc6;box-shadow:0 4px 16px #0003}
.signal-tag i{width:5px;height:5px;background:var(--red);border-radius:50%}
.tag-left{left:18px;top:53px}
.tag-right{right:9px;top:106px}
.signal-message{position:absolute;left:65px;bottom:10px;width:250px;height:45px;border:1px solid #39313c;border-radius:8px;background:#201c24d9;backdrop-filter:blur(8px);display:flex;align-items:center;padding:9px 11px;gap:9px}
.message-avatar{display:block;width:23px;height:23px;border-radius:50%;background:linear-gradient(135deg,#88384b,#2c283a)}
.signal-message>span:nth-child(2){display:flex;flex-direction:column;gap:6px;flex:1}
.signal-message b,.signal-message em{display:block;height:3px;background:#6d5363;border-radius:3px;width:82px}
.signal-message em{width:107px;background:#3e3443}
.signal-message>i{font-style:normal;font-size:16px;color:#d7697a;padding:3px 6px;background:#ed3b5210;border:1px solid #ed3b5222;border-radius:4px}
.intro-features{display:flex;flex-wrap:wrap;gap:16px;font-size:16px;color:#b8b8c4;margin-top:18px}
.intro-features span:before{content:'✓';color:#b95062;margin-right:6px}
.login-card{padding:34px 31px;background:linear-gradient(145deg,#202027,#19191f);box-shadow:0 25px 75px #0002;border-color:#37313c;position:relative;overflow:hidden}
.login-card:before{content:'';position:absolute;left:35px;right:35px;height:1px;top:0;background:linear-gradient(90deg,transparent,#ed3b52aa,transparent)}
.login-card .section-index{color:#f0a6b7;letter-spacing:2px;font-size:16px}
.login-card h2{font-size:28px;letter-spacing:-.5px;margin-top:12px}
.login-card>p{font-size:16px;color:#b8b8c4;margin-top:10px}
.login-card form{margin-top:32px}
.access-field{position:relative}
.access-field svg{position:absolute;left:14px;top:15px;width:17px;height:17px;fill:none;stroke:#737383;stroke-width:1.6}
.access-field input{padding-left:42px;min-height:49px}
.login-submit{width:100%;margin-top:19px;justify-content:space-between;padding:13px 17px;font-size:18px}
.login-submit span{font-size:24px;line-height:1}
#login-error{min-height:20px;font-size:16px;margin-top:10px}
.access-note{display:flex;gap:10px;align-items:flex-start;padding-top:18px;margin-top:9px;border-top:1px solid #ffffff0b}
.access-note>span{font-size:24px;color:#b8b8c4;line-height:1.2}
.access-note p{font-size:16px;color:#b8b8c4;line-height:1.8}
.login-card-foot{display:flex;align-items:center;gap:7px;margin-top:28px;font-size:16px;color:#b8b8c4}
.login-card-foot .status-dot{width:4px;height:4px;background:#8b5d68}
.page-heading{display:flex;align-items:flex-end;justify-content:space-between;padding:36px 0 26px}
.page-heading .section-index{font-size:16px;letter-spacing:2px;color:#b8b8c4}
.page-heading h1{font-size:32px;letter-spacing:-.6px;font-weight:750;margin-top:6px}
.title-dot{color:var(--red);margin-left:3px}
.console-tag{font-size:16px;letter-spacing:1.7px;color:#b8b8c4;padding-bottom:5px}
.status-overview{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:18px;margin-bottom:22px}
.status{display:flex;align-items:center;gap:22px;padding:26px 27px;position:relative;overflow:hidden}
.status:before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:#76303e}
.status.active:before{background:var(--green)}
.status-symbol{display:grid;place-items:center;flex:0 0 58px;height:64px;color:#bc5367;background:linear-gradient(135deg,#38202b,#252028);border:1px solid #59303d;border-radius:16px}
.status-symbol svg{width:28px;height:33px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.status.active .status-symbol{color:var(--green);border-color:#315b48;background:linear-gradient(135deg,#23382f,#1f2b27)}
.status-copy{min-width:0}
.status-copy .eyebrow{font-size:16px;color:#b8b8c4;letter-spacing:1px}
.status h2{font-size:28px;font-weight:700;line-height:1.4;margin:5px 0 7px;letter-spacing:-.6px}
.status p{font-size:16px;line-height:1.7;color:#b8b8c4;max-width:720px}
.state-indicator{width:7px;height:7px;flex:0 0 7px;margin-left:auto;border-radius:50%;background:#8a4453;box-shadow:0 0 0 5px #ed3b5208}
.status.active .state-indicator{background:var(--green);box-shadow:0 0 0 5px #59d69b09}
.metric-card{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 25px;background:linear-gradient(125deg,#212027,#1a1a20)}
.metric-card .eyebrow{font-size:16px;letter-spacing:.5px}
.metric-card strong{display:block;font-size:56px;font-weight:750;letter-spacing:-2px;line-height:1.25;margin-top:5px}
.metric-caption{font-size:16px;letter-spacing:1.3px;color:#b8b8c4}
.metric-icon{width:40px;height:40px;display:grid;place-items:center;color:#73404f;border:1px solid #422a35;background:#2b2029;border-radius:11px}
.metric-icon svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
.console-grid{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:22px;align-items:start}
.control-column{grid-column:2;grid-row:1;display:grid;gap:16px}
.room-card{padding:23px}
.card-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.card-heading .section-index{font-size:16px;letter-spacing:1.5px}
.mini-badge{font-size:16px;padding:2px 6px;border:1px solid #393039;border-radius:4px;color:#b8b8c4;background:#2a222a}
.room-card h2{font-size:24px;letter-spacing:-.2px}
.card-description{color:#b8b8c4;font-size:16px;margin-top:5px}
.readiness{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:22px 0 23px;border:1px solid #303039;border-radius:7px;background:#16161b;padding:12px 5px}
.readiness>div{display:flex;align-items:center;justify-content:center;gap:5px;min-width:0}
.readiness>div+div{border-left:1px solid #303039}
.readiness span{font-size:16px;display:grid;place-items:center;width:22px;height:22px;background:#2b2b34;border:1px solid #3a3a45;border-radius:50%;color:#b8b8c4}
.readiness b{font-size:16px;font-weight:500;color:#b8b8c4;white-space:nowrap}
.readiness i{display:none}
.readiness>div[data-ready=true] span{background:#32242d;border-color:#75404f;color:#ef8a9c}
.readiness>div[data-ready=true] b{color:#dfb4bf}
.room-card label{font-size:16px;color:#acacba}
.room-card input{font-size:18px;padding:11px;min-height:48px}
.save-room{width:100%;margin-top:9px;justify-content:space-between;font-size:18px;min-height:48px;padding:9px 12px}
.save-room span{font-size:18px;color:#b8b8c4}
.protect-toggle{width:100%;margin-top:21px;font-size:18px;min-height:48px}
.protect-toggle.is-enabled{background:#2b222b;border-color:#763246;color:#f5b5c2}
.secondary-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}
.secondary-actions button{font-size:18px;gap:8px;padding:10px 7px;background:#202027;border-color:#34343e}
.secondary-actions button:hover{background:#2d2d36}
.secondary-actions span{color:#b8b8c4;font-size:16px}
#message{min-height:18px;font-size:16px;color:#c5a5ae;margin-top:10px}
.control-note{display:flex;gap:9px;padding-top:16px;border-top:1px solid #ffffff09;margin-top:1px}
.note-icon{display:grid;place-items:center;flex:0 0 13px;height:13px;border:1px solid #686876;border-radius:50%;font-size:16px;line-height:1;color:#b8b8c4;margin-top:2px}
.control-note p{font-size:16px;color:#b8b8c4;line-height:1.9}
.session-card{padding:19px 21px;display:flex;align-items:center;justify-content:space-between;gap:14px}
.session-card .section-index{font-size:16px;letter-spacing:1.2px}
.session-card h3{font-size:16px;margin:4px 0 5px}
.session-card p{font-size:16px;color:#b8b8c4;max-width:170px;line-height:1.8}
.restart-button{font-size:18px;padding:8px 10px;background:transparent;min-height:48px;gap:8px}
.restart-button span{font-size:18px}
.browser{grid-column:1;grid-row:1;overflow:hidden;align-self:stretch;display:flex;flex-direction:column;background:#18181e}
.browser-title{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 25px;border-bottom:1px solid #2a2a33}
.browser-title .section-index{font-size:16px;letter-spacing:1.5px}
.browser-title h2{font-size:20px;margin-top:5px;letter-spacing:-.3px}
.browser-title button{font-size:18px;min-height:48px;padding:9px 14px;background:#30212b;border-color:#723043;color:#ffb5c2}
.browser-title button:hover{background:#4a2936}
.browser-idle{min-height:430px;display:flex;align-items:center;justify-content:center;flex-direction:column;flex:1;padding:40px 28px;background:radial-gradient(ellipse at center,#38202c23,transparent 62%)}
.window-illustration{position:relative;width:275px;max-width:90%;height:174px;border:1px solid #4b303f;border-radius:10px;background:linear-gradient(145deg,#251e29,#1b1b22);box-shadow:0 0 80px #e43b5009;margin:0 0 43px;transform:perspective(800px) rotateY(-8deg) rotateX(4deg)}
.window-bar{height:29px;padding:0 12px;display:flex;gap:4px;align-items:center;border-bottom:1px solid #382b36}
.window-bar i{width:4px;height:4px;background:#62404d;border-radius:50%}
.window-bar i:nth-child(2){background:#493b49}
.window-bar i:nth-child(3){background:#3a3440}
.window-bar>span{width:87px;height:5px;border-radius:4px;background:#382d3a;margin-left:22px}
.window-content{display:flex;align-items:center;justify-content:center;flex-direction:column;height:140px;gap:8px}
.window-shield{display:grid;place-items:center;width:49px;height:53px;background:#3a222d;border:1px solid #643040;border-radius:14px;margin-bottom:4px}
.window-shield svg{width:23px;height:29px;fill:none;stroke:#e36d84;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.window-line{width:89px;height:4px;background:#4b3444;border-radius:4px}
.window-line.short{width:58px;background:#342b38}
.window-chip{position:absolute;right:-20px;bottom:-12px;display:flex;align-items:center;gap:7px;padding:7px 11px;background:#29242e;border:1px solid #4e3644;border-radius:6px;color:#b8b8c4;font-size:16px;box-shadow:0 8px 20px #0003}
.window-chip .status-dot{width:4px;height:4px;background:#c96a80}
.browser-idle h3{font-size:20px;letter-spacing:-.3px;font-weight:600;text-align:center}
.browser-idle>p{font-size:16px;text-align:center;line-height:1.9;color:#b8b8c4;margin-top:11px}
.idle-footnote{font-size:16px;margin-top:23px;letter-spacing:.3px;color:#b8b8c4}
.browser-footer{display:flex;align-items:center;gap:7px;padding:14px 22px;border-top:1px solid #2a2a33;color:#b8b8c4;font-size:16px;margin-top:auto;background:#16161c}
.browser-footer .status-dot{width:4px;height:4px;background:#6a596b}
.browser-footer-label{margin-left:auto;font-size:16px;letter-spacing:1px;color:#b8b8c4}
#viewer{padding:17px 20px 15px}
.viewer-hint{display:flex;gap:8px;align-items:center;font-size:16px;color:#b8b8c4;margin-bottom:14px}
.viewer-hint .status-dot{width:5px;height:5px;background:#bc506a}
#screen-wrap{position:relative;aspect-ratio:1280/900;background:#101013;border:1px solid #33333d;border-radius:7px;overflow:hidden;cursor:crosshair;margin-bottom:14px}
#screen{display:block;width:100%;height:100%;object-fit:contain;user-select:none}
#screen-wait{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:9px;background:#141419;color:#b8b8c4;font-size:16px}
.loading-spinner{width:14px;height:14px;border:2px solid #3d2935;border-top-color:#dd637d;border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}
}
.row{display:flex;gap:9px;align-items:center}
.row input{min-height:48px;font-size:18px}
.row button{min-height:48px;font-size:18px;padding:9px 12px;flex:0 0 auto}
.keyboard-controls{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:11px}
.keyboard-controls>span{font-size:16px;color:#b8b8c4;margin-right:4px}
.keyboard-controls button{min-height:48px;min-width:37px;border-radius:5px;font-size:18px;background:#24242d;padding:4px 9px;border-color:#353540;color:#b8b8c4}
.privacy-hint{font-size:16px;color:#b8b8c4;margin-top:12px}
footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:19px;font-size:16px;color:#b8b8c4}
footer button{min-height:48px;font-size:18px;padding:7px 10px;border-color:transparent;background:transparent;color:#b8b8c4}
footer button:hover{background:#202027;border-color:#33333e}
.site-bottom{display:flex;align-items:center;gap:15px;margin:40px 0 26px;border-top:1px solid #24242c;padding-top:20px}
.site-bottom>span:first-child{font-size:16px;font-weight:750;letter-spacing:1.2px;color:#b8b8c4}
.site-bottom p{font-size:16px;letter-spacing:.4px;color:#b8b8c4}
.bottom-accent{width:18px;height:2px;background:var(--red);margin-left:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[hidden]{display:none!important}
@media(min-width:1550px){.console-grid{grid-template-columns:minmax(0,1fr) 440px}
.browser-idle{min-height:450px}
}
@media(max-width:1120px){main{padding:0 28px}
.login-stage{gap:36px;grid-template-columns:minmax(0,1fr) 370px}
.login-intro h1{font-size:49px}
.login-card{padding:30px 26px}
.console-grid{grid-template-columns:minmax(0,1fr) 325px;gap:17px}
.room-card{padding:21px}
.status-overview{grid-template-columns:minmax(0,1fr) 220px;gap:17px}
.status{gap:16px;padding:24px 21px}
.status h2{font-size:24px}
.status-symbol{flex-basis:49px;height:56px;border-radius:13px}
.metric-card{padding:20px}
.browser-title{padding:20px}
.browser-title button{padding:9px 10px}
.browser-footer-label{display:none}
.signal-visual{width:345px}
.intro-features{gap:10px;font-size:16px}
}
@media(max-width:850px){.topbar{height:87px}
.private-label{display:none}
.login-stage{grid-template-columns:1fr 350px;gap:28px;padding:60px 0}
.login-intro h1{font-size:42px}
.intro-copy{font-size:16px}
.signal-visual{width:285px;height:207px}
.signal-core{width:80px;height:89px}
.tag-left{left:0}
.tag-right{right:0}
.signal-message{width:215px;left:36px;bottom:7px}
.signal-message em{width:70px}
.signal-message b{width:60px}
.intro-features{display:grid;gap:7px}
.console-grid{grid-template-columns:minmax(0,1fr) 300px;gap:15px}
.status-overview{grid-template-columns:minmax(0,1fr) 180px}
.status p{font-size:16px}
.status h2{font-size:24px}
.status-symbol{display:none}
.metric-icon{display:none}
.metric-card strong{font-size:56px}
.browser-title{align-items:flex-start;flex-direction:column;gap:13px}
.browser-title button{width:100%}
.browser-idle{padding:32px 18px}
.window-illustration{width:215px;height:156px}
.window-content{height:122px}
.window-chip{right:-7px}
.browser-idle h3{font-size:18px}
.browser-idle>p{font-size:16px}
.session-card{padding:18px}
.room-card{padding:19px}
.readiness{margin:18px 0}
.readiness b{font-size:16px}
.keyboard-controls button{min-height:48px}
.row{flex-wrap:wrap}
.row button{width:100%}
.browser-footer{font-size:16px;padding:13px 16px}
}
@media(max-width:700px){main{padding:0 20px}
.topbar{height:82px}
.brand{gap:8px}
.brand-mark{width:30px;height:36px}
.brand-mark svg{width:28px;height:32px}
.wordmark{font-size:24px}
.wordmark small{font-size:16px;letter-spacing:1.7px;margin-top:5px}
.cloud-pill{padding:5px 10px;font-size:16px}
.topbar-end{gap:0}
.login-stage{display:flex;flex-direction:column;align-items:stretch;min-height:0;gap:29px;padding:43px 0 26px}
.login-intro h1{font-size:43px;line-height:1.17;margin-top:16px}
.login-intro .eyebrow{font-size:16px;letter-spacing:1.1px}
.intro-copy{font-size:16px;margin-top:18px}
.signal-visual{display:none}
.intro-features{display:flex;gap:12px;font-size:16px;margin-top:22px}
.login-card{padding:25px 23px}
.login-card h2{font-size:28px}
.login-card form{margin-top:26px}
.login-card>p{font-size:16px}
.login-card-foot{margin-top:23px}
.page-heading{padding:28px 0 21px}
.page-heading h1{font-size:28px}
.page-heading .section-index{font-size:16px}
.console-tag{display:none}
.status-overview{grid-template-columns:minmax(0,1fr) 107px;gap:10px;margin-bottom:15px}
.status{padding:18px 17px;gap:0;align-items:flex-start}
.status h2{font-size:24px;margin:5px 0 7px;letter-spacing:-.5px}
.status p{font-size:16px;line-height:1.8}
.status-copy .eyebrow{font-size:16px}
.state-indicator{display:none}
.metric-card{padding:18px 14px;align-items:flex-start}
.metric-card .eyebrow{font-size:16px;letter-spacing:0;white-space:nowrap}
.metric-card strong{font-size:56px;margin-top:10px}
.metric-caption{display:block;font-size:16px;letter-spacing:.5px;margin-top:5px;line-height:1.7}
.console-grid{display:flex;flex-direction:column;gap:15px}
.control-column{width:100%;gap:12px}
.room-card{padding:22px}
.card-heading{margin-bottom:13px}
.card-heading .section-index{font-size:16px}
.room-card h2{font-size:24px}
.card-description{font-size:16px;margin-top:5px}
.readiness{margin:20px 0}
.readiness span{width:22px;height:22px}
.readiness b{font-size:16px}
.room-card label{font-size:16px}
.room-card input{font-size:18px;min-height:48px}
.save-room{min-height:48px;font-size:18px}
.protect-toggle{font-size:18px;min-height:48px;margin-top:20px}
.secondary-actions{gap:9px}
.secondary-actions button{font-size:18px;min-height:48px}
.control-note p{font-size:16px}
.session-card{padding:18px 20px;gap:12px}
.session-card .section-index{font-size:16px}
.session-card h3{font-size:16px}
.session-card p{max-width:190px;font-size:16px}
.restart-button{font-size:18px;min-height:48px;padding:9px 11px}
.browser{width:100%}
.browser-title{flex-direction:row;align-items:center;padding:20px;gap:12px}
.browser-title h2{font-size:20px}
.browser-title .section-index{font-size:16px;letter-spacing:1px}
.browser-title button{width:auto;font-size:18px;min-height:48px;padding:9px 10px}
.browser-idle{min-height:345px;padding:34px 20px}
.window-illustration{width:235px;height:154px;margin-bottom:33px}
.window-content{height:121px}
.window-chip{right:-8px}
.browser-idle h3{font-size:18px}
.browser-idle>p{font-size:16px}
.idle-footnote{font-size:16px;margin-top:16px}
.browser-footer{font-size:16px;padding:13px 17px}
.browser-footer-label{display:none}
#viewer{padding:15px 13px}
.viewer-hint{font-size:16px;line-height:1.8}
.row input{font-size:18px;min-height:48px}
.row button{min-height:48px;font-size:18px}
.keyboard-controls{gap:5px}
.keyboard-controls>span{flex-basis:100%;font-size:16px;margin:0 0 4px}
.keyboard-controls button{flex:1;min-width:38px;min-height:48px;padding:5px;font-size:18px}
.privacy-hint{font-size:16px;line-height:1.8}
footer{font-size:16px;margin-top:16px}
footer button{font-size:18px;min-height:48px;padding:8px}
.site-bottom{gap:10px;margin-top:30px;padding-top:17px}
.site-bottom>span:first-child{font-size:16px}
.site-bottom p{font-size:16px}
.bottom-accent{width:12px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}
}


#view-status{font-size:16px;color:#b0b7c9;margin:10px 0 0}
.status.blocked{border-color:#bb8738}
.status.blocked #state{color:#f0ba66}


/* Large text reflows into one column before the workspace becomes cramped. */
@media(max-width:1200px){
.console-grid{display:flex;flex-direction:column;gap:22px}
.control-column,.browser{width:100%}
.control-column{grid-template-columns:minmax(0,1fr)}
.session-card>div{min-width:0}
}
@media(max-width:900px){
.login-stage{display:flex;flex-direction:column;align-items:stretch;gap:30px;min-height:0}
.login-card{max-width:560px;width:100%;align-self:center}
.signal-visual{display:none}
.intro-features{display:flex;flex-wrap:wrap;gap:12px}
}
@media(max-width:700px){
.topbar{height:auto;min-height:100px;padding:20px 0;flex-wrap:wrap;gap:12px}
.wordmark{font-size:26px}
.cloud-pill{padding:6px 8px}
.status-overview{grid-template-columns:minmax(0,1fr);gap:14px}
.metric-card>div:not(.metric-icon){display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:20px;align-items:center;width:100%}
.metric-card strong{grid-column:2;grid-row:1/3;margin:0}
.metric-card .eyebrow{white-space:normal}
.metric-caption{grid-column:1;grid-row:2;letter-spacing:.3px}
.browser-title{flex-direction:column;align-items:stretch}
.browser-title button,.restart-button{width:100%}
.session-card{flex-direction:column;align-items:stretch;gap:16px}
.session-card p{max-width:none}
.secondary-actions{grid-template-columns:minmax(0,1fr)}
.keyboard-controls button{flex:1 1 28%;min-width:76px;min-height:48px;font-size:18px}
footer{align-items:flex-start;flex-wrap:wrap}
.site-bottom{flex-wrap:wrap;row-gap:8px}
}
@media(max-width:480px){
main{padding:0 14px}
.room-card{padding:20px}
.readiness>div{flex-direction:column;gap:7px}
.readiness b{font-size:16px}
.brand-mark{width:28px}
.wordmark{font-size:24px}
}