:root{--bg:#fff4e6;--card:#fff;--screen-bg:#f3f1ee;--text:#3b2f2f;--muted:#8a7b72;--accent:#ff8a3d;--accent-dark:#e8691a;--yellow:#ffd166;--radius:16px;--shadow:0 4px 14px #78481e1f;--shadow-press:0 2px 6px #78481e24;color:var(--text);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;font-family:Nunito,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{background:var(--bg);min-height:100vh;margin:0}.app{max-width:480px;min-height:100vh;padding:16px;padding-top:max(16px, env(safe-area-inset-top));flex-direction:column;gap:16px;margin:0 auto;display:flex}@media (width>=600px){.app{max-width:700px}}.topbar{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.topbar__title{margin:0;font-size:1.5rem;font-weight:800}.coins{background:var(--yellow);box-shadow:var(--shadow-press);border-radius:999px;padding:6px 14px;font-size:1.15rem;font-weight:800}.coins.is-bumping{animation:.2s ease-out coin-bump}@keyframes coin-bump{0%{transform:scale(1)}45%{background:#ffe08a;transform:scale(1.22)}to{transform:scale(1)}}.screen-enter{animation:.18s ease-out screen-enter}@keyframes screen-enter{0%{opacity:0;transform:translateY(6px)scale(.985)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.screen-enter,.coins.is-bumping{animation:none}}.menu{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.menu__btn{border-radius:var(--radius);background:var(--card);min-height:56px;color:var(--text);font:inherit;box-shadow:var(--shadow);cursor:pointer;touch-action:manipulation;border:none;font-size:1.1rem;font-weight:700;transition:transform .1s,box-shadow .1s,background .15s}.menu__btn:active{box-shadow:var(--shadow-press);transform:scale(.96)}.menu__btn.is-active{background:var(--accent);color:#fff;box-shadow:0 0 0 3px var(--card), 0 0 0 6px var(--accent)}.menu__btn--wide{color:#fff;background:linear-gradient(135deg,#ff9a8b,#ffc371);grid-column:1/-1}.menu__btn--wide.is-active{background:var(--accent-dark);box-shadow:0 0 0 3px var(--card), 0 0 0 6px var(--accent-dark)}.menu__btn:focus-visible{outline:3px solid var(--accent-dark);outline-offset:2px}@media (width>=600px){.menu{grid-template-columns:repeat(3,1fr)}.menu__btn--wide{grid-column:auto}}.screen{background:var(--screen-bg);border-radius:var(--radius);flex-direction:column;flex:1;min-height:280px;padding:20px;display:flex;box-shadow:inset 0 2px 6px #0000000d}.home{flex-direction:column;gap:20px;display:flex}.home__hero{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;align-items:center;gap:8px;padding:20px 16px 16px;display:flex}.home__greeting{margin:0;font-size:1.4rem;font-weight:800}.avatar{width:120px;height:120px;margin-bottom:16px;font-size:88px;line-height:1;position:relative}.avatar__layer{pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.avatar__top{font-size:.5em;top:92%}.avatar__glasses{font-size:.42em;top:46%}.avatar__hat{font-size:.5em;top:6%}.avatar__accessory{font-size:.35em;top:70%;left:92%}.game-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.game-card{background:var(--card);border-radius:var(--radius);min-height:130px;box-shadow:var(--shadow);color:var(--text);touch-action:manipulation;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:16px 8px;text-decoration:none;transition:transform .1s,box-shadow .1s;display:flex}.game-card:active{box-shadow:var(--shadow-press);transform:scale(.96)}.game-card:focus-visible{outline:3px solid var(--accent-dark);outline-offset:2px}.game-card__emoji{font-size:3rem;line-height:1}.game-card__name{text-align:center;font-size:1.15rem;font-weight:800}.shop{flex-direction:column;align-items:center;gap:12px;display:flex}.shop__message{left:50%;bottom:max(24px, env(safe-area-inset-bottom));z-index:10;border-radius:var(--radius);color:#b3261e;text-align:center;pointer-events:none;opacity:0;background:#ffe1e1;width:min(448px,100% - 32px);margin:0;padding:14px;font-size:1.15rem;font-weight:800;transition:opacity .2s,transform .2s;position:fixed;transform:translate(-50%,12px);box-shadow:0 6px 20px #781e1e40}.shop__message.is-visible{opacity:1;transform:translate(-50%)}.shop__heading{align-self:flex-start;margin:8px 0 0;font-size:1.2rem;font-weight:800}.shop__grid{grid-template-columns:repeat(2,1fr);gap:12px;width:100%;display:grid}.shop-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);border:3px solid #0000;flex-direction:column;align-items:center;gap:4px;padding:14px 10px;display:flex}.shop-card.is-equipped{border-color:#6cc070}.shop-card__emoji{font-size:2.6rem;line-height:1.1}.shop-card__name{text-align:center;font-weight:800}.shop-card__price{color:var(--muted);font-weight:700}.shop-card__btn,.shop-card__status{width:100%;min-height:44px;font:inherit;border-radius:12px;justify-content:center;align-items:center;margin-top:6px;font-size:1.05rem;font-weight:800;display:flex}.shop-card__btn{background:var(--accent);color:#fff;cursor:pointer;touch-action:manipulation;border:none;transition:transform .1s}.shop-card__btn:active{transform:scale(.95)}.shop-card__btn:focus-visible{outline:3px solid var(--accent-dark);outline-offset:2px}.shop-card__btn--equip{background:#4a90d9}.shop-card__status{color:#2e7d32}.lava{flex-direction:column;align-items:center;gap:12px;display:flex}.lava__info{width:100%;color:var(--muted);justify-content:space-between;gap:8px;font-weight:800;display:flex}.lava__record{color:#b7791f}.lava__message{border-radius:var(--radius);background:var(--card);text-align:center;width:100%;min-height:48px;margin:0;padding:12px;font-size:1.1rem;font-weight:800}.lava__message--bad{color:#b3261e;background:#ffe1e1}.lava__message--good{color:#2e7d32;background:#dff5e1}.lava__board{grid-template-columns:repeat(var(--cols), 1fr);gap:6px;width:100%;margin:0 auto;display:grid}.lava__cell{aspect-ratio:1;background:var(--card);box-shadow:var(--shadow-press);border-radius:12px;justify-content:center;align-items:center;font-size:1.6rem;line-height:1;display:flex}.lava__cell--lava{background:#3b2320}.lava__cell--goal{background:#7ed283}.lava__cell--player{box-shadow:0 0 0 3px var(--accent);background:#ffe6a8}.lava__controls{grid-template-columns:repeat(3,72px);grid-template-areas:".up.""left down right";gap:8px;display:grid}.lava__arrow--up{grid-area:up}.lava__arrow--left{grid-area:left}.lava__arrow--down{grid-area:down}.lava__arrow--right{grid-area:right}.lava__arrow,.lava__restart{border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);font:inherit;cursor:pointer;touch-action:manipulation;border:none;transition:transform .1s}.lava__arrow{height:64px;font-size:1.8rem}.lava__restart{min-height:52px;color:var(--text);padding:0 24px;font-size:1.1rem;font-weight:800}.lava__arrow:active,.lava__restart:active{transform:scale(.94)}.lava__arrow:focus-visible,.lava__restart:focus-visible{outline:3px solid var(--accent-dark);outline-offset:2px}.bb{--mini:18px;-webkit-user-select:none;user-select:none;flex-direction:column;gap:12px;display:flex}.bb--blue{--piece:#4a90d9}.bb--green{--piece:#52b863}.bb--yellow{--piece:#f2c230}.bb--purple{--piece:#9b6bd6}.bb--red{--piece:#e5534b}.bb__info{justify-content:space-between;gap:8px;font-weight:800;display:flex}.bb__score{font-size:1.3rem}.bb__record{color:#b7791f;align-self:center}.bb__message{border-radius:var(--radius);background:var(--card);text-align:center;min-height:48px;margin:0;padding:12px;font-size:1.05rem;font-weight:800}.bb__message--bad{color:#b3261e;background:#ffe1e1}.bb__message--good{color:#2e7d32;background:#dff5e1}.bb__message--info{color:#1f5fa8;background:#e3efff}.bb__board-wrap{position:relative}.bb__board{grid-template-columns:repeat(var(--size), 1fr);border-radius:var(--radius);touch-action:manipulation;background:#d9d3cc;gap:4px;padding:8px;display:grid}.bb__board.is-shaking{animation:.35s bb-shake}@keyframes bb-shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}.bb__cell{aspect-ratio:1;cursor:pointer;background:#f4f1ed;border-radius:6px}.bb__cell--filled{background:var(--piece);box-shadow:inset 0 -3px #0000002e}.bb__cell--preview{background:#b8e3bd}.bb__cell--preview-bad{background:#f5a3a3!important}.bb__cell--cleared{animation:.45s bb-clear}@keyframes bb-clear{0%{background:#fff6b3;transform:scale(1.15)}to{background:#f4f1ed;transform:scale(1)}}.bb__over{border-radius:var(--radius);text-align:center;background:#ffffffe0;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex;position:absolute;inset:0}.bb__over[hidden]{display:none}.bb__over-text{margin:0;font-size:1.5rem;font-weight:800}.bb__restart{border-radius:var(--radius);background:var(--accent);color:#fff;min-height:56px;font:inherit;box-shadow:var(--shadow);cursor:pointer;touch-action:manipulation;border:none;padding:0 28px;font-size:1.2rem;font-weight:800}.bb__restart:active{transform:scale(.95)}.bb__tray{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.bb__slot{border-radius:var(--radius);background:var(--card);min-height:104px;box-shadow:var(--shadow);cursor:pointer;touch-action:manipulation;border:3px solid #0000;justify-content:center;align-items:center;padding:8px;transition:transform .12s,border-color .12s;display:flex}.bb__slot:disabled{box-shadow:none;cursor:default;background:0 0;border:3px dashed #d9d3cc}.bb__slot.is-selected{border-color:var(--accent);transform:translateY(-4px)scale(1.04);box-shadow:0 8px 18px #ff8a3d59}.bb__slot.is-blocked{opacity:.4}.bb__slot:focus-visible,.bb__restart:focus-visible{outline:3px solid var(--accent-dark);outline-offset:2px}.bb__piece{gap:3px;display:grid}.bb__block{background:var(--piece);border-radius:4px;box-shadow:inset 0 -2px #0000002e}@media (width>=440px){.bb{--mini:22px}}@media (width>=600px){.bb{--mini:26px}.bb__slot{min-height:140px}.bb__board-wrap{width:min(100%,max(320px,100dvh - 540px));margin:0 auto}.lava__board{max-width:max(320px,85.7143dvh - 522.857px)}}.ph{--marker:34px;-webkit-user-select:none;user-select:none;flex-direction:column;align-items:center;gap:16px;display:flex}.ph__info{justify-content:space-between;gap:8px;width:100%;font-weight:800;display:flex}.ph__record{color:#b7791f}.ph__bar{width:100%;height:64px;padding:0 calc(var(--marker) / 2);background:#e2ddd7;border-radius:999px;box-shadow:inset 0 3px 8px #0000001f}.ph__track{height:100%;position:relative}.ph__zone{background:#7ed283;border-radius:8px;position:absolute;top:10px;bottom:10px}.ph__perfect{background:#2e9e45;border-radius:4px;position:absolute;top:10px;bottom:10px}.ph__marker{width:var(--marker);height:var(--marker);will-change:left;background:#2f7fd8;border:4px solid #fff;border-radius:50%;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 2px 8px #0000004d}.ph__result{border-radius:var(--radius);background:var(--card);text-align:center;width:100%;min-height:56px;margin:0;padding:14px;font-size:1.2rem;font-weight:800}.ph__result--perfect{color:#2e7d32;background:#dff5e1}.ph__result--good{color:#1f5fa8;background:#e3efff}.ph__result--miss{color:#9a5b00;background:#fff1d6}.ph__hit,.ph__again{border-radius:var(--radius);width:100%;font:inherit;box-shadow:var(--shadow);cursor:pointer;touch-action:manipulation;border:none;font-weight:800;transition:transform 80ms,opacity .15s}.ph__hit{background:var(--accent);color:#fff;letter-spacing:.05em;min-height:110px;font-size:2rem}.ph__again{background:var(--card);min-height:56px;color:var(--text);font-size:1.2rem}.ph__hit:active:not(:disabled),.ph__again:active:not(:disabled){transform:scale(.97)}.ph__hit:disabled,.ph__again:disabled{opacity:.4;cursor:default;box-shadow:none}.ph__reset{min-height:44px;color:var(--muted);font:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:none;padding:0 16px;font-weight:700;text-decoration:underline}.ph__reset[hidden]{display:none}.ph__hit:focus-visible,.ph__again:focus-visible,.ph__reset:focus-visible{outline:3px solid var(--accent-dark);outline-offset:2px}.cord{flex-direction:column;gap:14px;display:flex}.cord__clues-card{border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);padding:18px 20px}.cord__title{margin:0 0 10px;font-size:1.3rem;font-weight:800}.cord__clues{flex-direction:column;gap:8px;margin:0;padding:0;font-size:1.2rem;font-weight:700;list-style:none;display:flex}.cord__length{color:var(--muted);margin:12px 0 0;font-weight:700}.cord__form{gap:10px;display:flex}.cord__label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.cord__input{border-radius:var(--radius);background:var(--card);min-width:0;min-height:60px;color:var(--text);font:inherit;letter-spacing:.08em;text-transform:uppercase;border:3px solid #e2ddd7;flex:1;padding:0 16px;font-size:1.5rem;font-weight:800}.cord__input::placeholder{color:#b9aea5;letter-spacing:normal;text-transform:none;font-weight:700}.cord__input:focus{border-color:var(--accent);outline:none}.cord__input:disabled{color:#2e7d32;background:#dff5e1;border-color:#6cc070}.cord__input.is-shaking{border-color:#e5534b;animation:.35s bb-shake}.cord__guess,.cord__new{border-radius:var(--radius);font:inherit;box-shadow:var(--shadow);cursor:pointer;touch-action:manipulation;border:none;font-weight:800;transition:transform 80ms}.cord__guess{background:var(--accent);color:#fff;white-space:nowrap;min-height:60px;padding:0 20px;font-size:1.15rem}.cord__new{background:var(--card);min-height:56px;color:var(--text);font-size:1.15rem}.cord__guess:active,.cord__new:active{transform:scale(.96)}.cord__guess:focus-visible,.cord__new:focus-visible{outline:3px solid var(--accent-dark);outline-offset:2px}.cord__message{border-radius:var(--radius);text-align:center;min-height:56px;margin:0;padding:14px;font-size:1.2rem;font-weight:800}.cord__message--good{color:#2e7d32;background:#dff5e1}.cord__message--bad{color:#b3261e;background:#ffe1e1}@media (width<=420px){.screen{padding:12px}.bb__board{gap:3px;padding:6px}}
