:root{color-scheme:light;--ink: #1f2937;--muted: #667085;--paper: #f6f8fc;--panel: #ffffff;--line: #e4e7ec;--blue: #1a73e8;--blue-dark: #1558b0;--green: #0b8f66;--red: #d4314f;--yellow: #fbbc04;--navy: #172033;--shadow: 0 2px 6px rgba(16, 24, 40, .1), 0 12px 24px rgba(16, 24, 40, .08);--shadow-hover: 0 4px 10px rgba(16, 24, 40, .13), 0 18px 34px rgba(16, 24, 40, .1);--font-main: "UD Digi Kyokasho N-R", "UD Digi Kyokasho NK-R", "BIZ UDPGothic", "Hiragino Sans", "Yu Gothic", "Meiryo", system-ui, sans-serif;--font-kanji: "UD Digi Kyokasho N-R", "UD Digi Kyokasho NK-R", "YuKyokasho", "Yu Kyokasho", "BIZ UDPMincho", "Hiragino Mincho ProN", "Yu Mincho", serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0;-webkit-text-size-adjust:100%}body{color:var(--ink);font-family:var(--font-main);background:linear-gradient(135deg,rgba(26,115,232,.1),transparent 36%),linear-gradient(180deg,#f7f9ff,#eef3fb)}button,a{font:inherit;-webkit-tap-highlight-color:transparent}img,svg{max-width:100%}.app-shell{width:min(100%,1120px);min-height:100vh;margin:0 auto;padding:12px}.screen{display:none}.screen.active{display:block}.panel{border:1px solid rgba(228,231,236,.95);border-radius:8px;background:#fffffffa;box-shadow:var(--shadow)}.badge-header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;margin-bottom:14px;padding:14px 16px;border:1px solid rgba(228,231,236,.95);border-radius:8px;background:linear-gradient(135deg,#fffffffa,#eff6fff5);box-shadow:var(--shadow)}.badge-header h2,.badge-header p,.stroke-panel-head h3,.writing-practice-head h3,.writing-saved-panel-head h3,.kanji-question-head h3{margin:0}.badge-header h2{font-size:clamp(1.45rem,3.8vw,2rem);line-height:1.25}.eyebrow{margin:0 0 4px;color:var(--blue);font-size:.92rem;font-weight:800}.icon-button,.primary-button,.secondary-button{min-height:42px;border-radius:8px;border:1px solid transparent;padding:8px 14px;font-weight:900;line-height:1.2;text-decoration:none;cursor:pointer}.icon-button{width:44px;height:44px;min-width:44px;min-height:44px;display:inline-flex;flex:0 0 44px;align-items:center;justify-content:center;padding:0;border-color:#c7d7f0;background:#fff;color:var(--blue-dark);font-size:1.45rem;line-height:1;text-align:center}.primary-button{border-color:var(--blue);background:var(--blue);color:#fff;box-shadow:0 8px 18px #1a73e83d}.secondary-button{border-color:#b8cff4;background:#e8f1ff;color:var(--blue-dark)}.primary-button:hover,.secondary-button:hover,.icon-button:hover{box-shadow:var(--shadow-hover)}.primary-button:disabled,.secondary-button:disabled,.icon-button:disabled,.is-disabled{opacity:.48;pointer-events:none;box-shadow:none}.compact{min-height:36px;padding:6px 12px;font-size:.94rem}.kanji-detail-nav{display:grid;grid-template-columns:minmax(104px,auto) minmax(88px,auto) minmax(104px,auto);gap:8px;align-items:center}.kanji-detail-nav .secondary-button,.kanji-detail-floating-nav .secondary-button{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}.kanji-detail-position{display:inline-flex;align-items:center;justify-content:center;min-height:36px;border:1px solid var(--line);border-radius:8px;padding:5px 10px;background:#fff;color:var(--muted);font-weight:900;white-space:nowrap}.kanji-detail-layout{display:grid;grid-template-columns:minmax(280px,.92fr) minmax(0,1.08fr);gap:16px}.kanji-detail-main{display:grid;gap:14px;align-content:start;padding:16px}.kanji-detail-char{position:relative;display:grid;place-items:center;aspect-ratio:1;min-height:268px;border:2px solid #d6e1f1;border-radius:8px;background:linear-gradient(to right,transparent calc(50% - .5px),#d9e3f1 calc(50% - .5px),#d9e3f1 calc(50% + .5px),transparent calc(50% + .5px)),linear-gradient(to bottom,transparent calc(50% - .5px),#d9e3f1 calc(50% - .5px),#d9e3f1 calc(50% + .5px),transparent calc(50% + .5px)),#fbfdff;overflow:hidden}.kanji-detail-number{position:absolute;top:0;left:0;z-index:2;min-width:42px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-right:1px solid #c7d7f0;border-bottom:1px solid #c7d7f0;border-radius:0 0 8px;background:#fffffff0;color:var(--muted);font-weight:900}.kanji-detail-char-glyph,.kanji-static-svg-wrap,.kanji-detail-svg{width:100%;height:100%;display:grid;place-items:center}.kanji-detail-svg svg{width:82%;height:82%;display:block;overflow:visible}.kanji-detail-svg path,.radical-kanji-svg path,.kanji-tile-svg path{fill:none!important;stroke:var(--navy)!important;stroke-width:4.4!important;stroke-linecap:round!important;stroke-linejoin:round!important}.kanji-detail-svg text,.radical-kanji-svg text,.kanji-tile-svg text{display:none}.kanji-static-fallback,.radical-svg-fallback{font-family:var(--font-kanji);font-size:clamp(6rem,34vw,12rem);font-weight:900;line-height:1}.kanji-detail-facts{display:grid;gap:8px;margin:0}.kanji-detail-facts div{display:grid;grid-template-columns:124px minmax(0,1fr);gap:10px;align-items:baseline;border:1px solid #eef2f8;border-radius:8px;padding:8px 10px;background:#fbfdff}.kanji-detail-facts dt{color:var(--muted);font-size:.95rem;font-weight:900}.kanji-detail-facts dd{margin:0;color:var(--ink);font-size:1.02rem;font-weight:900}.kanji-detail-radical-value{display:flex;align-items:center;justify-content:space-between;gap:10px}.kanji-detail-radical-label{min-width:0}.radical-link-button{min-height:34px;min-width:54px;border:1px solid #b8cff4;border-radius:8px;padding:4px 14px;background:#e8f1ff;color:var(--blue-dark);font-weight:900;text-align:center;text-decoration:none;white-space:nowrap}.stroke-panel,.kanji-question-panel,.app-cta-panel{padding:16px}.stroke-panel{display:grid;align-content:start;gap:12px}.stroke-panel-head,.kanji-question-head,.writing-practice-head,.writing-saved-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.stroke-action-row,.writing-practice-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.stroke-order-view,.writing-practice-area,.saved-writing-svg-frame{position:relative;aspect-ratio:1;border:2px solid #d6e1f1;border-radius:8px;background:linear-gradient(to right,transparent calc(50% - .5px),#d9e3f1 calc(50% - .5px),#d9e3f1 calc(50% + .5px),transparent calc(50% + .5px)),linear-gradient(to bottom,transparent calc(50% - .5px),#d9e3f1 calc(50% - .5px),#d9e3f1 calc(50% + .5px),transparent calc(50% + .5px)),#fbfdff;overflow:hidden}.stroke-order-view{width:min(100%,320px);margin:0 auto;padding:10px}.stroke-order-view svg{width:100%;height:100%;display:block;overflow:visible}.stroke-order-view path{fill:none!important;vector-effect:non-scaling-stroke}.stroke-order-view text{user-select:none;-webkit-user-select:none}.stroke-animation-overlay{pointer-events:none}.stroke-note{margin:0;color:var(--muted);font-size:1.12rem;font-weight:900;text-align:center}.writing-practice-open{justify-self:end}.kanji-question-panel{display:grid;gap:12px}.kanji-question-head{align-items:center}.kanji-question-count{display:inline-flex;align-items:center;justify-content:center;min-height:34px;border:1px solid #c7d7f0;border-radius:8px;padding:4px 10px;background:#e8f1ff;color:var(--blue-dark);font-weight:900;white-space:nowrap}.kanji-question-list{display:grid;gap:10px}.kanji-question-row{display:grid;grid-template-columns:88px minmax(0,1fr) minmax(112px,auto);gap:12px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:10px;background:#fbfdff}.kanji-question-type,.type-chip{display:inline-flex;align-items:center;justify-content:center;min-height:32px;border-radius:999px;padding:4px 10px;color:#fff;font-size:.84rem;font-weight:900;white-space:nowrap}.kanji-question-type.is-on,.type-chip.is-on{background:var(--blue)}.kanji-question-type.is-kun,.type-chip.is-kun{background:var(--green)}.kanji-question-prompt{color:var(--ink);font-size:1.12rem;font-weight:900}.prompt-content{display:inline-flex;flex-wrap:wrap;align-items:flex-end;gap:0}.prompt-unit{display:inline-grid;grid-template-rows:1.05em auto;justify-items:center;min-width:1em;line-height:1.1}.prompt-reading{min-height:1.05em;color:var(--blue-dark);font-size:.62em;font-weight:900}.prompt-base{font-size:1.08em}.prompt-unit.is-text .prompt-reading,.prompt-paren-unit .prompt-reading{visibility:hidden}.prompt-kanji-hint{color:var(--muted);font-size:.9em}.kanji-question-meaning,.question-note{margin:3px 0 0;color:var(--muted);font-weight:800}.kanji-question-answer{display:grid;justify-items:end;color:var(--muted);font-weight:800}.kanji-question-answer strong{color:var(--ink);font-size:1.08rem}.kanji-question-empty{margin:0;border:1px dashed var(--line);border-radius:8px;padding:14px;color:var(--muted);font-weight:900}.kanji-detail-floating-nav{position:sticky;bottom:10px;z-index:10;display:grid;grid-template-columns:minmax(112px,1fr) minmax(88px,auto) minmax(112px,1fr);gap:8px;align-items:center;margin-top:14px;border:1px solid rgba(228,231,236,.95);border-radius:8px;padding:8px;background:#fffffff0;box-shadow:var(--shadow);backdrop-filter:blur(12px)}.writing-practice-layout{display:grid;grid-template-columns:minmax(260px,1fr) minmax(260px,1fr);gap:14px}.writing-stroke-panel,.writing-practice-card,.writing-saved-panel{padding:14px}.writing-practice-grid,.writing-practice-areas{display:grid;gap:14px}.writing-practice-card{display:grid;gap:12px}.writing-practice-area{width:min(100%,300px);margin:0 auto;touch-action:none;user-select:none;-webkit-user-select:none}.writing-draft-svg,.writing-canvas{position:absolute;inset:0;width:100%;height:100%}.writing-draft-svg{display:grid;place-items:center;padding:8px;opacity:.2;pointer-events:none}.writing-draft-svg[hidden]{display:none}.writing-draft-svg svg{width:100%;height:100%}.writing-draft-svg path{fill:none!important;stroke:#667085!important;stroke-width:4.4!important}.writing-canvas{cursor:crosshair}.writing-practice-area .writing-done-button{position:absolute;right:10px;bottom:10px;z-index:3}.writing-star-tray{min-height:32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:3px}.writing-star{display:inline-block;color:var(--yellow);font-size:1.4rem;text-shadow:0 2px 0 rgba(23,32,51,.16)}.writing-star.is-new,.writing-star-summary.is-new{animation:starPop .48s cubic-bezier(.18,.9,.24,1.35)}.writing-star-summary{display:inline-flex;align-items:center;gap:4px;color:var(--yellow);font-size:1.1rem;font-weight:900;text-shadow:0 2px 0 rgba(23,32,51,.14)}@keyframes starPop{0%{transform:scale(.35) rotate(-18deg);opacity:0}70%{transform:scale(1.22) rotate(8deg);opacity:1}to{transform:scale(1) rotate(0);opacity:1}}.writing-saved-panel{display:grid;gap:12px;margin-top:14px}.writing-saved-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}.writing-saved-tile{display:grid;gap:5px;border:1px solid var(--line);border-radius:8px;padding:6px;background:#fff;color:var(--ink);font-weight:900;cursor:pointer}.saved-writing-svg-frame{width:100%}.saved-writing-svg-frame svg{width:100%;height:100%;display:block}.saved-writing-svg-frame path,.saved-writing-svg-frame circle{fill:none;stroke:var(--navy);stroke-width:7;stroke-linecap:round;stroke-linejoin:round}.saved-writing-svg-frame circle{fill:var(--navy);stroke:none}.writing-practice-area *,.writing-practice-head,.writing-practice-head *,.writing-saved-panel,.writing-saved-panel *,.stroke-panel-head,.stroke-panel-head *,.stroke-note,.kanji-detail-position,.badge-header,.badge-header *,button,button *{user-select:none;-webkit-user-select:none}.quiz-topbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;margin-bottom:12px}.quiz-topbar h2,.quiz-topbar p{margin:0}.pill-score{min-height:38px;display:inline-flex;align-items:center;gap:4px;border:1px solid #c7d7f0;border-radius:999px;padding:5px 12px;background:#fff;color:var(--blue-dark);font-weight:900}.progress-wrap{height:12px;border:1px solid #c7d7f0;border-radius:999px;overflow:hidden;background:#fff}.progress-bar{width:0%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--blue),#00acc1);transition:width .22s ease}.question-card{display:grid;gap:12px;margin-top:12px;padding:16px}.question-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.question-prompt{min-height:82px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;padding:14px;background:#fbfdff;font-size:clamp(1.8rem,8vw,3.4rem);font-weight:900;text-align:center}.question-prompt .prompt-reading{visibility:hidden}.question-prompt.show-furigana .prompt-reading.has-reading{visibility:visible}.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.choice-button{min-height:54px;border:1px solid #b8cff4;border-radius:8px;padding:9px 12px;background:#e8f1ff;color:var(--ink);font-size:1.08rem;font-weight:900;cursor:pointer}.choice-button.correct{border-color:#8bc5a8;background:#e8f6ee;color:var(--green)}.choice-button.wrong{border-color:#f2a7b5;background:#fff0f3;color:#b42345}.feedback{min-height:40px;margin:0;border-radius:8px;padding:8px 10px;color:transparent;font-weight:900}.feedback.show{color:var(--ink);background:#f8fbff}.feedback.correct{color:var(--green);background:#e8f6ee}.feedback.wrong{color:#b42345;background:#fff0f3}.quiz-actions,.app-cta-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.result-summary{display:grid;gap:12px;margin-top:12px;padding:16px}.result-score{margin:0;font-size:clamp(1.8rem,7vw,3rem);font-weight:900;text-align:center}.radical-detail-layout{display:grid;grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);gap:16px}.radical-detail-main,.radical-kanji-panel{padding:16px}.radical-detail-svg{display:grid;place-items:center;aspect-ratio:1;border:2px solid #d6e1f1;border-radius:8px;background:linear-gradient(to right,transparent calc(50% - .5px),#d9e3f1 calc(50% - .5px),#d9e3f1 calc(50% + .5px),transparent calc(50% + .5px)),linear-gradient(to bottom,transparent calc(50% - .5px),#d9e3f1 calc(50% - .5px),#d9e3f1 calc(50% + .5px),transparent calc(50% + .5px)),#fbfdff}.radical-detail-svg svg{width:82%;height:82%}.radical-detail-facts{margin-top:12px}.radical-grade-section{margin-top:14px}.radical-grade-section h4{margin:0 0 8px;color:var(--muted);font-size:1rem}.radical-kanji-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:8px}.radical-kanji-tile{position:relative;display:grid;place-items:center;aspect-ratio:1;border:1px solid #c7d7f0;border-radius:8px;padding:8px;background:#e8f1ff;text-decoration:none}.radical-kanji-svg,.radical-kanji-svg svg{width:100%;height:100%}.app-cta-panel{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:14px}.app-cta-panel p{margin:4px 0 0;color:var(--muted);font-weight:800}@media(max-width:820px){.badge-header{grid-template-columns:auto minmax(0,1fr)}.badge-header .kanji-detail-nav{grid-column:1 / -1;width:100%}.kanji-detail-layout,.writing-practice-layout,.radical-detail-layout{grid-template-columns:1fr}.kanji-detail-main,.stroke-panel,.kanji-question-panel,.writing-stroke-panel,.writing-practice-card,.writing-saved-panel,.radical-detail-main,.radical-kanji-panel{padding:12px}.kanji-detail-char{min-height:240px}.stroke-order-view,.writing-practice-area{width:min(100%,286px)}.kanji-question-row{grid-template-columns:1fr;align-items:stretch}.kanji-question-type{width:fit-content}.kanji-question-answer{justify-items:start}}@media(max-width:560px){.app-shell{padding:8px}.badge-header{gap:10px;padding:10px}.badge-header h2{font-size:1.35rem}.kanji-detail-nav,.kanji-detail-floating-nav{grid-template-columns:1fr}.kanji-detail-position{order:-1}.kanji-detail-facts div{grid-template-columns:108px minmax(0,1fr)}.stroke-panel-head,.kanji-question-head,.writing-practice-head,.writing-saved-panel-head{flex-direction:column;align-items:stretch}.stroke-action-row,.writing-practice-actions{justify-content:flex-start}.choice-grid{grid-template-columns:1fr}.question-prompt{min-height:72px}.radical-kanji-list,.writing-saved-grid{grid-template-columns:repeat(auto-fill,minmax(76px,1fr))}}