:root{--bg: #fff6e7;--panel: #fffdf7;--ink: #5b4636;--ink2: #8a6f58;--line: #f0d9b4;--line-soft: #f6e7cc;--primary: #ff9f45;--primary-deep: #f2811d;--red: #ff6b6b;--honey: #ffd166;--leaf: #9bc53d;--blue: #5fa8f5;--ok: #4c9a52;--bad: #d8433c;--radius: 20px;--shadow: 0 8px 24px rgba(180, 120, 60, .12);--font-fun: "ZCOOL KuaiLe", "Microsoft YaHei", sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:-apple-system,PingFang SC,Microsoft YaHei,Segoe UI,sans-serif;color:var(--ink);background:linear-gradient(160deg,#fff6e7,#ffedd2 60%,#ffe4bc);background-attachment:fixed;-webkit-font-smoothing:antialiased}button{font-family:inherit}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#ecd3ab;border-radius:8px}::-webkit-scrollbar-track{background:transparent}.app{min-height:100%}.page{min-height:100vh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;gap:14px;padding:14px 22px}.topbar-title{font-family:var(--font-fun);font-size:24px}.topbar-actions{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.main{flex:1;display:flex;gap:14px;padding:0 22px 22px;min-height:0}.btn{padding:10px 18px;border-radius:14px;border:2px solid var(--line);background:#fff7ea;color:var(--ink);font-weight:700;font-size:15px;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s}.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow)}.btn:disabled{opacity:.45;cursor:default;transform:none}.btn.primary{background:linear-gradient(160deg,#ffb25c,#ff9f45);border-color:var(--primary-deep);color:#fff;box-shadow:0 4px 14px #f2811d59}.btn.ghost{background:transparent;border-color:transparent}.btn.ghost:hover{background:#ffc8822e;box-shadow:none}.btn.small{padding:6px 12px;font-size:13px;border-radius:11px}.btn.wide{width:100%;margin-top:10px}.btn.arming{background:#f25c54;color:#fff;border-color:var(--bad)}.icon-btn{font-size:22px;background:#fff3e0;border-radius:14px;padding:8px 12px;border:2px solid var(--line);cursor:pointer;transition:transform .15s}.icon-btn:hover{transform:translateY(-2px) rotate(8deg)}.seg{display:flex;background:#fbeed6;border-radius:14px;padding:3px;gap:2px}.seg-btn{padding:8px 14px;border-radius:11px;border:none;background:transparent;font-weight:700;font-size:14px;color:var(--ink);cursor:pointer}.seg-btn.active{background:#fff;box-shadow:0 2px 8px #b4783c2e;color:var(--primary-deep)}.panel{background:var(--panel);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);border:2px solid var(--line-soft)}.panel h3{margin:0 0 10px;font-size:16px}.side{width:308px;flex-shrink:0;display:flex;flex-direction:column;gap:14px;overflow-y:auto;max-height:calc(100vh - 92px);padding-bottom:4px}.stage{flex:1;position:relative;border-radius:24px;overflow:hidden;min-height:540px;background:radial-gradient(120% 90% at 50% 0%,#fff7e2,#ffebc9 55%,#ffe0af);border:3px solid #f6e3c2;box-shadow:inset 0 0 40px #ffbe7826,0 10px 26px #be82461a}.stage-hint{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;color:#b98a55;font-size:18px;font-weight:700;text-align:center;padding:0 40px;animation:breathe 2.6s ease-in-out infinite}@keyframes breathe{0%,to{opacity:.75}50%{opacity:1}}.dir-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.dir-btn{position:relative;padding:13px 12px 13px 24px;border-radius:14px;background:#fff3e0;border:2px solid var(--line);font-size:15px;font-weight:700;color:var(--ink);cursor:pointer;transition:transform .15s,background .15s}.dir-btn:hover{transform:translateY(-2px)}.dir-btn.active{background:linear-gradient(160deg,#ffb25c,#ff9f45);color:#fff;border-color:var(--primary-deep);box-shadow:0 4px 12px #f2811d59}.dir-key{position:absolute;top:4px;left:9px;font-size:11px;opacity:.55}.dir-btn.free{width:100%;margin-top:8px;padding-left:14px}.card-panel{text-align:center}.card-view{display:flex;justify-content:center;margin-bottom:10px}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;gap:10px;cursor:pointer}.toggle-row.slim{padding:8px 2px}.toggle-label{font-weight:800}.toggle-desc{font-size:12.5px;color:var(--ink2)}.switch{display:flex;align-items:center;width:46px;height:26px;padding:0;border:none;border-radius:999px;background:#e7d6bc;position:relative;transition:background .2s;cursor:pointer;flex-shrink:0}.switch[data-state=checked]{background:var(--primary)}.switch-thumb{display:block;width:20px;height:20px;margin:0 3px;border-radius:50%;background:#fff;box-shadow:0 2px 6px #0003;transform:translate(0);transition:transform .2s;flex-shrink:0}.switch[data-state=checked] .switch-thumb{transform:translate(20px)}.sil-wrap{background:#fff;border:2px solid #f3e2c7;padding:8px;border-radius:12px;display:inline-flex;flex-direction:column;align-items:center;gap:6px}.sil{display:grid;gap:3px}.sil-cell{border-radius:5px;background:#fff3e0;border:1px dashed #ebd6b4;box-sizing:border-box}.sil-cell.on{background:linear-gradient(160deg,#ffc27a,#ff9f45);border:1px solid var(--primary-deep)}.sil-cell.bad{background:var(--red)!important;border-color:var(--bad)!important}.sil.good .sil-cell.on{background:linear-gradient(160deg,#b4e197,var(--leaf));border-color:#7fa62e}.sil-title{font-size:12px;color:var(--ink2);font-weight:700}.sil-empty{color:#b98a55;font-weight:700;font-size:13px}.paint-grid{display:grid;gap:4px;background:#fff;padding:10px;border-radius:14px;border:2px solid #f3e2c7;width:max-content}.paint-cell{border-radius:7px;background:#fff6e7;border:2px dashed #e8d2ac;cursor:pointer;transition:background .1s}.paint-cell:hover{background:#ffe8c4}.paint-cell.on{background:linear-gradient(160deg,#ffb25c,#ff9f45);border:2px solid var(--primary-deep)}.paint-cell:disabled{cursor:default}.paint-wrap{margin-bottom:12px}.home{align-items:center;justify-content:center;position:relative;gap:24px;padding:30px 20px}.gear{position:absolute;top:22px;right:26px}.home-hero{text-align:center}.logo{font-family:var(--font-fun);font-size:68px;margin:0;display:flex;gap:8px;justify-content:center}.logo-ch{display:inline-block;text-shadow:0 5px 0 rgba(140,90,30,.12);animation:pop-in .6s ease-out backwards}.logo-ch:nth-child(1){color:var(--red);transform:rotate(-5deg);animation-delay:.05s}.logo-ch:nth-child(2){color:var(--primary);transform:rotate(3deg) translateY(3px);animation-delay:.15s}.logo-ch:nth-child(3){color:#f2a93b;transform:rotate(-2deg);animation-delay:.25s}.logo-ch:nth-child(4){color:var(--leaf);transform:rotate(4deg) translateY(3px);animation-delay:.35s}@keyframes pop-in{0%{transform:scale(0);opacity:0}70%{transform:scale(1.15)}to{transform:scale(1);opacity:1}}.tagline{color:var(--ink2);font-size:18px;margin:10px 0 0}.home-body{display:flex;align-items:center;gap:36px}.menu-grid{display:grid;grid-template-columns:repeat(3,200px);gap:14px}.menu-card{display:flex;flex-direction:column;align-items:center;gap:5px;padding:20px 14px;border-radius:22px;border:3px solid #fff;cursor:pointer;box-shadow:0 8px 22px #b4783c24;transition:transform .18s;color:var(--ink)}.menu-card:hover{transform:translateY(-4px) rotate(-1deg)}.menu-icon{font-size:38px}.menu-title{font-family:var(--font-fun);font-size:21px}.menu-desc{font-size:13px;color:var(--ink2);font-weight:600}.t-orange{background:linear-gradient(#ffe8c7,#ffdca8)}.t-pink{background:linear-gradient(#ffe4f1,#ffd0e4)}.t-red{background:linear-gradient(#ffe0dc,#ffc9c2)}.t-green{background:linear-gradient(#e9f4cd,#d6eaad)}.t-blue{background:linear-gradient(#ddebfb,#c8ddf6)}.t-honey{background:linear-gradient(#fff0c2,#ffe49e)}.mascot{animation:float 4s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}.mascot-star{fill:var(--honey)}.mascot .s1{animation:twinkle 2.2s ease-in-out infinite}.mascot .s2{animation:twinkle 2.2s ease-in-out .7s infinite}.mascot .s3{animation:twinkle 2.2s ease-in-out 1.4s infinite}@keyframes twinkle{0%,to{opacity:.35;transform:scale(.9)}50%{opacity:1}}.home-stats{display:flex;gap:12px}.stat-chip{background:#fff;padding:8px 16px;border-radius:999px;font-weight:700;border:2px solid var(--line-soft);box-shadow:var(--shadow);font-size:14px}.observe{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0}.observe-stage{flex:1;min-height:400px}.observe-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:var(--panel);padding:10px;border-radius:16px;border:2px solid var(--line-soft)}.mini-dir{padding:8px 14px;border-radius:999px;background:#fff3e0;border:2px solid var(--line);font-weight:700;cursor:pointer;font-size:14px;color:var(--ink);transition:background .15s}.mini-dir.active{background:linear-gradient(160deg,#ffb25c,#ff9f45);border-color:var(--primary-deep);color:#fff}.toggle-inline{display:flex;gap:8px;align-items:center;margin-left:auto;font-weight:700;font-size:14px}.card-float{display:flex;justify-content:center}.stage-tip{position:absolute;left:12px;bottom:12px;background:#fffdf7e6;border:2px solid var(--line-soft);color:var(--ink2);font-size:12.5px;font-weight:700;padding:6px 10px;border-radius:10px;pointer-events:none;z-index:2}.quiz-main{gap:16px}.quiz-left{flex:1.15;display:flex;min-width:0}.quiz-left .observe{width:100%}.quiz-right{flex:1;display:flex;flex-direction:column;gap:12px;min-width:400px;overflow-y:auto;max-height:calc(100vh - 92px);padding-bottom:4px}.dir-cards{display:flex;gap:8px;flex-wrap:wrap}.dir-card{padding:10px 16px;border-radius:14px;background:#fff;border:2px solid var(--line);font-weight:800;cursor:pointer;display:flex;gap:7px;align-items:center;font-size:15px;color:var(--ink);transition:box-shadow .15s}.dir-card.active{border-color:var(--primary);box-shadow:0 0 0 3px #ff9f4540}.dir-card.done-ok{background:#e7f5e4;border-color:var(--leaf);color:#4c7c34}.dir-card.done-bad{background:#fde4e2;border-color:#f25c54;color:#b03a34}.dir-mark{font-weight:900}.ask-line{font-size:17px;margin:4px 0 14px}.ask-line b{color:var(--primary-deep)}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.choice-opt{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 14px 14px;border-radius:16px;background:#fffbf2;border:3px solid #f3e2c7;cursor:pointer;position:relative;transition:border-color .15s,transform .15s}.choice-opt:hover{border-color:#ffb25c;transform:translateY(-2px)}.choice-badge{position:absolute;top:8px;left:10px;background:var(--honey);width:26px;height:26px;border-radius:50%;font-weight:900;display:flex;align-items:center;justify-content:center;font-size:14px;color:#7a5a1e}.result-panel{text-align:center}.result-cards{display:flex;gap:16px;align-items:flex-start;justify-content:center}.result-line{font-size:18px;font-weight:800}.result-line.ok{color:var(--ok)}.result-line.bad{color:var(--bad)}.finish{text-align:center}.stars{display:flex;justify-content:center;gap:10px;margin:8px 0}.star{font-size:48px;color:#e8d9bd;display:inline-block;text-shadow:0 3px 0 rgba(140,90,30,.1)}.star.lit{color:#ffb800;animation:star-pop .5s ease-out backwards}@keyframes star-pop{0%{transform:scale(0) rotate(-30deg)}70%{transform:scale(1.35)}to{transform:scale(1)}}.finish-line{font-size:18px;font-weight:800}.finish-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:12px}.reveal-list{margin-top:16px;display:flex;flex-direction:column;gap:10px;text-align:left}.reveal-row{display:flex;align-items:flex-start;gap:12px}.reveal-dir{width:74px;font-weight:800;padding-top:8px}.reveal-dir.ok{color:var(--ok)}.reveal-dir.bad{color:var(--bad)}.center-note{display:flex;align-items:center;justify-content:center;color:var(--ink2);font-weight:700;padding:30px}.review-main .observe{flex:1}.compare-row{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px}.dir-chip{min-width:66px;padding:8px 10px;border-radius:12px;background:#fff3e0;border:2px solid var(--line);font-weight:800;cursor:pointer;color:var(--ink);font-size:14px}.dir-chip.ok{background:#e7f5e4;border-color:var(--leaf);color:#4c7c34}.dir-chip.bad{background:#fde4e2;border-color:#f25c54;color:#b03a34}.tips p{margin:6px 0;font-size:13.5px;color:var(--ink2);line-height:1.6}.count-tip{color:var(--ink2);font-size:14px;margin:0 0 8px}.stepper{display:flex;align-items:center;justify-content:center;gap:14px;margin:10px 0 16px}.step-btn{width:52px;height:52px;border-radius:16px;font-size:26px;font-weight:900;background:#fff3e0;border:2px solid var(--line);cursor:pointer;color:var(--ink);transition:transform .12s}.step-btn:hover{transform:scale(1.08)}.step-num{font-size:40px;font-weight:900;min-width:70px;text-align:center;color:var(--primary-deep);font-variant-numeric:tabular-nums}.count-result{display:flex;flex-direction:column;gap:6px}.count-answer{font-size:15px;line-height:1.7;margin:4px 0 10px}.count-hint{color:#b98a55;font-weight:700;text-align:center;margin:10px 0 0}.given-cards{display:flex;gap:10px;flex-wrap:wrap}.given-card{position:relative;padding:4px;border-radius:14px;border:3px solid transparent;transition:border-color .2s}.given-card.ok{border-color:var(--leaf)}.given-card.bad{border-color:#f25c54}.given-mark{position:absolute;top:-10px;right:-6px;font-size:18px;font-weight:900;background:#fff;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow)}.col-btns{display:flex;flex-direction:column;gap:4px}.restore-warn{color:var(--bad);font-weight:700;font-size:14px;margin:10px 0 0}.restore-note{font-size:14.5px;line-height:1.75}.profile-body{padding:4px 26px 26px;display:flex;flex-direction:column;gap:16px;overflow-y:auto}.stat-cards{display:flex;gap:14px}.stat-card{flex:1;background:#fff;border-radius:18px;padding:16px;display:flex;flex-direction:column;align-items:center;border:2px solid var(--line-soft);box-shadow:var(--shadow)}.stat-num{font-size:34px;font-weight:900;color:var(--primary-deep)}.stat-label{font-size:13px;color:var(--ink2);font-weight:700}.badge-row{display:flex;gap:12px;flex-wrap:wrap}.badge{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;background:#f4ead9;color:#a08a6e;font-weight:700;font-size:13px;filter:grayscale(1);opacity:.55}.badge.got{background:#fff3d6;color:var(--ink);filter:none;opacity:1;border:2px solid var(--honey)}.wrong-list{display:flex;flex-direction:column;gap:8px}.wrong-row{display:flex;align-items:center;gap:10px;background:#fffbf2;padding:10px 12px;border-radius:12px;border:2px solid #f3e2c7}.wrong-info{flex:1;font-size:14px}.album-grid{display:flex;flex-wrap:wrap;gap:14px}.album-item{position:relative}.album-del{position:absolute;top:-6px;right:-6px;width:22px;height:22px;border-radius:50%;border:none;background:#f25c54;color:#fff;cursor:pointer;font-size:11px;display:none;align-items:center;justify-content:center}.album-item:hover .album-del{display:flex}.empty-line{color:var(--ink2);font-weight:600;margin:4px 0}.net-group{margin-bottom:8px}.net-group-title{font-size:12px;font-weight:800;color:var(--ink2);margin:4px 0 5px}.net-chips{display:flex;flex-wrap:wrap;gap:8px}.net-chip{background:#fffbf2;border:2px solid var(--line);border-radius:12px;padding:7px 8px 5px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;transition:border-color .15s,box-shadow .15s,transform .15s}.net-chip:hover{transform:translateY(-1px);border-color:#ffb25c}.net-chip.active{border-color:var(--primary);box-shadow:0 0 0 3px #ff9f4540}.mini-net{display:grid;gap:2px}.mini-cell{width:11px;height:11px;border-radius:3px;background:#f3e7d3}.mini-cell.on{background:linear-gradient(#ffc27a,#ff9f45)}.chip-name{font-size:11px;font-weight:800;color:var(--ink2)}.net-chip.active .chip-name{color:var(--primary-deep)}.mode-seg{margin-left:auto}.mode-seg .seg-btn{padding:8px 14px}.tip-line{margin:6px 0;font-size:13.5px;color:var(--ink2);line-height:1.65}.tip-line b{color:var(--primary-deep)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#5b463673;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:50;animation:fade .2s}@keyframes fade{0%{opacity:0}}.dialog{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--panel);border-radius:24px;padding:24px;width:min(540px,92vw);max-height:86vh;overflow-y:auto;z-index:51;border:3px solid #f6e3c2;box-shadow:0 24px 60px #78461440;animation:dialog-in .25s ease-out}@keyframes dialog-in{0%{transform:translate(-50%,-46%) scale(.96);opacity:0}}.dialog-title{margin:0 0 14px;font-size:23px;font-family:var(--font-fun)}.set-group{margin-bottom:14px}.set-label{font-weight:800;margin-bottom:8px}.radio-row{display:flex;gap:10px;flex-wrap:wrap}.radio-tile{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;border:2px solid var(--line);background:#fffbf2;cursor:pointer;font-weight:700;font-size:14px;color:var(--ink);transition:border-color .15s}.radio-tile[data-state=checked]{border-color:var(--primary);background:#fff3e0;box-shadow:0 0 0 3px #ff9f4533}.radio-dot{width:14px;height:14px;border-radius:50%;border:2px solid #d9be94;display:inline-block}.radio-tile[data-state=checked] .radio-dot{background:var(--primary);border-color:var(--primary-deep);box-shadow:inset 0 0 0 2.5px #fff}.danger-zone{margin:16px 0;padding-top:14px;border-top:2px dashed var(--line)}.slot-list{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}.slot-row{display:flex;align-items:center;gap:10px}.slot-name{font-weight:800;width:58px}.slot-info{flex:1;color:var(--ink2);font-weight:600;font-size:14px}