/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.start{inset-inline-start:var(--spacing)}.grid{display:grid}}:root{--ink:#25322b;--green:#44735b;--pale:#edf4ea;--paper:#fffdf5;--coral:#e77961;--line:#e6c9bb}*{box-sizing:border-box}body{color:var(--ink);background:#f6f3e9;margin:0;font-family:PingFang SC,Noto Sans CJK SC,Microsoft YaHei,sans-serif}button{font:inherit;color:inherit}.app-shell{background:radial-gradient(circle at 10% 8%,#fff9dc 0,#0000 24%),radial-gradient(circle at 88% 82%,#e2f0df 0,#0000 28%),#f7f4eb;min-height:100vh;overflow:hidden}.setup-shell{place-items:center;padding:32px;display:grid}.course-setup{background:#fffc;border:1px solid #fff;border-radius:32px;width:min(680px,100%);padding:48px;box-shadow:0 24px 80px #53634d20}.course-setup>.brand-mark{margin-bottom:24px}.course-setup .eyebrow{color:var(--coral);letter-spacing:.15em;margin:0;font-weight:800}.course-setup h1{margin:12px 0;font:700 42px/1.25 Kaiti SC,STKaiti,serif}.course-setup>p:not(.eyebrow){color:#69746c;line-height:1.8}.course-setup form{gap:10px;margin-top:28px;display:grid}.course-setup label{font-size:14px;font-weight:800}.course-setup textarea{resize:vertical;background:#fffdf8;border:2px solid #d9e2d8;border-radius:18px;outline:none;width:100%;padding:16px;font:600 28px/1.6 Kaiti SC,STKaiti,serif}.course-setup textarea:focus{border-color:var(--green);box-shadow:0 0 0 4px #44735b16}.course-setup small{color:#899087}.course-setup form button{background:var(--green);color:#fff;cursor:pointer;border:0;border-radius:16px;margin-top:12px;padding:15px;font-weight:800}.course-setup form button:disabled{opacity:.4;cursor:not-allowed}.preset-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.preset-row small{margin-right:auto}.course-setup form .preset-button,.course-setup form .clear-input{border-radius:99px;margin:0;padding:7px 11px;font-size:12px}.course-setup form .preset-button{color:var(--green);background:#e5efe5}.course-setup form .clear-input{color:#7a837b;background:0 0;border:1px solid #d8ded5}.topbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff8a;border-bottom:1px solid #44735b21;align-items:center;height:88px;padding:0 5vw;display:flex}.icon-button{cursor:pointer;background:#fff;border:0;border-radius:50%;width:44px;height:44px;font-size:34px;line-height:1;box-shadow:0 4px 20px #596b5a14}.brand{align-items:center;gap:12px;margin-left:20px;display:flex}.brand-mark{background:var(--green);color:#fff;border-radius:14px;place-items:center;width:44px;height:44px;font:700 23px serif;display:grid;transform:rotate(-3deg)}.brand div{flex-direction:column;gap:2px;display:flex}.brand strong{letter-spacing:.03em;font-size:18px}.brand div span{color:#78837b;font-size:12px}.progress{color:#68746c;align-items:center;gap:12px;margin-left:auto;font-size:13px;font-weight:700;display:flex}.progress i{background:#e3e8df;border-radius:9px;width:130px;height:7px;overflow:hidden}.progress b{background:var(--green);border-radius:9px;height:100%;transition:width .3s;display:block}.lesson-queue{background:#ffffff80;border-radius:14px;gap:5px;max-width:42vw;margin-left:auto;padding:6px;display:flex;overflow-x:auto}.lesson-queue button{cursor:pointer;background:0 0;border:0;border-radius:9px;flex:none;width:34px;height:34px;font:600 20px Kaiti SC,STKaiti,serif}.lesson-queue button.active{background:var(--green);color:#fff}.lesson-queue+.progress{margin-left:14px}.lesson{grid-template-columns:230px minmax(370px,500px) 260px;justify-content:center;align-items:center;gap:54px;max-width:1220px;min-height:calc(100vh - 186px);margin:auto;padding:48px 32px 32px;display:grid}.lesson-note .eyebrow{color:var(--coral);letter-spacing:.15em;font-size:13px;font-weight:800}.lesson-note h1{margin:12px 0 3px;font:700 72px/1.05 Songti SC,STSong,serif}.lesson-note>p{color:#7d877f;margin:0;font-size:14px}.tip-card{background:#ffffffb8;border:1px solid #fff;border-radius:22px;margin-top:36px;padding:22px 21px;box-shadow:0 18px 50px #5c674b12}.tip-card span{color:var(--green);font-size:12px;font-weight:800}.tip-card strong{margin:8px 0;font:700 22px serif;display:block}.tip-card p{color:#6f786f;margin:0;font-size:14px;line-height:1.75}.stage-wrap{position:relative}.paper-shadow{background:#c9c0aa4a;border-radius:30px;position:absolute;inset:16px -13px -13px 15px;transform:rotate(2deg)}.grid{aspect-ratio:1;background:var(--paper);border:3px solid var(--line);border-radius:28px;position:relative;overflow:hidden;box-shadow:0 26px 65px #5d574128}.grid:before,.grid:after{content:"";z-index:0;border:1.5px solid #efd8cd;position:absolute;inset:18px}.grid:after{background:linear-gradient(135deg,#0000 49.8%,#efd8cd 50%,#0000 50.2%);border:0;inset:0}.grid-line,.diagonal{z-index:0;opacity:.85;position:absolute}.grid-line.horizontal{border-top:1.5px dashed #e1b9a8;top:50%;left:0;right:0}.grid-line.vertical{border-left:1.5px dashed #e1b9a8;top:0;bottom:0;left:50%}.diagonal.two{background:linear-gradient(45deg,#0000 49.8%,#efd8cd 50%,#0000 50.2%);inset:0}.grid svg{z-index:2;width:80%;height:80%;position:absolute;inset:10%;overflow:visible}.stroke{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:7px}.stroke.done{stroke:#3c4c43}.stroke.current{stroke:var(--coral);stroke-dasharray:1;stroke-dashoffset:0}.stroke.future{stroke:#dfe4dc;opacity:.25}.stroke.current:not(.animate){stroke-dashoffset:1px;opacity:.2}.stroke.animate{animation:2.3s cubic-bezier(.35,.05,.45,1) forwards write}.stroke.animate.paused{animation-play-state:paused}.start-dot{background:var(--coral);z-index:3;border:3px solid #fff;border-radius:50%;width:12px;height:12px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 3px #e7796130}.start-dot.pulse{animation:1.1s infinite pulse}.kai-grid{place-items:center;display:grid}.hanzi-writer{z-index:2;place-items:center;width:100%;height:100%;display:grid;position:relative}.hanzi-writer svg{width:100%;height:100%;position:static;inset:auto}.load-error{z-index:4;text-align:center;color:#86614e;line-height:1.8;position:relative}.load-error button{background:var(--green);color:#fff;cursor:pointer;border:0;border-radius:99px;margin-top:10px;padding:9px 14px}.review-badge{background:#fff2d5;border-radius:9px;padding:7px 10px;color:#926c27!important;margin-top:14px!important;font-size:11px!important}@keyframes write{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes pulse{50%{opacity:.5}}.practice-bubble{z-index:5;background:var(--green);color:#fff;border-radius:18px;grid-template-columns:34px 1fr;min-width:250px;padding:12px 18px;display:grid;position:absolute;bottom:-20px;left:50%;transform:translate(-50%);box-shadow:0 14px 35px #31523d42}.practice-bubble span{grid-row:1/3;font-size:22px}.practice-bubble strong{font-size:14px}.practice-bubble small{opacity:.75;margin-top:2px;font-size:11px}.instruction .step-chip{color:var(--green);background:#e4efe3;border-radius:99px;padding:7px 12px;font-size:12px;font-weight:800;display:inline-block}.instruction h2{margin:18px 0 8px;font:700 44px serif}.instruction>p{margin:0;font-size:17px;line-height:1.8}.why{color:#69746c;border-left:3px solid #e9b258;margin-top:22px;padding-left:16px;font-size:14px;line-height:1.7}.why span{color:#b77a22;font-size:12px;font-weight:800;display:block}.listen{cursor:pointer;background:0 0;border:1px solid #d8ded5;border-radius:99px;margin-top:24px;padding:10px 16px}.listen:hover{background:#fff}.listen span{color:var(--coral);margin-right:7px}.voice-fallback{color:#85672d;background:#fff7dd;border-radius:12px;padding:10px 12px;margin-top:20px!important;font-size:12px!important}.guide-list{gap:10px;margin-top:18px;display:grid}.guide-list>div{background:#ffffffad;border-radius:13px;padding:11px 13px}.guide-list span{color:var(--green);letter-spacing:.08em;font-size:11px;font-weight:800}.guide-list p{color:#5f6d64;margin:4px 0 0;font-size:13px;line-height:1.55}.rule-tags{flex-wrap:wrap;gap:6px;margin-top:14px;display:flex}.rule-tags span{color:#90672b;background:#fff1d8;border-radius:99px;padding:5px 8px;font-size:10px;font-weight:800}.controls{background:#fffdf7e6;border-top:1px solid #e3ded1;justify-content:center;align-items:center;gap:34px;height:98px;display:flex}.controls button{cursor:pointer;background:0 0;border:0;border-radius:16px;min-width:130px;padding:14px;font-weight:800}.controls button:disabled{opacity:.3;cursor:not-allowed}.controls .play{color:#fff;background:var(--green);min-width:200px;box-shadow:0 12px 28px #31523d2b}.controls button span{margin:0 8px}.speed-control{background:#fff;border:1px solid #dce2da;border-radius:14px;margin:0;padding:5px 8px 7px}.speed-control legend{color:#7b857d;padding:0 5px;font-size:10px;font-weight:800}.speed-control>div{gap:3px;display:flex}.controls .speed-control button{color:#68746c;border-radius:9px;min-width:34px;padding:7px 6px;font-size:11px}.controls .speed-control button.active{background:var(--green);color:#fff}.controls .speed-control button:focus-visible{outline-offset:2px;outline:3px solid #e9b258}.summary-view{grid-template-columns:minmax(320px,440px) minmax(300px,420px);align-items:center;gap:72px;max-width:980px;min-height:calc(100vh - 88px);margin:auto;padding:56px 32px;display:grid}.summary-character{position:relative}.summary-grid{box-shadow:0 26px 65px #5d574128}.summary-copy .eyebrow{color:var(--coral);letter-spacing:.15em;font-size:13px;font-weight:800}.summary-copy h1{margin:12px 0 14px;font:700 40px/1.3 Songti SC,STSong,serif}.summary-copy>p{color:#68746c}.summary-copy ol{counter-reset:summary;margin:24px 0;padding:0;list-style:none}.summary-copy li{counter-increment:summary;background:#ffffffb8;border-radius:16px;margin:13px 0;padding:14px 16px 14px 50px;line-height:1.55;position:relative}.summary-copy li:before{content:counter(summary);background:var(--pale);width:25px;height:25px;color:var(--green);border-radius:50%;place-items:center;font-weight:800;display:grid;position:absolute;top:12px;left:14px}.summary-actions{gap:12px;margin-top:26px;display:flex}.summary-actions button{cursor:pointer;border-radius:99px;padding:13px 20px;font-weight:800}.primary-action{background:var(--green);color:#fff;border:0}.secondary-action{background:0 0;border:1px solid #ccd6cc}.summary-copy>small{color:#7d877f;margin-top:18px;display:block}.clear-progress{color:var(--green);cursor:pointer;font-size:inherit;background:0 0;border:0;padding:0;text-decoration:underline}@media (width<=950px){.lesson{grid-template-columns:170px minmax(330px,460px);gap:30px}.instruction{grid-column:1/-1;grid-template-columns:150px 1fr auto;align-items:center;gap:15px;display:grid}.instruction h2{margin:0;font-size:30px}.instruction .step-chip{display:none}.instruction .why{margin:0}.instruction .guide-list{grid-column:2/-1;grid-template-columns:repeat(3,1fr);margin:0}.instruction .rule-tags{grid-column:2}.instruction .listen{grid-column:3;margin:0}.lesson-note .tip-card{display:none}}@media (width<=800px){.summary-view{grid-template-columns:1fr;gap:34px;max-width:520px;padding-top:32px}.summary-character{width:min(72vw,360px);margin:auto}.summary-copy h1{font-size:34px}}@media (width<=660px){.setup-shell{padding:16px}.course-setup{padding:28px 20px}.course-setup h1{font-size:32px}.topbar{flex-wrap:wrap;height:auto;min-height:72px;padding:8px 12px}.brand{margin-left:10px}.brand div span,.progress i{display:none}.lesson-queue{order:3;width:100%;max-width:none;margin:6px 0 0}.lesson-queue+.progress{margin-left:auto}.lesson{flex-direction:column;gap:22px;min-height:calc(100vh - 160px);padding:24px 18px 32px;display:flex}.lesson-note{flex-wrap:wrap;align-items:baseline;gap:12px;width:100%;display:flex}.lesson-note h1{margin:0;font-size:42px}.lesson-note .eyebrow{order:3;margin-left:auto}.lesson-note .review-badge{order:4;width:100%}.stage-wrap{width:min(82vw,420px)}.instruction{width:100%;max-width:460px;display:block}.instruction h2{margin-right:10px;font-size:30px;display:inline}.instruction>p{font-size:15px;display:inline}.instruction .why{margin-top:13px}.instruction .guide-list{grid-template-columns:1fr;margin-top:14px;display:grid}.instruction .rule-tags{margin-top:12px}.instruction .listen{margin-top:13px}.controls{flex-wrap:wrap;gap:5px;height:auto;min-height:88px;padding:7px;position:sticky;bottom:0}.controls>button{flex:1;order:2;min-width:auto;font-size:12px}.controls .play{min-width:145px}.controls button span{margin:0 3px}.speed-control{order:1;width:100%;padding:3px 5px 5px}.speed-control>div{justify-content:center}.controls .speed-control button{flex:1;min-width:0;padding:6px 3px;font-size:10px}.summary-view{gap:24px;min-height:calc(100vh - 72px);padding:24px 18px 40px}.summary-copy h1{font-size:29px}.summary-copy li{font-size:14px}.summary-actions{flex-direction:column}.summary-actions button{width:100%}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}