html { color-scheme:dark; }
body { overflow-x:hidden; }
/* Remote controls are gesture surfaces, including the labels inside the touchpad. */
#session-frame, #session-frame * { -webkit-user-select:none;user-select:none;-webkit-touch-callout:none; }
#session-frame input, #session-frame textarea, #session-frame [contenteditable="true"], #session-frame [contenteditable="true"] * {
  -webkit-user-select:text;user-select:text;-webkit-touch-callout:default;
}
#session-frame canvas, #session-frame video, #session-frame img, #session-frame svg { -webkit-user-drag:none; }
.site-header { height:76px;padding:0 max(24px,calc((100vw - 1060px)/2)); }
.brand { font-size:23px;letter-spacing:-.7px;gap:10px; }
.brand img { border-radius:8px; }
.edition-badge { display:inline-block;margin-left:6px;padding:4px 8px;border:1px solid #83dfd038;border-radius:7px;font-size:11px;letter-spacing:.5px;vertical-align:middle;color:#a4e7dc;background:#68d7c80a; }
.premium-link { font-size:12px;color:#b3c7dd;padding:10px 0 10px 12px; }
.lite-home { max-width:500px;padding:44px 24px 32px; }
.hero-copy h1 { font-size:38px;letter-spacing:-1.5px;line-height:1.18;margin:14px 0; }
.hero-copy p { font-size:13px; }
.hero-copy .eyebrow { font-size:9px;letter-spacing:2px; }
.connect-card { margin-top:26px;padding:26px;border-radius:20px; }
.lite-consent { display:flex;align-items:flex-start;gap:8px;margin-top:18px!important;font-size:11px!important;line-height:1.6!important; }
.lite-consent svg { width:15px;height:15px;color:#97d9cf;margin-top:1px; }
.lite-download { margin:22px 3px 0;color:#a4bad0;font-size:12px;line-height:1.7; }
.lite-download summary { cursor:pointer;text-align:center; }
.lite-download>p { margin:16px 0 0; }
.lite-download .download-button { margin-top:16px; }
.download-alternative { display:block;text-align:center;color:#b3d6ff;text-decoration:underline;padding:10px; }
.download-signature { font-size:11px; }
body.in-session { overflow:hidden;height:var(--lite-height,100dvh); }
.in-session .site-header,.in-session .background { display:none; }
.in-session main { position:fixed;inset:0;height:var(--lite-height,100dvh); }
#viewer { width:100%;height:100%;max-width:none;padding:0;margin:0; }
#session-frame { display:flex;flex-direction:column;height:100%;border:0;border-radius:0;box-shadow:none; }
.session-heading { flex:none;height:45px;min-height:45px;margin:0;padding:6px 14px;background:#0c1728;border-bottom:1px solid #a0caff18;gap:10px; }
.session-computer { flex:1;min-width:0;gap:0; }.session-computer h1 { font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
#session-status { display:none; }
.connection-badge { flex:none;font-size:10px;white-space:nowrap; }.connection-badge #connection-label { max-width:130px;overflow:hidden;text-overflow:ellipsis; }
.session-heading .button-danger { min-height:32px;padding:5px 9px;font-size:11px; }
.session-heading .button-danger svg { width:15px;height:15px; }
.screen-viewport { flex:1;min-height:0;position:relative;overflow:hidden;background:#050a12; }
#screen-area { position:absolute;inset:0;display:block;width:100%;height:100%;min-height:0;max-height:none;aspect-ratio:auto;overflow:auto;overscroll-behavior:contain;background:#050a12;scrollbar-width:thin;touch-action:none; }
#screen-surface { position:relative;overflow:hidden; }
#screen-area canvas { position:absolute;display:block;max-width:none;max-height:none;object-fit:fill;touch-action:none; }
#screen-area .screen-message { position:absolute;inset:0;padding:18px; }
.pan-hint { position:absolute;left:10px;right:10px;top:8px;z-index:3;pointer-events:none;font-size:10px;text-align:center;color:#e1edfc;background:#091526bd;border:1px solid #b8d6ff22;padding:5px 9px;border-radius:8px;width:fit-content;max-width:calc(100% - 20px);margin:auto;backdrop-filter:blur(8px); }
.lite-controls { flex:none;background:#0c1728;border-top:1px solid #a0caff25;padding-bottom:env(safe-area-inset-bottom); }
.session-toolbar { flex:none;min-height:45px;flex-wrap:nowrap;padding:5px 12px;gap:12px;background:transparent;border:0; }
.screen-zoom { display:flex;align-items:center;gap:3px; }
.zoom-button { font-size:21px;line-height:1;width:33px;height:33px;min-width:33px;background:#a6d0ff0a;border:1px solid #a6d0ff20;border-radius:8px; }
.scale-control select { max-width:126px;font-size:11px;height:33px;padding:5px 7px; }
.viewer-actions { gap:4px; }.viewer-actions .icon-button { display:flex;width:auto;min-width:34px;height:34px;gap:5px;padding:6px 9px;font-size:11px;border-radius:8px; }.viewer-actions .icon-button span { display:inline;font-size:11px; }
.viewer-actions .icon-button svg { width:17px;height:17px; }
.keyboard-panel { padding:7px 14px 12px;background:transparent;border:0; }
.special-keys { flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin; }.special-keys button { flex:none;min-height:35px;min-width:36px;touch-action:manipulation; }
.touchpad-panel { position:relative;align-self:auto;width:100%;max-width:760px;margin:0 auto;padding:0 14px 10px;background:transparent;border:0;border-radius:0; }
#touchpad { height:110px;min-height:0;display:flex;align-items:center;justify-content:center;border:1px solid #95c8f147;border-radius:13px;background:radial-gradient(ellipse at top,#1b3a5544,transparent 70%),#111f31; }
.pad-caption { display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;user-select:none; }
.pad-caption strong { font-size:13px;color:#dcecff;font-weight:550; }.pad-caption>span { font-size:11px;color:#9eb7d0; }.pad-caption small { font-size:10px;color:#7e9bb8; }
.touchpad-buttons { display:flex;gap:8px;margin-top:7px; }.touchpad-buttons button { flex:1;min-height:38px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:#a6d0ff0b;border:1px solid #a6d0ff24;border-radius:9px;font-size:11px;touch-action:none; }.touchpad-buttons strong { font-weight:500; }.touchpad-buttons small { font-size:9px;color:#98b0c9; }
#touchpad[aria-disabled=true] { opacity:.5; }
.toast { position:fixed;top:53px;bottom:auto;left:50%;transform:translateX(-50%);max-width:calc(100vw - 32px);z-index:30; }
@media(max-width:600px) {
 .site-header { height:66px;padding:0 18px; }.brand { font-size:20px; }.brand img { width:27px;height:27px; }.premium-link { font-size:10px; }.edition-badge { font-size:10px;margin-left:3px; }
 .lite-home { padding:30px 20px; }.hero-copy h1 { font-size:33px; }.connect-card { padding:22px; }
 .session-heading { height:auto;min-height:42px;padding:5px 10px;padding-top:max(5px,env(safe-area-inset-top));gap:8px; }.session-computer h1 { font-size:11px; }.connection-badge { font-size:9px;gap:5px; }.connection-badge #connection-label { max-width:95px; }
 .session-heading .button-danger { width:31px;height:31px;min-height:31px;padding:6px; }.session-heading .button-danger span { display:none; }
 .session-toolbar { min-height:43px;padding:5px 8px;gap:6px; }.screen-zoom { gap:2px; }.zoom-button { width:29px;min-width:29px;height:32px; }.scale-control select { width:100px;max-width:100px;font-size:10px; }
 .viewer-actions { gap:2px; }.viewer-actions .icon-button { padding:6px;min-width:30px;gap:4px; }.viewer-actions .icon-button span { font-size:10px; }.viewer-actions .icon-button svg { width:16px;height:16px; }
 .keyboard-panel { padding:5px 10px 9px; }.touchpad-panel { padding:0 10px 9px; }#touchpad { height:106px; }.pan-hint { font-size:9px; }
}
@media(max-width:360px) { .viewer-actions #toggle-touchpad svg,.viewer-actions #toggle-keyboard svg { display:none; }.scale-control select { width:92px;max-width:92px; } }
@media(max-height:500px) and (orientation:landscape) {
 .session-heading { min-height:35px;height:35px;padding-block:3px; }.session-heading .button-danger { min-height:27px;height:27px; }
 .session-toolbar { min-height:36px;padding-block:2px; }.touchpad-panel { max-width:620px;padding-bottom:5px;display:flex;gap:8px; }#touchpad { flex:1;height:65px; }
 .touchpad-buttons { flex:0 0 180px;margin:0;gap:6px; }.touchpad-buttons button { min-height:30px;font-size:10px; }.touchpad-buttons small { font-size:8px; }.pad-caption small { display:none; }
 .keyboard-panel { padding-block:3px; }.pad-caption strong { font-size:11px; }.pad-caption>span { font-size:10px; }
}