.games-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.buddy { width: 76px; height: 76px; flex: none; order: 3; cursor: pointer; background: #fffdf6; overflow: hidden; padding: 0; }
.buddy canvas, .buddy img { width: 100%; height: 100%; display: block; }
.me { text-align: right; font-size: 13px; color: var(--muted); }
.me b { color: var(--text); }
.me .key-reward { display: block; margin-top: 4px; font-size: 12px; }
.me code { background: var(--bg); border: var(--o); border-radius: 12px; padding: 1px 6px; }
.me .streak { font-size: 20px; font-weight: 700; color: var(--red-ink); display: block; }

.tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 14px; }
.tabs button { padding: 7px 14px; border-radius: 12px; border: var(--o); background: var(--paper-2); color: var(--ink); white-space: nowrap; font-family: var(--font-hand); font-size: 19px; }
.tabs button[aria-selected="true"] { background: var(--ink); color: var(--paper); box-shadow: 4px 4px 0 var(--ink); }

.nb-board { display: grid; grid-template-columns: 240px 1fr; gap: 18px; align-items: start; margin-top: 10px; }
#nb-shape { width: 100%; aspect-ratio: 1; background: var(--bg); border: var(--o); border-radius: 12px; }
#nb-shape path { fill: var(--accent); fill-opacity: 0.85; stroke: var(--text); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.nb-row { display: flex; gap: 8px; margin-top: 4px; }
.nb-row input { flex: 1; min-width: 0; }
.nb-msg { min-height: 1.2em; margin: 6px 0 0; color: var(--red-ink); }

.guesses { list-style: none; padding: 0; margin: 10px 0 0; display: grid; gap: 6px; }
.guesses li { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; padding: 8px 10px; border: var(--o); border-radius: 12px; font-size: 14px; position: relative; overflow: hidden; }
.guesses li .bar { position: absolute; inset: 0 auto 0 0; background: var(--age-0); opacity: 0.14; z-index: 0; }
.guesses li > span { position: relative; z-index: 1; }
.guesses li.hit { border-color: var(--good); }
.guesses .dist { font-variant-numeric: tabular-nums; color: var(--muted); }
.guesses .slot { color: var(--muted); border-style: dashed; }

.result { margin-top: 14px; padding: 14px; border-radius: 12px; background: var(--bg); border: var(--o); }
.result h3 { margin: 0 0 4px; font-size: 18px; }
.result pre { white-space: pre-wrap; font: inherit; font-size: 13px; background: var(--panel); border: var(--o); border-radius: 12px; padding: 10px; margin: 10px 0; }
.result .actions { display: flex; gap: 8px; flex-wrap: wrap; }

.qn { border: 0; padding: 0; margin: 0 0 18px; }
.qn legend { font-weight: 600; margin-bottom: 8px; }
.qn label { display: flex; gap: 10px; align-items: flex-start; padding: 9px 12px; border: var(--o); border-radius: 12px; margin-bottom: 6px; cursor: pointer; }
.qn label:has(input:checked) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.qn input { margin-top: 3px; accent-color: var(--accent); }
.review li { margin-bottom: 12px; }
.review .ok { color: var(--good-ink); font-weight: 600; }
.review .no { color: var(--red-ink); font-weight: 600; }

.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
table.lb { width: 100%; border-collapse: collapse; font-size: 14px; }
table.lb th { text-align: left; font-weight: 500; color: var(--muted); border-bottom: 1px solid var(--line); padding: 6px 0; }
table.lb td { padding: 7px 0; border-bottom: 1px solid var(--line); }
table.lb td.r, table.lb th.r { text-align: right; font-variant-numeric: tabular-nums; }
table.lb tr.mine td { color: var(--red-ink); font-weight: 600; }

.nick-form input[type="text"] { width: 100%; margin-top: 4px; }
.nick-actions { gap: 8px; }
.nick-error { color: var(--red-ink); margin: 6px 0 0; }

@media (max-width: 640px) {
  .nb-board { grid-template-columns: 1fr; }
  #nb-shape { max-width: 220px; margin: 0 auto; display: block; }
}
@media (max-width: 420px) {
  .tabs button { padding: 7px 11px; font-size: 14px; }
  .games-head { flex-direction: column-reverse; }
  .me { text-align: left; }
}

@media (max-width: 720px) {
  button, .btn, .chip { min-height: 44px; }
}
body[data-zone="games"] { background: radial-gradient(circle at top right, rgba(116, 192, 140, 0.2), transparent 50%), radial-gradient(circle at bottom left, rgba(116, 192, 140, 0.1), transparent 50%), var(--paper) var(--grain); }

/* Weekly honor roll: warm paper, a riverfront vignette, and clear rank hierarchy. */
.lb-section-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:24px 0 10px; }
.lb-section-heading h3 { font-family:var(--font-display); font-size:clamp(20px,3vw,27px); margin:4px 0; line-height:1.15; }
.lb-section-heading .kicker { margin:0; font-size:11px; }
.lb-week-pill, .lb-rare, .lb-live-dot { font-size:12px; white-space:nowrap; color:var(--ink-soft); }
.lb-week-pill { padding:6px 10px; border:1px solid var(--line); border-radius:999px; }
.lb-live-dot::before { content:""; display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--good); margin-right:6px; }
.lb-podium, .lb-prize-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:18px 0; }
.lb-champion { position:relative; overflow:hidden; border:1px solid var(--line); border-radius:18px; background:var(--paper-2); }
.lb-champion.lb-place-1 { border-color:var(--warn); box-shadow:0 5px 18px color-mix(in srgb,var(--warn) 15%,transparent); }
.lb-champion-scene { height:92px; overflow:hidden; opacity:.85; }
.lb-champion-scene svg { width:100%; height:100%; object-fit:cover; }
.lb-champion-content { position:relative; text-align:center; padding:0 16px 18px; margin-top:-26px; }
.lb-champion-content > .av-ring { width:64px; height:64px; display:inline-flex; background:var(--paper-2); border:3px solid var(--paper-2); border-radius:50%; font-size:34px; }
.lb-champion-content .av-ring img { width:100%; height:100%; object-fit:contain; }
.lb-champion-content h4 { font-family:var(--font-display); font-size:21px; overflow-wrap:anywhere; margin:7px 0; }
.lb-champion-content .kicker { margin:12px 0 0; font-size:10px; }
.lb-champion-score { font-variant-numeric:tabular-nums; font-size:20px; margin:8px 0 14px; }
.lb-medal { position:absolute; top:24px; left:18px; font-size:26px; }
.lb-first-week { text-align:center; background:var(--paper); border:1px dashed var(--line); padding:28px 18px; border-radius:18px; margin:18px 0; }
.lb-first-week > span { color:var(--warn-ink); font-size:32px; }
.lb-first-week h4 { font-family:var(--font-display); font-size:22px; margin:8px 0; }
.lb-first-week p { margin:8px 0; color:var(--ink-soft); }
.lb-players { list-style:none; padding:0; display:grid; gap:9px; margin:18px 0; }
.lb-player { display:grid; grid-template-columns:38px 44px minmax(0,1fr) auto; align-items:center; gap:12px; border:1px solid var(--line); border-radius:13px; background:var(--paper-2); padding:14px; }
.lb-front-runner { background:linear-gradient(110deg,color-mix(in srgb,var(--warn) 7%,var(--paper-2)),var(--paper-2)); }
.lb-player.lb-mine { border-color:var(--good); box-shadow:inset 3px 0 var(--good); }
.lb-position { font-size:18px; text-align:center; font-variant-numeric:tabular-nums; }
.lb-player > .av-ring { width:42px; height:42px; font-size:28px; }
.lb-player > .av-ring img { width:100%; height:100%; object-fit:contain; }
.lb-player-info { min-width:0; overflow-wrap:anywhere; }
.lb-player-info > b { font-size:17px; }
.lb-status { font-style:italic; color:var(--ink-soft); margin:5px 0 0; line-height:1.25; }
.lb-score { font-size:21px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.lb-score small { font-size:11px; font-weight:400; color:var(--ink-soft); }
.lb-you { font-family:var(--font-body); font-size:11px; padding:2px 5px; border:1px solid var(--good); border-radius:5px; color:var(--good-ink); }
.lb-personal { background:var(--paper); border-left:3px solid var(--good); padding:12px 14px; }
.lb-prizes { border-top:1px solid var(--line); margin-top:28px; padding-top:4px; }
.lb-prize-card { background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:16px; min-width:0; }
.lb-prize-art { display:flex; align-items:center; justify-content:center; height:90px; margin:14px 0; overflow:hidden; border-radius:9px; background:var(--paper-2); }
.lb-prize-art > svg { width:100%; height:100%; }
.lb-prize-art > .av-ring { width:76px; height:76px; font-size:52px; }
.lb-prize-art img { width:100%; height:100%; object-fit:contain; }
.lb-prize-list { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin:10px 0; }
.lb-prize-chip { border:1px solid var(--line); border-radius:7px; background:var(--paper-2); font-size:12px; padding:5px 7px; line-height:1.3; overflow-wrap:anywhere; }
.lb-rules { border-top:1px solid var(--line); padding-top:16px; margin-top:24px; }
.lb-rules summary { cursor:pointer; font-weight:600; }
.lb-rules li { margin:8px 0; }
.lb-empty { padding:24px 16px; background:var(--paper); border-radius:12px; }
@media (max-width:640px) {
 .lb-prize-grid { grid-template-columns:1fr; }
 .lb-podium { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:85%; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:8px; }
 .lb-champion { scroll-snap-align:start; }
 .lb-section-heading { align-items:flex-start; flex-wrap:wrap; gap:8px; }
 .lb-player { grid-template-columns:28px 34px minmax(0,1fr); gap:9px; padding:12px; }
 .lb-player > .av-ring { width:34px; height:34px; }
 .lb-score { grid-column:3; font-size:18px; }
 .lb-status { font-size:14px; }
 .lb-champion-scene { height:110px; }
}

/* Decorative trailing dots belong to app captions, not player chat/presence. */
.lb-ellipsis { display:inline-flex; width:1em; margin-left:2px; font-style:normal; }
.lb-ellipsis span { animation:lb-dot 1.5s ease-in-out 4; }
.lb-ellipsis span:nth-child(2) { animation-delay:.18s; }
.lb-ellipsis span:nth-child(3) { animation-delay:.36s; }
.lb-banter { margin:6px 0 0; color:var(--ink-soft); font-size:13px; line-height:1.45; }
.lb-auto-label { font-size:9px; font-style:normal; letter-spacing:.04em; text-transform:uppercase; border:1px solid var(--line); border-radius:4px; padding:2px 4px; white-space:nowrap; }
@keyframes lb-dot { 0%,70%,100% { opacity:.45; transform:translateY(0); } 35% { opacity:1; transform:translateY(-2px); } }
@media (prefers-reduced-motion:reduce) { .lb-ellipsis span { animation:none; opacity:1; } }

/* Original podium collections keep the site's paper cards and ink outlines. */
.lb-prize-art{position:relative;height:125px;border-radius:12px;overflow:hidden;background:#171c39}
.lb-prize-avatar{position:absolute;inset:0;display:grid;place-items:center}
.lb-prize-avatar .av-ring{width:90px;height:90px;background:color-mix(in srgb,var(--paper) 85%,transparent);box-shadow:0 4px 0 #0003}
.lb-tier-legendary{border-color:#b58b36;background:linear-gradient(145deg,#e8bd6714,transparent),var(--paper)}
.lb-tier-epic{border-color:#9874b2;background:linear-gradient(145deg,#b58bd914,transparent),var(--paper)}
.lb-tier-rare{border-color:#5c9995;background:linear-gradient(145deg,#83e7df14,transparent),var(--paper)}
.lb-prize-chip{text-transform:none}

/* Standings first; award collections open only when requested. */
.lb-your-standing { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 20px; margin:18px 0 22px; border:1px solid var(--good); border-radius:16px; background:linear-gradient(120deg,color-mix(in srgb,var(--good) 9%,var(--paper)),var(--paper)); }
.lb-your-standing .kicker { margin:0 0 6px; font-size:11px; }
.lb-your-score { display:flex; align-items:baseline; gap:14px; margin:0; font-variant-numeric:tabular-nums; }
.lb-your-score strong { font-family:var(--font-display); font-size:32px; line-height:1.1; }
.lb-your-score span { font-weight:600; }
.lb-your-hint { margin:7px 0 0; font-size:13px; line-height:1.5; color:var(--ink-soft); }
.lb-jump { flex:none; padding:10px 14px; border:1px solid var(--line); border-radius:999px; color:var(--ink); background:var(--paper-2); font-size:13px; font-weight:600; text-decoration:none; }
.lb-jump:hover { border-color:var(--good); }
#lb-my-row { scroll-margin-top:140px; }
#lb-my-row:target { outline:2px solid var(--good); outline-offset:3px; }
.lb-live .lb-section-heading { margin-top:0; }
.lb-board-note { margin:0; font-size:12px; color:var(--ink-soft); }
.lb-disclosure { margin-top:14px; border:1px solid var(--line); border-radius:16px; background:var(--paper); overflow:hidden; }
.lb-disclosure > summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 20px; cursor:pointer; font-weight:600; list-style:none; }
.lb-disclosure > summary::-webkit-details-marker { display:none; }
.lb-disclosure > summary small { display:block; margin-top:5px; font-size:12px; line-height:1.4; color:var(--ink-soft); font-weight:400; }
.lb-disclosure-action { flex:none; font-size:12px; color:var(--ink-soft); }
.lb-disclosure-action::after { content:" +"; }
.lb-disclosure[open] .lb-disclosure-action::after { content:" −"; }
.lb-disclosure-body { padding:0 20px 20px; border-top:1px solid var(--line); }
.lb-award-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; list-style:none; padding:0; margin:18px 0 0; }
.lb-award-card { display:grid; grid-template-columns:42px minmax(0,1fr); align-content:start; gap:10px 12px; padding:18px; border:1px solid var(--line); border-radius:14px; background:var(--paper-2); min-width:0; }
.lb-award-emblem { display:grid; place-items:center; width:42px; height:48px; border:1px solid color-mix(in srgb,var(--warn) 65%,var(--line)); border-radius:18px 18px 12px 12px; color:var(--warn-ink); background:color-mix(in srgb,var(--warn) 12%,var(--paper)); font-size:24px; }
.lb-award-place { font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft); }
.lb-award-card h4 { margin:5px 0 8px; font-family:var(--font-display); font-size:19px; line-height:1.2; overflow-wrap:anywhere; }
.lb-award-card p { margin:0; font-size:13px; color:var(--ink-soft); line-height:1.55; }
.lb-award-keepsake { grid-column:2; border-top:1px solid var(--line); padding-top:10px; font-size:10px; color:var(--ink-soft); }
.lb-winners { display:grid; gap:8px; margin-top:16px; }
.lb-winner { display:grid; grid-template-columns:28px 36px minmax(0,1fr) auto; gap:12px; align-items:center; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--paper-2); }
.lb-winner > .av-ring { width:36px; height:36px; font-size:26px; }
.lb-winner img { width:100%; height:100%; object-fit:contain; }
.lb-winner-rank { text-align:center; font-size:16px; }
.lb-winner-copy { min-width:0; overflow-wrap:anywhere; }
.lb-winner-copy h4 { margin:0 0 4px; font-size:15px; }
.lb-winner-copy p { margin:0; font-size:12px; color:var(--ink-soft); }
.lb-winner > strong { font-size:14px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.lb-winner > strong small { font-weight:400; font-size:10px; }
.lb-prize-card > b { display:block; margin-bottom:12px; }
.lb-prize-card .lb-prize-list { justify-content:flex-start; margin-bottom:0; }
@media (max-width:640px) {
 .lb-your-standing { padding:16px; flex-wrap:wrap; gap:12px; }
 .lb-player > .lb-position, .lb-player > .av-ring { align-self:start; margin-top:2px; }
 .lb-disclosure > summary { padding:16px; gap:10px; }
 .lb-disclosure-action { font-size:0; }
 .lb-disclosure-action::after { font-size:22px; }
 .lb-disclosure-body { padding:0 14px 14px; }
 .lb-award-grid { grid-template-columns:1fr; }
 .lb-award-card { padding:16px; }
 .lb-winner { grid-template-columns:24px 30px minmax(0,1fr); gap:8px; }
 .lb-winner > strong { grid-column:3; }
}

.lb-calendar-theme { display:flex; align-items:center; gap:10px; margin:18px 0 -4px; color:var(--ink-soft); }
.lb-calendar-theme > span { display:grid; place-items:center; width:36px; height:36px; border:1px solid var(--line); border-radius:50%; color:var(--warn-ink); }
.lb-calendar-theme b { display:block; font-family:var(--font-display); font-size:16px; color:var(--ink); }
.lb-calendar-theme small { display:block; font-size:11px; margin-top:3px; }
.lb-next-theme { padding:12px 14px; margin-top:18px; border:1px dashed var(--line); border-radius:10px; font-size:13px; line-height:1.5; }

.lb-award-emblem { border-color:color-mix(in srgb,var(--award-accent,var(--warn)) 65%,var(--line)); color:var(--award-sky,var(--warn-ink)); background:color-mix(in srgb,var(--award-accent,var(--warn)) 24%,var(--paper)); }