:root{--paper:#f2efe4;--card:#f9f6ec;--ink:#2a2723;--muted:#8b857a;--accent:#a03a2e;--line:#d9d4c5;--mono:ui-monospace,"Cascadia Mono",Consolas,monospace}*{box-sizing:border-box}[role=button],[role=switch],a,button{-webkit-tap-highlight-color:transparent}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--mono);font-size:14px}.app{max-width:1100px;margin:0 auto;padding:18px 20px 60px}.app-title{font-family:Georgia,Times New Roman,serif;font-weight:500;text-align:center;font-size:34px;margin:8px 0 32px;letter-spacing:2px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;grid-gap:44px;gap:44px;align-items:start}.layout-side{display:flex;flex-direction:column;gap:8px}.stage-paper{position:relative;width:100%;aspect-ratio:1;background:var(--card);border:1px solid var(--line)}.stage-canvas{position:absolute;inset:0;display:block}.stage-note{position:absolute;inset:0;gap:10px;justify-content:center;color:var(--muted);background:rgba(249,246,236,.85)}.stage-controls,.stage-note{display:flex;align-items:center}.stage-controls{gap:8px;margin-top:12px}.stage-counter{margin-left:auto;color:var(--muted)}.btn{font-family:var(--mono);font-size:13px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:999px;padding:4px 14px;cursor:pointer}.speak-icon{vertical-align:-.12em}.btn .speak-icon{margin-right:.1em}.btn--icon{padding:7px 13px;line-height:0}.btn--icon .speak-icon,.btn--icon .stage-icon{width:1.15em;height:1.15em}.panel,.vocab{border-top:1px solid var(--line)}.panel-section{padding:18px 0 10px;border-bottom:1px solid var(--line)}.panel-title{font-size:13px;font-weight:400;color:var(--muted);margin:0 0 14px}.panel-hanzi{color:var(--ink);font-size:15px;margin-right:4px}.panel-row{display:grid;grid-template-columns:1fr auto;grid-row-gap:4px;row-gap:4px;margin-bottom:14px;color:var(--muted)}.panel-row input[type=range]{grid-column:1/-1;width:100%;accent-color:var(--ink);height:18px}.panel-value{color:var(--ink)}.panel-seg{display:flex;gap:14px;margin-bottom:10px}.seg{background:none;border:none;padding:0 0 2px;font-family:var(--mono);font-size:13px;color:var(--muted);cursor:pointer}.seg--active{color:var(--ink);border-bottom:1px solid var(--ink)}.panel-check{display:flex;align-items:center;gap:8px;color:var(--ink);margin-bottom:8px}.panel-check input{accent-color:var(--accent)}.char-input{margin-top:22px}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.chip{font-size:20px;font-family:Georgia,serif;background:var(--card);border:1px solid var(--line);border-radius:6px;padding:6px 12px;cursor:pointer}.chip--active{border-color:var(--ink)}.chip--invalid{color:var(--accent);border-style:dashed}.char-field{width:100%;max-width:340px;display:block;margin:0 auto;text-align:center;font-family:var(--mono);font-size:14px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:4px;padding:10px 14px}.char-field::placeholder{color:var(--muted)}.char-hint{text-align:center;color:var(--accent);font-size:12px}.vocab-level{font-size:12px;color:var(--muted);font-weight:400;margin:4px 0 8px}.vocab-list{list-style:none;margin:0;padding:0;max-height:320px;overflow-y:auto}.vocab-word{display:flex;align-items:baseline;gap:10px;width:100%;background:none;border:none;padding:5px 2px;cursor:pointer;font-family:var(--mono)}.vocab-hanzi{font-size:16px;color:var(--ink)}.vocab-pinyin{font-size:12px;color:var(--muted)}@media (max-width:920px){.layout{grid-template-columns:1fr;gap:24px}.layout-side{flex-direction:column}}.word-caption{text-align:center;color:var(--muted);font-size:13px;margin:14px 0 0}.vocab-row{display:flex;align-items:center}.vocab-row .vocab-word{flex:1 1}.vocab-arti{font-size:12px;color:var(--muted);font-style:italic;margin-left:auto}.vocab-speak{background:none;border:none;color:var(--muted);cursor:pointer;font-family:var(--mono);font-size:13px;padding:2px 6px}.btn:disabled{opacity:.4;cursor:default}.home{text-align:center}.home-sub{color:var(--muted);margin:-18px 0 30px}.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-gap:16px;gap:16px;text-align:left}.cat-card{display:flex;flex-direction:column;gap:6px;padding:18px;background:var(--card);border:1px solid var(--line);border-radius:8px;text-decoration:none;color:var(--ink)}.cat-hanzi{font-family:Georgia,serif;font-size:34px}.cat-nama{font-size:14px}.cat-count{font-size:12px;color:var(--muted)}.cat-hanzi-lg{font-family:Georgia,serif;margin-right:6px}.caption-en,.site-footer,.word-en{color:var(--muted)}.site-footer{max-width:1100px;margin:0 auto;padding:24px 20px 40px;border-top:1px solid var(--line);font-size:11px;line-height:1.6}.site-footer p{margin:0 0 4px}.back-link,.site-footer a{color:var(--muted)}.back-link{display:inline-block;text-decoration:none;font-size:13px;margin-bottom:14px}.practice-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.practice-top .back-link{margin-bottom:0}.word-search{position:relative;flex:0 1 260px;min-width:0}.word-search-input{padding:6px 10px;font-size:12px}.word-search-panel{position:absolute;z-index:30;top:calc(100% + 4px);right:0;left:0;background:var(--bg);border:1px solid var(--line);border-radius:4px;box-shadow:0 6px 20px rgba(0,0,0,.12);max-height:320px;overflow-y:auto}.word-search-hasil{list-style:none;margin:0;padding:4px}.word-search-item{display:grid;grid-template-columns:auto 1fr;grid-gap:2px 8px;gap:2px 8px;padding:6px 8px;border-radius:3px;text-decoration:none;color:var(--ink)}.word-search-item.is-sorot{background:var(--line)}.word-search-hanzi{grid-row:span 2;font-size:20px;line-height:1.1;align-self:center}.word-search-pinyin{font-family:var(--mono);font-size:11px;color:var(--muted)}.word-search-arti{font-size:12px;color:var(--ink);overflow-wrap:anywhere}.word-search-kosong{margin:0;padding:10px 12px;font-size:12px;color:var(--muted)}@media (max-width:480px){.practice-top{flex-wrap:wrap}.word-search{flex:1 1 100%}}.cms-tools{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.cms-tools .list-count{max-width:none;margin:0}.list-tools{max-width:520px;margin:0 auto 10px;display:flex;flex-direction:column;gap:8px}.list-search{width:100%;font-family:var(--mono);font-size:13px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:4px;padding:8px 12px}.list-search::placeholder{color:var(--muted)}.lang-search{max-width:520px;margin:0 auto 18px}.level-row{max-width:520px;margin:0 auto 20px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.level-chip{display:inline-flex;align-items:baseline;gap:6px;padding:5px 11px;border:1px solid var(--line);border-radius:999px;font-family:var(--mono);font-size:12px;color:var(--ink);text-decoration:none;background:none;cursor:pointer}.level-chip--active{background:var(--ink);border-color:var(--ink);color:var(--paper,#faf7ef)}.level-chip--active .level-chip-n{color:inherit;opacity:.7}.level-chip-n{color:var(--muted);font-size:11px}.level-note{max-width:520px;margin:-8px auto 16px;text-align:center;font-family:var(--mono);font-size:12px}.level-note,.level-note a{color:var(--muted)}.level-badge{color:var(--muted)}.kartu-masuk,.level-badge{font-family:var(--mono);font-size:12px}.kartu-masuk{text-align:center;margin:-6px 0 16px}.kartu-masuk a{color:var(--muted)}.kartu-tools{display:flex;justify-content:center;margin-bottom:18px}.kartu-tools .panel-seg{margin:0}.kartu{display:flex;align-items:center;justify-content:center;width:100%;max-width:460px;min-height:260px;margin:0 auto;padding:28px 24px;background:var(--card);border:1px solid var(--line);border-radius:10px;cursor:pointer;text-align:center;font-family:inherit;color:inherit}.kartu-belakang,.kartu-muka{display:flex;flex-direction:column;align-items:center;gap:10px}.kartu-hanzi{font-family:Georgia,Times New Roman,serif;font-size:64px;line-height:1.1}.kartu-pinyin{font-family:var(--mono);color:var(--muted)}.kartu-arti,.kartu-pinyin{font-size:15px}.kartu-arti-besar,.kartu-dengar{font-size:26px}.kartu-kendali{display:flex;align-items:center;justify-content:center;gap:10px;margin:16px auto 0}.kartu-hitung{font-size:12px;min-width:62px}.kartu-bantuan,.kartu-hitung{font-family:var(--mono);color:var(--muted);text-align:center}.kartu-bantuan{font-size:11px;margin:10px 0 0}.kartu-buka{text-align:center;font-family:var(--mono);font-size:12px;margin:14px 0 0}.kartu-buka a{color:var(--muted)}.level-nav{display:grid;grid-template-columns:1fr 1fr;max-width:520px;margin:0 auto 12px;font-family:var(--mono);font-size:12px}.level-nav>:last-child{text-align:right}.level-nav a{color:var(--muted);text-decoration:none}.level-filter{display:flex;flex-wrap:wrap;gap:14px}.list-count{max-width:520px;margin:0 auto 6px;color:var(--muted);font-size:12px;text-align:right}.load-more{display:block;margin:16px auto 0}.word-list{list-style:none;padding:0;max-width:520px;margin:0 auto;text-align:left}.word-item{display:flex;align-items:baseline;gap:14px;padding:10px 12px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}.word-hanzi{font-family:Georgia,serif;font-size:22px}.word-arti,.word-pinyin{color:var(--muted);font-size:13px}.word-arti{margin-left:auto;font-style:italic}.practice .layout-main{max-width:620px;margin:0 auto}.chips--center{justify-content:center;margin-top:14px}.siblings{margin-top:26px;border-top:1px solid var(--line);padding-top:14px}.siblings-title{font-size:12px;color:var(--muted);font-weight:400;margin:0 0 10px}.siblings-list{display:flex;flex-wrap:wrap;gap:8px}.sib-word{display:inline-flex;align-items:baseline;gap:6px;padding:4px 10px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--ink)}.sib-word--active{border-color:var(--ink);background:var(--card)}.sib-hanzi{font-family:Georgia,serif;font-size:16px}.sib-pinyin{font-size:11px;color:var(--muted)}.siblings-more{display:inline-block;margin-top:10px;color:var(--muted);text-decoration:none;font-size:12px}.cms{margin-top:30px}.cms-form{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.cms-form input,.cms-form select{font-family:var(--mono);font-size:13px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:4px;padding:6px 10px}.cms-tags{display:flex;flex-wrap:wrap;gap:4px 14px;width:100%}.cms-tag{font-size:12px}.cms-list{list-style:none;margin:0 0 14px;padding:0;max-height:320px;overflow-y:auto;border-top:1px solid var(--line)}.cms-row{display:flex;align-items:center;border-bottom:1px solid var(--line)}.cms-word{flex:1 1;display:flex;align-items:baseline;gap:10px;background:none;border:none;padding:6px 2px;cursor:pointer;font-family:var(--mono);text-align:left}.cms-tagstr{margin-left:auto;font-size:11px;color:var(--muted)}.cms-actions{display:flex;gap:8px}.textcard{padding:40px 0 10px}.textcard-word{font-family:Georgia,Times New Roman,serif;font-size:96px;line-height:1.2;color:var(--ink)}.textcard-controls{justify-content:center}.lang-badge{font-size:10px;color:var(--muted);border:1px solid var(--line);border-radius:3px;padding:0 4px;margin-left:6px}.admin-langs{justify-content:center;margin:-14px 0 22px}.lang-grid{max-width:720px;margin:0 auto}.textcard{text-align:center;padding:0}.textcard-paper{display:flex;align-items:center;justify-content:center;padding:20px}.textcard .textcard-word{font-size:clamp(48px,10vw,110px);line-height:1.25}.textcard-controls{margin-top:12px}.app-title--belajar .title-scripts{display:block;font-size:30px;letter-spacing:4px}.app-title--belajar .title-belajar{display:block;font-family:var(--mono);font-size:13px;letter-spacing:8px;text-transform:uppercase;color:var(--muted);margin-top:8px}.script-toggle{justify-content:flex-end;margin:-6px 0 10px}.cms-contoh{font-family:var(--mono);font-size:12px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:4px;padding:6px 10px;width:100%;min-height:54px;resize:vertical}.examples{margin-top:22px;border-top:1px solid var(--line);padding-top:14px}.example-list{list-style:none;margin:0;padding:0}.example{padding:8px 0;border-bottom:1px solid var(--line)}.example:last-child{border-bottom:none}.example-main{display:flex;align-items:center;gap:10px}.example-zh{font-family:Georgia,serif;font-size:19px}.example-speak{padding:2px 10px;font-size:12px}.example-pinyin{margin-top:2px}.example-id,.example-pinyin{font-size:12px;color:var(--muted)}.example-id{font-style:italic}.example-en{opacity:.85}.learner-toggles{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 0;margin:-6px 0 14px}.learner-toggles .panel-seg{gap:9px;margin:0}.learner-toggles>*+*{margin-left:18px;padding-left:18px;border-left:1px solid var(--line)}.learner-toggles .script-toggle{margin-bottom:0}@media (max-width:560px){.learner-toggles>*+*{margin-left:14px;padding-left:14px}}.stage-icon{display:block}.sw{display:inline-flex;align-items:center;gap:7px;background:none;border:none;padding:0;font-family:var(--mono);font-size:13px;color:var(--muted);cursor:pointer}.sw--on{color:var(--ink)}.sw-track{display:inline-block;width:26px;height:14px;border-radius:999px;border:1px solid var(--line);background:transparent;position:relative;transition:background .12s,border-color .12s}.sw--on .sw-track{background:var(--ink);border-color:var(--ink)}.sw-knob{position:absolute;top:2px;left:2px;width:8px;height:8px;border-radius:50%;background:var(--muted);transition:transform .12s,background .12s}.sw--on .sw-knob{transform:translateX(12px);background:var(--paper)}.panduan{max-width:680px}.bab-list{list-style:none;padding:0;margin:24px 0 0;counter-reset:bab}.bab-list li{margin-bottom:2px}.bab-item{display:flex;gap:16px;align-items:baseline;padding:14px 12px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}.bab-nomor{font-family:Georgia,serif;font-size:20px;color:var(--muted);min-width:24px}.bab-teks{display:flex;flex-direction:column;gap:3px}.bab-judul{font-size:15px}.bab-langkah,.bab-ringkas{font-size:12px;color:var(--muted)}.bab-langkah{margin:0 0 4px}.bab-judul-besar{font-family:Georgia,serif;font-weight:500;font-size:28px;margin:0 0 20px}.bab-paragraf{line-height:1.75;margin:0 0 16px}.bab-coba{margin:24px 0 0}.bab-nav{display:flex;justify-content:space-between;gap:10px;margin-top:32px}.panduan-masuk{display:inline-block;margin:-14px 0 26px;padding:8px 16px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--ink);font-size:13px}.stage-step{display:inline-flex;gap:4px}.stage-step .btn{padding:4px 11px;font-size:15px;line-height:1.1}@media (hover:hover) and (pointer:fine){.btn:hover{border-color:var(--muted)}.vocab-word:hover{background:var(--card)}.vocab-speak:hover{color:var(--ink)}.btn:disabled:hover{border-color:var(--line)}.cat-card:hover{border-color:var(--muted)}.back-link:hover{color:var(--ink)}.level-chip:hover{background:var(--card)}.kartu-masuk a:hover{color:var(--ink)}.kartu:hover{border-color:var(--muted)}.kartu-buka a:hover,.level-nav a:hover{color:var(--ink)}.word-item:hover{background:var(--card)}.sib-word:hover{border-color:var(--muted)}.siblings-more:hover{color:var(--ink)}.bab-item:hover,.cms-word:hover{background:var(--card)}.panduan-masuk:hover{border-color:var(--muted)}}.suara-tanda{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:999px;border:1px solid var(--line);font-size:10px;letter-spacing:.5px;vertical-align:1px}.suara-tanda--orang{color:var(--ink);border-color:var(--muted)}.lembar{max-width:700px;margin:0 auto}.lembar-kepala{text-align:center;margin-bottom:6px}.lembar-judul{font-family:Georgia,serif;font-weight:500;font-size:22px;margin:0}.lembar-bagian{color:var(--muted);font-size:12px;margin:4px 0 0}.lembar-alat{text-align:center;color:var(--muted);font-size:13px;margin:14px 0 22px}.lembar-kata{margin-bottom:20px;break-inside:avoid;page-break-inside:avoid}.lembar-kata-judul{margin:0 0 6px}.lembar-kata-hanzi{font-size:20px;margin-right:10px}.lembar-kata-baca{font-family:var(--mono);font-size:13px;color:var(--muted);margin-right:8px}.lembar-kata-arti{font-size:13px}.lembar-karakter{margin-bottom:8px}.lembar-baris{display:flex;flex-wrap:wrap;gap:3px;margin-bottom:3px}.tzg{width:44px;height:44px;display:inline-block}.lembar-baris--urutan .tzg{width:34px;height:34px;opacity:.95}.tzg--font{position:relative}.tzg--font svg{width:100%;height:100%}.tzg--font svg,.tzg-char{position:absolute;inset:0}.tzg-char{display:flex;align-items:center;justify-content:center;font-size:30px;color:#cfcfcf}@media print{.back-link,.lembar-alat,.site-footer{display:none!important}@page{size:A4;margin:12mm}body{background:#fff}.lembar{max-width:none}.tzg{width:16mm;height:16mm}.lembar-baris--urutan .tzg{width:11mm;height:11mm}.tzg-char{font-size:11mm}}.tulis{display:grid;grid-template-columns:minmax(0,1fr) 320px;grid-gap:32px;gap:32px;align-items:start;max-width:900px;margin:0 auto}.tulis-paper{touch-action:none}.tulis-kanvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair}.tulis-petunjuk{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:13px;pointer-events:none;padding:0 30px;text-align:center}.tulis-hasil{min-height:200px}.tulis-karakter{color:var(--muted);font-size:18px;font-family:Georgia,serif;margin:14px 0 0}.tulis-karakter-grup{margin-right:18px}@media (max-width:760px){.tulis{grid-template-columns:1fr;gap:18px}}.tulis-toggles{margin-bottom:10px;justify-content:flex-start}.tulis-per-karakter{margin-top:14px}.tulis-per-label{color:var(--muted);font-size:11px;margin:0 0 2px;letter-spacing:.5px}.tulis-masuk{color:var(--muted);font-size:12px;border:1px solid var(--line);padding:3px 12px}.level-tanda,.tulis-masuk{text-decoration:none;border-radius:999px}.level-tanda{display:inline-block;margin-left:8px;padding:1px 7px;border:1px solid var(--line);font-size:10px;letter-spacing:.5px;vertical-align:1px;color:var(--ink)}.tulis-karakter-tautan{color:var(--ink);text-decoration:none;margin-right:10px;border-bottom:1px solid var(--line)}.tulis-karakter-mati{color:var(--muted);margin-right:10px;opacity:.6}