:root{--bg:#f1f6f3;--surface:#fff;--ink:#12352b;--muted:#60766f;--brand:#0b6b4f;--brand-dark:#064c39;--brand-soft:#dff5ea;--line:#dce8e2;--blue:#1769aa;--blue-soft:#e3f1fb;--red:#b3262e;--red-soft:#fbe6e8;--gold:#a86d08;--shadow:0 12px 32px rgba(9,76,55,.09);--radius:22px;--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at top right,#dff4e8 0,transparent 36%),var(--bg);color:var(--ink);font-family:Tahoma,"Segoe UI",Arial,sans-serif;min-height:100vh;padding-bottom:calc(82px + var(--safe-bottom));overflow-x:hidden}button,input,select{font:inherit}button{cursor:pointer}.skip-link{position:fixed;top:-60px;right:12px;z-index:999;background:#fff;padding:12px;border-radius:10px}.skip-link:focus{top:12px}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:10px max(16px,calc((100vw - 1040px)/2));background:rgba(241,246,243,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(11,107,79,.08)}.brand{display:flex;gap:10px;align-items:center;color:inherit;text-decoration:none}.brand img{width:42px;height:42px;border-radius:14px}.brand span{display:grid}.brand b{font-size:1.08rem}.brand small{color:var(--muted);font-size:.72rem}.icon-button{border:1px solid var(--line);background:var(--surface);border-radius:14px;min-width:44px;min-height:44px;color:var(--ink)}main{width:min(100%,1040px);margin:auto;padding:18px 16px 40px}.no-script-fallback{display:none}.no-script-fallback:only-child{display:block}.eyebrow{color:var(--brand);font-weight:800;font-size:.78rem;letter-spacing:.04em;margin:0 0 8px}.hero{background:linear-gradient(145deg,#075d46,#0d7b58);color:#fff;border-radius:28px;padding:24px;box-shadow:var(--shadow);position:relative;overflow:hidden}.hero:after{content:"";position:absolute;width:200px;height:200px;border:36px solid rgba(255,255,255,.06);border-radius:50%;left:-70px;top:-80px}.hero h1{font-size:clamp(1.7rem,7vw,3rem);margin:.15em 0}.hero p{max-width:650px;color:#d9f5e8;line-height:1.8}.hero-stats{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}.stat{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:12px 16px;min-width:120px}.stat b{display:block;font-size:1.35rem}.stat span{font-size:.78rem}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.btn{border:0;border-radius:15px;padding:13px 18px;min-height:48px;font-weight:800;background:var(--brand);color:#fff}.btn:hover{filter:brightness(.96)}.btn:focus-visible,.icon-button:focus-visible,.bottom-nav button:focus-visible,.key:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #f0b83d;outline-offset:2px}.btn-light{background:#fff;color:var(--brand-dark)}.btn-secondary{background:var(--brand-soft);color:var(--brand-dark)}.btn-outline{background:transparent;color:var(--brand);border:1px solid var(--brand)}.btn-danger{background:var(--red)}.btn-small{padding:8px 12px;min-height:38px;font-size:.84rem}.section-title{display:flex;justify-content:space-between;align-items:end;gap:10px;margin:26px 0 12px}.section-title h1,.section-title h2{margin:0}.section-title p{margin:4px 0 0;color:var(--muted)}.grid{display:grid;gap:14px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:0 5px 18px rgba(13,79,59,.04)}.card h2,.card h3{margin-top:0}.card p{line-height:1.7;color:var(--muted)}.link-card{text-align:right;width:100%;color:inherit}.link-card b{display:block;font-size:1.05rem;margin-bottom:5px}.badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 9px;font-size:.75rem;font-weight:800;background:var(--brand-soft);color:var(--brand-dark)}.badge.demo{background:#fff2d6;color:#7c5300}.notice{padding:12px 14px;border-radius:14px;background:#edf6f2;color:var(--brand-dark);line-height:1.6}.notice.danger{background:var(--red-soft);color:var(--red)}.muted{color:var(--muted)}.player{display:flex;align-items:center;gap:12px}.avatar{width:54px;height:54px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(145deg,var(--brand),#12a071);color:#fff;font-weight:900;border:4px solid #d4f1e3;flex:0 0 auto}.avatar.alt{background:linear-gradient(145deg,#28517f,#4387c7);border-color:#deecf8}.avatar.gold{border-color:#e8bd54}.avatar.midnight{border-color:#263d51}.player-meta{min-width:0;flex:1}.player-meta b{display:block}.player-meta small{color:var(--muted)}.game-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);gap:16px}.guess-display{display:flex;direction:ltr;justify-content:center;gap:10px;margin:18px 0}.digit-slot{width:72px;height:78px;display:grid;place-items:center;border-radius:20px;border:2px solid var(--line);background:#f9fcfa;font-size:2rem;font-weight:900}.digit-slot.filled{border-color:var(--brand);box-shadow:inset 0 0 0 3px var(--brand-soft)}.keypad{direction:ltr;display:grid;grid-template-columns:repeat(3,1fr);gap:9px;max-width:360px;margin:auto}.key{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:16px;min-height:54px;font-weight:900;font-size:1.15rem}.key.confirm{background:var(--brand);color:#fff;grid-row:4}.key.delete{background:var(--red-soft);color:var(--red)}.attempts{display:grid;gap:10px}.attempt{display:grid;grid-template-columns:auto 66px 1fr;gap:10px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:16px}.attempt-code{direction:ltr;font-family:Consolas,monospace;font-size:1.15rem;font-weight:900}.results{display:flex;gap:6px;flex-wrap:wrap}.result{font-size:.72rem;font-weight:800;border-radius:999px;padding:5px 8px}.result.exact{background:var(--brand-soft);color:var(--brand-dark)}.result.misplaced{background:var(--blue-soft);color:var(--blue)}.result.absent{background:var(--red-soft);color:var(--red)}.notes-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;direction:ltr}.note-digit{border:1px solid var(--line);border-radius:12px;padding:10px;background:#fff}.note-digit.excluded{text-decoration:line-through;background:var(--red-soft);color:var(--red)}.position-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px;direction:ltr}.position-col{border:1px dashed #b9cec5;border-radius:14px;padding:8px;min-height:70px;text-align:center}.position-col small{display:block;color:var(--muted);direction:rtl}.chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.chip{border:0;border-radius:8px;background:var(--brand-soft);padding:4px 7px}.bottom-nav{position:fixed;z-index:30;bottom:0;left:0;right:0;display:flex;justify-content:center;background:rgba(255,255,255,.95);border-top:1px solid var(--line);padding:7px 8px calc(7px + var(--safe-bottom));backdrop-filter:blur(15px)}.bottom-nav button{border:0;background:transparent;color:var(--muted);width:min(19%,150px);min-height:55px;border-radius:13px;font-size:.7rem}.bottom-nav button span{display:block;font-size:1.2rem;margin-bottom:2px}.bottom-nav button.active{background:var(--brand-soft);color:var(--brand-dark);font-weight:900}.toast{position:fixed;z-index:60;bottom:calc(90px + var(--safe-bottom));left:50%;transform:translate(-50%,20px);opacity:0;background:#173c31;color:#fff;border-radius:14px;padding:12px 16px;transition:.2s;pointer-events:none;max-width:min(90vw,520px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.modal-backdrop{position:fixed;inset:0;z-index:50;background:rgba(3,31,23,.58);display:grid;place-items:center;padding:20px}.modal{width:min(100%,480px);background:#fff;border-radius:24px;padding:22px;box-shadow:var(--shadow)}.modal h2{margin-top:0}.field{display:grid;gap:7px;margin:12px 0}.field input,.field select{width:100%;min-height:46px;border:1px solid #b9cec5;border-radius:12px;padding:10px;background:#fff;color:var(--ink)}.ltr{direction:ltr;text-align:left}.tab-row{display:flex;gap:8px;overflow:auto;padding-bottom:4px}.tab-row button{white-space:nowrap}.table-wrap{overflow-x:auto}.ranking-table{width:100%;border-collapse:collapse}.ranking-table th,.ranking-table td{padding:12px;text-align:right;border-bottom:1px solid var(--line)}.preview-panel{border:1px dashed #d4a33d;background:#fffaf0}.step-list{counter-reset:steps;display:grid;gap:10px}.step{display:flex;gap:10px;align-items:start}.step:before{counter-increment:steps;content:counter(steps);display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--brand);color:#fff;font-weight:900;flex:0 0 auto}.empty{text-align:center;padding:28px;color:var(--muted)}body.theme-night{--bg:#10231e;--surface:#17332a;--ink:#f2fff9;--muted:#abc3b9;--line:#2b4c40;--brand-soft:#204d3e;background:#10231e}body.theme-night .key,body.theme-night .note-digit,body.theme-night .field input,body.theme-night .field select{background:#17332a;color:#fff}body.theme-sand{--bg:#f4efe5;--surface:#fffaf0;--brand:#54714f;--brand-dark:#354d31;--brand-soft:#e5ebdb;--line:#ddd5c3}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}body.reduce-motion *{scroll-behavior:auto!important;transition:none!important}@media(max-width:760px){.grid-2,.grid-3,.game-layout{grid-template-columns:1fr}.hero{padding:20px}.attempt{grid-template-columns:auto 58px 1fr}.digit-slot{width:64px;height:70px}.section-title{align-items:start;flex-direction:column}.topbar{padding-inline:14px}}@media(max-width:390px){main{padding-inline:11px}.card{padding:14px}.digit-slot{width:58px;height:64px}.bottom-nav button{font-size:.64rem}.results{gap:4px}.result{font-size:.66rem;padding:4px 6px}}@media(orientation:landscape) and (max-height:520px){.bottom-nav{position:sticky}.game-layout{grid-template-columns:1fr 1fr}body{padding-bottom:0}}@media(min-width:1000px){.topbar{padding-block:14px}.bottom-nav{max-width:720px;left:50%;right:auto;transform:translateX(-50%);border:1px solid var(--line);border-bottom:0;border-radius:22px 22px 0 0}}