:root{color:#24304f;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at 10% 12%,#ffe16ab8,#0000 28%),radial-gradient(circle at 84% 15%,#78c8ff9e,#0000 32%),radial-gradient(circle at 74% 92%,#ff82a980,#0000 28%),linear-gradient(135deg,#fff5bc 0%,#d9fbec 48%,#e7f4ff 100%);font-family:Inter,ui-rounded,Nunito,Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}#root{place-items:center;min-height:100vh;padding:12px;display:grid}.app-shell{grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) 330px;gap:14px;width:min(1220px,100vw - 24px);min-height:min(620px,100vh - 24px);display:grid}.hero-panel,.game-panel,.side-panel{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffc7;border:2px solid #ffffffc7;border-radius:28px;box-shadow:0 28px 70px #47538029}.hero-panel{grid-column:1/2;justify-content:space-between;align-items:center;gap:18px;padding:18px 22px;display:flex}.brand-row{align-items:center;gap:14px;display:flex}.bear-mark{background:linear-gradient(145deg,#fff4a0,#ffb16c 58%,#ff82a9);border-radius:20px;place-items:center;width:58px;height:58px;font-size:33px;display:grid;box-shadow:0 16px 28px #ff82a938}h1,h2,p{margin:0}h1{color:#24304f;font-size:34px;line-height:1.05}.hero-panel p{color:#627095;margin-top:6px;font-size:15px;font-weight:750}.start-button,.speaker-button,.word-card,.category,.soft-button{font:inherit;cursor:pointer;border:0}.start-button{color:#fff;background:linear-gradient(135deg,#ff689a,#ffb16c);border-radius:18px;min-width:132px;min-height:50px;font-size:17px;font-weight:950;box-shadow:0 18px 34px #ff689a3d}.game-panel{grid-column:1/2;align-content:start;gap:12px;padding:18px;display:grid}.game-topline{background:linear-gradient(135deg,#ffffffe0,#fff7dbc7);border-radius:24px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;min-height:142px;padding:18px 20px;display:grid}.section-label{color:#6b77a0;margin-bottom:8px;font-size:15px;font-weight:950;display:block}h2{color:#24304f;font-size:clamp(52px,7vw,86px);line-height:.95}.game-topline p{color:#53607d;margin-top:10px;font-size:23px;font-weight:900}.target-meaning{color:#7b86a8;min-height:32px;font-size:18px}.target-meaning.revealed{color:#53607d;font-size:23px}.speaker-button{color:#fff;background:linear-gradient(145deg,#78c8ff,#b998ff);border-radius:28px;width:84px;height:84px;font-size:37px;box-shadow:0 16px 30px #78c8ff3d}.feedback,.next-button,.previous-button{color:#55380b;text-align:center;background:#fff2b0;border-radius:16px;place-items:center;min-height:44px;padding:8px 16px;font-size:17px;font-weight:950;display:grid}.round-actions{grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:10px;display:grid}.next-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#69d7b1,#78c8ff);border:0;box-shadow:0 16px 28px #69d7b138}.previous-button{color:#25304e;cursor:pointer;background:#edf7ff;border:0;box-shadow:0 12px 22px #78c8ff29}.feedback.good{color:#126044;background:#dff8ec}.feedback.try{color:#7b2143;background:#ffe2ee}.choice-grid{grid-template-columns:repeat(4,minmax(132px,1fr));gap:10px;display:grid}.word-card{color:#24304f;background:linear-gradient(145deg,#fff,#fff0d8);border-radius:24px;grid-template-rows:1fr auto auto;place-items:center;gap:8px;min-height:162px;padding:14px;transition:transform .16s,box-shadow .16s;display:grid;box-shadow:inset 0 -8px #ffb16c1f,0 16px 26px #40476821}.word-card:hover,.word-card:focus-visible,.category:hover,.category:focus-visible,.soft-button:hover,.soft-button:focus-visible,.start-button:hover,.start-button:focus-visible,.speaker-button:hover,.speaker-button:focus-visible{outline-offset:3px;outline:3px solid #ff82a95c;transform:translateY(-2px)}.word-card:disabled{cursor:wait}.picture{aspect-ratio:1;background:linear-gradient(145deg,#fff9e6,#e8fbff);border-radius:30px;place-items:center;width:min(88px,64%);font-size:clamp(42px,5.4vw,66px);display:grid;box-shadow:inset 0 5px #ffffffc7,0 10px 20px #4047681a}.word-card strong{font-size:26px;line-height:1}.word-card span:last-child,.card-meaning{color:#687395;font-size:16px;font-weight:850}.card-meaning{color:#53607d;place-items:center;min-height:48px;font-size:20px;font-weight:950;display:grid}.card-meaning.revealed{min-height:auto;font-size:16px;font-weight:850}.side-panel{flex-direction:column;grid-area:1/2/3/3;gap:10px;padding:16px;display:flex}.score-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;display:grid}.metric{background:#fff8e8;border:1px solid #ffb16c5c;border-radius:17px;min-height:62px;padding:9px 11px}.metric span{color:#6e789b;font-size:13px;font-weight:950;display:block}.metric strong{color:#24304f;font-variant-numeric:tabular-nums;margin-top:4px;font-size:24px;line-height:1;display:block}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;display:grid}.category{color:#44506f;text-align:left;background:#ffffffb8;border-radius:12px;min-height:29px;padding:5px 8px;font-size:12px;font-weight:950}.category.active{color:#55380b;background:linear-gradient(135deg,#fff2b0,#ffd6c4)}.sound-panel{grid-template-columns:1fr 1fr;gap:8px;display:grid}.soft-button{color:#fff;background:linear-gradient(135deg,#ff82a9,#ffb16c);border-radius:15px;min-height:38px;font-size:15px;font-weight:950}.soft-button.alt{color:#55380b;background:linear-gradient(135deg,#ffe16a,#ffbf73);grid-column:1/-1}.volume-row{color:#24304f;background:#fff4c8c7;border-radius:15px;grid-column:1/-1;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;min-height:38px;padding:7px 10px;font-size:14px;font-weight:950;display:grid}.volume-row input{accent-color:#ff82a9;width:100%}.progress-box{color:#53607d;gap:8px;margin-top:auto;font-size:13px;font-weight:950;display:grid}.sync-status{color:#44506f;background:#78c8ff29;border-radius:12px;place-items:center;min-height:30px;font-size:12px;display:grid}.sync-status.saving{color:#55380b;background:#fff2b0}.sync-status.saved{color:#126044;background:#dff8ec}.sync-status.offline{color:#7b2143;background:#ffe2ee}.progress-track{background:#78c8ff2e;border-radius:999px;height:12px;overflow:hidden}.progress-track i{border-radius:inherit;background:linear-gradient(90deg,#69d7b1,#78c8ff,#b998ff);height:100%;display:block}@media (width<=980px){.app-shell{grid-template-rows:auto auto auto;grid-template-columns:1fr}.hero-panel,.game-panel,.side-panel{grid-column:1}.hero-panel{grid-row:1}.game-panel{grid-row:2}.side-panel{grid-row:3}}@media (width<=620px){.app-shell{grid-template-rows:auto auto;gap:10px;width:min(100vw - 18px,430px)}.hero-panel,.game-panel,.side-panel{border-radius:22px}.hero-panel{flex-direction:column;align-items:stretch;padding:16px}.bear-mark{width:52px;height:52px;font-size:30px}h1{font-size:30px}.start-button{width:100%}.game-panel{gap:10px;padding:14px}.game-topline{grid-template-columns:1fr auto;min-height:0;padding:15px}h2{font-size:clamp(44px,16vw,64px)}.speaker-button{border-radius:21px;width:64px;height:64px;font-size:30px}.choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.word-card{border-radius:20px;min-height:154px}.picture{width:min(82px,64%);font-size:clamp(38px,14vw,58px)}.word-card strong{font-size:21px}.side-panel{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}