/* SPARTANS Policy Portal — glass look v2 (frosted panels over a luminous SPARTIA backdrop) */
:root{
  --ink:#15161E; --ink2:#363A4C; --mute:#555A70; --line:rgba(21,22,30,.09);
  --acc1:#5B7CFF; --acc2:#8B5CF6; --acc-t:#4B3FD6;
  --coral:#F06A3C; --coral-t:#B13C14; --teal:#12A594; --teal-t:#0B7366; --gold:#C69152; --gold-t:#86561F; --ok:#0E7D57;
  --glass:linear-gradient(160deg,rgba(255,255,255,.56),rgba(255,255,255,.26));
  --glass-edge:rgba(255,255,255,.75);
}
*{box-sizing:border-box}
.pg{
  font-family:'Plus Jakarta Sans','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  color:var(--ink); font-size:15px; line-height:1.45; position:relative; overflow:hidden;
  background:#E9EBF6 url(/img/backdrop.jpg) center / cover no-repeat;
}
.pg > *{position:relative}
.pg h1,.pg h2,.pg h3,.pg p{margin:0}

/* the big frosted window that holds a page (as in visionOS) */
.win{
  background:linear-gradient(135deg,rgba(255,255,255,.30),rgba(255,255,255,.10));
  -webkit-backdrop-filter:blur(34px) saturate(170%); backdrop-filter:blur(34px) saturate(170%);
  border:1px solid rgba(255,255,255,.6); border-radius:34px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 40px 90px -40px rgba(40,36,110,.45);
}
/* cards inside the window */
.card{
  background:var(--glass);
  -webkit-backdrop-filter:blur(26px) saturate(165%); backdrop-filter:blur(26px) saturate(165%);
  border:1px solid var(--glass-edge); border-radius:24px; position:relative;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 14px 34px -22px rgba(40,36,110,.45);
}
.card.soft{background:linear-gradient(160deg,rgba(255,255,255,.48),rgba(255,255,255,.24))}
.card.violet{background:linear-gradient(150deg,rgba(124,108,255,.42),rgba(91,124,255,.20) 55%,rgba(255,255,255,.30));border-color:rgba(255,255,255,.65)}
.card.teal{background:linear-gradient(150deg,rgba(18,165,148,.38),rgba(18,165,148,.14) 60%,rgba(255,255,255,.3))}
.card.gold{background:linear-gradient(150deg,rgba(198,145,82,.36),rgba(198,145,82,.12) 60%,rgba(255,255,255,.3))}
.card.white{background:rgba(255,255,255,.82)}
/* older class names still used on some screens */
.glass{background:var(--glass);-webkit-backdrop-filter:blur(26px) saturate(165%);backdrop-filter:blur(26px) saturate(165%);border:1px solid var(--glass-edge);border-radius:24px;position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 14px 34px -22px rgba(40,36,110,.45)}
.glass.soft{background:linear-gradient(160deg,rgba(255,255,255,.48),rgba(255,255,255,.24))}

/* type */
.kick{font-weight:600;font-size:13px;color:var(--mute);letter-spacing:0}
.cap{font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.num{font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.disp{font-weight:700;letter-spacing:-.025em;line-height:1.05}
.sub{color:var(--mute)}
.small{font-size:13px}
.tiny{font-size:12px}

/* pills */
.chip{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:6px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.45);font:600 13px 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--ink2);cursor:pointer;text-decoration:none;white-space:nowrap;transition:background .25s,color .25s}
.chip.on{background:#16161E;color:#fff;border-color:#16161E}
.seg{display:inline-flex;padding:4px;border-radius:999px;background:rgba(255,255,255,.4);border:1px solid rgba(255,255,255,.7);gap:2px}
.seg button{min-height:36px;padding:0 16px;border-radius:999px;border:0;background:transparent;font:600 13px 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--ink2);cursor:pointer;transition:background .25s,color .25s}
.seg button.on{background:#16161E;color:#fff}
.tag{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font:700 12px 'Plus Jakarta Sans',system-ui,sans-serif;white-space:nowrap}
.tag.gap{background:rgba(240,106,60,.16);color:var(--coral-t)}
.tag.ok{background:rgba(14,125,87,.14);color:var(--ok)}
.tag.info{background:rgba(255,255,255,.6);color:var(--ink2)}
.tag.ms{background:rgba(18,165,148,.16);color:var(--teal-t)}
.tag.closed{background:rgba(21,22,30,.08);color:var(--ink2)}
.tag.acc{background:rgba(91,92,240,.14);color:var(--acc-t)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 20px;border-radius:999px;border:0;font:600 14px 'Plus Jakarta Sans',system-ui,sans-serif;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn.p,.btn.dark{background:#16161E;color:#fff;box-shadow:0 12px 24px -14px rgba(0,0,0,.6)}
.btn.g,.btn.light{background:rgba(255,255,255,.82);color:var(--ink);box-shadow:inset 0 0 0 1px rgba(255,255,255,.9),0 8px 18px -12px rgba(40,36,110,.5)}
.btn.b{background:linear-gradient(135deg,#D7A468,#A8743C);color:#fff}
.icon-btn{width:44px;height:44px;border-radius:999px;border:0;background:rgba(255,255,255,.85);display:inline-flex;align-items:center;justify-content:center;color:var(--ink);cursor:pointer;box-shadow:0 8px 18px -12px rgba(40,36,110,.6);position:relative}
.badge{position:absolute;top:-2px;right:-2px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--coral);color:#fff;font:700 11px/18px 'Plus Jakarta Sans',system-ui,sans-serif;text-align:center}

/* top bar, rail and floating nav */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px 10px 10px;border-radius:999px}
.avatar{width:44px;height:44px;border-radius:999px;display:flex;align-items:center;justify-content:center;font:700 14px 'Plus Jakarta Sans',system-ui,sans-serif;color:#fff;background:linear-gradient(135deg,#5B7CFF,#8B5CF6);flex:none}
.ask{display:flex;align-items:center;gap:12px;min-height:46px;padding:6px 18px 6px 7px;border-radius:999px;background:rgba(255,255,255,.38);border:1px solid rgba(255,255,255,.65);color:var(--ink2);font:500 14px 'Plus Jakarta Sans',system-ui,sans-serif;text-decoration:none;min-width:0}
.orb{width:34px;height:34px;border-radius:999px;flex:none;object-fit:cover;box-shadow:0 0 0 2px rgba(255,255,255,.85),0 0 18px 4px rgba(139,92,246,.55);animation:breathe 3.2s ease-in-out infinite}
.orb.lg{width:60px;height:60px}
.orb.xl{width:88px;height:88px}
.rail{display:flex;flex-direction:column;align-items:center;gap:10px;padding:10px;border-radius:999px}
.rail a,.rail button{width:48px;height:48px;border-radius:999px;display:flex;align-items:center;justify-content:center;font:700 13px 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--ink2);text-decoration:none;border:0;background:transparent;cursor:pointer}
.rail .on{background:#fff;color:var(--ink);box-shadow:0 8px 18px -10px rgba(40,36,110,.6)}
.dock{display:flex;align-items:center;gap:4px;padding:6px;border-radius:999px;background:rgba(255,255,255,.38);-webkit-backdrop-filter:blur(26px) saturate(170%);backdrop-filter:blur(26px) saturate(170%);border:1px solid rgba(255,255,255,.7);box-shadow:0 18px 40px -20px rgba(40,36,110,.55)}
.dock a{min-height:42px;padding:0 18px;border-radius:999px;display:flex;align-items:center;font:600 14px 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--ink2);text-decoration:none;white-space:nowrap}
.dock a.on{background:#fff;color:var(--ink);box-shadow:0 6px 14px -8px rgba(40,36,110,.6)}
/* older nav used on some screens */
.side{display:flex;flex-direction:column;gap:22px;padding:28px 18px}
.nav{display:flex;flex-direction:column;gap:4px}
.nav a{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 14px;border-radius:999px;color:var(--ink2);text-decoration:none;font-weight:600;font-size:14px}
.nav a.on{background:#fff;color:var(--ink)}

/* SPARTIA: no dark box any more — a violet glass card with her glowing orb */
.spartia{border-radius:24px;color:var(--ink);position:relative;overflow:hidden;
  background:linear-gradient(150deg,rgba(124,108,255,.42),rgba(91,124,255,.20) 55%,rgba(255,255,255,.30));
  -webkit-backdrop-filter:blur(26px) saturate(165%);backdrop-filter:blur(26px) saturate(165%);
  border:1px solid rgba(255,255,255,.65);box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 14px 34px -22px rgba(60,40,160,.55)}
.spartia > *{position:relative;z-index:1}
.sp-name{font-weight:700;font-size:13px;letter-spacing:.32em;color:#2C2475}
.sp-chip{text-decoration:none;display:inline-flex;align-items:center;min-height:36px;padding:6px 14px;border-radius:999px;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.85);color:var(--ink);font:600 13px 'Plus Jakarta Sans',system-ui,sans-serif;cursor:pointer}
.sp-ring{border-radius:999px;box-shadow:0 0 0 2px rgba(255,255,255,.9),0 0 22px 6px rgba(139,92,246,.5);animation:breathe 3.2s ease-in-out infinite}
.ask-orb{display:inline-flex;align-items:center;gap:10px;padding:6px 18px 6px 6px;border-radius:999px;background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.8);color:var(--ink);box-shadow:0 18px 36px -16px rgba(60,40,160,.55);font:600 14px 'Plus Jakarta Sans',system-ui,sans-serif;text-decoration:none;cursor:pointer}

/* bars (striped = gap or highlight, as in the reference) */
.bar{display:flex;height:10px;border-radius:999px;overflow:hidden;background:rgba(21,22,30,.08)}
.bar .f{background:linear-gradient(90deg,#1E3A8A,#2F6BDE);animation:growx 1.1s cubic-bezier(.2,.7,.2,1) both;transform-origin:left}
.bar .g{background:repeating-linear-gradient(135deg,rgba(240,106,60,.75) 0 4px,rgba(240,106,60,.25) 4px 8px);animation:fade .8s .7s both}
.hatch-coral{background:repeating-linear-gradient(135deg,rgba(240,106,60,.85) 0 4px,rgba(240,106,60,.3) 4px 8px)}
.hatch-teal{background:repeating-linear-gradient(135deg,rgba(18,165,148,.8) 0 3px,rgba(18,165,148,.3) 3px 6px)}

/* tables */
.tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:14px}
.tbl th{text-align:left;font:600 12px 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--mute);padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:13px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl td.r,.tbl th.r{text-align:right}
.tbl tr.tot td{font-weight:700;border-bottom:0;background:rgba(255,255,255,.45)}
.tbl thead th{background:rgba(255,255,255,.45)}
.tbl thead th:first-child{border-top-left-radius:14px}.tbl thead th:last-child{border-top-right-radius:14px}

/* forms */
.field{display:flex;flex-direction:column;gap:6px}
.field label,.flabel{font:600 13px 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--ink2)}
.input{min-height:44px;padding:10px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.8);background:rgba(255,255,255,.62);font:500 15px 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--ink);width:100%}
.switch{width:46px;height:28px;border-radius:999px;background:rgba(21,22,30,.18);position:relative;flex:none;border:0;cursor:pointer;transition:background .25s}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.25);transition:left .25s}
.switch.on{background:#16161E}
.switch.on::after{left:21px}
input[type=range].rng{width:100%;accent-color:#16161E;height:28px}

/* FSC and admin bar: dark glass, so staff always know which side they are on */
.fscbar{background:rgba(18,18,30,.78);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);color:#EEF0FA;border-radius:999px;font-family:'Plus Jakarta Sans',system-ui,sans-serif;box-shadow:0 18px 40px -20px rgba(0,0,0,.6)}
.fscbar .kick,.fscbar .cap{color:#B6BBD6}

/* motion */
@keyframes rise{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes growx{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes growy{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes ring{from{stroke-dasharray:0 100}}
@keyframes breathe{0%,100%{box-shadow:0 0 0 2px rgba(255,255,255,.85),0 0 14px 2px rgba(139,92,246,.45)}50%{box-shadow:0 0 0 2px rgba(255,255,255,.95),0 0 28px 8px rgba(91,124,255,.6)}}
.rise{animation:rise .75s cubic-bezier(.2,.7,.2,1) both}
.d1{animation-delay:.06s}.d2{animation-delay:.12s}.d3{animation-delay:.18s}.d4{animation-delay:.24s}.d5{animation-delay:.3s}.d6{animation-delay:.36s}.d7{animation-delay:.42s}.d8{animation-delay:.48s}
.draw{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.6s .25s cubic-bezier(.35,.7,.2,1) forwards}
.fadein{animation:fade 1s .5s both}
.growy{transform-origin:bottom;animation:growy 1s cubic-bezier(.2,.7,.2,1) both}
.ringfill{animation:ring 1.4s .2s cubic-bezier(.2,.7,.2,1) both;transition:stroke-dasharray .7s cubic-bezier(.2,.7,.2,1)}
.ringgap{transition:stroke-dasharray .7s cubic-bezier(.2,.7,.2,1),stroke-dashoffset .7s cubic-bezier(.2,.7,.2,1);animation:fade .6s 1.2s both}
@media (prefers-reduced-motion:reduce){.rise,.draw,.fadein,.growy,.ringfill,.ringgap,.bar .f,.bar .g,.orb,.sp-ring{animation:none!important;stroke-dashoffset:0}}

/* SPARTIA briefing: "…" menu, hide, toast; reminders that leave once Checked */
.dots{position:absolute!important;top:12px;right:12px;z-index:3!important;width:36px;height:36px;border-radius:999px;border:1px solid rgba(255,255,255,.85);background:rgba(255,255,255,.6);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);display:inline-flex;align-items:center;justify-content:center;color:var(--ink);cursor:pointer;box-shadow:0 8px 18px -12px rgba(40,36,110,.6)}
.dots:hover,.dots[aria-expanded="true"]{background:rgba(255,255,255,.9)}
.sp-menu{position:absolute!important;top:54px;right:12px;z-index:4!important;width:232px;padding:6px;border-radius:16px;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border:1px solid #fff;box-shadow:0 24px 44px -18px rgba(40,36,110,.6);display:flex;flex-direction:column;animation:pop .18s ease-out both}
.sp-menu button{display:flex;align-items:center;gap:10px;min-height:44px;padding:8px 12px;border:0;border-radius:11px;background:transparent;font:600 14px 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--ink);cursor:pointer;text-align:left}
.sp-menu button:hover{background:rgba(21,22,30,.06)}
.sp-menu .hint{padding:2px 12px 8px 40px;font:500 12px/1.45 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--mute)}
.toast{display:inline-flex;align-items:center;gap:10px;padding:6px 8px 6px 6px;border-radius:999px;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.9);box-shadow:0 14px 30px -18px rgba(40,36,110,.6);font:600 13px 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--ink2);animation:pop .25s ease-out both}
.toast button{min-height:32px;padding:4px 12px;border-radius:999px;border:0;background:#16161E;color:#fff;font:600 12px 'Plus Jakarta Sans',system-ui,sans-serif;cursor:pointer}
.orb-btn{flex:none;padding:0;border:0;background:transparent;border-radius:999px;cursor:pointer;display:inline-flex;position:relative}
.orb-btn .ping{position:absolute;top:-1px;right:-1px;width:10px;height:10px;border-radius:999px;background:var(--coral);box-shadow:0 0 0 2px #fff}
.leave{transition:opacity .26s ease,transform .26s ease,max-height .34s ease .1s,padding .34s ease .1s,border-color .3s ease;max-height:140px;overflow:hidden}
.leave.out{opacity:0;transform:translateX(18px);max-height:0;padding-top:0!important;padding-bottom:0!important;border-top-color:transparent!important}
.btn.done,.ck.done{background:rgba(14,125,87,.14)!important;color:#0E7D57!important;box-shadow:none!important}
@keyframes pop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.sp-menu,.toast{animation:none!important}.leave{transition:none!important}}

/* "…" sits beside SPARTIA's name (never over her face); glowing dot = something new while her briefing is hidden */
.dots.inline{position:relative!important;top:auto;right:auto;z-index:auto!important;width:30px;height:30px;box-shadow:none;background:rgba(255,255,255,.55)}
.sp-menu.below{top:40px;left:0;right:auto}
.orb-btn .ping.glow{width:12px;height:12px;top:-2px;right:-2px;background:radial-gradient(circle at 35% 35%,#fff 0 18%,#8FB4FF 30%,#3D6BFF 70%);box-shadow:0 0 0 2px #fff,0 0 10px 3px rgba(61,107,255,.75);animation:glowdot 1.8s ease-in-out infinite}
@keyframes glowdot{0%,100%{box-shadow:0 0 0 2px #fff,0 0 8px 2px rgba(61,107,255,.6),0 0 0 0 rgba(61,107,255,.45)}50%{box-shadow:0 0 0 2px #fff,0 0 16px 6px rgba(61,107,255,.85),0 0 0 9px rgba(61,107,255,0)}}
.newsline{display:flex;gap:10px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.9);text-decoration:none;color:var(--ink);animation:pop .3s ease-out both}
.newtag{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;background:#3D6BFF;color:#fff;font:700 10.5px/20px 'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;flex:none}
@media (prefers-reduced-motion:reduce){.orb-btn .ping.glow,.newsline{animation:none!important}}