:root{color-scheme:dark;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;background:#10151f;color:#e8edf5}*{box-sizing:border-box}body{margin:0}header{display:flex;justify-content:space-between;align-items:center;padding:24px 5vw;border-bottom:1px solid #293246;gap:20px}h1{font-size:22px;margin:6px 0}.badge{font-size:10px;letter-spacing:3px;color:#7dd3c7}#status{font-size:13px;color:#9ecac3;max-width:50%}main{max-width:1440px;margin:auto;padding:24px}#intro{padding:48px 0 64px;max-width:700px}h2{font-size:clamp(26px,5vw,42px);letter-spacing:-1.5px}p{line-height:1.7;color:#aebbcf}button{border:1px solid #3b4b65;background:#202d42;color:#edf3ff;border-radius:9px;padding:12px 16px;cursor:pointer;font:inherit}button:hover{background:#31425e}button:disabled{opacity:.4;cursor:wait}#connect{background:#7dd3c7;color:#102724;border:0;font-weight:700;margin-top:18px}#screen{background:#06090f;border:1px solid #293246;border-radius:12px;overflow:hidden;text-align:center}video,canvas{display:block;width:100%;max-height:75vh;object-fit:contain;touch-action:none;outline:none}nav{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}form{display:flex;gap:8px}input{flex:1;min-width:0;padding:14px;border:1px solid #3b4b65;border-radius:9px;background:#141e2e;color:white;font:inherit}.hint{font-size:12px}[hidden]{display:none!important}@media(max-width:600px){header{padding:16px}main{padding:12px}button{font-size:12px;padding:12px}video,canvas{max-height:65vh}#status{font-size:11px}h1{font-size:18px}}

.devices{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}.device-card,.file-panel{padding:22px;border:1px solid #293246;border-radius:12px;background:#141e2e;margin:20px 0}.device-card h2,.file-panel h2{font-size:22px;letter-spacing:0}.file-panel form{margin:14px 0}.file-panel a{color:#7dd3c7;word-break:break-all}progress{width:100%;margin:12px 0}
select,textarea{font:inherit;color:inherit;background:#141e2e;border:1px solid #3b4b65;border-radius:9px;padding:10px;min-width:0}textarea{resize:vertical;width:100%;font-size:16px}button{min-height:44px}button[aria-pressed=true]{background:#7dd3c7;color:#102724;border-color:#7dd3c7}summary{cursor:pointer;padding:12px 0;color:#a5d9d0}details form{margin:12px 0}.rename-form{display:flex}.rename-form input{width:100%}#workspace:fullscreen{background:#10151f;overflow:auto;padding:8px;padding-bottom:env(safe-area-inset-bottom)}#workspace:fullscreen #screen-viewport{max-height:68dvh}.control-bar{align-items:center}.compact{display:flex;align-items:center;gap:6px}.keyboard-row{display:flex;align-items:stretch;gap:8px;position:sticky;bottom:0;background:#10151f;padding:8px 0;z-index:3}.keyboard-row textarea{min-height:48px;max-height:120px;resize:none}#screen-viewport{overflow:auto;max-height:70dvh;overscroll-behavior:contain}#screen-content{position:relative;width:100%;min-height:1px}#remote-cursor{position:absolute;pointer-events:none;color:#fff;font-size:25px;line-height:1;text-shadow:0 0 3px #000,0 0 3px #000;transform:translate(-3px,-3px);z-index:2}#shortcuts,#clipboard-panel{padding:8px 14px;background:#141e2e;border:1px solid #293246;border-radius:10px;margin:12px 0}#shortcut-form{display:flex;align-items:center;flex-wrap:wrap}#shortcut-form label{display:flex;align-items:center;gap:4px;white-space:nowrap}#shortcut-form input[type=checkbox],#clipboard-panel input[type=checkbox]{flex:none;min-width:18px;min-height:18px}#shortcut-key{flex:1;min-width:130px}.key-bar{gap:6px}.key-bar button{min-width:44px;padding:10px}#clipboard-panel h2{font-size:18px;letter-spacing:0}#input-status{min-height:22px}#tools{padding-bottom:env(safe-area-inset-bottom)}#zoom-level{min-width:45px;text-align:center}.hint{overflow-wrap:anywhere}@media(max-width:600px){header{padding:10px 12px}main{padding:8px}.control-bar{gap:6px;margin:8px 0}.control-bar button{padding:9px;font-size:12px}.key-bar{display:flex;flex-wrap:nowrap;overflow-x:auto;padding-bottom:5px}.key-bar button{flex-shrink:0}.file-panel{padding:14px}.file-panel form{flex-wrap:wrap}.file-panel form input{flex-basis:100%}.keyboard-row{padding:6px 0}#screen-viewport{max-height:60dvh}#workspace:fullscreen #screen-viewport{max-height:55dvh}#clipboard-panel nav button{flex:1 1 44%}.compact select{max-width:110px}}

.typing-field{flex:1;min-width:0;position:relative;display:flex}.typing-field span{position:absolute;left:12px;top:14px;pointer-events:none;color:#8295ad;font-size:14px}.typing-field:focus-within span{opacity:.3}.typing-field textarea{width:100%;min-width:0}.keyboard-row button{flex-shrink:0;white-space:nowrap}

.typing-field.composing span{display:none}

dialog{max-width:min(520px,90vw);background:#141e2e;color:#e8edf5;border:1px solid #3b4b65;border-radius:14px;padding:24px}dialog::backdrop{background:#000b}dialog h2{font-size:22px;letter-spacing:0}
