.v3 .st { display: grid; gap: var(--s-7); }
.v3 .st-mast { display: grid; gap: var(--s-3); padding-block-end: var(--s-6); border-block-end: 3px solid var(--warm-ember); max-width: 60rem; }
.v3 .st-mast-k { display: flex; align-items: center; gap: var(--s-2); color: var(--warm-amber-text); font-weight: var(--w-strong); font-size: var(--t-small); }
.v3 .st-dnn { display: inline-block; padding: 1px 6px; background: var(--warm-ember); color: var(--warm-ink); font: var(--w-head) 13px/1.3 var(--head); letter-spacing: .04em; border-radius: var(--step-s); }
.v3 .st-h1 { font: var(--w-head) var(--t-h1)/1.05 var(--head); letter-spacing: -0.045em; color: var(--fg); text-wrap: balance; }
.v3 .st-lead { font-size: var(--t-stat); line-height: var(--lh-read); color: var(--fgl); max-width: 44rem; text-wrap: pretty; }
.v3 .st-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-7); align-items: start; }
.v3 .st-main, .v3 .st-side { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-7); min-width: 0; }
.v3 .st-side { gap: var(--s-5); }
.v3 .st-sec { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-4); }
.v3 .st-sec-h { font: var(--w-head) var(--t-h3)/1.15 var(--head); color: var(--fg); display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); padding-block-end: var(--s-2); border-block-end: 1px solid var(--ln2); }
.v3 .st-list { display: grid; gap: var(--s-4); }
.v3 .st-card, .v3 .fd-card, .v3 .st-box { position: relative; display: grid; gap: var(--s-3); padding: var(--s-5); background: var(--sf); border: 1px solid var(--ln); border-radius: var(--r-sheet); box-shadow: var(--el-2); min-width: 0; overflow-wrap: break-word; align-content: start; }
.v3 .st-card:target, .v3 .st-card:focus { outline: 2px solid var(--warm-amber-text); outline-offset: 3px; }
.v3 .st-card[data-label="lore"] { background: linear-gradient(160deg, rgb(122 59 74 / .28), var(--sf) 55%); border-style: dashed; border-color: var(--ln2); }
.v3 .st-card--lead { padding: var(--s-6); border-color: rgb(233 119 79 / .55); background: linear-gradient(170deg, rgb(233 119 79 / .14), var(--sf) 45%); }
.v3 .st-kick { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-1) var(--s-2); color: var(--mu); font-size: var(--t-small); }
.v3 .st-lbl { display: inline-block; padding: 1px 7px; border-radius: var(--step-s); font-weight: var(--w-strong); font-size: 12px; line-height: 1.5; background: var(--warm-amber); color: var(--warm-ink); }
.v3 .st-lbl[data-l="lore"] { background: transparent; color: var(--fg); border: 1px dashed var(--fgl); }
.v3 .st-kind { color: var(--warm-amber-text); font-weight: var(--w-strong); }
.v3 .st-h { font: var(--w-head) var(--t-h3)/1.12 var(--head); letter-spacing: -0.02em; text-wrap: balance; }
.v3 .st-card--lead .st-h { font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.75rem); line-height: 1.04; letter-spacing: -0.03em; }
.v3 .st-h a { color: var(--fg); text-decoration: none; } .v3 .st-h a:hover { text-decoration: underline; text-decoration-color: var(--warm-ember); text-underline-offset: 4px; }
.v3 .st-b { color: var(--fgl); line-height: var(--lh-read); max-width: 46rem; text-wrap: pretty; }
.v3 .st-card--lead .st-b { font-size: var(--t-stat); }
.v3 .st-who, .v3 .st-rec, .v3 .st-mu, .v3 .st-ai { color: var(--mu); font-size: var(--t-small); }
.v3 .st-who > span, .v3 .st-rec > span { color: var(--fgl); font-weight: var(--w-strong); }
.v3 .st-rec a { color: var(--mu); }
.v3 .st-ai { font-style: italic; }
.v3 .st-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); }
.v3 .st-dm { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--t-small); color: var(--fgl); font-weight: var(--w-strong); }
.v3 .st-dm-bar { position: relative; display: block; inline-size: 96px; block-size: 6px; border-radius: 3px; background: var(--ln2); overflow: hidden; }
.v3 .st-dm-bar > span { display: block; block-size: 100%; background: linear-gradient(90deg, var(--warm-amber), var(--warm-ember)); }
.v3 .st-why summary { cursor: pointer; color: var(--mu); font-size: var(--t-small); min-block-size: 24px; }
.v3 .st-why-l { display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: var(--s-1) var(--s-4); margin-block: var(--s-2); font-size: var(--t-small); }
.v3 .st-why-l div { display: flex; justify-content: space-between; gap: var(--s-2); border-block-end: 1px dotted var(--ln2); }
.v3 .st-why-l dt { color: var(--mu); }
.v3 .st-reply { padding: var(--s-3) var(--s-4); border-inline-start: 3px solid var(--warm-amber); background: var(--sf2); border-radius: 0 var(--r-screen) var(--r-screen) 0; }
.v3 .st-reply-h { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); font-size: var(--t-small); color: var(--fgl); }
.v3 .st-reply blockquote { margin: var(--s-2) 0 0; color: var(--fg); font-size: var(--t-stat); line-height: var(--lh-read); }
.v3 .st-rx { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.v3 .st-rx-b { display: inline-flex; align-items: center; gap: var(--s-2); min-block-size: 36px; padding: 0 var(--s-3); border-radius: var(--r-pill); border: 1px solid var(--ln2); background: var(--sf2); color: var(--fgl); font: inherit; font-size: var(--t-small); cursor: pointer; }
.v3 .st-rx-b:hover { border-color: var(--warm-amber); }
.v3 .st-rx-b[aria-pressed="true"] { background: var(--warm-amber); color: var(--warm-ink); border-color: var(--warm-amber); }
.v3 .st-how { display: grid; gap: var(--s-2); padding-inline-start: 1.2em; color: var(--fgl); font-size: var(--t-small); line-height: var(--lh-read); }
.v3 .st-box h2 { font: var(--w-head) var(--t-stat)/1.2 var(--head); display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); }
.v3 .st-box--feud { border-color: rgb(233 119 79 / .5); }
.v3 .st-box--feud .fd-card { padding: 0; background: none; border: 0; box-shadow: none; }
.v3 .st-box ul { display: grid; gap: var(--s-2); margin: 0; padding-inline-start: 1.1em; color: var(--fgl); font-size: var(--t-small); }
.v3 .st-face { inline-size: var(--f, 48px); block-size: var(--f, 48px); border-radius: 12px; object-fit: cover; background: var(--sf2); flex: none; }
.v3 .st-face--px { display: inline-grid; place-items: center; overflow: hidden; }
.v3 .st-face--px svg { inline-size: 80%; block-size: auto; }
.v3 .fd-faces { display: flex; align-items: center; gap: var(--s-2); }
.v3 .fd-faces--big .st-face { --f: 96px; border-radius: 20px; }
.v3 .fd-x { font: var(--w-head) var(--t-h2)/1 var(--head); color: var(--warm-ember); padding-inline: var(--s-2); }
.v3 .fd-st { color: var(--warm-amber-text); font-weight: var(--w-strong); }
.v3 .fd-bar { block-size: 10px; border-radius: 5px; background: var(--control); overflow: hidden; }
.v3 .fd-bar > span { display: block; block-size: 100%; background: var(--warm-ember); }
.v3 .fd-cheers { display: flex; justify-content: space-between; max-inline-size: none; gap: var(--s-3); font-size: var(--t-small); color: var(--fgl); }
.v3 .st-tn .st-dm-bar { inline-size: 140px; }
.v3 .fd-arc { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-inline-start: 2px solid var(--ln2); }
.v3 .fd-arc li { position: relative; padding: 0 0 var(--s-4) var(--s-5); color: var(--fgl); }
.v3 .fd-arc li::before { content: ""; position: absolute; inset-inline-start: -7px; inset-block-start: 4px; inline-size: 12px; block-size: 12px; border-radius: 3px; background: var(--sf3); border: 2px solid var(--ln2); }
.v3 .fd-arc li[data-done="1"]::before { background: var(--warm-ember); border-color: var(--warm-ember); }
.v3 .fd-arc-h { display: flex; flex-wrap: wrap; gap: var(--s-2); color: var(--fg); }
.v3 .fd-arc-h time, .v3 .fd-round h3 time, .v3 .fd-post-h time { color: var(--mu); font-size: var(--t-small); font-weight: 400; }
.v3 .fd-round { display: grid; gap: var(--s-3); padding: var(--s-4) var(--s-5); background: var(--sf); border: 1px solid var(--ln); border-radius: var(--r-sheet); }
.v3 .fd-round h3 { font: var(--w-head) var(--t-stat)/1.2 var(--head); display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: baseline; }
.v3 .fd-posts { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); }
.v3 .fd-post { display: flex; gap: var(--s-3); align-items: flex-start; }
.v3 .fd-post > div { padding: var(--s-3) var(--s-4); background: var(--sf2); border-radius: 4px var(--r-sheet) var(--r-sheet) var(--r-sheet); color: var(--fgl); min-width: 0; }
.v3 .fd-post[data-side="b"] { flex-direction: row-reverse; }
.v3 .fd-post[data-side="b"] > div { border-radius: var(--r-sheet) 4px var(--r-sheet) var(--r-sheet); background: var(--sf3); }
.v3 .fd-post-h { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); font-size: var(--t-small); margin-block-end: var(--s-1); }
.v3 .fd-post-h b { color: var(--fg); }
.v3 .fd-rv { color: var(--warm-amber-text); font-weight: var(--w-strong); font-size: var(--t-small); }
.v3 .fd-sides { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.v3 .fd-side { display: grid; justify-items: center; gap: var(--s-2); padding: var(--s-4); background: var(--sf); border: 1px solid var(--ln); border-radius: var(--r-sheet); text-align: center; }
.v3 .fd-side .st-face { --f: 64px; }
.v3 .fd-side-n { font: var(--w-head) var(--t-stat)/1.2 var(--head); }
.v3 .fd-cn { color: var(--fgl); }
.v3 .fd-side .btn { min-block-size: 44px; white-space: normal; max-inline-size: 100%; }
.v3 .fd-peace[data-called="1"] { border-color: var(--warm-amber); }
.v3 .fd-tw { overflow-x: auto; }
.v3 .fd-board { inline-size: 100%; border-collapse: collapse; font-size: var(--t-small); }
.v3 .fd-board th, .v3 .fd-board td { padding: var(--s-2) var(--s-3); border-block-end: 1px solid var(--ln); text-align: start; }
.v3 .fd-board thead th { color: var(--mu); font-weight: var(--w-strong); }
.v3 .fd-board td, .v3 .fd-board thead th + th { text-align: end; } .v3 .fd-board td { color: var(--fgl); }
@media (min-width: 48em) { .v3 .st-list:not(.fd-list) { grid-template-columns: repeat(2, minmax(0, 1fr)); } .v3 .st-list .st-card[data-label="fact"]:only-child { grid-column: 1 / -1; } }
@media (min-width: 64em) {
  .v3 .st-grid { grid-template-columns: minmax(0, 1fr) 21rem; }
  .v3 .fd-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.v3 .st-card .st-kick .st-dot { display: none; } .v3 .st-card .st-kick time { flex-basis: 100%; }
.v3 .st-dm[data-tier="mid"] .st-dm-bar > span { background: var(--warm-amber); }
.v3 .st-dm[data-tier="lo"] .st-dm-bar > span { background: var(--mu); }
.v3 .st-dm-n { font-variant-numeric: tabular-nums; }
.v3 .st-rx-note { margin-block-end: calc(-1 * var(--s-4)); }
.v3 .fd-score { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: var(--s-2) var(--s-4); max-inline-size: 40rem; padding: var(--s-4) var(--s-5); background: var(--sf); border: 1px solid var(--ln); border-radius: var(--r-sheet); }
.v3 .fd-score-s { display: flex; align-items: baseline; gap: var(--s-3); font: var(--w-head) var(--t-stat)/1.1 var(--head); min-width: 0; }
.v3 .fd-score-s[data-side="b"] { justify-content: flex-end; }
.v3 .fd-score-s .num { font-size: clamp(2rem, 1.5rem + 2vw, 3rem); color: var(--warm-amber-text); }
.v3 .fd-score-m { color: var(--mu); font-size: var(--t-small); text-align: center; }
.v3 .fd-score-bar, .v3 .fd-score-go { grid-column: 1 / -1; display: grid; gap: var(--s-2); }
.v3 .fd-score-go .btn { justify-self: start; }
.v3 .fd-arc li[data-done="0"] { color: var(--mu); }
.v3 .fd-arc li[data-now] { color: var(--fg); }
.v3 .fd-arc li[data-now]::before { inline-size: 16px; block-size: 16px; inset-inline-start: -9px; inset-block-start: 2px; border-radius: 50%; background: var(--warm-amber); border-color: var(--warm-amber); box-shadow: 0 0 0 4px rgb(255 182 92 / .25); }
.v3 .chip--now { background: var(--warm-amber); color: var(--warm-ink); border: 0; }
.v3 .fd-side .btn[data-hit] { box-shadow: inset 0 0 0 2px var(--warm-amber); }
.v3 .fd-cn[data-hit] { color: var(--warm-amber-text); }
