/* The complete instrument reveals once its physical layers are ready. */
.accessGate:not(.agOut){background:#080b10}
.accessGate::before,.accessGate::after,.accessGate .agFrame,.accessGate .agCase,.accessGate .agModule::before{display:none!important}
.accessGate .agModule{--instrument-controls-width:252px;--instrument-heading:28px;--instrument-heading-tracking:1.5px;position:relative;width:280px;min-height:0;padding:0;gap:12px;border:0;background:transparent;box-shadow:none;transform:translateY(-38px)}
.accessGate .agModule .agBrand{width:var(--instrument-controls-width);height:36px;min-height:36px;flex:none;align-self:center;justify-content:center;padding:0;gap:0;border:0;background:none;box-shadow:none}
.accessGate .agBrand::before,.accessGate .agBrand::after{display:none}
.accessGate .agModule .agBrand b,.accessGate .agModule .agVerdict{display:block;box-sizing:border-box;width:var(--instrument-controls-width);height:36px;font:800 var(--instrument-heading)/36px var(--fb,Arial,sans-serif);letter-spacing:var(--instrument-heading-tracking);text-align:center;white-space:nowrap;color:#ce1833;background:none;-webkit-text-fill-color:currentColor;filter:none;text-shadow:0 1px 2px #0008}
.accessGate .agPad{grid-template-columns:repeat(3,76px);gap:12px;margin:0}
.accessGate .agKey{height:55px;font:800 30px 'JetBrains Mono',monospace;letter-spacing:0;border-radius:4px;background:#d8e0e8}
.ssInstrumentReady .accessGate .agKey,.ssInstrumentReady .accessGate .agKey.grant,.ssInstrumentReady .accessGate .agKey.hit,.ssInstrumentReady .accessGate .agPad.busy .agKey{color:#080d14!important;opacity:1!important;background:transparent!important;border-color:transparent!important;box-shadow:none!important;text-shadow:none!important;-webkit-text-stroke:.3px #080d14}
.ssInstrumentReady .accessGate .agKey::after{background:transparent!important}
.ssInstrumentReady .accessGate .agKey:active{transform:none}
.ssInstrumentReady .accessGate .agKey.sm{font-size:18px;letter-spacing:1px;color:#b80a24!important;-webkit-text-stroke:0;transition:background-color 140ms,color 140ms}
.accessGate .agModule .agInput{box-sizing:border-box;width:var(--instrument-controls-width);height:47px;min-height:47px;padding:0;font:800 28px 'JetBrains Mono',monospace;line-height:1;letter-spacing:12px;text-indent:12px;color:#fff!important;text-shadow:none;background:#111b27;border:1px solid #acb8c5}
.ssInstrumentReady .accessGate .agInput{background:transparent!important;box-shadow:none!important;border-color:transparent!important;animation:none!important}
.accessGate .agInput.grant{color:#fff!important}
.accessGate .agModule .agFeedback{position:relative;top:auto;left:auto;transform:none;width:var(--instrument-controls-width);height:64px;min-height:64px;flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none}
.accessGate .agModule .agFeedback .agVerdict{flex:none;color:#ce1833;text-shadow:none}
.accessGate .agModule .agFeedback.granted .agVerdict{color:#006e3b}
.ssInstrument{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;transform-origin:50% calc(50% - 38px)}
.ssInstrument.playing{z-index:10000}
.ssInstrumentReady .accessGate{background:transparent!important;isolation:isolate}
.ssInstrumentReady .accessGate .agModule{z-index:2;visibility:visible}
html:not(.ssInstrumentReady):not(.ssInstrumentFallback) .accessGate .agModule{visibility:hidden;pointer-events:none}
.ssInstrumentCurtain{display:none}


@media(prefers-reduced-motion:reduce){.accessGate .agKey.sm{transition:none!important}}


/* The five live lenses sit in the actual lower hardware bay. */
.accessGate .agLedBank{position:absolute;inset:0;z-index:3;pointer-events:none}
.accessGate .agLed{position:absolute;display:block;border-radius:50%;pointer-events:none}
.accessGate .agLed::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(ellipse at 32% 22%,#fff 0%,#ffd1cf 7%,#ff776f 15%,#d50a25 42%,#710010 75%,#350006 100%);box-shadow:0 0 6px #ff1c3c80,inset 0 -1px 1px #350006;opacity:0;transition:opacity 180ms ease-out}
.accessGate .agLed.lit::after{opacity:1}
.accessGate .agLedBank.success .agLed::after{background:radial-gradient(ellipse at 32% 22%,#fff 0%,#c8ffdb 7%,#63f89a 15%,#0bad47 42%,#024c1c 75%,#01250c 100%);box-shadow:0 0 5px #25ff7566;animation:agLedPulse 440ms ease-in-out infinite}
.accessGate .agLedBank.alarm .agLed::after{animation:agLedPulse 600ms ease-in-out infinite}
@keyframes agLedPulse{0%,30%,100%{opacity:1}60%,80%{opacity:.14}}
.accessGate .agModule .agFeedback.granted .agVerdict{color:#006e3b;text-shadow:none}
@media(prefers-reduced-motion:reduce){.accessGate .agLed::after{transition:none}.accessGate .agLedBank.success .agLed::after,.accessGate .agLedBank.alarm .agLed::after{animation:none;opacity:1}}

/* Fit controls within the plate-sized bezel without reducing numeral readability. */




/* Preserve text size on the smallest fully fitted portrait panel. */


/* Component sizing follows the available instrument diameter, including tablets. */
.accessGate .agModule.agSmall{--instrument-controls-width:180px;--instrument-heading:21px;--instrument-heading-tracking:.45px;width:204px;gap:4px}
.accessGate .agModule.agSmall .agBrand,.accessGate .agModule.agSmall .agBrand b,.accessGate .agModule.agSmall .agVerdict{height:27px;min-height:27px;line-height:27px}
.accessGate .agModule.agSmall .agPad{grid-template-columns:repeat(3,56px);column-gap:6px;row-gap:5px}
.accessGate .agModule.agSmall .agKey{height:30px;font-size:26px}
.accessGate .agModule.agSmall .agKey.sm{font-size:16px;letter-spacing:.5px}
.accessGate .agModule.agSmall .agInput{height:34px;min-height:34px;font-size:25px;letter-spacing:10px;text-indent:10px}
.accessGate .agModule.agSmall .agFeedback{height:55px;min-height:55px;gap:4px}
.accessGate .agModule.agMicro{--instrument-controls-width:162px;--instrument-heading:19px;--instrument-heading-tracking:.1px;gap:2px}
.accessGate .agModule.agMicro .agBrand,.accessGate .agModule.agMicro .agBrand b,.accessGate .agModule.agMicro .agVerdict{height:24px;min-height:24px;line-height:24px}
.accessGate .agModule.agMicro .agPad{grid-template-columns:repeat(3,50px);row-gap:3px}
.accessGate .agModule.agMicro .agKey{height:20px;font-size:24px}
.accessGate .agModule.agMicro .agKey.sm{font-size:16px}
.accessGate .agModule.agMicro .agInput{height:26px;min-height:26px;font-size:24px}
.accessGate .agModule.agMicro .agFeedback{height:46px;min-height:46px;gap:0}

.ssAmbient{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden;contain:strict}
.ssAmbient.playing{z-index:10002}
.ssMetalPulse{position:absolute;pointer-events:none;opacity:0;mix-blend-mode:screen;will-change:opacity}
@media(prefers-reduced-motion:reduce){.ssMetalPulse{display:none}}

/* The removed counter makes room for taller keycaps and a single fixed verdict line. */
.accessGate .agModule .agFeedback{height:36px;min-height:36px;gap:0}
.accessGate .agModule.agCompact{--instrument-controls-width:234px;gap:7px}
.accessGate .agModule.agCompact .agPad{grid-template-columns:repeat(3,70px);column-gap:12px;row-gap:8px}
.accessGate .agModule.agCompact .agKey{height:47px}
.accessGate .agModule.agCompact .agInput{height:42px;min-height:42px}
.accessGate .agModule.agSmall{gap:5px}
.accessGate .agModule.agSmall .agKey{height:36px}
.accessGate .agModule.agSmall .agFeedback{height:27px;min-height:27px;gap:0}
.accessGate .agModule.agMicro{gap:3px}
.accessGate .agModule.agMicro .agKey{height:26px}
.accessGate .agModule.agMicro .agFeedback{height:24px;min-height:24px;gap:0}
.accessGate .agCaret{background:#ce1833}
/* Nameplate and entry glass use the same dimensions as the key height. */
.accessGate .agModule{--instrument-panel-height:55px}
.accessGate .agModule.agCompact{--instrument-panel-height:47px}
.accessGate .agModule.agSmall{--instrument-panel-height:36px}
.accessGate .agModule.agMicro{--instrument-panel-height:26px}
.accessGate .agModule .agBrand,.accessGate .agModule .agBrand b,.accessGate .agModule .agInput{height:var(--instrument-panel-height)!important;min-height:var(--instrument-panel-height)!important}
.accessGate .agModule .agBrand b{line-height:var(--instrument-panel-height)!important}
/* One overlay owns hover/press feedback. No moving geometry or competing glow. */
.ssInstrumentReady .accessGate .agKey{isolation:isolate;transform:none!important;outline:0!important;transition:color 130ms ease!important}
.ssInstrumentReady .accessGate .agKey::after{inset:1px;z-index:-1;border-radius:3px;background:#b81730!important;box-shadow:inset 0 1px 0 #ff9aa54d!important;opacity:0;transition:opacity 130ms ease!important}
.ssInstrumentReady .accessGate .agKey.hit::after,.ssInstrumentReady .accessGate .agKey:active::after,.ssInstrumentReady .accessGate .agKey:focus-visible::after{opacity:1}
.ssInstrumentReady .accessGate .agKey.hit,.ssInstrumentReady .accessGate .agKey:active,.ssInstrumentReady .accessGate .agKey:focus-visible{color:#fff!important;-webkit-text-stroke:0}
@media(hover:hover){
 .ssInstrumentReady .accessGate .agPad:not(.busy) .agKey:hover::after{opacity:1}
 .ssInstrumentReady .accessGate .agPad:not(.busy) .agKey:hover{color:#fff!important;-webkit-text-stroke:0}
}
@media(prefers-reduced-motion:reduce){.ssInstrumentReady .accessGate .agKey,.ssInstrumentReady .accessGate .agKey::after{transition:none!important}}

/* Three matching instrument windows, with a larger desktop keypad. */
.accessGate .agModule.agCompact{--instrument-controls-width:252px;--instrument-panel-height:50px;gap:8px}
.accessGate .agModule.agCompact .agPad{grid-template-columns:repeat(3,76px);column-gap:12px;row-gap:8px}
.accessGate .agModule.agCompact .agKey{height:50px}
.accessGate .agModule.agSmall{--instrument-controls-width:186px}
.accessGate .agModule.agSmall .agPad{grid-template-columns:repeat(3,58px);column-gap:6px}
.accessGate .agModule.agMicro{--instrument-controls-width:168px}
.accessGate .agModule.agMicro .agPad{grid-template-columns:repeat(3,52px)}
.accessGate .agModule .agFeedback,.accessGate .agModule .agVerdict{height:var(--instrument-panel-height)!important;min-height:var(--instrument-panel-height)!important;line-height:var(--instrument-panel-height)!important}
.accessGate .agModule .agVerdict{font-family:'JetBrains Mono',monospace;font-size:calc(var(--instrument-heading) - 2px);letter-spacing:0}
.accessGate .agModule.agSmall{gap:3px}
.accessGate .agModule.agSmall .agPad{row-gap:4px}
.accessGate .agModule .agFeedback.granted .agVerdict{color:#33bd76}

.accessGate .agModule.agCompact{--instrument-panel-height:47px;gap:7px}
.accessGate .agModule.agCompact .agPad{row-gap:7px}
.accessGate .agModule.agCompact .agKey{height:47px}

/* A single glass readout owns digits, verification and verdicts. */
.accessGate .agModule .agInput{position:relative;display:flex;align-items:center;justify-content:center;letter-spacing:0;text-indent:0;padding:0 6px 5px;overflow:hidden}
.accessGate .agModule .agInput .agReadout{display:block;white-space:nowrap;text-align:center;letter-spacing:7px;text-indent:7px;line-height:1}
.accessGate .agModule .agInput.agStatus{padding:0 4px;font-family:var(--fb,Arial,sans-serif);font-size:calc(var(--instrument-heading) - 2px);color:#ce1833!important}
.accessGate .agModule .agInput.agStatus .agReadout{letter-spacing:0;text-indent:0}
.accessGate .agModule .agInput.agStatus.grant{color:#33bd76!important}
.accessGate .agInput::after{display:none!important}
.agDigitLights{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);display:flex;gap:7px;pointer-events:none}
.agDigitLights i{display:block;width:23px;height:3px;border-radius:3px;background:#391820;box-shadow:inset 0 1px 1px #000b;transition:background-color 160ms ease,box-shadow 160ms ease}
.agDigitLights i.lit{background:linear-gradient(#ff8a96,#d5213b);box-shadow:0 0 5px #d5213b70,inset 0 1px 0 #ffbac240}
.agStatus .agDigitLights{visibility:hidden}
.accessGate .agModule.agSmall .agDigitLights i{width:17px;height:2px}
.accessGate .agModule.agMicro{--instrument-controls-width:156px;--instrument-panel-height:24px;gap:4px}
.accessGate .agModule.agMicro .agPad{grid-template-columns:repeat(3,48px);row-gap:2px}
.accessGate .agModule.agMicro .agKey{height:24px}
.accessGate .agModule.agMicro .agInput .agReadout{font-size:22px}
.accessGate .agModule.agMicro .agInput.agStatus .agReadout{font-size:17px}
.accessGate .agModule.agMicro .agDigitLights{bottom:3px}
@media(prefers-reduced-motion:reduce){.agDigitLights i{transition:none}}
.accessGate .agModule.agSmall:not(.agMicro){--instrument-controls-width:180px}
.accessGate .agModule.agSmall:not(.agMicro) .agPad{grid-template-columns:repeat(3,56px);row-gap:3px}

/* Keep the controls proportional to the same physical aperture on larger displays. */
.accessGate .agModule:not(.agSmall){--instrument-controls-width:calc(252px * var(--instrument-scale));--instrument-heading:calc(28px * var(--instrument-scale));--instrument-heading-tracking:calc(1.5px * var(--instrument-scale));--instrument-panel-height:calc(47px * var(--instrument-scale));width:calc(280px * var(--instrument-scale));gap:calc(19px * var(--instrument-scale))}
.accessGate .agModule:not(.agSmall) .agPad{grid-template-columns:repeat(3,calc(76px * var(--instrument-scale)));column-gap:calc(12px * var(--instrument-scale));row-gap:calc(7px * var(--instrument-scale))}
.accessGate .agModule:not(.agSmall) .agKey{height:calc(47px * var(--instrument-scale));font-size:calc(30px * var(--instrument-scale))}
.accessGate .agModule:not(.agSmall) .agKey.sm{font-size:calc(18px * var(--instrument-scale))}
.accessGate .agModule:not(.agSmall) .agInput:not(.agStatus){font-size:calc(28px * var(--instrument-scale))}
.accessGate .agModule.agSmall:not(.agMicro){--instrument-controls-width:calc(180px * var(--instrument-scale));--instrument-heading:calc(21px * var(--instrument-scale));--instrument-panel-height:calc(36px * var(--instrument-scale));width:calc(204px * var(--instrument-scale));gap:calc(9px * var(--instrument-scale))}
.accessGate .agModule.agSmall:not(.agMicro) .agPad{grid-template-columns:repeat(3,calc(56px * var(--instrument-scale)));column-gap:calc(6px * var(--instrument-scale));row-gap:calc(2px * var(--instrument-scale))}
.accessGate .agModule.agSmall:not(.agMicro) .agKey{height:calc(36px * var(--instrument-scale));font-size:calc(26px * var(--instrument-scale))}
.accessGate .agModule.agSmall:not(.agMicro) .agKey.sm{font-size:calc(16px * var(--instrument-scale))}
.accessGate .agModule.agSmall:not(.agMicro) .agInput:not(.agStatus){font-size:calc(25px * var(--instrument-scale))}
.accessGate .agModule.agMicro{gap:3px}
.accessGate .agModule.agMicro .agKey{height:23px}

/* Optically centered text inside both matching glass windows. */
.accessGate .agModule .agBrand b{display:flex;align-items:center;justify-content:center;line-height:1!important;transform:translate(calc(var(--instrument-heading-tracking) / 2),-.025em)}
.accessGate .agModule .agInput,.accessGate .agModule .agInput.agStatus{padding:0 4px}
.accessGate .agModule .agInput .agReadout{letter-spacing:7px;text-indent:0;transform:translate(3.5px,.015em)}
.accessGate .agModule .agInput.agStatus .agReadout{letter-spacing:var(--instrument-heading-tracking);transform:translate(calc(var(--instrument-heading-tracking) / 2),.015em)}

/* Digits and light segments share exactly the same four-column track. */
.accessGate .agModule .agInput:not(.agStatus) .agReadout{position:absolute;left:12px;right:12px;width:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));letter-spacing:0;text-indent:0;transform:translateY(.015em)}
.agDigit{display:block;min-width:0;text-align:center;letter-spacing:0}
.accessGate .agModule .agDigitLights{left:12px;right:12px;width:auto;transform:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.accessGate .agModule .agInput .agDigitLights i{position:relative;width:72%;justify-self:center;overflow:visible}
.agDigitLights i::after{content:"";position:absolute;left:calc(100% - 2px);top:0;height:100%;width:calc(38.889% + 4px);background:linear-gradient(#ff8a96,#d5213b);box-shadow:0 0 4px #d5213b55;transform:scaleX(0);transform-origin:left;transition:transform 180ms ease-out}
.agDigitLights i.lit:has(+i.lit)::after{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){.agDigitLights i::after{transition:none}}

/* Armed by 3377: the plate reads SWISS and takes the code in blocks of four. */
.accessGate .agModule .agInput.agArmed.agStatus{color:#f2c438!important}
.accessGate .agModule .agInput.agArmed.agMatch.agStatus{color:#33bd76!important}
.accessGate .agModule .agInput.agArmed.agMatch.agStatus .agReadout{animation:none}
.accessGate .agModule .agInput.agArmed.agStatus .agReadout{animation:ssSwiss 1.05s steps(1,end) infinite}
.accessGate .agModule .agInput.agArmed .agDigitLights i.lit{background:linear-gradient(#ffe08a,#e0a21c);box-shadow:0 0 5px #e0a21c70,inset 0 1px 0 #fff3cf40}
.accessGate .agModule .agInput.agArmed .agDigitLights i.lit:has(+i.lit)::after{background:linear-gradient(#ffe08a,#e0a21c);box-shadow:0 0 4px #e0a21c55}
@keyframes ssSwiss{0%,60%{opacity:1}61%,100%{opacity:.22}}
@media(prefers-reduced-motion:reduce){.accessGate .agModule .agInput.agArmed.agStatus .agReadout{animation:none}}
