:root{--ink: #35455c;--ink-soft: #8a94a6;--cream: #fff9ee;--sky: #eaf4ff;--paper: #ffffff;--mango: #ff9f43;--mango-deep: #e08a28;--sky-blue: #4e9cff;--sky-deep: #3d7fc4;--mint: #58c97b;--grape: #a29bfe;--peach: #ffe8d6;--lemon: #fff3c4;--lilac: #efe4ff;--mint-soft: #dff5e7;--sky-soft: #ddeeff;--font-round: "Yuanti SC", "YouYuan", "PingFang SC", "Microsoft YaHei", sans-serif;--shadow-sticker: 0 10px 24px rgba(84, 116, 158, .12), 0 3px 6px rgba(84, 116, 158, .06)}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}*{scrollbar-width:none;-ms-overflow-style:none}*::-webkit-scrollbar{display:none}html,body,#app{height:100%;font-family:PingFang SC,Microsoft YaHei,system-ui,sans-serif;color:var(--ink);background:radial-gradient(rgba(122,162,214,.09) 1.5px,transparent 1.6px),radial-gradient(1000px 460px at 88% -12%,rgba(255,222,170,.55),transparent 62%),radial-gradient(820px 400px at -8% 10%,rgba(214,234,255,.75),transparent 55%),linear-gradient(180deg,var(--cream) 0%,var(--sky) 100%);background-size:26px 26px,100% 100%,100% 100%,100% 100%;background-attachment:fixed;-webkit-user-select:none;user-select:none;overflow:hidden}input,textarea,select{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}.page{height:100%;display:flex;flex-direction:column;padding:16px;overflow:hidden;position:relative}.btn{border:none;border-radius:20px;background:linear-gradient(180deg,#ffc46b,#ffa64d 55%,#ff9f43);color:#fff;font-size:22px;font-weight:600;font-family:var(--font-round);min-height:64px;min-width:180px;padding:12px 36px;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,filter .12s ease;box-shadow:0 5px 0 var(--mango-deep),inset 0 2px #ffffff73,0 10px 18px #ff9f4338;text-shadow:0 1px 0 rgba(0,0,0,.08)}.btn:hover{filter:brightness(1.04)}.btn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--mango-deep),inset 0 2px #ffffff73,0 4px 10px #ff9f432e}.btn.blue{background:linear-gradient(180deg,#7dbcff,#5ba9fb 55%,#4e9cff);box-shadow:0 5px 0 var(--sky-deep),inset 0 2px #fff6,0 10px 18px #4e9cff38}.btn.blue:active{box-shadow:0 2px 0 var(--sky-deep),inset 0 2px #fff6,0 4px 10px #4e9cff2e}.btn.gray{background:#f1f4f8;color:var(--ink-soft);text-shadow:none;box-shadow:0 4px #d6dde6}.btn.gray:active{box-shadow:0 1px #d6dde6}.btn.big{font-size:28px;min-height:80px;padding:16px 48px;border-radius:24px}.btn:disabled{opacity:.5;filter:grayscale(.2)}.btn.small{font-size:17px;min-height:48px;min-width:0;padding:10px 22px;border-radius:999px}.btn.small.orange{background:linear-gradient(180deg,#ffedd4,#ffe3c2);color:#c96f1e;box-shadow:0 3px #e8b577}.btn.small.orange:active{box-shadow:0 1px #e8b577}.btn.small.blue{background:linear-gradient(180deg,#e4f1ff,#d8ecff);color:#1f6fb8;box-shadow:0 3px #9cc4e8}.btn.small.blue:active{box-shadow:0 1px #9cc4e8}.btn.small.purple{background:linear-gradient(180deg,#efe6ff,#e4d5ff);color:#7c5cbf;box-shadow:0 3px #bda6e8}.btn.small.purple:active{box-shadow:0 1px #bda6e8}.btn.small.ghost{background:none;border:2px solid #dfe5ee;color:var(--ink-soft);box-shadow:none}.card{background:var(--paper);border-radius:24px;border:3px solid #fff;box-shadow:var(--shadow-sticker);padding:24px}.hanzi-big{font-size:120px;line-height:1.2;color:#d35400;font-family:KaiTi,STKaiti,PingFang SC,serif}.option-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.option{background:linear-gradient(180deg,#fff,#f7faff);border:3px solid #e3e9f2;border-radius:20px;min-height:72px;padding:14px 20px;font-size:30px;font-weight:600;font-family:var(--font-round);color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 3px #dde5f0;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}.option:active{transform:scale(.96);box-shadow:0 1px #dde5f0}.option.right{border-color:var(--mint);background:linear-gradient(180deg,#eafaf1,#dff5e7);color:#27ae60;box-shadow:0 3px #b5e6c6;animation:pop .3s ease}.option.wrong{border-color:#c8d0da;color:#9aa7b8;background:#f4f6f9;box-shadow:0 3px #e0e6ee;animation:shake .3s}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.progress-track{height:14px;border-radius:999px;background:#e9eef5;overflow:hidden;box-shadow:inset 0 1px 3px #54749e1f}.progress-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#ffd57e,#ff9f43);position:relative;overflow:hidden;transition:width .3s ease}.progress-fill:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.3) 0 10px,transparent 10px 20px);animation:candy-stripes .8s linear infinite}@keyframes candy-stripes{to{transform:translate(28px)}}.star-row{display:flex;gap:8px;justify-content:center;font-size:32px}.star-row .off{opacity:.25;filter:grayscale(1)}.star-row span{animation:pop .4s ease both}.star-row span:nth-child(1){animation-delay:.05s}.star-row span:nth-child(2){animation-delay:.15s}.star-row span:nth-child(3){animation-delay:.25s}.star-row span:nth-child(4){animation-delay:.35s}.star-row span:nth-child(5){animation-delay:.45s}@keyframes pop{0%{transform:scale(0);opacity:0}70%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}.pop{animation:pop .3s ease both}@keyframes floatUp{0%{transform:translateY(0);opacity:1}to{transform:translateY(-80px);opacity:0}}.float-up{animation:floatUp .8s ease both}.sky-deco{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:-1}.cloud{position:absolute;width:120px;height:38px;background:#fff;border-radius:999px;opacity:.75;filter:drop-shadow(0 6px 10px rgba(84,116,158,.08))}.cloud:before,.cloud:after{content:"";position:absolute;background:#fff;border-radius:50%}.cloud:before{width:50px;height:50px;top:-24px;left:20px}.cloud:after{width:34px;height:34px;top:-15px;right:22px}.cloud.c1{top:14%;left:-160px;animation:drift 52s linear infinite}.cloud.c2{top:34%;left:-90px;width:84px;height:28px;opacity:.55;animation:drift 68s linear 18s infinite}.cloud.c2:before{width:36px;height:36px;top:-17px;left:14px}.cloud.c2:after{width:24px;height:24px;top:-10px;right:16px}@keyframes drift{to{transform:translate(calc(100vw + 320px))}}.sun{position:absolute;top:-80px;right:-80px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,#ffe9ad,#ffd57e 45%,#ffd57e00 70%);opacity:.85}.sun:after{content:"";position:absolute;top:-44px;right:-44px;bottom:-44px;left:-44px;border-radius:50%;background:repeating-conic-gradient(rgba(255,193,94,.3) 0 6deg,transparent 6deg 18deg);-webkit-mask:radial-gradient(circle,transparent 50%,#000 54%,#000 60%,transparent 64%);mask:radial-gradient(circle,transparent 50%,#000 54%,#000 60%,transparent 64%);animation:sun-spin 64s linear infinite}@keyframes sun-spin{to{transform:rotate(1turn)}}@supports not ((mask: radial-gradient(circle,#000 0,transparent 60%)) or (-webkit-mask: radial-gradient(circle,#000 0,transparent 60%))){.sun:after{display:none}}.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.topbar .title{font-family:var(--font-round);font-size:19px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;background:#ffffffd9;padding:6px 16px;border-radius:999px;box-shadow:0 2px 8px #54749e1a}.topbar-right{display:flex;align-items:center;gap:10px;flex-shrink:0}.topbar .timer{font-size:17px;color:#b96f2c;font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#fff6dd,#ffedb8);border-radius:999px;padding:4px 12px;box-shadow:inset 0 1px #fff}.topbar .parent-link{font-size:13px;color:#b0b8c4;text-decoration:none;padding:6px 10px}.hint{font-size:16px;color:var(--ink-soft)}.p-table{width:100%;border-collapse:collapse;font-size:14px}.p-table th,.p-table td{padding:8px 10px;text-align:left;border-bottom:1px solid #f0f0f0}.p-table th{color:#9aa7b8;font-weight:500}@media (max-width: 480px){.page{padding:10px}.card{padding:16px;border-radius:18px}.hanzi-big{font-size:88px}.btn{font-size:19px;min-height:56px;min-width:0;padding:10px 24px}.btn.big{font-size:22px;min-height:64px;padding:12px 32px;border-radius:20px}.btn.small{font-size:15px;min-height:44px;padding:8px 16px}.option{min-height:60px;font-size:26px;border-radius:16px;padding:10px 14px}.option-grid{gap:10px}.topbar .title{font-size:16px;padding:5px 12px}.topbar .timer{font-size:14px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
