:root{--ink:#33302b;--ink-soft:#6e6860;--paper:#fff;--tile:#ede9e1;--tile-sel:#4e4a45;--line:#e3dfd7;--y:#f6d55c;--y-ink:#4a3b08;--g:#82cb78;--g-ink:#17400f;--b:#7fa9e6;--b-ink:#0f2c57;--p:#b79be0;--p-ink:#2d1b54;--ball:#cddc39;--radius:12px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--paper);color:var(--ink);min-height:100svh;padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);padding-bottom:calc(24px + env(safe-area-inset-bottom));margin:0;font-family:Nunito,system-ui,-apple-system,Segoe UI,sans-serif}.app{max-width:600px;margin:0 auto;padding:0 14px}button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid var(--ink);outline-offset:2px;border-radius:10px}[hidden]{display:none!important}.site-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;margin-bottom:16px;padding:14px 0 10px;display:flex}.header-left{align-items:center;display:flex}.brand-title{color:var(--ink);letter-spacing:-.01em;align-items:center;gap:10px;font-size:1.45rem;font-weight:800;text-decoration:none;transition:opacity .15s;display:inline-flex}.brand-title:hover{opacity:.85}.brand-icon{object-fit:contain;border-radius:6px;flex:0 0 30px;width:30px;height:30px}.icon-btn{width:42px;height:42px;color:var(--ink);cursor:pointer;background:0 0;border:none;border-radius:50%;flex:0 0 42px;justify-content:center;align-items:center;padding:0;transition:transform .15s,background .15s;display:inline-flex}.icon-btn:hover{background:#0000000f}.icon-btn:active{transform:scale(.94)}.icon-btn svg{width:26px;height:26px}.header-right{align-items:center;gap:4px;display:flex}.icon-sun{display:none}.hero-section{text-align:center;margin:12px 0 24px}.hero-section h2{letter-spacing:-.02em;margin:0 0 6px;font-size:clamp(1.5rem,5vw,2rem);font-weight:800}.hero-sub{color:var(--ink-soft);margin:0;font-size:.95rem;font-weight:600}.dashboard-grid{flex-direction:column;gap:16px;margin-bottom:24px;display:flex}.dash-card{background:var(--paper);border:2px solid var(--line);border-radius:18px;flex-direction:column;gap:12px;padding:20px;transition:transform .2s,border-color .2s,box-shadow .2s;display:flex;position:relative}.dash-card.featured{border-color:var(--ink);box-shadow:0 4px 16px #0000000f}.dash-card.featured:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000001a}.dash-card.disabled{opacity:.75;background:var(--tile);border-style:dashed}.card-badge{letter-spacing:.08em;background:var(--y);color:var(--y-ink);text-transform:uppercase;border-radius:999px;align-self:flex-start;padding:4px 10px;font-size:.7rem;font-weight:800}.badge-muted{background:var(--line);color:var(--ink-soft)}.card-icon{width:40px;height:40px}.card-icon svg{width:100%;height:100%;color:var(--ink);display:block}.card-content h3{margin:0 0 6px;font-size:1.25rem;font-weight:800}.card-content p{color:var(--ink-soft);margin:0;font-size:.9rem;font-weight:600;line-height:1.4}.card-footer{margin-top:4px}.btn-play{gap:10px;width:100%;font-size:1rem}.btn-play svg{width:20px;height:20px}.btn-muted{border:2px solid var(--line);width:100%;color:var(--ink-soft);cursor:not-allowed;background:0 0}.game-nav{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.btn-back{color:var(--ink-soft);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:6px 0;font-family:inherit;font-size:.9rem;font-weight:700;transition:color .15s,transform .12s;display:inline-flex}.btn-back:hover{color:var(--ink);transform:translate(-3px)}.btn-back svg{width:18px;height:18px}.game-header-title{text-align:center;margin-bottom:16px}.game-header-title h2{margin:0 0 4px;font-size:clamp(1.4rem,5.5vw,1.85rem);font-weight:800}.tagline{text-align:center;color:var(--ink-soft);margin:2px 0 10px;font-size:.9rem;font-weight:600}.puzzle-tag{text-align:center;color:var(--ink-soft);letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px;font-size:.78rem;font-weight:700}[data-theme=dark]{--ink:#f2efe9;--ink-soft:#a5a096;--paper:#121212;--tile:#1e1e1c;--tile-sel:#ece7da;--line:#2e2c28;--y:#e5c237;--y-ink:#1c1600;--g:#68b75e;--g-ink:#082003;--b:#6290d9;--b-ink:#051936;--p:#a07ed4;--p-ink:#1a0d38;--ball:#d4e157}[data-theme=dark] .icon-moon{display:none}[data-theme=dark] .icon-sun{display:block}[data-theme=dark] .icon-btn:hover{background:#ffffff1a}[data-theme=dark] .tile{background:var(--tile);color:var(--ink);box-shadow:0 1px 3px #0000004d}[data-theme=dark] .tile:hover{background:#282824}[data-theme=dark] .tile.sel{background:var(--tile-sel);color:#121212}[data-theme=dark] .btn{color:var(--ink);background:#1e1e1c;border-color:#48443e}[data-theme=dark] .btn:hover{background:#2a2a26}[data-theme=dark] .btn:disabled:hover{background:#1e1e1c}[data-theme=dark] .btn-solid{background:var(--ink);color:#121212;border-color:var(--ink)}[data-theme=dark] .btn-solid:hover{background:#ddd8cd}[data-theme=dark] .modal{background:#000000bf}[data-theme=dark] .modal-card{color:var(--ink);background:#1a1a18;border-color:#33312e}[data-theme=dark] .modal-x{color:var(--ink);background:#222220;border-color:#48443e}[data-theme=dark] .modal-x:hover{background:#2c2c28}[data-theme=dark] .toast{color:#121212;background:#e5e1d5}[data-theme=dark] .ball.off{color:#3d3b36;opacity:.5}[data-theme=dark] .dist-fill{background:#363430}.board{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.tile{text-align:center;background:var(--tile);min-height:72px;color:var(--ink);border-radius:var(--radius);text-transform:uppercase;letter-spacing:.02em;overflow-wrap:break-word;-webkit-hyphens:none;hyphens:none;cursor:pointer;-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;padding:8px 7px;font-family:inherit;font-size:clamp(.72rem,.6rem + .9vw,1.02rem);font-weight:700;line-height:1.15;transition:background .15s,color .15s,transform .15s;display:flex}.tile.sm{font-size:clamp(.66rem,.55rem + .75vw,.9rem)}.tile.xs{font-size:clamp(.58rem,.48rem + .65vw,.78rem);line-height:1.12}.tile:hover{background:#e3ded3}.tile.sel{background:var(--tile-sel);color:#fff}.tile[disabled]{cursor:default}.tile.pop{animation:.28s pop}.tile.shake{animation:.45s shake}.solved-bar{border-radius:var(--radius);text-align:center;grid-column:1/-1;padding:12px 14px;animation:.5s both barIn}.solved-bar h3{text-transform:uppercase;letter-spacing:.04em;margin:0 0 3px;font-size:clamp(.82rem,3vw,1rem);font-weight:800}.solved-bar p{text-transform:uppercase;letter-spacing:.03em;margin:0;font-size:clamp(.72rem,2.6vw,.88rem);font-weight:700}.attempts{justify-content:center;align-items:center;gap:10px;margin:16px 0 4px;display:flex}.balls{gap:7px;display:inline-flex}.ball{width:26px;height:26px;color:var(--ball);display:inline-flex}.ball svg{width:100%;height:100%;display:block}.ball.bounce{animation:.6s ballBounce}.ball.off{color:#dfdcd3;opacity:.55}.attempts-label{font-size:.92rem;font-weight:700}.controls{flex-wrap:wrap;justify-content:center;gap:8px;margin:14px 0 6px;display:flex}.btn{border:2px solid var(--ink);min-height:44px;color:var(--ink);cursor:pointer;background:#fff;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-family:inherit;font-size:.95rem;font-weight:700;transition:background .15s,transform .12s,opacity .15s;display:inline-flex}.btn:hover{background:#f1eee8}.btn:active{transform:scale(.96)}.btn:disabled{opacity:.35;cursor:not-allowed;transform:none}.btn:disabled:hover{background:#fff}.btn-solid{background:var(--ink);color:#fff}.btn-solid:hover{background:#4a4641}.btn-solid:disabled:hover{background:var(--ink)}.end-actions{justify-content:center;margin:18px 0 4px;display:flex}.toast{left:50%;bottom:calc(20px + env(safe-area-inset-bottom));background:var(--ink);color:#fff;text-align:center;opacity:0;pointer-events:none;z-index:80;border-radius:999px;max-width:min(90vw,480px);padding:11px 20px;font-size:.92rem;font-weight:700;transition:transform .28s,opacity .28s;position:fixed;transform:translate(-50%,90px)}.toast.show{opacity:1;transform:translate(-50%)}.modal{z-index:60;padding:18px;padding-bottom:calc(18px + env(safe-area-inset-bottom));background:#33302b80;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.modal.open{display:flex}.modal-card{color:var(--ink);border:2px solid var(--line);background:#fff;border-radius:20px;width:100%;max-width:520px;max-height:86svh;padding:24px 22px 22px;animation:.3s both cardIn;position:relative;overflow:auto}.modal-card h2{margin:0 44px 12px 0;font-size:1.35rem;font-weight:800;line-height:1.1}.modal-x{border:2px solid var(--ink);cursor:pointer;width:44px;height:44px;color:var(--ink);background:#fff;border-radius:50%;justify-content:center;align-items:center;display:inline-flex;position:absolute;top:12px;right:12px}.modal-x:hover{background:#f1eee8}.modal-x svg{width:18px;height:18px}.modal-card p{margin:0 0 12px;font-size:.95rem;line-height:1.45}.modal-card ul{margin:0 0 12px;padding-left:20px;font-size:.95rem;line-height:1.5}.modal-card li{margin-bottom:5px}.example-grid{grid-template-columns:repeat(4,1fr);gap:6px;margin:10px 0;display:grid}.example-grid .tile{pointer-events:none;min-height:44px;padding:6px 4px;font-size:clamp(.5rem,2.4vw,.68rem)}.example-arrow{color:var(--ink-soft);justify-content:center;margin:6px 0;display:flex}.example-arrow svg{width:20px;height:20px}.legend{flex-direction:column;gap:6px;margin:10px 0 14px;display:flex}.legend-item{align-items:center;gap:10px;font-size:.88rem;font-weight:700;display:flex}.legend-chip{border-radius:999px;flex:0 0 44px;height:22px}.chip-y{background:var(--y)}.chip-g{background:var(--g)}.chip-b{background:var(--b)}.chip-p{background:var(--p)}.end-block{border:2px solid var(--line);text-align:center;border-radius:16px;margin-bottom:16px;padding:16px}.end-block h3{margin:0 0 4px;font-size:1.15rem;font-weight:800}.end-block p{color:var(--ink-soft);margin:0 0 10px;font-size:.88rem;font-weight:600}.share-pre{white-space:pre-wrap;word-break:break-word;background:var(--tile);text-align:left;border-radius:12px;margin:0 0 12px;padding:12px;font-family:inherit;font-size:.85rem;font-weight:700;line-height:1.5}.end-actions-modal{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.stats-grid{text-align:center;grid-template-columns:repeat(4,1fr);gap:6px;margin:0 0 18px;display:grid}.stat-num{font-size:clamp(1.3rem,6vw,1.7rem);font-weight:800;line-height:1}.stat-lbl{color:var(--ink-soft);margin-top:3px;font-size:.72rem;font-weight:600}.dist-title{margin:0 0 8px;font-size:.95rem;font-weight:800}.dist-row{grid-template-columns:34px 1fr 26px;align-items:center;gap:8px;margin-bottom:6px;font-size:.85rem;font-weight:700;display:grid}.dist-track{height:22px}.dist-fill{background:#cfc9be;border-radius:6px;min-width:4px;height:100%;transition:width .5s}.dist-fill.mine{background:var(--y)}.dist-count{text-align:right;font-variant-numeric:tabular-nums}.empty-note{color:var(--ink-soft);text-align:center;font-size:.9rem;font-weight:600}@keyframes pop{0%{transform:scale(1)}45%{transform:scale(1.09)}to{transform:scale(1)}}@keyframes shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(4px)}30%,50%,70%{transform:translate(-7px)}40%,60%{transform:translate(7px)}}@keyframes barIn{0%{opacity:0;transform:translateY(16px)scale(.96)}55%{opacity:1;transform:translateY(-3px)scale(1.01)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes cardIn{0%{opacity:0;transform:translateY(18px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ballBounce{0%{transform:translateY(0)}30%{transform:translateY(-13px)}55%{transform:translateY(0)}75%{transform:translateY(-5px)}to{transform:translateY(0)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.grid-main-container{max-width:540px;margin:0 auto;padding:0 4px;overflow-x:hidden}.grid-attempts-bar{text-align:center;color:var(--ink-soft);margin-bottom:14px;font-size:1rem;font-weight:700}.grid-attempts-bar strong{color:var(--ink);font-size:1.15rem}.tennis-grid-board{box-sizing:border-box;grid-template-columns:minmax(60px,1fr) repeat(3,1fr);gap:clamp(3px,1.2vw,6px);width:100%;margin-bottom:20px;display:grid}.grid-header-corner{background:0 0;justify-content:center;align-items:center;font-size:clamp(1rem,4vw,1.4rem);display:flex}.grid-header-col,.grid-header-row{text-align:center;text-transform:uppercase;background:var(--tile);color:var(--ink);word-break:break-word;-webkit-hyphens:auto;hyphens:auto;border-radius:10px;justify-content:center;align-items:center;padding:clamp(4px,1.5vw,8px) clamp(3px,1vw,6px);font-size:clamp(.58rem,2vw,.82rem);font-weight:800;line-height:1.2;display:flex}.grid-header-row{text-align:center;justify-content:center}.grid-cell{aspect-ratio:1;text-align:center;background:var(--paper);border:2px dashed var(--line);border-radius:var(--radius);color:var(--ink);cursor:pointer;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;min-height:0;padding:clamp(4px,1.5vw,8px);transition:all .15s;display:flex}.grid-cell:hover:not(:disabled){border-color:var(--ink);background:var(--tile)}.grid-cell .cell-plus{color:var(--ink-soft);font-size:clamp(1rem,4vw,1.4rem);font-weight:700}.grid-cell.solved{background:var(--g);color:var(--g-ink);border:none;box-shadow:0 2px 8px #00000014}.cell-player-name{word-break:break-word;-webkit-hyphens:auto;hyphens:auto;margin-bottom:2px;font-size:clamp(.6rem,2.2vw,.92rem);font-weight:800;line-height:1.15}.cell-player-flag{font-size:clamp(.65rem,2.5vw,.85rem)}@media (width<=520px){.tennis-grid-board{gap:4px}.grid-header-col,.grid-header-row{padding:5px 3px;font-size:clamp(.55rem,1.8vw,.75rem)}.grid-cell{padding:5px}}@media (width<=430px){.grid-main-container{padding:0}.tennis-grid-board{gap:3px}.grid-header-col,.grid-header-row{border-radius:7px;padding:4px 2px;font-size:.58rem}.grid-cell{border-radius:10px;padding:4px}.cell-player-name,.cell-player-flag{font-size:.6rem}.grid-attempts-bar{margin-bottom:10px;font-size:.88rem}#view-tennis-grid .grid-main-container{margin:0}}.grid-help-example{grid-template-columns:1fr 1fr 1fr;gap:5px;margin:14px 0 6px;display:grid}.ghe-corner{justify-content:center;align-items:center;font-size:1.2rem;display:flex}.ghe-header,.ghe-rowh{text-align:center;text-transform:uppercase;background:var(--tile);color:var(--ink);border-radius:8px;justify-content:center;align-items:center;padding:6px 4px;font-size:.72rem;font-weight:800;line-height:1.2;display:flex}.ghe-cell{text-align:center;border-radius:8px;justify-content:center;align-items:center;padding:8px 4px;font-size:.72rem;font-weight:700;line-height:1.25;display:flex}.ghe-correct{background:var(--g);color:var(--g-ink)}.ghe-wrong{color:#fff;background:#f87171;font-size:1rem;font-weight:900}.ghe-empty{background:var(--tile);color:var(--ink-soft);border:2px dashed var(--line);font-size:1.1rem;font-weight:900}.help-caption{color:var(--ink-soft);text-align:center;margin:-2px 0 12px;font-size:.78rem}[data-theme=dark] .ghe-header,[data-theme=dark] .ghe-rowh{background:#1e1e1c}[data-theme=dark] .ghe-empty{background:#1e1e1c;border-color:#33312e}.modal-search-card{max-width:440px;padding-bottom:16px}.search-criteria-subtitle{color:var(--ink-soft);margin:-6px 0 14px;font-size:.88rem}.search-criteria-subtitle strong{color:var(--ink)}.search-box-wrap{margin-bottom:12px}.player-search-input{border:2px solid var(--line);background:var(--paper);width:100%;color:var(--ink);border-radius:12px;outline:none;padding:12px 16px;font-family:inherit;font-size:.95rem;font-weight:700;transition:border-color .15s}.player-search-input:focus{border-color:var(--ink)}.player-results-list{flex-direction:column;gap:6px;max-height:260px;padding-right:4px;display:flex;overflow-y:auto}.player-item-btn{background:var(--tile);color:var(--ink);cursor:pointer;border:none;border-radius:10px;justify-content:space-between;align-items:center;padding:10px 14px;font-family:inherit;font-size:.92rem;font-weight:700;transition:background .15s;display:flex}.player-item-btn:hover{background:var(--line)}.player-item-btn.already-used{opacity:.4;cursor:not-allowed}.no-results{text-align:center;color:var(--ink-soft);margin:0;padding:16px 0;font-weight:600}[data-theme=dark] .grid-header-col,[data-theme=dark] .grid-header-row{color:var(--ink);background:#1e1e1c}[data-theme=dark] .grid-cell{background:#161614;border-color:#33312e}[data-theme=dark] .grid-cell:hover:not(:disabled){border-color:var(--ink);background:#242420}[data-theme=dark] .grid-cell.solved{background:var(--g);color:var(--g-ink)}[data-theme=dark] .player-search-input{color:var(--ink);background:#1e1e1c;border-color:#33312e}[data-theme=dark] .player-item-btn{color:var(--ink);background:#1e1e1c}[data-theme=dark] .player-item-btn:hover{background:#2e2c28}