:root{--paper:#f5f3ec;--card:#fffefa;--ink:#283e34;--muted:#737c72;--line:#dcded2;--accent:#b94b38;--soft:#e8eddc;--warm:#f6e6dc;--good:#35694a;--jp:'Hiragino Kaku Gothic ProN','Yu Gothic','Noto Sans CJK JP','Noto Sans JP',sans-serif;--serif:'Hiragino Mincho ProN','Yu Mincho','Noto Serif CJK JP',serif;--radius:16px}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.6 system-ui,-apple-system,'Segoe UI',sans-serif}button,input,select,textarea{font:inherit;color:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,canvas:focus-visible{outline:3px solid var(--accent);outline-offset:3px}a{color:var(--accent);text-underline-offset:4px}h1,h2,h3,p{margin:0}h1{font-size:39px;line-height:1.15;letter-spacing:-1.5px}h2{font-size:22px;line-height:1.3;letter-spacing:-.5px}h3{font-size:17px;line-height:1.4}p+p{margin-top:12px}small,.small{font-size:12px}.muted{color:var(--muted)}.jp{font-family:var(--jp);font-weight:400;font-style:normal}.serif{font-family:var(--serif)}.eyebrow{font-size:10px;font-weight:750;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}.accent{color:var(--accent)}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.between{justify-content:space-between}.stack{display:grid;gap:18px}.mt{margin-top:25px}.mt-sm{margin-top:12px}.mb{margin-bottom:22px}.hidden{display:none!important}.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.sr:focus{position:fixed;z-index:1200;clip:auto;width:auto;height:auto;margin:10px;padding:12px;background:white}.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:10px 17px;border:1px solid var(--line);border-radius:10px;background:var(--card);font-size:13px;font-weight:650;line-height:1.4;text-decoration:none;transition:background .15s,transform .15s}.button:hover:not(:disabled){background:#eef0e6;transform:translateY(-1px)}.button.primary{background:var(--ink);border-color:var(--ink);color:#fffefa}.button.primary:hover{background:#385746}.button.rust{background:var(--accent);border-color:var(--accent);color:white}.button.ghost{background:transparent;border-color:transparent}.button.sm{min-height:36px;padding:7px 11px;font-size:12px}.button.square{min-width:42px;padding:9px}.button.danger{color:#aa342c;border-color:#e5bdb1}.pill{display:inline-flex;gap:6px;align-items:center;padding:4px 10px;border-radius:99px;background:var(--soft);color:var(--good);font-size:10px;font-weight:650;letter-spacing:.3px}.pill.warm{background:var(--warm);color:var(--accent)}.pill.neutral{background:#efefe7;color:var(--muted)}.card{padding:25px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 10px 30px #2c3a2905}.note{background:var(--soft);border:1px solid #d9e1ca;padding:16px 18px;border-radius:12px;font-size:13px}.note.warm{background:var(--warm);border-color:#e9cfc1}.rule{height:1px;background:var(--line);margin:23px 0}.progress-track{height:5px;border-radius:99px;background:#e2e5d8;overflow:hidden}.progress-track>span{display:block;height:100%;background:var(--accent);border-radius:99px}.empty{padding:48px 25px;text-align:center;border:1px dashed var(--line);border-radius:16px}.empty h2{margin-bottom:12px}.empty p{max-width:540px;margin:0 auto 20px;color:var(--muted)}
.sidebar{width:228px;position:fixed;inset:0 auto 0 0;background:#eeefe5;border-right:1px solid var(--line);padding:30px 19px 23px;display:flex;flex-direction:column;z-index:40}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);margin:2px 11px 43px}.brand-mark{display:grid;place-items:center;width:44px;height:47px;background:var(--accent);color:#fffaf2;border-radius:11px;font-size:31px;font-family:var(--serif);line-height:1}.brand b{font-size:28px;letter-spacing:-1.4px;font-weight:750}.brand small{font-size:8px;display:block;letter-spacing:1.5px;text-transform:uppercase;margin-top:-3px}.nav-label{font-size:9px;letter-spacing:1.8px;text-transform:uppercase;color:var(--muted);padding:0 14px;margin-bottom:12px}.desktop-nav{display:grid;gap:5px}.nav-item{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border:0;border-radius:10px;background:transparent;text-align:left;color:#6b766b;font-size:13px}.nav-item:hover{background:#e4e9da}.nav-item.active{background:#dde6d2;color:var(--ink);font-weight:700}.nav-item .badge{margin-left:auto;padding:0 6px;border-radius:5px;background:var(--card);font-size:10px}.sidebar-foot{margin-top:auto;padding-top:28px}.sidebar-foot .note{background:#e5eadb;padding:15px;font-size:11px}.sidebar-foot .note h3{font-size:13px;margin:7px 0}.sidebar-foot .status{font-size:10px;margin:15px 12px 8px;color:var(--muted)}.dot{display:inline-block;width:6px;height:6px;background:#7e946c;border-radius:50%;margin-right:5px}.shell{margin-left:228px;min-height:100vh}.topbar{height:78px;margin:0 42px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.breadcrumbs{display:flex;gap:13px;align-items:center;font-size:12px;color:var(--muted)}.breadcrumbs strong{color:var(--ink);font-weight:550}.toptools{display:flex;gap:7px;align-items:center}.lang-switch{display:flex;gap:2px;padding:3px;background:#e9ebe1;border:1px solid var(--line);border-radius:9px}.lang-switch button{border:0;background:transparent;padding:5px 8px;border-radius:5px;font-size:10px;font-weight:700;color:var(--muted)}.lang-switch button.active{background:var(--card);color:var(--ink);box-shadow:0 1px 3px #0001}.mobile-brand{display:none}.avatar{height:30px;width:30px;border-radius:50%;display:grid;place-items:center;background:#e2e8d8;color:#50664c;font-size:11px;font-weight:700}.account-label{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#main{max-width:1290px;margin:auto;padding:34px 42px 64px}.pagehead{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:28px}.pagehead .eyebrow{margin-bottom:10px}.pagehead p{font-size:14px;color:var(--muted);margin-top:11px;max-width:650px}.pagehead>.button{flex-shrink:0}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:25px;padding:12px 0 25px;align-items:center}.hero h1{font-size:clamp(40px,4vw,59px);line-height:1.07;letter-spacing:-2.5px;margin:15px 0 20px}.hero h1 em{font-family:Georgia,serif;font-weight:400;color:var(--accent)}.hero p{font-size:14px;max-width:425px;color:var(--muted)}.hero-actions{margin:27px 0 14px}.hero-art{position:relative;min-height:280px;display:grid;place-items:center}.art-disc{position:absolute;width:230px;height:230px;border-radius:50%;background:#e2e8d8}.art-card{position:absolute;width:175px;height:213px;border:1px solid #d2d6c8;border-radius:12px;display:flex;align-items:center;flex-direction:column;justify-content:center;box-shadow:0 10px 35px #374b3010}.art-card.back{background:#e9eedf;transform:rotate(-12deg);left:calc(50% - 129px);top:28px}.art-card.front{background:#fffef8;transform:rotate(10deg);left:calc(50% - 20px);top:42px}.art-card .jp{font-size:103px;line-height:1.5;font-family:var(--serif)}.art-card.front .jp{font-size:63px;letter-spacing:-3px;color:var(--accent)}.art-card small{font-size:11px;color:var(--muted)}.art-card .eyebrow{position:absolute;top:12px;left:16px;font-size:8px}.art-stamp{position:absolute;bottom:5px;right:5px;font-size:9px;letter-spacing:1.6px;color:var(--muted)}.stats{display:grid;grid-template-columns:repeat(3,1fr);margin:13px 0 28px;border:1px solid var(--line);border-radius:14px;background:#fafaf4;overflow:hidden}.stat{padding:19px 24px}.stat+.stat{border-left:1px solid var(--line)}.stat b{font-size:30px;font-weight:650;letter-spacing:-1px;line-height:1.2}.stat b small{font-size:13px;letter-spacing:0;font-weight:400;color:var(--muted)}.stat p{font-size:11px;color:var(--muted);margin-top:5px}.section-label{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px}.section-label h2{font-size:20px}.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.path-card{display:flex;flex-direction:column;gap:12px;padding:24px;border:1px solid var(--line);border-radius:15px;background:var(--card);text-align:left;color:var(--ink);min-width:0}.path-card.green{background:#e6eddb;border-color:#cbd9c0}.path-card.warm{background:#f4e8db;border-color:#e2cfba}.path-card .symbol{font-size:39px;font-family:var(--serif);color:var(--accent);line-height:1.2}.path-card p{font-size:12px;color:var(--muted)}.path-card .button{align-self:flex-start;margin-top:auto}.weekday-row{display:flex;gap:8px}.day-dot{display:flex;align-items:center;flex-direction:column;gap:7px;font-size:9px;color:var(--muted)}.day-dot b{width:31px;height:31px;border:1px solid var(--line);border-radius:8px;display:grid;place-items:center;background:#f0f0e8;font-size:10px}.day-dot b.done{background:#d8e6cf;border-color:#adc39e;color:var(--good)}.topic-links{display:flex;gap:8px;flex-wrap:wrap}.topic-links button{padding:8px 13px;border:1px solid var(--line);border-radius:9px;background:var(--card);font-size:12px}.topic-links small{margin-left:7px;color:var(--muted)}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 22px;align-items:center}.toolbar input{flex:1;min-width:190px}.toolbar select{width:auto;max-width:220px}.tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:22px}.tabs button{min-height:39px;padding:8px 14px;border:1px solid var(--line);background:transparent;border-radius:9px;font-size:12px;font-weight:600}.tabs button.active{background:var(--ink);color:white;border-color:var(--ink)}input:not([type=checkbox]),select,textarea{width:100%;min-height:45px;border:1px solid #cdd5c6;border-radius:9px;background:var(--card);padding:10px 12px;line-height:1.5}textarea{resize:vertical;min-height:100px}.field>span{display:block;font-size:12px;font-weight:650;margin-bottom:6px}.field small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.full{grid-column:1/-1}.check{display:flex;align-items:center;gap:9px;font-size:13px}.check input{width:17px;height:17px;accent-color:var(--ink)}.word-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.word-tile{position:relative;display:flex;flex-direction:column;gap:8px;min-height:180px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:19px;text-align:left;overflow:hidden}.word-tile:hover{border-color:#9cac8e;box-shadow:0 8px 18px #28392a07}.word-tile .jp{font-size:29px;line-height:1.45;overflow-wrap:anywhere}.word-tile .reading{font-size:12px;color:var(--accent);margin-top:-4px}.word-tile .meaning{font-size:13px;line-height:1.45;overflow-wrap:anywhere}.word-tile .bottom{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:10px;gap:8px}.word-tile .bottom small{font-size:10px;color:var(--muted)}.word-tile .tiny{font-size:10px;color:var(--muted)}.disabled-card{opacity:.55}.grammar-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.grammar-tile{display:flex;flex-direction:column;gap:11px;padding:23px;border:1px solid var(--line);border-radius:14px;background:var(--card);text-align:left;min-width:0}.grammar-tile:hover{border-color:#a0b090}.grammar-tile .pattern{font-size:23px;color:var(--accent);font-family:var(--jp);line-height:1.5;overflow-wrap:anywhere}.grammar-tile p{font-size:12px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.grammar-tile .row{margin-top:auto}.detail{max-width:900px;margin:0 auto}.detail-title{font-family:var(--jp);font-size:58px;line-height:1.5;margin:10px 0;overflow-wrap:anywhere}.romaji{font-size:22px;color:var(--accent)}.example{padding:19px;border:1px solid #dce3d0;border-radius:12px;background:#eef2e5;overflow-wrap:anywhere}.example .jp{font-size:25px;line-height:1.65}.example .reading{font-size:13px;color:var(--accent);margin:5px 0}.example p{font-size:13px}.details-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}.forms-table{width:100%;border-collapse:collapse;font-size:13px}.forms-table td,.forms-table th{padding:13px 9px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}.forms-table td .jp{font-size:22px}.forms-table td small{display:block;color:var(--accent)}.explainer{white-space:pre-wrap;overflow-wrap:anywhere}.reading-breakdown{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}.reading-breakdown>span{min-width:37px;text-align:center;padding:7px;background:#f0f2e7;border:1px solid var(--line);border-radius:8px}.reading-breakdown .jp{display:block;font-size:22px}.reading-breakdown small{font-size:10px;color:var(--muted)}
.lesson-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.lesson-tile{display:flex;gap:15px;align-items:center;text-align:left;border:1px solid var(--line);border-radius:13px;padding:19px;background:var(--card)}.lesson-tile:hover{border-color:#9dad8e}.lesson-tile .number{font-size:10px;color:var(--muted);min-width:22px}.lesson-tile .jp{font-size:27px;letter-spacing:5px}.lesson-tile small{display:block;color:var(--muted);font-size:11px}.lesson-tile .icon{margin-left:auto}.lesson-layout{display:grid;grid-template-columns:1fr 1.05fr;gap:21px}.glyph-card{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:355px;text-align:center;padding:26px;background:var(--card);border:1px solid var(--line);border-radius:18px}.glyph-card .giant{font-size:160px;line-height:1.35;color:var(--accent);font-family:var(--jp)}.glyph-card .romaji{font-size:33px}.glyph-card .eyebrow{position:absolute;top:19px;left:22px}.kana-strip{display:flex;gap:8px;flex-wrap:wrap}.mini-kana{display:flex;flex-direction:column;align-items:center;border:1px solid #d3ddc9;border-radius:8px;min-width:46px;padding:7px 11px;background:#fffdf980}.mini-kana .jp{font-size:25px}.mini-kana small{font-size:10px;color:var(--muted)}button.mini-kana.active{border-color:var(--accent);background:var(--warm)}.lesson-controls{display:flex;justify-content:space-between;gap:12px;margin-top:24px}.stroke-inline{display:flex;align-items:center;gap:17px}.stroke-thumb{height:106px;width:106px;min-width:106px;border:1px solid var(--line);border-radius:10px;background:#f9fbf2}.stroke-svg{width:100%;height:100%;display:block}.stroke-svg .reference{fill:none;stroke:#dde4d5;stroke-width:3.6;stroke-linecap:round;stroke-linejoin:round}.stroke-svg .path{fill:none;stroke:var(--ink);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}.stroke-svg .numbers{font:6px system-ui;fill:var(--accent)}.stroke-svg .grid{stroke:#dfe4d6;stroke-width:.4;stroke-dasharray:2 2}.stroke-svg .pen{fill:var(--accent)}.write-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}.draw-frame{position:relative;width:100%;max-width:480px;aspect-ratio:1;border:1px solid #c9d4bd;border-radius:17px;overflow:hidden;background:var(--card);touch-action:none;margin:auto}.draw-frame::before,.draw-frame::after{content:'';position:absolute;pointer-events:none}.draw-frame::before{left:0;right:0;top:50%;border-top:1px dashed var(--line)}.draw-frame::after{top:0;bottom:0;left:50%;border-left:1px dashed var(--line)}.draw-frame .template{position:absolute;inset:7%;opacity:.2;pointer-events:none}.draw-frame .template.compare{opacity:.7}.draw-frame canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.write-picker{display:flex;gap:6px;flex-wrap:wrap}.write-picker button{width:45px;min-height:47px;border:1px solid var(--line);border-radius:8px;background:var(--card);font-size:23px}.write-picker button.active{border-color:var(--accent);background:var(--warm)}.stroke-demo{width:200px;height:200px;border:1px solid var(--line);border-radius:12px;background:#fafbf4;margin:15px auto}.kana-chart{display:grid;grid-template-columns:25px repeat(5,minmax(0,1fr));gap:8px;max-width:810px;margin:auto}.kana-chart .col,.kana-chart .rowlabel{text-align:center;align-self:center;font-size:12px;color:var(--muted)}.chart-kana{min-height:80px;border:1px solid var(--line);border-radius:11px;background:var(--card);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.chart-kana .jp{font-size:31px}.chart-kana small{font-size:11px;color:var(--muted)}.chart-kana.seen{background:#edf2e2}.chart-kana.secure{background:#d7e7ce;border-color:#aec49f}.chart-empty{border:1px dashed var(--line);border-radius:11px}.combo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.pair-row{display:flex;justify-content:center;gap:30px;font-size:58px;margin:15px 0}.pair-row small{display:block;text-align:center;color:var(--accent);font:14px system-ui}.pair-card p{font-size:13px;color:var(--muted)}
.practice-layout{max-width:850px;margin:auto}.mode-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.mode-button{display:flex;align-items:center;gap:13px;padding:19px;text-align:left;border:1px solid var(--line);border-radius:13px;background:var(--card)}.mode-button.active{border:2px solid var(--ink);padding:18px;background:#eaf0df}.mode-button .mode-symbol{font-size:25px;min-width:34px;color:var(--accent)}.mode-button b{display:block;font-size:13px}.mode-button p{font-size:11px;color:var(--muted);margin-top:4px}.quiz-shell{max-width:750px;margin:auto}.quiz-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;margin-bottom:13px}.quiz-card{padding:28px;background:var(--card);border:1px solid var(--line);border-radius:19px;margin:20px 0;min-height:365px;text-align:center;display:flex;align-items:center;flex-direction:column;justify-content:flex-start}.quiz-prompt{font-size:12px;color:var(--muted)}.quiz-glyph{font-family:var(--jp);font-size:130px;line-height:1.55}.quiz-word{font-family:var(--jp);font-size:48px;line-height:1.55;margin:25px 0 10px;overflow-wrap:anywhere;max-width:100%}.quiz-meaning{font-size:27px;font-weight:500;line-height:1.5;margin:28px 0;max-width:100%;overflow-wrap:anywhere}.quiz-sentence{font-family:var(--jp);font-size:27px;line-height:1.9;margin:27px 0;max-width:100%;overflow-wrap:anywhere}.answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px;width:100%;margin-top:20px}.answer{border:1px solid #d4ddca;border-radius:11px;background:#fcfdf5;min-height:65px;padding:13px;font-size:19px;line-height:1.4;overflow-wrap:anywhere}.answer:hover:not(:disabled){background:#e9efde;border-color:#8fa37f}.answer.jp{font-size:24px}.answer:disabled{opacity:1}.answer.correct{background:#e0efd8;border-color:#79a46a;color:#365d2f}.answer.wrong{background:#f8e2d8;border-color:#bd7158;color:#963d2f}.answer.faded{opacity:.5}.quiz-input{display:flex;gap:9px;width:100%;max-width:500px;margin-top:auto;padding-top:22px}.quiz-input input{font-size:21px;text-align:center;min-width:0}.quiz-input .button{flex-shrink:0}.feedback{padding:20px;border:1px solid #c6daba;border-radius:13px;background:#e5efdc;margin-top:18px}.feedback.bad{background:#f8e6dc;border-color:#e4c6b6}.feedback h3{margin-bottom:5px;font-size:16px}.feedback p{font-size:13px}.feedback .expected{font-size:21px;font-family:var(--jp);overflow-wrap:anywhere}.ratings{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;width:100%;margin-top:21px}.ratings button{padding:14px 8px;font-size:13px;border:1px solid var(--line);border-radius:10px;background:#eff3e6}.ratings button:first-child{background:var(--warm);color:var(--accent)}.ratings small{display:block;font-size:10px;margin-top:3px;color:var(--muted)}.flash-answer{width:100%;margin-top:22px;padding-top:22px;border-top:1px solid var(--line)}.flash-answer .jp{font-size:30px}.tile-bank,.tile-answer{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:17px 0;width:100%}.tile-answer{min-height:75px;padding:15px;border:1px dashed #becdaf;border-radius:12px;background:#f3f6ec}.tile{padding:11px 15px;background:var(--card);border:1px solid #c8d4be;border-radius:9px;font-family:var(--jp);font-size:20px}.tile small{display:block;font-family:system-ui;font-size:10px;color:var(--accent)}.summary-score{font-size:70px;font-weight:600;line-height:1.2;letter-spacing:-3px;margin:20px 0}.summary-score small{font-size:24px;color:var(--muted);letter-spacing:-.5px}.summary-list{display:grid;gap:8px;margin-top:18px}.summary-list>div{padding:11px 13px;background:var(--warm);border-radius:9px;font-size:13px}.heat-grid{display:grid;grid-template-columns:repeat(15,minmax(0,1fr));gap:6px}.heat-cell{display:grid;place-items:center;aspect-ratio:1;border:1px solid var(--line);border-radius:7px;background:#ecefe4;font-size:20px}.heat-cell.seen{background:#dce8cf}.heat-cell.secure{background:#466d4e;color:white}.progress-row{display:grid;grid-template-columns:1fr auto;gap:10px;padding:13px 0;border-bottom:1px solid var(--line);font-size:13px}.activity{display:flex;gap:5px;flex-wrap:wrap;margin-top:17px}.activity>div{width:28px;height:28px;border:1px solid var(--line);border-radius:6px;display:grid;place-items:center;font-size:9px}.activity>div.done{background:#d8e7cc;border-color:#b7cda4}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.settings-grid .card{min-width:0}.settings-grid h2{font-size:20px;margin-bottom:14px}.settings-grid p{font-size:13px;color:var(--muted)}.source-links{display:grid;gap:9px;margin:15px 0;font-size:12px}.correction{padding:16px 0;border-bottom:1px solid var(--line)}.correction del{display:block;color:#8a776c;font-size:12px;text-decoration-color:#c2a08c}.correction p{font-size:13px;margin-top:7px}.uncertain-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.uncertain-list code{font:12px system-ui;background:#fff9f0;border:1px solid #e3d2be;padding:7px 10px;border-radius:8px}.sync-status{overflow-wrap:anywhere}.error{color:#a63c30;font-size:13px;background:#f8e5db;border:1px solid #e1beb0;border-radius:9px;padding:12px;margin-top:12px}.success{color:var(--good)}.copy-url{word-break:break-all;font-size:12px}.import-preview{max-height:240px;overflow:auto;border:1px solid var(--line);border-radius:10px;margin-top:15px}.import-preview>div{padding:10px 13px;border-bottom:1px solid var(--line);font-size:12px}.import-preview .jp{font-size:18px;margin-right:12px}
dialog{width:min(680px,94vw);max-height:90dvh;overflow-y:auto;border:1px solid var(--line);border-radius:18px;background:var(--card);color:var(--ink);padding:27px;box-shadow:0 25px 90px #14271a30}dialog::backdrop{background:#20312588;backdrop-filter:blur(4px)}.modal-head{display:flex;justify-content:space-between;align-items:center;gap:13px;margin-bottom:20px}.modal-head h2{font-size:22px}.modal-foot{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:22px}.modal-text{font-size:13px;color:var(--muted)}#toast{position:fixed;bottom:26px;left:calc(50% + 114px);transform:translateX(-50%) translateY(15px);max-width:min(580px,90vw);width:max-content;z-index:1500;pointer-events:none;background:var(--ink);color:white;padding:13px 19px;border-radius:11px;font-size:13px;opacity:0;transition:opacity .15s,transform .15s;box-shadow:0 5px 24px #0002}#toast.show{opacity:1;transform:translateX(-50%)}.mobile-nav{display:none}@media(min-width:1550px){#main{padding-top:45px}}@media(max-width:1150px){.sidebar{width:200px;padding-left:13px;padding-right:13px}.shell{margin-left:200px}.topbar{margin:0 28px}#main{padding:28px}.hero h1{font-size:46px}.word-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-art{transform:scale(.85)}#toast{left:calc(50% + 100px)}}@media(max-width:900px){.sidebar{width:175px;padding:24px 9px}.shell{margin-left:175px}.brand{gap:8px;margin-left:9px}.brand b{font-size:25px}.brand-mark{width:36px;height:41px}.brand small{font-size:7px}.nav-item{padding:12px 10px;font-size:12px;gap:9px}.topbar{margin:0 22px}.breadcrumbs>span{display:none}#main{padding:25px 22px}.hero{grid-template-columns:1.2fr .8fr;gap:0}.hero h1{font-size:41px;letter-spacing:-1.7px}.hero-art{transform:scale(.69);margin-left:-30px}.hero p{font-size:13px}.grid3{grid-template-columns:1fr}.grid3 .path-card{display:grid;grid-template-columns:45px 1fr;column-gap:18px}.grid3 .path-card .symbol{grid-row:1/4}.grid3 .path-card .button{grid-column:2}.lesson-layout{gap:14px}.lesson-tile{padding:16px 12px;gap:8px}.lesson-tile .jp{font-size:22px;letter-spacing:2px}.lesson-glyph .giant{font-size:130px}.stroke-inline{flex-wrap:wrap}.heat-grid{grid-template-columns:repeat(10,1fr)}.grammar-tile{padding:19px}.grammar-tile .pattern{font-size:20px}#toast{left:calc(50% + 87px)}}
@media(max-width:650px){body{font-size:14px}.sidebar{display:none}.shell{margin:0;padding-bottom:78px}.topbar{height:65px;margin:0 17px;gap:8px;position:relative}.breadcrumbs{display:none}.mobile-brand{display:flex;align-items:center;gap:7px;font-weight:750;font-size:21px;letter-spacing:-1px}.mobile-brand .brand-mark{width:29px;height:32px;border-radius:7px;font-size:22px}.toptools{gap:3px}.toptools>.button{padding:7px 8px;font-size:10px;min-height:36px}.toptools .account-label{display:none}.avatar{width:27px;height:27px}.toptools .romaji-toggle{font-size:10px;padding:7px}.lang-switch button{padding:5px 7px;font-size:10px}.mobile-nav{position:fixed;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px;border-top:1px solid var(--line);background:#f7f7ef;padding:7px 5px max(7px,env(safe-area-inset-bottom));z-index:40;min-height:67px}.mobile-nav button{display:flex;align-items:center;flex-direction:column;gap:4px;min-height:49px;padding:5px 1px;background:transparent;border:0;border-radius:8px;color:var(--muted);font-size:9px;line-height:1.3}.mobile-nav button.active{background:#e1e9d6;color:var(--ink);font-weight:700}.mobile-nav .icon{width:19px;height:19px}#main{padding:24px 17px 34px}h1{font-size:32px;letter-spacing:-1.2px}h2{font-size:21px}.pagehead{margin-bottom:24px;gap:12px;flex-wrap:wrap}.pagehead p{font-size:13px}.pagehead>.button{font-size:12px;min-height:41px;padding:9px 12px}.pagehead .eyebrow{font-size:9px}.hero{display:block;position:relative;padding:4px 0 16px}.hero h1{font-size:42px;max-width:325px;letter-spacing:-1.7px;position:relative;z-index:2;margin:13px 0 20px}.hero p{max-width:300px;position:relative;z-index:2;font-size:13px}.hero .eyebrow{font-size:9px;letter-spacing:1.4px}.hero-art{width:95px;height:160px;min-height:160px;transform:scale(.42);position:absolute;right:3px;top:8px;transform-origin:right top;margin:0;opacity:.32;pointer-events:none}.art-stamp{display:none}.hero-actions{gap:7px;margin-top:23px}.hero-actions .button{font-size:12px;padding:12px 14px}.stats{margin:4px 0 26px}.stat{padding:16px 12px}.stat b{font-size:26px}.stat b small{font-size:11px}.stat p{font-size:10px;line-height:1.5}.grid2,.settings-grid{grid-template-columns:1fr}.card{padding:21px}.path-card{padding:21px}.word-grid{gap:10px}.word-tile{padding:16px 13px;min-height:185px}.word-tile .jp{font-size:25px}.word-tile .reading{font-size:11px}.word-tile .meaning{font-size:12px}.word-tile .bottom{flex-wrap:wrap;gap:5px}.word-tile .bottom small{font-size:9px}.toolbar{gap:8px}.toolbar input{flex-basis:100%}.toolbar select{flex:1;max-width:none;min-width:0;font-size:12px}.grammar-grid{grid-template-columns:1fr;gap:12px}.grammar-tile{padding:22px}.grammar-tile .pattern{font-size:23px}.formgrid{grid-template-columns:1fr}.full{grid-column:auto}.detail-title{font-size:47px}.example .jp{font-size:22px}.forms-table{font-size:11px}.forms-table td,.forms-table th{padding:12px 5px}.forms-table td .jp{font-size:20px}.forms-table td small{font-size:10px}.lesson-grid,.lesson-layout,.write-layout{grid-template-columns:1fr}.lesson-tile{padding:18px;gap:15px}.lesson-tile .jp{font-size:25px;letter-spacing:4px}.glyph-card{min-height:310px}.glyph-card .giant{font-size:145px;line-height:1.2;margin-top:16px}.glyph-card .romaji{font-size:30px}.stroke-inline{flex-wrap:nowrap}.lesson-controls .button{font-size:12px}.kana-chart{gap:5px;grid-template-columns:18px repeat(5,minmax(0,1fr))}.chart-kana{min-height:70px;border-radius:9px}.chart-kana .jp{font-size:26px}.chart-kana small{font-size:10px}.combo-grid{gap:6px}.tabs{gap:6px}.tabs button{font-size:11px;padding:9px 11px}.write-layout{gap:19px}.draw-frame{max-width:420px}.write-picker button{width:44px;min-height:46px}.mode-grid{gap:9px}.mode-button{display:block;padding:15px 13px}.mode-button.active{padding:14px 12px}.mode-button .mode-symbol{display:block;margin-bottom:7px;font-size:24px}.mode-button b{font-size:12px}.mode-button p{font-size:11px}.quiz-card{padding:24px 16px;min-height:335px}.quiz-glyph{font-size:119px}.quiz-word{font-size:39px;margin-top:25px}.quiz-meaning{font-size:23px}.quiz-sentence{font-size:23px}.answer-grid{gap:9px}.answer{font-size:15px;padding:12px 8px;min-height:63px}.answer.jp{font-size:21px}.quiz-input{flex-wrap:wrap;gap:8px}.quiz-input .button{width:100%}.quiz-input input{font-size:20px}.ratings{gap:7px}.ratings button{font-size:12px}.ratings small{font-size:9px}.tile{font-size:18px;padding:11px 12px}.tile-bank,.tile-answer{gap:7px}.heat-grid{grid-template-columns:repeat(10,minmax(0,1fr));gap:4px}.heat-cell{font-size:18px}.note{font-size:12px;padding:16px}.topic-links button{font-size:11px}.summary-score{font-size:64px}dialog{padding:22px;max-height:89dvh}.modal-head h2{font-size:21px}.modal-foot>.button{font-size:12px}#toast{left:50%;bottom:85px;max-width:89vw;width:89vw;font-size:12px}.hide-mobile{display:none!important}}
@media(max-width:360px){.hero h1{font-size:36px}.toptools .romaji-toggle{display:none}.word-grid{grid-template-columns:1fr}.word-tile{min-height:160px}.stat{padding:14px 9px}.stat b{font-size:24px}.pagehead{gap:9px}.heat-grid{grid-template-columns:repeat(9,1fr)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}@media print{.sidebar,.topbar,.mobile-nav,dialog,#toast,.button{display:none!important}.shell{margin:0}#main{padding:0}.card{box-shadow:none;break-inside:avoid}body{background:white}}
/* Study passes and requests share the notebook's paper, ink and sage palette. */
.study-invitation{display:flex;justify-content:space-between;align-items:center;gap:24px}.study-invitation p{margin-top:8px}.study-invitation>.button{flex-shrink:0}.study-passes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.study-pass{display:flex;flex-direction:column;gap:16px}.study-pass p{font-size:14px;color:var(--muted);line-height:1.65}.study-pass>strong{margin-top:auto;font-size:30px}.study-pass>strong small{display:block;font-size:13px;font-weight:400;color:var(--muted)}.pass-number{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;color:var(--good);font-size:18px}.request-list{display:grid;gap:18px;max-width:900px}.request-card h2{margin-top:16px;font-size:24px;overflow-wrap:anywhere}.request-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.request-description{margin-top:12px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7}.request-card .note p{white-space:pre-wrap;overflow-wrap:anywhere}.button[disabled]{cursor:default;opacity:.5}
@media(max-width:900px){.study-passes{grid-template-columns:1fr}.study-pass{gap:12px}.study-pass>strong small{display:inline;margin-left:8px}.study-invitation{flex-direction:column;align-items:stretch}.study-invitation>.button{align-self:flex-start}.mobile-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));min-height:112px}.mobile-nav>button{min-height:46px}#main{padding-bottom:155px}.request-card>.row{align-items:flex-start}.request-card .row{flex-wrap:wrap}}
/* Form and review details shared across desktop and touch layouts. */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.form-grid>*{min-width:0}.form-grid input,.form-grid select,.form-grid textarea{width:100%}.field input[type=password],.field input[type=number]{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);padding:12px;min-height:46px}.error-text{font-size:13px;color:#a63c30;margin-top:13px}.error-text:empty{display:none}.answer{position:relative}.answer .key{position:absolute;left:8px;top:5px;font-size:9px;opacity:.5}.answer-line{margin-top:12px;overflow-wrap:anywhere}.answer-line>.jp{font-size:27px;margin-right:12px}.answer-line .romaji{font-size:20px}.flash-answer{margin-top:20px;padding:20px;border-top:1px solid var(--line)}.feedback{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px;border:1px solid var(--line);border-radius:14px;background:#e8f0e2}.feedback.error{background:#f8e8df}.feedback>.button{flex-shrink:0}.quiz-card>.quiz-input,.quiz-card>.answer-grid,.quiz-card>.tile-answer,.quiz-card>.tile-bank{width:100%}.quiz-top{flex-wrap:wrap}.ratings{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.tile-bank{justify-content:center}.tile-answer{min-height:80px}.summary-list>span{display:block;padding:10px 12px;background:var(--warm);border-radius:9px;overflow-wrap:anywhere}.import-preview>p{padding:8px 12px;border-bottom:1px solid var(--line)}.center{text-align:center}.write-picker .seen{background:#e6eedf}.write-picker .secure{background:#436849;color:white}.correction code{font-size:13px;color:#847167}.quiz-word,.quiz-sentence,.quiz-glyph,.detail-title{overflow-wrap:anywhere;max-width:100%}.stat>strong{font-size:29px;line-height:1.2}.explanation{white-space:pre-line}.field textarea{resize:vertical}.disabled-card{opacity:.6}.draw-frame{isolation:isolate}
@media(max-width:650px){.form-grid{grid-template-columns:1fr}.feedback{align-items:stretch;flex-direction:column}.feedback>.button{align-self:flex-end}.quiz-word{font-size:34px}.quiz-glyph{font-size:110px}.form-grid textarea{min-height:85px}.modal-foot{align-items:stretch}}
.grid2,.grid3,.settings-grid,.lesson-layout,.write-layout{min-width:0}.grid2>*{min-width:0}.weekday-row{gap:6px;justify-content:space-between}.day-dot{min-width:0}.card{min-width:0}.hero-art{pointer-events:none}
@media(max-width:650px){.hero{overflow:hidden}.grid2,.settings-grid{grid-template-columns:minmax(0,1fr)}.topic-links{grid-template-columns:repeat(2,minmax(0,1fr))}.day-dot b{width:28px;height:28px}.day-dot span{font-size:9px}.day-dot{flex:0 1 auto}.section-label{flex-wrap:wrap}}
@media(max-width:650px){.grid3 .path-card{display:block}.grid3 .path-card .symbol{display:block;white-space:nowrap;font-size:29px;line-height:1.4;margin-bottom:10px}.grid3 .path-card .button{margin-top:16px;width:100%}}
/* Stroke controls wrap so the full lesson remains usable on narrow phones. */
.stroke-inline>div:last-child{min-width:0;flex:1}.stroke-inline .row{flex-wrap:wrap}.kana-reference button{min-height:70px}.kana-reference button small{display:block;font:11px system-ui,sans-serif;color:var(--muted)}
@media(max-width:600px){.stroke-inline{flex-wrap:wrap}.lesson-controls .button{min-width:0;white-space:normal}.quiz-glyph{overflow-wrap:anywhere}}
/* A guided course and a focused word pool, using the notebook's existing palette. */
.course-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,1fr);gap:24px;align-items:start}.course-current h2{font-size:29px;line-height:1.25;margin-top:9px}.course-word-set{display:flex;flex-wrap:wrap;gap:8px}.course-word-set>span{padding:9px 12px;background:var(--soft);border-radius:8px;min-width:0}.course-word-set .jp{display:block;font-size:23px}.course-word-set small{display:block;font-size:11px;overflow-wrap:anywhere}.course-patterns{padding:0;list-style:none;margin:12px 0}.course-patterns li{display:grid;gap:3px;padding:12px 0;border-bottom:1px solid var(--line)}.course-patterns .jp{font-size:15px;overflow-wrap:anywhere}.text-link{padding:0;border:0;background:none;text-align:left;text-decoration:underline;text-underline-offset:3px;color:var(--accent)}.course-rail{border-left:2px solid var(--line);margin-left:17px;padding:0 0 0 12px}.course-stop{display:flex;align-items:center;width:100%;gap:13px;border:0;border-bottom:1px solid var(--line);background:transparent;padding:16px 10px 16px 0;text-align:left;line-height:1.4}.course-stop>span:last-child{min-width:0;flex:1}.course-stop b{font-size:14px;display:block}.course-stop small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.course-stop.current{background:var(--soft);outline:2px solid var(--soft);border-radius:4px}.course-number{margin-left:-30px;width:34px;min-width:34px;height:34px;border:1px solid var(--line);border-radius:50%;background:var(--paper);display:grid;place-items:center;font-size:12px}.course-stop.completed .course-number{background:var(--ink);color:var(--card)}.pool-list{border-top:1px solid var(--line)}.pool-word{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}.pool-open{display:flex;gap:20px;align-items:center;min-width:0;flex:1;border:0;background:none;padding:0;text-align:left}.pool-open>.jp{font-size:26px;min-width:100px;overflow-wrap:anywhere}.pool-open>span:last-child{min-width:0;overflow-wrap:anywhere}.pool-open small{display:block;font-size:11px;color:var(--muted);margin-top:4px}.skill-results>div{display:flex;gap:16px;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:13px}.skill-results b{white-space:nowrap}.course-current .button{white-space:normal}
@media(max-width:900px){.course-layout{grid-template-columns:1fr}.pool-word{flex-wrap:wrap}.pool-word>.row{width:100%;justify-content:flex-end}.pool-open>.jp{min-width:82px}.course-current h2{font-size:25px}}

.quiz-audio{display:flex;justify-content:center;align-items:center;min-height:176px}.quiz-audio .button{min-height:56px;padding:0 24px;font-size:18px}.speed-time{font-variant-numeric:tabular-nums;color:var(--accent)}
.kana-answer span:last-child{font-family:var(--jp);font-size:30px;line-height:1.2}.giant.combo{font-size:min(110px,26vw);white-space:nowrap}
/* Report a wrong recording, and the owner's review list. */
#audio-report{position:fixed;right:24px;bottom:24px;z-index:1400;display:flex;align-items:center;gap:12px;padding:8px 8px 8px 16px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(40,62,52,.14);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .2s,transform .2s}#audio-report.show{opacity:1;transform:none;pointer-events:auto}#audio-report .jp{font-size:18px;max-width:40vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#audio-report .button{min-height:44px}
.report-reasons{border:0;padding:0;margin:0;gap:2px}.report-reasons legend{margin-bottom:6px}.report-reasons label{display:flex;align-items:center;gap:12px;min-height:44px;padding:4px 10px;border-radius:9px;cursor:pointer}.report-reasons label:hover{background:var(--soft)}.report-reasons label:has(input:checked){background:var(--soft);font-weight:600}.report-reasons input[type=radio]{width:20px;height:20px;min-height:0;padding:0;margin:0;flex:none;accent-color:var(--ink)}
.audio-recent{list-style:none;padding:0;margin:8px 0 0}.audio-recent li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line)}.audio-recent .jp{font-size:18px}.audio-report-settings details summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:13px;font-weight:600}
.review-list{display:grid;gap:14px}.review-clip{display:grid;gap:12px}.review-clip.is-wrong{border-color:#e9cfc1;background:var(--warm)}.review-clip-main{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.review-text{font-size:34px;line-height:1.2}.review-tags{flex-wrap:wrap;gap:6px}.review-reports{margin:0;padding-left:18px;display:grid;gap:4px}.review-clip .row{flex-wrap:wrap}.review-clip kbd{font:600 10px/1 var(--jp);border:1px solid currentColor;border-radius:4px;padding:2px 4px;opacity:.6}
.listen-through{display:grid;gap:12px;max-width:640px}.listen-through .review-text{font-size:56px}
.skeleton{height:120px;background:linear-gradient(90deg,var(--soft),var(--card),var(--soft));background-size:200% 100%;animation:skeleton 1.2s ease-in-out infinite}@keyframes skeleton{to{background-position:-200% 0}}
@media(max-width:650px){#audio-report{left:16px;right:16px;bottom:85px;justify-content:space-between}#audio-report .jp{max-width:45vw}.review-text{font-size:28px}.listen-through .review-text{font-size:44px}.review-clip-main{flex-direction:column}}
@media(prefers-reduced-motion:reduce){#audio-report{transition:none;transform:none}.skeleton{animation:none}}
.report-card{display:grid;gap:10px}.report-card h2{font-size:22px}.report-context{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px;margin:0;padding:10px 12px;background:var(--soft);border-radius:9px}.report-context dt{color:var(--muted)}.report-context dd{margin:0}.report-card .row{flex-wrap:wrap}
.sheet-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,400px);gap:22px;align-items:start}.sheet-preview{margin:0;position:sticky;top:18px;display:grid;gap:8px}.sheet-paper{background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 14px 34px #2c3a2914;overflow:hidden}.sheet-paper svg{display:block;width:100%;height:auto}.sheet-rows{display:grid;gap:7px}.sheet-row{display:grid;grid-template-columns:minmax(64px,92px) repeat(5,minmax(44px,60px));gap:6px;align-items:stretch}.sheet-row-btn{min-width:0;min-height:48px;padding:6px 8px;border:1px dashed var(--line);border-radius:8px;background:transparent;color:var(--muted);font-size:11px;font-weight:650;text-align:left;transition:background .15s,border-color .15s}.sheet-row-btn:hover{background:#eef0e6}.sheet-row-btn[aria-pressed=true]{border-style:solid;border-color:var(--ink);color:var(--ink)}.sheet-kana{position:relative;min-width:0;min-height:52px;border:1px solid var(--line);border-radius:8px;background:var(--card);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.15;font-size:21px;transition:background .15s,border-color .15s,transform .15s}.sheet-kana small{font-size:10px;color:var(--muted)}.sheet-kana:hover{border-color:var(--ink);transform:translateY(-1px)}.sheet-kana[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fffefa}.sheet-kana[aria-pressed=true] small{color:#dfe6da}.sheet-kana[aria-pressed=true]::after{content:'✓';position:absolute;top:2px;right:4px;font-size:9px;line-height:1}.seg{display:flex;flex-wrap:wrap;gap:6px;border:0;margin:0;padding:0;min-width:0}.seg legend{width:100%;padding:0;margin-bottom:6px;font-size:12px;font-weight:650}.seg label{position:relative}.seg input{position:absolute;opacity:0;width:1px;height:1px}.seg span{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:9px;font-size:12px;font-weight:600;cursor:pointer;transition:background .15s}.seg span:hover{background:#eef0e6}.seg input:checked+span{background:var(--ink);border-color:var(--ink);color:#fffefa}.seg input:focus-visible+span{outline:3px solid var(--accent);outline-offset:2px}.field select:disabled{opacity:.5}
@media(max-width:1150px){.sheet-layout{grid-template-columns:1fr}.sheet-preview{position:static;max-width:440px;margin:0 auto;width:100%}}
@media(max-width:600px){.sheet-row{grid-template-columns:repeat(5,minmax(0,1fr))}.sheet-row-btn{grid-column:1/-1;min-height:44px}}
@media(prefers-reduced-motion:reduce){.sheet-kana,.sheet-row-btn,.seg span{transition:none}.sheet-kana:hover{transform:none}}
/* Japan trip */
.trip-scenes button{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--ink)}
.trip-scenes button span{font-family:var(--jp);font-size:16px;color:var(--accent)}
.trip-scenes button small{color:var(--muted)}
.trip-scenes button.active{background:var(--ink);border-color:var(--ink);color:white}
.trip-scenes button.active span,.trip-scenes button.active small{color:inherit}
.trip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:15px}
.trip-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);overflow:hidden}
.trip-sign{display:flex;align-items:center;justify-content:center;min-height:96px;padding:14px;background:var(--ink);color:#fffefa;font-family:var(--jp);font-size:34px;font-weight:700;letter-spacing:3px;text-align:center;line-height:1.25;word-break:keep-all}
.trip-body{display:flex;flex-direction:column;gap:8px;padding:16px 18px 18px;flex:1}
.trip-body .jp{font-size:18px}
.trip-body h3,.trip-phrase h3,.trip-note h3,.trip-day h3{font-size:16px;margin:0}
.trip-body>.button,.trip-body>.pill{align-self:flex-start;margin-top:auto}
.trip-phrase{display:flex;flex-direction:column;gap:8px;padding:18px}
.trip-phrase-jp{font-size:21px;line-height:1.4}
.trip-note{display:flex;flex-direction:column;gap:8px;padding:18px}
.trip-note p{margin:0;font-size:14px;line-height:1.55}
.trip-source a{color:var(--good);text-decoration:underline;text-underline-offset:2px}
.trip-plan-pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px}
.trip-plan-pick button{display:flex;align-items:center;gap:14px;min-height:64px;padding:10px 16px;border:1px solid var(--line);border-radius:14px;background:var(--card);text-align:left;transition:border-color .15s,background .15s}
.trip-plan-pick button:hover{border-color:var(--plan-mid)}
.trip-plan-pick button[aria-pressed=true]{border:2px solid var(--plan);background:var(--plan-soft)}
.trip-pick-city{font-family:var(--serif);font-size:24px;line-height:1.1;color:var(--plan);white-space:nowrap}
.trip-plan-pick strong{display:block;font-size:14px;line-height:1.3}.trip-plan-pick small{color:var(--muted)}
.trip-scene{display:block;width:100%;height:150px}
.trip-sun{fill:var(--plan-mid)}.trip-far{fill:var(--plan-mid);opacity:.75}.trip-snow{fill:var(--card)}.trip-near{fill:var(--plan);opacity:.9}
.trip-cloud,.trip-ink{fill:none;stroke:var(--plan);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.trip-cloud{stroke:var(--plan-mid);stroke-width:2}
.trip-plan-hero .trip-cloud,.trip-plan-hero .trip-ink{stroke-dasharray:1;animation:trip-draw 1.6s .2s ease-out both}
.trip-plan-hero .trip-sun{animation:trip-rise 1.4s ease-out both}
.trip-plan-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:center;gap:10px 24px;border-radius:20px;background:var(--plan-soft);overflow:hidden}
.trip-plan-hero .trip-scene{height:100%;min-height:150px}
.trip-plan-hero>div{padding:20px 24px 20px 0}.trip-plan-hero h2{margin:0 0 6px}.trip-plan-hero p{color:var(--ink);opacity:.8;max-width:520px}
.trip-route{margin:16px 0 14px;scroll-margin-top:12px}
.trip-route-track{position:relative;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr))}
.trip-route-line{position:absolute;left:0;right:0;top:2px;width:100%;height:40px;overflow:visible;pointer-events:none}
.trip-route-line path{fill:none;stroke:var(--plan-mid);stroke-width:2.5;stroke-linecap:round}
.trip-route button{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;min-height:44px;padding:0;border:0;background:none;color:var(--ink)}
.trip-route b{display:grid;place-items:center;width:44px;height:44px;border:2px solid var(--plan);border-radius:50%;background:var(--card);color:var(--plan);font-size:15px;transition:background .2s,color .2s,transform .2s}
.trip-stop-name{font-size:13px;font-weight:650;line-height:1.2;text-align:center}.trip-stop-jp{font-family:var(--serif);font-size:12px;color:var(--muted)}
.trip-route button:hover b{transform:scale(1.08)}
.trip-route button[aria-pressed=true] b{background:var(--plan);color:var(--card);transform:scale(1.1)}
.trip-route button[aria-pressed=true] .trip-stop-name{color:var(--plan)}
.trip-day{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;scroll-margin-top:16px;animation:trip-in .3s ease-out both}
.trip-day-stamp{display:flex;flex-direction:column;align-items:center;gap:4px;align-self:start;padding:14px 8px;text-align:center}
.trip-day-place{font-family:var(--serif);font-size:30px;line-height:1.15;color:var(--plan);writing-mode:vertical-rl;letter-spacing:6px;min-height:60px}
.trip-day-kana{font-family:var(--jp);font-size:13px;color:var(--muted)}.trip-day-name{font-size:15px;font-weight:700}
.trip-motif{width:56px;height:56px;margin-top:4px}
.trip-motif path{fill:none;stroke:var(--plan);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;animation:trip-draw 1s .1s ease-out both}
.trip-day-page{position:relative;display:flex;flex-direction:column;gap:12px;padding:22px 24px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 10px 30px #2c3a2908;min-width:0}
.trip-day-page h3{font-size:19px;margin:0;padding-right:44px}.trip-day-page h3:focus{outline:none}
.trip-day-page>p{margin:0;font-size:14px;line-height:1.6}
.trip-done{position:absolute;top:14px;right:16px;display:grid;place-items:center;width:40px;height:40px;border:2px solid var(--accent);border-radius:50%;color:var(--accent);font-family:var(--serif);font-size:20px;transform:rotate(-12deg);opacity:.85}
.trip-facts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px}
.trip-facts li{padding:10px 14px 10px 16px;border-radius:10px;background:var(--plan-soft);border-left:3px solid var(--plan-mid)}
.trip-facts .trip-source{display:block;margin-top:3px}
.trip-slots{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
.trip-slot{display:grid;grid-template-columns:92px minmax(0,1fr);gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.trip-slot:first-child{border-top:0;padding-top:4px}
.trip-when{font-size:12px;font-weight:750;letter-spacing:1px;text-transform:uppercase;color:var(--plan);padding-top:3px}
.trip-slot-stops{display:flex;flex-direction:column;gap:16px}
.trip-stop{display:flex;flex-direction:column;gap:6px}
.trip-stop h4{margin:0;font-size:17px;line-height:1.35}
.trip-stop-kanji{font-family:var(--serif);font-weight:400;color:var(--plan);margin-left:4px}
.trip-stop-kana{font-family:var(--jp);font-size:13px;color:var(--muted);margin-top:-4px}
.trip-stop>p{margin:0;font-size:15px;line-height:1.55}
.trip-access{display:flex;gap:8px;align-items:flex-start;font-size:14px}.trip-access .icon{width:18px;height:18px;margin-top:2px;color:var(--plan)}
.trip-access .trip-source{display:block}
.trip-map{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;min-height:44px;padding:8px 13px;border:1px solid var(--plan-mid);border-radius:10px;color:var(--plan);font-size:13px;font-weight:650;text-decoration:none;transition:background .15s}
.trip-map:hover{background:var(--plan-soft)}.trip-map .icon{width:18px;height:18px}
.trip-map-day{background:var(--plan-soft)}
.trip-day-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 0 136px}
.trip-day-end{color:var(--plan);font-weight:650}
.trip-plan-note{margin:16px 0 0 136px}
.trip-read{display:flex;flex-direction:column;gap:10px;padding-top:14px;border-top:1px dashed var(--line)}
.trip-read>.button{align-self:flex-start}
.trip-plates{display:flex;flex-wrap:wrap;gap:8px}
.trip-plate{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:64px;min-height:44px;padding:8px 12px;border:0;border-radius:9px;background:var(--ink);color:#fffefa;transition:transform .15s,background .15s}
.trip-plate>span:first-child{font-family:var(--jp);font-size:22px;font-weight:700;letter-spacing:1px}
.trip-plate small{font-size:12px;opacity:.85;max-width:140px;text-align:center;line-height:1.3}.trip-plate-kana{font-family:var(--jp);font-size:13px;opacity:.85}
.trip-plate:hover{transform:translateY(-2px);background:#385746}
@keyframes trip-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes trip-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes trip-rise{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}
@media(max-width:760px){.trip-plan-pick{grid-template-columns:1fr}.trip-plan-hero{grid-template-columns:1fr}.trip-plan-hero .trip-scene{min-height:110px;height:110px}.trip-plan-hero>div{padding:0 18px 18px}
.trip-day{grid-template-columns:1fr;gap:0}.trip-day-stamp{flex-direction:row;justify-content:flex-start;gap:10px;padding:0 4px 8px}.trip-day-place{writing-mode:horizontal-tb;letter-spacing:2px;min-height:0;font-size:26px}.trip-day-stamp .eyebrow{order:-1}.trip-motif{width:36px;height:36px;margin:0 0 0 auto}.trip-day-page{padding:18px}.trip-day-nav,.trip-plan-note{margin-left:0}.trip-slot{grid-template-columns:1fr;gap:6px}.trip-day-nav>.small.muted{display:none}.trip-day-nav .button{white-space:normal;min-height:44px}.trip-plan-hero .trip-scene{min-height:90px;height:90px}
.trip-route{overflow-x:auto;margin-inline:-16px;padding:0 16px 6px;scrollbar-width:thin}.trip-route-track{min-width:calc(var(--n)*80px)}.trip-route b{width:40px;height:40px;font-size:14px}.trip-route-line{top:0;height:40px}}
@media(max-width:650px){.trip-scenes{display:grid;grid-template-columns:1fr 1fr}.trip-scenes button{padding:8px 10px;text-align:left}.trip-scenes button small{margin-left:auto}.trip-grid{grid-template-columns:1fr}.trip-sign{min-height:80px;font-size:30px}.trip-note p,.trip-day-page>p{font-size:15px}}

/* Daily review deck, answer intervals and the plan card */
.deck-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.deck-counts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0}
.deck-counts div{padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.deck-counts dt{font-size:12px;color:var(--muted)}.deck-counts dd{margin:4px 0 0;font-size:24px;font-weight:700;font-variant-numeric:tabular-nums}
.forecast{margin:0}.forecast ol{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:4px;list-style:none;margin:8px 0 0;padding:0;height:96px}
.forecast li{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:2px;min-width:0;position:relative}
.forecast .bar{display:block;width:100%;max-width:28px;border-radius:4px 4px 1px 1px;background:var(--good);opacity:.75;min-height:0}
.forecast li:first-child .bar{background:var(--accent);opacity:1}
.forecast b{font-size:10px;font-weight:600;order:-1;font-variant-numeric:tabular-nums}.forecast small{font-size:10px;color:var(--muted)}
.ratings.four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.ratings.four .button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;padding:8px 4px}
.ratings.four small{font-weight:400;font-size:11px}.ratings.four .primary small{color:inherit;opacity:.85}
.plan-card .button{min-height:44px}
@media(max-width:650px){.ratings.four{grid-template-columns:repeat(2,minmax(0,1fr))}.forecast small{font-size:9px}}

/* Phone usability pass: readable sizes, thumb-sized targets, and the task above the fold */
.more-nav .button{justify-content:flex-start;min-height:48px}
@media(pointer:coarse){.quiz-keys{display:none}}
@media(max-width:650px){
body{font-size:16px}.small{font-size:13px}
.eyebrow,.hero .eyebrow{font-size:11px;letter-spacing:1.2px}
h1{font-size:26px;letter-spacing:-.6px;line-height:1.15}
.pagehead{margin-bottom:16px}.pagehead .eyebrow{display:none}.pagehead p{font-size:15px;margin-top:8px}
.hero h1{font-size:34px;letter-spacing:-1.2px;max-width:none;margin:8px 0 12px}.hero p{font-size:15px;max-width:none}.hero-art{display:none}
.button{min-height:48px;font-size:15px}.button.sm{min-height:44px;font-size:14px}
.hero-actions{flex-direction:column;align-items:stretch}.hero-actions .button{font-size:15px;width:100%}
input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{min-height:48px;font-size:16px}
input[type=checkbox],input[type=radio]{width:22px;height:22px}
.toptools>.button{min-height:44px;min-width:44px;font-size:12px}.toptools .romaji-toggle{font-size:12px}.lang-switch button{min-height:40px;padding:5px 10px;font-size:12px}
.mobile-nav{grid-template-columns:repeat(5,minmax(0,1fr));min-height:64px}.mobile-nav button{font-size:11px;min-height:52px}.shell{padding-bottom:84px}
.stat p{font-size:12px}.word-tile .reading{font-size:13px}.word-tile .meaning{font-size:14px}.word-tile .bottom small{font-size:11px}
.deck-counts dt{font-size:13px}.forecast b,.forecast small{font-size:11px}
/* a lesson or a round gets the whole screen; its own back or end button leaves it */
body[data-page=quiz] .mobile-nav,body[data-page=lesson] .mobile-nav,body[data-page=write] .mobile-nav,body[data-page=speed] .mobile-nav,body[data-page=learn] .mobile-nav{display:none}
body[data-page=quiz] .shell,body[data-page=lesson] .shell,body[data-page=write] .shell,body[data-page=speed] .shell,body[data-page=learn] .shell{padding-bottom:16px}
.answer{min-height:60px;font-size:17px;overflow-wrap:break-word;word-break:normal}.quiz-prompt{font-size:15px}
.feedback>.button{position:sticky;bottom:12px;align-self:stretch;width:100%;min-height:52px;box-shadow:0 6px 18px rgba(40,62,52,.18)}
}
/* While a listening question is open, the "Sounds wrong?" bar must not show the word that was just played. */
body[data-page=quiz]:has(.quiz-audio):not(:has(.feedback)) #audio-report{display:none}
.ratings.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.ratings.two .button{min-height:56px}
@media(max-width:650px){input[type=checkbox],input[type=radio]{vertical-align:middle;margin:0 8px 2px 0}}
/* My lessons and grammar levels */
.lesson-levels{list-style:none;margin:0;padding:0;display:grid;gap:14px}.lesson-level h2,.grammar-level h2{font-size:19px;overflow-wrap:anywhere}.lesson-level .row{flex-wrap:wrap}
.grammar-level{margin-bottom:30px}.grammar-level>.row{flex-wrap:wrap;gap:10px}.lesson-rejected{margin:4px 0 0;padding-left:20px}#lesson-form textarea{width:100%}
/* Worth another look, own hints, optional writing */
.mistake-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}.mistake-list li{padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper);overflow-wrap:anywhere}.mistake-list li p+p{margin-top:4px}
.retry-hint{margin-top:14px;width:100%;max-width:500px}
.hint-form{display:grid;gap:6px;width:100%}.hint-row{display:flex;gap:8px}.hint-row input{min-width:0;flex:1}.hint-row .button{flex-shrink:0;min-height:45px}
.own-hint{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}.own-hint p{flex:1 1 180px;overflow-wrap:anywhere}.own-hint-line{overflow-wrap:anywhere}
.writing-optional summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600}
/* Narrow phones and longer Russian labels: the review deck must never push the page sideways. */
.deck-head>div{min-width:0;flex:1 1 200px}.deck-counts div{min-width:0}.deck-counts dt{overflow-wrap:anywhere;hyphens:auto}
@media(max-width:380px){.deck-counts div{padding:10px 8px}.deck-counts dt{font-size:12px}}
/* Japan trip: the kanji behind the signs. One scrollable row keeps the card compact on phones. */
.trip-kanji{display:grid;gap:12px;min-width:0}.trip-kanji-head{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;justify-content:space-between}.trip-kanji-head>div{flex:1 1 220px;min-width:0}.trip-kanji-head h2{font-size:19px}
.trip-kanji-row{display:flex;gap:8px;margin:0;padding:2px 2px 8px;list-style:none;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;min-width:0}.trip-kanji-row li{flex:0 0 auto;scroll-snap-align:start}
.trip-kanji-chip{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:0;border-radius:10px;background:var(--ink);color:#fffefa;font-family:var(--jp);font-size:24px;font-weight:700;transition:transform .15s,background .15s}.trip-kanji-chip:hover{background:var(--accent)}.trip-kanji-chip:active{transform:scale(.95)}
.kanji-detail{display:grid;gap:12px;margin-bottom:18px}.kanji-big{font-family:var(--jp);font-size:96px;line-height:1.1;font-weight:700;text-align:center;padding:12px;border-radius:14px;background:var(--ink);color:#fffefa}.kanji-sign{font-family:var(--jp);font-size:22px;font-weight:700}.kanji-from p{margin-top:4px}.kanji-read .jp{font-size:22px}
@media(prefers-reduced-motion:reduce){.trip-kanji-chip{transition:none}.trip-kanji-chip:active{transform:none}}

/* Quick add */
.quick-add .check{min-height:48px}
.quick-preview{min-height:1.5em;overflow-wrap:anywhere}
.quick-preview .jp{font-size:18px}
.quick-recent{list-style:none;margin:8px 0 0;padding:0;border-top:1px solid var(--line)}
.quick-recent li{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px;padding:8px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.quick-recent .jp{font-size:18px}
/* Long Russian meanings in two-column answers wrap inside their button instead of widening the grid. */
.answer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.answer{min-width:0;hyphens:auto}
/* Listen and write */
.lw-audio{min-height:0;gap:10px;flex-wrap:wrap;margin:18px 0 6px}.quiz-card.lw-done{min-height:0}
.lw-line{margin:18px 0 6px}.lw-blank{display:inline-flex;align-items:center;justify-content:center;min-width:2.4em;margin:0 .15em;padding:0 .3em;border-bottom:2px solid var(--accent);color:var(--accent);font-family:system-ui,sans-serif;font-size:.6em;vertical-align:middle;line-height:1.6}
.lw-form{display:grid;gap:10px;width:100%;max-width:500px;margin-top:auto;padding-top:16px}.lw-field{display:flex;align-items:center;gap:10px}.lw-field input{flex:1;min-width:0;min-height:48px;font-size:20px;text-align:center}.lw-num{flex:none;min-width:28px;font-weight:700;color:var(--accent)}.lw-form .button{min-height:48px}
.lw-diff{margin:4px 0 0;padding-left:20px;overflow-wrap:anywhere}.lw-diff li{margin-top:2px}
.feedback mark{background:var(--warm);color:inherit;border-bottom:2px solid var(--accent);padding:0 2px}
.lw-again{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:10px 12px;background:var(--warm);border-radius:9px;overflow-wrap:anywhere}
/* Why this one? */
.why-box{padding-top:14px;border-top:1px solid #c6daba}.why-box h3{font-size:16px;margin-bottom:4px}.why-options{display:grid;gap:8px;margin-top:10px}.why-option{min-height:48px;padding:12px 12px 12px 26px;font-size:15px;text-align:left}.why-result{overflow-wrap:anywhere}
/* Adaptive learning: words with furigana, "Show reading", the adapt card */
.word-view{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;max-width:100%}
.quiz-card .word-view{align-items:center}.quiz-card .word-view>.quiz-word{margin-bottom:10px}
.word-view:focus{outline:none}.word-view:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.word-view>[lang="ja"]{overflow-wrap:anywhere;max-width:100%;margin-bottom:0}
.word-view ruby{ruby-position:over}.word-view rt{font-size:max(11px,.42em);font-weight:500;color:var(--muted);line-height:1.2}
.word-view .word-romaji{display:block;margin:0}
.button.show-reading{min-height:48px;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;line-height:1.4}
.quiz-word .show-reading{margin-top:6px}
.answer-line .word-view{display:inline-flex;vertical-align:top;margin-right:12px}.answer-line .word-view>.jp{font-size:27px}
.pool-open>.word-view{min-width:100px}.pool-open>.word-view>.jp{font-size:26px}
.adapt-list{display:grid;gap:10px;margin:0;padding-left:18px}.adapt-list b{display:block}
.adapt-note a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.word-view [hidden]{display:none!important}
.kana-answer.word-kana span:last-child{font-size:23px;overflow-wrap:anywhere}
@media(max-width:380px){.kana-answer.word-kana span:last-child{font-size:20px}}
/* Japanese keyboard page */
.typing-page{max-width:750px}
.typing-steps{display:grid;gap:8px;margin:8px 0 0;padding-left:20px;overflow-wrap:anywhere}
.typing-other summary{min-height:48px;padding:12px 0;box-sizing:border-box;line-height:24px;cursor:pointer;font-weight:650}
.typing-other summary:focus-visible,.typing-test input:focus-visible,.typing-answer-box input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.typing-test{display:grid;gap:8px;max-width:320px}.typing-test label,.typing-label{font-weight:650}
.typing-test input{width:100%;font-size:21px;text-align:center}
.typing-status{min-height:1.5em;display:flex;align-items:center;gap:6px}.typing-status.ok .icon,.typing-done .icon,.typing-right .icon{color:var(--good)}
.typing-levels{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.typing-level{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 0;border-top:1px solid var(--line)}
.typing-level>div{min-width:0;flex:1 1 200px}.typing-level h3{font-size:16px;margin-bottom:4px}
.typing-done,.typing-locked{margin-top:6px;display:flex;gap:6px;align-items:center}
.typing-meaning{font-size:16px;margin:0 0 8px}
.typing-keys-box{display:flex;flex-direction:column;align-items:center;gap:8px;max-width:100%}
.typing-keys{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:0;max-width:100%}
.typing-keys kbd{font:600 16px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;opacity:1;padding:4px 7px;border-color:var(--line);background:var(--soft)}
.typing-gap{color:var(--muted);padding:0 2px}
.typing-answer-box{width:100%;max-width:500px;margin-top:auto;padding-top:22px;display:grid;gap:8px;text-align:left}
.typing-answer-box .quiz-input{margin-top:0;padding-top:0;max-width:none}
.typing-feedback{width:100%;max-width:500px;text-align:left}
.typing-feedback .feedback p{margin:0}.typing-feedback .feedback{gap:8px}.typing-rule{font-weight:600}
.typing-right{margin-top:14px;display:flex;gap:6px;align-items:center;justify-content:center}
.typing-page .button,.typing-shell .button{min-height:48px}
.typing-keys[hidden]{display:none}
/* Built-in Japanese keyboard (ime-ui.js): the reading being typed and, while converting, the candidates under the field. */
.ime-strip{width:100%;max-width:500px;display:grid;gap:8px;margin-top:8px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);text-align:left;box-sizing:border-box}
.ime-strip[hidden]{display:none}
.ime-preedit{margin:0;font:500 20px/1.4 var(--jp);overflow-wrap:anywhere}.ime-preedit u{text-decoration-thickness:2px;text-underline-offset:4px}
.ime-cands{display:flex;flex-wrap:wrap;gap:6px}.ime-cands:empty{display:none}
.ime-cand{display:inline-flex;align-items:center;gap:8px;min-height:48px;min-width:48px;padding:6px 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:500 19px/1.2 var(--jp);cursor:pointer}
.ime-cand .ime-num{font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--muted)}
.ime-cand.current{background:var(--ink);border-color:var(--ink);color:#fffefa}.ime-cand.current .ime-num{color:#fffefa}
.ime-cand:hover:not(.current){background:var(--soft)}
.ime-actions{display:flex;flex-wrap:wrap;gap:8px}.ime-actions:empty{display:none}.ime-actions .button{min-height:48px;flex:1 1 120px}
.ime-hint{margin:0}.ime-hint:empty{display:none}
.typing-install summary:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.typing-install summary{min-height:48px;padding:12px 0;box-sizing:border-box;line-height:24px;cursor:pointer;font-weight:650}
.typing-sim-intro p{margin:0 0 6px}
/* In an answer form the strip sits under the field and the Check button on wide screens, between them on phones. */
.quiz-input:has(>.ime-strip:not([hidden])){flex-wrap:wrap}.quiz-input:has(>.ime-strip:not([hidden]))>input{flex:1 1 0}.quiz-input>.ime-strip{flex-basis:100%;max-width:none;margin-top:0;order:1}
@media(max-width:650px){.quiz-input>.ime-strip{order:0}}