:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}body{margin:0}#root{text-align:center;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}*{box-sizing:border-box}body{color:#261710;background:radial-gradient(circle at top,#c23a1a38,#0000 34%),linear-gradient(#f8f2e8 0%,#efe4d2 100%);margin:0;font-family:Avenir Next,Segoe UI,sans-serif}.app{max-width:640px;min-height:100dvh;padding:18px 14px calc(126px + env(safe-area-inset-bottom,0px));margin:0 auto}.screen{background:#fffbf5f2;border:1px solid #d8c2a6;border-radius:24px;gap:14px;padding:18px;display:grid;box-shadow:0 18px 42px #4826151f}h2,h3{color:#2d160f;margin:0;font-family:Georgia,Times New Roman,serif}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:#9b5d3d;font-size:.72rem;display:block}.sub{color:#775847;margin:0;font-size:.95rem;line-height:1.45}button{color:#301810;cursor:pointer;background:#f7ebdc;border:1px solid #b88d6d;border-radius:16px;padding:10px 12px;transition:transform .12s,background .12s,border-color .12s}button:hover{transform:translateY(-1px)}button.primary{color:#fff7f1;background:linear-gradient(#b64624,#8f2e17);border-color:#8f2e17}button.danger{color:#fff5f3;background:#6f2a24;border-color:#6f2a24}.heroBlock{gap:6px;display:grid}.screenTop{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.topActions{align-items:center;gap:8px;display:flex}.infoTip{position:relative}.infoTip summary{cursor:pointer;color:#8f3b22;background:#f2e2d0;border:1px solid #cda37d;border-radius:999px;place-items:center;width:24px;height:24px;font-weight:700;list-style:none;display:grid}.infoTip summary::-webkit-details-marker{display:none}.infoTip[open]>div{z-index:5;color:#6f5446;background:#fffaf3;border:1px solid #d7b592;border-radius:14px;width:240px;padding:10px;font-size:.86rem;position:absolute;top:30px;right:0;box-shadow:0 14px 26px #48261529}.familyTabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.familyTabs button{text-align:left;background:#f7ebdcb8;gap:4px;padding:12px 14px;display:grid}.familyTabs button strong{font-size:.98rem}.familyTabs button span{color:#755a48;font-size:.84rem;line-height:1.35}.familyTabs button.active{background:#fff9f2;border-color:#8f371c;box-shadow:inset 0 0 0 1px #8f371c1f}.packSpotlight{background:linear-gradient(135deg,#fff7ecf5,#f9e9d6f0);border:1px solid #d7b595;border-radius:20px;gap:10px;padding:14px;display:grid}.packSpotlightTop{justify-content:space-between;align-items:flex-start;gap:10px;display:flex}.packSpotlight b,.packSpotlight span{display:block}.packSpotlight b{margin-top:2px;font-size:1.35rem}.packSpotlight span,.packSpotlight p{color:#725444;margin:0}.pack-theme{background:linear-gradient(135deg,#fff5eafa,#fcdfc6f5);border-color:#c78862}.packPill{color:#7f583f;white-space:nowrap;background:#fffaf4b8;border:1px solid #d5b38f;border-radius:999px;padding:6px 10px;font-size:.78rem}.packPill.muted{background:#f6ecdf}.packSectionHead{justify-content:space-between;align-items:flex-start;gap:10px;display:flex}.packGrid{gap:10px;display:grid}.packGrid-frequency{grid-template-columns:repeat(2,minmax(0,1fr))}.packOption{text-align:left;align-content:start;gap:6px;min-height:98px;display:grid}.packOptionTop{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.packOption strong{font-size:1rem}.packOption span,.packOption p{color:#7d624f;margin:0}.packOption span{font-size:.9rem}.packOption p{font-size:.82rem;line-height:1.4}.packOption small{color:#946e52}.packOption.selected{background:#fff9f2;border-color:#8f371c;box-shadow:inset 0 0 0 1px #8f371c1f}.lanePreview{text-align:left;background:linear-gradient(135deg,#f7ebdce6,#f2e1cef0);justify-content:space-between;align-items:center;gap:12px;width:100%;display:flex}.lanePreview small,.lanePreview span{color:#7d624f}.lanePreview strong,.lanePreview span{display:block}.lanePreviewMeta{text-align:right;justify-items:end;gap:4px;display:grid}.lanePreviewMeta b{color:#8f371c}.summaryStrip{flex-wrap:wrap;gap:8px;display:flex}.summaryStrip>div{background:#f6ecdf;border:1px solid #dcc3a6;border-radius:16px;flex:1;min-width:110px;padding:10px 12px;display:grid}.summaryStrip small{color:#8b6d5a}.summaryStripWide>div{min-width:120px}.menuActions{gap:8px;display:grid}.card{text-align:center;background:linear-gradient(#fffcf7fa,#f8eddef5);border:1px solid #d9bea1;border-radius:24px;place-items:center;gap:12px;min-height:300px;padding:18px;display:grid}.hanzi{font-size:clamp(3rem,8vw,4.6rem);font-weight:700;line-height:1.05}.pinyin{color:#a24524;font-size:1.18rem}.defs{text-align:left;gap:6px;max-width:92%;font-size:1rem;display:grid}.exampleBox{text-align:left;background:#fffaf4;border:1px solid #dcb898;border-radius:16px;gap:5px;width:min(92%,460px);margin-top:4px;padding:10px;font-size:.95rem;display:grid}.exampleBox small{color:#8d6b57}.grades{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.grades .again{color:#fff;background:#7f2d25;border-color:#7f2d25}.grades .hard{color:#fff;background:#b5671f;border-color:#b5671f}.grades .good{color:#fff;background:#447351;border-color:#447351}.grades .easy{color:#fff;background:#2d6d7f;border-color:#2d6d7f}.inlineHelp{justify-content:space-between;align-items:center;gap:8px;display:flex}.inlineHelp .grades{flex:1}.microMeta{color:#836452;justify-content:space-between;align-items:center;gap:8px;font-size:.9rem;display:flex}label{gap:6px;display:grid}input,select{color:#2b1810;background:#fffaf4;border:1px solid #cfa782;border-radius:12px;padding:10px}.checkRow{align-items:center;gap:8px;display:flex}.problemList{gap:8px;display:grid}.problemRow{text-align:left;background:#faf2e7;border:1px solid #dcc3a6;border-radius:16px;gap:4px;padding:10px;display:grid}.problemRow small{color:#8b6d5a}.empty{gap:8px;display:grid}.dock{background:#fffbf5f5;border:1px solid #d7b795;border-radius:20px;grid-template-columns:repeat(3,1fr);gap:8px;width:min(640px,100vw - 20px);padding:8px;display:grid;position:fixed;bottom:10px;left:50%;transform:translate(-50%);box-shadow:0 12px 28px #48261524}.dock button{background:#f7ebdc}.dock button.active{color:#fff6ee;background:#8f351a;border-color:#8f351a}@media (width<=640px){.app{padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))}.screen{border-radius:20px;padding:16px}.familyTabs,.packGrid-frequency{grid-template-columns:1fr}.packSpotlightTop,.packSectionHead,.inlineHelp,.microMeta,.screenTop,.lanePreview{flex-direction:column;align-items:stretch}.topActions{justify-content:space-between}.dock{width:100%;box-shadow:none;padding:6px;position:static;transform:none}.dock button{padding:9px 10px;font-size:.92rem}}