*{box-sizing:border-box}
:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#090d16;color:#ecedf1}
body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 65% 30%,#19233c 0,transparent 65%)}
[hidden]{display:none!important}
a{color:#c1c9df;text-decoration:none}
a:hover{color:#fff}
button,input{font:inherit}
button,a,input{touch-action:manipulation}
button{cursor:pointer}
:focus-visible{outline:3px solid #b7c8ff;outline-offset:4px}
#gate{max-width:520px;margin:auto;padding:32px 24px 48px}
.back{display:inline-block;font-size:14px;margin-bottom:32px}
.card{padding:34px;border:1px solid #323c51;border-radius:20px;background:#111725ed;box-shadow:0 32px 80px #0003}
.orbit{height:70px;width:112px;border:1px solid #576584;border-radius:50%;transform:rotate(-22deg);margin-bottom:30px;position:relative}
.orbit i{position:absolute;width:16px;height:16px;border-radius:50%;background:#b9a9e9;left:5px;top:9px;box-shadow:0 0 22px #a799ec66}
.orbit i:nth-child(2){left:88px;top:40px;background:#80ccbf;width:11px;height:11px}
.orbit i:nth-child(3){left:48px;top:26px;background:#a5b8ef;width:20px;height:20px}
.eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#a4b1d0;margin:0 0 18px}
h1{font-size:clamp(36px,7vw,46px);font-weight:500;letter-spacing:-.04em;line-height:1.12;margin:0 0 18px}
.intro{color:#b8bfd0;line-height:1.6;margin:0 0 26px;font-size:15px}
label{display:block;font-size:14px;margin-bottom:10px}
input{width:100%;padding:13px;background:#090e1b;border:1px solid #586680;border-radius:7px;color:#fff}
#key-help,.privacy{font-size:12px;line-height:1.6;color:#a6afc3}
#unlock{display:flex;justify-content:space-between;width:100%;margin-top:20px;border:0;border-radius:7px;padding:14px 16px;background:#c4d2f5;color:#11192a;font-weight:700}
#unlock:hover{background:#d8e2fa}
#unlock:disabled{opacity:.65;cursor:wait}
.file-option{margin:18px 0 8px;color:#b8bfd0;font-size:12px}
#key-file{font-size:12px;padding:8px}
#error{min-height:1.3em;font-size:13px;color:#ffb7af;line-height:1.5;margin:12px 0}
.privacy{padding-top:18px;border-top:1px solid #30394d;margin:0}
#workspace{position:fixed;inset:0;z-index:2;background:#090d16;display:flex;flex-direction:column}
header{display:flex;align-items:center;gap:20px;flex-wrap:wrap;flex:none;padding:10px 18px;background:#101622;border-bottom:1px solid #293348;font-size:13px}
header nav{display:flex;gap:4px;margin:auto}
header button{background:transparent;color:#bec6d7;border:1px solid transparent;border-radius:6px;padding:9px 12px;white-space:nowrap}
header button[aria-pressed=true]{background:#29354d;color:#fff}
header button:hover{background:#263148;color:#fff}
#lock{border-color:#44506a}
#snapshot-label{width:100%;margin:0;color:#a2adc3;font-size:11px;text-align:center;line-height:1.5}
#canvas-host{flex:1;min-height:0}
iframe{display:block;border:0;width:100%;height:100%;background:#090d16}
@media(max-width:550px){#gate{padding:22px 16px}.card{padding:26px}.back{margin-bottom:24px}header{gap:8px;padding:8px}header nav{order:3;width:100%;justify-content:center}header>a{margin-right:auto}#snapshot-label{order:4}header button{padding:9px}}