.results-page [aria-current="page"] {color:var(--purple);}
.results-play {font-size:15px;padding:12px 18px;white-space:nowrap;}
.results-main {padding-block:14px 24px;}
.results-hero {display:flex;align-items:center;justify-content:space-between;gap:30px;padding:28px 34px;margin-bottom:25px;border-radius:28px;background:linear-gradient(110deg,#efe2f7,#f9f0e8 85%,#fff3d9);}
.results-hero .eyebrow {font-size:15px;margin-bottom:8px;}
.results-hero h1 {font-size:clamp(36px,4.3vw,56px);line-height:1.1;}
.results-lead {max-width:700px;font-size:17px;line-height:1.6;margin-top:13px;color:var(--muted);}
.results-trophy {display:grid;place-items:center;flex-shrink:0;width:98px;height:98px;margin-right:12px;border:1px solid #fff9;border-radius:28px;background:#fff7;font-size:51px;transform:rotate(7deg);}
.game-picker {padding:22px 24px 24px;border:1px solid var(--border);border-radius:24px;background:#fffefd;}
.picker-heading {display:flex;align-items:baseline;gap:18px;margin-bottom:16px;}
.picker-heading h2 {font-size:23px;line-height:1.2;}
.picker-heading p {font-size:14px;line-height:1.5;color:var(--muted);}
.game-choices {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;}
.game-choice {display:flex;align-items:center;justify-content:flex-start;gap:9px;min-width:0;min-height:58px;padding:9px 10px;border:1px solid #e9e0e9;border-radius:13px;background:#fcfaf7;text-align:left;font-weight:700;font-size:13px;line-height:1.25;transition:background .15s,border-color .15s,box-shadow .15s;}
.game-choice img {flex-shrink:0;width:27px;height:27px;object-fit:contain;}
.game-choice span {min-width:0;overflow-wrap:anywhere;}
.game-choice:hover {background:#f6eefb;border-color:#c29ad3;}
.game-choice[aria-pressed="true"] {border-color:var(--purple);background:var(--lavender);color:var(--purple-dark);box-shadow:inset 0 0 0 1px var(--purple);}
html.results-modal-open {overflow:hidden;}
.results-dialog {width:min(1100px,calc(100% - 32px));max-width:none;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);margin:auto;padding:0;overflow:hidden;border:1px solid #d9c8e0;border-radius:26px;background:var(--paper,#fcfaf6);color:var(--plum);box-shadow:0 24px 100px #30113840;}
.results-dialog[open] {display:flex;flex-direction:column;}
.results-dialog::backdrop {background:#28132d80;backdrop-filter:blur(4px);}
.results-dialog-bar {display:flex;align-items:center;justify-content:space-between;gap:18px;flex-shrink:0;padding:12px 18px 12px 26px;border-bottom:1px solid var(--border);background:#f2e9f7;}
.results-dialog-bar>p {font-size:14px;font-weight:800;color:var(--purple-dark);}
.results-dialog-close {display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;padding:0;border:1px solid #d8c5e1;border-radius:14px;background:#fffafc;color:var(--purple-dark);font-size:29px;line-height:1;}
.results-dialog-close:hover {background:#e9d9f2;border-color:var(--purple);}
.results-dialog .results-section {min-height:0;margin:0;padding:26px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;}
.results-selection {display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:19px;}
.results-filter-panel {margin:0;border:1px solid var(--border);border-radius:14px;background:#f5f0f6;}
.results-filter-panel > summary {display:flex;align-items:center;gap:8px;min-height:44px;padding:9px 14px;color:var(--purple-dark);font-size:14px;font-weight:700;cursor:pointer;}
.results-filter-panel > summary::before {content:'＋';}
.results-filter-panel[open] > summary::before {content:'−';}
.results-filter-panel .results-filters {border:0;padding-top:8px;}
.results-selection h2 {font-size:32px;line-height:1.2;}
.selection-note {font-size:15px;line-height:1.6;color:var(--muted);margin-top:7px;max-width:850px;}
.selected-play {flex-shrink:0;display:inline-flex;align-items:center;gap:9px;font-size:15px;padding-block:10px;}
.results-filters {display:grid;grid-template-columns:minmax(180px,1fr) minmax(170px,.65fr) auto;align-items:end;gap:16px;padding:17px 20px 19px;border:1px solid var(--border);border-radius:18px;background:#f5f0f6;}
.filter-field {min-width:0;}
.filter-field label {display:block;font-size:13px;font-weight:700;line-height:1.4;margin-bottom:6px;}
.results-filters input,.results-filters select {min-height:44px;border-color:#d5c8d9;border-radius:10px;font-size:15px;}
.results-filters input::placeholder {color:#827186;opacity:1;}
.refresh-button,.board-retry {display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;border:1px solid #cab4d5;border-radius:10px;padding:10px 15px;background:#fff;color:var(--purple-dark);font-size:14px;font-weight:700;line-height:1.3;}
.refresh-button>span {font-size:22px;line-height:1;}
.refresh-button:hover,.board-retry:hover {background:#efe3fa;border-color:var(--purple);}
.results-status {min-height:21px;margin:13px 2px 15px;color:var(--muted);font-size:13px;line-height:1.6;}
.results-boards {min-width:0;}
.board-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:18px;}
.score-board {min-width:0;overflow:hidden;border:1px solid var(--border);border-radius:21px;background:#fffefd;box-shadow:0 3px 0 #34102e04;}
.board-heading {padding:20px 21px 17px;border-bottom:1px solid var(--border);background:linear-gradient(110deg,#f7effa,#fcf8fc);}
.board-title {font-size:24px;line-height:1.2;}
.board-caption {margin-top:6px;color:var(--muted);font-size:13px;line-height:1.5;}
.board-message {margin:24px 21px;color:var(--muted);font-size:15px;line-height:1.7;}
.board-retry {margin:0 21px 22px;}
.ranking-list {list-style:none;margin:0;padding:0 12px 10px;}
.ranking-row {display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:77px;padding:13px 9px;border-bottom:1px solid #eee7ee;}
.ranking-row:last-child {border-bottom:0;}
.rank-badge {display:grid;place-items:center;align-self:center;flex-shrink:0;width:30px;height:30px;border-radius:10px;background:#f3eef4;color:#766178;font-family:'Nunito',sans-serif;font-size:14px;font-weight:900;line-height:1;}
.rank-badge[data-rank="1"] {background:#ffe6a1;border:1px solid #ecd17c;color:#75511a;box-shadow:0 2px 0 #d1a34126;}
.rank-badge[data-rank="2"] {background:#e9e5ef;border:1px solid #d5cfde;color:#62546d;box-shadow:0 2px 0 #91849f18;}
.rank-badge[data-rank="3"] {background:#f4ddce;border:1px solid #e5c4ae;color:#88583b;box-shadow:0 2px 0 #a66c4318;}
.ranking-player {min-width:0;}
.player-name {display:block;overflow-wrap:anywhere;font-size:14px;line-height:1.35;font-weight:700;}
.player-grade {display:block;margin-top:4px;font-size:12px;line-height:1.35;color:var(--muted);}
.current-tag {display:inline-block;margin-top:5px;padding:2px 6px;border-radius:5px;background:#e7d1f4;color:var(--purple-dark);font-size:10px;line-height:1.35;font-weight:700;}
.ranking-result {min-width:0;max-width:125px;text-align:right;font-variant-numeric:tabular-nums;}
.score-value {display:block;font-family:'Nunito',sans-serif;font-size:18px;line-height:1.25;font-weight:900;overflow-wrap:anywhere;}
.score-detail {display:block;margin-top:4px;font-size:11px;line-height:1.4;color:var(--muted);overflow-wrap:anywhere;}
.ranking-row.is-current {position:relative;margin-inline:-3px;padding-inline:12px;border-radius:10px;background:#f2e7fa;}
.single-board {grid-template-columns:minmax(0,1fr);}
.single-board .score-board {width:100%;}
.single-board .ranking-list {max-width:850px;}
.single-board .ranking-row {grid-template-columns:34px minmax(0,1fr) minmax(130px,.5fr);gap:18px;}
.single-board .ranking-result {max-width:none;}
.archive-boards {margin-top:24px;border:1px solid var(--border);border-radius:19px;background:#f8f5f8;}
.archive-boards summary {padding:19px 22px;color:var(--muted);font-size:15px;font-weight:700;line-height:1.5;cursor:pointer;}
.archive-boards summary:hover {color:var(--purple-dark);}
.archive-boards[open] summary {border-bottom:1px solid var(--border);margin-bottom:18px;}
.archive-boards>.board-grid {padding:0 18px 18px;}
.archive-boards>p {padding:0 22px 17px;color:var(--muted);font-size:14px;line-height:1.6;}
.results-noscript {margin-top:16px;padding:24px;border:1px solid var(--border);border-radius:18px;background:#fff;}
.results-noscript h3 {font-size:23px;}
.results-noscript p {margin-top:9px;line-height:1.6;color:var(--muted);}
.results-encouragement {display:flex;align-items:center;gap:14px;margin-top:30px;padding:18px 22px;border-radius:17px;background:#eee8f3;}
.results-encouragement>span {font-size:28px;color:var(--purple);}
.results-encouragement p {font-size:14px;line-height:1.6;color:var(--muted);}
.results-encouragement>a {flex-shrink:0;margin-left:auto;padding-block:8px;color:var(--purple-dark);font-size:13px;font-weight:700;text-underline-offset:4px;}
.results-page .site-footer nav {gap:22px;}
.results-page :is(button,input,select,summary):focus-visible {outline:3px solid #4d79c8;outline-offset:4px;}

@media(max-width:1150px) {
  .game-choices {grid-template-columns:repeat(5,minmax(0,1fr));}
  .board-grid {gap:12px;}
  .board-heading {padding:18px 16px 16px;}
  .ranking-list {padding-inline:7px;}
  .ranking-row {gap:8px;padding-inline:5px;grid-template-columns:28px minmax(0,1fr) auto;}
  .rank-badge {width:28px;height:29px;}
  .ranking-result {max-width:100px;}
  .score-value {font-size:17px;}
  .player-name {font-size:13px;}
}
@media(max-width:900px) {
  .results-play {margin-left:auto;}
  .results-hero {padding:25px 28px;}
  .results-trophy {width:80px;height:80px;font-size:43px;margin:0;}
  .game-choices {grid-template-columns:repeat(4,minmax(0,1fr));}
  .game-picker {padding:20px;}
  .results-selection {align-items:flex-start;gap:18px;}
  .results-selection h2 {font-size:29px;}
  .results-filters {grid-template-columns:minmax(0,1fr) minmax(160px,.7fr) auto;gap:12px;padding:16px;}
  .refresh-button {max-width:130px;padding-inline:12px;text-align:left;}
  .board-grid {grid-template-columns:1fr;gap:18px;}
  .board-heading {padding:19px 22px 17px;}
  .ranking-list {padding-inline:13px;}
  .ranking-row {min-height:73px;grid-template-columns:32px minmax(0,1fr) minmax(100px,.45fr);gap:14px;padding:13px 9px;}
  .rank-badge {width:30px;height:30px;}
  .ranking-result {max-width:none;}
  .score-value {font-size:19px;}
  .player-name {font-size:15px;}
  .score-detail {font-size:12px;}
  .results-encouragement {flex-wrap:wrap;gap:8px 13px;}
  .results-encouragement p {flex:1;}
  .results-encouragement>a {width:calc(100% - 39px);margin-left:39px;}
  .results-page .site-footer {flex-wrap:wrap;}
  .results-page .site-footer nav {gap:18px;}
}
@media(max-width:560px) {
  .results-dialog {width:calc(100% - 20px);max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px);border-radius:21px;}
  .results-dialog-bar {padding:9px 12px 9px 18px;}
  .results-dialog .results-section {padding:20px 15px;}
  .results-play {font-size:12px;padding:10px 12px;border-radius:14px;}
  .results-main {padding-top:9px;}
  .results-hero {gap:12px;padding:23px 21px;margin-bottom:19px;border-radius:23px;}
  .results-hero .eyebrow {font-size:13px;}
  .results-hero h1 {font-size:36px;max-width:280px;}
  .results-lead {font-size:15px;line-height:1.6;margin-top:12px;}
  .results-trophy {display:none;}
  .game-picker {padding:19px 15px 16px;border-radius:20px;}
  .picker-heading {display:block;margin:0 3px 14px;}
  .picker-heading h2 {font-size:22px;}
  .picker-heading p {font-size:12px;margin-top:5px;}
  .game-choices {grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}
  .game-choice {min-height:48px;padding:8px;gap:8px;font-size:12px;border-radius:11px;}
  .game-choice img {width:25px;height:25px;}
  .results-selection {flex-direction:column;gap:6px;margin-bottom:15px;}
  .results-selection h2 {font-size:28px;}
  .selection-note {font-size:14px;margin-top:6px;}
  .selected-play {font-size:14px;padding-block:7px;}
  .results-filters {grid-template-columns:1fr;gap:13px;padding:17px;}
  .refresh-button {max-width:none;justify-self:start;min-height:42px;padding:8px 12px;font-size:13px;}
  .results-filters input,.results-filters select {font-size:16px;}
  .results-status {font-size:12px;margin-bottom:13px;}
  .score-board {border-radius:19px;}
  .board-heading {padding:19px 19px 16px;}
  .board-title {font-size:24px;}
  .board-caption {font-size:12px;}
  .ranking-list {padding-inline:9px;}
  .ranking-row,.single-board .ranking-row {grid-template-columns:29px minmax(0,1fr) minmax(75px,.65fr);gap:9px;padding:12px 7px;min-height:75px;}
  .rank-badge {width:28px;height:29px;font-size:13px;}
  .player-name {font-size:14px;}
  .player-grade {font-size:11px;}
  .score-value {font-size:18px;}
  .score-detail {font-size:11px;}
  .archive-boards summary {padding:17px;font-size:14px;}
  .archive-boards>.board-grid {padding:0 10px 10px;gap:14px;}
  .archive-boards .ranking-row {gap:7px;padding-inline:4px;grid-template-columns:27px minmax(0,1fr) minmax(68px,.6fr);}
  .archive-boards .player-name {font-size:13px;}
  .archive-boards .score-value {font-size:17px;}
  .results-encouragement {margin-top:23px;padding:17px;}
  .results-encouragement p {font-size:13px;}
  .results-page .site-footer nav {font-size:12px;gap:17px;}
}
@media(prefers-reduced-motion:reduce) {
  .game-choice {transition:none;}
}

/* Keep the first list near the title; optional filters expand in place. */
@media(max-width:560px) {
  .results-dialog .results-section {padding:15px 13px;}
  .results-selection {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px 12px;margin-bottom:12px;}
  .results-selection > div {display:contents;}
  .results-selection h2 {min-width:0;font-size:25px;}
  .selection-note {grid-column:1/-1;grid-row:2;font-size:13px;line-height:1.45;margin-top:2px;}
  .selected-play {grid-column:2;grid-row:1;min-height:44px;align-items:center;font-size:12px;white-space:nowrap;}
  .results-filter-panel .results-filters {grid-template-columns:1fr 1fr;gap:10px;padding:6px 12px 12px;}
  .results-filters .search-field {grid-column:1/-1;}
  .results-filters .refresh-button {align-self:end;min-height:44px;font-size:12px;}
  .results-filters input::placeholder {color:var(--muted);}
  .results-status {margin:9px 2px 11px;line-height:1.45;}
  .board-heading {padding:14px 16px 12px;}
}
