.stage>.photo{background:#10130e;}
.stage>.photo:before{display:none;}
.stage>.photo .login-scene{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:1;transform:translateY(-4.5svh) scale(1.1);}
.stage>.photo .login-scene-sign{position:absolute;left:18%;top:1%;z-index:1;width:61.16%;height:61.3%;object-fit:contain;opacity:1;transform:translateY(-4.5svh);filter:drop-shadow(0 12px 20px #090806a8);}
.stage>.photo .login-scene-sign-lit{z-index:2;opacity:0;pointer-events:none;filter:drop-shadow(0 0 14px #ffdb8a9c) drop-shadow(0 0 38px #ffc35a6b);}
.stage>.photo .login-scene-sign-lit.is-lit{opacity:1;}
.stage>.photo.pixel-ready>.login-scene,.stage>.photo.pixel-ready>.login-scene-sign{visibility:hidden;}
.stage>.photo .login-light-rays{position:absolute;inset:0;z-index:3;overflow:hidden;pointer-events:none;}
.stage>.photo .login-light-rays img{position:absolute;left:-35%;top:0;display:block;width:135%;height:100%;object-fit:fill;opacity:0;mix-blend-mode:screen;filter:brightness(1.4);animation:login-light-cycle 20s ease-in-out infinite;will-change:opacity;}
.stage>.photo .login-light-rays img:nth-child(2){animation-delay:-4s;}
.stage>.photo .login-light-rays img:nth-child(3){animation-delay:-8s;}
.stage>.photo .login-light-rays img:nth-child(4){animation-delay:-12s;}
.stage>.photo .login-light-rays img:nth-child(5){animation-delay:-16s;}
.stage>.photo .login-light-rays.pixel-ready img{visibility:hidden;}
.stage>.photo .login-light-rays canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;pointer-events:none;}
@keyframes login-light-cycle{0%,42%,100%{opacity:0}6%,34%{opacity:.72}}
.stage>.photo>.scrim{display:none;}
.stage>.photo .brand{z-index:4;}
.stage>.pane{z-index:5;}
@media(min-width:700px) and (max-width:1280px){
 .stage>.photo .login-scene-sign{left:4%;width:52%;}
}
@media(max-width:699px){
 .stage>.photo .login-scene-sign{left:7%;top:4%;width:86%;height:56.3%;}
}
@media(prefers-reduced-motion:reduce){
 .stage>.photo .login-scene-sign-lit{opacity:1;}
 .stage>.photo .login-light-rays img{animation:none;opacity:0;}
 .stage>.photo .login-light-rays img:first-child{opacity:.65;}
}

/* Figma 58:253 — rugged vertical terminal with the live vault controls on its screen. */
.stage>.pane{place-items:center end;padding:10px clamp(8px,2vw,24px);container-type:inline-size;}
.stage .card{display:grid;place-items:center;width:100%;height:100%;max-height:none;overflow:visible;border:0;border-radius:0;background:transparent;backdrop-filter:none;box-shadow:none;}
.stage .card-in{position:relative;width:100%;height:100%;max-width:none;margin:0;padding:0;display:grid;place-items:center end;overflow:visible;}
.monitor-shell{position:relative;width:min(579px,calc(86svh * .873),128cqw);aspect-ratio:579/663;overflow:hidden;isolation:isolate;}
.monitor-frame{position:absolute;left:0;top:0;width:110.54%;height:144.8%;max-width:none;object-fit:fill;pointer-events:none;user-select:none;}
.monitor-ui{position:absolute;left:27.3%;top:13.2%;width:54.4%;height:75.8%;display:flex;flex-direction:column;min-width:0;color:#7fe205;font-family:Inter,Arial,sans-serif;}
.monitor-ui .back{flex:none;align-self:flex-start;margin:0 0 24px;color:#7fe205;font-size:15px;line-height:1.25;letter-spacing:0;}
.monitor-ui .back:hover{color:#b4ff69;text-shadow:0 0 10px #7fe20570;}
.monitor-ui h1{flex:none;margin:0;font:700 25px/1.12 Inter,Arial,sans-serif;letter-spacing:-.45px;text-align:left;color:#7fe205;white-space:nowrap;}
.monitor-ui .sub{flex:none;margin:1px 0 0;color:#7fe205;font:400 15px/1.25 Inter,Arial,sans-serif;text-align:left;}
.monitor-ui #vault-form{display:flex;flex:1;min-height:0;flex-direction:column;margin:0;}
.monitor-ui .vault-guide{flex:none;margin:8px 0 0;color:#a0d84c;font-size:11px;line-height:1.25;text-align:center;}
.monitor-ui .vault-guide strong{font-weight:600;color:#7fe205;}
.monitor-ui .dial-wrap{flex:1;min-height:136px;display:flex;align-items:center;justify-content:center;margin:0;padding:4px 0;}
.monitor-ui .dial{width:min(174px,100%);aspect-ratio:1;border:0;border-radius:50%;background:transparent;box-shadow:0 10px 22px #0008;}
.monitor-ui .dial-art{inset:0;width:100%;height:100%;object-fit:contain;}
.monitor-ui .dial-center{inset:39%;color:#101010;}
.monitor-ui .dial-value{font-size:clamp(29px,4vw,40px);}
.monitor-ui .selected-row{flex:none;display:flex;align-items:flex-end;justify-content:flex-start;gap:8px;height:24px;margin:0;}
.monitor-ui .code-slot{position:relative;display:block;flex:0 0 48px;width:48px;height:24px;}
.monitor-ui .code-slot output{position:absolute;inset:0 0 2px;display:grid;place-items:center;width:48px;height:21px;border:0;border-radius:0;background:transparent;color:#7fe205;font-size:15px;font-variant-numeric:tabular-nums;}
.monitor-ui .code-slot output.empty{color:#7fe205;}
.monitor-ui .code-slot img{position:absolute;left:0;bottom:0;display:block;width:48px;height:1px;}
.monitor-ui .undo-dial{flex:none;margin:0 0 0 3px;padding:2px 0;color:#7fe205;font-size:14px;line-height:1.2;text-decoration:none;white-space:nowrap;}
.monitor-ui .undo-dial:hover:not(:disabled){color:#b4ff69;text-shadow:0 0 9px #7fe20566;}
.monitor-ui .vault-status{flex:none;min-height:16px;margin:2px 0 0;color:#9fe447;font-size:10px;line-height:1.35;text-align:left;}
.monitor-ui .field{position:relative;flex:none;display:flex;flex-direction:column;gap:2px;margin:3px 0 0;min-width:0;}
.monitor-ui .field label{color:#7fe205;font-size:15px;line-height:1.2;}
.monitor-ui .field input,.monitor-ui .field.password input{height:27px;padding:0 2px;border:0;border-radius:0;background:transparent;color:#d7ffad;font-size:15px;line-height:1;}
.monitor-ui .field input::placeholder{color:#739942;opacity:.8;}
.monitor-ui .field input:focus{outline:0;}
.monitor-ui .field input:focus-visible{outline:1px solid #7fe205;outline-offset:1px;}
.monitor-ui .input-line{display:block;width:315px;height:1px;max-width:none;align-self:flex-start;pointer-events:none;}
.monitor-ui .login-btn{flex:none;align-self:center;width:88%;height:39px;margin:10px 0 0;border:3px solid #7fe205;border-radius:999px;background:transparent;box-shadow:none;color:#7fe205;font-size:15px;font-weight:700;letter-spacing:0;}
.monitor-ui .login-btn:hover:not(:disabled){background:#7fe20518;filter:none;box-shadow:0 0 16px #7fe20550;}
.monitor-ui .login-btn:active:not(:disabled){transform:translateY(1px);}
.monitor-ui .login-btn svg{width:15px;height:15px;stroke:#7fe205;}
.monitor-ui .bottom{flex:none;margin:8px 0 0;color:#a8da69;font-size:10px;line-height:1.3;text-align:center;}
.monitor-ui .bottom button{color:#7fe205;font-size:10px;text-decoration:none;}
.monitor-ui .status{flex:none;margin:3px 0 0;padding:4px 6px;border:1px solid #7fe20566;border-radius:4px;background:#111b08;color:#b8fa71;font-size:10px;line-height:1.3;}
.monitor-ui .status:empty{display:none;}
.monitor-ui .password-confirm[hidden]{display:none;}
@media(max-height:720px){
 .monitor-shell{width:min(579px,calc(92svh * .873),128cqw);}
 .monitor-ui .back{margin-bottom:15px;font-size:13px;}
 .monitor-ui h1{font-size:22px;}
 .monitor-ui .sub{font-size:13px;}
 .monitor-ui .dial-wrap{min-height:105px;}
 .monitor-ui .dial{width:min(146px,100%);}
 .monitor-ui .input-line{transform:scaleX(.86);transform-origin:left center;}
}
@media(min-width:700px) and (max-width:1280px){.monitor-shell{width:min(579px,calc(86svh * .873),128cqw);}}
@media(max-width:699px){
 .stage>.pane{place-items:center;padding:8px;}
 .stage .card-in{place-items:center;}
 .monitor-shell{width:min(579px,calc(86svh * .873));}
 .monitor-ui .back{margin-bottom:24px;font-size:15px;}
 .monitor-ui h1{font-size:24px;}
 .monitor-ui .sub{font-size:14px;}
 .monitor-ui .dial-wrap{min-height:136px;}
 .monitor-ui .dial{width:min(170px,100%);}
 .monitor-ui .input-line{transform:none;}
}
@media(max-height:720px) and (max-width:699px){
 .monitor-shell{width:min(579px,calc(92svh * .873));}
 .monitor-ui .back{margin-bottom:13px;font-size:13px;}
 .monitor-ui h1{font-size:21px;}
 .monitor-ui .sub{font-size:12px;}
 .monitor-ui .dial-wrap{min-height:102px;}
 .monitor-ui .dial{width:min(130px,100%);}
 .monitor-ui .input-line{transform:scaleX(.8);transform-origin:left center;}
 .monitor-ui .login-btn{height:35px;margin-top:7px;font-size:13px;}
}
@media(min-width:700px){
 .stage>.pane{place-items:end end;padding-bottom:0;}
 .stage .card,.stage .card-in{place-items:end end;}
 .monitor-shell{width:min(660px,calc(100svh * .873),128cqw);}
}
@media(min-width:700px) and (max-height:720px){
 .monitor-shell{width:min(660px,calc(92svh * .873),128cqw);}
}
