*{box-sizing:border-box;margin:0;padding:0}
:root{
    font-family:Inter,"Segoe UI",Arial,sans-serif;
    --ink:#06101e;
    --navy:#071a2d;
    --blue:#267fda;
    --cyan:#73d3ff;
    --gold:#e7b64c;
    --text:#f4f8ff;
    --muted:#9eb4c9;
    --line:rgba(154,211,255,.2);
}
html,body{min-height:100%;width:100%}
body{font-family:inherit}
.login-body{
    min-height:100vh;overflow:hidden;color:var(--text);
    background:
        radial-gradient(circle at 20% 20%,rgba(36,128,217,.24),transparent 28%),
        radial-gradient(circle at 80% 78%,rgba(231,182,76,.1),transparent 25%),
        linear-gradient(135deg,#020814 0%,#07182b 48%,#0a2340 100%);
}
.cadet-puppet,.cadet-aura,.cadet-arm,.cadet-hand,.cadet-fingers,.cadet-torso,.cadet-head,.cadet-eye{
    display:none!important;
}
.login-body::before{
    content:"";position:fixed;inset:0;pointer-events:none;opacity:.28;
    background-image:
        linear-gradient(rgba(130,198,244,.055) 1px,transparent 1px),
        linear-gradient(90deg,rgba(130,198,244,.045) 1px,transparent 1px);
    background-size:78px 78px;
    mask-image:linear-gradient(to bottom,black,transparent 92%);
}
.sky-noise{
    position:fixed;inset:0;pointer-events:none;opacity:.55;
    background:
        radial-gradient(circle at 12% 78%,rgba(82,165,230,.12),transparent 22%),
        radial-gradient(circle at 70% 15%,rgba(115,211,255,.09),transparent 24%);
}
.sky-noise::before,.sky-noise::after{
    content:"";position:absolute;border-radius:999px;background:rgba(116,213,255,.75);
    box-shadow:0 0 20px rgba(116,213,255,.75);
}
.sky-noise::before{width:5px;height:5px;left:8%;top:19%;animation:beacon 2.6s ease-in-out infinite}
.sky-noise::after{width:4px;height:4px;right:13%;top:26%;animation:beacon 3.4s ease-in-out infinite .8s}

.login-shell{
    width:min(1320px,calc(100% - 40px));min-height:100vh;margin:auto;padding:32px 0;
    display:grid;grid-template-columns:minmax(0,1.22fr) minmax(390px,.78fr);
    align-items:center;gap:clamp(34px,5vw,82px);position:relative;z-index:1;
}
.air-scene{
    height:min(820px,calc(100vh - 64px));min-height:620px;position:relative;overflow:hidden;
    border-left:1px solid rgba(115,211,255,.07);
}
.scene-copy{position:absolute;z-index:10;top:46px;left:24px;max-width:470px}
.scene-copy>span{
    display:inline-block;padding:8px 12px;border:1px solid rgba(115,211,255,.3);border-radius:999px;
    background:rgba(9,42,73,.54);color:#c9ecff;font-size:10px;font-weight:850;
    letter-spacing:.14em;text-transform:uppercase;backdrop-filter:blur(12px);
}
.scene-copy h1{margin-top:18px;font-size:clamp(72px,8vw,112px);line-height:.82;letter-spacing:.01em;text-shadow:0 18px 50px rgba(0,8,24,.55)}
.scene-copy p{margin-top:16px;color:#bfd3e6;font-size:15px;font-weight:650;line-height:1.55}

.radar-stage{
    width:min(560px,68%);aspect-ratio:1;display:grid;place-items:center;position:absolute;
    left:66%;top:52%;transform:translate3d(calc(-50% + var(--scene-x,0px)),calc(-50% + var(--scene-y,0px)),0);
    filter:drop-shadow(0 30px 70px rgba(0,6,20,.55));opacity:.92;will-change:transform;
}
.radar-grid{
    position:absolute;inset:0;border-radius:50%;
    background:
        linear-gradient(rgba(115,211,255,.18),rgba(115,211,255,.18)) 50% 0/1px 100% no-repeat,
        linear-gradient(90deg,rgba(115,211,255,.18),rgba(115,211,255,.18)) 0 50%/100% 1px no-repeat,
        repeating-radial-gradient(circle,rgba(115,211,255,.16) 0 1px,transparent 1px 86px),
        radial-gradient(circle,rgba(35,127,218,.12),rgba(2,13,28,.04) 66%,transparent 67%);
    border:1px solid rgba(115,211,255,.18);
}
.radar-grid::before{
    content:"";position:absolute;inset:13%;border-radius:50%;border:1px dashed rgba(231,182,76,.2);
}
.radar-sweep{
    position:absolute;inset:0;border-radius:50%;
    background:conic-gradient(from 0deg,rgba(115,211,255,.42),rgba(115,211,255,.12) 18deg,transparent 54deg);
    mix-blend-mode:screen;animation:radarSpin 5.8s linear infinite;
}
.orbit{position:absolute;border-radius:50%;border:1px solid rgba(115,211,255,.16)}
.orbit-one{inset:8%;animation:orbitTurn 24s linear infinite}
.orbit-two{inset:24%;border-style:dashed;animation:orbitTurn 31s linear infinite reverse}
.orbit::after{
    content:"";width:8px;height:8px;position:absolute;left:50%;top:-4px;border-radius:50%;
    background:var(--gold);box-shadow:0 0 18px rgba(231,182,76,.9);
}
.esma-seal{
    width:38%;aspect-ratio:1;object-fit:contain;padding:18px;border-radius:50%;
    background:radial-gradient(circle,rgba(255,255,255,.09),rgba(115,211,255,.04) 68%,transparent 69%);
    border:1px solid rgba(231,182,76,.22);box-shadow:inset 0 0 45px rgba(115,211,255,.1),0 0 55px rgba(38,127,218,.28);
    animation:sealFloat 5.4s ease-in-out infinite;
}

.flight-lanes{position:absolute;inset:0;z-index:6;pointer-events:none}
.jet{
    --jet-size:90px;position:absolute;width:var(--jet-size);height:calc(var(--jet-size) * .48);
    filter:drop-shadow(0 10px 18px rgba(0,8,24,.48));opacity:.88;
}
.jet::before{
    content:"";position:absolute;left:6%;top:38%;width:86%;height:22%;
    background:linear-gradient(90deg,#dceeff,#7da8c8 58%,#1d4064);
    clip-path:polygon(0 45%,61% 45%,78% 0,100% 50%,78% 100%,61% 55%,0 55%);
}
.jet::after{
    content:"";position:absolute;left:25%;top:12%;width:44%;height:76%;
    background:linear-gradient(90deg,#173a5c,#7aa7ca);
    clip-path:polygon(0 50%,60% 0,100% 12%,54% 50%,100% 88%,60% 100%);
}
.jet i{
    width:36%;height:6px;position:absolute;left:-25%;top:43%;border-radius:999px;
    background:linear-gradient(90deg,transparent,rgba(115,211,255,.75));
    box-shadow:0 0 15px rgba(115,211,255,.65);
}
.jet-one{left:-120px;top:24%;--jet-size:106px;animation:flyAcross 11s linear infinite}
.jet-two{right:-125px;top:18%;--jet-size:74px;transform:scaleX(-1);animation:flyBack 13s linear infinite 1.4s}
.jet-three{left:34%;bottom:-80px;--jet-size:86px;transform:rotate(-52deg);animation:takeoff 9.5s ease-in-out infinite 2.1s}
.jet-four{right:6%;bottom:18%;--jet-size:58px;opacity:.62;transform:rotate(-16deg);animation:patrol 7.6s ease-in-out infinite}

.runway-panel{
    width:52%;height:150px;position:absolute;left:50%;bottom:16px;transform:translateX(-50%) perspective(500px) rotateX(62deg);
    background:linear-gradient(90deg,transparent,rgba(115,211,255,.2),transparent);
    border-top:1px solid rgba(115,211,255,.12);opacity:.65;overflow:hidden;
}
.runway-panel::before{
    content:"";position:absolute;inset:0;background:
        linear-gradient(90deg,transparent 49%,rgba(231,182,76,.6) 49% 51%,transparent 51%),
        repeating-linear-gradient(0deg,rgba(115,211,255,.2) 0 1px,transparent 1px 28px);
    animation:runwayMove 1.8s linear infinite;
}
.runway-panel span{position:absolute;top:0;bottom:0;width:1px;background:rgba(115,211,255,.18)}
.runway-panel span:nth-child(1){left:16%}.runway-panel span:nth-child(2){left:34%}.runway-panel span:nth-child(3){right:34%}.runway-panel span:nth-child(4){right:16%}
.scene-status{
    display:flex;align-items:center;gap:10px;position:absolute;z-index:9;left:20px;bottom:20px;
    padding:11px 14px;border:1px solid var(--line);border-radius:14px;background:rgba(5,23,43,.62);
    backdrop-filter:blur(14px);
}
.scene-status>i{width:8px;height:8px;border-radius:50%;background:#55d99f;box-shadow:0 0 12px #55d99f}
.scene-status div{display:grid;gap:2px}.scene-status strong{font-size:10px}.scene-status span{color:var(--muted);font-size:8px}

.login-card{
    width:100%;max-width:470px;justify-self:end;padding:clamp(28px,4vw,48px);
    border:1px solid rgba(160,208,245,.2);border-radius:26px;
    background:linear-gradient(155deg,rgba(14,46,79,.84),rgba(4,17,32,.92));
    box-shadow:0 34px 90px rgba(0,5,16,.5),inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter:blur(24px);
}
.login-brand-mobile{display:none}
.login-card header>span{color:#83d9ff;font-size:10px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.login-card header h2{margin:9px 0 7px;font-size:clamp(36px,5vw,52px);line-height:1}
.login-card header p{color:var(--muted);font-size:13px;line-height:1.5}
.login-form{display:grid;gap:18px;margin-top:34px}
.input-group{display:grid;gap:8px}.input-group>span{color:#dcecff;font-size:11px;font-weight:750}
.input-group>div{
    height:56px;display:flex;align-items:center;position:relative;border:1px solid rgba(148,197,238,.18);
    border-radius:15px;background:rgba(2,12,25,.36);transition:.2s;
}
.input-group>div:focus-within{border-color:rgba(115,211,255,.72);box-shadow:0 0 0 4px rgba(54,147,222,.1);background:rgba(4,18,35,.64)}
.input-group>div>svg{width:18px;height:18px;flex:0 0 18px;margin-left:16px;fill:none;stroke:#86b4d6;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.input-group input{width:100%;height:100%;padding:0 14px;border:0;outline:0;background:transparent;color:#fff;font-size:14px}
.input-group input::placeholder{color:#7189a3}
.password-field input{padding-right:55px}
.password-toggle{width:38px;height:38px;display:grid;place-items:center;position:absolute;right:8px;border:0;border-radius:10px;background:rgba(255,255,255,.055);color:#9dc6e3;cursor:pointer}
.password-toggle svg,.login-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.password-toggle:hover,.password-toggle.active{background:rgba(115,211,255,.12);color:#fff}
.flash-message{padding:13px 15px;border:1px solid rgba(255,115,126,.26);border-radius:13px;background:rgba(255,84,99,.1);color:#ffd6da;font-size:12px;font-weight:700}
.login-button{
    min-height:56px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid rgba(231,182,76,.36);
    border-radius:15px;background:linear-gradient(135deg,#1d6fc8,#3aa9ef);color:#fff;font-weight:850;
    box-shadow:0 16px 36px rgba(31,114,213,.24);transition:.22s;cursor:pointer;
}
.login-button:hover{transform:translateY(-2px);box-shadow:0 22px 44px rgba(31,114,213,.32)}
.forgot-password-link{color:#a9d7f7;font-size:11px;font-weight:700;text-align:center;text-decoration:none}.forgot-password-link:hover{color:#fff}
.login-card footer{display:flex;justify-content:space-between;gap:12px;margin-top:30px;padding-top:17px;border-top:1px solid rgba(148,197,238,.12);color:#7790a8;font-size:8px;text-transform:uppercase;letter-spacing:.08em}.login-card footer b{color:#e2bd69}

@keyframes radarSpin{to{transform:rotate(360deg)}}
@keyframes orbitTurn{to{transform:rotate(360deg)}}
@keyframes sealFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-7px) scale(1.025)}}
@keyframes beacon{0%,100%{opacity:.35;transform:scale(.75)}50%{opacity:1;transform:scale(1.25)}}
@keyframes flyAcross{0%{transform:translateX(0) translateY(20px) rotate(5deg);opacity:0}8%,86%{opacity:.9}100%{transform:translateX(calc(100vw + 220px)) translateY(-70px) rotate(5deg);opacity:0}}
@keyframes flyBack{0%{transform:scaleX(-1) translateX(0) translateY(0) rotate(-8deg);opacity:0}10%,82%{opacity:.75}100%{transform:scaleX(-1) translateX(calc(100vw + 200px)) translateY(100px) rotate(-8deg);opacity:0}}
@keyframes takeoff{0%{transform:translate(0,0) rotate(-52deg);opacity:0}18%,68%{opacity:.78}100%{transform:translate(230px,-520px) rotate(-52deg);opacity:0}}
@keyframes patrol{0%,100%{transform:translate(0,0) rotate(-16deg)}50%{transform:translate(-34px,-18px) rotate(-9deg)}}
@keyframes runwayMove{to{transform:translateY(28px)}}

@media(max-width:980px){
    .login-body{overflow:auto}.login-shell{grid-template-columns:1fr;width:min(600px,calc(100% - 28px));padding:22px 0}
    .air-scene{height:430px;min-height:430px}.scene-copy{top:10px}.scene-copy h1{font-size:66px}
    .radar-stage{width:350px;top:58%;left:68%}.runway-panel{display:none}.scene-status{display:none}
    .login-card{max-width:none;justify-self:stretch}
}
@media(max-width:560px){
    .air-scene{height:318px;min-height:318px}.scene-copy p{display:none}.scene-copy h1{font-size:50px}
    .radar-stage{width:285px;left:68%;top:58%}.jet{--jet-size:60px}.login-card{padding:26px 20px;border-radius:22px}
}
@media(prefers-reduced-motion:reduce){
    .radar-sweep,.orbit,.esma-seal,.jet,.runway-panel::before,.sky-noise::before,.sky-noise::after{animation:none!important}
}

/* Sliding ESMA access */
.sliding-login-body{display:grid;place-items:center;min-height:100vh;padding:28px;overflow:auto}
.sliding-login{
    width:min(1000px,100%);min-height:650px;display:grid;grid-template-columns:1fr 1fr;position:relative;z-index:2;
    overflow:hidden;border:1px solid rgba(128,198,249,.26);border-radius:30px;background:#f8fbff;
    box-shadow:0 35px 100px rgba(0,9,27,.55);
}
.account-panel{display:flex;flex-direction:column;justify-content:center;padding:58px 68px;color:#10243a;background:#f8fbff}
.admin-form-panel{grid-column:1}.cadet-form-panel{grid-column:2}
.form-brand{display:flex;align-items:center;gap:11px;margin-bottom:26px;color:#0e4f87;font-size:15px;font-weight:950;letter-spacing:.12em}
.form-brand img{width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 5px 9px rgba(15,85,142,.2))}
.form-eyebrow{color:#227cc0;font-size:10px;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
.account-panel h1{margin:8px 0 10px;color:#10243a;font-size:clamp(30px,4vw,43px);line-height:1.05;letter-spacing:-.035em}
.form-intro{margin-bottom:4px;color:#5f7388;font-size:14px;line-height:1.55;max-width:36ch}
.account-panel .login-form{gap:16px;margin-top:28px}
.account-panel .input-group>span{color:#36536d;font-size:12px;font-weight:700}
.account-panel .input-group>div{
    height:54px;border:1px solid #cfd9e3;border-radius:14px;background:#f4f7fa;
    transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.account-panel .input-group>div:focus-within{
    border-color:#2b8fd4;background:#fff;
    box-shadow:0 0 0 4px rgba(43,143,212,.12);
}
.account-panel .input-group input{
    color:#17334d;font-size:15px;font-weight:500;
}
.account-panel .input-group input::placeholder{color:#8a9aad}
.account-panel .password-toggle{background:#e3ebf2;color:#5a7188}
.account-panel .password-toggle:hover,
.account-panel .password-toggle.active{background:#d4e3ef;color:#17334d}

.login-form-actions{
    display:grid;gap:14px;margin-top:6px;
}
.account-panel .login-button{
    width:100%;min-height:54px;padding:0 20px;border:0;border-radius:14px;
    background:linear-gradient(135deg,#065a9d 0%,#1a9de0 100%);
    color:#fff;font-size:15px;font-weight:800;letter-spacing:.02em;
    box-shadow:0 14px 28px rgba(9,106,171,.22);
    cursor:pointer;transition:transform .2s ease, box-shadow .2s ease;
}
.account-panel .login-button span{
    display:block;line-height:1.2;padding:2px 0;
}
.account-panel .login-button:hover{
    transform:translateY(-1px);
    box-shadow:0 18px 34px rgba(9,106,171,.28);
}
.account-panel .login-button:active{transform:translateY(0)}
.account-panel .forgot-password-link{
    color:#2b6fa8;font-size:13px;font-weight:600;text-align:center;
    text-decoration:none;transition:color .2s ease;
}
.account-panel .forgot-password-link:hover{color:#0d4f82;text-decoration:underline}
.account-panel .flash-message{
    padding:12px 14px;border:1px solid #fecaca;border-radius:12px;
    background:#fef2f2;color:#b91c1c;font-size:13px;font-weight:600;
}

.sliding-cover{
    width:50%;height:100%;display:grid;place-items:center;position:absolute;z-index:5;left:0;top:0;padding:48px;
    overflow:hidden;color:#fff;text-align:center;background:
        radial-gradient(circle at 20% 15%,rgba(99,205,255,.36),transparent 30%),
        linear-gradient(145deg,#032d57 0%,#075f9f 48%,#109fe0 100%);
    box-shadow:15px 0 45px rgba(4,48,88,.24);transition:transform .7s cubic-bezier(.77,0,.18,1);
}
.sliding-cover::before{content:"";position:absolute;inset:-30%;background:repeating-radial-gradient(circle at center,transparent 0 45px,rgba(255,255,255,.06) 46px 47px);animation:orbitTurn 30s linear infinite}
.sliding-login.admin-active .sliding-cover{transform:translateX(100%);box-shadow:-15px 0 45px rgba(4,48,88,.24)}
.cover-content{max-width:330px;display:grid;justify-items:center;position:relative;z-index:1;transition:opacity .22s,transform .45s}
.cover-content img{width:128px;height:128px;object-fit:contain;margin-bottom:18px;filter:drop-shadow(0 16px 20px rgba(0,20,51,.38))}
.cover-content>span{font-size:9px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;opacity:.8}
.cover-content h2{margin:10px 0 12px;font-size:clamp(30px,4vw,45px);line-height:1.05}
.cover-content p{color:#d9efff;font-size:13px;line-height:1.65}
.cover-content button{min-width:205px;min-height:48px;margin-top:27px;border:1px solid rgba(255,255,255,.8);border-radius:12px;background:transparent;color:#fff;font-size:10px;font-weight:900;letter-spacing:.05em;cursor:pointer;transition:.2s}
.cover-content button:hover,.cover-content button:focus-visible{background:#fff;color:#075d9d;transform:translateY(-2px);outline:0}
.cover-for-admins{display:none}.sliding-login.admin-active .cover-for-cadets{display:none}.sliding-login.admin-active .cover-for-admins{display:grid}

@media(max-width:760px){
    .sliding-login-body{padding:14px}.sliding-login{min-height:850px;grid-template-columns:1fr;grid-template-rows:310px 1fr;border-radius:24px}
    .account-panel{grid-column:1;grid-row:2;padding:35px 25px}.admin-form-panel{display:none}.cadet-form-panel{display:flex}
    .sliding-cover{width:100%;height:310px;left:0;top:0;padding:25px;transition:none;box-shadow:0 14px 35px rgba(4,48,88,.2)}
    .sliding-login.admin-active .sliding-cover{transform:none}.sliding-login.admin-active .admin-form-panel{display:flex}.sliding-login.admin-active .cadet-form-panel{display:none}
    .cover-content img{width:78px;height:78px;margin-bottom:10px}.cover-content h2{margin:6px 0;font-size:27px}.cover-content p{font-size:11px}.cover-content button{min-height:42px;margin-top:13px}
    .form-brand{display:none}.account-panel h1{font-size:31px}
}
@media(prefers-reduced-motion:reduce){.sliding-cover{transition:none}.sliding-cover::before{animation:none}}

/* Dual access selector and login variants */
.login-access-tabs{
    display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:22px;padding:5px;
    border:1px solid rgba(115,211,255,.2);border-radius:15px;background:rgba(2,12,25,.34);
}
.login-access-tabs a{
    min-height:42px;display:flex;align-items:center;justify-content:center;padding:0 10px;
    border-radius:11px;color:#91aac0;font-size:10px;font-weight:900;text-decoration:none;
    letter-spacing:.03em;transition:.2s;
}
.login-access-tabs a:hover,.login-access-tabs a:focus-visible{color:#fff;outline:0}
.login-access-tabs a.active{
    background:linear-gradient(135deg,#207dcc,#56bce9);color:#fff;
    box-shadow:0 8px 22px rgba(31,130,213,.28);
}
.switch-login-link{
    min-height:48px;display:flex;align-items:center;justify-content:center;gap:9px;padding:0 14px;
    border:1px solid rgba(115,211,255,.3);border-radius:14px;background:rgba(115,211,255,.07);
    color:#c9ecff;font-size:11px;font-weight:800;text-decoration:none;transition:.2s;
}
.switch-login-link:hover,.switch-login-link:focus-visible{background:rgba(115,211,255,.14);border-color:rgba(115,211,255,.56);color:#fff;outline:0}
.switch-login-link svg{width:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.back-selector-link{margin-top:-7px;color:#8fa9c1;font-size:9px;font-weight:700;text-align:center;text-decoration:none}
.back-selector-link:hover,.back-selector-link:focus-visible{color:#fff;outline:0}
.login-cadete .login-card{border-color:rgba(115,211,255,.34);background:linear-gradient(155deg,rgba(12,62,103,.9),rgba(4,23,43,.94))}
.login-cadete .scene-copy>span{border-color:rgba(115,211,255,.5);background:rgba(35,133,202,.2)}
.login-cadete .esma-seal{box-shadow:inset 0 0 45px rgba(115,211,255,.16),0 0 72px rgba(62,173,238,.4)}
.login-button.loading{pointer-events:none;opacity:.78}
.login-button.loading svg{animation:submitArrow .8s ease-in-out infinite alternate}
@keyframes submitArrow{to{transform:translateX(5px)}}

.access-selector{
    width:min(1080px,calc(100% - 36px));min-height:100vh;display:grid;align-content:center;gap:34px;
    position:relative;z-index:1;margin:auto;padding:38px 0;
}
.selector-hero{text-align:center}
.selector-radar{
    width:150px;height:150px;display:grid;place-items:center;position:relative;margin:0 auto 22px;
    border:1px solid rgba(115,211,255,.24);border-radius:50%;
    background:repeating-radial-gradient(circle,rgba(115,211,255,.16) 0 1px,transparent 1px 30px),rgba(5,31,57,.55);
    box-shadow:0 22px 60px rgba(0,6,20,.42);
}
.selector-radar::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(rgba(115,211,255,.44),transparent 55deg);animation:radarSpin 5s linear infinite}
.selector-radar span{position:absolute;inset:16px;border:1px dashed rgba(231,182,76,.3);border-radius:50%;animation:orbitTurn 18s linear infinite reverse}
.selector-radar img{width:78px;position:relative;z-index:2;filter:drop-shadow(0 10px 18px rgba(0,7,20,.5));animation:sealFloat 5s ease-in-out infinite}
.selector-kicker{display:inline-block;color:#8edcff;font-size:10px;font-weight:900;letter-spacing:.15em;text-transform:uppercase}
.selector-hero h1{margin:10px 0 8px;color:#fff;font-size:clamp(36px,6vw,62px);line-height:1;letter-spacing:-.035em}
.selector-hero p{color:#a9bfd3;font-size:13px}
.access-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.access-option{
    min-height:270px;display:flex;flex-direction:column;align-items:flex-start;padding:30px;
    border:1px solid rgba(154,211,255,.2);border-radius:25px;
    background:linear-gradient(150deg,rgba(15,52,88,.88),rgba(4,20,38,.94));
    color:#fff;box-shadow:0 24px 65px rgba(0,5,16,.34);text-decoration:none;transition:.25s;
}
.access-option:hover,.access-option:focus-visible{transform:translateY(-6px);border-color:rgba(115,211,255,.58);box-shadow:0 32px 75px rgba(0,7,22,.48);outline:0}
.access-option.cadet{background:linear-gradient(150deg,rgba(15,76,119,.9),rgba(4,28,51,.95))}
.access-option-icon{width:54px;height:54px;display:grid;place-items:center;margin-bottom:24px;border-radius:17px;background:linear-gradient(145deg,#2d8de0,#62c8f4);box-shadow:0 12px 28px rgba(31,130,213,.3)}
.access-option-icon svg{width:27px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.access-option small{color:#87d7ff;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.access-option h2{margin:8px 0 10px;font-size:25px}
.access-option p{max-width:390px;color:#a9bfd3;font-size:12px;line-height:1.6}
.access-option strong{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:24px;color:#d8f1ff;font-size:11px}
.access-option strong span{font-size:18px;transition:.2s}.access-option:hover strong span{transform:translateX(5px)}
.selector-footer{display:flex;justify-content:center;gap:18px;color:#7892aa;font-size:8px;letter-spacing:.1em;text-transform:uppercase}
.selector-footer b{color:#e2bd69}

@media(max-width:700px){
    .access-selector{width:min(520px,calc(100% - 24px));gap:25px;padding:24px 0}
    .selector-radar{width:112px;height:112px;margin-bottom:17px}.selector-radar img{width:60px}
    .access-options{grid-template-columns:1fr}.access-option{min-height:220px;padding:23px}
    .access-option-icon{margin-bottom:17px}.access-option h2{font-size:21px}
}
@media(prefers-reduced-motion:reduce){
    .selector-radar::before,.selector-radar span,.selector-radar img,.login-button.loading svg{animation:none!important}
    .access-option,.switch-login-link{transition:none!important}
}