/* Dockside Catch: a pond, a wooden dock and outlined text on a transparent stage. */
html.tt-shell .gift-copy small { display:block; color:var(--muted); font-size:14px; margin-top:5px; }
.source-page #dc-stage { position:absolute; width:1080px; height:1920px; transform-origin:top left; color:#fff; font-family:system-ui, sans-serif; font-weight:900; -webkit-text-stroke:8px #25263e; paint-order:stroke fill; stroke-linejoin:round; text-shadow:none; }
.source-page #dc-stage * { box-sizing:border-box; paint-order:stroke fill; stroke-linejoin:round; }
html.source-page[data-transparent="0"] body { background:#16181b; }
#dc-stage [hidden] { display:none; }
.dc-top { position:absolute; left:48px; right:48px; top:38px; display:flex; justify-content:space-between; align-items:flex-start; }
.dc-brand { color:#ffd43b; font-size:26px; letter-spacing:5px; margin:0 0 8px; }
.dc-top h1 { font-size:92px; line-height:1; margin:0; letter-spacing:-4px; }
.dc-top h1 span { color:#ffd43b; }
.dc-clock { text-align:right; font-variant-numeric:tabular-nums; }
.dc-clock strong { display:block; font-size:78px; line-height:1.05; color:#ffd43b; }
.dc-clock span { font-size:28px; display:block; margin-top:10px; letter-spacing:2px; }
.dc-board { position:absolute; top:205px; left:60px; right:60px; height:470px; background:transparent; }
.dc-board h2 { font-size:36px; color:#ffd43b; letter-spacing:4px; margin:0 0 10px; text-align:center; }
#leaders { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
#leaders li { display:grid; grid-template-columns:64px 1fr auto; align-items:center; gap:14px; border:4px solid #ffd43b; border-radius:22px; padding:6px 20px; font-size:38px; line-height:1.15; }
#leaders li .rank { color:#ffd43b; }
#leaders li .who { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
#leaders li small { display:block; font-size:22px; color:#ffd43b; }
#leaders li.lead { border-width:6px; }
.dc-empty { font-size:40px; color:#ffd43b; text-align:center; margin:120px 0 0; }
.dc-legend { position:absolute; top:205px; left:60px; right:60px; text-align:center; background:transparent; }
.dc-legend h2 { font-size:42px; color:#ffd43b; margin:0; line-height:1.1; }
.dc-sub { font-size:30px; margin:10px 0 16px; }
#legend-rows { display:flex; flex-direction:column; gap:10px; }
.dc-row { display:grid; grid-template-columns:76px 1fr; align-items:center; gap:16px; border:4px solid #ffd43b; border-radius:24px; padding:8px 18px; text-align:left; }
.dc-row .icon { width:72px; height:72px; display:flex; align-items:center; justify-content:center; font-size:44px; }
.dc-row .icon img { width:70px; height:70px; object-fit:contain; }
.dc-row b { display:block; font-size:32px; line-height:1.05; }
.dc-row i { display:block; font-style:normal; font-size:25px; line-height:1.2; margin-top:4px; }
.dc-prompt { color:#ffd43b; font-size:32px; margin:12px 0 0; }
.dc-catch { position:absolute; top:790px; left:48px; right:48px; margin:0; text-align:center; font-size:44px; line-height:1.1; color:#fff; }
.dc-catch b { color:#ffd43b; }
.dc-catch:empty { display:none; }
.dc-pond { position:absolute; top:860px; left:48px; width:984px; height:760px; }
.dc-pond canvas { display:block; width:984px; height:760px; }
.dc-floaters { position:absolute; top:890px; left:60px; right:60px; height:300px; pointer-events:none; }
.dc-floaters span { position:absolute; left:0; right:0; text-align:center; font-size:40px; color:#ffd43b; animation:dc-rise 2.5s ease-out forwards; }
@keyframes dc-rise { from { transform:translateY(160px); opacity:1; } to { transform:translateY(0); opacity:0; } }
html[data-reduced-motion="1"] .dc-floaters span { animation:none; }
.dc-quick { position:absolute; left:48px; right:48px; top:1580px; display:flex; justify-content:space-between; gap:12px; }
.dc-quick span { font-size:23px; color:#ffd43b; }
.dc-result { position:absolute; left:60px; right:60px; top:220px; min-height:1300px; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center; background:transparent; }
.dc-crown { font-size:220px; color:#ffd43b; margin:0; line-height:1; }
.dc-kicker { font-size:42px; letter-spacing:7px; color:#ffd43b; margin:28px 0; }
#winner { font-size:110px; line-height:1.05; margin:0; width:100%; overflow-wrap:anywhere; }
#result-detail { font-size:48px; margin:30px 0 0; }
#result-biggest { font-size:40px; margin:24px 0 0; color:#ffd43b; }
#result-biggest:empty { display:none; }
#result-next { font-size:34px; margin:20px 0 0; }
.dc-queue { position:absolute; left:48px; right:48px; top:1630px; margin:0; text-align:center; color:#ffd43b; font-size:32px; }
.dc-callout { position:absolute; left:60px; right:60px; top:1684px; margin:0; text-align:center; color:#ffd43b; font-size:38px; line-height:1.15; overflow-wrap:anywhere; }
.dc-mode { position:absolute; top:1775px; left:40px; right:40px; font-size:24px; letter-spacing:3px; text-align:center; color:#ffd43b; }
.dc-recent { position:absolute; top:1815px; left:65px; right:65px; font-size:24px; text-align:center; margin:0; }
.dc-footer { position:absolute; left:20px; right:20px; top:1880px; font-size:21px; text-align:center; margin:0; -webkit-text-stroke:5px #25263e; }
.dc-callout:empty, .dc-recent:empty, .dc-queue:empty, .dc-mode:empty { display:none; }
.source-page #dc-stage .tt-core-overlay-status { position:absolute; left:48px; top:1690px; width:984px; max-width:none; transform:none; margin:0; z-index:4; background:transparent; border:0; }
.source-page #dc-stage .tt-core-notice { font-size:28px; font-weight:900; padding:12px; background:transparent; border:0; box-shadow:none; }
.source-page #dc-stage .tt-core-notice strong { font-size:30px; }
#dc-stage:has(.tt-core-status[data-mode="live"][data-connected="false"]) :is(.dc-callout, .dc-mode, .dc-recent) { display:none; }
