@font-face{font-family:LXGW WenKai Kid;src:url(/fonts/LXGWWenKai-subset.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0020-007F,U+2010-2027,U+3000-303F,U+4E00-9FFF,U+FF00-FFEF}:root{--primary: #4FC3F7;--primary-dark: #0288D1;--primary-light: #B3E5FC;--accent: #FFB74D;--accent-dark: #F57C00;--success: #81C784;--success-dark: #388E3C;--error: #F48FB1;--error-dark: #E91E63;--star: #FFD54F;--star-dark: #F9A825;--purple: #CE93D8;--purple-dark: #8E24AA;--bg-gradient: linear-gradient(180deg, #E3F2FD 0%, #F1F8E9 100%);--bg-page: #F5F9FF;--card-bg: #FFFFFF;--card-shadow: 0 4px 15px rgba(0, 0, 0, .08);--card-shadow-hover: 0 8px 25px rgba(0, 0, 0, .12);--card-radius: 20px;--text-primary: #333333;--text-secondary: #666666;--text-light: #999999;--text-white: #FFFFFF;--font-main: "LXGW WenKai Kid", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;--font-display: "LXGW WenKai Kid", "PingFang SC", "Microsoft YaHei", sans-serif;--font-size-char: clamp(48px, 12vw, 120px);--font-size-char-card: clamp(36px, 8vw, 72px);--paper-cream: #FFFAF0;--paper-edge: #F2E9D8;--paper-bg: linear-gradient(180deg, #FFF5DC 0%, #FFEED1 100%);--stage-glow: radial-gradient(ellipse at 50% 38%, #FFF6DD 0%, #FFFAF0 38%, #FFE9C4 100%);--paper-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 18px 30px -12px rgba(176, 132, 80, .28), 0 4px 10px -2px rgba(176, 132, 80, .12);--paper-shadow-lift: 0 1px 0 rgba(255,255,255,.9) inset, 0 28px 44px -14px rgba(176, 132, 80, .34), 0 6px 14px -3px rgba(176, 132, 80, .16);--floor-shadow: radial-gradient(ellipse at center, rgba(120, 80, 30, .22) 0%, rgba(120, 80, 30, 0) 70%);--subject-char: #F4A672;--subject-char-dark: #D87A45;--subject-math: #93B5D8;--subject-math-dark: #5E8AB8;--subject-go: #9CBE8F;--subject-go-dark: #6E9957;--subject-code: #B5A4DB;--subject-code-dark: #8470BD;--subject-xq: #D27D7D;--subject-xq-dark: #B05454;--ink-dark: #4A3B2A;--ink-mid: #7A6A52;--ink-light: #A8967E;--amber: #E89A3C;--amber-soft: #FFE4A8;--correct: #6CAE5E;--correct-soft: #D7E9CB;--wrong: #E27D7D;--wrong-soft: #F8D6D2;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-xxl: 48px;--btn-radius: 16px;--btn-min-height: 48px}@media(min-width:1024px){:root{--card-radius: 24px;--spacing-lg: 32px;--spacing-xl: 40px;--btn-min-height: 56px}}@media(min-width:1200px){:root{--btn-min-height: 64px}}@media(max-height:500px)and (orientation:landscape){:root{--spacing-lg: 12px;--spacing-xl: 16px;--spacing-xxl: 24px;--btn-min-height: 40px;--font-size-char: clamp(36px, 8vw, 64px);--font-size-char-card: clamp(28px, 6vw, 48px)}}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;min-height:100vh;font-family:var(--font-main);color:var(--ink-dark);background:var(--paper-bg);overflow-x:hidden;-webkit-font-smoothing:antialiased}#app{min-height:100vh}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);min-height:var(--btn-min-height);padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:var(--btn-radius);font-family:var(--font-main);font-size:clamp(16px,2.5vw,22px);font-weight:600;cursor:pointer;transition:all .2s ease;user-select:none;-webkit-user-select:none;text-decoration:none}.btn:active{transform:scale(.95)}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:var(--text-white);box-shadow:0 4px 12px #4fc3f766}.btn-primary:hover{box-shadow:0 6px 16px #4fc3f780}.btn-accent{background:linear-gradient(135deg,var(--accent),var(--accent-dark));color:var(--text-white);box-shadow:0 4px 12px #ffb74d66}.btn-success{background:linear-gradient(135deg,var(--success),var(--success-dark));color:var(--text-white);box-shadow:0 4px 12px #81c78466}.btn-error{background:linear-gradient(135deg,var(--error),var(--error-dark));color:var(--text-white);box-shadow:0 4px 12px #f48fb166}.btn-purple{background:linear-gradient(135deg,var(--purple),var(--purple-dark));color:var(--text-white);box-shadow:0 4px 12px #ce93d866}.btn-outline{background:var(--card-bg);color:var(--primary-dark);border:2px solid var(--primary)}.btn-large{min-height:60px;padding:var(--spacing-md) var(--spacing-xl);font-size:clamp(18px,3vw,26px);border-radius:20px}.btn-round{border-radius:50%;width:56px;height:56px;padding:0}.card{background:var(--card-bg);border-radius:var(--card-radius);box-shadow:var(--card-shadow);padding:var(--spacing-lg);transition:all .3s ease}.card:hover{box-shadow:var(--card-shadow-hover)}.page{min-height:100vh;padding:var(--spacing-lg);padding-bottom:calc(var(--spacing-xxl) + 20px)}.page-header{text-align:center;margin-bottom:var(--spacing-xl)}.page-title{font-size:clamp(24px,5vw,36px);font-weight:700;color:var(--text-primary);margin-bottom:var(--spacing-sm)}.grid{display:grid;gap:var(--spacing-md)}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}@media(max-width:600px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}.text-char{font-size:var(--font-size-char);font-weight:700;line-height:1.2}.text-pinyin{font-size:clamp(18px,4vw,32px);color:var(--primary-dark);font-weight:500}.star-icon{color:var(--star);filter:drop-shadow(0 1px 2px rgba(249,168,37,.4))}.emoji-large{font-size:clamp(40px,10vw,80px);line-height:1}.back-btn{position:fixed;top:var(--spacing-md);left:var(--spacing-md);z-index:100;background:#ffffffe6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:none;border-radius:50%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:20px;cursor:pointer;box-shadow:0 2px 8px #0000001a;transition:all .2s}.back-btn:active{transform:scale(.9)}.hide-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.hide-scrollbar::-webkit-scrollbar{display:none}@supports (padding-bottom: env(safe-area-inset-bottom)){.page{padding-bottom:calc(var(--spacing-xxl) + env(safe-area-inset-bottom));padding-left:max(var(--spacing-lg),env(safe-area-inset-left));padding-right:max(var(--spacing-lg),env(safe-area-inset-right))}}@media(max-height:500px)and (orientation:landscape){.page{padding:var(--spacing-sm) var(--spacing-md);padding-bottom:calc(var(--spacing-md) + env(safe-area-inset-bottom,0px));min-height:auto}.page-header{margin-bottom:var(--spacing-sm)}.back-btn{width:36px;height:36px;font-size:16px}.btn-large{min-height:44px;padding:var(--spacing-xs) var(--spacing-md);font-size:16px}}.paper-prompt{font-family:var(--font-display);font-size:clamp(36px,7vw,56px);font-weight:900;color:var(--ink-dark);letter-spacing:.04em;background:var(--paper-cream);padding:12px 32px;border-radius:18px;border:2px solid var(--paper-edge);box-shadow:0 4px 12px #b084502e}.btn-num{font-family:var(--font-display);font-size:clamp(28px,6vw,40px);font-weight:800;padding:16px 0;background:var(--paper-cream);color:var(--ink-dark);border:3px solid var(--paper-edge);border-radius:18px;cursor:pointer;transition:all .16s;box-shadow:0 4px 0 var(--paper-edge),0 6px 14px #b084502e;font-family:inherit}.btn-num:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 var(--paper-edge),0 2px 8px #b084501f}.btn-num:hover:not(:disabled){background:#fff6e0;border-color:var(--amber)}.btn-num:disabled{opacity:.55;cursor:not-allowed}.btn-card{min-height:88px;background:var(--paper-cream);border:3px solid var(--paper-edge);border-radius:18px;cursor:pointer;padding:12px;display:flex;align-items:center;justify-content:center;transition:all .18s;box-shadow:0 4px 0 var(--paper-edge),0 6px 14px #b084502e;font-family:inherit}.btn-card:hover:not(:disabled){background:#fff6e0;border-color:var(--amber);transform:translateY(-2px)}.btn-card:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 var(--paper-edge)}.btn-card:disabled{opacity:.55;cursor:not-allowed}.btn-speak{background:var(--amber);border:2px solid var(--amber);color:#fff;border-radius:50%;width:40px;height:40px;font-size:18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-family:inherit;transition:transform .15s;box-shadow:0 3px 8px #e89a3c52;flex-shrink:0}.btn-speak:hover:not(:disabled){transform:scale(1.1)}.btn-speak:active:not(:disabled){transform:scale(.95)}.btn-speak:disabled{opacity:.5;cursor:not-allowed}.btn-hint{background:var(--amber-soft);color:var(--ink-dark);border:3px solid var(--amber);border-radius:14px;padding:10px 22px;font-weight:800;font-size:16px;cursor:pointer;font-family:inherit;transition:transform .15s;box-shadow:0 3px 8px #e89a3c33}.btn-hint:hover:not(:disabled){transform:scale(1.04)}.btn-hint:active:not(:disabled){transform:scale(.96)}.btn-hint:disabled{opacity:.6;cursor:not-allowed}.paper-canvas{background:var(--paper-cream);border:3px solid var(--paper-edge);border-radius:24px;box-shadow:var(--paper-shadow);padding:20px 16px}.paper-title{font-family:var(--font-display);font-size:clamp(20px,4vw,26px);font-weight:800;color:var(--ink-dark);display:inline-flex;align-items:center;gap:10px}@keyframes bounceIn{0%{transform:scale(0);opacity:0}50%{transform:scale(1.1)}70%{transform:scale(.95)}to{transform:scale(1);opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes starFly{0%{transform:scale(0) rotate(0);opacity:0}50%{transform:scale(1.3) rotate(180deg);opacity:1}to{transform:scale(1) rotate(360deg);opacity:1}}@keyframes twinkle{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.8)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideInLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes popIn{0%{transform:scale(0)}70%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes paperHover{0%,to{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-5px) rotate(-.6deg)}}@keyframes flipToBack{0%{transform:rotateY(0)}to{transform:rotateY(180deg)}}@keyframes screenShake{0%,to{transform:translate(0)}20%{transform:translate(-3px,2px)}40%{transform:translate(3px,-2px)}60%{transform:translate(-2px,-2px)}80%{transform:translate(2px,3px)}}@keyframes floorBreath{0%,to{opacity:.55;transform:translate(-50%) scaleX(1)}50%{opacity:.42;transform:translate(-50%) scaleX(.86)}}@keyframes haloRing{0%{transform:translate(-50%,-50%) scale(.4);opacity:.9}to{transform:translate(-50%,-50%) scale(2.6);opacity:0}}@keyframes goldenFlash{0%,to{opacity:0}20%{opacity:.55}}.animate-bounceIn{animation:bounceIn .6s cubic-bezier(.68,-.55,.265,1.55)}.animate-fadeInUp{animation:fadeInUp .5s ease-out}.animate-fadeIn{animation:fadeIn .3s ease-out}.animate-shake{animation:shake .5s ease-in-out}.animate-pulse{animation:pulse 2s ease-in-out infinite}.animate-bounce{animation:bounce 1s ease-in-out infinite}.animate-float{animation:float 3s ease-in-out infinite}.animate-popIn{animation:popIn .4s cubic-bezier(.68,-.55,.265,1.55)}.animate-starFly{animation:starFly .6s ease-out}.animate-paperHover{animation:paperHover 5.5s ease-in-out infinite}.animate-screenShake{animation:screenShake .5s ease-in-out}.page-enter-active{animation:fadeInUp .35s ease-out}.page-leave-active{animation:fadeIn .2s ease-in reverse}.flip-enter-active{animation:slideInRight .4s ease-out}.flip-leave-active{animation:slideInLeft .3s ease-in reverse}.delay-1{animation-delay:.1s;animation-fill-mode:both}.delay-2{animation-delay:.2s;animation-fill-mode:both}.delay-3{animation-delay:.3s;animation-fill-mode:both}.delay-4{animation-delay:.4s;animation-fill-mode:both}.delay-5{animation-delay:.5s;animation-fill-mode:both}.fullscreen-btn[data-v-7a6f38c8]{position:fixed;bottom:calc(16px + env(safe-area-inset-bottom,0px));right:16px;z-index:999;width:44px;height:44px;border-radius:50%;border:none;background:#ffffffd9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 10px #0000001f;font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.fullscreen-btn[data-v-7a6f38c8]:active{transform:scale(.9)}.guide-overlay[data-v-7a6f38c8]{position:fixed;inset:0;z-index:10000;background:#00000080;display:flex;align-items:center;justify-content:center;padding:24px}.guide-card[data-v-7a6f38c8]{background:#fff;border-radius:24px;padding:32px 28px;max-width:340px;width:100%;text-align:center;box-shadow:0 20px 60px #0003}.guide-emoji[data-v-7a6f38c8]{font-size:56px;margin-bottom:12px}.guide-title[data-v-7a6f38c8]{font-size:22px;font-weight:700;margin-bottom:16px;color:#333}.guide-steps[data-v-7a6f38c8]{text-align:left;font-size:15px;line-height:1.8;color:#555;margin-bottom:20px}.guide-steps p[data-v-7a6f38c8]{margin-bottom:8px}.guide-steps ol[data-v-7a6f38c8]{padding-left:20px}.guide-steps li[data-v-7a6f38c8]{margin-bottom:6px}.guide-icon[data-v-7a6f38c8]{display:inline-block;font-size:18px}.guide-close-btn[data-v-7a6f38c8]{width:100%;min-height:48px}.guide-enter-active[data-v-7a6f38c8]{transition:opacity .25s ease}.guide-leave-active[data-v-7a6f38c8]{transition:opacity .2s ease}.guide-enter-from[data-v-7a6f38c8],.guide-leave-to[data-v-7a6f38c8]{opacity:0}