/* ============ WORKSPACE ============
   The Workspace page. It shares the Desk's tokens and base styles (styles.css)
   and adds only its own layout: a top bar, a module list on the left, and a
   grid of panels for the open module. Everything is prefixed ws- so nothing
   here can reach the Desk. */
body.ws-page{padding:0; display:block; min-height:100vh; background:var(--bg);}
.ws-top{position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:10px 16px; background:var(--panel); border-bottom:1px solid var(--border);}
.ws-logo{color:var(--gold); font-weight:800; letter-spacing:.03em; text-decoration:none; font-size:14px; white-space:nowrap;}
.ws-px{font-size:20px; font-weight:800; font-variant-numeric:tabular-nums;}
.ws-chg{font-size:13px; font-variant-numeric:tabular-nums;}
.ws-chg.up{color:var(--green);} .ws-chg.down{color:var(--red);}
.ws-bias{font-size:13px; font-weight:700; white-space:nowrap;}
.ws-bias.bias-bull{color:var(--green);} .ws-bias.bias-bear{color:var(--red);} .ws-bias.bias-neut{color:var(--gold);}
.ws-sync{display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--muted); white-space:nowrap;}
.ws-sync i{width:7px; height:7px; border-radius:50%; background:var(--muted); display:block;}
.ws-sync.live i{background:var(--green);} .ws-sync.stale i{background:var(--red);}
.ws-spacer{flex:1;}
.ws-btn{display:inline-flex; align-items:center; gap:6px; border:1px solid var(--border); background:var(--panel2);
  color:var(--text); border-radius:8px; padding:5px 11px; font:inherit; font-size:13px; font-weight:600;
  text-decoration:none; cursor:pointer; white-space:nowrap;}
.ws-btn:hover{border-color:#3d4859;}
.ws-btn:focus-visible,.ws-nav a:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}

.ws-body{display:grid; grid-template-columns:210px minmax(0,1fr); min-height:calc(100vh - 52px);}
.ws-nav{background:#0f141b; border-right:1px solid var(--border); padding:14px 10px; display:flex; flex-direction:column; gap:2px;}
.ws-nav .g{font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#5c6675; margin:12px 8px 4px;}
.ws-nav .g:first-child{margin-top:0;}
.ws-nav a{display:flex; justify-content:space-between; align-items:center; gap:8px; padding:7px 9px; border-radius:7px;
  color:var(--muted); text-decoration:none; font-size:13.5px;}
.ws-nav a:hover{color:var(--text); background:var(--panel);}
.ws-nav a[aria-current="page"]{background:var(--panel2); color:var(--text); box-shadow:inset 2px 0 0 var(--gold);}
.ws-nav .soon{display:flex; justify-content:space-between; padding:6px 9px; font-size:13px; color:#4d5664; cursor:default;}
.ws-nav .soon em{font-style:normal; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:#4d5664;}

.ws-main{padding:18px 20px 40px; display:flex; flex-direction:column; gap:14px; min-width:0;}
.ws-head{display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap;}
.ws-head h1{margin:0; font-size:22px; font-weight:800;}
.ws-head p{margin:4px 0 0; color:var(--muted); font-size:13.5px; max-width:720px;}
.ws-asof{font-size:12px; color:var(--muted); white-space:nowrap;}
.ws-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px;}
.ws-card{background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:14px 16px;
  display:flex; flex-direction:column; gap:10px; min-width:0;}
.ws-card.wide{grid-column:1 / -1;}
.ws-card h2{margin:0; font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--muted);
  display:flex; justify-content:space-between; gap:10px;}
.ws-card h2 span{font-weight:500; letter-spacing:.02em; text-transform:none;}
.ws-note{font-size:12.5px; color:var(--muted); line-height:1.5;}
.ws-big{font-size:30px; font-weight:800; font-variant-numeric:tabular-nums; line-height:1;}
.ws-row{display:flex; justify-content:space-between; align-items:baseline; gap:12px; font-size:13.5px;
  padding:6px 0; border-bottom:1px solid var(--border); font-variant-numeric:tabular-nums;}
.ws-row:last-child{border-bottom:0;}
.ws-row .k{color:var(--muted);}
.ws-row .c.up{color:var(--green);} .ws-row .c.down{color:var(--red);}
.ws-row.stale .v{color:var(--muted);}
.ws-pill{display:inline-block; font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  padding:3px 8px; border-radius:20px; border:1px solid var(--border); color:var(--muted);}
.ws-pill.calm{color:var(--green); border-color:rgba(63,185,80,.45);}
.ws-pill.normal{color:var(--gold); border-color:rgba(240,185,11,.45);}
.ws-pill.stressed{color:var(--red); border-color:rgba(248,81,73,.45);}
.ws-pill.stale{color:var(--muted);}

/* Fed odds: one stacked bar per 3-month window */
.ws-odds{display:grid; grid-template-columns:118px minmax(0,1fr) 150px; gap:12px; align-items:center; font-size:13px;
  font-variant-numeric:tabular-nums;}
.ws-odds .lbl{color:var(--muted);}
.ws-bar{display:flex; height:16px; border-radius:4px; overflow:hidden; background:#222a36;}
.ws-bar i{display:block; height:100%;}
.ws-bar .cut{background:#2c6e3f;} .ws-bar .hold{background:#3a4150;} .ws-bar .hike{background:#8e3b36;}
.ws-key{display:flex; gap:14px; font-size:12px;}
.ws-key .cut{color:var(--green);} .ws-key .hold{color:var(--muted);} .ws-key .hike{color:var(--red);}
.ws-delta{font-size:12px; color:var(--muted);}

/* the range scale: a line, the options band, the ATR band, and spot */
.ws-scale{position:relative; height:46px; margin:6px 6px 0;}
.ws-scale .axis{position:absolute; left:0; right:0; top:22px; height:2px; background:#2a3140;}
.ws-scale .band{position:absolute; top:16px; height:14px; border-radius:4px;}
.ws-scale .band.opt{background:rgba(240,185,11,.22); border:1px solid rgba(240,185,11,.55);}
.ws-scale .band.atr{top:19px; height:8px; background:rgba(88,166,255,.25); border:1px solid rgba(88,166,255,.5);}
.ws-scale .spot{position:absolute; top:10px; width:2px; height:26px; background:var(--text);}
.ws-scale .t{position:absolute; top:34px; font-size:11px; color:var(--muted); transform:translateX(-50%); white-space:nowrap;
  font-variant-numeric:tabular-nums;}

.ws-cot{height:8px; border-radius:4px; background:#222a36; overflow:hidden;}
.ws-cot i{display:block; height:100%; background:var(--gold);}

/* free and guest: the module's shape with example numbers, never real data */
.ws-preview{position:relative;}
.ws-preview .ws-grid{filter:saturate(.6); opacity:.55; pointer-events:none;}
.ws-lock{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  background:#1b180c; border:1px solid rgba(240,185,11,.55); border-radius:12px; padding:12px 16px; font-size:14px;}
.ws-lock b{color:var(--gold);}
.ws-lock a{color:#111; background:var(--gold); border-radius:8px; padding:6px 12px; font-weight:700; text-decoration:none;}
.ws-empty{color:var(--muted); font-size:13.5px; padding:6px 0;}

@media (max-width:860px){
  .ws-body{grid-template-columns:1fr;}
  .ws-nav{flex-direction:row; overflow-x:auto; border-right:0; border-bottom:1px solid var(--border); padding:8px 10px; gap:4px;}
  .ws-nav .g,.ws-nav .soon{display:none;}
  .ws-nav a{flex:0 0 auto;}
  .ws-grid{grid-template-columns:1fr;}
  .ws-odds{grid-template-columns:92px minmax(0,1fr); }
  .ws-odds .num{grid-column:1 / -1; margin-top:-6px;}
}

/* alerts form */
.ws-check{display:flex; align-items:center; gap:8px; font-size:13.5px; cursor:pointer;}
.ws-check input{accent-color:var(--gold); width:15px; height:15px;}
.ws-checks{display:flex; gap:16px; flex-wrap:wrap;}
.ws-times{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--muted);}
.ws-times input,.ws-levels-add input{background:var(--panel2); border:1px solid var(--border); color:var(--text); border-radius:7px;
  padding:5px 8px; font:inherit; font-size:13.5px; color-scheme:dark;}
.ws-save{display:flex; align-items:center; gap:14px; flex-wrap:wrap;}
.ws-btn.gold{border-color:var(--gold); color:var(--gold);}
.ws-levels{display:flex; flex-direction:column;}
.ws-level{display:flex; justify-content:space-between; align-items:center; padding:6px 0; border-bottom:1px solid var(--border);
  font-variant-numeric:tabular-nums;}
.ws-level:last-child{border-bottom:0;}
.ws-levels-add{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.ws-check input:focus-visible,.ws-times input:focus-visible,.ws-levels-add input:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}

/* FOMC statement redline */
.pr-row{display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.ws-pill.hawkish{color:var(--red); border-color:rgba(248,81,73,.45);}
.ws-pill.dovish{color:var(--green); border-color:rgba(63,185,80,.45);}
.ws-pill.wording,.ws-pill.unchanged{color:var(--muted);}
.ws-redline{display:grid; grid-template-columns:78px minmax(0,1fr); gap:12px; align-items:start; padding:9px 0; border-bottom:1px solid var(--border);}
.ws-redline:last-of-type{border-bottom:0;}
.ws-redline p{margin:0; font-size:14px; line-height:1.6;}
.ws-redline del{color:#ffa198; background:rgba(248,81,73,.14); text-decoration:line-through;}
.ws-redline ins{color:#9be9a8; background:rgba(63,185,80,.14); text-decoration:none;}
.ws-tag{font-size:10.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; text-align:center; padding:4px 6px; border-radius:5px;
  border:1px solid var(--border); color:var(--muted);}
.ws-tag.hawkish{color:#ffa198; border-color:rgba(248,81,73,.5);}
.ws-tag.dovish{color:#9be9a8; border-color:rgba(63,185,80,.5);}
.ws-card a{color:var(--gold);}

/* Data & events */
.ws-spark{width:100%; max-width:420px; height:auto;}
.ws-spark polyline{stroke:var(--gold); stroke-width:2; vector-effect:non-scaling-stroke;}
.ws-spark .zero{stroke:#3a4150; stroke-dasharray:4 4;}
.ws-spark circle{fill:var(--gold);}
.ws-ev{display:flex; flex-direction:column; gap:3px; padding:9px 0; border-bottom:1px solid var(--border);}
.ws-ev:last-child{border-bottom:0;}
.ws-ev-top{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;}
.ws-drivers{margin-top:4px;}

/* Drivers & regime */
.ws-lead{font-size:18px; font-weight:700; line-height:1.4;}
.ws-corr{display:grid; grid-template-columns:120px minmax(0,1fr) 56px; gap:4px 12px; align-items:center; padding:8px 0; border-bottom:1px solid var(--border);
  font-size:13.5px; font-variant-numeric:tabular-nums;}
.ws-corr:last-of-type{border-bottom:0;}
.ws-corr .lbl{color:var(--text);}
.ws-corr .num{text-align:right; font-weight:700;}
.ws-corr .usual{grid-column:1 / -1; font-size:12px;}
.ws-corr-bar{position:relative; height:12px; background:#222a36; border-radius:4px;}
.ws-corr-bar::before{content:""; position:absolute; left:50%; top:-3px; bottom:-3px; width:1px; background:#4a5363;}
.ws-corr-bar i{position:absolute; top:0; bottom:0; border-radius:4px;}
.ws-corr-bar i.neg{background:#8e3b36;} .ws-corr-bar i.pos{background:#2c6e3f;}
.ws-corr-axis{display:flex; justify-content:space-between; font-size:11px; color:var(--muted); margin:2px 68px 0 132px;}
@media (max-width:860px){ .ws-corr{grid-template-columns:96px minmax(0,1fr) 48px;} .ws-corr-axis{margin:2px 60px 0 108px;} }

/* ---------- track record: each timeframe's 95% range against a coin flip ---------- */
.ws-track{display:flex; flex-direction:column; margin-top:6px;}
.ws-tr{display:grid; grid-template-columns:minmax(120px,1fr) minmax(120px,1.6fr) minmax(150px,auto) auto; gap:18px; align-items:center;
  padding:12px 0; border-bottom:1px solid var(--border);}
.ws-tr:last-child{border-bottom:0;}
.ws-tr .tf b{display:block; font-size:15px;}
.ws-tr small{display:block; color:var(--muted); font-size:12px; font-weight:400; margin-top:2px;}
.ws-tr .v{text-align:right; font-size:17px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap;}
.ws-tr .c{text-align:right;} .ws-tr .ws-pill{white-space:nowrap;}
.ws-ci{display:block; width:100%; height:14px; overflow:visible;}
.ws-ci .axis{stroke:var(--border);}
.ws-ci .mid{stroke:var(--muted); stroke-dasharray:2 2;}
.ws-ci .bar{fill:rgba(240,185,11,.3);}
.ws-ci .est{stroke:var(--gold); stroke-width:2;}
.ws-pill.good{color:var(--green); border-color:rgba(63,185,80,.45);}
.ws-pill.bad{color:var(--red); border-color:rgba(248,81,73,.45);}
.ws-pill.unclear{color:var(--muted);}
@media (max-width:860px){
  .ws-tr{grid-template-columns:minmax(0,1fr) auto; row-gap:8px;}
  .ws-tr .ws-ci{grid-column:1 / -1; order:3;}
  .ws-tr .c{grid-column:1 / -1; order:4; text-align:left;}
}

/* ---------- cross-asset: gold's move split three ways; gold in six currencies ---------- */
.ws-split{display:grid; grid-template-columns:150px minmax(0,1fr) 72px; gap:12px; align-items:center; padding:6px 0;}
.ws-split .lbl{font-size:13px; color:var(--muted);}
.ws-split .num{text-align:right; font-weight:700; font-variant-numeric:tabular-nums;}
.ws-split .num.up{color:var(--green);} .ws-split .num.down{color:var(--red);}
.ws-split-bar{position:relative; height:12px;
  background:linear-gradient(90deg, transparent calc(50% - .5px), var(--border) calc(50% - .5px), var(--border) calc(50% + .5px), transparent calc(50% + .5px));}
.ws-split-bar i{position:absolute; top:1px; bottom:1px; border-radius:3px;}
.ws-split-bar i.usd{background:var(--muted); opacity:.6;}
.ws-split-bar i.own{background:var(--gold);}
.ws-split-bar i.dlr{background:#58a6ff;}
.ws-fx{display:flex; flex-direction:column; margin-top:4px;}
.ws-fx-row{display:grid; grid-template-columns:minmax(0,1.5fr) repeat(3, minmax(64px,1fr)); gap:10px; padding:7px 0; border-bottom:1px solid var(--border); font-size:13.5px; align-items:baseline;}
.ws-fx-row:last-child{border-bottom:0;}
.ws-fx-row.head{font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);}
.ws-fx-row.head span:not(:first-child), .ws-fx-row.read span:not(:first-child){text-align:right;}
.ws-fx-row.read{color:var(--muted); font-size:12.5px;}
.ws-fx-row b{display:inline-block; min-width:40px; margin-right:6px;}
.ws-fx-row .num{text-align:right; font-weight:600; font-variant-numeric:tabular-nums;}
.ws-fx-row .num.up{color:var(--green);} .ws-fx-row .num.down{color:var(--red);}
@media (max-width:860px){
  .ws-split{grid-template-columns:112px minmax(0,1fr) 64px;}
  .ws-fx-row{grid-template-columns:minmax(0,1fr) repeat(3, 58px); font-size:12.5px;}
}
@media (max-width:520px){ .ws-fx-row .nm{display:none;} }   /* the codes carry it on a phone */

/* ---------- patterns: every figure with its sample size; thin ones faded ---------- */
.ws-pt{display:flex; flex-direction:column; margin-top:4px;}
.ws-pt-row{display:grid; grid-template-columns:minmax(0,1.7fr) repeat(5, minmax(58px,1fr)); gap:10px; padding:7px 0; border-bottom:1px solid var(--border);
  font-size:13.5px; align-items:baseline;}
.ws-pt-row:last-child{border-bottom:0;}
.ws-pt-row.head{font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);}
.ws-pt-row.head span:not(:first-child){text-align:right;}
.ws-pt-row .num{text-align:right; font-variant-numeric:tabular-nums;}
.ws-pt-row small{display:block; color:var(--muted); font-size:11.5px; margin-top:1px;}
.ws-pt-row.thin span{opacity:.45;}
.ws-hours-wrap{overflow-x:auto; margin-top:6px;}
.ws-hours{display:block; width:100%; min-width:640px; height:auto;}
.ws-hours .b{fill:var(--gold);}
.ws-hours .b.thin{fill:none; stroke:var(--gold); stroke-width:1; opacity:.55;}
.ws-hours text{fill:var(--muted); font-size:10px; text-anchor:middle; font-variant-numeric:tabular-nums;}
.ws-hours .n{font-size:9px; opacity:.75;}
@media (max-width:860px){ .ws-pt-row{grid-template-columns:minmax(0,1.3fr) repeat(5, minmax(44px,1fr)); font-size:12.5px; gap:6px;} }
@media (max-width:520px){   /* a phone gets the four that matter: range goes, the header tightens */
  .ws-pt-row{grid-template-columns:minmax(0,1.2fr) repeat(4, minmax(40px,1fr));}
  .ws-pt-row > span:nth-child(6){display:none;}
  .ws-pt-row.head{font-size:10px; letter-spacing:.03em;}
}

/* ---------- export & API ---------- */
.ws-api-new{display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px;}
.ws-api-new input{flex:1; min-width:180px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:7px 10px; font:inherit;}
.ws-api-new input:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}
.ws-fresh{margin-top:12px; padding:12px; border:1px solid var(--gold); border-radius:10px; background:rgba(240,185,11,.08); display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center; font-size:13.5px;}
.ws-fresh code{flex:1 1 100%; background:var(--bg); border:1px solid var(--border); border-radius:6px; padding:8px 10px; word-break:break-all; user-select:all;}
.ws-card code, .ws-fresh code{font:12.5px ui-monospace, SFMono-Regular, Menlo, monospace; word-break:break-all;}
.ws-code{margin:8px 0 0; padding:10px 12px; background:var(--bg); border:1px solid var(--border); border-radius:8px;
  font:12.5px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; white-space:pre-wrap; word-break:break-all; color:var(--text);}
.ws-dl{display:flex; flex-wrap:wrap; gap:8px; margin-top:6px;}

/* ---------- layouts: a pinned module beside the current one ---------- */
.ws-pane{min-width:0;}
.ws-pane-body{display:flex; flex-direction:column; gap:14px; min-width:0;}
.ws-main.split{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px; align-items:start;}
.ws-main.split .ws-pane + .ws-pane{border-left:1px solid var(--border); padding-left:20px;}
.ws-main.split .ws-grid{grid-template-columns:minmax(0,1fr);}
.ws-pane-tag{display:inline-block; margin-bottom:8px; font-size:10.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--gold);
  border:1px solid rgba(240,185,11,.45); border-radius:6px; padding:2px 7px;}
.ws-nav a[data-pinned]::after{content:"pinned"; font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--gold);}
.ws-pin-btn[aria-pressed="true"]{color:var(--gold); border-color:rgba(240,185,11,.55);}
.ws-lay-row{display:flex; align-items:stretch; gap:6px; margin-bottom:6px;}
.ws-lay-go{flex:1; min-width:0; text-align:left; background:var(--panel2); border:1px solid var(--border); border-radius:8px; padding:7px 10px; color:var(--text); font:inherit; cursor:pointer;}
.ws-lay-go small{display:block; color:var(--muted); font-size:12px; margin-top:2px;}
.ws-lay-go:hover{border-color:var(--gold);}
.ws-lay-del{background:none; border:1px solid var(--border); border-radius:8px; color:var(--muted); width:30px; cursor:pointer; font-size:16px;}
.ws-lay-del:hover{color:var(--text);}
.ws-lay-form{display:flex; gap:6px; margin-top:8px;}
.ws-lay-form input{flex:1; min-width:0; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:6px 9px; font:inherit; font-size:13px;}
.ws-lay-go:focus-visible, .ws-lay-del:focus-visible, .ws-lay-form input:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}
@media (max-width:1179px){ .ws-pin-btn, .ws-lay-wrap{display:none !important;} }   /* two panes need the width */

/* ---------- Fed speakers (Rates & Fed): when, then who and what ---------- */
.ws-talks{display:flex; flex-direction:column;}
.ws-talk{display:grid; grid-template-columns:96px minmax(0,1fr); gap:12px; padding:8px 0; border-bottom:1px solid var(--border); font-size:13.5px;}
.ws-talk:last-child{border-bottom:0;}
.ws-talk b{display:block; font-weight:700;}
.ws-talk .when b{font-variant-numeric:tabular-nums;}
.ws-talk small{display:block; margin-top:1px; color:var(--muted); font-size:12px;}
.ws-talk p{margin:3px 0 0; color:var(--muted); font-size:12.5px; line-height:1.45;}
.ws-talk p a{color:var(--accent);}
.ws-talk .tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:5px;}

/* ---------- CSV on the tables: top right of the card, real numbers only ---------- */
.ws-card.has-csv{position:relative;}
.ws-card.has-csv > h2{padding-right:52px;}
.ws-csv{position:absolute; top:9px; right:12px; display:inline-flex; align-items:center; padding:2px 7px; border:1px solid var(--border); border-radius:6px;
  background:var(--panel2); color:var(--muted); font:inherit; font-size:10.5px; font-weight:700; letter-spacing:.06em; cursor:pointer;}
.ws-csv:hover{color:var(--text); border-color:#3d4859;}
.ws-csv:focus-visible{outline:2px solid var(--gold); outline-offset:2px;}
.ws-csv[hidden], .ws-pin-btn[hidden]{display:none !important;}

/* ---------- all modules as one list (#modules): where the phone's Workspace tab lands ---------- */
.ws-mods{display:flex; flex-direction:column; background:var(--panel); border:1px solid var(--border); border-radius:12px; overflow:hidden;}
.ws-mods h2{margin:0; padding:11px 16px 9px; font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--muted);}
.ws-mod{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:11px 16px; border-top:1px solid var(--border);
  color:var(--text); text-decoration:none;}
.ws-mod b{display:block; font-size:14.5px;}
.ws-mod small{display:block; margin-top:2px; color:var(--muted); font-size:12.5px; line-height:1.4;}
.ws-mod i{font-style:normal; color:var(--muted);}
.ws-mod:hover{background:var(--panel2);}
.ws-mod:hover i{color:var(--gold);}
.ws-mod:focus-visible{outline:2px solid var(--gold); outline-offset:-2px;}

/* ---------- phones: the tab bar (styles.css) holds the foot, so the top bar needn't stick ---------- */
@media (max-width:700px){
  .ws-top{position:static;}
  body.ws-page.has-tabbar{padding-bottom:calc(60px + env(safe-area-inset-bottom));}
  .ws-csv{top:6px; right:8px; padding:5px 9px;}
  .ws-card.has-csv > h2{padding-right:58px;}
}