/* calendar.css - the Red Folder Calendar's own rules, on top of tools.css (which stays unchanged). Gate 3 (TL-11, TL-13,
   Brendon: "it looks very bland with not much information besides dates"): a colour and a drawn icon for each kind of
   release, the This Week strip, the list as cards with the rate and why each release moves the currency, the Eight
   Banks Now, and the article as short visual cards. The tables the build writes (every release, the sources) stay for
   readers without a script. No visible words here (check_landing.py). Merged into tools.css by the lead after
   27 October 2026. */

/* ---- the four kinds of release: one colour each, a darker one on paper, a lighter one on ink and in the dark set.
   Checked 2026-10-20: each as text on its own 13 % tint is 4.5:1 or more on paper, on ink and on the dark page. */
:root{--k-rate:#a5360f;--k-jobs:#11695f;--k-inflation:#7d5200;--k-gdp:#2f4d94}
@media (prefers-color-scheme:dark){:root{--k-rate:#f08a62;--k-jobs:#3cc9b8;--k-inflation:#f2c14e;--k-gdp:#9ab1f0}}
.ink{--k-rate:#f08a62;--k-jobs:#3cc9b8;--k-inflation:#f2c14e;--k-gdp:#9ab1f0}
.k-rate{--k:var(--k-rate)}.k-jobs{--k:var(--k-jobs)}.k-inflation{--k:var(--k-inflation)}.k-gdp{--k:var(--k-gdp)}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ki{display:inline-block;width:16px;height:16px;flex:0 0 auto;vertical-align:-3px}
.kb{display:inline-flex;align-items:center;gap:5px;padding:3px 8px 3px 6px;border-radius:999px;font:600 12.5px/1.25 "Inter",system-ui,sans-serif;
  color:var(--k);background:color-mix(in srgb,var(--k) 13%,transparent);border:1px solid color-mix(in srgb,var(--k) 42%,transparent);white-space:nowrap}
.kb .ki{width:15px;height:15px}
.ccy{display:inline-flex;align-items:center;font:600 12px/1 "Inter",system-ui,sans-serif;padding:4px 6px;border-radius:4px;border:1px solid var(--w-line,var(--line));
  color:var(--w-2,var(--text-2));letter-spacing:.03em;white-space:nowrap}

/* ---- the tables the build writes sit in a wrapper that scrolls sideways on a phone, never the page ---- */
.tw{overflow-x:auto;margin:8px 0 18px;max-width:100%}
.tw table{margin:0;min-width:640px}
.tw .srcs{min-width:560px}
.cal-table{min-width:760px}
.cal-table caption{caption-side:top;text-align:left;font-size:14px;color:var(--w-mute,var(--muted));padding:0 0 8px}
.cal-table td:first-child,.cal-table td:nth-child(4){white-space:nowrap}
.cal-table td:first-child,.cal-table td:nth-child(2){font-variant-numeric:tabular-nums}
.cal-later{margin:4px 0 0;border:0;background:none}
.cal-later summary{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:8px;box-shadow:inset 0 0 0 2px var(--text);font-weight:600;cursor:pointer}
.srcs td:nth-child(2){font-size:14px}
.srcs td:last-child{white-space:nowrap}
.src-notes{font-size:15px;color:var(--text-2);margin:0 0 18px;padding-left:20px}
.src-notes li{margin:4px 0}
.guide #rates-src{margin-top:26px}
.tw .rsrc{min-width:700px}
.rsrc td:nth-child(3){min-width:220px}

/* ---- the desk: the zone and the currency pills, the strip, the list ---- */
.cal-ctl{grid-template-columns:minmax(0,1fr);margin-bottom:16px}
.cal-ctl .f{max-width:340px}
.cal-b [hidden]{display:none !important}
.cur-pills .chips-in{gap:8px}
.cur-pills .chip{position:relative;border-radius:999px;padding:0 14px 0 12px;font-weight:600;font-size:14.5px;letter-spacing:.02em;color:var(--w-mute);border-style:dashed}
.cur-pills .chip input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.cur-pills .chip span::before{content:"";display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;border:2px solid currentColor;vertical-align:1px}
.cur-pills .chip:has(input:checked){background:var(--w-text);border-color:var(--w-text);border-style:solid;color:var(--w-bg)}
.cur-pills .chip:has(input:checked) span::before{background:currentColor}
.cur-pills .chip:has(input:focus-visible){outline:3px solid var(--orange);outline-offset:2px}
.cal-b .cur-pills .chip:has(input:checked){background:var(--text);border-color:var(--text);color:var(--bg)}
.pill-all{display:inline-flex;gap:4px 14px;align-items:center;margin-left:6px}
.pill-all .lnk{font-size:14px}

/* the This Week strip: five weekday tiles (a weekend day joins only when a release falls on it) */
.ws{margin:0 0 22px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--fill)}
.ws-top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;margin-bottom:10px}
.ws-h{font-size:19px;margin:0}
.ws-key{display:flex;flex-wrap:wrap;gap:4px 12px;list-style:none;margin:0;padding:0;font-size:13px;color:var(--text-2)}
.ws-key li{display:inline-flex;align-items:center;gap:5px}
.ws-key .ki{color:var(--k);width:15px;height:15px}
.ws-days{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ws-d{display:grid;grid-template-columns:78px minmax(0,1fr);gap:6px 10px;align-items:start;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--bg);min-width:0}
.ws-d.is-today{border-color:var(--orange);box-shadow:inset 0 3px 0 var(--orange)}
.ws-d.is-past{background:transparent;border-style:dashed}
.ws-dn{margin:0;font-size:13px;color:var(--text-2);display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;padding-top:4px}
.ws-dn b{font:500 15px/1.2 var(--display);color:var(--text)}
.ws-today{font:600 11px/1 "Inter",system-ui,sans-serif;padding:3px 7px;border-radius:999px;background:var(--orange-t);color:var(--bg)}
.ws-cs{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.ws-none{margin:0;padding:6px 0;font-size:13px;color:var(--muted)}
.wc{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"i t" "w w";align-items:center;gap:2px 6px;min-height:44px;min-width:84px;
  padding:6px 9px;border-radius:9px;border:1px solid color-mix(in srgb,var(--k) 45%,transparent);background:color-mix(in srgb,var(--k) 12%,var(--bg));
  color:var(--text);text-decoration:none;font-size:13px;line-height:1.25}
.wc .ki{grid-area:i;color:var(--k);width:17px;height:17px}
.wc-t{grid-area:t;font:600 14px/1.2 "Inter",system-ui,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap}
.wc-w{grid-area:w;color:var(--text-2);white-space:nowrap}
.wc-w b{font-weight:600;color:var(--text)}
.wc:hover{border-color:var(--k)}
.wc:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.wc.is-done{background:transparent;border-style:dashed}
.wc.is-done .wc-t{color:var(--text-2);font-weight:400}
.wc.is-next{border:2px solid var(--orange);box-shadow:0 0 0 3px color-mix(in srgb,var(--orange) 22%,transparent)}
.wc-nx{position:absolute;top:-9px;right:6px;font:600 10.5px/1 "Inter",system-ui,sans-serif;padding:3px 6px;border-radius:999px;background:var(--orange-t);color:var(--bg)}
@media (min-width:720px){
  .ws-days{grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
  .ws-d{grid-template-columns:minmax(0,1fr);padding:10px 8px;align-content:start}
  .ws-dn{padding:0 2px}
  .ws-cs{display:grid;gap:8px}
  .wc{min-width:0}
}

/* the list the script draws: each release a card with its kind's colour on the left */
.cal-age{margin:0 0 14px}
.cal-comp{margin-top:18px}
.cal-b .cw-h{font-size:18px;margin:0 0 10px}
.cal-b .cw-l{display:grid;gap:10px}
.cal-b .ce{position:relative;grid-template-columns:1fr;gap:10px;padding:14px 14px 14px 18px;border:1px solid var(--line);border-radius:12px;background:var(--bg);
  box-shadow:inset 4px 0 0 var(--k);scroll-margin-top:90px;scroll-margin-bottom:24px}
.cal-b .ce:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.cal-b .ce.is-hit{animation:cehit 1.6s ease-out}
@keyframes cehit{0%{background:color-mix(in srgb,var(--orange) 22%,var(--bg))}100%{background:var(--bg)}}
@media (prefers-reduced-motion:reduce){.cal-b .ce.is-hit{animation:none;outline:3px solid var(--orange)}}
.cal-b .ce.is-done{background:transparent}
.cal-b .ce-when{display:flex;gap:10px;align-items:baseline}
.cal-b .ce-t{font:400 24px/1 var(--display)}
.ce-nt{font:400 14px/1.3 "Inter",system-ui,sans-serif !important;color:var(--w-2)}
.ce-tags{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin-bottom:4px}
.ce-tag{font-size:12.5px;color:var(--w-2);border:1px dashed var(--w-2);border-radius:999px;padding:2px 8px}
.ce-inst{font-size:13.5px;color:var(--w-mute)}
.cal-b .ce-ev{color:var(--w-text)}
.ce-ev b{font:500 17px/1.3 var(--display)}
.ce-p{font-size:14px;color:var(--w-mute)}
.ce-rate{display:block;margin-top:4px;font-size:14px;color:var(--w-text);font-variant-numeric:tabular-nums}
.ce-own{margin-top:2px}
.cal-b .ce-own a{text-decoration-color:var(--orange)}
.ce-why{display:block;margin-top:8px;padding:8px 12px;border-radius:8px;font-size:14.5px;color:var(--w-text);background:color-mix(in srgb,var(--k) 10%,var(--bg));box-shadow:inset 3px 0 0 var(--k)}
.ce-act{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ce-why-b{min-height:44px;padding:0 12px;border:1px dashed var(--w-2);border-radius:8px;background:none;color:var(--w-text);font:inherit;font-size:14px;cursor:pointer}
.ce-why-b[aria-expanded=true]{border-style:solid;border-color:var(--k);background:color-mix(in srgb,var(--k) 10%,var(--bg))}
.ce-why-b:hover{border-color:var(--w-text)}
.cal-b .ce-done{align-self:center}
@media (min-width:720px){
  .cal-b .ce{grid-template-columns:118px minmax(0,1fr) auto;align-items:start;gap:6px 16px}
  .cal-b .ce-when{display:grid;gap:6px;padding-top:2px}
  .ce-act{flex-direction:column;align-items:stretch}
}
.cal-b:not(.show-all) .cw.is-later{display:none}
.cal-more{margin-top:16px}

/* the card beside the list: the countdown, the kind, the rate, why it moves */
@media (min-width:1000px){.cal-b .desk-in{grid-column:1;grid-row:1}.cal-b .desk-out{grid-column:2;grid-row:1}}
.cal-b .desk-out .nx-c{min-height:1.1em}
.nx-k{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}
.nx-k:empty{display:none}
.ink .ccy{border-color:var(--band-line);color:var(--band-2)}
.nx-e{margin-top:4px}
.nx-i{display:block;font-size:14px;color:var(--band-2)}
.nx-e b{font:500 19px/1.3 var(--display);color:var(--band-text)}
.nx-r{font-size:14px;color:var(--band-text);padding-top:8px;margin-top:4px;border-top:1px solid var(--band-line)}
.nx-y{margin-top:12px;padding:10px 12px;border-radius:8px;background:rgba(243,236,223,.06);border-left:3px solid var(--orange)}
.nx-y p{margin:0;font-size:14.5px;color:var(--band-text)}
.nx-y .nx-yh{font:600 12.5px/1.3 "Inter",system-ui,sans-serif;color:var(--band-2);margin-bottom:4px;letter-spacing:.02em}
.cal-b .desk-out .btn[disabled]{opacity:.45;cursor:not-allowed}
/* on a phone the card comes first: keep it short (the rule is in the hero and under What Counts as Red Folder) */
@media (max-width:999px){.cal-b .desk-out .out-rule{display:none}.cal-b .desk-out .nx-y{margin-bottom:14px}}
.cal-sub{margin:10px 0 0}
a.lnk{display:inline-flex;align-items:center;min-height:44px;color:inherit;font-size:15px;text-decoration:underline;text-decoration-color:var(--orange);text-decoration-thickness:2px;text-underline-offset:3px}
a.lnk:focus-visible{outline:3px solid var(--orange);outline-offset:2px}

/* a schedule more than 60 days old: the list gives way to the message and the table of official pages */
.cal-b[data-state="stale"]{grid-template-columns:minmax(0,1fr)}
.cal-b[data-state="stale"] .cal-ctl,.cal-b[data-state="stale"] .desk-out,.cal-b[data-state="stale"] .cal-comp{display:none}

/* ---- The Eight Banks Now: the rate big, the last change small, the next decision ---- */
.banks-now{background:var(--fill);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.banks-now .sub{margin:-12px 0 22px;color:var(--text-2)}
.bk-grid{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:720px){.bk-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}}
.bk{display:grid;gap:4px;align-content:start;padding:14px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg);box-shadow:inset 0 4px 0 var(--k);min-width:0}
@media (min-width:720px){.bk{padding:16px}}
.bk p{margin:0}
.bk-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:2px}
.bk-h b{font:500 15.5px/1.25 var(--display)}
.bk-r{font:400 26px/1.1 var(--display);letter-spacing:-.01em;font-variant-numeric:tabular-nums;margin-top:8px !important;white-space:nowrap}
.bk-r small{font:400 .55em/1 "Inter",system-ui,sans-serif;color:var(--text-2);margin-left:3px}
.bk-to{font:400 .5em/1 "Inter",system-ui,sans-serif;color:var(--text-2);margin:0 4px;vertical-align:.25em}
@media (min-width:720px){.bk-r{font-size:40px}.bk-to{margin:0 7px}}
.bk-na{color:var(--muted);white-space:normal}
.bk-msg{font-size:13.5px;color:var(--text-2);line-height:1.4;margin-top:6px !important}
.banks-now .zn{font-weight:600;color:var(--text)}
.bk-n{font-size:13.5px;color:var(--text-2);line-height:1.35}
.bk-c{display:flex;align-items:flex-start;gap:6px;font-size:14px;line-height:1.35;margin-top:6px !important}
.bk-c .ki{margin-top:1px}
.bk-c.is-up .ki{color:var(--tl)}
.bk-c.is-down .ki{color:var(--orange-t)}
.bk-old{font-size:13px;color:var(--orange-t);border:1px dashed var(--orange-t);border-radius:8px;padding:6px 8px;margin-top:6px !important}
.bk.is-old .bk-r,.bk.is-old .bk-c{color:var(--text-2)}
.bk-x{font-size:13.5px;color:var(--text-2);margin-top:8px !important;padding-top:8px;border-top:1px dashed var(--line)}
.bk-x span{display:block;color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}
.bk-s{font-size:12.5px;color:var(--muted)}
.bk-s a{color:var(--text-2)}

/* ---- What Counts as Red Folder: the rule as two numbers, the banks as small cards, the five economies ---- */
.rule2{display:grid;gap:10px;margin:16px 0 22px}
@media (min-width:560px){.rule2{grid-template-columns:1fr 1fr}}
.r2{display:flex;gap:14px;align-items:center;padding:14px 16px;border-radius:12px;background:var(--band);color:var(--band-2);font-size:15px;line-height:1.4}
.r2-n{font:400 54px/1 var(--display);color:var(--band-text);min-width:.8em;text-align:center}
.r2 b{display:block;font:500 18px/1.25 var(--display);color:var(--band-text);margin-bottom:2px}
.r2.k-rate{box-shadow:inset 4px 0 0 #f08a62}
.r2-b{box-shadow:inset 4px 0 0 #3cc9b8}
.guide .mini{font-size:15px;color:var(--text-2);margin:-4px 0 10px}
.guide .bt{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.guide .bt li{display:grid;gap:3px;align-content:start;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--fill);margin:0;box-shadow:inset 0 3px 0 var(--k-rate)}
.bt .ccy{justify-self:start}
.bt-n{font:500 15px/1.25 var(--display)}
.bt-t{font-size:14px;color:var(--text-2)}
.bt-t b{font:400 20px/1.1 var(--display);color:var(--text);font-variant-numeric:tabular-nums;margin-right:4px}
.bt-s{font-size:12.5px;color:var(--muted);line-height:1.35}
.bt-s a{color:var(--text-2)}
.kinds-w .kinds{min-width:0}
.kinds th,.kinds td{vertical-align:top}
.kinds thead th{white-space:nowrap}
/* the header row is the site's ink band: the badges take the colours made for ink */
.kinds thead{--k-rate:#f08a62;--k-jobs:#3cc9b8;--k-inflation:#f2c14e;--k-gdp:#9ab1f0}
.kinds tbody th,.guide .kinds tbody th{white-space:nowrap;font-weight:600;background:var(--fill);color:var(--text);border-bottom:1px solid var(--line);font-size:15px}
.kinds tbody th .ccy{margin-right:4px}
.kinds td b{display:block;font:500 15px/1.3 var(--display)}
.kinds td small{display:block;font-size:13px;color:var(--muted);margin-top:2px}
.kinds td .kb{display:none}
.kinds .kd-none span{font-size:14px;color:var(--muted)}
@media (max-width:719px){
  .kinds-w{overflow:visible}
  .kinds thead{position:absolute;left:-9999px}
  .kinds,.kinds tbody,.kinds tr,.kinds th,.kinds td{display:block;width:auto}
  .kinds tr{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:0 0 10px;background:var(--fill)}
  .kinds tbody th,.guide .kinds tbody th{padding:0 0 6px;border:0;background:none;color:var(--text);font-family:var(--display);font-size:17px;font-weight:500}
  .kinds td,.kinds tbody tr:nth-child(even) td{padding:6px 0;border:0;border-top:1px solid var(--line);background:none}
  .kinds td .kb{display:inline-flex;margin-bottom:4px}
  .kinds td.kd-none{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
}

/* ---- the chips that switch a pane (common.js switcher): the kind, the moment, the week ---- */
.why,.rel,.dstx{margin:14px 0 10px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--fill)}
.why-k{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.why-k button{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--bg);color:var(--text);font:inherit;font-size:15px;cursor:pointer}
.why-k button .ki{color:var(--k)}
.why-k button:hover{border-color:var(--k,var(--text-2))}
.why-k button[aria-pressed=true]{background:var(--k,var(--text));border-color:var(--k,var(--text));color:var(--bg);font-weight:600}
.why-k button[aria-pressed=true] .ki{color:inherit}
.why-k button:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.why [data-pane][hidden],.rel [data-pane][hidden],.dstx [data-pane][hidden]{display:none}
/* the three steps of a kind: in a row on a wide screen, one under the other on a phone */
.why-p .flow{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;margin:6px 0 12px}
.why-p .fl-a{justify-self:center;line-height:1;transform:rotate(90deg)}
@media (min-width:560px){.why-p .flow{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;gap:8px}.why-p .fl-a{align-self:center;transform:none}}
.why-p .fl{background:var(--bg);min-width:0}
.why-p .fl-end{background:color-mix(in srgb,var(--k) 14%,var(--bg));border-color:var(--k)}
.why-p p{margin:0;font-size:15.5px}

/* What Happens Around a Release: the sketch lights the moment picked */
.rel{display:grid;gap:12px}
.rel-fig{margin:0}
.rel-svg{display:block;width:100%;height:auto;max-width:640px;font:600 15px "Inter",system-ui,sans-serif}
.rel-fig figcaption{font-size:13px;color:var(--muted);margin-top:4px}
.rel-svg .z{fill:var(--text);opacity:.035}
.rel-svg .zl{fill:var(--muted)}
.rel:has([data-key=b][aria-pressed=true]) .z-b,.rel:has([data-key=m][aria-pressed=true]) .z-m,.rel:has([data-key=a][aria-pressed=true]) .z-a{fill:var(--orange);opacity:.13}
.rel:has([data-key=b][aria-pressed=true]) .zl-b,.rel:has([data-key=m][aria-pressed=true]) .zl-m,.rel:has([data-key=a][aria-pressed=true]) .zl-a{fill:var(--text)}
.rel-svg .c-up line{stroke:var(--tl);stroke-width:1.5}.rel-svg .c-up rect{fill:var(--tl)}
.rel-svg .c-dn line{stroke:var(--orange);stroke-width:1.5}.rel-svg .c-dn rect{fill:var(--orange)}
.rel-svg .rl{stroke:var(--text-2);stroke-width:1.5;stroke-dasharray:4 4}
.rel-svg .stopl{stroke:var(--orange-t);stroke-width:2;stroke-dasharray:7 4}
.rel-svg .tag-s{fill:var(--orange-t)}
.rel-svg .gapl{stroke:var(--muted);stroke-width:1.2;stroke-dasharray:3 3}
.rel-svg .gapb{fill:none;stroke:var(--text-2);stroke-width:1.5}
.rel-svg .tag-g,.rel-svg .tag-f,.rel-svg .tag-sp{fill:var(--text-2);font-weight:400;font-size:14px}
.rel-svg .fill{fill:var(--orange-t);stroke:var(--fill);stroke-width:2}
.rel-svg .spr-a{fill:color-mix(in srgb,var(--orange) 50%,transparent)}
.rel-svg .tag-r{fill:var(--text-2)}
/* on a phone the sketch is drawn at about 60 %: its words grow so they still read at 12 px or more */
@media (max-width:559px){.rel-svg{font-size:20px}.rel-svg .tag-g,.rel-svg .tag-f,.rel-svg .tag-sp{font-size:19px}}
.guide .rel-l{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.guide .rel-l li{margin:0;padding:9px 12px;border-radius:8px;background:var(--bg);font-size:15px;box-shadow:inset 3px 0 0 var(--orange)}
.rel-side .why-k{margin-bottom:10px}

/* What Traders Do About It: one card per plan */
.guide .plans{list-style:none;padding:0;margin:14px 0;display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.guide .plans li{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:12px;row-gap:2px;align-content:start;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--fill);margin:0}
.pi{grid-row:1/3;width:40px;height:40px;padding:9px;border-radius:10px;background:var(--tl-2);color:var(--tl)}
.plans b{font:500 16px/1.25 var(--display)}
.plans span{font-size:14.5px;color:var(--text-2);line-height:1.45}

/* Daylight Saving: the five clock changes on a line, then one release on two clocks */
.guide .dst-tl{list-style:none;padding:0;margin:16px 0 12px;display:grid}
.guide .dst-tl li{position:relative;margin:0 0 0 7px;padding:0 0 16px 22px;border-left:2px solid var(--line)}
.dst-tl li:last-child{padding-bottom:4px}
.dst-tl li::before{content:"";position:absolute;left:-8px;top:3px;width:14px;height:14px;border-radius:50%;background:var(--bg);border:3px solid var(--tl)}
.dst-tl time{display:block;font:500 17px/1.25 var(--display)}
.dst-tl b{font-weight:400;font-size:15px;color:var(--text-2)}
@media (min-width:720px){
  .guide .dst-tl{grid-template-columns:repeat(5,minmax(0,1fr))}
  .guide .dst-tl li{margin:0;padding:22px 10px 0 0;border-left:0;border-top:2px solid var(--line)}
  .dst-tl li::before{left:0;top:-8px}
}
.clk2{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px;margin:4px 0 10px;max-width:420px}
.clk{display:grid;gap:2px;padding:10px 14px;border-radius:10px;background:var(--bg);border:1px solid var(--line);min-width:0}
.clk small{font-size:13px;color:var(--muted)}
.clk b{font:400 34px/1.05 var(--display);font-variant-numeric:tabular-nums}
.clk-hi{border-color:var(--orange);box-shadow:inset 0 3px 0 var(--orange)}
.clk-eq{font:400 28px/1 var(--display);color:var(--muted)}
.dstx-p p{margin:0;font-size:15.5px}

/* ---- the links to the three date pages (TL-16): the hero line, each FOMC, jobs and CPI row, the Fed's card, the
   Five Economies table, and the guide card that closes the sources ---- */
.dp-hero{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:16px 0 0;font-size:14.5px;color:var(--band-2)}
.dp-hero a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--band-line);
  background:var(--band-card);color:var(--band-text);text-decoration:none;font-weight:600}
.dp-hero a::after{content:"\2192";margin-left:8px;color:var(--orange)}
.dp-hero a:hover{border-color:var(--orange)}
.dp-hero a:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.cal-table .dp-l{white-space:nowrap;font-size:14px}
.cal-b .ce-own .ce-dp{font-weight:600;color:var(--w-text);text-decoration-color:var(--orange)}
.bk-dp{font-size:13.5px}
.bk-dp a.lnk{min-height:36px;font-size:13.5px;font-weight:600}
.kinds td .kd-dp{display:inline-block;margin-top:6px;font-size:13.5px;font-weight:600}
.more.more-one{grid-template-columns:minmax(0,1fr)}

/* Why a Time Can Be Missing: a Bank of Japan row */
.miss{margin:14px 0 10px}
.miss-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--bg);box-shadow:inset 4px 0 0 var(--k-rate)}
.miss-row b{font:500 16px/1.3 var(--display)}
.miss-row .ce-d{font-weight:600}
.miss-t{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border:1px dashed var(--text-2);border-radius:999px;font-size:14px;color:var(--text-2)}
.miss figcaption{font-size:13px;color:var(--muted);margin-top:6px}