:root{font-family:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;color:#f5f7ff;background:#0b1220;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 0,#1f3154 0,#0b1220 65%);padding:20px 12px}.game{width:min(100%,540px);margin:10px auto}.top{display:flex;align-items:center;justify-content:space-between;gap:15px}.eyebrow{font-size:11px;letter-spacing:3px;color:#95a8cb;font-weight:750;margin:0 0 5px}h1{font-size:clamp(28px,7vw,39px);margin:0;letter-spacing:-1.8px}h1 span{color:#8cbbff}.tagline{margin:7px 0 0;color:#a9b8d1;font-size:14px}.help{height:40px;width:40px;border-radius:50%;background:#233657;color:white;border:1px solid #456083;font-weight:900;font-size:18px;cursor:pointer}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:25px}.stats>div{padding:13px;background:#17233a;border:1px solid #2c3d59;border-radius:13px;text-align:center}.stats small{display:block;color:#94a6c2;font-size:10px;font-weight:750;letter-spacing:1.5px}.stats b{display:block;margin-top:6px;font-size:17px}.meter{height:6px;border-radius:99px;background:#2a3850;overflow:hidden;margin:14px 2px 20px}.meterfill{background:linear-gradient(90deg,#58dbb0,#80aafc);height:100%;width:0;transition:width .35s}.panel{padding:clamp(12px,4vw,24px);background:#131e31;border:1px solid #2c3d59;border-radius:21px;box-shadow:0 18px 60px #0004}.rowhead{display:flex;justify-content:space-between;gap:8px;font-size:13px;font-weight:650;color:#b6c8e6;margin-bottom:19px}.board{display:grid;gap:7px;margin:0 auto 23px;max-width:330px}.boardrow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.tile{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border:2px solid #40516d;border-radius:9px;background:#1b2a42;font-size:clamp(23px,6vw,34px);font-weight:850;user-select:none}.tile.filled{border-color:#768aa8}.correct{background:#16896d!important;border-color:#16896d!important;color:#fff!important}.present{background:#b28b29!important;border-color:#b28b29!important;color:#fff!important}.absent{background:#35445b!important;border-color:#35445b!important;color:#fff!important}.revealed{box-shadow:inset 0 0 0 2px #89e5ff;border-color:#89e5ff}.keyboard{display:grid;gap:6px}.keyrow{display:flex;gap:5px;justify-content:center}.key{flex:1;min-width:0;height:47px;border:0;border-radius:7px;background:#354765;color:white;font-size:clamp(12px,3.4vw,16px);font-weight:750;cursor:pointer;touch-action:manipulation}.key.wide{flex:1.5;font-size:12px;background:#57719b}.key:focus-visible,.primary:focus-visible,.secondary:focus-visible{outline:3px solid #9bd8ff;outline-offset:2px}.message{min-height:24px;text-align:center;color:#a9dbf5;font-size:14px;font-weight:650;margin:17px 0 5px}.actions{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-top:12px}.secondary,.primary{border:0;border-radius:11px;padding:12px 18px;font:inherit;font-size:14px;font-weight:800;cursor:pointer}.secondary{color:#e4edff;background:#2b405f}.primary{color:#071323;background:#7fd7b5}.secondary:disabled{opacity:.55;cursor:not-allowed}footer{text-align:center;color:#8195b5;font-size:12px;margin:17px}dialog{width:min(92vw,470px);background:#1b2a42;color:#eff5ff;border:1px solid #536b8f;border-radius:18px;padding:24px;line-height:1.65}dialog::backdrop{background:#000b}dialog h2{margin-top:0}.sample{display:inline-flex;padding:2px 10px;margin:2px;border-radius:5px;font-weight:800}

.extra-stats{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12px;color:#bad0ed;margin:10px 3px}.extra-stats b{color:white}.reset{border:0;background:transparent;color:#acc6ed;text-decoration:underline;cursor:pointer;font:inherit;margin-left:6px;padding:7px}.reset:focus-visible{outline:3px solid #9bd8ff}.tile{min-width:0}.key:active{transform:scale(.96)}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.lengths{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin-top:20px}.length-button{border:1px solid #425777;border-radius:9px;padding:12px 0;background:#202f49;color:#dceaff;font:700 12px system-ui;cursor:pointer}.length-button.selected{background:#86d8bb;color:#092029;border-color:#86d8bb}.board{width:100%;max-width:min(100%,420px);gap:5px}.boardrow{grid-template-columns:repeat(var(--letters),minmax(0,1fr));gap:5px}.tile{font-size:clamp(15px,5vw,28px);border-radius:6px;aspect-ratio:1;min-width:0}.game{width:min(100%,590px)}@media(max-width:380px){.lengths{gap:3px}.length-button{font-size:10px;padding:10px 0}.panel{padding:9px}.tile{font-size:clamp(13px,4.8vw,21px)}.keyrow{gap:2px}.key{font-size:11px;height:43px}.key.wide{font-size:9px}.boardrow{gap:3px}}
.reveals{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;min-height:25px;margin:3px 0 12px;color:#fce7aa;font-size:.87rem;font-weight:700}.boardrow{min-width:0}.tile{min-width:0}.key{touch-action:manipulation;user-select:none}.key:focus-visible,.length-button:focus-visible,button:focus-visible{outline:3px solid #fbbf24;outline-offset:2px}.message{min-height:1.6em}@media(max-width:420px){.board{width:100%;max-width:100%}.tile{font-size:clamp(.85rem,4.4vw,1.25rem)}.key{min-width:0;padding-left:0;padding-right:0;font-size:.8rem}.key.wide{font-size:.65rem}}
/* BerfinidaGames game shell */
body{padding:0 12px 0}.app-shell{min-height:100dvh;display:flex;flex-direction:column}.game-top{height:62px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;max-width:700px;width:100%;margin:0 auto;color:#eef4ff;border-bottom:1px solid #ffffff16}.game-top strong{text-transform:uppercase;letter-spacing:.14em;font-size:11px}.back{display:inline-flex;align-items:center;gap:7px;color:#e7eefb;text-decoration:none;font-size:12px;font-weight:800}.top-buttons{justify-self:end;display:flex;gap:7px}.icon-button{width:35px;height:35px;border:1px solid #54709a;border-radius:9px;background:#172842;color:#fff;font-weight:900;font-size:15px;cursor:pointer}.game{margin:18px auto 0}.pause-dialog{border:0;border-radius:20px;padding:0;background:#15233a;color:#eef4ff;text-align:center}.pause-dialog::backdrop{background:#030914cc;backdrop-filter:blur(7px)}.pause-dialog>div{width:min(88vw,350px);padding:28px}.pause-dialog img{display:block;width:135px;height:145px;object-fit:contain;object-position:center bottom;margin:8px auto}.pause-dialog h2{margin:8px 0;font-size:26px}.pause-dialog p{color:#b9c9e3;font-size:13px}.site-credit{margin-top:auto!important;margin-bottom:0!important;padding:20px 12px!important;color:#9aacc9!important;font-size:11px!important;letter-spacing:.08em}.extra-stats span{display:inline-flex;gap:4px}.top{align-items:center}@media(max-width:420px){.game-top{height:56px}.back span{display:none}.game-top strong{font-size:10px}.game{margin-top:12px}.icon-button{width:32px;height:32px}.pause-dialog>div{padding:24px 18px}}
/* Custom illustrated symbol system: no emoji or generic geometric mark. */
.ui-icon{width:18px;height:18px;display:inline-block;flex:0 0 auto;fill:none;stroke:currentColor}.back .ui-icon{width:16px;height:16px}.icon-button{display:grid;place-items:center}.icon-button .ui-icon{width:18px;height:18px}.wordle-mark{width:52px;height:52px;padding:11px;color:#76d8ba;border:1px solid #496587;border-radius:14px;background:#12233b}.stat-value{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:6px}.stat-value .ui-icon{width:17px;height:17px;color:#75d7bb}.stat-value b{margin-top:0}.hint-button{display:inline-flex;align-items:center;gap:7px}.hint-button .ui-icon{width:17px;height:17px;color:#bce9fb}@media(max-width:420px){.wordle-mark{width:43px;height:43px;padding:9px}.stat-value .ui-icon{width:15px;height:15px}}
/* Pause portrait aligns with the dialog's actual center. */
.pause-dialog img{transform:none}
/* The pause card's content must share the dialog's center at every viewport. */
.pause-dialog{width:min(92vw,398px)}
.pause-dialog>div{width:100%;margin-inline:auto}
/* V4: richer game atmosphere and a clearer active play state. */
body{background:radial-gradient(ellipse 60% 34% at 50% -7%,#2b4d83 0,transparent 67%),radial-gradient(ellipse 35% 22% at 5% 76%,#133e4d55 0,transparent 72%),#08111f}.game{width:min(100%,700px);position:relative}.game:before{content:'';position:absolute;z-index:-1;inset:108px -180px auto;height:350px;background:radial-gradient(ellipse at center,#29627e22,transparent 67%);filter:blur(4px);pointer-events:none}.top{padding:7px 2px 3px}.eyebrow{color:#9fc0ed}.tagline{color:#c1d1e8}.length-button{background:linear-gradient(160deg,#243a5d,#1b2c48);border-color:#55729a;box-shadow:inset 0 1px #ffffff0b,0 5px 12px #02091433;transition:transform .16s ease,background .16s ease,border-color .16s ease}.length-button:hover{transform:translateY(-2px);border-color:#83d9c1}.length-button.selected{background:linear-gradient(145deg,#98e3c7,#63c9a7);box-shadow:0 7px 20px #4dc69c36}.stats>div{position:relative;overflow:hidden;background:linear-gradient(145deg,#1d3150,#14243c);border-color:#405c82;box-shadow:inset 0 1px #ffffff0c,0 10px 25px #0209142b}.stats>div:after{content:'';position:absolute;width:90px;height:90px;right:-52px;top:-58px;border:1px solid #82b1de2b;border-radius:50%;pointer-events:none}.meter{height:7px;background:#203651;box-shadow:inset 0 1px 2px #0007}.meterfill{background:linear-gradient(90deg,#62cba9,#7caaff,#b29eea);box-shadow:0 0 16px #7baeff88}.panel{position:relative;overflow:hidden;border-color:#355678;background:linear-gradient(155deg,#162842 0,#101d31 72%);box-shadow:0 24px 70px #01071370,inset 0 1px #ffffff0d}.panel:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 55% 25% at 50% 0,#76a8d012,transparent 70%);pointer-events:none}.rowhead{position:relative}.board{position:relative;padding:15px 0 8px;border-radius:18px;background:radial-gradient(ellipse at 50% 44%,#22395855,transparent 67%)}.boardrow{padding:2px 6px;border-radius:12px;transition:background .2s,box-shadow .2s}.boardrow.active-row{background:#7fc7b20c;box-shadow:inset 0 0 0 1px #8ed9c028}.tile{border-color:#506b90;background:linear-gradient(145deg,#20334f,#182943);box-shadow:inset 0 1px #ffffff0c,inset 0 -3px #060e1d33;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease}.boardrow.active-row .tile:empty{border-color:#6e9bb0;box-shadow:inset 0 1px #ffffff12,0 0 0 1px #5ecaa414}.tile.filled{border-color:#a4c8dd;transform:translateY(-2px);box-shadow:0 7px 15px #050d1d70}.keyboard{position:relative;padding:12px 10px 8px;border-radius:16px;background:#0b172a88}.key{background:linear-gradient(160deg,#405b80,#304967);box-shadow:inset 0 1px #ffffff18,0 3px 0 #14243b;transition:transform .1s ease,filter .1s ease,background .15s ease}.key:hover{background:linear-gradient(160deg,#54749b,#3b587d);transform:translateY(-2px)}.key:active{transform:translateY(2px);box-shadow:none}.actions{position:relative;margin-top:17px}.hint-button{background:linear-gradient(160deg,#36577f,#284463);box-shadow:inset 0 1px #ffffff15,0 5px 0 #142840}.hint-button:hover{filter:brightness(1.13);transform:translateY(-1px)}.game footer{color:#9cb1cf}.site-credit{font-weight:800;color:#c8d8ef!important}@media(min-width:760px){.game{margin-top:25px}.panel{padding:27px 44px 29px}.board{max-width:480px}.boardrow{gap:7px}.tile{border-radius:10px}.keyboard{max-width:570px;margin:3px auto 0}.topbar{} }@media(max-width:520px){.panel{box-shadow:0 16px 42px #01071360}.board{padding:8px 0 4px}.boardrow{padding:1px 0}.keyboard{padding:10px 6px 6px}.length-button:hover{transform:none}}
/* AI-authored raster symbols replace the former vector symbol set. */
.ai-icon{object-fit:contain;mix-blend-mode:screen;filter:saturate(1.06) contrast(1.07)}
.icon-button .ai-icon{width:28px;height:28px;transform:scale(1.55)}
.back .ai-icon{width:25px;height:25px;transform:scale(1.48)}
.wordle-mark.ai-icon{object-fit:cover;object-position:center;mix-blend-mode:screen;filter:saturate(1.1) contrast(1.08);transform:scale(1.1)}
.stat-value .ai-icon{width:27px;height:27px;transform:scale(1.52)}
.hint-button .ai-icon{width:27px;height:27px;transform:scale(1.48)}

/* V6: compact, calmer play composition. The illustrated assets stay present
   without competing with the board, which is the primary interaction. */
.game,.game-top{max-width:600px}
.game{width:min(100%,600px)}
.top{padding-top:10px}
.lengths{margin-top:16px}
.stats{margin-top:17px}
.stats>div{padding:11px 9px}
.extra-stats{margin:8px 3px}
.meter{margin:11px 2px 16px}
.panel{padding:20px 28px 23px}
.rowhead{margin-bottom:12px}
.board{max-width:390px;margin-bottom:17px;padding:11px 0 6px}
.boardrow{gap:6px;padding:2px 5px}
.tile{border-radius:9px}
.keyboard{max-width:510px;margin-inline:auto;padding:10px 9px 7px}
.message{margin:13px 0 3px}
.actions{margin-top:12px}
.game footer:not(.site-credit){margin:13px 17px}
.icon-button .ai-icon{width:23px;height:23px;transform:none}
.back .ai-icon{width:22px;height:22px;transform:none}
.stat-value .ai-icon{width:21px;height:21px;transform:none}
.hint-button .ai-icon{width:22px;height:22px;transform:none}
.wordle-mark.ai-icon{width:56px;height:56px;padding:0;transform:none;object-fit:cover;border:0;background:transparent;filter:saturate(1.05) contrast(1.04)}
.board:not(:has(.active-row)){cursor:default}.board:has(.active-row){cursor:text}.direct-input{position:fixed;left:50%;bottom:0;width:1px;height:1px;padding:0;border:0;opacity:0;pointer-events:none}.board.invalid{animation:invalid-word .34s ease both}@keyframes invalid-word{25%{transform:translateX(-7px)}55%{transform:translateX(6px)}75%{transform:translateX(-3px)}}
.mode-dialog{width:min(92vw,440px);padding:0;border:1px solid #4e769e;border-radius:21px;background:linear-gradient(155deg,#182d4a,#101d32);color:#edf5ff;box-shadow:0 28px 90px #000b}.mode-dialog::backdrop{background:#020817e8;backdrop-filter:blur(7px)}.mode-dialog>div{padding:26px}.mode-dialog h2{margin:5px 0 7px;font-size:27px;letter-spacing:-.04em}.mode-dialog p:not(.eyebrow){margin:0;color:#b9cae2;font-size:14px}.mode-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:22px}.mode-choices .length-button{padding:14px 0;font-size:14px}
.word-info{margin:13px auto 0;max-width:390px;padding:12px 14px;border:1px solid #4e7794;border-radius:13px;background:linear-gradient(145deg,#173b4b,#142d46);box-shadow:inset 0 1px #ffffff12}.word-info strong{display:block;color:#a7ecd2;font-size:11px;letter-spacing:.06em}.word-info p{margin:6px 0 0;color:#d8e6f6;font-size:13px;line-height:1.45}
.tile.filled{animation:tile-settle .18s ease-out both}
.correct,.present,.absent{box-shadow:inset 0 1px #ffffff36,0 5px 13px #02091455}
@keyframes tile-settle{from{opacity:.48;transform:translateY(7px) scale(.9)}to{opacity:1;transform:translateY(-2px) scale(1)}}
@media(max-width:520px){body{padding-inline:10px}.game-top{max-width:600px}.top{padding-top:5px}.eyebrow{font-size:10px;letter-spacing:2.2px}.tagline{font-size:13px}.length-button{padding:11px 0;font-size:11px}.mode-dialog>div{padding:23px 18px}.mode-dialog h2{font-size:25px}.stats{gap:7px;margin-top:14px}.stats>div{padding:10px 4px}.stats b{font-size:16px}.extra-stats{font-size:11px}.panel{padding:15px 12px 18px;border-radius:19px}.rowhead{font-size:12px}.board{max-width:340px;padding:7px 0 3px;margin-bottom:14px}.boardrow{gap:4px;padding:1px 2px}.tile{border-radius:8px}.keyboard{padding:9px 5px 6px}.key{height:44px}.actions{margin-top:10px}.game footer:not(.site-credit){font-size:11px;margin:12px 8px}.wordle-mark.ai-icon{width:48px;height:48px}}
/* Keep the decorative glow inside narrow screens so result buttons stay reachable. */
@media(max-width:984px){.game:before{left:0;right:0}}

/* Keep unknown letters distinct from letters ruled out by a guess. */
.key{background:#6685ad;color:#fff}
.key.absent{background:#333d4c!important;border-color:#333d4c!important;color:#b9c1cd!important;box-shadow:inset 0 1px #ffffff12}
.key.present{background:#b28b29!important}
.key.correct{background:#16896d!important}
.key:disabled{cursor:default;transform:none}
@media(max-width:380px){.keyboard{padding-inline:2px}.keyrow{gap:3px}.key{font-size:12px}.key.wide{flex:1.8;font-size:10px}}
