*,:before,:after{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--bg-art), var(--bg);color:var(--ink);font-family:var(--font-body), var(--font-jp), sans-serif}[lang=ja]{font-family:var(--font-jp), var(--font-body), sans-serif}a{color:var(--accent)}h1,h2,p,ul,ol{margin:0}ul,ol{padding:0;list-style:none}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.muted{color:var(--muted)}.small{font-size:14px}.eyebrow{letter-spacing:.05em;font-size:13px;font-weight:700}.shell{flex-wrap:wrap;min-height:100vh;display:flex}.sidebar{background:var(--surface);max-width:260px;box-shadow:var(--card-shadow);border-right:1px solid var(--line);flex-direction:column;flex:220px;gap:6px;padding:32px 20px;display:flex}@media (max-width:799px){.sidebar{border-right:none;border-bottom:1px solid var(--line);flex-flow:wrap;flex-basis:100%;max-width:none;padding:16px}.sidebar-brand{flex-basis:100%;margin-bottom:4px}}.sidebar-brand{margin-bottom:20px;text-decoration:none}.wordmark{font-family:var(--font-display), var(--font-body), sans-serif;letter-spacing:-.02em;color:var(--ink);align-items:center;gap:10px;font-weight:800;display:flex}.wordmark-sidebar{font-size:24px}.wordmark-compact{font-size:21px}.sidebar-link{min-height:44px;color:var(--ink);border-radius:10px;align-items:center;padding:0 12px;font-weight:600;text-decoration:none;display:flex}.sidebar-link:hover{background:var(--accent-soft)}.sidebar-link[aria-current=page]{background:var(--accent-soft);color:var(--accent-strong);font-weight:800}.main{flex:999 560px;min-width:0;padding:40px clamp(20px,4vw,56px)}.page{flex-direction:column;gap:24px;width:100%;max-width:1040px;display:flex}.page-title{font-size:34px;font-weight:800}.card{background:var(--surface);box-shadow:var(--card-shadow);color:var(--ink);border-radius:18px;padding:20px}.card-title{font-size:17px;font-weight:800}.card-head{justify-content:space-between;align-items:center;display:flex}.text-link{font-size:14px;font-weight:700}.placeholder{flex-direction:column;gap:8px;font-size:16px;line-height:1.5;display:flex}.home-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.home-heading{flex-direction:column;gap:4px;display:flex}.home-greeting{color:var(--muted);align-items:center;gap:10px;font-size:15px;display:flex}.home-language{font-size:34px;font-weight:800}.pill-select{border:1px solid var(--line);background:var(--surface);height:44px;box-shadow:var(--card-shadow);font:700 14px var(--font-body), var(--font-jp), sans-serif;color:var(--ink);border-radius:22px;align-items:center;display:inline-flex;position:relative}.pill-select select{appearance:none;height:100%;font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;border-radius:22px;padding:0 30px 0 16px}.pill-select>span[aria-hidden]{pointer-events:none;position:absolute;right:14px}.home-grid-main{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;display:grid}.hero{background:var(--hero);color:var(--on-ink);border-radius:22px;padding:28px 28px 110px;position:relative;overflow:hidden}.hero-pattern{opacity:.16;width:100%;height:100%;position:absolute;inset:0}.hero-skyline{width:100%;height:84px;position:absolute;bottom:0;left:0}.hero-body{flex-direction:column;gap:14px;display:flex;position:relative}.hero-eyebrow{color:var(--hero-muted)}.hero-title{font-size:26px;font-weight:800;line-height:1.25}.hero-sub{color:var(--hero-muted);font-size:15px}.cta{background:var(--accent-bright);height:56px;color:var(--on-bright);border-radius:16px;align-self:flex-start;align-items:center;padding:0 28px;font-size:17px;font-weight:800;text-decoration:none;display:flex}.shaky{border-radius:22px;flex-direction:column;gap:10px;padding:24px;display:flex}.word-rows{flex-direction:column;gap:10px;display:flex}.word-row{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;min-height:44px;display:flex}.word-row:last-child{border-bottom:none}.word-written{font-size:18px;font-weight:700}.home-grid-links{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;display:grid}.link-card{flex-direction:column;gap:6px;text-decoration:none;display:flex}.usage{flex-direction:column;gap:10px;display:flex}.usage-head{flex-wrap:wrap;justify-content:space-between;gap:8px;display:flex}.usage-title{font-size:16px;font-weight:800}.bar{background:var(--line);border-radius:5px;height:10px;display:flex}.bar-fill{background:var(--accent);border-radius:5px}.settings-group{border:none;flex-direction:column;gap:8px;max-width:560px;margin:0;padding:0;display:flex}.settings-group .eyebrow{letter-spacing:.06em;padding:0 4px;font-size:12px;font-weight:800}.settings-row{justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;font-size:15px;display:flex}.theme-list{flex-direction:column;padding:4px 16px;display:flex}.theme-option{border-bottom:1px solid var(--line);cursor:pointer;align-items:center;gap:12px;min-height:48px;font-size:15px;display:flex}.theme-option:last-child{border-bottom:none}.theme-option input{width:20px;height:20px;accent-color:var(--accent);margin:0}.swatch{border:1px solid var(--line-strong);border-radius:8px;display:flex;overflow:hidden}.swatch span{width:14px;height:22px}.btn{background:var(--accent);min-height:48px;color:var(--on-ink);font:800 16px var(--font-body), var(--font-jp), sans-serif;cursor:pointer;border:none;border-radius:16px;justify-content:center;align-items:center;gap:8px;padding:0 22px;text-decoration:none;display:inline-flex}.btn:hover{background:var(--accent-strong)}.btn:disabled{background:var(--line);color:var(--muted);cursor:not-allowed}.btn-secondary{background:var(--surface);color:var(--ink);border:1px solid var(--line-strong)}.btn-secondary:hover{background:var(--accent-soft)}.btn-small{border-radius:12px;min-height:44px;padding:0 14px;font-size:14px}button.cta{cursor:pointer;border:none;font-family:inherit}.play-icon{border:1px solid var(--line);background:var(--accent-soft);width:44px;height:44px;color:var(--accent-strong);cursor:pointer;border-radius:22px;flex:none;justify-content:center;align-items:center;font-size:14px;display:inline-flex}.actions{flex-wrap:wrap;gap:10px;display:flex}.page-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.page-lede{color:var(--muted);font-size:16px;line-height:1.5}.badge{letter-spacing:.05em;white-space:nowrap;border-radius:12px;align-items:center;height:24px;padding:0 8px;font-size:12px;font-weight:800;display:inline-flex}.badge-shaky{background:var(--warn-soft);color:var(--warn);border:1px solid var(--warn-line)}.badge-mastered{background:var(--accent-soft);color:var(--accent-strong)}.badge-new{background:var(--bg);color:var(--muted);border:1px solid var(--line)}.field{flex-direction:column;gap:6px;display:flex}.field-label{color:var(--muted);font-size:14px;font-weight:700}.input{border:1px solid var(--line-strong);background:var(--surface);height:48px;color:var(--ink);font:600 17px var(--font-body), var(--font-jp), sans-serif;border-radius:12px;padding:0 14px}.segmented{border:none;flex-wrap:wrap;gap:6px;margin:0;padding:0;display:inline-flex}.segmented label{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:20px;align-items:center;min-height:40px;padding:0 14px;font-size:14px;font-weight:700;display:inline-flex}.segmented input{opacity:0;pointer-events:none;position:absolute}.segmented label:has(input:checked){background:var(--accent-soft);border-color:var(--accent);color:var(--accent-strong)}.segmented label:has(input:focus-visible){outline:3px solid var(--accent);outline-offset:2px}.drill{flex-direction:column;gap:12px;max-width:640px;display:flex}.drill-head{justify-content:space-between;align-items:center;display:flex}.question{flex-direction:column;gap:16px;padding:24px;display:flex}.question-ask{font-size:18px;font-weight:800}.question-shown{flex-direction:column;align-items:center;gap:4px;padding:12px 0;display:flex}.question-shown-text{font-size:44px;font-weight:700}.question-audio{gap:8px;display:flex}.options{border:none;flex-direction:column;gap:8px;margin:0;padding:0;display:flex}.option{border:1px solid var(--line);cursor:pointer;border-radius:14px;align-items:center;gap:12px;min-height:52px;padding:0 16px;font-size:17px;font-weight:600;display:flex}.option:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}.option input{width:20px;height:20px;accent-color:var(--accent);margin:0}.option.is-right{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-strong)}.option.is-wrong{border-color:var(--warn-line);background:var(--warn-soft);color:var(--warn)}.options:disabled .option{cursor:default}.type-answer{flex-direction:column;gap:8px;display:flex}.kana-preview{min-height:32px;font-size:24px;font-weight:700}.feedback{border-radius:12px;padding:12px 16px;font-size:15px;line-height:1.5}.feedback-right{background:var(--accent-soft);color:var(--accent-strong)}.feedback-wrong{background:var(--warn-soft);color:var(--warn);border:1px solid var(--warn-line)}.list-card{padding:4px 20px}.list-row{border-bottom:1px solid var(--line);min-height:64px;color:var(--ink);align-items:center;gap:14px;padding:8px 0;text-decoration:none;display:flex}.list-row:last-child{border-bottom:none}a.list-row:hover .list-row-title,button.list-row:hover .list-row-title{color:var(--accent-strong)}button.list-row{width:100%;font:inherit;text-align:left;cursor:pointer;background:0 0;border-top:none;border-left:none;border-right:none}.list-row-main{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.list-row-title{font-size:17px;font-weight:700}.list-row-chevron{color:var(--muted);font-size:20px}.toolbar{flex-wrap:wrap;align-items:flex-end;gap:12px;display:flex}.toolbar .field{flex:240px}.word-hero{flex-direction:column;gap:8px;display:flex}.word-big{font-size:56px;font-weight:700;line-height:1.1}.word-meta{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.detail-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;display:grid}.detail-card{flex-direction:column;gap:10px;line-height:1.5;display:flex}.sentence{align-items:center;gap:12px;display:flex}.sentence-ja{font-size:20px;font-weight:700}.steps{counter-reset:step;flex-direction:column;gap:10px;display:flex}.step{align-items:center;gap:12px;font-size:15px;display:flex}.step-num{background:var(--accent-soft);width:28px;height:28px;color:var(--accent-strong);border-radius:14px;flex:none;justify-content:center;align-items:center;font-size:14px;font-weight:800;display:inline-flex}.keys{letter-spacing:.1em;font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:700}.stepper{gap:6px;display:flex}.stepper li{color:var(--muted);flex-direction:column;flex:1;gap:6px;font-size:13px;font-weight:700;display:flex}.stepper li:before{content:"";background:var(--line);border-radius:3px;height:6px}.stepper li[data-state=done]:before,.stepper li[data-state=current]:before{background:var(--accent)}.stepper li[data-state=current]{color:var(--accent-strong)}.idea-pattern{font-size:22px;font-weight:800}.example-list{flex-direction:column;gap:12px;display:flex}.example{border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:10px 0;display:flex}.example:last-child{border-bottom:none}.chat{flex-direction:column;gap:12px;display:flex}.bubble{border-radius:18px;flex-direction:column;gap:4px;max-width:85%;padding:12px 16px;line-height:1.4;display:flex}.bubble-tutor{background:var(--surface);box-shadow:var(--card-shadow);border-bottom-left-radius:6px;align-self:flex-start}.bubble-learner{background:var(--accent-soft);color:var(--accent-strong);border-bottom-right-radius:6px;align-self:flex-end}.bubble-ja{font-size:18px;font-weight:700}.bubble-row{align-items:center;gap:8px;display:flex}.recap-list{flex-direction:column;gap:8px;line-height:1.5;display:flex}.skill-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;display:grid}.skill-card{flex-direction:column;gap:10px;display:flex}.skill-level{font-family:var(--font-display), var(--font-body), sans-serif;font-size:40px;font-weight:800;line-height:1}.ladder{gap:6px;display:flex}.ladder li{border:1px solid var(--line);height:40px;color:var(--muted);border-radius:10px;flex:1;justify-content:center;align-items:center;font-size:14px;font-weight:800;display:flex}.ladder li[data-state=next]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-strong)}.stats{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;display:grid}.stat{flex-direction:column;gap:2px;display:flex}.stat-value{font-family:var(--font-display), var(--font-body), sans-serif;font-size:32px;font-weight:800}.kana-grid{grid-template-columns:repeat(5,44px);gap:6px;display:grid}.kana-cell{background:var(--bg);height:44px;color:var(--muted);border:1px solid var(--line);border-radius:10px;justify-content:center;align-items:center;font-size:20px;font-weight:700;display:flex}.kana-cell[data-status=mastered]{background:var(--accent-soft);color:var(--accent-strong);border-color:var(--accent)}.kana-cell[data-status=shaky]{background:var(--warn-soft);color:var(--warn);border-color:var(--warn-line)}.legend{color:var(--muted);flex-wrap:wrap;gap:12px;font-size:13px;display:flex}.ime{flex-direction:column;gap:10px;display:flex}.ime-target{font-size:36px;font-weight:700}.suggestions{flex-wrap:wrap;gap:8px;display:flex}.suggestion{border:1px solid var(--line-strong);background:var(--surface);min-height:44px;color:var(--ink);font:700 20px var(--font-jp), sans-serif;cursor:pointer;border-radius:12px;padding:0 16px}.suggestion:hover{background:var(--accent-soft)}.flick-steps{flex-wrap:wrap;gap:8px;display:flex}.flick-step{border:1px solid var(--line);min-width:64px;color:var(--muted);border-radius:12px;flex-direction:column;align-items:center;gap:2px;padding:8px;font-size:13px;display:flex}.flick-step span[lang]{color:var(--ink);font-size:22px;font-weight:700}.pair{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.pair-option{border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;cursor:pointer;border-radius:16px;flex-direction:column;align-items:center;gap:4px;padding:18px 12px;display:flex}.pair-option:hover:not(:disabled){border-color:var(--accent)}.pair-option.is-right{border-color:var(--accent);background:var(--accent-soft)}.pair-option.is-wrong{border-color:var(--warn-line);background:var(--warn-soft)}.pair-kana{font-size:28px;font-weight:700}.morae{gap:4px;display:flex}.mora{background:var(--accent-soft);min-width:36px;height:36px;color:var(--accent-strong);border-radius:8px;justify-content:center;align-items:center;padding:0 4px;font-size:18px;font-weight:700;display:inline-flex}.btn-link{min-height:44px;color:var(--accent);cursor:pointer;font:700 14px var(--font-body), sans-serif;background:0 0;border:none;align-self:flex-start;padding:0;text-decoration:underline}button.list-row:disabled{cursor:default}button.list-row:disabled .list-row-title{color:var(--muted)}.list-card>h2{padding-top:16px}.signin{flex-direction:column;justify-content:center;gap:20px;max-width:440px;min-height:calc(100vh - 80px);margin:0 auto;display:flex}.signin .card{width:100%}.signin-title{text-align:center;font-size:22px;font-weight:800}.brand-header{text-align:center;flex-direction:column;align-items:center;gap:12px;display:flex}.wordmark-hero{flex-direction:column;gap:14px;font-size:52px}.brand-tagline{color:var(--muted);font-size:18px}.brand-companions{gap:16px;display:flex}.signin .actions .btn{flex:1}.signin-or{align-items:center;gap:10px;display:flex}.signin-or:before,.signin-or:after{content:"";border-top:1px solid var(--line);flex:1}.btn-apple,.btn-apple:hover{color:#fff;background:#000}.account-link{justify-content:space-between;align-items:center;gap:12px;margin-top:12px;display:flex}.account-link-name{align-items:center;gap:8px;font-weight:700;display:inline-flex}