.stroke{justify-items:center;gap:10px;width:100%;display:grid}.stroke-pad{aspect-ratio:1;background:var(--glass-fill), var(--bg-elevated);width:min(300px,78vw);box-shadow:var(--glass-edge), var(--glass-drop);touch-action:none;border-radius:32px;position:relative;overflow:hidden}.stroke-pad:before,.stroke-pad:after{content:"";pointer-events:none;position:absolute}.stroke-pad:before{border-left:1px dashed #b8322a2e;top:14px;bottom:14px;left:50%}.stroke-pad:after{border-top:1px dashed #b8322a2e;top:50%;left:14px;right:14px}.stroke-pad svg{z-index:1;touch-action:none;width:100%;height:100%;display:block;position:relative}.stroke-watch .stroke-pad svg{touch-action:auto}.stroke-pad path{fill:none;stroke-linecap:round;stroke-linejoin:round}.stroke-ghost path{stroke:var(--label);stroke-opacity:.09;stroke-width:6.4px}.stroke-ink path{stroke:var(--navy-ink);stroke-width:5.6px}[data-theme=dark] .stroke-ink path{stroke:#edf1fa}.stroke-demo{stroke:var(--gold);stroke-width:5.6px;filter:drop-shadow(0 0 1.4px var(--gold-glow))}.stroke-live{stroke:var(--tint);stroke-width:5.2px;stroke-opacity:.9}.stroke-no circle{fill:var(--gold)}.stroke-no text{fill:#fff;font:700 5.4px/1 var(--thai)}[data-theme=dark] .stroke-no text{fill:#141d31}.stroke-next circle{fill:var(--gold)}.stroke-next-pulse{transform-box:fill-box;transform-origin:50%;animation:stroke-pulse 1.4s var(--ease-settle) infinite;fill:var(--gold-glow)!important}@keyframes stroke-pulse{0%{opacity:1;transform:scale(.6)}to{opacity:0;transform:scale(2.1)}}@media (prefers-reduced-motion:reduce){.stroke-next-pulse{animation:none}}.stroke-seal{z-index:2;border-radius:var(--r-seal);width:46px;height:46px;font:800 30px/1 var(--maru);color:#fff;background:#b8322a;place-items:center;display:grid;position:absolute;top:12px;right:14px;box-shadow:0 6px 16px -6px #b8322ab3}.stroke-status{min-height:24px;font:var(--fs-callout);color:var(--label-2);text-align:center}.stroke-status b{color:var(--gold-ink)}.stroke-status .good{color:var(--label);font-weight:600}.stroke-dots{gap:6px;display:flex}.stroke-dots i{background:var(--separator);width:7px;height:7px;transition:background var(--t-small), transform var(--t-small) var(--ease-settle);border-radius:50%}.stroke-dots i.on{background:var(--navy-ink)}[data-theme=dark] .stroke-dots i.on{background:#edf1fa}.stroke-dots i.now{background:var(--gold);transform:scale(1.3)}.stroke-actions{gap:8px;display:flex}.stroke-chip{min-height:44px;font:600 14px/1 var(--thai);color:var(--label);background:var(--glass-chip);box-shadow:var(--glass-edge);border:0;border-radius:999px;padding:0 16px}.stroke-play{min-height:44px;font:600 15px/1 var(--thai);color:#fff;background:var(--navy-ink);box-shadow:inset 0 -1px 0 var(--gold-line), 0 10px 20px -12px rgb(var(--ink-rgb) / .8);border:0;border-radius:999px;align-items:center;gap:8px;padding:0 20px 0 14px;display:inline-flex}.stroke-play svg{width:18px;height:18px;fill:var(--gold)}.stroke-play:disabled{opacity:.55}[data-theme=dark] .stroke-play{color:var(--navy-ink);background:#edf1fa}.kana-write{text-align:center;justify-items:center;gap:14px;width:100%;max-width:420px;display:grid}.kana-write-title{font:var(--fs-headline);color:var(--label)}.kana-write-title b{font:700 22px/1 var(--maru);color:var(--gold-ink)}.kana-write-steps{font:600 12px/1 var(--thai);color:var(--label-3);gap:6px;display:flex}.kana-write-steps span{background:var(--fill-quiet);border-radius:999px;padding:6px 10px}.kana-write-steps span.on{color:var(--navy-ink);background:var(--glass-chip);box-shadow:var(--glass-edge)}.kana-write>.btn{width:100%}.kana-write-sound{background:var(--glass-chip);min-height:44px;box-shadow:var(--glass-edge);border:0;border-radius:999px;align-items:center;gap:10px;padding:6px 18px 6px 8px;display:inline-flex}.kana-write-sound img{width:30px;height:30px}.kana-write-sound b{font:700 24px/1 var(--thai);color:var(--tint)}.kana-write-sound i{font:500 15px/1 var(--thai);color:var(--label-3);font-style:normal}.kana-detail .stroke-pad{border-radius:26px;width:min(220px,60vw)}
.begin-phrase{text-align:center;justify-items:center;gap:12px;max-width:420px;margin:0 auto;padding:24px 0 32px;display:grid}.begin-phrase .btn{width:100%}.begin-phrase-line{border-radius:var(--r-card);background:var(--bg-elevated);width:100%;box-shadow:var(--e2);color:var(--label);cursor:pointer;border:0;gap:6px;padding:28px 16px;display:grid}.begin-phrase-line b{font:700 30px/1.35 var(--maru);overflow-wrap:anywhere}.begin-phrase-romaji{letter-spacing:.02em;color:var(--label-2);font:500 16px/22px -apple-system,SF Pro Text,sans-serif}.begin-phrase-th{font:700 20px/28px var(--thai);color:var(--label);margin:8px 0 0}.begin-phrase-note{font:400 15px/22px var(--thai);color:var(--label-2);margin:0 0 8px}.begin-phrase-nomic{font:400 14px/20px var(--thai);color:var(--label-3)}.begin-phrase .is-recording{color:var(--negative)}.begin-phrase-compare{justify-content:center;gap:10px;display:flex}.begin-phrase-chip{background:var(--fill-quiet);min-height:40px;color:var(--tint);font:600 15px/1 var(--thai);cursor:pointer;border:0;border-radius:999px;padding:0 18px}.begin-phrase-done>b{font-size:24px;line-height:32px}.beginner-say{color:var(--label);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:8px;padding:0;display:inline-flex}.beginner-say svg{color:var(--tint);flex:none}.beginner-romaji{color:var(--label-2);letter-spacing:.02em;display:block}.fr-weeks{margin:0;padding:6px 16px 8px;list-style:none;display:grid}.fr-weeks li{font:600 15px/22px var(--thai);color:var(--label);padding:9px 0}.fr-weeks li+li{border-top:.5px solid var(--separator)}.begin-head{justify-items:stretch;gap:6px;margin-bottom:16px;display:grid}.begin-head small{font:600 13px/18px var(--thai);color:var(--label-2)}.begin-head b{font:700 24px/32px var(--thai);color:var(--label)}.begin-next{text-align:center;justify-items:center;gap:6px;padding:20px 18px 18px;display:grid}.begin-next img{object-fit:contain;width:96px;height:96px}.begin-next small{font:500 13px/18px var(--thai);color:var(--label-2)}.begin-next>b{font:700 20px/28px var(--thai);color:var(--label)}.begin-next>b.ja{font-family:var(--maru)}.begin-next .btn{width:100%;margin-top:8px}.begin-h{font:700 17px/24px var(--thai);color:var(--label);margin:22px 4px 8px}.begin-week{margin:0;padding:4px 0;list-style:none;display:grid}.begin-week li+li{border-top:.5px solid var(--separator)}.begin-week button{width:100%;min-height:50px;color:var(--label);font:500 15px/22px var(--thai);text-align:left;cursor:pointer;background:0 0;border:0;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px 16px;display:grid}.begin-week button .ja{font-family:var(--maru)}.begin-week button i{width:22px;height:22px;box-shadow:inset 0 0 0 1.5px var(--separator);color:#fff;border-radius:50%;place-items:center;display:grid}.begin-week button.is-done i{background:var(--positive);box-shadow:none}.begin-week button.is-done span{color:var(--label-2)}.begin-week button.is-next i{box-shadow:inset 0 0 0 2px var(--gold)}.begin-week button.is-next span{font-weight:700}.begin-week button small{font:400 13px/18px var(--thai);color:var(--label-3)}.begin-seals{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.begin-seals>span{text-align:center;justify-items:center;gap:6px;display:grid}.begin-seals small{font:500 12px/16px var(--thai);color:var(--label-3)}.begin-seal{width:52px;height:52px;color:var(--label-3);font:700 20px/1 var(--maru);opacity:.55}.begin-seals .is-reached .begin-seal{--mk-fill:var(--tint-deep);--mk-rim:var(--gold);--mk-rim-w:1.6px;color:var(--gold-hi);opacity:1}.begin-seals .is-reached small{color:var(--label);font-weight:700}.begin-card{text-align:left;width:100%;color:inherit;font:inherit;cursor:pointer;border:0;justify-items:stretch;gap:8px;margin-top:18px;padding:16px 18px;display:grid}.begin-card .ja{font-family:var(--maru)}.begin-grad{text-align:center;justify-items:center;gap:10px;padding-bottom:8px;display:grid}.begin-grad .otomo-picture,.begin-grad video,.begin-grad img{object-fit:contain;width:180px;height:180px}.begin-grad>b{font:700 22px/30px var(--thai);color:var(--label)}.begin-grad p{font:400 15px/22px var(--thai);color:var(--label-2)}.begin-grad .btn{width:100%}.begin-card p{font:600 15px/22px var(--thai);color:var(--label);margin:0}.begin-card small{font:400 13px/18px var(--thai);color:var(--label-2)}.review-say{z-index:2;position:absolute;bottom:32px;right:32px}
.shadow-stage{grid-template-rows:minmax(0,1fr) auto;min-height:0;display:grid}.shadow-scroll{scrollbar-width:none;flex-direction:column;min-height:0;padding:8px 0 12px;display:flex;overflow-y:auto}.shadow-scroll>.speak{margin-block:auto}.speak-ja.is-long{font-size:clamp(20px,5.8cqw,26px);line-height:1.85}.shadow-controls{text-align:center;justify-items:center;gap:4px;padding:6px 22px 4px;display:grid}.shadow-controls .speak-row{margin-top:6px}.shadow-steps{gap:6px;padding:0;list-style:none;display:flex}.shadow-steps li{min-width:52px;height:28px;font:600 12px/1 var(--thai);color:var(--label-2);background:var(--fill-quiet);border-radius:999px;place-items:center;padding:0 12px;transition:background .2s,color .2s;display:grid}.shadow-steps li.is-past{color:var(--tint)}.shadow-steps li.is-now{color:#fff;background:var(--tint)}.shadow-status{min-height:24px;font:500 15px/24px var(--thai);color:var(--label-2)}.round-mic.is-cue img{box-shadow:0 0 0 6px #d9a62e47, var(--e2);animation:1.4s ease-in-out infinite pulse}@media (prefers-reduced-motion:reduce){.round-mic.is-cue img,.round-mic.is-on img{animation:none}}
.rr-scene{font:var(--fs-footnote);color:var(--label-2)}.rr-doc{font:500 18px/1.9 var(--maru);color:var(--label);overflow-wrap:anywhere;background:var(--bg-elevated);box-shadow:var(--glass-edge), var(--e1);border-radius:18px;gap:2px;padding:18px;display:grid}.rr-doc.has-ruby{line-height:2.35}.rr-doc rt{font:500 .5em/1 var(--maru);color:var(--label-2);letter-spacing:0}.rr-doc p{margin:0}.rr-doc table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.rr-doc td{vertical-align:top;border-bottom:.5px solid var(--separator);padding:8px 6px}.rr-doc tr:last-child td{border-bottom:0}.rr-doc td:last-child:not(:first-child){text-align:right;white-space:nowrap}.rr-doc.is-sign{text-align:center;border:3px solid var(--label);box-shadow:inset 0 0 0 4px var(--bg-elevated), inset 0 0 0 5px var(--separator), var(--e1);font-size:20px;font-weight:700}.rr-doc.is-notice,.rr-doc.is-form{border-top:5px solid var(--gold)}.rr-doc.is-form p{border-bottom:.5px dashed var(--separator);padding-bottom:4px}.rr-doc.is-email{border-top:5px solid var(--tint)}.rr-doc.is-ad{background:linear-gradient(160deg, color-mix(in srgb, var(--gold) 16%, var(--bg-elevated)), var(--bg-elevated) 70%)}.rr-doc.is-label{border:1.5px dashed var(--label-2);box-shadow:none}.rr-doc.is-menu,.rr-doc.is-schedule{border-top:5px solid var(--label)}.rr-doc.is-message{background:color-mix(in srgb, var(--positive) 18%, var(--bg-elevated));border-radius:22px 22px 22px 6px;justify-self:start;max-width:92%}.rr-vocab{gap:8px;display:grid}.rr-vocab h2,.rr .nr-quiz-head h2{font:var(--fs-headline);color:var(--label)}.rr-vocab ul{gap:6px;margin:0;padding:0;list-style:none;display:grid}.rr-vocab li{background:var(--fill-quiet);border-radius:16px;grid-template-columns:auto minmax(0,1fr) 40px;align-items:center;gap:12px;padding:8px 8px 8px 14px;display:grid}.rr-vocab-ja{display:grid}.rr-vocab-ja b{font:700 17px/1.3 var(--maru);color:var(--label)}.rr-vocab-ja small{font:500 12px/1.3 var(--maru);color:var(--label-2)}.rr-vocab-th{font:var(--fs-callout);color:var(--label-2)}.rr-vocab li button{width:40px;height:40px;color:var(--tint);background:var(--glass-fill);box-shadow:var(--glass-edge), var(--e1);border-radius:50%;place-items:center;display:grid}.rr-vocab li button.is-kept{color:#fff;background:var(--positive);box-shadow:none}.rr-tip{font:var(--fs-callout);color:var(--label);background:color-mix(in srgb, var(--gold) 14%, transparent);border-radius:16px;padding:12px 14px}.rr-tip b{color:var(--gold-ink);margin-right:4px}.rr .option.ja{font-family:var(--maru)}.rr-chat{background:var(--fill-quiet);border-radius:22px;gap:10px;padding:16px 14px;display:grid}.rr-bubble{max-width:86%;font:500 18px/1.8 var(--maru);color:var(--label);overflow-wrap:anywhere;gap:2px;margin:0;padding:10px 14px;display:grid}.rr-bubble.has-ruby{line-height:2.3}.rr-bubble rt{font:500 .5em/1 var(--maru);color:var(--label-2)}.rr-bubble small{font:600 12px/1.4 var(--maru);color:var(--label-2)}.rr-bubble.is-them{background:var(--bg-elevated);box-shadow:var(--glass-edge), var(--e1);border-radius:20px 20px 20px 6px;justify-self:start}.rr-bubble.is-me{background:color-mix(in srgb, var(--positive) 22%, var(--bg-elevated));border-radius:20px 20px 6px;justify-self:end}.rr-photo{background:var(--fill-quiet);width:100%;box-shadow:var(--glass-edge), var(--e1);border-radius:18px;padding:0;display:block;position:relative;overflow:hidden}.rr-frame{aspect-ratio:3/4;width:100%;display:block;position:relative;container-type:inline-size}.rr-frame img{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.rr-ruby{pointer-events:none;position:absolute;inset:0}.rr-ruby i{font:600 1em/1.25 var(--maru);letter-spacing:0;white-space:nowrap;color:var(--navy-ink);box-shadow:0 1px 2px rgb(var(--ink-rgb) / .18);background:#ffffffdb;border-radius:.35em;padding:0 .25em;font-style:normal;position:absolute;transform:translate(-50%,-100%)}.rr-photo-zoom{color:#fff;-webkit-backdrop-filter:blur(10px);background:#05070d73;border-radius:50%;place-items:center;width:36px;height:36px;display:grid;position:absolute;bottom:10px;right:10px}.rr-zoom{z-index:70;background:#05070d;flex-direction:column;display:flex;position:absolute;inset:0}.rr-zoom-scroll{-webkit-overflow-scrolling:touch;flex:1;place-items:center;min-height:0;display:grid;overflow:auto}.rr-zoom-scroll .rr-frame{width:min(100%,75dvh - 67.5px)}.rr-zoom-scroll.is-big{place-items:start}.rr-zoom-scroll.is-big .rr-frame{width:200%}.rr-zoom-bar{padding:12px 16px max(14px, env(safe-area-inset-bottom));justify-content:space-between;align-items:center;gap:10px;display:flex}.rr-zoom-bar button{min-width:44px;height:44px;font:600 16px/1 var(--thai);color:#fff;background:#ffffff24;border-radius:999px;place-items:center;padding:0 16px;display:grid}.rr-zoom-bar button.on{color:var(--navy-ink);background:#fff}.rr-zoom-bar button:last-child{margin-left:auto}.rr-after{gap:14px;display:grid}.rr-after-body{gap:18px;display:grid;overflow:hidden}.rr-vocab-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.rr-vocab-note{font:var(--fs-footnote);color:var(--label-2);margin:0}.nl-seal.has-icon{padding:3px}.nl-seal.has-icon img{object-fit:contain;width:100%;height:100%;display:block}.nl-story.is-read .nl-seal.has-icon img{opacity:.72}