/* =====================================================================
   FORWARD OPERATING BAR - site styles
   Colors and fonts come from the FOB Brand Guide.
   ===================================================================== */
:root{
  color-scheme: dark;
  --ground:#12100c; --surface:#1c1812; --surface-2:#252118; --rule:#352e22;
  --olive:#6b7349; --neon:#ff5b4f;
  --text:#efe6d2; --soft:#d6ceb9; --muted:#a29580; --accent:#e9a23b; --accent-dark:#c7831f; --accent-ink:#1d1204;
  --lonestar:#4f82c6; --valkyra:#d25548; --manticore:#62a04c; --ok:#62a04c; --bad:#e0645a;
  --display:"Big Shoulders Display","Oswald","Arial Narrow",sans-serif;
  --stencil:"Black Ops One","Big Shoulders Display",Impact,sans-serif;
  --script:"Yellowtail","Brush Script MT",cursive;
  --body:"Barlow","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --r:3px;
}
*{box-sizing:border-box}
html{background:var(--ground)}
body{background:var(--ground);color:var(--text);font:16px/1.55 var(--body);margin:0;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
main{flex:1;padding-block:0 64px}
a{color:var(--accent)}
img{max-width:100%}
button{font:inherit;color:inherit;cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.55}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
[hidden]{display:none!important}
.wrap{max-width:1180px;margin-inline:auto;padding-inline:20px}
h1,h2,h3,h4{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:.95;margin:0;text-wrap:balance}
.eyebrow{font:500 12px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.note{font-size:14px;color:var(--muted);margin:0}
.skip{position:absolute;left:-9999px;top:0;background:var(--accent);color:var(--accent-ink);padding:8px 12px;z-index:100}
.skip:focus{left:8px;top:8px}

/* ---------- header ---------- */
header.bar{border-bottom:2px solid var(--olive);background:#16130e;position:sticky;top:0;z-index:20;min-height:66px}
.bar .wrap{display:flex;align-items:center;gap:24px;min-height:64px;flex-wrap:wrap}
.logo{text-decoration:none;display:flex;align-items:center;gap:12px;color:var(--text)}
.logo img{height:48px;width:48px;display:block;flex:none}
.logo .wm{display:flex;flex-direction:column;gap:6px}
.logo strong{font:400 22px/1 var(--stencil);letter-spacing:.05em}
.logo small{font:500 10px/1 var(--mono);letter-spacing:.16em;color:var(--muted)}
nav.tabs{display:flex;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none}
nav.tabs a{display:block;padding:22px 12px 19px;font:700 17px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-decoration:none;border-bottom:3px solid transparent;white-space:nowrap}
nav.tabs a:hover{color:var(--text)}
nav.tabs a[aria-current="page"]{color:var(--text);border-bottom-color:var(--accent)}
nav.tabs a.staff{color:var(--accent)}
.who{display:flex;align-items:center;gap:10px;position:relative}
.me{display:flex;align-items:center;gap:10px;background:none;border:1px solid var(--rule);border-radius:var(--r);padding:5px 10px 5px 5px}
.me:hover{border-color:var(--muted)}
.me b{font-weight:600;font-size:14px;max-width:14ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu{position:absolute;right:0;top:calc(100% + 6px);background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);min-width:200px;padding:6px;display:flex;flex-direction:column;z-index:30;box-shadow:0 12px 30px rgba(0,0,0,.45)}
.menu a,.menu button{background:none;border:0;text-align:left;padding:10px 12px;border-radius:2px;color:var(--text);text-decoration:none;font-size:15px}
.menu a:hover,.menu button:hover{background:var(--surface-2)}
.menu hr{border:0;border-top:1px solid var(--rule);margin:4px 0}

/* ---------- buttons, chips ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--rule);background:var(--surface);color:var(--text);padding:10px 16px;border-radius:var(--r);font:600 14px/1 var(--body);letter-spacing:.02em;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:var(--muted)}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.discord{background:#5865f2;border-color:#5865f2;color:#fff}
.btn.discord:hover{filter:brightness(1.1)}
.btn.danger{color:var(--bad);border-color:var(--bad);background:none}
.btn.small{padding:7px 11px;font-size:13px}
.btn[aria-pressed="true"]{background:var(--surface-2);border-color:var(--ok);color:var(--ok)}
.link{background:none;border:0;padding:0;font:600 14px/1 var(--body);color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.chip{display:inline-flex;align-items:center;gap:6px;font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:5px 8px;border-radius:2px;border:1px solid currentColor;white-space:nowrap}
.chip::before{content:"";width:6px;height:6px;background:currentColor}
.f-lonestar{color:var(--lonestar)} .f-valkyra{color:var(--valkyra)} .f-manticore{color:var(--manticore)}
.rank{display:inline-flex;align-items:center;gap:5px;font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:4px 7px;border-radius:2px;background:var(--surface-2);color:var(--muted);white-space:nowrap}
/* earned ranks: insignia + name, colored by tier (enlisted, NCO, officer, field grade) */
.rank[class*="t-"]{background:#0f0d0a;border:1px solid var(--rule);padding:2px 8px 2px 3px}
.rank .ins{width:20px;height:20px}
.rank.t-recruit{color:var(--muted)}
.rank.t-enlisted{border-color:#5c6640;color:#dfe3c8}
.rank.t-nco{border-color:var(--accent-dark);color:#f2d48f}
.rank.t-officer{border-color:#63768c;color:#dbe5f0}
.rank.t-field{border-color:#b89b4c;color:#f5e8c2}
.rank.staff{background:var(--accent);color:var(--accent-ink)}
.rank.info{background:#3d4a5c;color:#dfe8f3}
.ins{display:inline-block;flex:none;width:20px;height:20px;object-fit:contain;vertical-align:middle}
.ins.md{width:32px;height:32px}
.ins.lg{width:44px;height:44px}
.ins.xl{width:84px;height:84px}
.av{width:32px;height:32px;border-radius:50%;flex:none;object-fit:cover;background:var(--surface-2);display:inline-grid;place-items:center;font:800 15px/1 var(--display);color:var(--muted);overflow:hidden;vertical-align:middle}
.av.lg{width:44px;height:44px;font-size:19px}
.av.xl{width:64px;height:64px;font-size:26px}
.av.xxl{width:112px;height:112px;font-size:44px;box-shadow:0 0 0 3px var(--accent),0 0 0 7px var(--surface)}
.who-link{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.who-link:hover b{text-decoration:underline;text-underline-offset:3px}
.stripes{display:inline-flex;gap:3px;vertical-align:middle;margin-left:6px}
.stripes i{width:6px;height:16px;background:var(--accent);transform:skewX(-20deg);border-radius:1px}
.stripes b{font:500 11px/16px var(--mono);color:var(--accent);margin-left:4px}

/* ---------- hero ---------- */
.hero{position:relative;border-bottom:1px solid var(--rule);overflow:hidden}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.55}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:48px;padding-block:56px 48px;align-items:center}
.hero h1{font-family:var(--stencil);font-weight:400;font-size:clamp(44px,6.4vw,84px);line-height:.95;letter-spacing:.01em}
.hero h1 em{font-style:normal;color:var(--accent)}
.tagline{font:600 15px/1.3 var(--mono);letter-spacing:.04em;color:var(--accent);margin:14px 0 0}
.lede{max-width:52ch;color:var(--soft);font-size:18px;margin:18px 0 26px}
.ctas{display:flex;gap:10px;flex-wrap:wrap}
.neon{font:400 clamp(30px,4.2vw,46px)/1 var(--script);color:#ffe9e4;text-shadow:0 0 4px #fff3,0 0 10px var(--neon),0 0 22px var(--neon),0 0 44px rgba(255,91,79,.55);display:inline-block;transform:rotate(-3deg);margin-bottom:22px}
.neon small{display:block;font:500 11px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);text-shadow:none;transform:rotate(3deg);margin-bottom:10px}
.neon b{font-weight:400}
@media (prefers-reduced-motion:no-preference){ .neon b{animation:flick 7s infinite} }
@keyframes flick{0%,92%,100%{opacity:1}93%{opacity:.35}94%{opacity:1}96%{opacity:.5}97%{opacity:1}}

.board{background:rgba(22,19,14,.94);border:1px solid var(--rule);border-radius:var(--r);padding:20px 20px 16px}
.board header{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.board h2{font-size:26px}
.board h3{font-size:30px;margin-bottom:14px}
.board footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px dashed var(--rule);font:12px/1.4 var(--mono);color:var(--muted)}
.hot{color:var(--accent)}
.gtag{display:inline-block;font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:5px 8px;border-radius:2px;background:var(--olive);color:#f1eedf;white-space:nowrap}
.gtag.special{background:var(--accent);color:var(--accent-ink)}
.gtag.off{background:var(--bad);color:#fff}
.kv{display:grid;grid-template-columns:auto 1fr;gap:10px 16px;margin:0 0 16px;font-size:14px}
.kv dt{font:500 11px/1.6 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.kv dd{margin:0;font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right}
.kv dd small{display:block;color:var(--muted);font-size:12px}
.countdown{font:800 34px/1 var(--display);color:var(--accent);letter-spacing:.02em}

/* ---------- sections ---------- */
section.block{padding-block:48px 8px}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.sec-head h2{font-size:40px}
.sec-head h1{font-size:clamp(40px,6vw,56px)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.split{display:grid;grid-template-columns:1.4fr 1fr;gap:32px}
.panel{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:18px}
.panel h3{font-size:22px;margin-bottom:12px}
.empty{border:1px dashed var(--rule);border-radius:var(--r);padding:20px;color:var(--muted);text-align:center;font-size:15px}
.loading{color:var(--muted);font:13px/1 var(--mono);letter-spacing:.08em;padding:16px 0}

.facts{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--rule);border-radius:var(--r);background:var(--surface)}
.facts.five{grid-template-columns:repeat(5,1fr)}
.facts div{padding:18px 20px;border-left:1px solid var(--rule)}
.facts div:first-child{border-left:0}
.facts b{display:block;font:800 34px/1 var(--display);margin-top:8px;font-variant-numeric:tabular-nums}

/* news */
.news{display:flex;flex-direction:column}
.news article{display:grid;grid-template-columns:112px 1fr auto;gap:18px;padding-block:18px;border-top:1px solid var(--rule)}
.news article:last-child{border-bottom:1px solid var(--rule)}
.news time{font:500 12px/1.4 var(--mono);color:var(--muted);letter-spacing:.06em;text-transform:uppercase}
.news h3{font-size:24px;margin-bottom:6px}
.news p{margin:0;color:var(--soft);max-width:62ch;white-space:pre-line}
.tag{font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:8px}

/* ops list */
.events{display:flex;flex-direction:column;gap:10px}
.event{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:12px}
.event.off{opacity:.6}
.event.off h3{text-decoration:line-through}
.date{text-align:center;border-right:1px solid var(--rule);padding-right:12px}
.date span{display:block;font:500 11px/1 var(--mono);letter-spacing:.12em;color:var(--accent)}
.date b{display:block;font:900 32px/1 var(--display);margin-top:4px}
.event h3{font-size:20px;margin-bottom:4px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.event p{margin:0;font-size:14px;color:var(--muted)}
.event .acts{display:flex;gap:8px;align-items:center}
.going{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.going span{font:500 12px/1 var(--mono);padding:5px 7px;background:var(--surface-2);border-radius:2px;color:var(--soft)}

/* weekly schedule */
.weekly{display:flex;flex-direction:column}
.wk{display:grid;grid-template-columns:58px 1fr auto;gap:14px;align-items:center;padding-block:12px;border-top:1px solid var(--rule)}
.wk:first-child{border-top:0;padding-top:4px}
.wk .day{font:900 24px/1 var(--display);text-transform:uppercase;color:var(--accent)}
.wk h4{margin:0 0 4px;font-size:19px;line-height:1.05}
.wk p{margin:0;font-size:13px;color:var(--muted)}
.steps{margin:0;padding-left:0;list-style:none;counter-reset:s;display:grid;gap:10px}
.steps li{counter-increment:s;display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:start;font-size:15px}
.steps li::before{content:counter(s);font:800 18px/1 var(--display);width:26px;height:26px;display:grid;place-items:center;border:1px solid var(--accent);color:var(--accent);border-radius:2px}
.rules{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.rules li{padding-left:14px;border-left:2px solid var(--accent-dark);font-size:15px;color:var(--soft)}
.rules b{color:var(--text)}

/* the bar */
.composer{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:12px;margin-bottom:24px}
textarea,input[type=text],input[type=datetime-local],select{width:100%;background:#0f0d0a;border:1px solid var(--rule);border-radius:2px;color:var(--text);font:15px/1.4 var(--body);padding:10px 12px}
textarea{min-height:90px;resize:vertical}
textarea:focus,input:focus,select:focus{border-color:var(--accent);outline:none}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.locked{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;color:var(--soft)}
.feed{display:flex;flex-direction:column;gap:12px}
.post{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:16px 18px;display:grid;grid-template-columns:44px 1fr;gap:14px}
.post .meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.post .meta b{font-weight:600}
.post .meta small{font:12px/1 var(--mono);color:var(--muted)}
.post p{margin:0 0 10px;max-width:68ch;white-space:pre-line;overflow-wrap:anywhere}
.post .acts{display:flex;gap:18px;font:12px/1 var(--mono);color:var(--muted);align-items:center}
.post .acts button{background:none;border:0;padding:4px 0;color:inherit;font:inherit;letter-spacing:.06em;text-transform:uppercase}
.post .acts button[aria-pressed="true"]{color:var(--accent)}
.post .acts button:hover{color:var(--text)}
.side{display:flex;flex-direction:column;gap:16px}
.tally{display:grid;grid-template-columns:1fr auto;gap:10px 12px;font-size:14px;align-items:center}
.tally .mono{color:var(--muted)}
.roster{display:flex;flex-direction:column;gap:10px}
.roster div{display:flex;align-items:center;gap:10px;font-size:14px}
.roster b{font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* about */
.about{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:40px;align-items:start}
.about .prose p{max-width:66ch;color:var(--soft);font-size:17px;margin:0 0 16px}
.about .prose p.lead{font-size:20px;color:var(--text)}
.about figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:14px;padding-block:10px}
.about figure img{width:min(100%,320px);height:auto}
.about figcaption{font:500 12px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:center}
.principles{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.principles li{background:var(--surface);padding:18px}
.principles b{display:block;font:800 20px/1.05 var(--display);text-transform:uppercase;margin-bottom:8px;color:var(--accent)}
.principles span{font-size:15px;color:var(--soft)}
.channels{display:grid}
.ch{display:grid;grid-template-columns:1fr auto;gap:12px;padding-block:10px;border-top:1px solid var(--rule);font-size:14px;align-items:baseline}
.ch:first-child{border-top:0;padding-top:0}
.ch b{font-family:var(--mono);font-weight:500}
.ch b::before{content:"# ";color:var(--muted)}
.ch.voice b::before{content:"🔊 "}
.ch span{color:var(--muted);text-align:right}
.prose-page{max-width:720px}
.prose-page p,.prose-page li{color:var(--soft);font-size:16px}
.prose-page h2{font-size:26px;margin:32px 0 10px}

/* field tools & intel (outside links) */
.res-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.res{display:flex;flex-direction:column;align-items:flex-start;gap:10px;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:18px;color:var(--text);text-decoration:none}
.res:hover{border-color:var(--muted)}
.res b{font:800 22px/1 var(--display);text-transform:uppercase;letter-spacing:.02em}
.res b::after{content:" ↗";color:var(--muted);font-size:.75em}
.res span:last-child{color:var(--muted);font-size:14px;line-height:1.45}
.gtag.fan{background:var(--surface-2);color:var(--soft);box-shadow:inset 0 0 0 1px var(--rule)}

/* honors, ribbons, members */
.honors{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.ribbon{display:grid;grid-template-columns:52px 1fr auto;gap:14px;align-items:start;background:var(--surface);border:1px solid var(--rule);border-top:3px solid var(--accent);border-radius:var(--r);padding:14px 16px}
.ribbon.promo{border-top-color:var(--olive)}
.ribbon .medal{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-size:26px;background:radial-gradient(circle at 35% 30%,#3a3222,#1a160f);box-shadow:inset 0 0 0 2px var(--accent-dark)}
.ribbon.promo .medal{box-shadow:inset 0 0 0 2px var(--olive);color:var(--accent);font:800 24px/1 var(--display)}
.ribbon.award{grid-template-columns:64px 1fr auto}
.ribbon .medal.rb{width:64px;height:auto;border-radius:0;background:none;box-shadow:none;display:block;padding-top:3px}
.ribbon h3{font-size:20px;margin-bottom:6px}
.ribbon p{margin:0 0 6px;font-size:14px}
.ribbon .to b{font-weight:600}
.ribbon .cite{color:var(--soft)}
.ribbon .when{font:12px/1.3 var(--mono);color:var(--muted);margin:0}
.ladder-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:8px;margin-bottom:6px}
.ladder-strip .step{display:flex;align-items:center;gap:8px;padding:7px 10px 7px 6px;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);opacity:.72}
.ladder-strip .step.held{opacity:1;border-color:#4a4132}
.ladder-strip .step>span{display:flex;flex-direction:column;gap:4px;min-width:0}
.ladder-strip b{font:800 15px/1 var(--display);text-transform:uppercase;letter-spacing:.03em}
.ladder-strip small{font:11px/1 var(--mono);color:var(--muted)}
.ghead{display:flex;align-items:center;gap:14px}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.mcard{display:flex;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:14px;text-decoration:none;color:var(--text)}
.mcard:hover{border-color:var(--muted)}
.mbody{min-width:0;display:flex;flex-direction:column;gap:7px}
.mname{font:800 22px/1 var(--display);text-transform:uppercase;letter-spacing:.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mtags{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.mfoot{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.mrack{margin-top:2px}
.vh{white-space:nowrap}
/* voice time: this month's top 5 */
.barflies{margin:22px 0 4px}
.bf-head{display:flex;justify-content:space-between;align-items:end;gap:6px 16px;flex-wrap:wrap;margin-bottom:12px}
.bf-head h2{font-size:30px}
.bf-head .note{max-width:62ch}
.bf-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.bf-list a{display:flex;align-items:center;gap:10px;height:100%;min-width:0;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:10px 12px;text-decoration:none;color:var(--text)}
.bf-list a:hover{border-color:var(--muted)}
.bf-list li:first-child a{border-color:var(--accent-dark);box-shadow:inset 0 3px 0 var(--accent)}
.bf-n{font:800 26px/1 var(--display);color:var(--accent);min-width:.8em;text-align:center}
.bf-who{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
.bf-who b{font:800 18px/1.05 var(--display);text-transform:uppercase;letter-spacing:.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bf-who .mono{font-size:13px;color:var(--soft);white-space:nowrap}
.bf-teaser{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap;border:1px dashed var(--rule);border-radius:var(--r);padding:12px 14px;color:var(--soft);font-size:15px}
.record-head{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.record-head h1{font-family:var(--stencil);font-weight:400;font-size:clamp(38px,6vw,64px);margin:6px 0 12px;overflow-wrap:anywhere}
.record-rank{margin-left:auto;display:flex;align-items:center;gap:14px;padding:12px 20px 12px 12px;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface)}
.record-rank b{display:block;font:800 26px/1 var(--display);text-transform:uppercase;letter-spacing:.02em;margin:7px 0 6px}
.record-rank small{font-size:12px;color:var(--muted)}
.made{display:inline-flex;align-items:center;gap:8px}
.rank-ladder{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:8px}
.rank-ladder li{display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;padding:10px 6px;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface-2)}
.rank-ladder img{width:44px;height:44px}
.rank-ladder b{font:800 14px/1.1 var(--display);text-transform:uppercase;letter-spacing:.03em}
.rank-ladder small{font:11px/1 var(--mono);color:var(--muted)}
.facts small{display:block;margin-top:6px;font-size:12px}
.progress{position:relative;height:30px;margin-top:14px;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);overflow:hidden;display:flex;justify-content:space-between;align-items:center;padding-inline:12px;font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.progress i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,var(--olive),var(--accent-dark));opacity:.55}
.progress span{position:relative}
.oplist{display:flex;flex-direction:column}
.opline{display:grid;grid-template-columns:70px 1fr auto;gap:12px;align-items:baseline;padding-block:10px;border-top:1px solid var(--rule);font-size:15px}
.opline:first-child{border-top:0}
.opline b{font-weight:600}
.going a{font:500 12px/1 var(--mono);padding:5px 7px;background:var(--surface-2);border-radius:2px;color:var(--soft);text-decoration:none}
.going a:hover{color:var(--text)}
.event.pick{cursor:pointer;color:var(--text);font:inherit}
.event.pick.on{border-color:var(--accent);box-shadow:inset 3px 0 0 var(--accent)}
.rc-row{grid-template-columns:20px 1fr;align-items:center}
.rc-row span{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.bonus{display:inline-flex;gap:6px;align-items:center}
.bonus input{width:74px;background:#0f0d0a;border:1px solid var(--rule);border-radius:2px;color:var(--text);font:14px var(--mono);padding:6px 8px}
table.t td.num,table.t th.num{text-align:right}

/* bartender station */
.subtabs{display:flex;gap:0;border:1px solid var(--rule);border-radius:var(--r);margin-bottom:24px;background:var(--surface);overflow-x:auto}
.subtabs button{background:none;border:0;border-left:1px solid var(--rule);padding:14px 20px;font:800 18px/1 var(--display);text-transform:uppercase;letter-spacing:.04em;color:var(--muted);white-space:nowrap}
.subtabs button:first-child{border-left:0}
.subtabs button[aria-selected="true"]{background:var(--surface-2);color:var(--text);box-shadow:inset 0 -3px 0 var(--accent)}
.form{display:grid;gap:14px}
.field{display:flex;flex-direction:column;gap:6px}
.field label,.lbl{font:500 11px/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.field .hint{font-size:13px;color:var(--muted)}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:24px;align-items:start}
.tscroll{overflow-x:auto}
table.t{border-collapse:collapse;width:100%;font-size:14px}
table.t th,table.t td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--rule);white-space:nowrap;vertical-align:middle}
table.t th{font:500 11px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
table.t td select{width:auto;padding:6px 8px;font-size:14px}
.who-cell{display:flex;align-items:center;gap:10px}

/* dialogs */
dialog{background:var(--surface);color:var(--text);border:1px solid var(--rule);border-radius:var(--r);padding:0;width:min(480px,calc(100% - 32px));max-height:calc(100vh - 32px)}
dialog::backdrop{background:rgba(8,7,5,.78)}
dialog form{padding:24px;display:flex;flex-direction:column;gap:16px}
dialog h2{font-size:32px}
.fpick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.fpick label{position:relative;border:1px solid var(--rule);border-radius:2px;padding:12px 6px;text-align:center;cursor:pointer;font:700 15px/1 var(--display);letter-spacing:.06em}
.fpick input{position:absolute;opacity:0;pointer-events:none}
.fpick label:has(input:checked){border-color:currentColor;background:var(--surface-2)}
.fpick label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.check{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start;font-size:15px;color:var(--soft);cursor:pointer}
.check input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent)}
.err{color:var(--bad);font-size:14px;margin:0}
.dlg-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--text);color:var(--ground);padding:11px 16px;border-radius:2px;font:600 14px/1.3 var(--body);z-index:60;max-width:calc(100% - 32px);box-shadow:0 8px 24px rgba(0,0,0,.4)}
.toast.bad{background:var(--bad);color:#fff}
.banner-note{background:var(--surface-2);border-bottom:1px solid var(--rule);font-size:14px;color:var(--soft)}
.banner-note .wrap{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;padding-block:10px}

footer.site{border-top:1px solid var(--rule);padding-block:28px;color:var(--muted);font-size:13px}
footer.site .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer.site a{color:var(--muted)}
footer.site nav{display:flex;gap:16px;flex-wrap:wrap}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .hero .wrap,.split,.about,.two{grid-template-columns:1fr}
  .about figure{order:-1}
  .grid-3,.res-grid{grid-template-columns:1fr 1fr}
  .facts,.facts.five{grid-template-columns:repeat(2,1fr)}
  .facts div:nth-child(odd){border-left:0}
  .facts div:nth-child(n+3){border-top:1px solid var(--rule)}
  .facts.five div:last-child{grid-column:1/-1}
  .record-rank{margin-left:0}
}
@media (max-width:620px){
  .record-head{gap:16px}
  .av.xxl{width:84px;height:84px;font-size:34px}
  .opline{grid-template-columns:60px 1fr auto}
  .bar .wrap{gap:0 12px;padding-top:10px}
  .logo small{display:none}
  nav.tabs{order:3;flex-basis:100%}
  nav.tabs a{padding:14px 9px 12px;font-size:15px;letter-spacing:.04em}
  .who{margin-left:auto}
  .me b{display:none}
  .grid-3,.res-grid{grid-template-columns:1fr}
  .news article{grid-template-columns:1fr;gap:6px}
  .event{grid-template-columns:56px 1fr}
  .event .acts{grid-column:1/-1}
  .sec-head h2{font-size:32px}
  .facts b{font-size:28px}
  .kv dd{text-align:left}
}

/* ribbon bars (assets/js/ribbons.js): one bar per ribbon, stars for repeats */
.rbn{position:relative;display:inline-block;flex:none;width:92px;height:26px;border-radius:1.5px;vertical-align:middle;background-color:#3a3222;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.4),0 1px 2px rgba(0,0,0,.6)}
.rbn::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,0) 42%,rgba(0,0,0,.2)),repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0 1px,transparent 1px 3px)}
.rbn i{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;gap:1px;font-style:normal}
.rbn .dev{width:11px;height:11px;stroke:#2b1e0c;stroke-width:1.3;filter:drop-shadow(0 1px 0 rgba(0,0,0,.5))}
.rbn .dev.bronze{fill:#c99a55}
.rbn .dev.silver{fill:#e3e7ec}
.rbn .rnum{font:700 13px/1 var(--mono);color:#f7ecd0;text-shadow:0 1px 1px #000,0 0 3px #000,0 0 6px rgba(0,0,0,.7)}
.rbn.md{width:64px;height:18px}
.rbn.md .dev{width:8px;height:8px}
.rbn.md .rnum{font-size:10px}
.rbn.sm{width:40px;height:12px;border-radius:1px}
.rbn.sm .dev{width:7px;height:7px;stroke-width:0;filter:none}
.rack-panel .rbn{width:112px;height:32px}
.rack-panel .rbn .dev{width:13px;height:13px}
.rack-panel .rbn .rnum{font-size:15px}
@media (max-width:600px){.rack-panel .rbn{width:92px;height:26px}.rack-panel .rbn .dev{width:11px;height:11px}.rack-panel .rbn .rnum{font-size:13px}}
a.rbn{cursor:pointer}
a.rbn:hover{transform:translateY(-1px)}
.rack{display:inline-flex;flex-direction:column;align-items:center;gap:3px;max-width:100%}
.rrow{display:flex;gap:3px;justify-content:center}
.rack.sm,.rack.sm .rrow{gap:2px}
.rack-panel{display:flex;justify-content:center;padding:26px 16px;background:linear-gradient(180deg,#171410,#0f0d0a);border:1px solid var(--rule);border-radius:var(--r)}
.cites{margin-top:6px}
.cgroup{display:grid;grid-template-columns:92px 1fr;gap:18px;align-items:start;padding:16px 0;border-top:1px solid var(--rule);scroll-margin-top:90px}
.cgroup:first-child{border-top:0}
.cgroup:target{background:linear-gradient(90deg,rgba(233,162,59,.1),transparent 70%)}
.cgroup .rbn{margin-top:2px}
.cgroup h3{font-size:21px;margin:0 0 5px}
.cgroup h3 small{font:500 13px/1 var(--mono);color:var(--accent);letter-spacing:.04em;margin-left:4px}
.cgroup .note{margin:0 0 6px}
.cgroup ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.cgroup li{font-size:14.5px;color:var(--soft)}
.cgroup .when{font:12px/1.3 var(--mono);color:var(--muted)}
@media (max-width:560px){.cgroup{grid-template-columns:1fr;gap:8px}}
/* service record extras: service number, battle buddies, buttons */
.dossier{display:flex;flex-wrap:wrap;gap:6px 18px;margin:10px 0 0;font-size:15px}
.dossier .eyebrow{margin-right:4px;font-size:11px}
.dossier b.mono{font-weight:500;letter-spacing:.06em}
.dossier .grad{color:var(--ok);font-size:12px;margin-left:3px}
.row-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
/* profile: battle buddy volunteer */
.buddy-opt{display:flex;flex-direction:column;gap:6px;border-top:1px dashed var(--rule);padding-top:14px}
.buddy-opt input:disabled+span{opacity:.8}
.buddy-opt .hint{display:block;font-size:13px;line-height:1.45;color:var(--muted);padding-left:30px}
/* Bartender award form: the ribbon next to its description */
#aTypeHint{display:flex;align-items:center;gap:10px}
/* dog tags */
.tags-dlg{max-width:min(560px,calc(100vw - 32px));width:100%}
.tags-dlg canvas{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:var(--r);border:1px solid var(--rule);background:#0f0d0a}
.tags-dlg .dlg-actions{flex-wrap:wrap}

/* =====================================================================
   ROUND 3: rank looks, streaks, profile extras, campaigns, Hall of Fame,
   Bartender → Campaigns, Roster check and Health
   ===================================================================== */
:root{--camo:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240'%3E%3Crect width='240' height='240' fill='%232e3020'/%3E%3Cg fill='%234a4d2b'%3E%3Cpath d='M145 134C144 141 131 143 124 147C116 152 106 160 99 159C93 157 89 144 87 139C85 134 84 135 87 129C90 124 98 112 106 108C113 104 124 101 131 105C137 109 146 127 145 134Z'/%3E%3Cpath transform='translate(-240 0)' d='M249 155C247 160 246 163 243 166C240 169 236 171 230 172C224 172 214 173 208 169C203 165 192 152 195 147C197 141 214 137 224 136C234 134 249 136 254 140C258 143 250 151 249 155Z'/%3E%3Cpath d='M249 155C247 160 246 163 243 166C240 169 236 171 230 172C224 172 214 173 208 169C203 165 192 152 195 147C197 141 214 137 224 136C234 134 249 136 254 140C258 143 250 151 249 155Z'/%3E%3Cpath d='M157 74C157 78 135 81 126 83C118 85 116 85 107 86C98 86 81 90 74 85C67 79 61 63 65 55C69 47 85 35 95 35C105 36 115 52 125 58C135 65 156 70 157 74Z'/%3E%3Cpath d='M75 222C78 226 80 230 75 231C69 233 50 232 42 232C35 231 34 232 31 228C28 223 21 208 23 205C25 201 36 205 41 206C47 207 53 206 58 209C64 212 73 219 75 222Z'/%3E%3Cpath d='M213 42C212 46 206 51 202 53C197 55 191 55 186 54C181 54 177 53 172 49C166 46 148 38 151 34C154 30 180 27 189 27C199 27 204 31 208 34C212 36 214 39 213 42Z'/%3E%3Cpath d='M139 199C139 204 121 212 112 216C104 219 91 221 85 221C80 220 82 215 78 211C74 208 61 204 62 200C63 196 75 187 83 185C91 183 102 187 112 190C121 192 139 195 139 199Z'/%3E%3Cpath transform='translate(-240 0)' d='M251 119C253 124 266 131 261 133C256 135 232 130 221 130C211 129 201 133 200 129C199 126 208 114 213 108C218 101 224 91 230 91C236 90 245 98 249 103C252 108 249 113 251 119Z'/%3E%3Cpath d='M251 119C253 124 266 131 261 133C256 135 232 130 221 130C211 129 201 133 200 129C199 126 208 114 213 108C218 101 224 91 230 91C236 90 245 98 249 103C252 108 249 113 251 119Z'/%3E%3Cpath d='M68 6C70 11 67 26 59 30C50 34 28 28 17 27C5 26 -8 29 -11 25C-14 21 -6 13 -2 5C3 -2 8 -19 16 -20C23 -22 36 -9 44 -4C53 -0 65 -0 68 6Z'/%3E%3Cpath transform='translate(0 240)' d='M68 6C70 11 67 26 59 30C50 34 28 28 17 27C5 26 -8 29 -11 25C-14 21 -6 13 -2 5C3 -2 8 -19 16 -20C23 -22 36 -9 44 -4C53 -0 65 -0 68 6Z'/%3E%3Cpath transform='translate(240 0)' d='M68 6C70 11 67 26 59 30C50 34 28 28 17 27C5 26 -8 29 -11 25C-14 21 -6 13 -2 5C3 -2 8 -19 16 -20C23 -22 36 -9 44 -4C53 -0 65 -0 68 6Z'/%3E%3Cpath transform='translate(240 240)' d='M68 6C70 11 67 26 59 30C50 34 28 28 17 27C5 26 -8 29 -11 25C-14 21 -6 13 -2 5C3 -2 8 -19 16 -20C23 -22 36 -9 44 -4C53 -0 65 -0 68 6Z'/%3E%3Cpath transform='translate(-240 0)' d='M240 48C240 50 236 52 232 55C228 57 221 63 217 63C212 63 209 60 205 56C202 52 194 41 196 38C198 34 211 33 217 34C222 34 226 40 230 42C233 45 240 45 240 48Z'/%3E%3Cpath d='M240 48C240 50 236 52 232 55C228 57 221 63 217 63C212 63 209 60 205 56C202 52 194 41 196 38C198 34 211 33 217 34C222 34 226 40 230 42C233 45 240 45 240 48Z'/%3E%3Cpath d='M59 7C59 13 50 16 40 20C30 24 12 31 -1 31C-13 31 -31 26 -36 21C-40 16 -34 7 -28 -1C-21 -9 -8 -24 3 -26C14 -28 29 -20 38 -14C48 -9 58 2 59 7Z'/%3E%3Cpath transform='translate(0 240)' d='M59 7C59 13 50 16 40 20C30 24 12 31 -1 31C-13 31 -31 26 -36 21C-40 16 -34 7 -28 -1C-21 -9 -8 -24 3 -26C14 -28 29 -20 38 -14C48 -9 58 2 59 7Z'/%3E%3Cpath transform='translate(240 0)' d='M59 7C59 13 50 16 40 20C30 24 12 31 -1 31C-13 31 -31 26 -36 21C-40 16 -34 7 -28 -1C-21 -9 -8 -24 3 -26C14 -28 29 -20 38 -14C48 -9 58 2 59 7Z'/%3E%3Cpath transform='translate(240 240)' d='M59 7C59 13 50 16 40 20C30 24 12 31 -1 31C-13 31 -31 26 -36 21C-40 16 -34 7 -28 -1C-21 -9 -8 -24 3 -26C14 -28 29 -20 38 -14C48 -9 58 2 59 7Z'/%3E%3Cpath transform='translate(0 -240)' d='M226 222C224 227 210 230 202 233C194 236 184 241 178 240C171 239 166 232 163 227C161 222 160 216 164 213C168 210 179 211 188 209C196 208 210 200 216 202C223 204 229 216 226 222Z'/%3E%3Cpath d='M226 222C224 227 210 230 202 233C194 236 184 241 178 240C171 239 166 232 163 227C161 222 160 216 164 213C168 210 179 211 188 209C196 208 210 200 216 202C223 204 229 216 226 222Z'/%3E%3C/g%3E%3Cg fill='%235d573a'%3E%3Cpath transform='translate(-240 0)' d='M233 176C233 181 233 185 229 188C225 190 217 192 211 191C205 190 196 187 193 184C191 180 194 174 197 171C199 167 203 163 209 162C214 160 226 159 230 161C235 164 234 172 233 176Z'/%3E%3Cpath d='M233 176C233 181 233 185 229 188C225 190 217 192 211 191C205 190 196 187 193 184C191 180 194 174 197 171C199 167 203 163 209 162C214 160 226 159 230 161C235 164 234 172 233 176Z'/%3E%3Cpath d='M76 4C76 7 85 12 82 14C78 16 62 15 56 14C50 13 46 8 45 5C44 3 47 1 49 -2C51 -5 49 -12 55 -13C60 -14 78 -11 82 -8C85 -5 76 -0 76 4Z'/%3E%3Cpath transform='translate(0 240)' d='M76 4C76 7 85 12 82 14C78 16 62 15 56 14C50 13 46 8 45 5C44 3 47 1 49 -2C51 -5 49 -12 55 -13C60 -14 78 -11 82 -8C85 -5 76 -0 76 4Z'/%3E%3Cpath d='M112 138C112 142 110 151 105 154C100 158 87 158 83 157C79 155 81 148 80 145C79 141 77 138 78 136C79 133 81 130 86 129C90 128 101 129 106 131C110 132 112 134 112 138Z'/%3E%3Cpath d='M93 201C96 207 109 213 106 216C103 220 84 224 76 223C67 221 56 212 54 207C52 203 61 199 62 196C64 192 60 188 65 186C70 183 87 178 91 180C96 183 91 195 93 201Z'/%3E%3Cpath d='M73 34C73 37 72 41 68 44C64 46 52 49 48 48C45 46 46 39 46 36C45 34 46 33 46 31C47 29 46 25 50 25C53 24 61 27 65 29C69 30 72 32 73 34Z'/%3E%3Cpath d='M93 83C92 87 84 92 77 95C70 98 60 103 53 103C47 103 38 100 38 96C38 92 48 82 51 77C55 72 53 67 59 66C64 66 77 71 82 74C88 77 94 80 93 83Z'/%3E%3Cpath d='M161 215C159 219 153 218 147 221C141 224 132 231 125 231C119 231 111 223 107 218C104 214 98 209 103 204C108 199 128 189 137 188C146 186 154 191 158 195C162 200 163 210 161 215Z'/%3E%3Cpath transform='translate(0 -240)' d='M94 218C94 221 99 229 95 232C91 235 75 234 68 234C60 234 54 236 50 232C46 229 41 218 44 213C47 209 60 206 68 205C76 205 86 208 90 211C94 213 93 214 94 218Z'/%3E%3Cpath d='M94 218C94 221 99 229 95 232C91 235 75 234 68 234C60 234 54 236 50 232C46 229 41 218 44 213C47 209 60 206 68 205C76 205 86 208 90 211C94 213 93 214 94 218Z'/%3E%3Cpath d='M65 127C63 131 53 137 47 138C41 139 34 134 29 133C23 132 18 136 14 133C11 130 4 122 7 118C10 113 24 109 32 108C40 107 50 110 56 113C61 116 66 123 65 127Z'/%3E%3Cpath transform='translate(240 0)' d='M65 127C63 131 53 137 47 138C41 139 34 134 29 133C23 132 18 136 14 133C11 130 4 122 7 118C10 113 24 109 32 108C40 107 50 110 56 113C61 116 66 123 65 127Z'/%3E%3C/g%3E%3Cg fill='%233a2f20'%3E%3Cpath d='M92 94C92 99 95 108 91 110C87 112 75 109 69 107C63 105 58 104 55 100C52 96 51 89 52 84C52 80 54 73 60 73C66 72 83 77 88 81C94 85 91 89 92 94Z'/%3E%3Cpath d='M204 136C204 139 207 142 203 144C199 147 185 151 180 150C176 150 177 145 176 142C175 138 172 136 174 132C177 128 186 119 190 118C195 117 200 124 202 127C205 130 204 133 204 136Z'/%3E%3Cpath d='M76 145C76 147 65 152 60 155C55 159 49 166 43 166C38 166 30 159 28 155C26 151 29 146 32 143C35 141 40 139 44 138C48 137 53 138 58 139C63 140 76 142 76 145Z'/%3E%3Cpath d='M65 127C63 129 59 132 56 134C52 136 50 141 46 141C41 140 32 135 29 132C27 128 28 122 30 120C33 117 41 119 47 118C53 118 62 115 65 117C68 118 67 124 65 127Z'/%3E%3Cpath d='M230 78C230 81 229 88 226 89C224 91 220 86 216 84C212 83 207 81 204 79C200 77 193 75 194 72C196 70 206 63 211 62C216 61 221 64 224 67C227 69 229 74 230 78Z'/%3E%3Cpath d='M187 6C186 8 174 9 169 10C165 12 164 17 160 17C156 17 148 12 147 9C146 7 153 4 155 2C157 1 157 -0 161 -1C164 -2 171 -5 175 -4C180 -3 188 3 187 6Z'/%3E%3Cpath transform='translate(0 240)' d='M187 6C186 8 174 9 169 10C165 12 164 17 160 17C156 17 148 12 147 9C146 7 153 4 155 2C157 1 157 -0 161 -1C164 -2 171 -5 175 -4C180 -3 188 3 187 6Z'/%3E%3Cpath d='M157 33C157 37 149 47 146 48C142 49 140 43 136 41C132 40 123 39 121 37C119 36 123 32 125 30C127 28 129 26 133 25C136 24 143 25 147 26C151 28 158 30 157 33Z'/%3E%3Cpath d='M25 166C25 170 18 178 15 180C11 182 6 180 2 179C-2 177 -5 175 -9 172C-13 168 -22 161 -21 157C-19 153 -7 149 -1 149C6 149 13 155 18 158C22 161 26 162 25 166Z'/%3E%3Cpath transform='translate(240 0)' d='M25 166C25 170 18 178 15 180C11 182 6 180 2 179C-2 177 -5 175 -9 172C-13 168 -22 161 -21 157C-19 153 -7 149 -1 149C6 149 13 155 18 158C22 161 26 162 25 166Z'/%3E%3Cpath d='M163 123C163 128 163 135 158 138C153 141 140 141 132 140C125 139 116 136 114 131C112 126 116 115 120 110C125 105 134 102 141 102C148 101 158 102 162 106C165 109 164 117 163 123Z'/%3E%3C/g%3E%3Cg fill='%23191710'%3E%3Cpath d='M30 80C29 83 29 88 27 91C24 94 19 97 15 96C11 95 7 88 5 85C3 82 1 79 3 77C4 75 9 74 14 73C19 73 28 74 31 75C34 76 31 77 30 80Z'/%3E%3Cpath transform='translate(240 0)' d='M30 80C29 83 29 88 27 91C24 94 19 97 15 96C11 95 7 88 5 85C3 82 1 79 3 77C4 75 9 74 14 73C19 73 28 74 31 75C34 76 31 77 30 80Z'/%3E%3Cpath d='M190 180C188 183 180 189 177 191C173 193 170 191 166 190C162 190 156 191 154 189C151 188 151 184 153 180C156 177 162 172 168 170C173 168 183 167 186 169C190 170 191 176 190 180Z'/%3E%3Cpath transform='translate(0 -240)' d='M147 240C147 243 150 247 149 250C147 252 141 254 136 254C132 253 126 248 123 245C120 242 118 238 120 236C122 234 130 233 135 232C139 232 147 231 149 233C151 234 147 237 147 240Z'/%3E%3Cpath d='M147 240C147 243 150 247 149 250C147 252 141 254 136 254C132 253 126 248 123 245C120 242 118 238 120 236C122 234 130 233 135 232C139 232 147 231 149 233C151 234 147 237 147 240Z'/%3E%3Cpath d='M143 142C142 145 137 148 133 149C130 151 125 151 123 151C120 150 119 149 118 148C117 147 115 144 117 142C118 140 121 136 125 135C129 134 137 135 140 136C143 137 144 140 143 142Z'/%3E%3Cpath transform='translate(0 -240)' d='M38 234C39 236 30 245 25 247C19 249 12 246 5 246C-1 246 -11 247 -13 245C-14 242 -8 235 -4 231C-0 227 8 221 12 221C17 221 16 229 21 231C25 233 38 231 38 234Z'/%3E%3Cpath d='M38 234C39 236 30 245 25 247C19 249 12 246 5 246C-1 246 -11 247 -13 245C-14 242 -8 235 -4 231C-0 227 8 221 12 221C17 221 16 229 21 231C25 233 38 231 38 234Z'/%3E%3Cpath transform='translate(240 -240)' d='M38 234C39 236 30 245 25 247C19 249 12 246 5 246C-1 246 -11 247 -13 245C-14 242 -8 235 -4 231C-0 227 8 221 12 221C17 221 16 229 21 231C25 233 38 231 38 234Z'/%3E%3Cpath transform='translate(240 0)' d='M38 234C39 236 30 245 25 247C19 249 12 246 5 246C-1 246 -11 247 -13 245C-14 242 -8 235 -4 231C-0 227 8 221 12 221C17 221 16 229 21 231C25 233 38 231 38 234Z'/%3E%3Cpath d='M163 107C162 109 162 113 159 114C156 116 150 117 146 117C142 117 140 116 138 114C136 112 133 108 135 105C136 102 141 98 146 98C150 97 159 101 162 103C165 105 163 106 163 107Z'/%3E%3Cpath d='M78 29C77 32 72 33 68 34C63 36 56 40 51 40C46 39 38 35 37 33C36 30 44 26 46 23C47 19 42 12 48 11C53 10 72 14 77 17C82 20 80 26 78 29Z'/%3E%3Cpath d='M25 14C25 17 23 19 20 20C18 21 13 20 9 20C5 20 -2 19 -4 18C-6 16 -3 12 -1 11C1 9 4 9 7 8C10 8 16 5 19 6C22 7 24 12 25 14Z'/%3E%3Cpath transform='translate(0 240)' d='M25 14C25 17 23 19 20 20C18 21 13 20 9 20C5 20 -2 19 -4 18C-6 16 -3 12 -1 11C1 9 4 9 7 8C10 8 16 5 19 6C22 7 24 12 25 14Z'/%3E%3Cpath transform='translate(240 0)' d='M25 14C25 17 23 19 20 20C18 21 13 20 9 20C5 20 -2 19 -4 18C-6 16 -3 12 -1 11C1 9 4 9 7 8C10 8 16 5 19 6C22 7 24 12 25 14Z'/%3E%3Cpath transform='translate(240 240)' d='M25 14C25 17 23 19 20 20C18 21 13 20 9 20C5 20 -2 19 -4 18C-6 16 -3 12 -1 11C1 9 4 9 7 8C10 8 16 5 19 6C22 7 24 12 25 14Z'/%3E%3Cpath d='M215 19C214 21 209 22 206 23C203 24 202 24 199 24C197 23 193 22 191 20C189 18 185 14 186 12C187 11 193 10 197 10C202 10 211 9 213 10C216 12 216 17 215 19Z'/%3E%3C/g%3E%3C/svg%3E")}
dialog{overflow:auto}
/* rank-unlocked looks: camo card for Corporals and up, brass trim for officers, gold for a Colonel */
.mcard.look-camo,.mcard.look-brass,.mcard.look-gold,
.record-head.look-camo .record-rank,.record-head.look-brass .record-rank,.record-head.look-gold .record-rank{
  background-image:linear-gradient(rgba(28,24,18,.74),rgba(28,24,18,.74)),var(--camo);background-size:auto,240px;border-color:#4a4c2f}
.mcard.look-camo:hover{border-color:#6b7349}
.mcard.look-brass,.record-head.look-brass .record-rank{border-color:#8e6a2e;box-shadow:inset 0 0 0 1px rgba(233,162,59,.18)}
.mcard.look-gold,.record-head.look-gold .record-rank{border-color:#c9a241;box-shadow:inset 0 0 0 1px rgba(245,215,120,.28),0 0 18px rgba(233,162,59,.12)}
.mcard.look-brass:hover,.mcard.look-gold:hover{border-color:#e3c27a}
.mcard.look-brass .mname{color:#f2d48f}
.mcard.look-gold .mname{color:#fbe3a1}
.record-head.look-gold .av.xxl{box-shadow:0 0 0 3px #e8c766,0 0 0 7px var(--surface),0 0 26px rgba(233,162,59,.35)}
/* the nameplate on an officer's service record */
.plate{display:inline-block;padding:.12em .38em .06em;border-radius:4px;line-height:1;color:#2b1e0c;
  background:linear-gradient(180deg,#e6c77e 0%,#c49a4f 46%,#9c7636 54%,#caa55c 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 0 rgba(0,0,0,.28),0 0 0 1px #6e5122,0 3px 10px rgba(0,0,0,.55);
  text-shadow:0 1px 0 rgba(255,255,255,.4),0 -1px 0 rgba(0,0,0,.25)}
.plate.gold{color:#3a2800;background:linear-gradient(180deg,#fff0b8 0%,#ecc55a 44%,#c99a25 56%,#f2d06c 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 0 rgba(0,0,0,.25),0 0 0 1px #8a6a12,0 3px 14px rgba(233,162,59,.35)}
/* streak chip */
.streak{display:inline-flex;align-items:center;gap:5px;font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:4px 7px 4px 6px;border-radius:2px;background:rgba(255,91,79,.1);color:#ffb3a8;border:1px solid rgba(255,91,79,.42);white-space:nowrap}
.streak svg{width:12px;height:12px;fill:#ff7a5c;flex:none}
/* service record extras */
.bio{margin:12px 0 0;font-size:17px;font-style:italic;color:var(--soft);max-width:62ch}
.streak-note{margin-top:12px}
.camp-line{display:flex;align-items:center;gap:10px 22px;flex-wrap:wrap;margin-top:12px;padding:12px 16px;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);color:var(--text);text-decoration:none}
.camp-line:hover{border-color:var(--muted)}
.camp-line>span:first-child{display:flex;flex-direction:column;gap:5px}
.camp-line b{font:800 20px/1 var(--display);text-transform:uppercase;letter-spacing:.02em}
.camp-meter{display:inline-flex;gap:4px;flex-wrap:wrap}
.camp-meter i{width:18px;height:18px;border:1px solid #4a4132;border-radius:2px;background:#0f0d0a;transform:skewX(-12deg)}
.camp-meter i.on{background:linear-gradient(180deg,var(--accent),var(--accent-dark));border-color:var(--accent-dark)}
/* Members page header buttons */
.head-side{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.head-side .row-btns{margin-top:0}
/* profile dialog: who brought you, extras, standing orders */
#pfRecruit{border-top:1px dashed var(--rule);padding-top:14px}
.opt{font-family:var(--body);text-transform:none;letter-spacing:0;font-size:12px;color:var(--muted)}
.pf-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px;border-top:1px dashed var(--rule);padding-top:14px}
.pf-grid .wide{grid-column:1/-1}
.standing{display:flex;flex-direction:column;gap:8px;border-top:1px dashed var(--rule);padding-top:14px}
.standing .hint{font-size:13px;color:var(--muted);line-height:1.45}
.standing-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin-top:2px}
.standing-opts .check{font-size:14px;align-items:center}
.standing-opts .check input{margin:0}

/* ---------- Hall of Fame ---------- */
.plaques{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.plaque{position:relative;background:linear-gradient(180deg,#241b11,#16110b);border:1px solid #3d3021;border-radius:5px;padding:0 0 10px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),inset 0 0 0 3px #1a140d,inset 0 0 0 4px #33281b,0 8px 20px rgba(0,0,0,.35)}
.plaque::before,.plaque::after{content:"";position:absolute;top:8px;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f0dcaa,#8a6a30 70%);box-shadow:0 1px 1px rgba(0,0,0,.6)}
.plaque::before{left:8px}
.plaque::after{right:8px}
.plaque header{margin:18px 18px 10px;padding:10px 14px 9px;border-radius:2px;color:#2a1c09;
  background:linear-gradient(180deg,#e2c078 0%,#bf9550 46%,#9e7838 54%,#c9a45a 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 0 rgba(0,0,0,.3),0 0 0 1px #5e4520,0 2px 4px rgba(0,0,0,.6)}
.plaque h3{font:400 21px/1 var(--stencil);letter-spacing:.05em;text-transform:uppercase;text-shadow:0 1px 0 rgba(255,255,255,.35)}
.plaque header p{margin:6px 0 0;font:500 12.5px/1.35 var(--body);color:#3b2a10}
.plaque-empty{margin:6px 22px 8px;color:var(--muted);font-size:14px}
.honor-list{list-style:none;margin:0;padding:0 18px;display:grid}
.honor-list li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 2px;border-top:1px solid rgba(239,230,210,.06)}
.honor-list li:first-child{border-top:0}
.honor-list .who-link{min-width:0}
.honor-list b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hn{font:800 20px/1 var(--display);color:var(--muted);text-align:center}
.honor-list li.top .hn{color:var(--accent)}
.honor-list li.top b{color:#f5d68f}
.hv{display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:right;font-size:14px;color:var(--soft);white-space:nowrap}
.hv small{font:11px/1 var(--mono);color:var(--muted)}
.honor-list.flat{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:4px 14px}
.firsts{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.first{display:flex;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);min-width:0}
.first>div{display:flex;flex-direction:column;gap:5px;min-width:0}
.first b{font:800 18px/1.05 var(--display);text-transform:uppercase;letter-spacing:.02em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.first .who-link{display:block;min-width:0}
.first small{font-size:11px;color:var(--muted)}
.first.open{border-style:dashed;background:none}
.first.open .ins{opacity:.35;filter:grayscale(1)}
.first .open-slot{color:var(--muted)}
.champs{display:grid;gap:8px}
.champ{display:flex;justify-content:space-between;align-items:center;gap:8px 18px;flex-wrap:wrap;padding:12px 16px;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);color:var(--text);text-decoration:none}
.champ:hover{border-color:var(--muted)}
.champ.now{border-color:var(--accent-dark);box-shadow:inset 3px 0 0 var(--accent)}
.c-name,.c-champ{display:flex;flex-direction:column;gap:5px;min-width:0}
.c-champ{align-items:flex-end;text-align:right}
.champ b{font:800 20px/1.05 var(--display);text-transform:uppercase;letter-spacing:.02em}
.c-champ small{font-size:12px;color:var(--muted)}

/* ---------- campaign page ---------- */
.camp-head{display:flex;justify-content:space-between;align-items:center;gap:20px 32px;flex-wrap:wrap}
.camp-head>div:first-child{min-width:0;flex:1 1 320px}
.camp-title{font-family:var(--stencil);font-weight:400;font-size:clamp(34px,6vw,60px);margin:8px 0 10px;overflow-wrap:anywhere}
.camp-ribbon{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--rule);border-radius:var(--r);background:linear-gradient(180deg,#171410,#0f0d0a);max-width:380px}
.camp-ribbon .rbn{width:112px;height:32px}
.camp-ribbon b{display:block;font:800 18px/1 var(--display);text-transform:uppercase;letter-spacing:.02em}
.camp-ribbon small{display:block;margin-top:6px;font-size:13px;line-height:1.4;color:var(--muted)}
.camp-you{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap;margin-top:16px;padding:12px 16px;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface)}
.camp-you.done{border-color:var(--accent-dark);box-shadow:inset 3px 0 0 var(--accent)}
.cy-text{color:var(--soft);font-size:15px}
.cy-text b{color:var(--text)}
.camp-teaser{margin-top:16px}
.standings{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.standings li{display:grid;grid-template-columns:26px minmax(0,1fr) auto auto 44px;gap:10px;align-items:center;padding:8px 12px;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r)}
.standings li.top{border-color:var(--accent-dark);box-shadow:inset 0 3px 0 var(--accent)}
.standings li[data-me]{background:#1f2016;border-color:var(--olive)}
.standings .who-link{min-width:0}
.standings .who-link b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s-tags{display:flex;gap:6px;align-items:center}
.ri{display:inline-flex}
.s-n{font-size:14px;color:var(--soft);text-align:right;white-space:nowrap}
.s-rb{display:flex;justify-content:flex-end}
.fbars{display:grid;gap:12px}
.fbar{display:grid;grid-template-columns:100px minmax(0,1fr);gap:5px 12px;align-items:center}
.fname{font:800 16px/1 var(--display);text-transform:uppercase;letter-spacing:.05em}
.ftrack{height:14px;background:#0f0d0a;border:1px solid var(--rule);border-radius:2px;overflow:hidden}
.ftrack i{display:block;height:100%;background:currentColor;opacity:.85}
.fnum{grid-column:2;font-size:12px;color:var(--muted)}

/* ---------- Bartender station: campaigns, roster check, health ---------- */
.camp-admin{display:grid;gap:10px}
.camp-row{display:grid;grid-template-columns:minmax(170px,230px) minmax(0,1fr) auto;gap:10px 14px;align-items:center;padding:12px 14px}
.camp-row.now{border-color:var(--accent-dark);box-shadow:inset 3px 0 0 var(--accent)}
.cr-when{display:flex;flex-direction:column;gap:6px}
.cr-when small{font-size:12px;color:var(--muted)}
.cr-acts{display:flex;gap:8px}
.inline-pick{display:flex;align-items:center;gap:8px;font:500 11px/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.inline-pick select{width:auto;padding:6px 8px;font:14px var(--body);text-transform:none;letter-spacing:0}
table.t td.wrap-cell{white-space:normal;min-width:220px;max-width:420px}
.health-top{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border:1px solid var(--rule);border-left:4px solid var(--ok);border-radius:var(--r);background:var(--surface)}
.health-top.warn{border-left-color:var(--accent)}
.health-top b{font:800 26px/1 var(--display);text-transform:uppercase;letter-spacing:.02em}
.health-top span{color:var(--soft);font-size:15px}
.hs{display:inline-block;font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:5px 8px;border-radius:2px;white-space:nowrap}
.hs.ok{background:rgba(98,160,76,.16);color:#9fd08a}
.hs.warn{background:rgba(233,162,59,.16);color:var(--accent)}
.hs.bad{background:rgba(224,100,90,.18);color:#ff9a90}
.hs.wait{background:var(--surface-2);color:var(--muted)}
.opline.hp{grid-template-columns:90px minmax(0,1fr)}
.job-code{display:block;margin-top:3px;font-size:12px}
.facts .t-warn{box-shadow:inset 0 3px 0 var(--accent)}
.facts .t-warn b{color:var(--accent)}
.opline.hp .note{grid-column:2;font-size:13px;overflow-wrap:anywhere}

/* =====================================================================
   ROUND 4: Regular of the Week, squadmates, Tour of Duty card, on leave,
   op leads and the Bartender log
   ===================================================================== */
input[type=date]{background:#0f0d0a;border:1px solid var(--rule);border-radius:2px;color:var(--text);font:15px/1.4 var(--body);padding:10px 12px}
input[type=date]{width:100%;min-height:44px}
/* chips */
.chip.leave{color:#9fb6cc}
.chip.rotw-chip{color:#ff8a7f;border-color:rgba(255,91,79,.75);box-shadow:0 0 8px rgba(255,91,79,.35),inset 0 0 6px rgba(255,91,79,.18);text-shadow:0 0 6px rgba(255,91,79,.55)}
.leave-note{margin-top:10px;padding-left:10px;border-left:3px solid #6d8196}
.sq-n{display:inline-block;min-width:1.7em;margin-left:2px;padding:2px 5px;border-radius:9px;background:var(--surface-2);color:var(--muted);font-size:11px;text-align:center;vertical-align:1px}
/* the Regular of the Week: a neon sign over the bar */
#regular{margin:22px 0 4px}
.rotw{display:flex;align-items:center;gap:18px 30px;flex-wrap:wrap;padding:20px 24px;border:1px solid #5a2a24;border-radius:var(--r);text-decoration:none;color:var(--text);
  background:radial-gradient(ellipse at 12% 50%,rgba(255,91,79,.16),transparent 60%),linear-gradient(180deg,#221a14,#17120d)}
.rotw:hover{border-color:#8a3b31}
.rotw-sign{display:flex;flex-direction:column;align-items:center;gap:0;flex:none;min-width:170px;font:400 64px/.9 var(--script);color:#ffe3de;
  text-shadow:0 0 2px #fff,0 0 8px #ff5b4f,0 0 18px #ff5b4f,0 0 36px rgba(255,91,79,.75),0 0 64px rgba(255,91,79,.45);transform:rotate(-4deg);padding:4px 6px 10px}
.rotw-sign small{font:500 11px/1 var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--accent);text-shadow:0 0 8px rgba(233,162,59,.6);margin-bottom:6px;transform:rotate(4deg)}
.rotw-body{display:flex;flex-direction:column;gap:10px;min-width:0;flex:1 1 320px}
.rotw-who{display:flex;align-items:center;gap:14px;min-width:0}
.rotw-who>span{display:flex;flex-direction:column;gap:7px;min-width:0}
.rotw-who .mname{font-size:30px}
.rotw .bio,.rotw .dossier{margin:0}
/* Hall of Fame: best duos */
.duo{display:flex;align-items:center;gap:10px;min-width:0}
.duo-av{display:flex;flex:none}
.duo-av .av+.av{margin-left:-9px;box-shadow:0 0 0 2px #1d1610}
.duo-names{min-width:0;line-height:1.25;overflow-wrap:anywhere;color:var(--muted)}
.duo-names a{text-decoration:none;color:var(--text)}
.duo-names a:hover b{text-decoration:underline}
.honor-list li.top .duo-names b{color:#f5d68f}
/* on leave in the profile */
.leave-opt{display:flex;flex-direction:column;gap:10px;border-top:1px dashed var(--rule);padding-top:14px}
.leave-opt .field{padding-left:30px;max-width:260px}
/* Tour of Duty card */
.tour-dlg{width:min(520px,calc(100% - 32px))}
.tour-dlg canvas{display:block;flex:none;align-self:center;height:auto;aspect-ratio:1080/1350;border-radius:var(--r);border:1px solid var(--rule);background:#0f0d0a;
  width:min(100%,max(240px,calc((100vh - 290px) * .8)));width:min(100%,max(240px,calc((100dvh - 290px) * .8)))}
.tour-dlg .dlg-actions{flex-wrap:wrap}
/* the service log on a service record: last op night, last day in voice */
.svc-log{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
.svc-log>div{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:14px 16px;min-width:0}
.svc-log>div>span:last-child{display:flex;flex-direction:column;gap:5px;min-width:0}
.svc-log .ico{font-size:24px;line-height:1;margin-top:2px}
.svc-log b{font:800 22px/1.05 var(--display);text-transform:uppercase;letter-spacing:.02em;overflow-wrap:anywhere}
.svc-log b.none{color:var(--muted)}
.svc-log small{font-size:13px;color:var(--muted)}
.svc-log .svc-teaser{border-style:dashed;background:none}
.linkish{background:none;border:0;padding:0;color:var(--accent);font:inherit;text-decoration:underline;cursor:pointer}
.svc-feed{list-style:none;margin:14px 0 0;padding:0;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface)}
.svc-feed li{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 16px;border-top:1px solid var(--rule)}
.svc-feed li:first-child{border-top:0}
.sf-ico{display:flex;justify-content:center;align-items:center;font-size:20px;line-height:1}
.sf-ico .ins{width:30px;height:30px}
.sf-body{display:flex;flex-direction:column;gap:3px;min-width:0}
.sf-body b{font:800 18px/1.1 var(--display);text-transform:uppercase;letter-spacing:.02em;overflow-wrap:anywhere}
.sf-body small{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.svc-feed .sf-promo b,.svc-feed .sf-ribbon b,.svc-feed .sf-stripe b,.svc-feed .sf-regular b{color:#f5d68f}
.sf-when{display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:right;white-space:nowrap}
.sf-when .mono{font-size:13px;color:var(--soft)}
.sf-when small{font-size:12px;color:var(--muted)}
.sf-stripe{display:inline-flex}
.sf-stripe i{display:block;width:8px;height:22px;background:var(--accent);transform:skewX(-20deg);border-radius:1px}
.svc-more{margin-top:12px}
/* Bartender station: op leads, roll call lead, on leave, log */
.stack{display:grid;gap:24px;align-content:start}
#opsList .event{grid-template-columns:64px minmax(180px,1fr) auto}
#opsList .event .acts{flex-wrap:wrap;justify-content:flex-end}
.lead-pick{white-space:nowrap}
.lead-pick select{max-width:180px}
.rank.lead{background:rgba(233,162,59,.16);color:var(--accent)}
.rc-lead{margin-bottom:14px}
.rc-lead select{max-width:320px}
.leave-add{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-top:14px;padding:14px;border:1px dashed var(--rule);border-radius:var(--r)}
.leave-add .field{flex:1 1 200px;max-width:280px}
table.t tfoot td{border-bottom:0;padding-top:12px;white-space:normal}
.log-kind{display:inline-block;font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:5px 8px;border-radius:2px;background:var(--surface-2);color:var(--soft);white-space:nowrap}
.log-kind.k-award,.log-kind.k-lead{background:rgba(233,162,59,.16);color:var(--accent)}
.log-kind.k-rollcall,.log-kind.k-campaign{background:rgba(107,115,73,.28);color:#d4dab3}
.log-kind.k-leave{background:rgba(109,129,150,.22);color:#b9cadb}
.log-kind.k-member{background:rgba(224,100,90,.16);color:#ffb1a8}
.log-kind.k-news{background:rgba(79,130,198,.18);color:#b8cff0}

@media (max-width:620px){
  .pf-grid,.standing-opts{grid-template-columns:1fr}
  .plaques{grid-template-columns:1fr}
  .standings li{grid-template-columns:24px minmax(0,1fr) auto 40px;gap:8px;padding:8px 10px}
  .s-tags{display:none}
  .c-champ{align-items:flex-start;text-align:left}
  .camp-row{grid-template-columns:1fr}
  .camp-ribbon{max-width:none;width:100%}
  .fbar{grid-template-columns:84px minmax(0,1fr)}
  .rotw{padding:16px}
  .rotw-sign{min-width:0;width:100%;font-size:54px}
  .rotw-who .mname{font-size:24px}
  .leave-add .field{max-width:none}
  .lead-pick select{max-width:150px}
  #opsList .event{grid-template-columns:56px minmax(0,1fr)}
  .svc-feed li{grid-template-columns:34px minmax(0,1fr);padding:10px 12px}
  .sf-when{grid-column:2;flex-direction:row;align-items:baseline;gap:8px;white-space:normal;text-align:left}
}

/* =====================================================================
   ROUND 5: heads-up alerts, the kit check, housekeeping and the version
   ===================================================================== */
/* smaller fact tiles, for the side-by-side blocks */
.facts.sm{grid-template-columns:repeat(3,1fr)}
/* two tiles shouldn't leave a third of the box empty */
.facts.sm:has(> :nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
.facts.sm div{padding:14px 16px}
.facts.sm b{font-size:26px;margin-top:6px}
/* the 900px rules for the big strip don't suit this one */
.facts.sm div:nth-child(odd){border-left:1px solid var(--rule)}
.facts.sm div:first-child{border-left:0}
.facts.sm div:nth-child(n+3){border-top:0}
.sub-head{margin:18px 0 4px;font:500 11px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
/* what's wrong right now */
.opline.alert-row{grid-template-columns:auto minmax(0,1fr) auto;gap:12px 14px;align-items:center;padding-block:14px}
.opline.alert-row.bad{border-left:3px solid var(--bad);padding-left:12px}
.opline.alert-row b{font:800 17px/1.25 var(--display);letter-spacing:.01em}
.opline.alert-row .note{grid-column:2;font-size:14px;overflow-wrap:anywhere}
.opline.alert-row .mono{grid-column:3;grid-row:1;font-size:12px;text-align:right;white-space:nowrap}
/* run it now */
.runbtns{display:flex;flex-wrap:wrap;gap:8px}
.runbtns .btn{min-height:40px}
.runbtns .btn[data-busy]{opacity:.55;pointer-events:none}
/* the last 24 hours, an hour at a time */
.hstrip{display:flex;align-items:flex-end;gap:3px;height:64px;margin-top:6px;padding:6px 8px;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface)}
.hbar{flex:1 1 0;min-width:4px;max-width:34px;height:var(--h,0);min-height:2px;border-radius:1px;background:var(--accent);opacity:.85}
.hbar.bad{background:var(--bad);opacity:1}
.hbar.none{background:var(--rule);height:2px;opacity:1}
.hstrip-x{display:flex;justify-content:space-between;margin:4px 2px 10px;font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
/* the bot's kit check */
.kitlist{display:flex;flex-direction:column}
.kitrow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding-block:11px;border-top:1px solid var(--rule);font-size:15px}
.kitrow:last-child{border-bottom:1px solid var(--rule)}
.kitrow.bad{border-left:3px solid var(--bad);padding-left:12px}
.kitrow .note{grid-column:2;font-size:13px;overflow-wrap:anywhere}
.kitrow .note.mono{grid-column:3;grid-row:1;font-size:12px;text-align:right;white-space:nowrap}
@media (max-width:820px){
  .facts.sm,.facts.sm:has(> :nth-child(2):last-child){grid-template-columns:1fr 1fr}
  .facts.sm div:nth-child(3){border-left:0;border-top:1px solid var(--rule)}
}
@media (max-width:620px){
  .facts.sm,.facts.sm:has(> :nth-child(2):last-child){grid-template-columns:1fr}
  .facts.sm div{border-left:0;border-top:1px solid var(--rule)}
  .facts.sm div:first-child{border-top:0}
  .kitrow{grid-template-columns:auto minmax(0,1fr)}
  .kitrow .note.mono{grid-column:1/-1;grid-row:auto;text-align:left}
  .opline.alert-row{grid-template-columns:auto minmax(0,1fr)}
  .opline.alert-row .mono{grid-column:1/-1;grid-row:auto;text-align:left}
  .hstrip{height:48px}
  .runbtns .btn{flex:1 1 auto}
}