/* ==========================================================
   LSPD HQ | Design System
   ========================================================== */
:root{
  --bg:#070b14; --bg-2:#0b1220; --surface:#0f182a; --surface-2:#131f36;
  --border:rgba(255,255,255,.08); --border-2:rgba(255,255,255,.14);
  --text:#e8edf6; --muted:#94a3b8; --gold:#d4a537; --gold-2:#f1c75b; --blue:#2f6fed;
  --green:#22c55e; --red:#ef4444;
  --radius:16px; --radius-sm:10px; --shadow:0 20px 50px -20px rgba(0,0,0,.6);
  --container:1200px; --head:'Oswald',sans-serif; --font:'Inter',system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.65;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
svg{width:1.1em;height:1.1em;flex-shrink:0}
h1,h2,h3,h4{font-family:var(--head);letter-spacing:.02em;line-height:1.15;font-weight:600}
.container{width:min(100% - 2.5rem,var(--container));margin-inline:auto}
.muted{color:var(--muted)}
.gold{color:var(--gold)}
.eyebrow{display:inline-block;font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem}
.lead{font-size:1.1rem;color:var(--muted);max-width:620px}

/* Buttons & pills */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.8rem 1.4rem;border-radius:999px;font-weight:600;font-size:.95rem;border:1px solid transparent;cursor:pointer;transition:.25s;font-family:var(--font)}
.btn-sm{padding:.5rem 1rem;font-size:.85rem}
.btn-block{width:100%}
.btn-gold{background:linear-gradient(135deg,var(--gold-2),var(--gold));color:#1a1305;box-shadow:0 8px 24px -8px rgba(212,165,55,.55)}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 14px 30px -10px rgba(212,165,55,.7)}
.btn-ghost{border-color:var(--border-2);color:var(--text);background:rgba(255,255,255,.03)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn svg{transition:transform .25s}.btn:hover svg{transform:translateX(3px)}
.pill{display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;font-weight:600;padding:.3rem .7rem;border-radius:999px;background:rgba(148,163,184,.12);color:var(--muted);border:1px solid var(--border)}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill-green{background:rgba(34,197,94,.12);color:#4ade80;border-color:rgba(34,197,94,.25)}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(7,11,20,.75);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border);transition:.3s}
.site-header.scrolled{background:rgba(7,11,20,.95);box-shadow:0 10px 30px -15px rgba(0,0,0,.8)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;height:74px}
.brand{display:flex;align-items:center;gap:.75rem}
.brand img{width:44px;height:44px;object-fit:contain;filter:drop-shadow(0 4px 10px rgba(212,165,55,.25))}
.brand span{display:flex;flex-direction:column;line-height:1.1}
.brand strong{font-family:var(--head);font-size:1.15rem;letter-spacing:.06em;text-transform:uppercase}
.brand small{font-size:.7rem;color:var(--muted);letter-spacing:.18em;text-transform:uppercase}
.main-nav{display:flex;align-items:center;gap:1.5rem}
.main-nav ul{display:flex;gap:.25rem;list-style:none}
.main-nav ul a{padding:.5rem .9rem;border-radius:8px;font-size:.93rem;font-weight:500;color:var(--muted);transition:.2s;position:relative}
.main-nav ul a:hover{color:var(--text);background:rgba(255,255,255,.04)}
.main-nav ul a.active{color:var(--text)}
.main-nav ul a.active::after{content:"";position:absolute;left:.9rem;right:.9rem;bottom:.1rem;height:2px;background:var(--gold);border-radius:2px}
.nav-toggle{display:none;background:none;border:1px solid var(--border-2);color:var(--text);border-radius:10px;width:42px;height:42px;align-items:center;justify-content:center;cursor:pointer}
.nav-toggle svg{width:22px;height:22px}

/* Hero */
.hero{position:relative;overflow:hidden;padding:6rem 0 5rem;border-bottom:1px solid var(--border)}
.hero-bg{position:absolute;inset:0;background:
  radial-gradient(700px 400px at 85% 30%,rgba(47,111,237,.22),transparent 60%),
  radial-gradient(600px 400px at 10% 90%,rgba(212,165,55,.12),transparent 60%),
  linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px) 0 0/48px 48px,
  linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px) 0 0/48px 48px;
  mask-image:linear-gradient(to bottom,#000 60%,transparent)}
.hero-grid{position:relative;display:grid;grid-template-columns:1.2fr .8fr;gap:3rem;align-items:center}
.kicker{display:inline-flex;align-items:center;gap:.6rem;font-size:.8rem;font-weight:600;padding:.4rem .9rem;border:1px solid var(--border-2);border-radius:999px;background:rgba(255,255,255,.03);color:var(--muted);margin-bottom:1.5rem}
.dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(34,197,94,.2);animation:pulse 2s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(34,197,94,0)}}
.hero h1{font-size:clamp(2.6rem,6vw,4.6rem);text-transform:uppercase;margin-bottom:1.2rem}
.hero h1 .gold{display:block;background:linear-gradient(135deg,var(--gold-2),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin:2rem 0 2.5rem}
.stats{display:flex;gap:2.5rem;padding-top:2rem;border-top:1px solid var(--border)}
.stats dt{font-family:var(--head);font-size:2rem;color:var(--text)}
.stats dd{font-size:.82rem;color:var(--muted)}
.hero-badge{position:relative;display:grid;place-items:center}
.hero-badge img{position:relative;width:min(340px,80%);filter:drop-shadow(0 30px 50px rgba(0,0,0,.6));animation:float 6s ease-in-out infinite}
.badge-glow{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(212,165,55,.35),transparent 70%);filter:blur(30px)}
@keyframes float{50%{transform:translateY(-12px)}}

/* Sections */
.section{padding:5rem 0}
.section.pt-0{padding-top:0}
.section-alt{background:var(--bg-2);border-block:1px solid var(--border)}
.section-head{text-align:center;max-width:640px;margin:0 auto 3rem}
.section-head h2{font-size:clamp(1.8rem,3.5vw,2.5rem);text-transform:uppercase;margin-bottom:.6rem}
.section-head.row{display:flex;justify-content:space-between;align-items:flex-end;text-align:left;max-width:none}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:2rem}

/* Honor cards */
.honor-card{background:linear-gradient(180deg,var(--surface-2),var(--surface));border:1px solid var(--border);border-radius:var(--radius);padding:2rem;text-align:center;transition:.3s;position:relative;overflow:hidden}
.honor-card::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.7}
.honor-card:hover{transform:translateY(-6px);border-color:rgba(212,165,55,.35);box-shadow:var(--shadow)}
.honor-media{position:relative;width:120px;height:120px;margin:0 auto 1.5rem;border-radius:50%;background:radial-gradient(circle,rgba(212,165,55,.15),transparent 70%);display:grid;place-items:center;border:1px dashed rgba(212,165,55,.35)}
.honor-media img{width:84px;opacity:.9}
.honor-ico{position:absolute;bottom:-4px;right:-4px;width:38px;height:38px;border-radius:50%;background:var(--gold);color:#1a1305;display:grid;place-items:center;border:4px solid var(--surface)}
.honor-card h3{font-size:1.4rem;text-transform:uppercase;margin-bottom:.4rem}
.honor-card p{margin-bottom:1.2rem;font-size:.93rem}

/* Division cards */
.div-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.6rem;transition:.3s;position:relative;overflow:hidden}
.div-card::after{content:"";position:absolute;inset:auto -40% -60% auto;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(47,111,237,.18),transparent 70%);opacity:0;transition:.4s}
.div-card:hover{transform:translateY(-6px);border-color:var(--border-2);box-shadow:var(--shadow)}
.div-card:hover::after{opacity:1}
.div-card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.4rem}
.div-logo{width:72px;height:72px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--border);display:grid;place-items:center;padding:8px}
.div-logo img{max-height:100%;object-fit:contain}
.div-card h3{font-size:1.35rem;margin-bottom:.5rem}
.div-card p{color:var(--muted);font-size:.92rem;flex:1;margin-bottom:1.4rem}
.link-arrow{display:inline-flex;align-items:center;gap:.4rem;font-weight:600;font-size:.9rem;color:var(--gold)}
.div-card:hover .link-arrow svg{transform:translateX(4px)}
.link-arrow svg{transition:.25s}

/* CTA */
.cta{display:flex;justify-content:space-between;align-items:center;gap:2rem;padding:3rem;border-radius:24px;border:1px solid rgba(212,165,55,.25);background:radial-gradient(600px 200px at 0% 0%,rgba(212,165,55,.18),transparent),linear-gradient(135deg,var(--surface-2),var(--surface))}
.cta h2{font-size:2rem;text-transform:uppercase;margin-bottom:.4rem}
.cta p{color:var(--muted)}

/* Page hero */
.page-hero{padding:4rem 0 3rem;background:radial-gradient(800px 300px at 80% 0%,rgba(47,111,237,.15),transparent 70%)}
.page-hero h1{font-size:clamp(2.2rem,5vw,3.4rem);text-transform:uppercase;margin-bottom:.8rem}
.crumbs{display:flex;gap:.5rem;font-size:.85rem;color:var(--muted);margin-bottom:1.2rem}
.crumbs a:hover{color:var(--gold)}
.search{display:flex;align-items:center;gap:.7rem;margin-top:2rem;max-width:480px;padding:.85rem 1.1rem;border-radius:12px;background:var(--surface);border:1px solid var(--border-2);color:var(--muted);transition:.2s}
.search:focus-within{border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,165,55,.12)}
.search input{flex:1;background:none;border:0;outline:0;color:var(--text);font:inherit}
.empty{text-align:center;color:var(--muted);padding:3rem 0}

/* About */
.about-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:2rem;align-items:center}
.about-grid h2{font-size:2rem;text-transform:uppercase;margin-bottom:1rem}
.about-grid p{color:var(--muted);margin-bottom:1rem}
.about-grid .btn{margin-top:.6rem}
.about-badge{display:grid;place-items:center}
.about-badge img{width:min(300px,100%);filter:drop-shadow(0 20px 40px rgba(0,0,0,.6))}
.value{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.8rem;transition:.3s}
.value:hover{border-color:rgba(212,165,55,.3);transform:translateY(-4px)}
.value-ico{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:rgba(212,165,55,.12);color:var(--gold);margin-bottom:1.2rem}
.value-ico svg{width:24px;height:24px}
.value h3{font-size:1.25rem;margin-bottom:.4rem}
.value p{font-size:.92rem}

/* Division page */
.div-hero-grid{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:center}
.div-hero .lead{margin-bottom:1.2rem}
.div-hero-logo{width:180px;height:180px;border-radius:24px;background:var(--surface);border:1px solid var(--border);display:grid;place-items:center;padding:20px;box-shadow:var(--shadow)}
.div-hero-logo img{max-height:100%;object-fit:contain}
.div-layout{display:grid;grid-template-columns:1fr 300px;gap:1.5rem;align-items:start}
.form-frame{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.frame-head{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.3rem;border-bottom:1px solid var(--border);font-size:.9rem;font-weight:600}
.frame-head span{display:flex;align-items:center;gap:.5rem}
.frame-head a{display:flex;align-items:center;gap:.4rem;color:var(--gold);font-size:.85rem}
.form-frame iframe{display:block;width:100%;height:1100px;border:0;background:#fff}
.closed{text-align:center;padding:4rem 2rem}
.closed .value-ico{margin:0 auto 1.4rem}
.closed h2{font-size:1.6rem;text-transform:uppercase;margin-bottom:.5rem}
.closed p{max-width:440px;margin:0 auto 1.6rem}
.sidebar{position:sticky;top:94px;padding:1.4rem}
.sidebar h4{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:1rem}
.side-list{list-style:none;display:grid;gap:.25rem}
.side-list a{display:flex;align-items:center;gap:.7rem;padding:.55rem .6rem;border-radius:10px;font-size:.9rem;color:var(--muted);transition:.2s}
.side-list a img{width:28px;height:28px;object-fit:contain}
.side-list a:hover{background:rgba(255,255,255,.04);color:var(--text)}
.side-list a.active{background:rgba(212,165,55,.1);color:var(--gold)}

/* Auth / PHP */
.auth-body{background:radial-gradient(700px 400px at 50% 0%,rgba(47,111,237,.2),transparent 70%),var(--bg)}
.auth-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.6rem;padding:2rem 1rem}
.auth-brand img{width:56px;height:56px}
.auth-card{width:min(420px,100%);background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:2.4rem;box-shadow:var(--shadow)}
.auth-card h1{font-size:1.8rem;text-transform:uppercase;margin-bottom:.3rem}
.auth-card>.muted{margin-bottom:1.6rem}
.form{display:grid;gap:1.1rem}
.form label{display:grid;gap:.45rem;font-size:.85rem;font-weight:500;color:var(--muted)}
.form input,.form select{width:100%;padding:.8rem 1rem;border-radius:10px;border:1px solid var(--border-2);background:var(--bg-2);color:var(--text);font:inherit;font-size:.95rem;transition:.2s}
.form input:focus,.form select:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,165,55,.12)}
.form .btn{margin-top:.4rem}
.alert{padding:.8rem 1rem;border-radius:10px;font-size:.9rem;margin-bottom:1.2rem}
.alert-error{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:#fca5a5}
.alert-success{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);color:#86efac}
.back-link{font-size:.88rem;color:var(--muted);display:inline-block;margin-top:1.2rem}
.back-link:hover{color:var(--gold)}
.dash-card .pill{margin-bottom:1rem}
.dash-actions{display:grid;gap:.7rem;margin-top:1.6rem}

/* Footer */
.site-footer{background:#05080f;border-top:1px solid var(--border);padding-top:4rem;margin-top:auto}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:3rem;padding-bottom:3rem}
.footer-brand p{color:var(--muted);font-size:.9rem;margin-top:1rem;max-width:340px}
.site-footer h4{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text);margin-bottom:1rem}
.site-footer ul{list-style:none;display:grid;gap:.5rem}
.site-footer ul a{color:var(--muted);font-size:.9rem;transition:.2s}
.site-footer ul a:hover{color:var(--gold)}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;padding:1.4rem 0;border-top:1px solid var(--border);font-size:.82rem;color:var(--muted)}
.footer-bottom a:hover{color:var(--gold)}

/* Reveal animation */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* Responsive */
@media (max-width:1024px){
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .div-layout{grid-template-columns:1fr}
  .sidebar{position:static}
}
@media (max-width:820px){
  .nav-toggle{display:inline-flex}
  .main-nav{position:absolute;top:74px;left:0;right:0;flex-direction:column;align-items:stretch;gap:1rem;padding:1.2rem 1.25rem 1.6rem;background:rgba(7,11,20,.98);border-bottom:1px solid var(--border);transform:translateY(-10px);opacity:0;pointer-events:none;transition:.25s}
  .main-nav.open{transform:none;opacity:1;pointer-events:auto}
  .main-nav ul{flex-direction:column}
  .main-nav ul a{display:block;padding:.8rem}
  .main-nav ul a.active::after{display:none}
  .main-nav ul a.active{background:rgba(212,165,55,.1);color:var(--gold)}
  .hero{padding:3.5rem 0}
  .hero-grid,.about-grid,.div-hero-grid{grid-template-columns:1fr}
  .hero-badge{order:-1}.hero-badge img{width:180px}
  .div-hero-logo{width:120px;height:120px;order:-1}
  .cta{flex-direction:column;text-align:center;padding:2.2rem}
  .footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}
  .section-head.row{flex-direction:column;align-items:flex-start;gap:1rem}
}
@media (max-width:560px){
  .grid-3,.grid-4{grid-template-columns:1fr}
  .stats{gap:1.5rem}.stats dt{font-size:1.6rem}
  .section{padding:3.5rem 0}
  .form-frame iframe{height:1300px}
}
[hidden]{display:none!important}

/* ==========================================================
   Staff area (login / dashboard)
   ========================================================== */
.auth-card.center{text-align:center}.auth-card.center .value-ico{margin:0 auto 1rem}
.auth-note{margin-top:1.4rem;font-size:.85rem;color:var(--muted);text-align:center}
.pass-wrap{position:relative;display:block}
.pass-wrap input{padding-right:3rem}
.pass-eye{position:absolute;right:.4rem;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--muted);width:36px;height:36px;border-radius:8px;display:grid;place-items:center;cursor:pointer}
.pass-eye:hover{color:var(--gold);background:rgba(255,255,255,.04)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.form input:disabled{opacity:.5}

.app-body{background:var(--bg)}
.app{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
.app-side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:2rem;padding:1.5rem 1rem;background:#05080f;border-right:1px solid var(--border)}
.app-brand{padding:0 .5rem}.app-brand img{width:40px;height:40px}
.app-nav{display:grid;gap:.25rem;flex:1;align-content:start}
.app-nav a{display:flex;align-items:center;gap:.75rem;padding:.7rem .85rem;border-radius:10px;color:var(--muted);font-size:.92rem;font-weight:500;transition:.2s}
.app-nav a svg{width:18px;height:18px}
.app-nav a:hover{background:rgba(255,255,255,.04);color:var(--text)}
.app-nav a.active{background:rgba(212,165,55,.12);color:var(--gold)}
.app-user{display:flex;align-items:center;gap:.7rem;padding:.8rem;border:1px solid var(--border);border-radius:12px;background:var(--surface)}
.app-user div{flex:1;min-width:0;line-height:1.25}
.app-user strong{display:block;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-user small{font-size:.75rem;color:var(--muted)}
.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;background:linear-gradient(135deg,var(--gold-2),var(--gold));color:#1a1305;font-weight:700}
.avatar.sm{width:32px;height:32px;font-size:.85rem}
.avatar.lg{width:88px;height:88px;font-size:2rem;margin:0 auto 1rem}
.icon-btn{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:9px;border:1px solid var(--border);background:transparent;color:var(--muted);cursor:pointer;transition:.2s}
.icon-btn svg{width:17px;height:17px}
.icon-btn:hover{color:var(--gold);border-color:var(--gold)}
.icon-btn.danger:hover{color:var(--red);border-color:var(--red)}
.app-main{min-width:0}
.app-top{display:flex;align-items:center;gap:1rem;height:74px;padding:0 2rem;border-bottom:1px solid var(--border);background:rgba(7,11,20,.8);backdrop-filter:blur(12px);position:sticky;top:0;z-index:5}
.app-top h1{font-size:1.4rem;text-transform:uppercase}
.app-toggle{display:none}
.app-content{padding:2rem;display:grid;gap:1.5rem;max-width:1200px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.6rem}
.card h2{font-size:1.6rem;text-transform:uppercase;margin-bottom:.3rem}
.card h3{font-size:1.15rem;text-transform:uppercase;letter-spacing:.04em}
.card.narrow{max-width:520px}
.card.narrow .form{margin-top:1.4rem}
.card-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.2rem}
.welcome{display:flex;justify-content:space-between;align-items:center;background:radial-gradient(500px 200px at 0 0,rgba(212,165,55,.16),transparent),linear-gradient(135deg,var(--surface-2),var(--surface))}
.welcome img{width:96px;filter:drop-shadow(0 10px 20px rgba(0,0,0,.5))}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.kpi{display:grid;gap:.2rem}
.kpi span{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:rgba(212,165,55,.12);color:var(--gold);margin-bottom:.6rem}
.kpi span svg{width:20px;height:20px}
.kpi strong{font-family:var(--head);font-size:2rem;line-height:1}
.kpi small{color:var(--muted);font-size:.85rem}
.dash-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:1.5rem;align-items:start}
.div-rows,.user-rows{list-style:none;display:grid}
.div-rows li,.user-rows li{display:flex;align-items:center;gap:.9rem;padding:.7rem 0;border-top:1px solid var(--border)}
.div-rows li:first-child,.user-rows li:first-child{border-top:0}
.div-rows img{width:36px;height:36px;object-fit:contain}
.div-rows div,.user-rows div{flex:1;min-width:0;line-height:1.3}
.div-rows strong,.user-rows strong{display:block;font-size:.92rem;font-weight:600}
.div-rows small,.user-rows small{color:var(--muted);font-size:.78rem}
.rank{font-size:.72rem;font-weight:600;padding:.25rem .65rem;border-radius:999px;border:1px solid}
.rank-admin{color:var(--gold);border-color:rgba(212,165,55,.35);background:rgba(212,165,55,.1)}
.rank-editor{color:#7aa7ff;border-color:rgba(47,111,237,.35);background:rgba(47,111,237,.1)}
.rank-viewer{color:var(--muted);border-color:var(--border-2);background:rgba(148,163,184,.08)}
.rank-bars{display:grid;gap:.7rem;margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--border)}
.rank-bars>div{display:grid;grid-template-columns:60px 1fr 24px;align-items:center;gap:.8rem;font-size:.82rem;color:var(--muted)}
.rank-bars b{color:var(--text);text-align:right}
.bar{height:8px;border-radius:99px;background:rgba(255,255,255,.06);overflow:hidden}
.bar i{display:block;height:100%;border-radius:99px}
.bar i.rank-admin{background:var(--gold)}.bar i.rank-editor{background:var(--blue)}.bar i.rank-viewer{background:var(--muted)}
.search.sm{margin:0;padding:.55rem .9rem;max-width:320px;flex:1}
.table-wrap{overflow-x:auto}
.table{width:100%;border-collapse:collapse;font-size:.9rem}
.table th{text-align:left;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:.8rem 1rem;border-bottom:1px solid var(--border)}
.table td{padding:.85rem 1rem;border-bottom:1px solid var(--border);white-space:nowrap}
.table tr:last-child td{border-bottom:0}
.table tbody tr:hover{background:rgba(255,255,255,.02)}
.cell-user{display:flex;align-items:center;gap:.7rem;font-weight:600}
.center{text-align:center}.right{text-align:right}
form.inline{display:inline}
.select-sm{padding:.4rem .7rem;border-radius:8px;border:1px solid var(--border-2);background:var(--bg-2);color:var(--text);font:inherit;font-size:.85rem;cursor:pointer}
.profile{text-align:center}
.profile h2{margin-bottom:.6rem}
.meta{display:grid;gap:.8rem;margin-top:1.6rem;text-align:left;padding-top:1.2rem;border-top:1px solid var(--border)}
.meta div{display:flex;justify-content:space-between;font-size:.88rem}
.meta dt{color:var(--muted)}
.card .form{margin-top:1.2rem}
@media (max-width:1024px){.kpis{grid-template-columns:repeat(2,1fr)}.dash-grid{grid-template-columns:1fr}}
@media (max-width:820px){
  .app{grid-template-columns:1fr}
  .app-side{position:fixed;inset:0 auto 0 0;width:270px;z-index:20;transform:translateX(-100%);transition:.25s}
  .app-side.open{transform:none;box-shadow:20px 0 60px rgba(0,0,0,.6)}
  .app-toggle{display:inline-flex}
  .app-top,.app-content{padding-inline:1.2rem}
}
@media (max-width:560px){.kpis{grid-template-columns:1fr 1fr;gap:1rem}.welcome img{display:none}}

/* ==========================================================
   Panel v3: MDC, roster, dispatch, forms
   ========================================================== */
.pill-red{background:rgba(239,68,68,.12);color:#fca5a5;border-color:rgba(239,68,68,.3)}
.pill-gold{background:rgba(212,165,55,.12);color:var(--gold-2);border-color:rgba(212,165,55,.3)}
.pill-blue{background:rgba(47,111,237,.14);color:#93b4ff;border-color:rgba(47,111,237,.3)}
.pill-muted{background:rgba(148,163,184,.1);color:var(--muted)}
.app-side{overflow-y:auto;gap:1.2rem}
.app-nav{gap:.1rem}
.app-nav a{padding:.55rem .85rem}
.nav-label{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:#5b6b85;font-weight:700;padding:1rem .85rem .35rem}
.nav-label:first-child{padding-top:0}
.side-backdrop{display:none}
.app-top{gap:.9rem}
.top-duty{margin-left:.4rem}
.top-actions{margin-left:auto;display:flex;gap:.6rem;align-items:center}
.app-content{max-width:1400px}
.kpis.six{grid-template-columns:repeat(6,1fr)}
a.kpi{transition:.2s}a.kpi:hover{border-color:var(--border-2);transform:translateY(-2px)}
.kpi span.red{background:rgba(239,68,68,.12);color:#fca5a5}
.dash-grid{grid-template-columns:1fr 1fr}
.welcome{gap:1.5rem;flex-wrap:wrap}
.duty-switch{display:flex;flex-wrap:wrap;gap:.4rem}
.duty-btn{display:flex;flex-direction:column;align-items:flex-start;gap:0;padding:.5rem .8rem;border-radius:10px;border:1px solid var(--border-2);background:rgba(255,255,255,.02);color:var(--muted);font:inherit;font-size:.72rem;cursor:pointer;transition:.2s;position:relative;padding-left:1.5rem}
.duty-btn b{font-family:var(--head);font-size:1rem;color:var(--text);letter-spacing:.04em}
.duty-btn::before{content:"";position:absolute;left:.6rem;top:50%;width:7px;height:7px;border-radius:50%;transform:translateY(-50%);background:var(--muted)}
.duty-btn.dot-green::before,.dot.dot-green{background:var(--green)}
.duty-btn.dot-gold::before,.dot.dot-gold{background:var(--gold)}
.duty-btn.dot-blue::before,.dot.dot-blue{background:var(--blue)}
.duty-btn.dot-red::before,.dot.dot-red{background:var(--red)}
.dot.dot-muted{background:var(--muted)}
.duty-btn:hover{border-color:var(--gold)}
.duty-btn.on{border-color:var(--gold);background:rgba(212,165,55,.1);color:var(--gold-2)}
.avatar.alt{background:var(--surface-2);color:var(--muted);border:1px solid var(--border);font-size:.7rem;width:auto;min-width:42px;padding:0 .4rem;border-radius:8px}
.avatar.danger{background:rgba(239,68,68,.14);color:#fca5a5}
.avatar.danger svg,.avatar.alt svg{width:16px;height:16px}
.link{color:var(--text);border-bottom:1px dashed rgba(255,255,255,.2)}
.link:hover{color:var(--gold);border-color:var(--gold)}
.link.strong{font-weight:600;border-bottom:0}
.user-rows li .link.strong{display:block;font-size:.92rem}
.news{display:grid;gap:.8rem}
.news article{padding:1rem 1.1rem;border-radius:12px;background:var(--bg-2);border:1px solid var(--border)}
.news article.pinned{border-color:rgba(212,165,55,.35);background:linear-gradient(135deg,rgba(212,165,55,.08),transparent)}
.news h4{font-family:var(--font);font-size:.95rem;font-weight:600;letter-spacing:0;margin-bottom:.3rem}
.news p{font-size:.88rem;color:var(--muted)}
.news small{display:block;margin-top:.5rem;font-size:.75rem;color:#64748b}

/* filters + tables */
.filters{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:1.2rem}
.filters .count{margin-left:auto;font-size:.85rem}
.check{display:flex!important;flex-direction:row!important;align-items:center;gap:.55rem!important;cursor:pointer;color:var(--text)!important}
.check input{width:18px!important;height:18px;accent-color:var(--gold)}
.check.sm{font-size:.85rem}
.empty-cell{text-align:center;color:var(--muted);padding:2.5rem!important}
.table td.clip{max-width:320px;white-space:normal;color:var(--muted)}
.nowrap{white-space:nowrap}
.table .icon-btn{margin-left:.25rem}
.table tr.click{cursor:pointer}
.group-row td{background:rgba(212,165,55,.06);color:var(--gold-2);font-family:var(--head);letter-spacing:.06em;text-transform:uppercase;font-size:.85rem;padding:.55rem 1rem!important}
.callsign{font-family:var(--head);letter-spacing:.06em;color:var(--gold-2)}
.block{display:block}
.pager{display:flex;gap:.35rem;justify-content:center;margin-top:1.2rem}
.pager a{min-width:34px;height:34px;display:grid;place-items:center;border-radius:8px;border:1px solid var(--border);color:var(--muted);font-size:.85rem}
.pager a.active,.pager a:hover{border-color:var(--gold);color:var(--gold)}
code{font-size:.8rem;background:var(--bg-2);padding:.15rem .45rem;border-radius:6px;border:1px solid var(--border)}

/* forms */
.form-card{max-width:900px}
.grid-form{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.span-2{grid-column:1/-1}
.form textarea{width:100%;padding:.8rem 1rem;border-radius:10px;border:1px solid var(--border-2);background:var(--bg-2);color:var(--text);font:inherit;font-size:.93rem;resize:vertical;transition:.2s}
.form textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 4px rgba(212,165,55,.12)}
.form input[type=date]{color-scheme:dark}
.req{color:var(--red);font-weight:600}
.form-actions{display:flex;justify-content:flex-end;gap:.6rem;margin-top:.4rem}
.danger-text{color:#fca5a5!important}
.danger-text:hover{border-color:var(--red)!important}
.mt{margin-top:1rem}
.hp{position:absolute;left:-9999px;opacity:0}

/* dispatch board */
.board{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.lane{padding:1rem;min-height:180px}
.lane-head{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--muted);margin-bottom:.9rem}
.lane-head b{font-family:var(--head);color:var(--text);font-size:1rem}
.lane-count{margin-left:auto;font-size:.75rem;background:var(--bg-2);border:1px solid var(--border);border-radius:99px;padding:.1rem .55rem}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;box-shadow:none;animation:none}
.unit{padding:.7rem;border-radius:10px;background:var(--bg-2);border:1px solid var(--border);margin-bottom:.5rem;display:grid;gap:.5rem;font-size:.88rem}
.unit strong{font-family:var(--head);color:var(--gold-2);letter-spacing:.05em}
.unit small{display:block;color:var(--muted);font-size:.74rem}
.unit .select-sm{width:100%}
.small{font-size:.82rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .5rem .35rem .8rem;border-radius:99px;background:var(--bg-2);border:1px solid var(--border);font-size:.83rem}
span.chip{padding-right:.8rem}
.chip-btn{border:0;background:rgba(34,197,94,.14);color:#4ade80;border-radius:99px;padding:.15rem .55rem;font:inherit;font-size:.72rem;font-weight:700;cursor:pointer}

/* MDC search */
.mdc-hero{background:radial-gradient(600px 200px at 100% 0,rgba(47,111,237,.16),transparent),var(--surface)}
.mdc-search{display:flex;align-items:center;gap:.8rem;padding:.5rem .5rem .5rem 1.1rem;border-radius:14px;background:var(--bg-2);border:1px solid var(--border-2)}
.mdc-search:focus-within{border-color:var(--gold)}
.mdc-search svg{width:22px;height:22px;color:var(--muted)}
.mdc-search input{flex:1;background:none;border:0;outline:0;color:var(--text);font:inherit;font-size:1.05rem;padding:.6rem 0}
.quick{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.quick a{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .85rem;border-radius:10px;border:1px solid var(--border);font-size:.85rem;color:var(--muted);transition:.2s}
.quick a svg{width:16px;height:16px}
.quick a:hover{color:var(--gold);border-color:var(--gold)}
.alert-card{border-color:rgba(239,68,68,.35);background:linear-gradient(135deg,rgba(239,68,68,.12),transparent)}
.alert-card h3{display:flex;align-items:center;gap:.6rem;color:#fca5a5;font-size:1rem}
.alert-card p{margin-top:.5rem;font-size:.9rem}
.result-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.8rem}
.result{display:flex;gap:.9rem;padding:.9rem;border-radius:12px;background:var(--bg-2);border:1px solid var(--border);transition:.2s}
.result:hover{border-color:var(--gold)}
.result strong{display:block}.result small{color:var(--muted);font-size:.8rem}
.tags{display:flex;gap:.35rem;flex-wrap:wrap;margin-top:.4rem}
.mug{width:52px;height:52px;border-radius:12px;background:var(--surface-2);border:1px solid var(--border);display:grid;place-items:center;font-family:var(--head);font-size:1.2rem;color:var(--muted);overflow:hidden;flex-shrink:0}
.mug img{width:100%;height:100%;object-fit:cover}
.mug.lg{width:140px;height:140px;border-radius:18px;font-size:2.6rem;margin:0 auto 1rem}
.plate{display:inline-block;font-family:var(--head);letter-spacing:.12em;background:#f4f1e6;color:#0b1a3a;padding:.15rem .6rem;border-radius:6px;border:2px solid #0b1a3a;font-size:.85rem;font-weight:600}
.profile-grid{display:grid;grid-template-columns:340px 1fr;gap:1.5rem;align-items:start}
.id-card{text-align:center;position:sticky;top:94px}
.id-card h2{font-size:1.5rem}
.stack{display:grid;gap:1.5rem}
.note{margin-top:1.2rem;text-align:left;padding:.9rem;border-radius:10px;background:var(--bg-2);border:1px solid var(--border);font-size:.88rem;color:var(--muted)}
.meta dd{text-align:right}
.user-rows .plate{flex-shrink:0}

/* reports */
.report-layout{display:grid;grid-template-columns:1fr 380px;gap:1.5rem;align-items:start}
.charges-box{position:sticky;top:94px;display:grid;gap:.9rem}
.charges-box .search.sm{max-width:none}
.charge-list{max-height:420px;overflow-y:auto;display:grid;gap:.35rem;padding-right:.3rem}
.charge-cat{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#5b6b85;font-weight:700;margin:.6rem 0 .1rem}
.charge{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;border-radius:10px;border:1px solid var(--border);background:var(--bg-2);cursor:pointer;transition:.15s}
.charge:hover{border-color:var(--border-2)}
.charge.on{border-color:var(--gold);background:rgba(212,165,55,.08)}
.charge div{flex:1;min-width:0;line-height:1.3}
.charge strong{display:block;font-size:.85rem;font-weight:600}
.charge small{font-size:.74rem;color:var(--muted)}
.charge .qty{width:56px;padding:.35rem .4rem;border-radius:8px;border:1px solid var(--border-2);background:var(--surface);color:var(--text);font:inherit;text-align:center}
.totals{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.totals div{padding:.8rem;border-radius:12px;background:var(--bg-2);border:1px solid var(--border)}
.totals small{display:block;color:var(--muted);font-size:.75rem}
.totals b{font-family:var(--head);font-size:1.4rem;color:var(--gold-2)}
.paper{max-width:900px}
.paper-head{display:flex;gap:1.2rem;align-items:center;padding-bottom:1.3rem;border-bottom:1px solid var(--border);margin-bottom:1.3rem}
.paper-head h2{font-size:1.6rem;margin:.1rem 0 .5rem}
.paper-id{margin-left:auto;text-align:right;font-family:var(--head);font-size:1.6rem;color:var(--gold-2)}
.paper-id small{display:block;font-family:var(--font);font-size:.78rem;color:var(--muted)}
.paper-meta{display:grid;grid-template-columns:1fr 1fr;gap:.9rem 1.5rem;margin-bottom:1.5rem}
.paper-meta dt{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.paper h3{font-size:.95rem;margin:1.5rem 0 .6rem;color:var(--gold)}
.paper-text{white-space:normal;color:#cbd5e1;font-size:.95rem;line-height:1.75}
.total-row td{font-weight:700;border-top:2px solid var(--border-2)}
.paper-foot{display:flex;justify-content:space-between;align-items:center;margin-top:2rem;padding-top:1rem;border-top:1px solid var(--border);font-size:.82rem;color:var(--muted)}
.qa{display:grid;gap:1.1rem;margin-top:.5rem}
.qa h4{font-family:var(--font);letter-spacing:0;font-size:.92rem;font-weight:600;margin-bottom:.35rem}
.qa p{color:#cbd5e1;font-size:.92rem;padding:.8rem 1rem;border-radius:10px;background:var(--bg-2);border:1px solid var(--border)}
.decision{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}

/* tabs */
.tabs{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.tabs a{padding:.5rem .9rem;border-radius:10px;border:1px solid var(--border);font-size:.87rem;color:var(--muted);display:flex;gap:.45rem;align-items:center}
.tabs a span{font-size:.72rem;background:var(--bg-2);padding:.05rem .45rem;border-radius:99px}
.tabs a.active{border-color:var(--gold);color:var(--gold);background:rgba(212,165,55,.08)}
.tabs-right{margin-left:auto}
.perm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.perm-grid p{font-size:.85rem;margin-top:.5rem}

/* public apply */
.auth-card.wide{width:min(720px,100%)}
.apply-list{display:grid;gap:.6rem;margin-top:1rem}
.apply-item{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.1rem;border-radius:12px;background:var(--bg-2);border:1px solid var(--border);transition:.2s}
.apply-item:hover{border-color:var(--gold)}
.apply-item small{display:block;color:var(--muted);font-size:.83rem}
.apply-wrap{padding-block:3rem}

@media (max-width:1280px){.board{grid-template-columns:repeat(3,1fr)}.kpis.six{grid-template-columns:repeat(3,1fr)}}
@media (max-width:1024px){.dash-grid,.report-layout,.profile-grid{grid-template-columns:1fr}.charges-box,.id-card{position:static}.perm-grid{grid-template-columns:1fr}}
@media (max-width:820px){.side-backdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:15;opacity:0;pointer-events:none;transition:.2s}.app-side.open+.side-backdrop{opacity:1;pointer-events:auto}.board{grid-template-columns:1fr 1fr}.top-duty{display:none}}
@media (max-width:560px){.grid-form,.paper-meta{grid-template-columns:1fr}.board,.kpis.six{grid-template-columns:1fr 1fr}.top-actions .btn span{display:none}}

@media print{
  .app-side,.app-top,.side-backdrop,.paper-foot form{display:none!important}
  .app{display:block}.app-content{padding:0}
  body{background:#fff;color:#000}
  .paper{border:0;background:#fff;color:#000;box-shadow:none}
  .paper *{color:#000!important}.pill{border-color:#999}
}

/* ==========================================================
   Roster board (spreadsheet layout)
   ========================================================== */
.rb-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin-bottom:1rem}
.rb-tabs{display:flex;gap:.3rem;padding:.25rem;border-radius:12px;background:var(--surface);border:1px solid var(--border)}
.rb-tabs a{padding:.45rem 1.1rem;border-radius:9px;font-family:var(--head);font-size:.95rem;letter-spacing:.12em;color:var(--muted);transition:.2s}
.rb-tabs a:hover{color:var(--text)}
.rb-tabs a.active{background:var(--gold);color:#1a1305}
.rb-hint{font-size:.85rem;margin-left:auto}
.rb-scroll{overflow:auto;max-height:calc(100vh - 190px);border:1px solid var(--border);border-radius:14px;background:#060a12}
.rb{display:grid;grid-auto-flow:column;grid-template-columns:400px;grid-auto-columns:minmax(440px,1fr);gap:6px;padding:6px;width:max-content;min-width:100%;align-items:start}
.rb-side{position:sticky;left:0;z-index:3;display:grid;gap:6px;width:400px;background:#060a12;box-shadow:6px 0 0 #060a12}
.rb-col{background:var(--surface);border:1px solid var(--border);border-radius:8px;overflow:clip}
.rb>.rb-col{min-height:100%}
.rb-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.55rem .8rem;background:var(--col,#1f2937);border-bottom:2px solid var(--gold);font-family:var(--head);font-size:1.02rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#fff}
.rb-side .rb-head{position:static}
.rb-sec{position:relative;display:flex;align-items:center;justify-content:center;padding:.3rem .8rem;background:#1a2336;border-block:1px solid rgba(255,255,255,.06);font-size:.86rem;font-weight:700;color:#cfd8e6}
.rb-tool{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:6px;border:0;background:rgba(255,255,255,.08);color:#fff;cursor:pointer;opacity:0;transition:.15s}
.rb-head .rb-tool{position:absolute;right:.5rem}
.rb-sec .rb-tool{position:absolute;right:.4rem;width:22px;height:22px}
.rb-tool svg{width:14px;height:14px}
.rb-col:hover .rb-tool,.rb-tool:focus-visible{opacity:1}
.rb-tool:hover{background:var(--gold);color:#1a1305}
.rb-head{position:sticky}
.rs-row{--flag:transparent;display:grid;grid-template-columns:72px 52px 26px minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:.5rem;width:100%;min-height:30px;padding:.2rem .7rem;border:0;border-bottom:1px solid rgba(255,255,255,.045);background:linear-gradient(90deg,color-mix(in srgb,var(--flag) 30%,transparent),color-mix(in srgb,var(--flag) 14%,transparent));box-shadow:inset 3px 0 0 var(--flag);color:var(--text);font:inherit;font-size:.86rem;text-align:left;transition:background .15s,opacity .15s}
.rs-row:nth-of-type(even){background-color:rgba(255,255,255,.018)}
button.rs-row{cursor:pointer}
button.rs-row:hover{background-color:rgba(212,165,55,.1)}
.rs-call{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.rs-badge{color:#7fa8e8;font-variant-numeric:tabular-nums}
.rs-ins{display:grid;place-items:center;color:#9aa8bd}
.rs-ins .ins{width:18px;height:18px}
.rs-ins .ins-stars{width:auto;height:11px;max-width:30px}
.rs-rank,.rs-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rs-name{font-weight:600;text-align:right;color:#fff}
.r-staff{color:#8ab4ff}.rs-ins.r-staff{color:var(--gold-2)}
.r-sup{color:#ff8a8a}.rs-ins.r-sup{color:#ff8a8a}
.r-det{color:#b9a2ff}.rs-ins.r-det{color:#b9a2ff}
.rs-row.vacant .rs-rank{opacity:.75}
.rs-row.vacant .rs-call,.rs-row.vacant .rs-badge{opacity:.8}
.rs-row.hit{outline:2px solid var(--gold);outline-offset:-2px;background-color:rgba(212,165,55,.18)}
.rs-row.dim{opacity:.28}
.rb-side .rs-row{grid-template-columns:62px 34px minmax(0,1.25fr) minmax(0,1fr)}
.rb-side .rs-badge{display:none}
.rb-kv,.rb-cs,.rb-flag{display:grid;align-items:center;min-height:30px;padding:.2rem .8rem;border-bottom:1px solid rgba(255,255,255,.045);font-size:.86rem}
.rb-kv{grid-template-columns:1fr auto;text-align:center}
.rb-kv span{font-weight:600}
.rb-kv b{min-width:2.5rem;text-align:center;color:var(--gold-2);font-variant-numeric:tabular-nums}
.rb-cs{grid-template-columns:52px 1fr 1fr;text-align:center}
.rb-cs b{color:var(--gold-2)}
.rb-cs span:last-child{font-weight:600}
.rb-flag{grid-template-columns:1fr 2.5rem;text-align:center;font-weight:700;background:var(--flag);color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.35)}
.rb-flag.plain{background:transparent;text-shadow:none}
.rb-flag[style*="#22c55e"],.rb-flag[style*="#eab308"],.rb-flag[style*="#f97316"]{color:#111;text-shadow:none}
.rb-link{display:flex;align-items:center;justify-content:center;gap:.4rem;width:100%;padding:.45rem;border:0;background:transparent;color:var(--gold);font:inherit;font-size:.82rem;cursor:pointer}
.rb-link svg{width:14px;height:14px}
.rb-empty{padding:1rem;color:var(--muted);text-align:center;font-size:.88rem}
.rb-empty.big{align-self:center;padding:3rem}
.rb-unassigned{margin-top:1.2rem}
.rb-unassigned p{margin-top:.8rem}
.rb-dlg{margin:auto;width:min(520px,calc(100% - 2rem));padding:1.4rem;border-radius:16px;border:1px solid var(--border-2);background:var(--surface);color:var(--text);box-shadow:var(--shadow)}
.rb-dlg::backdrop{background:rgba(3,6,12,.7);backdrop-filter:blur(3px)}
.rb-dlg-head{display:flex;justify-content:space-between;align-items:center}
.rb-dlg-head h3{font-size:1.2rem;text-transform:uppercase}
.rb-grid{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.rb-grid .span-2{grid-column:span 2}
.rb-dlg .form textarea,.rb-dlg .form select{width:100%}
.rb-dlg input[type=color]{height:44px;padding:.3rem}
.rb-dlg-foot{display:flex;flex-direction:row-reverse;justify-content:space-between;gap:.6rem}
.rb-dlg-foot .btn{margin-top:0}
.btn-ghost.danger:hover{border-color:var(--red);color:var(--red)}
@media (max-width:900px){.rb-side{position:static;box-shadow:none}.rb{grid-auto-flow:row;grid-auto-columns:auto;width:100%}.rb-side{width:auto}.rb-scroll{max-height:none}.rb-hint{margin-left:0}.rb-head{position:static}}

/* Account approval + Give Division */
.alert-gold{background:rgba(212,165,55,.1);border:1px solid rgba(212,165,55,.3);color:var(--gold-2)}
.auth-card .center .value-ico{margin:0 auto 1rem}
.auth-card .center h1{margin-bottom:.5rem}
.auth-card .center .btn{margin-top:1.4rem}
.nav-count{margin-left:auto;min-width:22px;height:22px;padding:0 .45rem;border-radius:99px;background:var(--red);color:#fff;font-size:.72rem;font-weight:700;display:grid;place-items:center}
.acc-tabs{margin-bottom:1.2rem}
.acc-list{display:grid;gap:1rem}
.acc-empty .value-ico{margin:0 auto 1rem}
.acc-head{display:flex;align-items:center;gap:.9rem}
.acc-head div{flex:1;min-width:0;display:grid;line-height:1.35}
.acc-head strong{font-size:1.05rem}
.acc-date{font-size:.85rem;white-space:nowrap}
.acc-note{margin-top:1rem;padding:.8rem 1rem;border-radius:10px;background:var(--bg-2);border:1px solid var(--border);font-size:.93rem}
.acc-meta{margin-top:.9rem;font-size:.88rem}
.acc-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:flex-end;margin-top:1.1rem;padding-top:1.1rem;border-top:1px solid var(--border)}
.acc-approve{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.8rem}
.acc-approve>label:not(.check){display:grid;gap:.3rem;font-size:.78rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.acc-approve .check{padding-bottom:.4rem}
.acc-deny{display:flex;gap:.6rem;align-items:center;margin-top:0}
.acc-deny input{min-width:240px;padding:.5rem .8rem;border-radius:8px;border:1px solid var(--border-2);background:var(--bg-2);color:var(--text);font:inherit;font-size:.88rem}
.acc-deny input:focus{outline:0;border-color:var(--gold)}
article .acc-deny,.inline-approve{margin-top:1rem}
.acc-divs{margin-top:.8rem}
.div-chip{--dc:#64748b;padding:.25rem .7rem;gap:.4rem;font-size:.8rem;font-weight:600;background:color-mix(in srgb,var(--dc) 16%,transparent);border-color:color-mix(in srgb,var(--dc) 45%,transparent);color:color-mix(in srgb,var(--dc) 55%,#fff)}
.div-chip b{color:#fff}
.chip-x{display:grid;place-items:center;width:18px;height:18px;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:inherit;cursor:pointer}
.chip-x svg{width:11px;height:11px}
.chip-x:hover{background:var(--red);color:#fff}
.div-summary{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 1.2rem}
.gd-table td{vertical-align:middle}
.gd-divs{white-space:normal!important;min-width:260px}
.gd-divs .chips form{display:inline-flex}
.gd-sub{display:block;font-size:.8rem}
.gd-give{display:flex;gap:.5rem;align-items:center}
.gd-help{margin-top:1rem;font-size:.88rem}
@media (max-width:700px){.acc-deny{flex-wrap:wrap}.acc-deny input{min-width:0;flex:1}.acc-head{flex-wrap:wrap}}

/* Announcements */
.dash-grid{grid-template-columns:repeat(3,1fr)}
@media (max-width:1280px){.dash-grid{grid-template-columns:1fr 1fr}}
@media (max-width:1024px){.dash-grid{grid-template-columns:1fr}}
.dash-news{margin-bottom:1.5rem}
.dash-news .card-head h3{display:flex;align-items:center;gap:.5rem}
.dash-news .card-head h3 svg{color:var(--gold)}
.my-divs{margin-left:auto;margin-right:.4rem}
.news-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.news article{display:flex;flex-direction:column}
.news article p{flex:1;font-size:.93rem;line-height:1.6}
.news h4{font-size:1rem}
.ann-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.9rem}
.ann-foot small{margin-top:0!important;font-size:.8rem!important;color:var(--muted)!important}
.ann-foot .chips{gap:.35rem}
.ann-layout{display:grid;grid-template-columns:minmax(340px,440px) 1fr;gap:1.5rem;align-items:start}
.ann-compose{position:sticky;top:94px}
.ann-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.6rem}
.ann-tools{display:flex;gap:.3rem}
.ann-tags{border:0;display:grid;gap:.6rem}
.ann-tags legend{font-size:.85rem;font-weight:500;color:var(--muted);margin-bottom:.5rem}
.tag-pick{display:flex;flex-wrap:wrap;gap:.45rem}
.tag-opt{--dc:#64748b;display:inline-flex!important;cursor:pointer}
.tag-opt input{position:absolute;opacity:0;pointer-events:none}
.tag-opt span{display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .8rem;border-radius:99px;border:1px solid var(--border-2);color:var(--muted);font-size:.85rem;font-weight:600;transition:.15s}
.tag-opt span small{font-size:.72rem;opacity:.7}
.tag-opt:hover span{border-color:var(--dc);color:var(--text)}
.tag-opt input:checked+span{background:color-mix(in srgb,var(--dc) 22%,transparent);border-color:var(--dc);color:#fff}
.tag-opt input:checked+span::before{content:"";width:.35rem;height:.65rem;border:solid currentColor;border-width:0 2px 2px 0;transform:rotate(45deg) translateY(-1px)}
.tag-opt input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.ann-list{max-height:none}
@media (max-width:1024px){.ann-layout{grid-template-columns:1fr}.ann-compose{position:static}}

/* Division manager */
.gd-manage{margin-top:1.5rem}
.gd-create,.gd-divrow{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.gd-create{padding-bottom:1.2rem;margin-bottom:.6rem;border-bottom:1px solid var(--border)}
.gd-create input:not([type=color]),.gd-divrow input:not([type=color]){padding:.5rem .8rem;border-radius:8px;border:1px solid var(--border-2);background:var(--bg-2);color:var(--text);font:inherit;font-size:.88rem}
.gd-create input[name=name]{flex:1;min-width:200px}
.gd-create input[name=short],.gd-short{width:110px}
.gd-create input[type=color],.gd-divrow input[type=color]{width:38px;height:34px;padding:2px;border-radius:8px;border:1px solid var(--border-2);background:var(--bg-2);cursor:pointer}
.gd-divlist{display:grid}
.gd-divrow{padding:.55rem 0;border-bottom:1px solid var(--border)}
.gd-divrow:last-child{border-bottom:0}
.gd-divrow input[name=name]{flex:1;min-width:180px}
.gd-members{font-size:.85rem;min-width:90px}
.dash-announce{margin-left:auto}


/* ==========================================================
   Formal theme overrides (v6.2)
   Same palette, calmer finish: square corners, flat surfaces,
   no glows, no floating or bouncing motion.
   ========================================================== */
:root{--radius:6px;--radius-sm:4px;--shadow:0 12px 28px -18px rgba(0,0,0,.7)}
h1,h2,h3,h4{letter-spacing:.03em}

/* Buttons: rectangular, solid, no lift */
.btn{border-radius:4px;text-transform:uppercase;letter-spacing:.08em;font-size:.82rem;padding:.8rem 1.3rem}
.btn-sm{font-size:.74rem;padding:.5rem .9rem}
.btn-gold,.btn-gold:hover{background:var(--gold);box-shadow:none;transform:none}
.btn-gold:hover{background:var(--gold-2)}
.btn-ghost{background:transparent}
.btn:hover svg{transform:none}

/* Badges & chips: squared labels instead of bubbles */
.pill,.rank,.chip,.chip-btn,.lane-count,.tag-opt span,.kicker{border-radius:3px}
.pill{text-transform:uppercase;letter-spacing:.06em;font-size:.68rem}
.pill::before{border-radius:1px;width:5px;height:5px}
.pin-tag{display:inline-block;font-family:var(--font);font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(212,165,55,.45);border-radius:3px;padding:.05rem .4rem;margin-right:.35rem;vertical-align:middle}

/* Hero: flat, no glow, no float */
.hero-bg{background:
  linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px) 0 0/48px 48px,
  linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px) 0 0/48px 48px}
.hero h1 .gold{background:none;color:var(--gold)}
.hero-badge img{animation:none;filter:none}
.badge-glow{display:none}
.dot{animation:none;box-shadow:none}
.brand img{filter:none}

/* Surfaces: flat panels, no hover jumps */
.card,.panel,.value,.div-card,.honor-card,.form-frame{border-radius:6px}
.honor-card{background:var(--surface)}
.honor-card::before{background:var(--gold);opacity:1;height:2px}
.honor-card:hover,.div-card:hover,.value:hover{transform:none;box-shadow:none;border-color:rgba(212,165,55,.35)}
.div-card::after{display:none}
.honor-media{border-style:solid;background:transparent}
.div-logo,.div-hero-logo,.value-ico,.kpi span,.mug,.mug.lg{border-radius:4px}
.cta{border-radius:6px;background:var(--surface)}
.page-hero,.mdc-hero,.auth-body{background-image:none}
.auth-card{border-radius:6px}
.welcome{background:var(--surface);border-left:3px solid var(--gold)}
.news article,.result,.unit,.charge,.totals div,.note{border-radius:4px}
.news article.pinned{background:var(--bg-2);border-color:rgba(212,165,55,.35);border-left:3px solid var(--gold)}
.alert-card{background:var(--surface);border-left:3px solid var(--red)}
.avatar{background:var(--gold)}

/* Inputs & controls */
.form input,.form select,.form textarea,.select-sm,.search,.mdc-search,.charge .qty{border-radius:4px}
.form input:focus,.form select:focus,.form textarea:focus,.search:focus-within{box-shadow:none}
.main-nav ul a,.app-nav a,.side-list a,.icon-btn,.nav-toggle,.pager a,.quick a,.duty-btn,.alert,.app-user,.pass-eye{border-radius:4px}
.duty-btn::before{border-radius:1px}
.bar,.bar i{border-radius:0}
code{border-radius:3px}

/* Motion: keep only the quiet scroll reveal */
.reveal{transition-duration:.4s}

/* ==========================================================
   Chat (LSPD room, division rooms, private messages)
   ========================================================== */
.app-content:has(.chat){max-width:none}
.chat{display:grid;grid-template-columns:290px 1fr;height:calc(100vh - 74px - 4rem);min-height:480px;background:var(--surface);border:1px solid var(--border);border-radius:6px;overflow:hidden}
.chat-side{border-right:1px solid var(--border);overflow-y:auto;padding:.8rem .6rem;background:var(--bg-2)}
.chat-group{display:flex;align-items:center;justify-content:space-between;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:1rem .5rem .45rem}
.chat-group:first-child{padding-top:.2rem}
.icon-btn.sm{width:26px;height:26px}.icon-btn.sm svg{width:14px;height:14px}
.chat-room{--dc:#64748b;display:flex;align-items:center;gap:.7rem;padding:.55rem .6rem;border-radius:4px;color:var(--muted);transition:.15s}
.chat-room:hover{background:rgba(255,255,255,.04);color:var(--text)}
.chat-room.active{background:color-mix(in srgb,var(--dc) 16%,transparent);color:var(--text);box-shadow:inset 3px 0 0 var(--dc)}
.chat-ico{width:34px;height:34px;flex-shrink:0;display:grid;place-items:center;border-radius:4px;font-size:.68rem;font-weight:700;letter-spacing:.02em;background:color-mix(in srgb,var(--dc) 22%,transparent);color:color-mix(in srgb,var(--dc) 55%,#fff);border:1px solid color-mix(in srgb,var(--dc) 40%,transparent)}
.chat-room-txt{display:grid;min-width:0;line-height:1.3;flex:1}
.chat-room-txt b{font-size:.9rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-room-txt small{font-size:.75rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-room .nav-count{margin-left:.3rem}
.chat-empty-side{font-size:.82rem;padding:.3rem .6rem}
.chat-find{padding:0 .3rem .6rem}
.chat-find input{width:100%;padding:.55rem .75rem;border-radius:4px;border:1px solid var(--border-2);background:var(--surface);color:var(--text);font:inherit;font-size:.86rem}
.chat-find input:focus{outline:0;border-color:var(--gold)}
.chat-find-list{display:grid;margin-top:.4rem;max-height:260px;overflow-y:auto}
.chat-find-list p{font-size:.82rem;padding:.4rem .5rem}
.chat-find-item{display:grid;padding:.45rem .6rem;border-radius:4px;line-height:1.3}
.chat-find-item:hover{background:rgba(212,165,55,.1)}
.chat-find-item b{font-size:.88rem;font-weight:600}.chat-find-item small{font-size:.75rem}

.chat-main{display:flex;flex-direction:column;min-width:0;min-height:0}
.chat-head{--dc:var(--gold);display:flex;align-items:center;gap:.8rem;padding:.9rem 1.3rem;border-bottom:1px solid var(--border);box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--dc) 50%,transparent)}
.chat-head h3{font-size:1.1rem;text-transform:uppercase;letter-spacing:.04em}
.chat-head small{font-size:.8rem}
.chat-back{display:none}
.chat-log{flex:1;overflow-y:auto;padding:1rem 1.3rem;display:flex;flex-direction:column;gap:.15rem}
.chat-more{align-self:center;margin-bottom:.8rem}
.chat-empty{margin:auto;text-align:center}
.msg{position:relative;max-width:72%;align-self:flex-start;margin-top:.7rem}
.msg.grouped{margin-top:.15rem}
.msg.mine{align-self:flex-end}
.msg-head{display:flex;align-items:baseline;gap:.5rem;font-size:.8rem;margin-bottom:.2rem;padding:0 .2rem}
.msg.mine .msg-head{justify-content:flex-end}
.msg-who{font-weight:700;color:var(--gold-2)}
a.msg-who:hover{text-decoration:underline}
.msg-rank{color:var(--muted);font-size:.72rem}
.msg-head time{font-size:.72rem}
.msg-body{padding:.55rem .85rem;border-radius:4px;background:var(--surface-2);border:1px solid var(--border);white-space:pre-wrap;word-wrap:break-word;overflow-wrap:anywhere;font-size:.93rem;line-height:1.5;unicode-bidi:plaintext}
.msg.mine .msg-body{background:rgba(212,165,55,.13);border-color:rgba(212,165,55,.3)}
.msg.deleted .msg-body{font-style:italic;color:var(--muted);background:transparent}
.msg-del{position:absolute;top:50%;transform:translateY(-50%);right:-28px;width:22px;height:22px;border-radius:4px;border:1px solid var(--border);background:var(--bg-2);color:var(--muted);cursor:pointer;opacity:0;transition:.15s;font-size:.9rem;line-height:1}
.msg.mine .msg-del{right:auto;left:-28px}
.msg:hover .msg-del{opacity:1}
.msg-del:hover{color:var(--red);border-color:var(--red)}
.msg-head+.msg-body+.msg-del{top:calc(50% + .6rem)}
.chat-compose{display:flex;gap:.7rem;align-items:flex-end;padding:.9rem 1.3rem;border-top:1px solid var(--border);background:var(--bg-2)}
.chat-compose textarea{flex:1;resize:none;min-height:42px;max-height:160px;padding:.65rem .9rem;border-radius:4px;border:1px solid var(--border-2);background:var(--surface);color:var(--text);font:inherit;font-size:.93rem;line-height:1.45}
.chat-compose textarea:focus{outline:0;border-color:var(--gold)}
.chat-compose .btn{height:42px;border-radius:4px}
.chat-readonly{display:flex;align-items:center;gap:.5rem;padding:1rem 1.3rem;border-top:1px solid var(--border);font-size:.88rem}

@media (max-width:820px){
  .chat{grid-template-columns:1fr;height:calc(100vh - 74px - 2.5rem);position:relative}
  .chat-side{position:absolute;inset:0 auto 0 0;width:min(300px,85%);z-index:3;transform:translateX(-100%);transition:transform .25s;box-shadow:var(--shadow)}
  .chat-side.open{transform:none}
  .chat-back{display:inline-grid}
  .msg{max-width:88%}
  .msg-del{opacity:1;position:static;transform:none;margin-top:.2rem}
}