@import url('/static/root-android-polish.css?v=20260929-1');
/* ROOT SE authentication UI v3 · single source of truth · 2026-09-27 */
:root{--auth-cyan:#32d7ff;--auth-cyan-2:#8cf0ff;--auth-red:#35c7ff;--auth-text:#f4fbff;--auth-muted:rgba(216,235,245,.70);--auth-line:rgba(143,229,255,.48);--auth-glass:rgba(3,24,38,.34);--auth-glass-strong:rgba(2,19,31,.58)}
#authScreen,#lockScreen{position:fixed!important;inset:0!important;z-index:4900!important;width:100vw!important;height:100dvh!important;min-height:100dvh!important;max-width:none!important;margin:0!important;padding:0!important;overflow:hidden!important;color:var(--auth-text)!important;background:#01070d url("/static/root-auth-bg-wide.webp?v=20260927-authv3") center/cover no-repeat!important;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Arial,sans-serif!important}
#authScreen::before,#lockScreen::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 27%,transparent 0 34%,rgba(0,4,9,.08) 58%,rgba(0,3,7,.64) 100%),linear-gradient(180deg,rgba(1,7,12,.03) 0%,rgba(1,7,12,.04) 42%,rgba(0,3,8,.66) 100%)}
#authScreen.hidden,#lockScreen.hidden{display:none!important}
.authTopbar{position:relative;z-index:3;height:54px;min-height:54px;width:100%;display:grid;grid-template-columns:54px 1fr 54px;align-items:center;border-bottom:1px solid rgba(153,218,242,.18);background:linear-gradient(180deg,rgba(5,18,29,.78),rgba(3,14,23,.58));backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%)}
.authTopbarTitle{grid-column:2;text-align:center;color:#44c7ff;font-weight:650;font-size:16px;letter-spacing:.02em;text-shadow:0 0 18px rgba(41,199,255,.30)}
.authClose{grid-column:3;width:38px;height:38px;justify-self:center;border:0;border-radius:50%;background:transparent;color:#f0f8fb;font-size:25px;font-weight:300;line-height:1;cursor:pointer}
.authSurface{position:relative;z-index:2;height:calc(100dvh - 54px);width:100%;display:flex;align-items:center;justify-content:center;padding:clamp(18px,3vh,36px) clamp(14px,3vw,48px) clamp(18px,3vh,34px);box-sizing:border-box;overflow:auto;overscroll-behavior:contain}
.authStack{width:min(100%,590px);margin:auto;display:flex;flex-direction:column;align-items:center;gap:clamp(14px,2vh,24px)}
.authBrand{width:100%;text-align:center;flex:none;pointer-events:none;text-shadow:0 3px 26px rgba(0,0,0,.72)}
.authBrandTitle{margin:0;color:#f7fbff;font-size:clamp(38px,5.2vw,68px);font-weight:630;line-height:.98;letter-spacing:.08em}
.authBrandTitle span{color:#55e5ef;text-shadow:0 0 22px rgba(46,220,241,.34)}
.authBrandSub{margin:11px 0 0;color:#f4f9fb;font-size:clamp(11px,1.4vw,18px);font-weight:500;letter-spacing:clamp(.18em,.5vw,.40em);white-space:nowrap}
.authCard{width:min(100%,560px);box-sizing:border-box;border-radius:28px;padding:clamp(20px,3vh,30px);border:1px solid rgba(143,229,255,.58);background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.045) 38%,rgba(6,74,105,.10) 72%,rgba(0,14,25,.43));backdrop-filter:blur(26px) saturate(145%);-webkit-backdrop-filter:blur(26px) saturate(145%);box-shadow:inset 0 1px 0 rgba(255,255,255,.46),inset 0 -28px 60px rgba(0,49,76,.11),0 0 0 1px rgba(36,185,233,.10),0 18px 58px rgba(0,0,0,.44),0 0 32px rgba(29,184,238,.12)}
.authPaneTitle{margin:0 0 22px;text-align:center;color:#f8fcff;font-size:clamp(28px,4vw,42px);line-height:1.05;font-weight:620;letter-spacing:-.02em}
.authFields{display:grid;gap:12px}
.authField{position:relative;display:grid;grid-template-columns:42px 1fr auto;align-items:center;min-height:58px;border-radius:17px;border:1px solid rgba(142,225,252,.48);background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.045),rgba(0,50,78,.12));box-shadow:inset 0 1px 0 rgba(255,255,255,.25),inset 0 -8px 22px rgba(0,46,70,.10);overflow:hidden}
.authFieldIcon{display:grid;place-items:center;color:#89edff;font-size:20px}
.authFieldIcon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.authInput{width:100%;height:56px;border:0!important;outline:0!important;background:transparent!important;color:#f5fcff!important;font:500 17px/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif!important;padding:0 14px 0 0!important;box-shadow:none!important}
.authInput::placeholder{color:rgba(212,231,241,.50)}
.authField:focus-within{border-color:rgba(151,239,255,.94);box-shadow:0 0 0 3px rgba(41,195,243,.10),0 0 24px rgba(41,197,244,.18)}
.authEye{width:45px;height:45px;border:0;background:transparent;color:#8defff;font-size:21px;cursor:pointer}
.authActions{display:grid;gap:12px;margin-top:16px}
.authPrimary,.authSecondary,.authChoice,.authTextButton{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;box-sizing:border-box;border-radius:999px;cursor:pointer;color:#f6fdff;font-family:inherit;font-weight:620;text-align:center;transition:transform .10s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease}
.authPrimary,.authSecondary{min-height:56px;padding:11px 18px;font-size:16px}
.authPrimary{border:1px solid rgba(139,239,255,.96);background:linear-gradient(180deg,rgba(105,231,255,.40),rgba(13,148,197,.28) 52%,rgba(3,75,110,.25));box-shadow:inset 0 1px 0 rgba(255,255,255,.66),inset 0 -13px 26px rgba(0,83,120,.20),0 0 24px rgba(31,215,255,.34),0 10px 30px rgba(0,0,0,.26)}
.authSecondary{border:1px solid rgba(92,218,255,.68);background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(25,141,184,.08),rgba(0,25,39,.20));box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 8px 24px rgba(0,0,0,.22)}
.authPrimary::before,.authSecondary::before,.authChoice::before{content:"";position:absolute;left:7%;right:7%;top:4px;height:42%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,.03));pointer-events:none}
.authPrimary:active,.authSecondary:active,.authChoice:active{transform:scale(.985)}
.authTextButton{min-height:42px;border:0;background:transparent;color:rgba(200,229,239,.76);font-size:13px;font-weight:520}
.authDivider{display:flex;align-items:center;gap:14px;margin:2px 0;color:rgba(200,220,230,.60);font-size:12px}
.authDivider::before,.authDivider::after{content:"";height:1px;flex:1;background:rgba(150,211,232,.28)}
.authInfo,.authError{min-height:20px;margin:12px 2px 0;text-align:center;font-size:12.5px;line-height:1.45}
.authInfo{color:rgba(195,220,232,.72)}
.authError{color:#5dc7ff;text-shadow:0 0 15px rgba(37,199,255,.18)}

#quickPane .authPaneTitle{margin-bottom:10px}
.authChoice{min-height:70px;justify-content:flex-start;padding:12px 16px 12px 14px;border:1px solid rgba(101,225,255,.72);background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.05),rgba(4,72,101,.13));box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 0 18px rgba(35,192,241,.14),0 10px 28px rgba(0,0,0,.24);text-align:left}
.authChoiceIcon{width:46px;height:46px;display:grid;place-items:center;flex:none;border-radius:50%;border:1px solid rgba(118,231,255,.42);color:#72e9ff;background:rgba(42,170,214,.08);font-size:25px;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 16px rgba(44,200,242,.14)}
.authChoiceText{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}
.authChoiceText b{font-size:16px;color:#f7fcff}
.authChoiceText span{font-size:12px;line-height:1.3;color:rgba(196,221,231,.68)}
.authChoiceChevron{font-size:25px;color:#a9efff;flex:none}
.authBack{margin-top:12px}
.authInviteHint{margin-top:10px}
.authHiddenNav{display:none!important}
#lockScreen .authSurface{padding-top:clamp(10px,2vh,24px);padding-bottom:clamp(12px,2vh,24px)}
#lockScreen .lockbox{position:relative;z-index:2;width:min(100%,660px);height:auto;min-height:0!important;margin:auto!important;padding:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important}
#lockScreen .authBrand{margin-bottom:clamp(8px,1.2vh,14px)}
#lockScreen .authBrandTitle{font-size:clamp(40px,6vw,74px)}
#lockScreen .lockIdentity{margin:0 0 6px!important;color:#f4fbff!important;font-size:clamp(16px,2.2vh,20px)!important;font-weight:560!important;text-shadow:0 2px 14px rgba(0,0,0,.70)!important}
#lockScreen .pinDots{width:100%!important;height:auto!important;margin:0 0 clamp(9px,1.4vh,14px)!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:clamp(9px,1.1vw,14px)!important}
#lockScreen .pinDots .dot{width:clamp(13px,1.8vh,17px)!important;height:clamp(13px,1.8vh,17px)!important;border-radius:50%!important;border:2px solid rgba(214,244,255,.90)!important;background:rgba(255,255,255,.025)!important;box-shadow:inset 0 1px 2px rgba(255,255,255,.18),0 2px 12px rgba(0,0,0,.38)!important}
#lockScreen .pinDots .dot.fill{background:radial-gradient(circle at 35% 28%,#ffffff 0 20%,#7decff 40%,#1bb7ef 69%,#0b63bd 100%)!important;border-color:#9beeff!important;box-shadow:0 0 14px rgba(49,210,255,.74),0 0 30px rgba(24,124,255,.28)!important}
#lockScreen .keypad{--key-size:clamp(56px,7.4vh,82px);display:grid!important;grid-template-columns:repeat(3,var(--key-size))!important;gap:clamp(8px,1.2vh,15px) clamp(16px,2.3vw,28px)!important;width:auto!important;max-width:none!important;margin:0 auto clamp(12px,1.8vh,20px)!important;justify-content:center!important}
#lockScreen .key{position:relative!important;isolation:isolate!important;width:var(--key-size)!important;height:var(--key-size)!important;min-width:0!important;min-height:0!important;padding:0!important;border-radius:50%!important;border:1px solid rgba(142,235,255,.86)!important;overflow:hidden!important;color:#f6fcff!important;background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.075) 30%,rgba(38,145,201,.10) 58%,rgba(0,24,40,.20))!important;backdrop-filter:blur(18px) saturate(150%)!important;-webkit-backdrop-filter:blur(18px) saturate(150%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.70),inset 0 -11px 24px rgba(3,73,118,.16),inset 0 0 18px rgba(141,226,255,.09),0 0 0 1px rgba(33,179,236,.16),0 0 18px rgba(22,186,255,.24),0 10px 26px rgba(0,0,0,.36)!important;font:600 clamp(20px,2.8vh,28px)/1 -apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif!important;text-shadow:0 1px 7px rgba(0,0,0,.72)!important;transition:.10s ease!important}
#lockScreen .key::before{content:"";position:absolute;z-index:-1;left:13%;right:13%;top:8%;height:38%;border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.53),rgba(255,255,255,.10) 58%,transparent);opacity:.72}
#lockScreen .key::after{content:"";position:absolute;z-index:-1;inset:7px;border-radius:50%;border:1px solid rgba(255,255,255,.11)}
#lockScreen .key:active,#lockScreen .key.pressed{transform:scale(.93)!important;border-color:#d9f9ff!important;box-shadow:inset 0 2px 8px rgba(255,255,255,.28),0 0 24px rgba(44,204,255,.78),0 0 44px rgba(25,116,255,.34)!important}
#lockScreen .key svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#lockScreen .lockErr{min-height:18px;margin:-5px 0 6px;color:#56c7ff;font-size:12px}
#lockScreen .locklinks{display:grid!important;grid-template-columns:1fr 1.18fr!important;gap:12px!important;width:min(100%,560px)!important;margin:0!important}
#lockScreen .locklinks button{position:relative!important;overflow:hidden!important;min-height:52px!important;padding:10px 15px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;border-radius:999px!important;border:1px solid rgba(110,220,255,.74)!important;color:#f4fcff!important;background:linear-gradient(145deg,rgba(255,255,255,.15),rgba(255,255,255,.05),rgba(17,112,155,.10))!important;backdrop-filter:blur(20px) saturate(150%)!important;-webkit-backdrop-filter:blur(20px) saturate(150%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.46),0 0 20px rgba(26,183,255,.17),0 10px 28px rgba(0,0,0,.30)!important;font:600 clamp(12px,1.55vw,14px)/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif!important}
#lockScreen .locklinks button::before{content:"";position:absolute;left:8%;right:8%;top:4px;height:40%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,.03));opacity:.62}
#lockScreen .locklinks .danger{color:#ffb5c1!important;border-color:rgba(55,199,255,.84)!important;background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(44,199,255,.09),rgba(0,100,150,.20))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.36),0 0 21px rgba(34,199,255,.20),0 10px 28px rgba(0,0,0,.30)!important}
#lockScreen .locklinks svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

#overlay:has(.authSetupCard){z-index:4990!important;align-items:center!important;justify-content:center!important;padding:18px!important;background:rgba(0,5,10,.25)!important;backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important}
#overlay:has(.authSetupCard) .sheet{width:min(100%,590px)!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
#overlay:has(.authSetupCard) .grab{display:none!important}
.authSetupCard{border-radius:28px;padding:26px;border:1px solid rgba(143,229,255,.58);background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.045) 38%,rgba(6,74,105,.10) 72%,rgba(0,14,25,.60));backdrop-filter:blur(28px) saturate(150%);-webkit-backdrop-filter:blur(28px) saturate(150%);box-shadow:inset 0 1px 0 rgba(255,255,255,.46),0 20px 70px rgba(0,0,0,.46),0 0 30px rgba(32,191,242,.14)}
.authSetupCard h2{margin:0 0 12px;text-align:center;color:#f8fdff;font-size:34px}
.authSetupCard .sub{text-align:center;color:rgba(205,229,239,.76);line-height:1.45}
.authSetupCard .choice{width:100%;min-height:68px;margin:11px 0;padding:12px 15px;border-radius:999px!important;border:1px solid rgba(103,225,255,.72)!important;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(4,72,101,.13))!important;color:#f7fcff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 0 18px rgba(35,192,241,.14)!important}
.authSetupCard .choiceIcon{border-radius:50%;color:#72e9ff!important}
.authSetupCard .ghost,.authSetupCard .primary{width:100%;min-height:52px;border-radius:999px!important;border:1px solid rgba(112,221,255,.62)!important;background:rgba(32,140,181,.10)!important;color:#effbff!important}
.authSetupCard .input{width:100%;min-height:50px;border-radius:16px!important;border:1px solid rgba(134,219,250,.36)!important;background:rgba(255,255,255,.065)!important;color:#f4fbff!important}
.authSetupCard .field label{color:rgba(211,235,246,.78)!important}
body.authActivation{margin:0!important;width:100%!important;min-height:100dvh!important;overflow-x:hidden!important;background:#01070d url("/static/root-auth-bg-wide.webp?v=20260927-authv3") center/cover fixed no-repeat!important;color:var(--auth-text)!important;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Arial,sans-serif!important}
body.authActivation::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 27%,transparent 0 34%,rgba(0,4,9,.08) 58%,rgba(0,3,7,.64) 100%),linear-gradient(180deg,rgba(1,7,12,.03) 0%,rgba(1,7,12,.04) 42%,rgba(0,3,8,.66) 100%)}
.authActivation .activationSurface{min-height:calc(100dvh - 54px);display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:clamp(18px,3vh,36px) clamp(14px,3vw,48px) clamp(22px,4vh,42px)}
.authActivation .activationStack{width:min(100%,720px);display:flex;flex-direction:column;align-items:center;gap:18px}
.authActivation .authBrand{pointer-events:none}
.authActivation .activationCard{width:min(100%,680px);box-sizing:border-box;border-radius:28px;padding:clamp(20px,3vh,30px);border:1px solid rgba(143,229,255,.58);background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.045) 38%,rgba(6,74,105,.10) 72%,rgba(0,14,25,.48));backdrop-filter:blur(26px) saturate(145%);-webkit-backdrop-filter:blur(26px) saturate(145%);box-shadow:inset 0 1px 0 rgba(255,255,255,.46),0 18px 58px rgba(0,0,0,.44),0 0 32px rgba(29,184,238,.12)}
.activationCard h2{margin:0 0 18px;text-align:center;font-size:clamp(28px,4vw,40px);color:#f8fcff}
.activationCard .hint{margin:0 0 18px;text-align:center;color:rgba(205,229,239,.72);line-height:1.45}
.activationCard .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.activationCard .field{margin:10px 0}
.activationCard .field label{display:block;margin:0 0 7px 4px;color:rgba(211,235,246,.78);font-size:12px}
.activationCard .field input{width:100%;box-sizing:border-box;min-height:52px;border-radius:16px;border:1px solid rgba(134,219,250,.38);outline:0;background:rgba(255,255,255,.065);color:#f4fbff;padding:12px 15px;font:500 16px/1.2 inherit;box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.activationCard .field input:focus{border-color:rgba(151,239,255,.92);box-shadow:0 0 0 3px rgba(41,195,243,.10),0 0 24px rgba(41,197,244,.16)}
.activationCard .symbols{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:12px 0 18px}
.activationCard .sym{width:54px;height:54px;border-radius:50%;border:1px solid rgba(142,235,255,.76);color:#f6fcff;background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.055),rgba(18,104,144,.12));box-shadow:inset 0 1px 0 rgba(255,255,255,.50),0 0 17px rgba(22,186,255,.18);font:600 21px/1 inherit;cursor:pointer}
.activationCard .sym.on{border-color:#b5f5ff;background:rgba(44,193,239,.22);box-shadow:0 0 24px rgba(38,207,255,.40),inset 0 1px 0 rgba(255,255,255,.62)}
.activationCard .btn{width:100%;min-height:54px;border-radius:999px;border:1px solid rgba(139,239,255,.92);color:#f6fdff;background:linear-gradient(180deg,rgba(105,231,255,.40),rgba(13,148,197,.28) 52%,rgba(3,75,110,.25));box-shadow:inset 0 1px 0 rgba(255,255,255,.60),0 0 22px rgba(31,215,255,.26);font:620 16px/1.2 inherit;cursor:pointer}
.activationCard .error{min-height:20px;color:#5dc7ff;text-align:center;margin-top:10px}
.activationCard .secret{display:none!important}
.activationCard .secret.show{display:block!important}
.activationKeyBox{margin:16px 0;padding:22px;border-radius:19px;border:1px solid rgba(123,232,255,.78);background:rgba(0,28,43,.38);box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 0 20px rgba(26,194,244,.16);color:#e9fbff;font:600 clamp(16px,2.6vw,28px)/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.10em;text-align:center;word-break:break-word}
.activationActions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.activationActions .btn.danger{border-color:rgba(55,199,255,.84);background:rgba(10,100,150,.25);box-shadow:0 0 22px rgba(34,199,255,.20)}

@media(max-width:720px){
  .authTopbar{height:50px;min-height:50px}
  .authSurface{height:calc(100dvh - 50px)}
  .authStack{gap:12px}
  .authBrandTitle{font-size:clamp(34px,11vw,54px)}
  .authBrandSub{font-size:10px;letter-spacing:.20em}
  .authCard{border-radius:24px;padding:18px}
  .authPaneTitle{font-size:30px;margin-bottom:17px}
  .authField{min-height:52px}
  .authInput{height:50px;font-size:16px}
  .authPrimary,.authSecondary{min-height:51px}
  .authChoice{min-height:64px}
  #lockScreen .authSurface{height:calc(100dvh - 50px)}
  #lockScreen .authBrandSub{white-space:normal}
  #lockScreen .locklinks{width:min(100%,420px)}
  .authActivation .activationSurface{min-height:calc(100dvh - 50px)}
}
@media(max-width:540px){
  #authScreen,#lockScreen,body.authActivation{background-image:url("/static/root-auth-bg-portrait.webp?v=20260927-authv3")!important;background-position:50% 0!important;background-size:cover!important}
  .authSurface{align-items:flex-start;padding-top:clamp(16px,4vh,34px)}
  .authBrandTitle{font-size:clamp(32px,12vw,48px)}
  .authBrandSub{font-size:9px;letter-spacing:.16em}
  .authCard{padding:17px}
  .authPaneTitle{font-size:28px}
  #lockScreen .lockbox{justify-content:flex-start!important}
  #lockScreen .authBrand{margin-top:0}
  #lockScreen .locklinks{grid-template-columns:1fr!important;gap:9px!important;width:min(100%,340px)!important}
  #lockScreen .locklinks button{min-height:47px!important}
  .authActivation .activationSurface{align-items:flex-start;padding-top:22px}
  .activationCard .row{grid-template-columns:1fr}
  .activationActions{grid-template-columns:1fr}
}
@media(max-height:720px) and (min-width:541px){
  .authSurface{align-items:flex-start;padding-top:12px;padding-bottom:12px}
  .authStack{gap:8px}
  .authBrandTitle{font-size:38px}
  .authBrandSub{margin-top:6px;font-size:9px}
  .authCard{padding:15px 18px;border-radius:22px}
  .authPaneTitle{font-size:25px;margin-bottom:12px}
  .authField{min-height:44px}
  .authInput{height:42px;font-size:14px}
  .authPrimary,.authSecondary{min-height:44px;padding:8px 14px;font-size:14px}
  .authActions{gap:8px;margin-top:10px}
  #lockScreen .keypad{--key-size:52px;gap:7px 18px!important;margin-bottom:10px!important}
  #lockScreen .authBrandTitle{font-size:36px}
  #lockScreen .authBrandSub{margin-top:5px;font-size:9px}
  #lockScreen .locklinks button{min-height:44px!important}
}
@media(orientation:landscape) and (max-height:560px){
  .authTopbar{height:42px;min-height:42px}
  .authSurface{height:calc(100dvh - 42px);padding:8px 18px}
  .authStack{width:min(100%,860px);display:grid;grid-template-columns:.85fr 1.15fr;gap:18px;align-items:center}
  .authBrand{text-align:left}
  .authBrandTitle{font-size:34px}
  .authBrandSub{font-size:8px;white-space:normal}
  .authCard{padding:13px 16px;border-radius:20px}
  .authPaneTitle{font-size:23px;margin-bottom:10px}
  #lockScreen .lockbox{display:grid!important;grid-template-columns:.8fr 1.2fr!important;grid-template-areas:"brand keypad" "id keypad" "dots keypad" "links keypad"!important;column-gap:22px!important;width:min(100%,820px)}
  #lockScreen .authBrand{grid-area:brand;text-align:left}
  #lockScreen .lockIdentity{grid-area:id;text-align:left;width:100%}
  #lockScreen .pinDots{grid-area:dots;justify-content:flex-start!important}
  #lockScreen .keypad{grid-area:keypad;--key-size:48px;gap:6px 14px!important;margin:0!important}
  #lockScreen .locklinks{grid-area:links;grid-template-columns:1fr!important;width:100%!important}
  #lockScreen .locklinks button{min-height:39px!important}
}
@media(prefers-reduced-motion:reduce){.authPrimary,.authSecondary,.authChoice,#lockScreen .key{transition:none!important}}

#authScreen .authCard .authPane{padding:0!important;margin:0!important}

html[data-theme] #authScreen,html[data-theme] #lockScreen{display:block!important;background:#01070d url("/static/root-auth-bg-wide.webp?v=20260927-authv3") center/cover no-repeat!important;color:var(--auth-text)!important}
@media(max-width:540px){html[data-theme] #authScreen,html[data-theme] #lockScreen{background-image:url("/static/root-auth-bg-portrait.webp?v=20260927-authv3")!important;background-position:50% 0!important;background-size:cover!important}}

#lockScreen #lockBiometric{
  color:#eafcff!important;
  border-color:rgba(102,222,255,.88)!important;
  background:
    radial-gradient(circle at 28% 18%,rgba(255,255,255,.34),transparent 30%),
    linear-gradient(145deg,rgba(255,255,255,.17),rgba(39,167,221,.10),rgba(8,38,62,.24))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.48),
    0 0 25px rgba(34,190,255,.22),
    0 10px 28px rgba(0,0,0,.30)!important;
}
#lockScreen #lockBiometric:disabled{opacity:.58!important}
#lockScreen #lockBiometric svg{filter:drop-shadow(0 0 7px rgba(92,216,255,.40))}

#lockScreen #lockBiometric{grid-column:1/-1}
@media(max-width:620px){#lockScreen #lockBiometric{grid-column:auto}}

/* iOS auth/password + post-login transition · 2026-09-29 */
html[data-theme] #authScreen.hidden,
html[data-theme] #lockScreen.hidden{display:none!important}
#loginName,#loginPass{-webkit-user-select:text!important;user-select:text!important;-webkit-touch-callout:default!important}
#loginPass{font-size:17px!important;letter-spacing:.01em!important}



@media(prefers-reduced-motion:reduce){}
/* Actual after-auth playback: full artwork and captions stay visible. */
.authSuccessTransition{position:fixed;inset:0;z-index:6000;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at center,rgba(5,33,55,.65),#00050a 70%);opacity:1;pointer-events:auto;isolation:isolate;animation:rootLoginIn .24s ease-out both}
.authSuccessTransition.hidden{display:none!important}
.authSuccessVideo{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;background:transparent;border:0;border-radius:0}
.authSuccessTransition.leaving{animation:rootLoginOut .36s ease-in both;pointer-events:none}
.authVideoPlaying{overflow:hidden}
.authVideoAction{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);min-height:48px;padding:13px 22px;border:1px solid #35ccff;border-radius:14px;background:rgba(0,12,24,.94);color:#e8f8ff;font:600 15px system-ui;box-shadow:0 0 24px rgba(0,165,255,.25);cursor:pointer}
.authVideoSkip{position:absolute;z-index:3;right:max(16px,env(safe-area-inset-right));top:calc(16px + env(safe-area-inset-top));min-height:44px;padding:8px 13px;border:1px solid rgba(114,217,255,.24);border-radius:12px;background:rgba(0,7,14,.7);color:#c9e7f3;font:12px system-ui;cursor:pointer}
.authVideoStatus{position:absolute;z-index:3;bottom:calc(26px + env(safe-area-inset-bottom));color:#beddef;font:13px system-ui}
@keyframes rootLoginIn{from{opacity:0}to{opacity:1}}
@keyframes rootLoginOut{from{opacity:1}to{opacity:0}}
@media(prefers-reduced-motion:reduce){.authSuccessTransition{animation:none!important}}
