/* Shared visual system for DailyGuess modes. The desktop shell mirrors the approved homepage. */
:root{--ink:#112d48;--muted:#647386;--paper:#fcfbf8;--line:#d6dde3;--teal:#248d8c;--teal-dark:#126c70;--gold:#e8a945;--slate:#748494;--cream:#f5efe6;--shadow:0 18px 42px rgba(17,45,72,.09);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 50% 0,#f4faf8 0,transparent 24rem),var(--paper);line-height:1.5}a{color:inherit}.site{width:min(1240px,calc(100% - 32px));margin:auto}.mode-header{height:58px;display:flex;align-items:center;justify-content:space-between}.mode-header .brand{line-height:0}.mode-header .brand img{width:154px;height:44px;max-height:none;object-fit:contain;object-position:left center;mix-blend-mode:multiply}.mode-header nav{display:flex;gap:.45rem;align-items:center}.mode-header nav a,.text-button,.theme-toggle{border:0;background:transparent;color:var(--ink);font:inherit;font-weight:650;cursor:pointer;border-radius:.55rem;padding:.42rem .55rem;text-decoration:none;font-size:.78rem}.mode-header nav a:hover,.text-button:hover,.theme-toggle:hover{background:#e9f2f0}.theme-toggle{border:1px solid #bdd0d8;border-radius:50%;width:30px;height:30px;padding:0;display:grid;place-items:center}.mode-nav{display:flex;gap:5px;overflow:auto;scrollbar-width:none;width:min(1240px,calc(100% - 32px));margin:0 auto 8px}.mode-nav::-webkit-scrollbar{display:none}.mode-nav a{flex:0 0 auto;border:1px solid #c9d6dc;border-radius:999px;padding:.25rem .55rem;color:var(--ink);font-size:.68rem;font-weight:750;text-decoration:none}.mode-nav a:hover,.mode-nav a[aria-current="page"]{background:#e7f3f1;border-color:#8fcac5;color:var(--teal-dark)}.mode-intro{max-width:1240px;margin:0 auto 8px;padding:0;text-align:left;display:flex;flex-wrap:wrap;align-items:baseline;gap:.18rem .65rem}.mode-intro .eyebrow{order:3;flex-basis:100%;margin:0;color:#718190;font-size:.59rem}.live-dot{display:inline-block;width:7px;height:7px;background:var(--gold);border-radius:50%;margin:0 .45rem 1px 0}.mode-intro h1{font:780 1rem/1.2 inherit;letter-spacing:-.015em;margin:0}.mode-intro>p:last-child{margin:0;font-size:.82rem;color:var(--muted)}.mode-layout{width:min(1240px,calc(100% - 32px));margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}.mode-game,.mode-radio,.mode-result{background:#fff;border:1px solid rgba(17,45,72,.09);box-shadow:var(--shadow);border-radius:20px}.mode-game{padding:16px}.mode-meta{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--muted);margin-bottom:7px}.mode-meta>span:first-child{font-weight:700}.status-pill{border:1px solid #c9e1df;border-radius:999px;background:#f1f9f8;color:var(--teal-dark);font:inherit;font-weight:700;padding:.38rem .65rem;cursor:pointer;white-space:nowrap}.mode-message{height:18px;text-align:center;color:#b54b40;font-weight:700;font-size:.76rem}.mode-grid{--letters:5;display:grid;grid-template-columns:repeat(var(--letters),1fr);gap:6px;width:min(100%,360px);margin:0 auto}.mode-tile{aspect-ratio:1;display:grid;place-items:center;border:2px solid #d7dfe5;border-radius:10px;background:#fff;font-size:clamp(1.45rem,5vw,2rem);font-weight:800;text-transform:uppercase}.mode-tile.filled{border-color:#92a3b2}.mode-tile.correct{background:var(--teal);border-color:var(--teal);color:#fff}.mode-tile.present{background:var(--gold);border-color:var(--gold);color:#382500}.mode-tile.absent{background:var(--slate);border-color:var(--slate);color:#fff}.mode-keys{margin:16px auto 0;display:grid;gap:5px;max-width:490px}.mode-key-row{display:flex;gap:5px;justify-content:center}.mode-key{border:0;border-radius:7px;background:#e6ecef;color:var(--ink);font-weight:800;min-width:0;flex:1;height:45px;font-size:.78rem;cursor:pointer;touch-action:manipulation}.mode-key.wide{flex:1.55}.mode-key.correct{background:var(--teal);color:#fff}.mode-key.present{background:var(--gold);color:#382500}.mode-key.absent{background:var(--slate);color:#fff}.mode-radio{padding:17px;position:sticky;top:72px}.radio-heading{display:flex;justify-content:space-between;align-items:start;gap:10px}.eyebrow{font-size:.71rem;font-weight:800;letter-spacing:.14em;color:var(--teal-dark);margin:0 0:.55rem}.radio-heading .eyebrow{margin:0;color:var(--teal-dark);font-size:.59rem}.mode-radio h2{font:700 1.28rem/1.1 Georgia,serif;margin:0}.radio-count{font-size:.59rem;color:var(--teal-dark);font-weight:800;background:#eff8f7;padding:.3rem .43rem;border-radius:99px;white-space:nowrap}.radio-copy{font-size:.84rem;color:var(--muted);margin:7px 0 11px}.mode-radio select{width:100%;border:1px solid #cdd7de;border-radius:9px;background:#fff;color:var(--ink);padding:.65rem;font:600 .83rem inherit}.genre{font-size:.75rem;color:var(--teal-dark);font-weight:750;margin:.4rem 0 10px}.radio-controls{display:flex;gap:10px;align-items:center}.play-button{border:0;border-radius:9px;background:var(--ink);color:#fff;font:800 .84rem inherit;padding:.7rem .9rem;cursor:pointer;min-width:104px}.volume-row{min-width:0;flex:1}.volume-row input{min-width:0;width:100%;accent-color:var(--teal)}.radio-status{min-height:2.4em;color:var(--muted);font-size:.75rem;margin:9px 0 0}.mode-result{margin:14px auto 0;max-width:500px;padding:18px;text-align:center}.mode-result h2{margin:0;font:700 1.5rem Georgia,serif}.mode-result p{color:var(--muted)}.mode-result button{border:0;border-radius:9px;background:var(--teal);color:#fff;padding:.7rem 1rem;font:800 .84rem inherit;cursor:pointer}.mode-copy{width:min(1000px,calc(100% - 40px));margin:clamp(56px,9vw,106px) auto 0;border-top:1px solid var(--line);padding:clamp(36px,6vw,70px) 0;color:var(--muted);line-height:1.65}.mode-copy h2{color:var(--ink);font:700 clamp(1.55rem,3vw,2.2rem)/1.12 Georgia,serif;letter-spacing:-.025em;margin:0 0:.75rem}.mode-copy a{color:var(--teal-dark);font-weight:750}.dialog{width:min(440px,calc(100% - 30px));border:0;border-radius:18px;padding:34px;background:#fff;color:var(--ink);box-shadow:0 22px 70px rgba(12,35,52,.28);text-align:center}.dialog::backdrop{background:rgba(10,29,43,.43);backdrop-filter:blur(3px)}.dialog h2{font:700 2rem/1.05 Georgia,serif;margin:0 0:.65rem}.dialog>p:not(.eyebrow){color:var(--muted);margin:0}.close-dialog{position:absolute;right:13px;top:10px;border:0;background:transparent;font-size:1.7rem;color:var(--muted);cursor:pointer}.stats-note{color:var(--muted);font-size:.78rem;margin:-.15rem 0 0!important}.stats-numbers{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;margin:21px 0 26px}.stats-numbers div{border-right:1px solid var(--line);display:grid;gap:2px}.stats-numbers div:last-child{border:0}.stats-numbers strong{font-size:1.05rem}.stats-numbers span{font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.share-button{border:0;border-radius:9px;background:var(--teal);color:#fff;font:800 .84rem inherit;padding:.7rem .9rem;cursor:pointer;width:100%}.reminder-dialog{text-align:left}.reminder-dialog h2{font-size:1.7rem}.reminder-dialog form{display:grid;gap:9px;margin:21px 0 0}.reminder-dialog label{font-size:.8rem;font-weight:750}.reminder-dialog input{width:100%;border:1px solid #b8c6ce;border-radius:8px;background:#fff;color:var(--ink);padding:.75rem .8rem;font:inherit}.cancel-button{border:0;border-radius:8px;background:transparent;color:var(--muted);font:700 .82rem inherit;padding:.55rem;cursor:pointer}.reminder-status{min-height:1.3em;color:#aa4a40!important;font-size:.78rem;margin:12px 0 0!important}.reminder-status.ready{color:var(--teal-dark)!important}.reminder-small{font-size:.72rem!important;margin:12px 0 0!important}.donation-amounts{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:20px 0 12px}.donation-amounts button{border:1px solid #b9cbd1;border-radius:8px;padding:.56rem .2rem;background:#fff;color:var(--ink);font:800 .78rem inherit;cursor:pointer}.donation-amounts button.selected{background:var(--teal);border-color:var(--teal);color:#fff}.donate-link{display:block;text-decoration:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* The approved desktop composition: keyboard / word grid / live radio. */
@media(min-width:1100px){.mode-layout{display:grid;grid-template-columns:minmax(330px,min(380px,33vw)) minmax(390px,1fr) minmax(270px,300px);grid-template-rows:auto auto;gap:12px 16px;align-items:stretch}.mode-game{display:contents}.mode-meta{grid-column:1/-1;grid-row:1;margin:0;min-height:25px;padding:0}.mode-message{grid-column:2;grid-row:2;position:absolute;align-self:start;justify-self:center;z-index:1;margin-top:4px;pointer-events:none}.mode-grid{grid-column:2;grid-row:2;width:390px;max-width:100%;margin:0 auto;padding:15px;background:#fff;border:1px solid rgba(17,45,72,.09);border-radius:18px;box-shadow:var(--shadow);align-self:start}.mode-tile{font-size:2rem}.mode-keys{grid-column:1;grid-row:2;align-self:center;max-width:none;width:min(100%,380px);min-height:0;margin:0;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;gap:5px}.mode-key{height:46px;border:1px solid #b8cad6;border-bottom-color:#9eb2c0;border-radius:7px;background:#e7eff4;box-shadow:0 2px 0 rgba(17,45,72,.13);font-size:.8rem;line-height:1;transition:background .12s ease,border-color .12s ease,box-shadow .12s ease,transform .08s ease}.mode-key:hover{background:#f0f6f8;border-color:#8ba8b9}.mode-key:active{transform:translateY(1px);box-shadow:0 1px 0 rgba(17,45,72,.13)}.mode-key.correct{border-color:var(--teal);border-bottom-color:#1b7776;box-shadow:0 2px 0 rgba(17,45,72,.18)}.mode-key.present{border-color:var(--gold);border-bottom-color:#c88c31;box-shadow:0 2px 0 rgba(17,45,72,.18)}.mode-key.absent{border-color:var(--slate);border-bottom-color:#586a79;box-shadow:0 2px 0 rgba(17,45,72,.18)}.mode-keys .mode-key-row{width:100%;min-width:0;gap:5px;justify-self:center}.mode-keys .mode-key-row:nth-child(2){width:90%}.mode-keys .mode-key.wide{flex:1.6;min-width:0;font-size:.7rem;letter-spacing:-.015em;white-space:nowrap}.mode-radio{grid-column:3;grid-row:2;min-height:224px;position:static;padding:18px}.mode-result{grid-column:2;grid-row:3;width:100%;max-width:390px}}

/* Blog pages retain a quiet reading header while sharing the same palette and controls. */
.blog{max-width:800px;margin:38px auto 70px;color:var(--muted);line-height:1.7}.blog h1,.blog h2{color:var(--ink);font-family:Georgia,serif}.blog h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.04;letter-spacing:-.04em}.blog h2{margin-top:2rem;font-size:1.5rem}.blog .lead{font-size:1.12rem}.blog li{margin:.3rem 0}.cta{border:1px solid var(--line);border-radius:14px;background:#fff;padding:18px;margin-top:2rem;color:var(--ink)}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:25px}.card{border:1px solid var(--line);border-radius:14px;padding:18px;background:#fff;text-decoration:none}.card h2{font-size:1.05rem;margin:0 0:.45rem}.card p{margin:0;color:var(--muted)}

html[data-theme="dark"]{color-scheme:dark;--ink:#eef4f4;--muted:#aab9c4;--paper:#0d1a29;--line:#34495b;--teal:#35a6a0;--teal-dark:#77cbc5;--gold:#efbb59;--slate:#65798b;--cream:#17283a;--shadow:0 18px 42px rgba(0,0,0,.28)}html[data-theme="dark"] body{background:radial-gradient(circle at 50% 0,#102d46 0,transparent 24rem),var(--paper)}html[data-theme="dark"] .mode-header .brand img{mix-blend-mode:normal}html[data-theme="dark"] .mode-header nav a,html[data-theme="dark"] .text-button,html[data-theme="dark"] .theme-toggle{color:var(--ink)}html[data-theme="dark"] .mode-header nav a:hover,html[data-theme="dark"] .text-button:hover,html[data-theme="dark"] .theme-toggle:hover{background:#1b3850;color:#b9f1eb}html[data-theme="dark"] .mode-nav a{border-color:#506d84;background:#142b42}html[data-theme="dark"] .mode-nav a:hover,html[data-theme="dark"] .mode-nav a[aria-current="page"]{background:#193b45;border-color:#327276;color:#a9ece6}html[data-theme="dark"] .mode-game,html[data-theme="dark"] .mode-radio,html[data-theme="dark"] .mode-result,html[data-theme="dark"] .mode-grid,html[data-theme="dark"] .mode-keys,html[data-theme="dark"] .dialog,html[data-theme="dark"] .cta,html[data-theme="dark"] .card{background:#142b42;border-color:#506d84}html[data-theme="dark"] .mode-tile{background:#203a52;border-color:#607d94;color:#f8fbff}html[data-theme="dark"] .mode-tile.filled{border-color:#a3b9c8}html[data-theme="dark"] .mode-key{background:#29465e;border:1px solid #5b7890;color:#f5f9fc}html[data-theme="dark"] .mode-key:hover{background:#35566e}html[data-theme="dark"] .mode-radio select,html[data-theme="dark"] .reminder-dialog input,html[data-theme="dark"] .donation-amounts button{background:#1e3950;color:#f5f9fc;border-color:#6b879d}html[data-theme="dark"] .radio-count,html[data-theme="dark"] .status-pill{background:#193b45;border-color:#327276}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #f3bf67;outline-offset:2px}

@media(max-width:1099px){.mode-layout{margin-top:4px}.mode-intro{width:min(760px,calc(100% - 32px))}}@media(min-width:801px) and (max-width:1099px){.mode-keys{width:min(100%,490px);margin-left:auto;margin-right:auto}.mode-keys .mode-key-row{width:100%}}@media(max-width:800px){.site{width:calc(100% - 20px)}.mode-header{height:52px;width:calc(100% - 20px);margin:auto}.mode-header .brand img{width:140px;height:40px}.mode-header nav{gap:0}.mode-header nav a,.text-button,.theme-toggle{font-size:.76rem;padding:.4rem}.mode-intro{width:calc(100% - 20px);margin-bottom:9px;padding:0}.mode-intro h1{font-size:.9rem}.mode-intro>p:last-child{font-size:.77rem}.mode-intro .eyebrow{font-size:.56rem}.mode-layout{grid-template-columns:1fr;width:calc(100% - 20px);gap:14px}.mode-game{border-radius:15px;padding:14px 10px 16px}.mode-radio{position:static;padding:16px;order:2}.mode-tile{border-radius:8px}.mode-key{height:44px;font-size:.72rem}.mode-copy{width:calc(100% - 32px);margin-top:58px}.cards{grid-template-columns:1fr}.blog{margin:28px auto 55px}}@media(max-width:520px){.mode-header{height:48px}.mode-header .brand img{width:126px;height:36px}.mode-header .text-button{font-size:.72rem}.mode-header .text-button:first-child,.mode-header .text-button:nth-child(3){display:none}.mode-intro{gap:.12rem .45rem}.mode-meta{margin-bottom:5px;font-size:.72rem;gap:4px;flex-wrap:wrap}.status-pill{font-size:.72rem;padding:.3rem .48rem}.mode-key{height:43px}.mode-radio{padding:18px}.stats-numbers{gap:2px}.stats-numbers strong{font-size:1.05rem}}
@media(min-width:1100px){.mode-grid{width:min(100%,var(--mode-grid-width,390px))}.mode-result{max-width:var(--mode-grid-width,390px)}}@media(max-width:1099px){.mode-grid{width:min(100%,var(--mode-grid-width,360px))}}
.mode-game-page .mode-site{width:auto;margin:0}
.mode-game-page .mode-header{width:min(1240px,calc(100% - 32px));margin:0 auto}.mode-intro h1{font-family:inherit;font-size:1rem;line-height:1.2;font-weight:780}
.mode-game-page .mode-nav{margin-bottom:10px}
@media(max-width:520px){.mode-header .text-button:first-child,.mode-header .text-button:nth-child(3){display:inline-block}}
.mode-key{display:grid;place-items:center;padding:0;text-align:center}.mode-key.wide{padding:0 3px;line-height:1;white-space:nowrap}
@media(min-width:1100px){html[data-theme="dark"] .mode-keys{background:transparent;border:0;box-shadow:none}html[data-theme="dark"] .mode-key{background:#29465e;border-color:#5b7890;border-bottom-color:#486a83;box-shadow:0 2px 0 rgba(0,0,0,.28);color:#f5f9fc}html[data-theme="dark"] .mode-key:hover{background:#35566e;border-color:#7799af}html[data-theme="dark"] .mode-key:active{box-shadow:0 1px 0 rgba(0,0,0,.28)}html[data-theme="dark"] .mode-key.correct{background:#248f8d;border-color:#56c6bd;color:#fff}html[data-theme="dark"] .mode-key.present{background:#eab24e;border-color:#f5cc78;color:#142131}html[data-theme="dark"] .mode-key.absent{background:#526d84;border-color:#7894a8;color:#fff}}
