:root{--challenge-ink:#18213d;--challenge-muted:#687086;--challenge-green:#2c8c67;--challenge-gold:#c89b3c;--challenge-grey:#737887;--challenge-coral:#f06b5e;--challenge-cream:#fffaf0}
body.challenge-page{min-height:100vh;background:#f5f7f3;color:var(--challenge-ink);background-image:radial-gradient(#e2e8dd 1px,transparent 1px);background-size:22px 22px}
.challenge-hero{position:relative;margin-bottom:-64px;padding:26px 20px 132px;border-radius:0 0 56px 56px;background:linear-gradient(135deg,#16203b 0%,#25345e 57%,#236d68 130%);overflow:visible}
.challenge-hero::after{position:absolute;inset:auto 7% 27px auto;width:126px;height:126px;border:1px solid rgba(255,255,255,.12);border-radius:28px;background:rgba(255,255,255,.05);content:"A";display:grid;place-items:center;color:rgba(255,255,255,.14);font-size:5rem;font-weight:900;transform:rotate(9deg)}
.challenge-hero nav{position:relative;z-index:5;margin-bottom:28px}.challenge-hero .brand a{color:#fff;text-decoration:none}
.challenge-heading{position:relative;z-index:1;max-width:760px;margin:auto;text-align:center}.back-link{display:inline-block;margin-bottom:20px;color:#bce9df;text-decoration:none;font-weight:800}.challenge-kicker{display:inline-block;color:#248178;font-size:.75rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.challenge-heading .challenge-kicker{display:block;color:#84ded0}.challenge-heading h1{margin:7px 0 0;color:#fff;font-size:clamp(2.65rem,7vw,5rem);letter-spacing:-.055em;line-height:1}.challenge-heading p{max-width:620px;margin:18px auto 0;color:#dce8e9;font-size:clamp(1rem,2vw,1.18rem)}
.challenge-main{position:relative;z-index:2;display:grid;width:min(1050px,calc(100% - 28px));max-width:none;grid-template-columns:minmax(0,1.45fr) minmax(270px,.8fr);gap:24px;margin:0 auto 70px;padding:0}
.game-shell,.how-to-play{margin:0;border:1px solid #e1e5df;border-radius:28px;background:#fff;box-shadow:0 18px 48px rgba(24,33,61,.11)}.game-shell{min-width:0;padding:clamp(20px,4vw,38px)}.game-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:8px}.toolbar-label{color:var(--challenge-coral);font-size:.7rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.game-toolbar h2{margin:2px 0 0;font-size:clamp(1.45rem,3vw,2rem);letter-spacing:-.03em}.new-game-button,.next-challenge button{border:0;border-radius:999px;padding:11px 18px;background:var(--challenge-ink);color:#fff;font:inherit;font-weight:900;cursor:pointer}.new-game-button:disabled{cursor:wait;opacity:.45}.new-game-button:not(:disabled):hover,.next-challenge button:hover{background:#2b3b68;transform:translateY(-1px)}
.game-message{min-height:1.6em;margin:0 0 18px;color:var(--challenge-muted);text-align:center;font-weight:800}.game-message.error{color:#b63c35}.game-message.success{color:#237655}
.challenge-board{display:grid;gap:7px;width:min(100%,342px);margin:0 auto 24px}.board-row{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.board-tile{display:grid;aspect-ratio:1;place-items:center;border:2px solid #d7dcd5;border-radius:9px;background:#fff;color:var(--challenge-ink);font-size:clamp(1.55rem,6vw,2rem);font-weight:900;line-height:1;text-transform:uppercase;transition:transform .16s ease,border-color .16s ease,background .16s ease}.board-tile.filled{border-color:#8f99a8;transform:scale(1.03)}.board-tile.correct,.keyboard-key.correct,.example-tile.correct{border-color:var(--challenge-green);background:var(--challenge-green);color:#fff}.board-tile.present,.keyboard-key.present,.example-tile.present{border-color:var(--challenge-gold);background:var(--challenge-gold);color:#fff}.board-tile.absent,.keyboard-key.absent,.example-tile.absent{border-color:var(--challenge-grey);background:var(--challenge-grey);color:#fff}.board-tile.revealed{animation:tile-reveal .42s ease both}
@keyframes tile-reveal{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}100%{transform:rotateX(0)}}
.challenge-keyboard{display:grid;gap:7px;width:100%;max-width:600px;margin:auto}.keyboard-row{display:flex;justify-content:center;gap:5px}.keyboard-key{display:grid;min-width:0;height:52px;flex:1 1 0;place-items:center;border:0;border-radius:7px;background:#dfe3e7;color:#242b3d;font:inherit;font-size:clamp(.72rem,2.2vw,.9rem);font-weight:900;cursor:pointer;text-transform:uppercase}.keyboard-key:hover{filter:brightness(.96)}.keyboard-key.wide{flex:1.55 1 0;font-size:.68rem}.keyboard-key:focus-visible,.new-game-button:focus-visible,.next-challenge button:focus-visible{outline:3px solid rgba(44,140,103,.32);outline-offset:3px}
.next-challenge{margin:24px auto 0;border-radius:18px;padding:20px;background:var(--challenge-cream);text-align:center}.next-challenge[hidden]{display:none}.next-challenge p{margin:0 0 13px;font-weight:900}.next-challenge button{background:var(--challenge-green)}
.how-to-play{align-self:start;padding:clamp(24px,4vw,34px)}.how-to-play h2{margin:7px 0 12px;font-size:1.65rem;letter-spacing:-.035em}.how-to-play>p{margin:0;color:var(--challenge-muted)}.how-to-play ul{display:grid;gap:18px;margin:25px 0;padding:0;list-style:none}.how-to-play li{display:grid;grid-template-columns:46px 1fr;align-items:center;gap:13px;color:var(--challenge-muted);line-height:1.45}.how-to-play strong{color:var(--challenge-ink)}.example-tile{display:grid;width:46px;height:46px;place-items:center;border-radius:7px;font-weight:900}.how-to-play .unlimited-note{border-top:1px solid #e5e8e2;padding-top:20px;color:var(--challenge-ink)}
.independence-note{grid-column:1/-1;margin:0;border-radius:16px;padding:16px 20px;background:#ecefe9;text-align:center}.independence-note p{margin:0;color:#596173;font-size:.86rem}
@media(max-width:780px){.challenge-main{grid-template-columns:1fr}.challenge-hero::after{display:none}.how-to-play{order:2}.independence-note{order:3}}
@media(max-width:480px){.challenge-hero{padding:22px 14px 112px;border-radius:0 0 38px 38px}.challenge-main{width:calc(100% - 14px)}.game-shell{padding:17px 10px 22px;border-radius:22px}.game-toolbar{padding:0 5px}.new-game-button{padding:9px 13px}.challenge-board{width:min(100%,310px)}.challenge-keyboard{gap:5px}.keyboard-row{gap:3px}.keyboard-key{height:48px;border-radius:5px}.how-to-play{border-radius:22px}}
@media(prefers-reduced-motion:reduce){.board-tile.revealed{animation:none}.new-game-button,.next-challenge button{transition:none}}
