:root{--safe-area-bottom: env(safe-area-inset-bottom, 0px);font-family:system-ui,sans-serif;color:#183e37;background:#f6f8f3}body{margin:0}main{max-width:1100px;margin:auto;padding:24px}button{font:inherit;min-height:52px;cursor:pointer;padding:12px 24px;border:0;border-radius:16px;background:#17675a;color:#fff}button:focus-visible{outline:4px solid #e9ab32;outline-offset:4px}.app-header{display:flex;align-items:center;justify-content:space-between;padding:20px 32px;border-bottom:1px solid #dbe4dc;background:#fff}.brand{display:flex;align-items:center;gap:10px;background:none;color:#17675a;font-weight:900;font-size:22px;padding:0}.brand img{width:40px}.brand span{font-size:14px}.header-tag,.eyebrow{font-size:13px;letter-spacing:.09em;font-weight:700;color:#648078}.page-heading{display:flex;align-items:center;gap:16px;margin:20px 0 28px}.page-heading h1{font-size:28px;margin:7px 0}.page-heading p{color:#648078}.pill{margin-left:auto;background:#e6eee5;padding:10px 16px;border-radius:99px;font-size:13px;font-weight:700;white-space:nowrap}.primary{background:#17675a;display:flex;justify-content:space-between;align-items:center;gap:24px;font-weight:800;box-shadow:0 4px #0b4e43}.secondary{background:#edf2e8;color:#17675a}.hero{display:grid;grid-template-columns:1fr 1fr;background:#e9efe1;border-radius:28px;overflow:hidden;min-height:350px}.hero-copy{padding:42px}.hero-label{font-size:11px;letter-spacing:.18em;color:#648078}.hero h2{font-size:42px;line-height:1.4;margin:16px 0;color:#174e42}.hero p{font-size:15px;line-height:1.9;color:#567366}.hero small{display:block;margin-top:18px;color:#648078;font-size:12px}.hero-art{position:relative;align-self:stretch;background:#e0ead5;overflow:hidden;min-height:280px}.landscape{position:absolute;width:100%;height:100%;object-fit:cover;bottom:0}.hero-art .explorer{position:absolute;bottom:15px;left:38%;width:190px}.floating-star{position:absolute;top:20%;left:22%;font-size:60px;color:#e6a83c}.character{width:155px;height:165px;overflow:visible}.launch{text-align:center;padding:30px}.launch h1{font-size:40px}.launch .primary{margin:24px auto;min-width:230px}.launch .character{width:200px;height:220px}.grade-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grade-card{padding:28px;color:#183e37;background:#e4eddc;display:flex;align-items:center;gap:20px;text-align:left;min-height:150px}.grade-2{background:#f9edcf}.grade-3{background:#e9e5f4}.grade-symbol{font-size:40px}.grade-card strong{display:block;font-size:28px}.grade-card small{display:block;margin-top:10px;font-size:13px}.category-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.category-card{display:flex;align-items:center;gap:20px;background:#fff;color:#183e37;border:1px solid #dae5d9;text-align:left;padding:28px}.category-card>span:last-child{margin-left:auto}.category-card strong{display:block;font-size:21px;margin:6px 0}.category-card p{margin:0;font-size:13px;color:#648078}.category-card small{color:#648078;font-size:11px;letter-spacing:.1em}.category-icon{width:66px;height:66px;border-radius:20px;background:#e6eddc;display:grid;place-items:center;font-size:32px;font-weight:900;flex-shrink:0}.tone-1{background:#f9edcf}.tone-2{background:#e8e4f3}.tone-3{background:#e1eef3}.icon-button{font-size:28px;background:#fff;color:#17675a;border:1px solid #dae5d9;padding:6px 16px}.question-progress{display:flex;gap:7px;margin:0 0 20px}.question-progress span{flex:1;height:7px;border-radius:9px;background:#dce5db}.question-progress .done{background:#4d9b78}.question-progress .miss{background:#e3b457}.question-progress .current{background:#93b5a6}.arena{display:flex;align-items:center;justify-content:center;gap:30px;position:relative;background:linear-gradient(#e9efe4 80%,#cfdcc5 80%);border-radius:24px;padding:16px;overflow:hidden}.fighter{display:flex;flex-direction:column;align-items:center;gap:7px}.fighter-name{font-size:13px;font-weight:800}.fighter-caption{font-size:11px;color:#567366}.arena-center{position:relative;display:flex;flex-direction:column;align-items:center;gap:14px;min-width:90px}.vs{font-weight:900;color:#96ac99;font-size:30px}.combo{color:#648078;font-size:12px;font-weight:900}.combo.visible{background:#ffe3a3;padding:6px 10px;border-radius:12px;color:#755312}.hp-track{height:8px;width:130px;background:#fff;border-radius:10px;overflow:hidden}.hp-track span{display:block;height:100%;background:#8a82b3;transition:width .35s}.question-card{margin:20px auto;background:#fff;border:1px solid #dde5d9;border-radius:24px;padding:26px;text-align:center;max-width:750px}.math-question{font-size:46px;letter-spacing:.03em;margin:18px 0 28px;white-space:pre-line}.word-question{font-size:24px;line-height:1.7}.answers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.answer{background:#f9faf6;border:2px solid #dbe4d7;color:#214e43;font-size:28px;font-weight:800;box-shadow:0 4px #dbe4d7;padding:18px 8px}.answer:disabled{cursor:default;opacity:.65}.answer.correct{background:#dcefe0;border-color:#3d9568;opacity:1;box-shadow:0 4px #3d9568}.answer.incorrect{background:#fff0d9;border-color:#d8a243;opacity:1;box-shadow:0 4px #d8a243}.feedback-area{min-height:84px;margin-top:22px}.hint-button{background:none;color:#6e8274;font-size:14px}.hint{font-size:15px;color:#648078}.feedback strong{display:block;margin-bottom:14px;color:#17675a}.wrong-feedback strong{color:#866219}.feedback p{font-size:16px;line-height:1.8}.feedback .primary{margin:16px auto 0;min-width:220px}.gentle-note{text-align:center;font-size:12px;color:#6e8274}.attacking{animation:attack .45s}.hurt{animation:hurt .45s}.attack-spark{position:absolute;top:60px;font-size:50px;color:#e7af41;animation:spark .6s}.result-card{margin:40px auto;background:#fff;border:1px solid #dae5d9;border-radius:28px;padding:36px;max-width:600px;text-align:center}.result-card button{margin:15px auto;min-width:240px}.result-emblem{font-size:70px;color:#dfa83b}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;background:#153e3566;display:grid;place-items:center;padding:20px}.modal{background:#fff;padding:30px;border-radius:24px;max-width:400px}.modal button{width:100%;margin:12px 0}footer{padding:36px 24px;padding-bottom:calc(36px + var(--safe-area-bottom));max-width:1100px;margin:auto;border-top:1px solid #dbe4dc;color:#648078;font-size:12px;display:flex;justify-content:space-between}@keyframes attack{50%{transform:translate(28px) rotate(8deg)}}@keyframes hurt{25%,75%{transform:translate(9px)}50%{transform:translate(-9px)}}@keyframes spark{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.5);opacity:1}to{transform:scale(.5);opacity:0}}@media(max-width:700px){main{padding:16px}.app-header{padding:14px 16px}.brand{font-size:18px}.brand span{font-size:12px}.header-tag{display:none}.page-heading{margin:12px 0 22px;gap:10px}.page-heading h1{font-size:22px}.hero{grid-template-columns:1fr}.hero-copy{padding:28px}.hero h2{font-size:34px}.hero-art{min-height:240px}.hero-art .explorer{width:160px;left:45%}.grade-grid,.category-grid{grid-template-columns:1fr;gap:12px}.grade-card{min-height:110px;padding:22px}.grade-card>span:last-child{margin-left:auto}.category-card{padding:22px}.arena{gap:5px;padding:14px 5px}.character{width:115px;height:125px}.arena-center{min-width:66px}.fighter-name{font-size:12px}.fighter-caption{font-size:9px}.hp-track{width:105px}.question-card{padding:22px 14px}.math-question{font-size:36px}.word-question{font-size:20px}.answers{gap:10px}.answer{font-size:22px;padding:18px 4px}.pill{font-size:11px;padding:8px 10px}.launch h1{font-size:32px}.result-card{padding:24px}.gentle-note{font-size:11px}footer{padding-bottom:calc(100px + var(--safe-area-bottom));gap:16px}.eyebrow{font-size:11px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.earned-stars{font-size:44px;letter-spacing:12px;color:#dce4d9;margin:24px 0}.earned-stars .earned{color:#e9b34c}.result-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:26px 0}.result-stats div{border-radius:16px;background:#f4f7ef;padding:18px;display:flex;flex-direction:column;gap:8px}.result-stats strong{font-size:32px}.result-stats small{font-size:16px;color:#648078}.result-stats span{font-size:12px;color:#648078}.result-card p{color:#648078;line-height:1.8}.text-button{background:none;color:#567366;font-size:14px}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.summary-grid>div{background:#fff;border:1px solid #dbe4d7;border-radius:20px;padding:24px}.summary-grid span{display:block;font-size:12px;color:#648078}.summary-grid strong{display:block;font-size:30px;margin-top:12px}.summary-grid small{font-size:14px}.home-summary{grid-template-columns:repeat(3,1fr);margin:24px 0}.home-summary>div:first-child{background:#fff5da;border-color:#efe1b9}.section-title{display:flex;align-items:center;justify-content:space-between;margin-top:30px}.section-title h2{font-size:20px}.section-title>span{font-size:12px;color:#648078}.record-list{background:#fff;border:1px solid #dbe4d7;border-radius:20px;overflow:hidden}.record-row{display:flex;align-items:center;gap:18px;padding:18px 24px;border-bottom:1px solid #edf1e9}.record-row:last-child{border:0}.record-icon{background:#edf2e8;border-radius:12px;width:44px;height:44px;display:grid;place-items:center;font-size:22px;flex-shrink:0}.record-row strong,.record-row small{display:block;margin-top:4px}.record-row strong{font-size:15px}.record-row small{font-size:11px;color:#648078}.record-row b{margin-left:auto;color:#17675a;font-size:20px}.review-banner{display:flex;align-items:center;gap:24px;background:#e8ecdf;border-radius:20px;margin-top:24px;padding:24px}.review-icon{font-size:48px;color:#17675a}.review-banner h2{font-size:20px;margin:0}.review-banner p{font-size:13px;color:#648078}.review-banner button{margin-left:auto}.home-links{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:20px}.home-link{display:flex;align-items:center;gap:20px;background:#fff;border:1px solid #dbe4d7;color:#183e37;text-align:left;padding:24px}.home-link>span{font-size:32px;color:#7a967e}.home-link strong,.home-link small{display:block}.home-link strong{font-size:17px}.home-link small{font-size:12px;color:#648078;margin-top:8px}.home-link b{margin-left:auto}.bottom-nav{display:flex;justify-content:center;gap:12px;margin:24px auto;max-width:600px}.bottom-nav button{background:none;color:#648078;font-size:20px;min-width:130px;padding:10px}.bottom-nav span{font-size:13px}.bottom-nav .active{background:#e2ecdf;color:#17675a}button:disabled{cursor:default;opacity:.6}@media(max-width:700px){.summary-grid{grid-template-columns:1fr 1fr}.summary-grid>div{padding:18px}.summary-grid strong{font-size:26px}.home-summary{grid-template-columns:repeat(3,1fr);gap:8px}.home-summary>div{padding:16px 10px}.home-summary strong{font-size:23px}.home-summary span{font-size:10px}.home-links{grid-template-columns:1fr;gap:12px}.home-link{padding:20px}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:5;max-width:none;margin:0;background:#fff;border-top:1px solid #dbe4d7;gap:0;padding:8px 10px calc(8px + var(--safe-area-bottom))}.bottom-nav button{min-width:0;flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:22px;padding:6px;border-radius:12px}.bottom-nav span{font-size:11px}.review-banner{flex-wrap:wrap;gap:16px}.review-banner button{width:100%}.record-row{padding:16px;gap:12px}.section-title>span{font-size:10px}.section-title h2{font-size:17px}.result-card .primary{font-size:14px;padding:16px 12px;gap:8px;min-width:0;width:100%}}.settings-panel{background:#fff;border:1px solid #dbe4d7;padding:28px;border-radius:22px;margin-bottom:20px}.settings-panel h2{font-size:20px;margin:0 0 16px}.settings-panel h3{font-size:18px}.settings-panel h3 small{font-weight:400;font-size:12px;color:#648078}.settings-panel p{color:#648078;font-size:14px;line-height:1.9}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0;border-top:1px solid #edf1e9}.setting-row p{margin:6px 0 0;font-size:12px}.toggle{display:flex;align-items:center;gap:10px;background:#e5eade;color:#6c7c70;min-width:106px;padding:12px}.toggle span{width:22px;height:22px;border-radius:50%;background:#fff}.toggle.on{background:#17675a;color:#fff}.reset-button{background:#fff1e4;color:#975836;border:1px solid #edd2b9}.storage-warning{background:#fff2d8;border-bottom:1px solid #ecd8a9;color:#775c27;padding:14px 24px;font-size:13px;line-height:1.7}.settings-panel summary{cursor:pointer;font-weight:700;color:#17675a;min-height:44px;display:flex;align-items:center}.settings-panel summary:before{content:"＋";margin-right:10px}@media(max-width:700px){.settings-panel{padding:22px}.bottom-nav button{min-width:0}.storage-warning{padding:12px 16px}}*{box-sizing:border-box}html{scroll-padding-bottom:100px}body{min-width:320px}button{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:hover:not(:disabled){filter:brightness(.97)}.brand:disabled{opacity:1;cursor:default}.app-shell main{min-height:65vh;padding-bottom:32px}.modal{border:1px solid #dbe4d7;color:#183e37;width:calc(100% - 40px);margin:auto;max-height:90dvh;overflow:auto}.modal::backdrop{background:#153e3577;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.modal h2{font-size:22px}.modal p{font-size:15px;line-height:1.8;color:#648078}.pwa-notice,.connection-notice{display:flex;align-items:center;justify-content:center;gap:16px;font-size:12px;background:#e5eedf;color:#3c6854;padding:10px 16px}.pwa-notice button{min-height:44px;padding:8px 16px;font-size:12px}.connection-notice{background:#fff2d8;color:#775c27}.bottom-nav{max-width:660px}.bottom-nav button{min-width:120px}.answer{overflow-wrap:anywhere}.fighter-caption{white-space:nowrap}.result-card h1{font-size:28px}@media(min-width:701px)and (max-width:1024px){.grade-card{gap:12px;padding:22px 16px}.grade-symbol{font-size:30px}.grade-card strong{font-size:25px}.hero-copy{padding:30px}.hero h2{font-size:36px}}@media(max-width:700px){.bottom-nav button{min-width:0}.app-shell main{padding-bottom:100px}.battle-page .page-heading h1{font-size:20px}.battle-page .eyebrow{letter-spacing:0;font-size:10px}.result-card h1{font-size:23px}.arena{gap:4px}.answers .answer{font-size:24px}.answers .answer:has(+*){min-width:0}.home-summary strong{font-size:22px}.pwa-notice,.connection-notice{font-size:11px}}@media(max-width:380px){.brand{font-size:17px;gap:7px}.brand img{width:34px}.brand span{font-size:11px}.page-heading h1{font-size:20px}.pill{padding:7px 8px;font-size:10px}.character{width:100px;height:115px}.fighter-caption{font-size:8px}.hp-track{width:90px}.arena-center{min-width:56px}.combo{font-size:10px}.math-question{font-size:31px}.word-question{font-size:18px}.answer{font-size:21px}.home-summary strong{font-size:20px}.grade-card{gap:16px}.record-row{padding:14px 12px}.record-row strong{font-size:14px}}.comparison-answers .answer span{display:block;font-size:20px;line-height:1.5}@media(max-width:700px){.comparison-answers .answer span{font-size:18px}}