.header-actions { display: flex; align-items: center; gap: 8px; }
.theme-button > span:first-child { font-size: 19px; line-height: 1; }
.result-share-button { margin: 13px 0; padding: 10px 14px; background: #eaf2cf; border: 1px solid #91a575; border-radius: 5px; color: #34472b; font-size: 11px; font-weight: bold; }
.result-share-button:hover { background: #f6faeb; }
.challenge-banner { display: flex; align-items: center; gap: 15px; margin: 0 0 25px; padding: 18px 20px; background: #eaf3cf; border: 1px solid #cad9a5; border-radius: 9px; }
.challenge-banner > span { font-size: 28px; }
.challenge-banner p { margin: 0; font-size: 13px; flex: 1; line-height: 1.5; }
.challenge-banner p span { display: block; color: #697954; font-size: 11px; margin-top: 3px; }
.challenge-banner button { padding: 11px 13px; border: 1px solid #bfd888; border-radius: 5px; background: var(--lime); color: #25301b; font-size: 11px; font-weight: bold; }
.share-dialog { position: fixed; width: min(530px, calc(100% - 30px)); max-height: calc(100dvh - 32px); margin: auto; padding: 30px; border: 1px solid #65724f; border-radius: 15px; background: var(--paper); color: var(--ink); box-shadow: 0 20px 90px #0005; overflow-y: auto; }
.share-dialog::backdrop { background: #10170ddd; backdrop-filter: blur(4px); }
.close-share { position: absolute; right: 14px; top: 10px; width: 32px; height: 32px; background: transparent; border: 0; border-radius: 5px; font-size: 26px; line-height: 1; }
.close-share:hover { background: #0001; }
.share-dialog h2 { font-size: 29px; line-height: 1.1; letter-spacing: -1.1px; margin: 16px 20px 11px 0; }
.share-dialog > p { font-size: 12px; line-height: 1.6; color: var(--muted); margin: 0 0 18px; }
.share-result-summary { padding: 16px 20px; text-align: center; background: #eaf3cf; border: 1px solid #d2dfb5; border-radius: 8px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.share-result-summary strong { font: bold 41px var(--mono); color: #34472b; }
.share-result-summary > span { font: bold 10px var(--mono); letter-spacing: .8px; }
.share-result-summary small { width: 100%; color: #74805f; font-size: 11px; text-align: left; }
.share-text-label { display: block; font: 9px var(--mono); letter-spacing: 1px; color: var(--muted); margin: 20px 0 8px; }
#share-text { width: 100%; min-height: 115px; max-height: 250px; resize: vertical; font: 12px/1.6 var(--sans); color: var(--ink); padding: 13px; background: #fcfdf7; border: 1px solid #d4dbc7; border-radius: 6px; }
.share-dialog .share-availability { color: #7d6332; background: #ede8d3; border-radius: 5px; padding: 10px 12px; font-size: 11px; margin-top: 10px; }
.share-options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 16px; }
.share-options button, .share-options a, .share-tools button { display: flex; align-items: center; justify-content: center; min-height: 41px; border: 1px solid #cbd4bb; background: #e9eedf; color: var(--ink); padding: 10px 8px; font-size: 12px; text-decoration: none; border-radius: 5px; cursor: pointer; }
.share-options a:hover, .share-options button:hover, .share-tools button:hover { background: #d9e5c4; }
.share-options a[aria-disabled="true"] { opacity: .45; cursor: default; }
.share-dialog .instagram-help { font-size: 11px; background: #e9eedf; padding: 12px; border-radius: 5px; margin: 12px 0 0; }
.share-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.share-tools button { flex: 1; font-size: 11px; min-width: 140px; }
.share-tools #share-copy { background: var(--lime); color: #25301b; border-color: #b9d974; font-weight: bold; }
.share-dialog .share-feedback { font-size: 11px; color: #667e49; margin: 13px 0 0; min-height: 18px; }

/* The game keeps its original green LCD in both page themes. */
:root[data-theme="dark"] { --paper: #111411; --ink: #edf2e5; --muted: #a4ae99; --line: #343e2d; color-scheme: dark; }
[data-theme="dark"] .brand-icon { color: #26301c; }
[data-theme="dark"] .panel { background: #1a2018; }
[data-theme="dark"] .intro > p, [data-theme="dark"] .header-note { color: #a4ae99; }
[data-theme="dark"] .eyebrow { color: #c0cbb0; }
[data-theme="dark"] .title-spark { stroke: #cad4ba; }
[data-theme="dark"] h1 > span { color: #ecf3df; }
[data-theme="dark"] h1 > span:after { background: #476520; }
[data-theme="dark"] .sound-button:hover { background: #26311f; }
[data-theme="dark"] .game-card { background: #20281d; border-color: #546546; box-shadow: 0 5px 0 #080c06; }
[data-theme="dark"] .score-item > span { color: #aab996; }
[data-theme="dark"] .best strong, [data-theme="dark"] .status { color: #b2c792; }
[data-theme="dark"] .screen, [data-theme="dark"] .overlay { color: #252b23; }
[data-theme="dark"] .primary-button { background: #d9f875; color: #25301b; border-color: #b4d45d; box-shadow: 0 3px 0 #90a45f; }
[data-theme="dark"] .primary-button:hover { background: #e8ffa6; }
[data-theme="dark"] .score-form input { color: #25301b; color-scheme: light; }
[data-theme="dark"] .section-label, [data-theme="dark"] .settings legend { color: #a0b08b; }
[data-theme="dark"] .section-label > span { color: #7e8d6d; }
[data-theme="dark"] .segmented { background: #27311f; border-color: #3d4e2e; }
[data-theme="dark"] .segmented button.selected { color: #25301b; }
[data-theme="dark"] .segmented button:hover:not(.selected) { background: #37482a; }
[data-theme="dark"] .settings-note, [data-theme="dark"] .little-note p, [data-theme="dark"] .shortcut > span { color: #98a587; }
[data-theme="dark"] .switch-track { background: #4e5e40; }
[data-theme="dark"] .instruction-icon { background: #27321e; border-color: #455736; color: #bbd49b; }
[data-theme="dark"] kbd { background: #25311d; border-color: #4b5d3c; color: #e2ebd7; }
[data-theme="dark"] .mobile-controls button { background: #28351f; border-color: #576d43; color: #e5efd8; }
[data-theme="dark"] .mobile-controls button:active { background: #d9f875; color: #25301b; }
[data-theme="dark"] .countdown-box, [data-theme="dark"] .challenge-banner, [data-theme="dark"] .share-result-summary { background: #29371e; border-color: #425a2e; }
[data-theme="dark"] .countdown-box strong, [data-theme="dark"] .share-result-summary strong { color: #d9f875; }
[data-theme="dark"] .countdown-box span, [data-theme="dark"] .challenge-banner p span, [data-theme="dark"] .share-result-summary small { color: #a8bc8e; }
[data-theme="dark"] .ranking-filters label, [data-theme="dark"] .ranking-message, [data-theme="dark"] .ranking-table th { color: #b0bd9e; }
[data-theme="dark"] .ranking-filters select { background: #222d1a; border-color: #4b6037; color: #ecf2e5; }
[data-theme="dark"] .ranking-filters button, [data-theme="dark"] .share-options a, [data-theme="dark"] .share-options button, [data-theme="dark"] .share-tools button, [data-theme="dark"] .instagram-help { background: #2b3920; border-color: #4a6036; }
[data-theme="dark"] .share-options a:hover, [data-theme="dark"] .share-options button:hover, [data-theme="dark"] .share-tools button:hover { background: #3c502b; }
[data-theme="dark"] .ranking-table td { border-color: #34442a; }
[data-theme="dark"] .ranking-table td:first-child, [data-theme="dark"] .ranking-table td:last-child { color: #a4b98a; }
[data-theme="dark"] .ranking-table .first-place td { background: #2a3a1e; }
[data-theme="dark"] .ranking-table .first-place td:first-child { color: #d9f875; }
[data-theme="dark"] .ranking-footnote, [data-theme="dark"] footer { color: #93a180; }
[data-theme="dark"] .ranking-message.is-error { color: #e8ac86; }
[data-theme="dark"] #share-text { background: #1c2517; border-color: #4b6037; }
[data-theme="dark"] .share-dialog .share-availability { background: #352e1d; color: #d3c094; }
[data-theme="dark"] .share-dialog .share-feedback { color: #b3d58e; }

@media (max-width: 760px) {
  .header-actions { gap: 7px; }
  .header-actions .sound-button { width: 37px; height: 37px; padding: 6px; justify-content: center; }
  .header-actions .sound-button > span:last-child { display: none; }
  .challenge-banner { flex-wrap: wrap; padding: 15px; gap: 10px; }
  .challenge-banner p { font-size: 12px; }
  .challenge-banner button { width: 100%; }
  .share-dialog { padding: 24px 19px; }
  .share-dialog h2 { font-size: 26px; }
  .result-share-button { font-size: 10px; padding: 9px 12px; }
}