/* Fable's nightly draw panel (fable-draw.js; owner's pick "C · Results board", plus a countdown and tickets, 30 Sep).
   Tonight's strip (the countdown, your tickets with their ⓘ, the tickets in the draw, the pot so far) over last night's
   results board (winners of qualifiers, the top winners' faces, the top win, your result, the proof line). Dark only;
   the site's chocolate chrome tokens only (fable.css): cream text on --brand-sheen-sm for pills, --brand-outline for
   outlines and thin marks, mono small caps for labels, --up for a win. Sizes are layout px (the page renders at html
   zoom .75 on desktop), matched to the account menu it sits in (fable-account.css). */
.fdw{display:grid;gap:8px;margin:0 4px 10px;color:var(--ink);font:500 12px/1.35 var(--sans);text-align:left}
.fdw [hidden]{display:none!important}
.fdw-lbl,.fdw-k{font:600 10px/1.2 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.fdw-logo{display:inline-block;width:1.25em;height:1.25em;margin:0 .28em 0 .05em;vertical-align:-.28em;object-fit:contain;-webkit-text-fill-color:initial}
.fdw-fable{white-space:nowrap}

/* ---- tonight */
.fdw-strip{position:relative;z-index:2;display:grid;gap:10px;padding:12px;border:1px solid transparent;border-radius:10px;background:linear-gradient(180deg,color-mix(in srgb,var(--brand) 7%,var(--bg)),var(--bg) 70%) padding-box,var(--brand-outline) border-box}
.fdw-when{display:flex;align-items:center;justify-content:space-between;gap:10px}
.fdw-cd{padding:6px 10px;border-radius:999px;background:var(--brand-sheen-sm);color:var(--brand-ink);font:800 14.5px/1 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:.02em;white-space:nowrap;box-shadow:var(--brand-bevel)}
.fdw-you{position:relative;display:flex;align-items:center;gap:0;min-width:0;font:600 13px/1.2 var(--sans);color:var(--ink-2);white-space:nowrap}
.fdw-lead{white-space:pre}
.fdw-you.is-short .fdw-lead{font:800 13.5px/1.2 var(--mono);font-variant-numeric:tabular-nums;color:var(--ink)}
.fdw-tail{margin-left:2px;color:var(--muted);white-space:pre;overflow:hidden;text-overflow:ellipsis}
.fdw-val{margin-left:auto;padding-left:10px;font:800 18px/1 var(--mono);font-variant-numeric:tabular-nums;color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fdw-facts{display:grid;gap:7px;padding-top:9px;border-top:1px solid var(--line);font:500 11px/1.2 var(--mono);font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}
.fdw-place{white-space:normal;color:var(--ink-2)}
.fdw-potrow{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.fdw-pot{color:var(--ink-2);font-size:11.5px}
.fdw-pot .fdw-fable{color:var(--ink)}

/* the ⓘ beside the word "tickets", and what it says */
.fdw-i{display:inline-grid;place-items:center;flex:none;width:20px;height:20px;margin:0 0 0 3px;padding:0;border:0;border-radius:50%;background:none;color:var(--brand-text-solid);cursor:pointer;box-shadow:none;transform:none}
.fdw-i svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.fdw-i:hover,.fdw-i.is-on{color:var(--brand-hi);background:color-mix(in srgb,var(--brand) 16%,transparent)}
.fdw-i:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.fdw-pop{position:absolute;z-index:20;top:calc(100% + 7px);left:-4px;right:-4px;padding:11px 12px;border:1px solid transparent;border-radius:9px;background:linear-gradient(var(--panel-2),var(--panel-2)) padding-box,var(--brand-outline) border-box;color:var(--ink-2);font:500 11.5px/1.5 var(--sans);white-space:normal;box-shadow:0 18px 38px -12px #000e,0 2px 0 #0006}
.fdw-pop::before{content:"";position:absolute;top:-5px;left:var(--fdw-tip,88px);width:8px;height:8px;border-left:1px solid #d9a466;border-top:1px solid #d9a466;background:var(--panel-2);transform:rotate(45deg)}

/* ---- last night: the results board */
.fdw-board{display:grid;gap:10px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.fdw-bh{display:grid;gap:6px;min-width:0}
.fdw-count{font:700 13px/1.25 var(--sans);color:var(--ink)}
.fdw-faces{display:flex;align-items:center;padding-left:7px;isolation:isolate}
.fdw-face{position:relative;z-index:calc(9 - var(--i,0));display:grid;place-items:center;flex:none;width:34px;height:34px;margin:0 0 0 -7px;padding:0;overflow:hidden;border:2px solid var(--bg);border-radius:50%;background:var(--panel-2);color:var(--ink);font:800 13px/1 var(--sans);cursor:pointer;box-shadow:none;transform:none;transition:transform .12s}
.fdw-face img{display:block;width:100%;height:100%;object-fit:cover}
.fdw-face:hover,.fdw-face:focus-visible{z-index:10;transform:translateY(-2px);border-color:var(--brand-text-solid);outline:none}
.fdw-more{margin-left:9px;padding:5px 9px;border-radius:999px;background:var(--brand-sheen-sm);color:var(--brand-ink);font:800 11px/1 var(--mono);font-variant-numeric:tabular-nums;box-shadow:var(--brand-bevel)}
.fdw-top{display:flex;align-items:baseline;gap:7px;min-width:0}
.fdw-topv{font:800 13.5px/1.1 var(--mono);font-variant-numeric:tabular-nums;color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fdw-who{min-width:0;margin-left:auto;padding:0;border:0;background:none;color:var(--ink-2);font:650 12px/1.2 var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;box-shadow:none;transform:none}
.fdw-who:hover,.fdw-who:focus-visible{color:var(--brand-text-solid);text-decoration:underline;text-underline-offset:2px;outline:none}
.fdw-mine{display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;padding:9px 10px;border:1px solid var(--line-2);border-radius:8px;background:var(--panel-2);color:var(--ink-2);font:650 12px/1.35 var(--sans)}
.fdw-mine>span{white-space:pre-wrap}
.fdw-mine.is-won{border-color:color-mix(in srgb,var(--up) 40%,transparent);background:color-mix(in srgb,var(--up) 9%,var(--bg));color:var(--up)}
.fdw-mine.is-wait{border-color:transparent;background:linear-gradient(var(--panel-2),var(--panel-2)) padding-box,var(--brand-outline) border-box;color:var(--brand-text-solid)}
.fdw-claim{margin-left:auto;padding:6px 11px;border:0;border-radius:6px;background:var(--brand-sheen-sm);color:var(--brand-ink);font:800 11px/1 var(--sans);cursor:pointer;box-shadow:var(--brand-bevel);transform:none}
.fdw-claim:hover{background:var(--brand-sheen-sm-hover)}
.fdw-claim[aria-disabled="true"]{background:var(--panel);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line-2);cursor:not-allowed}
.fdw-proof{display:flex;flex-wrap:wrap;align-items:center;gap:5px 7px;min-width:0;font:500 10.5px/1.2 var(--mono);font-variant-numeric:tabular-nums;color:var(--muted)}
.fdw-proof-a{min-width:0;color:inherit;text-decoration:none;white-space:nowrap}
a.fdw-proof-a:hover{color:var(--brand-text-solid);text-decoration:underline;text-underline-offset:2px}
.fdw-sim{flex:none;padding:2px 5px;border:1px solid var(--line-2);border-radius:4px;font:600 9px/1 var(--mono);font-style:normal;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.fdw-empty{margin:0;padding:14px 12px;border:1px dashed var(--line-2);border-radius:10px;color:var(--muted);font:500 12px/1.45 var(--sans);text-align:center}
.fdw :is(button,a):focus-visible{outline:2px solid var(--brand);outline-offset:1px}
@media (prefers-reduced-motion:reduce){.fdw-face{transition:none}}