:root{--bg:#f4efe6;--card:#fffdfa;--ink:#20283a;--muted:#707788;--red:#cf4b4b;--navy:#17233b;--green:#2d8b66;--line:#e3dbcf}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5}.wrap{max-width:980px;margin:auto}header{background:linear-gradient(145deg,#142038,#30466f);color:#fff;padding:calc(22px + env(safe-area-inset-top)) 17px 25px}.header{display:flex;justify-content:space-between;align-items:center}.badge,.chapter{font-size:.72rem;font-weight:900;letter-spacing:.05em}.badge{background:#ffffff20;padding:5px 9px;border-radius:999px}.avatar{border:0;width:44px;height:44px;border-radius:50%}nav{position:sticky;top:0;z-index:10;background:#f4efe6ee;backdrop-filter:blur(10px);display:flex;gap:7px;overflow:auto;padding:9px;border-bottom:1px solid var(--line)}nav button{border:0;border-radius:11px;background:#e9e1d6;padding:10px 12px;font-weight:800;white-space:nowrap}nav button.active{background:var(--navy);color:#fff}main{padding:15px 13px 40px}.screen{display:none}.screen.active{display:block}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:12px}.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:17px;box-shadow:0 7px 22px #20283a0c;margin-bottom:13px}.hero{display:flex;gap:15px;align-items:center}.fox{font-size:3rem}.fox.big{font-size:4rem;background:#fff3d9;border-radius:19px;padding:9px}.kpi{font-size:1.7rem;font-weight:900}.small,small,.section p{color:var(--muted)}.mission-card,.exam-card{display:flex;justify-content:space-between;align-items:center;gap:15px}.btn{border:0;border-radius:13px;padding:11px 15px;font-weight:900}.primary{background:var(--red);color:#fff}.secondary{background:var(--navy);color:#fff}.ghost{background:#ece6dc}.wide{width:100%}.overlay{position:fixed;inset:0;background:#111827dd;z-index:100;display:grid;place-items:center;padding:18px}.overlay.hidden,.hidden{display:none!important}.onboard{width:min(460px,100%);background:var(--card);border-radius:24px;padding:24px}.onboard .fox{text-align:center}label{display:block;font-weight:800;margin:13px 0}input,select{width:100%;padding:12px;border:1px solid var(--line);border-radius:12px;margin-top:6px;font-size:1rem}.mission-row{display:flex;gap:13px;align-items:center}.mission-row.locked{opacity:.48}.mission-num{width:48px;height:48px;border-radius:15px;background:#f2dada;color:#9b3737;display:grid;place-items:center;font-weight:900}.mission-row.done .mission-num{background:#d9eee4;color:#287456}.teach-card{background:#f4eee5;border-radius:14px;padding:13px;margin:9px 0}.jp{font-size:1.3rem;font-weight:900}.roman{font-weight:800;color:#984141}.mora-wrap{display:flex;gap:6px;flex-wrap:wrap;margin:9px 0}.mora{padding:7px 9px;background:#fff;border:1px solid var(--line);border-radius:10px;font-weight:850}.mora.active{background:var(--navy);color:#fff}.audio{background:#e5ebf5;color:#243b65}.progress{height:12px;border-radius:99px;background:#e8e1d6;overflow:hidden}.progress span{display:block;height:100%;background:var(--green)}.option{display:block;width:100%;text-align:left;padding:12px;margin:7px 0;border:1px solid var(--line);border-radius:12px;background:#fff;font-weight:700}.option.correct{background:#e6f4ed;border-color:var(--green)}.option.wrong{background:#f9e4e4;border-color:#bd4545}.feedback{min-height:28px;font-weight:850}.activity-nav{display:flex;justify-content:flex-end;margin-top:14px}.match-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.match-card{padding:11px;border:1px solid var(--line);border-radius:12px;background:#fff}.match-card.selected{outline:3px solid #7287ae}.match-card.matched{background:#e4f3eb;opacity:.65}.order-zone{display:flex;gap:8px;flex-wrap:wrap;min-height:48px;padding:7px;border:1px dashed var(--line);border-radius:12px;margin:9px 0}.word-chip{padding:9px 12px;border:1px solid var(--line);border-radius:999px;background:#fff}.tabs{display:flex;gap:7px;overflow:auto}.tab{border:0;border-radius:11px;padding:9px 12px;white-space:nowrap}.tab.active{background:var(--navy);color:#fff}.center{text-align:center}.kana-symbol{font-size:5rem;font-weight:900;margin:18px}.filters{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.chip{border:0;border-radius:999px;padding:8px 11px}.chip.active{background:var(--navy);color:#fff}.dict-row{display:flex;gap:12px;align-items:center}.dict-main{flex:1}.status{padding:4px 8px;border-radius:999px;font-size:.75rem;font-weight:850}.status.new{background:#f4dddd}.status.learning{background:#fff0c7}.status.mastered{background:#daf0e5}.favorite{border:0;background:none;font-size:1.5rem}.trophy{font-size:4.5rem}.reward{padding:32px 18px}.profile-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}footer{text-align:center;color:var(--muted);font-size:.82rem;padding:13px 10px calc(20px + env(safe-area-inset-bottom))}@media(max-width:620px){.mission-card,.exam-card{align-items:flex-start;flex-direction:column}.match-grid{grid-template-columns:1fr}}

.kana-scoreline{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:12px}
.kana-progress-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.mode-label{display:inline-block;padding:5px 9px;border-radius:999px;background:#e7edf8;color:#263d67;font-size:.78rem;font-weight:900;margin-bottom:8px}
.review-round{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.result-card{background:linear-gradient(145deg,#fffdfa,#f4eee5)}
.result-card .big{font-size:3rem}
.icon-preview{width:72px;height:72px;border-radius:18px}

header{background:linear-gradient(180deg,rgba(10,24,54,.08),rgba(18,35,65,.92)),url('hero-japan.jpg') center 45%/cover no-repeat;min-height:270px;display:flex;align-items:flex-end}
header h1{text-shadow:0 3px 18px #0006}header p{color:#fff;text-shadow:0 2px 10px #0007}
.card{animation:cardIn .32s ease both}@keyframes cardIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.kitsune-shell{width:118px;height:118px;border-radius:28px;overflow:hidden;background:#fff4dc;flex:0 0 auto;box-shadow:0 10px 28px #17233b20}
.kitsune-main{width:100%;height:100%;object-fit:cover;animation:kitsuneFloat 3s ease-in-out infinite}@keyframes kitsuneFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.reward-kitsune{width:190px;height:190px;object-fit:cover;border-radius:42px;margin:auto;animation:celebrate .55s ease}@keyframes celebrate{0%{transform:scale(.75) rotate(-4deg);opacity:0}70%{transform:scale(1.06) rotate(2deg)}100%{transform:scale(1);opacity:1}}
.journey-map{overflow:hidden;background:linear-gradient(145deg,#fffdfa,#eef2f8)}.map-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:15px;font-weight:900}.map-title small{font-weight:700;color:var(--muted)}
.map-stops{display:flex;align-items:center;justify-content:center}.stop{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:1.75rem}.stop span{font-size:.75rem;font-weight:900}.stop.locked{filter:grayscale(1);opacity:.45}.road{height:4px;flex:1;max-width:100px;background:var(--green);margin:0 6px}.road.locked{background:#d8d1c6}
.mission-card{border-left:6px solid var(--red)}.btn{transition:transform .15s ease}.btn:active{transform:scale(.97)}

#bootStatus{display:none!important}header{padding-top:calc(74px + env(safe-area-inset-top));min-height:330px;background-position:center center}.header-row{width:100%;align-items:flex-end}.header-row>div{max-width:78%}header h1{font-size:clamp(2rem,7vw,3.15rem);line-height:1.05;overflow-wrap:anywhere}.badge{position:absolute;top:calc(18px + env(safe-area-inset-top));left:18px}.intro-overlay{background:linear-gradient(180deg,#102342ee,#142038f4)}.intro-card{width:min(520px,100%);background:var(--card);border-radius:28px;padding:22px}.intro-scene{display:flex;gap:18px;align-items:center}.intro-kitsune{width:150px;height:150px;border-radius:30px;object-fit:cover;animation:kitsuneFloat 3s ease-in-out infinite}.intro-copy{flex:1}.intro-copy h2{font-size:2rem;margin:5px 0}.intro-dots{display:flex;justify-content:center;gap:7px;margin:18px 0}.intro-dot{width:9px;height:9px;border-radius:50%;background:#d9d2c7}.intro-dot.active{background:var(--red);transform:scale(1.25)}.kana-families{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}.kana-family{background:var(--card);border:1px solid var(--line);border-radius:17px;padding:13px;text-align:left;display:flex;justify-content:space-between;align-items:center;font-weight:900}.kana-family.locked{opacity:.45;filter:grayscale(1)}.kana-family.active{outline:3px solid #405b88}.kana-family small{display:block;color:var(--muted);font-weight:700}.order-listen{margin-top:10px}@media(max-width:620px){header{min-height:295px;padding-top:calc(84px + env(safe-area-inset-top));background-position:center 45%}.header-row>div{max-width:80%}header h1{font-size:2.05rem}.badge{font-size:.64rem}.intro-scene{flex-direction:column;text-align:center}.intro-kitsune{width:138px;height:138px}.kana-families{grid-template-columns:1fr}}