/* Wind Watch — committed light "paper" theme.
   The whole colour language is one warm ramp plus black: inside the favourable
   zone a day is graded pale straw -> gold -> amber -> ember as it approaches the
   ideal bearing, and anything outside the zone is flat near-black. Those ramp
   colours are applied inline from JS (the value is per-day), so this sheet only
   holds structure and the neutrals. Nothing else may be saturated. */
:root{
  --paper:#f4f1ea;
  --card:#fffdf9;
  --ink:#1b1f26;
  --ink-2:#5b6472;
  --ink-3:#8b95a3;
  --line:#e2ddd2;

  --prime:#e0a010;
  --prime-soft:#fdf0d0;
  --good:#2f78c8;
  --good-soft:#e0ecfa;
  --out:#242a33;
  --out-soft:#e6e6e6;
  --nodata:#d8d4ca;

  --sky-a:#dbe7f2;
  --sky-b:#f4f1ea;
  --shadow:0 1px 2px rgba(27,31,38,.05), 0 6px 20px rgba(27,31,38,.06);
  --radius:14px;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:
    linear-gradient(180deg,var(--sky-a) 0,var(--sky-b) 340px),
    var(--paper);
  color:var(--ink);
  font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  padding-bottom:64px;
}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
h1,h2,h3{margin:0;letter-spacing:-.015em;font-weight:650}
a{color:var(--good)}

/* ---------------------------------------------------------------- header */
.top{padding:22px 0 6px}
.top-in{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap}
.brand{display:flex;gap:14px;align-items:center}
.brand-mark{width:38px;height:38px;color:var(--ink);flex:0 0 auto}
h1{font-size:23px}
.addr{margin:2px 0 0;font-size:13.5px;color:var(--ink-2)}
.top-right{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.freshness{font-size:12px;color:var(--ink-2);text-align:right;line-height:1.35}
.freshness b{color:var(--ink);font-weight:600}
.freshness.stale{color:#b3341f}
.freshness.stale b{color:#b3341f}

.btn{
  font:inherit;font-size:13px;font-weight:550;cursor:pointer;
  border:1px solid var(--line);background:var(--card);color:var(--ink);
  padding:8px 14px;border-radius:9px;transition:.15s;
}
.btn:hover{border-color:var(--ink-3);transform:translateY(-1px)}
.btn.ghost{background:rgba(255,255,255,.6)}
.btn.tiny{padding:5px 10px;font-size:12px;border-radius:7px}
.btn.tiny.act{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn.nav{width:36px;padding:6px 0;text-align:center;font-size:15px}

/* --------------------------------------------------------------- drawer */
.drawer{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:14px 0 4px}
.drawer-in{display:grid;grid-template-columns:1.5fr 1fr;gap:34px;padding:22px 20px}
.dcol h3{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);margin-bottom:10px}
.hint{font-size:12.5px;color:var(--ink-2);margin:8px 0}
.hint.center{text-align:center}
.zrow{margin:14px 0}
.zrow>label{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;margin-bottom:6px}
.zinputs{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-2);flex-wrap:wrap}
.zinputs input{width:74px;font:inherit;font-size:14px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink)}
.zinputs em{font-style:normal;font-size:12.5px;color:var(--ink-3);margin-left:4px}
.arrowto{color:var(--ink-3)}
.zinputs .sep{color:var(--ink-3);font-size:12px}
.tag{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;padding:2px 7px;border-radius:20px;font-weight:700}
.tag.prime{background:var(--prime-soft);color:#8a5f00}
.tag.good{background:var(--good-soft);color:#194d85}
.tag.out{background:var(--out-soft);color:var(--out)}
.presets{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}
.ctl{display:block;margin:0 0 14px}
.ctl span{display:block;font-size:12.5px;font-weight:600;margin-bottom:5px}
.ctl select{width:100%;font:inherit;font-size:13.5px;padding:8px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink)}
.srcHealth{font-size:12px;color:var(--ink-2);border-top:1px dashed var(--line);padding-top:10px}
.srcHealth div{display:flex;justify-content:space-between;gap:10px;padding:2px 0}
.srcHealth .ok{color:#1d7a3d;font-weight:600}
.srcHealth .bad{color:#b3341f;font-weight:600}

/* ----------------------------------------------------------------- cards */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;margin:18px 0}
.sechead{font-size:17px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.sechead small{font-size:12.5px;font-weight:400;color:var(--ink-2)}

/* -------------------------------------------------------------- NOW card */
.now{display:grid;grid-template-columns:minmax(260px,400px) 1fr;gap:30px;align-items:center;margin-top:16px}
.now-graphic svg{width:100%;height:auto;display:block}
.verdict{display:inline-flex;align-items:center;gap:9px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.09em;padding:6px 13px;border-radius:30px;background:var(--out-soft);color:var(--out)}
.verdict .dot{width:9px;height:9px;border-radius:50%;background:currentColor}
.verdict.prime{background:var(--prime-soft);color:#8a5f00}
.verdict.good{background:var(--good-soft);color:#194d85}
.bigdir{margin:12px 0 2px;display:flex;align-items:baseline;gap:12px}
.bigdir span{font-size:64px;line-height:.95;font-weight:680;letter-spacing:-.04em}
.bigdir small{font-size:18px;color:var(--ink-2);font-family:var(--mono)}
.nowsub{margin:4px 0 16px;color:var(--ink-2);font-size:14px}
.nowgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:12px;border-top:1px solid var(--line);padding-top:16px}
.nowgrid div{min-width:0}
.nowgrid b{display:block;font-size:19px;font-weight:650;letter-spacing:-.02em}
.nowgrid span{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.agree{font-size:12px;color:var(--ink-2);margin:14px 0 0}
.agree.warn{color:#b3341f}

/* ---------------------------------------------------------- headline pct */
.headline{padding:22px 24px}
.hl-main{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.hl-num{font-size:70px;font-weight:700;letter-spacing:-.05em;line-height:1;display:flex;align-items:baseline}
.hl-num i{font-size:28px;font-style:normal;color:var(--ink-3);margin-left:3px}
.hl-txt{display:flex;flex-direction:column}
.hl-txt strong{font-size:17px;font-weight:600}
.hl-txt span{font-size:13px;color:var(--ink-2)}
.hl-bar{display:flex;height:22px;border-radius:6px;overflow:hidden;margin:18px 0 12px;background:var(--nodata)}
.hl-bar i{display:block;height:100%;font-style:normal;position:relative}
.hl-bar i.p{background:var(--prime)}
.hl-bar i.g{background:var(--good)}
.hl-bar i.o{background:var(--out)}
.gradkey{margin:16px 0 14px}
.gradbar{height:12px;border-radius:6px;border:1px solid var(--line)}
.gradlabels{position:relative;height:16px;margin-top:5px;font-size:10.5px;color:var(--ink-2);font-family:var(--mono)}
.gradlabels span:first-child{position:absolute;left:0}
.gradlabels span:last-of-type{position:absolute;right:0}
.gradlabels .gi{position:absolute;transform:translateX(-50%);font-weight:700;color:#8f3b02;white-space:nowrap}
.gradlabels .gi::before{content:"";position:absolute;left:50%;top:-8px;width:1px;height:6px;background:#8f3b02}
#zoneRecap{margin-top:12px}
.hl-switch{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.hl-note{font-size:12px;color:var(--ink-3);margin-left:auto}

/* ------------------------------------------------------------ three boxes */
.boxes{margin:26px 0}
.boxrow{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.box{margin:0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;text-align:center}
.box figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:6px}
.box .bt{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;text-align:left}
.box .bc{font-size:30px;font-weight:700;letter-spacing:-.03em;line-height:1}
.box.prime{border-top:3px solid rgb(214,92,6)}  .box.prime .bt,.box.prime .bc{color:#8f3b02}
.box.good{border-top:3px solid rgb(240,184,30)} .box.good .bt,.box.good .bc{color:#8a5f00}
.box.out{border-top:3px solid var(--out)}       .box.out .bt,.box.out .bc{color:var(--out)}
.fan{width:100%;height:auto;display:block}
.bl{font-size:12px;color:var(--ink-2);margin:4px 0 0;min-height:2.6em}

/* -------------------------------------------------------------- calendar */
.calhead{display:flex;align-items:center;justify-content:center;gap:16px}
.calhead h2{font-size:19px;min-width:190px;text-align:center}
.calsum{text-align:center;font-size:13px;color:var(--ink-2);margin:8px 0 18px}
.calsum b{color:var(--ink)}
.dow{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);text-align:center;margin-bottom:7px}
.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.cell{aspect-ratio:1/1.12;border:1px solid var(--line);border-radius:10px;background:#fff;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:.14s;overflow:hidden;padding:4px}
.cell.pad{border:none;background:transparent;cursor:default}
.cell.nodata{background:repeating-linear-gradient(45deg,#faf9f6,#faf9f6 5px,#f1efe9 5px,#f1efe9 10px);cursor:default}
.cell:not(.pad):not(.nodata):hover{transform:translateY(-2px);box-shadow:0 5px 14px rgba(27,31,38,.13);border-color:var(--ink-3);z-index:2}
.cell .dnum{position:absolute;top:4px;left:6px;font-size:10.5px;color:var(--ink-2);font-family:var(--mono);z-index:2;text-shadow:0 0 3px #fffdf9,0 0 3px #fffdf9}
.cell .vflag{position:absolute;top:3px;right:6px;font-size:13px;font-weight:800;color:var(--ink-2);line-height:1;z-index:2;text-shadow:0 0 3px #fffdf9,0 0 3px #fffdf9}
.cell.today{box-shadow:0 0 0 2px var(--ink) inset}
.cell.today .dnum{color:var(--ink);font-weight:700}
.cell svg{width:82%;height:auto;max-width:118px}
.cell .dlab{font-size:10.5px;font-weight:700;letter-spacing:.02em;margin-top:-2px;font-family:var(--mono)}
.cell .dpct{position:absolute;bottom:0;left:0;right:0;height:4px;display:flex}
.cell .dpct i{display:block;height:100%}
/* t-prime / t-good cells are tinted inline from their own gradient value, so no
   flat background here — it would fight the per-day colour. */
.cell.t-out{background:#f7f6f3}
.cell.t-out .dlab{color:var(--ink-2)}
.legend{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin-top:18px;font-size:12px;color:var(--ink-2)}
.legend span{display:flex;align-items:center;gap:6px}
.sw{width:12px;height:12px;border-radius:3px;display:inline-block}
.sw.swgrad{width:34px;background:linear-gradient(90deg,rgb(247,233,176),rgb(240,184,30),rgb(214,92,6))}
.sw.prime{background:var(--prime)} .sw.good{background:var(--good)}
.sw.out{background:var(--out)} .sw.nodata{background:var(--nodata)}

/* ---------------------------------------------------------------- trends */
.trendrow{display:grid;grid-template-columns:1fr 1.2fr;gap:34px}
.trendcol h3{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);margin-bottom:10px}
.trendcol h3.mt{margin-top:24px}
#roseSvg{width:100%;max-width:320px;height:auto;margin:0 auto;display:block}
.mbars{display:flex;flex-direction:column;gap:9px}
.mbar{display:grid;grid-template-columns:64px 1fr 48px;align-items:center;gap:10px;font-size:12px}
.mbar .mb{display:flex;height:16px;border-radius:4px;overflow:hidden;background:var(--nodata)}
.mbar .mb i{display:block;height:100%}
.mbar .mn{color:var(--ink-2)}
.mbar .mv{text-align:right;font-family:var(--mono);font-size:12px}
.hbars{display:grid;grid-template-columns:repeat(24,1fr);gap:2px;align-items:end;height:76px}
.hb{background:var(--good-soft);border-radius:2px 2px 0 0;position:relative;min-height:2px}
.hb.hi{background:var(--prime)}
.hbars+.hint{margin-top:6px}

/* --------------------------------------------------------------- sources */
.srcrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:6px}
.srccard{border:1px solid var(--line);border-radius:10px;padding:13px 14px;background:#fff}
.srccard h4{margin:0 0 4px;font-size:13.5px}
.srccard p{margin:0;font-size:12px;color:var(--ink-2)}
.srccard .kind{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);font-weight:700}
.srccard .stat{margin-top:8px;font-size:11.5px;font-family:var(--mono);color:var(--ink-3)}

/* ----------------------------------------------------------------- modal */
.modal{position:fixed;inset:0;background:rgba(20,24,30,.5);backdrop-filter:blur(3px);display:flex;align-items:flex-start;justify-content:center;padding:28px 16px;overflow:auto;z-index:50}
/* A bare [hidden] rule loses to the .modal/.drawer display above (same
   specificity, and this sheet loads after the UA one), which left the modal
   permanently open over the whole page. Keep these guards next to any
   component that both sets `display` and toggles the `hidden` attribute. */
.modal[hidden],.drawer[hidden]{display:none!important}
.sheet{background:var(--card);border-radius:16px;max-width:760px;width:100%;padding:26px;position:relative;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.sheet h2{font-size:21px;padding-right:40px}
.sheet h3{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);margin:24px 0 10px}
.x{position:absolute;top:14px;right:16px;background:none;border:none;font-size:26px;line-height:1;color:var(--ink-3);cursor:pointer;padding:4px 8px;border-radius:8px}
.x:hover{background:var(--out-soft);color:var(--ink)}
.dtop{display:grid;grid-template-columns:210px 1fr;gap:24px;align-items:center;margin-top:14px}
.dhouse svg{width:100%;height:auto;display:block}
.dstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(94px,1fr));gap:14px}
.dstats div b{display:block;font-size:20px;font-weight:650;letter-spacing:-.02em}
.dstats div span{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.tl{display:grid;grid-template-columns:repeat(24,1fr);gap:3px}
.tlcell{border-radius:5px;padding:5px 1px 4px;text-align:center;background:var(--out-soft)}
.tlcell.calm{opacity:.45}
.tlcell svg{width:100%;height:auto;max-width:22px}
.tlaxis{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;font-size:9px;color:var(--ink-3);text-align:center;font-family:var(--mono);margin-top:4px}
.dsrc{display:grid;gap:8px}
.dsrcrow{display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:center;font-size:12.5px;border:1px solid var(--line);border-radius:9px;padding:9px 12px;background:#fff}
.dsrcrow .nm{font-weight:600}
.dsrcrow .vv{font-family:var(--mono);color:var(--ink-2)}
.foot{font-size:11.5px;color:var(--ink-3);text-align:center;margin-top:30px}

/* ------------------------------------------------------------ responsive */
@media (max-width:900px){
  .now{grid-template-columns:1fr}
  .now-graphic{max-width:340px;margin:0 auto}
  .trendrow,.drawer-in{grid-template-columns:1fr;gap:24px}
  .dtop{grid-template-columns:1fr}
  .dhouse{max-width:220px;margin:0 auto}
}
@media (max-width:620px){
  .bigdir span{font-size:48px}
  .hl-num{font-size:52px}
  .card{padding:18px}
  .tl,.tlaxis{grid-template-columns:repeat(12,1fr)}
  .cell .dlab{display:none}
  .hbars{grid-template-columns:repeat(12,1fr)}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}

/* -------------------------------------------------------------- lightning */
.storms h3.stormh{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);margin:26px 0 10px}
.stormtop{display:grid;grid-template-columns:1fr 300px;gap:30px;align-items:center}
.stormnum{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.stormmap svg{width:100%;height:auto;display:block}
.curvewrap{overflow-x:auto}
#stormCurve{width:100%;min-width:620px;height:auto;display:block}
.outlook{display:grid;grid-template-columns:repeat(auto-fit,minmax(58px,1fr));gap:5px}
.ocell{border:1px solid var(--line);border-radius:8px;padding:7px 3px;text-align:center;background:#fff}
.ocell b{display:block;font-size:14px;font-weight:650;font-family:var(--mono)}
.ocell span{font-size:9.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}
.ocell .od{font-size:10px;color:var(--ink-2);font-family:var(--mono)}
.caveat{margin-top:22px;border-top:1px solid var(--line);padding-top:14px}
.caveat summary{font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer}
.caveat p{font-size:12.5px;color:var(--ink-2);margin:10px 0 0;max-width:76ch}
.cell .bolt{position:absolute;bottom:6px;right:5px;font-size:11px;line-height:1;z-index:2;
  text-shadow:0 0 3px #fffdf9,0 0 3px #fffdf9}
@media (max-width:900px){ .stormtop{grid-template-columns:1fr} .stormmap{max-width:300px;margin:0 auto} }

/* ------------------------------------------------------ today's lightning */
.bolt-today{padding:20px 24px;border-left:4px solid #4a6fa5}
.bt-main{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.bt-icon{font-size:34px;line-height:1}
.bt-num{font-size:60px;font-weight:700;letter-spacing:-.05em;line-height:1;display:flex;align-items:baseline;color:#2c4a72}
.bt-num i{font-size:24px;font-style:normal;color:#8b95a3;margin-left:2px}
.bt-txt{display:flex;flex-direction:column}
.bt-txt strong{font-size:17px;font-weight:600}
.bt-txt span{font-size:13px;color:var(--ink-2)}
.bt-bar{height:10px;border-radius:5px;background:#e7ebf1;overflow:hidden;margin:16px 0 14px}
.bt-bar i{display:block;height:100%;background:#4a6fa5;border-radius:5px;transition:width .3s}
.bt-week{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.bt-day{border:1px solid var(--line);border-radius:8px;padding:7px 2px;text-align:center;background:#fff}
.bt-day .d{font-size:10px;color:var(--ink-3);font-family:var(--mono)}
.bt-day .v{display:block;font-size:14px;font-weight:650;font-family:var(--mono);color:#2c4a72}
.bt-day.now{box-shadow:0 0 0 2px #2c4a72 inset}
@media (max-width:620px){ .bt-num{font-size:46px} .bt-week{grid-template-columns:repeat(4,1fr)} }

/* --------------------------------------------------------------- setup screen */
.setup{padding-top:26px}
.setup-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:34px;max-width:680px;margin:0 auto}
.setup-card h2{font-size:23px;margin-bottom:10px}
.setup-lead{font-size:14px;color:var(--ink-2);margin:0 0 22px;max-width:56ch}
.setup-form{display:flex;gap:9px;flex-wrap:wrap}
.setup-form input{flex:1 1 320px;font:inherit;font-size:15px;padding:11px 13px;
  border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink)}
.setup-form input:focus{outline:2px solid #4a6fa5;outline-offset:1px;border-color:#4a6fa5}
.btn.primary{background:var(--ink);color:#fff;border-color:var(--ink);padding:11px 20px;font-size:14px}
.btn.primary:hover{background:#000}
.btn.primary[disabled]{opacity:.5;cursor:default;transform:none}
.setup-msg{font-size:13px;color:var(--ink-2);margin:12px 0 0;min-height:1.2em}
.setup-msg.err{color:#b3341f}
.cands{display:grid;gap:8px;margin-top:14px}
.cand{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;
  text-align:left;font:inherit;cursor:pointer;background:#fff;border:1px solid var(--line);
  border-radius:10px;padding:11px 14px;transition:.14s}
.cand:hover{border-color:#4a6fa5;transform:translateY(-1px)}
.cand b{display:block;font-size:14px;font-weight:600}
.cand span{font-size:12px;color:var(--ink-3)}
.cand .go{color:#4a6fa5;font-weight:700;font-size:18px;flex:0 0 auto}
.setup-prog{margin-top:22px}
.sp-bar{height:10px;border-radius:5px;background:#e7ebf1;overflow:hidden}
.sp-bar i{display:block;height:100%;background:#4a6fa5;border-radius:5px;transition:width .5s}
.sp-step{font-size:14px;font-weight:600;margin:12px 0 2px}
.setup-foot{margin-top:24px;border-top:1px solid var(--line);padding-top:14px}

/* ------------------------------------------------------------ strike map */
.strikewrap{display:grid;grid-template-columns:460px 1fr;gap:30px;align-items:start}
.strikemap svg{width:100%;height:auto;display:block}
.strikestats{padding-top:6px}
.stnum{font-size:52px;font-weight:700;letter-spacing:-.04em;line-height:1;display:flex;align-items:baseline;color:#5a3fa8}
.stnum i{font-size:16px;font-style:normal;color:var(--ink-3);margin-left:8px;letter-spacing:0}
.stlead{font-size:13.5px;color:var(--ink-2);margin:10px 0 18px}
.rings{display:grid;gap:6px;margin-bottom:18px}
.ring{display:grid;grid-template-columns:74px 1fr 62px;align-items:center;gap:10px;font-size:12px}
.ring .rl{color:var(--ink-2);font-family:var(--mono)}
.ring .rb{height:14px;border-radius:4px;background:var(--nodata);overflow:hidden}
.ring .rb i{display:block;height:100%;background:#7a5fd0}
.ring .rv{text-align:right;font-family:var(--mono);font-size:11.5px;color:var(--ink-2)}
.strikeprog{margin-top:18px}
.strikeprog .sp-bar i{background:#7a5fd0}
@media (max-width:900px){ .strikewrap{grid-template-columns:1fr} .strikemap{max-width:460px;margin:0 auto} }
.setup-tip{font-size:12.5px;color:var(--ink-3);border-left:3px solid var(--line);padding-left:12px}
.setup-tip code{font-family:var(--mono);font-size:12px;background:#f1efe9;padding:1px 5px;border-radius:4px}