/* Future Automation: shared dark theme for the inner pages (loaded after each page's own <style>) */
:root{
  --bg:#060b14;--bg2:#0b1424;--surface:#0c1627;--text:#e9eff8;--muted:#9aabc2;--muted2:#64758d;
  --sky:#19e0c9;--sky-d:#19e0c9;--sky-soft:rgba(25,224,201,.09);--navy:#e9eff8;
  --line:rgba(140,170,210,.14);--line2:rgba(140,170,210,.26);
  --ok:#3ddc97;--ok-d:#3ddc97;--ok-soft:rgba(61,220,151,.09);
  --bad:#ff6b6b;--bad-soft:rgba(255,107,107,.09);--red:#ff6b6b;--red-soft:rgba(255,107,107,.09);--green:#3ddc97;
  --warn:#ffbf5a;--warn-soft:rgba(255,191,90,.09);--gold:#ffbf5a;--gold-soft:rgba(255,191,90,.12);
  --star:#ffbf5a;--star-off:#26344c;
  --shadow:0 24px 60px -30px rgba(0,0,0,.9);
  --f-head:'Alexandria',system-ui,sans-serif;--f-body:'Readex Pro',system-ui,sans-serif;--f-mono:'JetBrains Mono',ui-monospace,Consolas,monospace;
  color-scheme:dark;
}
html{background:radial-gradient(900px 520px at 100% -10%,rgba(25,224,201,.13),transparent 60%),radial-gradient(800px 520px at 0% 110%,rgba(124,140,255,.11),transparent 60%),#060b14;background-attachment:fixed}
body.fa{background:transparent!important;color:var(--text);font-weight:400;position:relative}
body.fa::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(rgba(140,170,210,.09) 1px,transparent 1px);background-size:26px 26px;-webkit-mask-image:linear-gradient(180deg,#000,rgba(0,0,0,.2));mask-image:linear-gradient(180deg,#000,rgba(0,0,0,.2))}
::selection{background:#19e0c9;color:#04121a}
body.fa a{color:var(--sky)}
body.fa h1,body.fa h2,body.fa h3{letter-spacing:-.01em}
body.fa ::placeholder{color:#5c6d85}

/* brand */
body.fa .brand{color:var(--text)!important}
body.fa .brand .mark{width:50px;height:43px;flex:none}
body.fa .brand small{font-family:var(--f-mono);color:var(--sky)!important;letter-spacing:.2em!important;font-size:10.5px!important}

/* surfaces */
body.fa .card{background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012)),#0a1322!important;border:1px solid var(--line)!important;box-shadow:0 30px 70px -40px rgba(0,0,0,.9)!important}
body.fa footer{background:transparent!important;border-color:var(--line)!important}

/* form controls */
body.fa input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=range]),body.fa select,body.fa textarea{background:rgba(3,7,14,.6)!important;color:var(--text)!important;border-color:var(--line2)}
body.fa input:focus,body.fa select:focus,body.fa textarea:focus{outline:0;border-color:var(--sky)!important;box-shadow:0 0 0 3px rgba(25,224,201,.14)!important}
body.fa select option{background:#0c1627;color:#e9eff8}

/* buttons */
body.fa .btn{border-radius:12px}
body.fa .btn.pri,
body.pg-account .btn:not(.ghost):not(.danger),
body.pg-photo .btn:not(.ghost):not(.danger),
body.pg-check form button,
body.pg-rate .send{color:#04121a!important;box-shadow:0 0 0 1px rgba(25,224,201,.55),0 12px 30px -14px rgba(25,224,201,.95)}
body.fa .btn.pri:hover,
body.pg-account .btn:not(.ghost):not(.danger):hover,
body.pg-photo .btn:not(.ghost):not(.danger):hover,
body.pg-check form button:hover,
body.pg-rate .send:hover{background:#4dfbe5!important}
body.fa .btn.ghost{background:rgba(255,255,255,.03)!important;color:var(--text);border:1px solid var(--line2)!important;box-shadow:none}
body.fa .btn.ghost:hover{background:rgba(25,224,201,.08)!important;border-color:rgba(25,224,201,.5)!important}
body.fa .btn.danger{background:transparent!important;border:1px solid rgba(255,107,107,.4)!important}
body.fa .btn.danger:hover{background:var(--bad-soft)!important}

/* status boxes */
body.fa .res.ok{border-color:rgba(61,220,151,.35)!important}
body.fa .res.bad{border-color:rgba(255,107,107,.35)!important}
body.fa .res.info{border-color:rgba(25,224,201,.3)!important}
body.fa .res .ic,body.fa .okline i{color:#04121a!important}
body.fa .note.warn{border-color:rgba(255,191,90,.35);color:#ffd99a}
body.fa .note.ok{border-color:rgba(61,220,151,.35);color:#a8f0cc}
body.fa .note.bad{border-color:rgba(255,107,107,.35);color:#ffb8b8}

/* account */
.pg-account .me .ph{background:#0b1424;border-color:rgba(140,170,210,.25);color:#5c6d85}
.pg-account .chip.g{background:rgba(255,255,255,.06)}
.pg-account .diff div{background:rgba(255,255,255,.04)}
.pg-account .fld.chg input,.pg-account .fld.chg select,.pg-account .fld.chg textarea{background:rgba(25,224,201,.06)!important;border-color:var(--sky)}
.pg-account .nom{background:rgba(255,255,255,.02)}

/* check */
.pg-check .who{background:rgba(255,255,255,.03)!important}

/* photo */
.pg-photo .frame{background:#0b1424;box-shadow:0 0 0 4px rgba(140,170,210,.22),0 10px 26px -10px rgba(0,0,0,.6)}
.pg-photo .frame .ph{color:var(--muted)}
.pg-photo .old{background:#0b1424;border-color:rgba(140,170,210,.25)}
.pg-photo .tips{background:rgba(255,255,255,.03)}

/* verify (member card) */
.pg-verify .top{background:radial-gradient(120% 120% at 100% 0%,rgba(25,224,201,.35),transparent 60%),linear-gradient(160deg,#101d33,#0b3f3b)}
.pg-verify .photo{background:#0b1424;border-color:#0a1322}
.pg-verify .photo.none{color:#5c6d85}
.pg-verify .type{background:rgba(255,255,255,.06)}
.pg-verify .role{background:linear-gradient(135deg,#19e0c9,#7c8cff);color:#04121a;box-shadow:0 8px 24px -10px rgba(25,224,201,.7)}
.pg-verify dt{background:rgba(255,255,255,.03)}
.pg-verify dd code{font-family:var(--f-mono)}

/* apply */
.pg-apply nav{background:rgba(6,11,20,.8)!important;border-color:var(--line)!important}
.pg-apply .kicker{border-color:rgba(25,224,201,.3);background:rgba(25,224,201,.06);border-radius:8px}
.pg-apply .kicker i{box-shadow:0 0 10px var(--sky)}
.pg-apply .stepper{background:rgba(255,255,255,.03);box-shadow:none}
.pg-apply .sdot b{background:rgba(255,255,255,.06);font-family:var(--f-mono)}
.pg-apply .sdot.on b{background:var(--sky);color:#04121a;box-shadow:0 0 16px rgba(25,224,201,.55)}
.pg-apply .sdot.ok b{background:rgba(25,224,201,.12)}
.pg-apply .choice,.pg-apply .up{background:rgba(255,255,255,.02)}
.pg-apply .choice.on{box-shadow:0 0 0 3px rgba(25,224,201,.14)}
.pg-apply .pick{background:rgba(3,7,14,.45)}
.pg-apply .th{background:#0b1424}
.pg-apply .th .x{background:rgba(6,11,20,.85)}
.pg-apply .privacy{border-color:rgba(25,224,201,.28)}
.pg-apply .err{border-color:rgba(255,107,107,.35)}
.pg-apply .bad input,.pg-apply .bad select,.pg-apply .bad textarea{background:rgba(255,107,107,.06)!important}
.pg-apply .rev div:nth-child(odd){background:rgba(255,255,255,.025)}
.pg-apply .refbox b{font-family:var(--f-mono)}
.pg-apply .done .tick{box-shadow:0 0 30px -6px rgba(61,220,151,.5)}

/* scan (attendance PWA) */
.pg-scan .top{background:rgba(9,17,31,.92)!important;border-bottom:1px solid var(--line);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.pg-scan .top .mark{width:44px;height:38px;flex:none}
.pg-scan .hero .mark{width:96px;height:82px;margin:0 auto;display:block}
.pg-scan .badge-ic.ok{background:rgba(61,220,151,.12)}
.pg-scan .badge-ic.bad{background:rgba(255,107,107,.12)}
.pg-scan .cam{background:#03060c}
.pg-scan .att .no{background:rgba(61,220,151,.12)}
.pg-scan .inst{border-color:rgba(25,224,201,.3)}
.pg-scan .toast{background:#101d33;border:1px solid var(--line2)}
.pg-scan .flash.ok{background:#12915c}.pg-scan .flash.warn{background:#b7791f}.pg-scan .flash.bad{background:#c0392b}
@keyframes hl{from{background:rgba(61,220,151,.18)}to{background:transparent}}
