/* =============================================================================
   SWAT.CSS — additive layer over the kit (brand.css) for swat.leematulis.com.
   The Mysterium SWAT-unit proposal surface. Kit tokens only — no new :root
   tokens, no palette invention (deploy/CLAUDE.md §27). Namespace: body.swat-doc.
   Spectrum appears ONLY in motion (canon); stills fall back to bronze.
   ============================================================================= */

.swat-doc{font-size:19px;line-height:1.6}
.swat-doc .wrap{max-width:860px;padding:0 28px}

/* ---- nav tweaks: leave air for the floating theme disc ---------------------- */
.swat-doc .nav{padding-right:64px}

/* ---- hero ------------------------------------------------------------------- */
.swat-hero{padding:84px 0 30px;text-align:left}
.swat-kicker{font-family:"Inter",sans-serif;font-size:12px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--bronze);font-weight:600;margin-bottom:18px}
.swat-title{font-family:"DM Serif Display","Cormorant Garamond",Georgia,serif;
  font-size:clamp(46px,8.5vw,84px);line-height:1.04;letter-spacing:-.02em;
  color:var(--linen);margin:0 0 16px;font-weight:400}
.swat-deck{font-size:clamp(21px,3vw,26px);color:var(--shell);margin:0 0 26px;
  font-style:italic}
.swat-meta{display:flex;flex-wrap:wrap;gap:10px}
.swat-meta span{font-family:"Inter",sans-serif;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);border:1px solid var(--line);
  border-radius:999px;padding:7px 14px}

/* the living hairline — spectrum in MOTION only; still = bronze */
.swat-line{height:2px;margin:34px 0 0;background:var(--bronze);opacity:.8}
@media (prefers-reduced-motion:no-preference){
  .swat-line{background:var(--spectrum);background-size:300% 100%;
    animation:swatDrift 26s linear infinite}
  @keyframes swatDrift{from{background-position:0% 0}to{background-position:300% 0}}
}

/* ---- sticky progress rail ---------------------------------------------------- */
.swat-rail{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--obsidian) 88%,transparent);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line2)}
.swat-rail-in{max-width:860px;margin:0 auto;padding:0 28px;display:flex;gap:4px;
  overflow-x:auto;scrollbar-width:none}
.swat-rail-in::-webkit-scrollbar{display:none}
.swat-rail a{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);text-decoration:none;
  padding:14px 12px;white-space:nowrap;border-bottom:2px solid transparent;
  transition:color .2s,border-color .2s}
.swat-rail a:hover{color:var(--linen)}
.swat-rail a.on{color:var(--linen);border-bottom-color:var(--bronze)}
.swat-progress{position:absolute;left:0;bottom:-1px;height:1px;width:0;
  background:var(--bronze);transition:width .15s linear}

/* ---- sections + reveal ------------------------------------------------------- */
.swat-doc section{padding:44px 0 6px;scroll-margin-top:64px}
.swat-h2{font-family:"DM Serif Display","Cormorant Garamond",Georgia,serif;
  font-size:clamp(28px,4.5vw,38px);letter-spacing:-.015em;line-height:1.12;
  color:var(--linen);margin:0 0 18px;font-weight:400}
.swat-doc p{margin:0 0 15px;color:var(--shell)}
.swat-doc strong{color:var(--linen);font-weight:700}
.rv{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---- panels ------------------------------------------------------------------ */
.swat-panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:22px 26px;margin:20px 0}
.swat-panel.bronze{border-left:3px solid var(--bronze)}
.swat-panel p:last-child{margin-bottom:0}

/* ---- the bet: phase cards ---------------------------------------------------- */
.swat-phases{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;margin:22px 0}
.swat-phase{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:22px;transition:transform .25s ease,border-color .25s ease}
.swat-phase:hover{transform:translateY(-3px);border-color:var(--bronze)}
@media (prefers-reduced-motion:reduce){.swat-phase:hover{transform:none}}
.swat-phase .ph-days{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--bronze);font-weight:600;margin-bottom:10px}
.swat-phase h3{font-family:"Cormorant Garamond",Georgia,serif;font-size:24px;
  color:var(--linen);margin:0 0 8px;font-weight:700;line-height:1.15}
.swat-phase p{font-size:17px;margin:0;color:var(--shell)}
.swat-phase.verdict{border-color:var(--bronze);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--bronze) 30%,transparent)}

/* ---- two modes --------------------------------------------------------------- */
.swat-modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:14px;margin:20px 0}
.swat-mode{border:1px solid var(--line);border-radius:14px;padding:22px;background:var(--panel)}
.swat-mode .mk{font-family:"Inter",sans-serif;font-size:20px;color:var(--bronze);margin-bottom:8px}
.swat-mode h3{font-family:"Cormorant Garamond",Georgia,serif;font-size:23px;color:var(--linen);
  margin:0 0 6px;font-weight:700}
.swat-mode p{font-size:17px;margin:0}

/* ---- terms table ------------------------------------------------------------- */
.swat-terms{width:100%;border-collapse:collapse;margin:18px 0}
.swat-terms td{padding:14px 16px 14px 0;border-bottom:1px solid var(--line);
  vertical-align:top;color:var(--shell)}
.swat-terms td:first-child{font-family:"Inter",sans-serif;font-size:12px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  white-space:nowrap;padding-top:18px;width:130px}

/* ---- fail list (numbered, geometric circles — cut, never rounded) ------------ */
.swat-fails{counter-reset:f;list-style:none;padding:0;margin:18px 0}
.swat-fails li{counter-increment:f;position:relative;padding:0 0 18px 52px;color:var(--shell)}
.swat-fails li::before{content:counter(f);position:absolute;left:0;top:0;
  width:32px;aspect-ratio:1;clip-path:circle(50%);background:var(--bronze);
  color:var(--obsidian);font-family:"Inter",sans-serif;font-size:15px;font-weight:600;
  display:flex;align-items:center;justify-content:center}

/* ---- timeline (Annex B) ------------------------------------------------------ */
.swat-tl{display:flex;gap:3px;margin:22px 0 8px;height:44px}
.swat-tl span{position:relative;background:var(--panel);border:1px solid var(--line);
  border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);overflow:hidden;
  transition:border-color .2s,color .2s}
.swat-tl span:hover{border-color:var(--bronze);color:var(--linen)}
.swat-tl .t1{flex:3}.swat-tl .t2{flex:7}.swat-tl .t3{flex:4}.swat-tl .t4{flex:11}.swat-tl .t5{flex:5}
.swat-tl-days{display:flex;gap:3px;margin-bottom:20px;font-family:"Inter",sans-serif;
  font-size:10px;color:var(--stone)}
.swat-tl-days span{text-align:center}
.swat-tl-days .t1{flex:3}.swat-tl-days .t2{flex:7}.swat-tl-days .t3{flex:4}.swat-tl-days .t4{flex:11}.swat-tl-days .t5{flex:5}
.swat-cal{list-style:none;padding:0;margin:0 0 10px}
.swat-cal li{padding:10px 0;border-bottom:1px solid var(--line2);color:var(--shell)}
.swat-cal .cd{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--bronze);font-weight:600;margin-right:10px}

/* ---- data tables (X-ray, pricing) -------------------------------------------- */
.swat-table{width:100%;border-collapse:collapse;margin:18px 0;font-size:17px}
.swat-table th{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);font-weight:500;text-align:left;
  padding:0 14px 10px 0;border-bottom:1px solid var(--line)}
.swat-table td{padding:11px 14px 11px 0;border-bottom:1px solid var(--line2);
  color:var(--shell);vertical-align:top}
.swat-table tr.hot td{color:var(--linen)}
.swat-table tr.hot{background:linear-gradient(90deg,color-mix(in srgb,var(--bronze) 10%,transparent),transparent)}
.day14{display:inline-block;font-family:"Inter",sans-serif;font-size:10.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--bronze);
  border:1px solid color-mix(in srgb,var(--bronze) 45%,transparent);
  border-radius:999px;padding:2px 10px}
@media (prefers-reduced-motion:no-preference){
  .day14{animation:day14breathe 3.2s ease-in-out infinite}
  @keyframes day14breathe{0%,100%{opacity:.55}50%{opacity:1}}
}

/* ---- forwardable quote + copy ------------------------------------------------ */
.swat-quote{position:relative;background:var(--panel);border-left:3px solid var(--bronze);
  border-radius:0 14px 14px 0;padding:22px 26px;margin:20px 0}
.swat-quote p{font-size:17.5px}
.swat-copy{font-family:"Inter",sans-serif;font-size:11.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted);background:none;
  border:1px solid var(--line);border-radius:999px;padding:8px 18px;cursor:pointer;
  transition:color .2s,border-color .2s}
.swat-copy:hover{color:var(--linen);border-color:var(--bronze)}
.swat-copy:focus-visible{outline:1px solid var(--bronze);outline-offset:3px}
.swat-copy.done{color:var(--obsidian);background:var(--bronze);border-color:var(--bronze)}

/* ---- torpedo cards ----------------------------------------------------------- */
.swat-torps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:20px 0}
.swat-torp{border:1px solid var(--line);border-radius:14px;padding:20px;background:var(--panel)}
.swat-torp .tno{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.2em;
  color:var(--bronze);font-weight:600;margin-bottom:8px}
.swat-torp h3{font-family:"Cormorant Garamond",Georgia,serif;font-size:21px;
  color:var(--linen);margin:0 0 8px;font-weight:700;line-height:1.2}
.swat-torp p{font-size:16px;margin:0 0 8px}
.swat-torp .tc{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted)}
.swat-torp.parked{opacity:.62;border-style:dashed}

/* ---- open calls (native details) --------------------------------------------- */
.swat-calls{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin:20px 0}
.swat-call{border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.swat-call summary{cursor:pointer;list-style:none;padding:14px 18px;
  font-family:"Inter",sans-serif;font-size:13px;color:var(--linen);
  display:flex;align-items:center;gap:10px}
.swat-call summary::-webkit-details-marker{display:none}
.swat-call summary::before{content:"⟦";color:var(--bronze)}
.swat-call summary::after{content:"⟧";color:var(--bronze)}
.swat-call[open]{border-color:var(--bronze)}
.swat-call .cb{padding:0 18px 14px;font-size:16px;color:var(--shell)}
.swat-call .cw{font-family:"Inter",sans-serif;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--bronze);display:block;margin-bottom:4px}

/* ---- marker chip (inline ⟦…⟧) ------------------------------------------------ */
.mk-open{font-family:"Inter",sans-serif;font-size:13px;color:var(--bronze);
  border:1px solid color-mix(in srgb,var(--bronze) 45%,transparent);
  border-radius:8px;padding:1px 8px;white-space:nowrap}

/* ---- signature + footer ------------------------------------------------------ */
.swat-sign{margin:34px 0 0;font-size:23px;color:var(--linen)}
.swat-foot{margin-top:70px;padding:20px 0 46px;border-top:1px solid var(--line2);
  font-family:"Inter",sans-serif;font-size:12.5px;color:var(--muted);
  display:flex;flex-wrap:wrap;gap:8px 22px;align-items:baseline}
.swat-foot .tris{color:var(--muted)}
.swat-foot .tris .model{font-size:10.5px;opacity:.75}

/* ---- print ------------------------------------------------------------------- */
@media print{
  .swat-rail,.lm-themebtn,.swat-copy,.nav{display:none !important}
  .swat-doc{font-size:12pt}
  .rv{opacity:1 !important;transform:none !important}
}
@media (max-width:560px){
  .swat-doc .wrap{padding:0 20px}
  .swat-hero{padding:56px 0 22px}
  .swat-tl{height:38px}
}
