.kana-page{padding-top:48px;padding-bottom:80px}.kana-page .eyebrow{justify-content:flex-start}.kana-toolbar{color:#526276;justify-content:space-between;align-items:center;gap:16px;margin:32px 0 16px;display:flex}.kana-charts{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;display:grid}.kana-settings{flex-wrap:wrap;align-items:end;gap:16px;margin-top:0;display:flex}.kana-settings label{gap:8px;font-size:14px;display:grid}.kana-settings input{color:#344864;background:#fffefa;border:1px solid #aebbc9;border-radius:8px;width:128px;min-height:48px;padding:8px 12px}.kana-choice-group{border:0;flex:0 0 100%;min-width:0;margin:0;padding:0}.kana-choice-group legend{text-align:left;letter-spacing:0;color:#526276;width:100%;margin-bottom:8px;font-size:14px;font-weight:700;line-height:20px}.kana-script-options,.kana-variant-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.kana-choice{color:#687689;background:#edf0f5;border:2px solid #d3d8e0;border-radius:8px;flex-direction:row;justify-content:center;align-items:center;gap:8px;min-width:0;min-height:48px;padding:8px 12px;font-size:14px;font-weight:600;line-height:20px;display:flex}.kana-choice>span:last-child{text-align:center;overflow-wrap:anywhere;min-width:0;max-width:100%}.kana-choice-symbol{font-size:24px;font-weight:500;line-height:32px}.kana-choice[aria-pressed=true]{color:#344864;background:#e3e9f1;border-color:#344864}.kana-choice:hover{background:#dce4ee}.kana-choice:focus-visible{outline-offset:4px;outline:3px solid #5b7190}.kana-section[hidden]{display:none}@media (width<=480px){.kana-script-options,.kana-variant-options{gap:8px}.kana-choice{flex-direction:column;min-height:48px;padding:8px 4px;font-size:12px;line-height:16px}.kana-choice-symbol{font-size:24px}}.kana-settings p{color:#526276;flex-basis:100%;font-size:12px;line-height:20px}.kana-chart[hidden]{display:none}.kana-chart{min-width:0}.kana-chart h2{align-items:baseline;gap:12px;margin-bottom:12px;font-size:20px;font-weight:500;line-height:28px;display:flex}.kana-chart h2 small{color:#526276;font-size:12px}.kana-grid{background:#fffefa;border:1px solid #aebbc9;grid-template-columns:repeat(5,minmax(0,1fr));width:100%;display:grid}.kana-cell{aspect-ratio:1;color:#344864;border:1px solid #c6d0de;place-items:center;font-size:24px;line-height:32px;display:grid;position:relative}.kana-cell[data-complete]{color:#28543b;background:#edf7ef}.kana-cell[aria-current]{outline-offset:-3px;background:#344864;outline:3px solid #344864}.kana-cell[aria-current]:after{content:"?";color:#fff;font-size:20px}.kana-unavailable{background:#edf0f5}.kana-unavailable:after{content:"";background:#aebbc9;width:140%;height:1px;position:absolute;transform:rotate(-45deg)}.kana-unavailable{overflow:hidden}.kana-console{max-width:680px;margin:32px auto 0;padding:24px}.kana-page{max-width:960px}.kana-charts{max-width:960px;margin:auto}#kana-prompt{color:#344864;font-size:20px;line-height:28px}.kana-console #quiz-feedback{min-height:48px}.kana-console .answer-submit:disabled{opacity:.4;cursor:default}@media (width<=1000px){.kana-charts{grid-template-columns:repeat(2,minmax(0,1fr))}.kana-grid{max-width:680px}}@media (width<=720px){.kana-page{padding-top:24px;padding-bottom:48px}.kana-cell{font-size:18px;line-height:28px}.kana-chart h2{font-size:18px}}.kana-chart-halves{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:8px;display:grid}@media (width<=720px){.kana-charts{grid-template-columns:minmax(0,1fr)}}.kana-section{margin-bottom:24px}.kana-section h3{color:#526276;margin-bottom:8px;font-size:14px;font-weight:600;line-height:20px}.kana-spelling-note{color:#526276;font-size:12px;line-height:20px}.kana-cell{font-size:20px}@media (width<=720px){.kana-cell{font-size:18px}}.kana-settings-panel{background:#fff;border:1px solid #d3d8e0;border-radius:8px;max-width:680px;margin:16px auto 0;position:relative}.kana-settings-panel[open]{z-index:20}.kana-settings-panel summary{cursor:pointer;color:#344864;min-height:48px;padding:12px 16px;font-size:14px;font-weight:600;line-height:24px}.kana-settings-panel summary:hover{background:#edf0f5}.kana-settings-panel .kana-settings{z-index:20;background:#fff;border:1px solid #d3d8e0;border-radius:8px;max-height:min(65vh,480px);padding:16px;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;box-shadow:0 12px 28px #27344629}.kana-page{padding-top:24px}.kana-page .breadcrumb{margin-bottom:12px}.kana-page .practice-intro h1{margin:8px 0;font-size:30px;line-height:36px}.kana-page .practice-intro p{font-size:14px;line-height:20px}.kana-toolbar{margin:16px 0 12px}.kana-answer-column{min-width:0}.kana-console{border-radius:8px;margin:16px auto 0;padding:16px}#kana-prompt{font-size:14px;line-height:20px}.kana-console #quiz{margin:12px 0 8px}.kana-console #quiz .answer-label{margin-bottom:4px}.kana-console .answer-entry{min-height:48px;padding:4px}.kana-console #quiz .answer-entry input{height:40px;padding:4px 0 4px 40px;font-size:20px;line-height:28px}.kana-console #quiz .answer-submit{flex-basis:40px;width:40px;min-height:40px;padding:8px}.kana-console #answer-help{margin-bottom:4px;line-height:16px}.kana-console #quiz-feedback{min-height:0;font-size:12px;line-height:16px}.kana-console #quiz-feedback:not(:empty){margin-top:8px}@media (width>=1100px){.kana-page{max-width:1280px}.kana-workspace{grid-template-columns:minmax(0,1fr) 280px;align-items:start;gap:24px;display:grid}.kana-answer-column{position:sticky;top:16px}.kana-console{margin-top:0}.kana-charts{grid-template-columns:minmax(0,1fr);gap:16px;width:100%}.kana-chart{grid-template-columns:10fr 5fr 6fr;align-items:start;gap:8px;display:grid}.kana-chart h2{grid-column:1/-1;margin-bottom:0;font-size:16px;line-height:24px}.kana-section{margin-bottom:0}.kana-section h3{min-height:32px;margin-bottom:4px;font-size:12px;line-height:16px}.kana-section[data-variant=diacritics] .kana-chart-halves{grid-template-columns:minmax(0,1fr)}.kana-grid{width:100%}.kana-cell{min-width:0;font-size:16px;line-height:20px}.kana-spelling-note{grid-column:1/-1;line-height:16px}}.kana-grid-frame{width:calc((100% - 2px) / 5 * var(--kana-columns,5) + 2px);position:relative}.kana-chart-halves{column-gap:28px;padding:20px 0 0 20px}.kana-column-headers,.kana-row-headers{color:#526276;text-align:center;font-size:12px;line-height:16px;display:grid;position:absolute}.kana-column-headers{top:-20px;left:0;right:0}.kana-row-headers{align-items:center;width:16px;top:0;bottom:0;left:-20px}.kana-charts.headers-hidden .kana-column-headers,.kana-charts.headers-hidden .kana-row-headers{visibility:hidden}.kana-settings .kana-header-toggle{cursor:pointer;flex-basis:100%;align-items:center;gap:8px;display:flex}.kana-settings .kana-header-toggle input{accent-color:#344864;width:16px;height:16px;min-height:16px;margin:0;padding:0}@media (width>=1100px){.kana-grid-frame{width:100%}}.kana-charts.basic-only .kana-chart{display:block}.kana-charts.basic-only .kana-spelling-note{display:none}.kana-charts.basic-only .kana-section{margin-bottom:0}.kana-charts.basic-only .kana-section h3{min-height:0}.kana-page{padding-bottom:24px}@media (width>=900px){.kana-page{max-width:1280px}.kana-workspace{grid-template-columns:minmax(0,1fr) 280px;align-items:start;gap:24px;display:grid}.kana-answer-column{position:sticky;top:16px}.kana-console{margin-top:0}.kana-charts.basic-only{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;width:100%}.kana-charts.basic-only .kana-cell{min-width:0;font-size:18px;line-height:20px}}.kana-charts[hidden],.kana-recognition[hidden],.kana-settings label[hidden]{display:none}.kana-recognition{justify-items:center;gap:16px;padding:24px;display:grid}#kana-character-script{color:#526276;font-size:14px;line-height:20px}.kana-flashcard{aspect-ratio:1.2;background:#fffefa;border:1px solid #c6d0de;border-radius:16px;place-items:center;width:min(100%,320px);display:grid;box-shadow:4px 4px #e3e9f1,8px 8px #d3d8e0}#kana-character{color:#344864;font-size:96px;line-height:1}.kana-workspace.recognition-mode{align-items:center;max-width:880px;margin:auto}.kana-mode-options{gap:8px;margin-top:16px;display:flex}.kana-mode-options button{color:#526276;border:1px solid #c6d0de;border-radius:8px;min-height:40px;padding:8px 12px;font-size:14px;line-height:20px}.kana-mode-options button[aria-pressed=true]{color:#fff;background:#344864;border-color:#344864}.kana-choice-group[hidden]{display:none}.kana-settings .kana-mode-options{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:0;display:grid}