:root{--night:#17164a;--deep-night:#0c1037;--cream:#fffaf0;--ink:#292451;--yellow:#ffd95a;--gold:#ffb92e;--pink:#ff6380;--cyan:#42d6e7;--mint:#70e0ad;--paper-shadow:0 18px 45px #090b303d;--cartoon:"Hannotate SC", "STKaiti", "Kaiti SC", "KaiTi", sans-serif;--body:"PingFang SC", "Microsoft YaHei", sans-serif}*{box-sizing:border-box}html{background:var(--deep-night)}body{color:var(--ink);font-family:var(--body);margin:0}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}.magic-shell,.history-page{background:radial-gradient(circle at 14% 10%,#64e0ff3d,#0000 22%),radial-gradient(circle at 88% 19%,#ff80be38,#0000 25%),radial-gradient(circle at 45% 100%,#8b64ff33,#0000 34%),linear-gradient(145deg,#151a55,#11143f 52%,#21194e);min-height:100vh;position:relative;overflow-x:hidden}.sky-noise{pointer-events:none;opacity:.38;background-image:radial-gradient(circle,#fff 1px,#0000 1.5px),radial-gradient(circle,#fffc 1px,#0000 1.5px);background-position:0 0,34px 26px;background-size:74px 74px,103px 103px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 85%);mask-image:linear-gradient(#000,#0000 85%)}.floating-star{color:var(--yellow);z-index:0;font-size:40px;animation:4s ease-in-out infinite starFloat;position:fixed}.star-one{top:14%;left:2.5%}.star-two{animation-delay:-2s;top:30%;right:2%}@keyframes starFloat{50%{opacity:.7;transform:translateY(-12px)rotate(12deg)scale(1.15)}}.topbar{z-index:5;color:#fff;grid-template-columns:1fr auto 1fr;align-items:center;max-width:1540px;height:78px;margin:auto;padding:12px 28px;display:grid;position:relative}.brand{color:#fff;cursor:pointer;text-align:left;background:0 0;border:0;justify-self:start;align-items:center;gap:12px;padding:0;display:flex}.brand-mark{color:#4b2e1b;background:linear-gradient(145deg,#fff07c,#ffb52e);border-radius:16px;place-items:center;width:48px;height:48px;display:grid;transform:rotate(-4deg);box-shadow:0 5px #cf721f,0 0 22px #ffda4f59}.brand b{font-family:var(--cartoon);letter-spacing:1px;font-size:22px;display:block}.brand small{color:#b9c4ff;letter-spacing:3px;margin-top:2px;font-size:12px;display:block}.class-slogan{color:#fff2a3;font-family:var(--cartoon);letter-spacing:1px;align-items:center;gap:9px;font-size:17px;display:flex}.history-link{color:#2f2255;background:#fff7d6;border-radius:18px;justify-self:end;align-items:center;gap:8px;padding:11px 17px;font-weight:800;text-decoration:none;transition:transform .15s;display:flex;box-shadow:0 5px #e8b63e}.history-link:hover{transform:translateY(-2px)}.lesson-steps{z-index:4;grid-template-columns:repeat(7,1fr);gap:8px;max-width:1450px;margin:0 auto 14px;padding:0 28px;display:grid;position:relative}.lesson-steps button{color:#c9cffc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;background:#ffffff14;border:2px solid #ffffff1f;border-radius:17px;justify-content:center;align-items:center;gap:7px;height:58px;font-size:15px;font-weight:800;transition:all .18s;display:flex;position:relative}.lesson-steps button:hover{background:#ffffff24}.lesson-steps button.active{color:#30235c;background:linear-gradient(#fffbe5,#ffe895);border-color:#fff5be;transform:translateY(-3px);box-shadow:0 6px #e9a735,0 8px 22px #ffdc4b40}.step-number{color:#fff;background:#ffffff29;border-radius:50%;place-items:center;width:23px;height:23px;font-size:12px;display:grid}.active .step-number{background:#ff7187}.step-emoji{font-size:19px}.stage-panel{z-index:2;background:var(--cream);width:min(1440px,100% - 56px);min-height:665px;box-shadow:var(--paper-shadow), inset 0 0 0 3px #ffebb3;border:4px solid #fff;border-radius:34px;margin:0 auto;padding:22px 28px 28px;animation:.35s cubic-bezier(.22,.9,.32,1) stageReveal;position:relative}.stage-panel:before,.stage-panel:after{content:"";z-index:-1;background:#ffcf66;border-radius:34px;position:absolute;inset:9px -8px -10px 8px;transform:rotate(.35deg)}.stage-panel:after{z-index:-2;background:#64d6de;inset:-7px 7px 8px -7px;transform:rotate(-.35deg)}@keyframes stageReveal{0%{opacity:0;transform:translateY(12px)scale(.99)}}.stage-heading{border-bottom:2px dashed #e6d7c5;justify-content:space-between;align-items:flex-start;gap:20px;height:72px;display:flex}.stage-heading h1{font:800 29px/1.2 var(--cartoon);letter-spacing:1px;color:#33265d;margin:1px 0 0}.eyebrow{color:#e75270;letter-spacing:1px;font-size:13px;font-weight:800}.teacher-note{color:#534875;background:#fff0ca;border-radius:15px;align-items:center;gap:10px;max-width:500px;min-height:50px;padding:8px 14px;font-size:13px;display:flex}.teacher-note svg{color:#e78320;flex:none}.teacher-note b{color:#b96116;font-size:11px;display:block}.stage-footer{z-index:3;justify-content:space-between;align-items:center;max-width:1440px;margin:14px auto 0;padding:0 8px 22px;display:flex;position:relative}.stage-footer button{color:#fff;cursor:pointer;background:#ffffff1f;border:0;border-radius:14px;align-items:center;gap:6px;padding:10px 15px;display:flex}.stage-footer button:disabled{opacity:.3}.stage-footer div{gap:7px;display:flex}.stage-footer i{background:#ffffff40;border-radius:10px;width:8px;height:8px;transition:all .2s}.stage-footer i.active{background:var(--yellow);width:25px}.site-copyright{z-index:3;color:#d8dcff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);letter-spacing:.5px;background:#080a2d4d;border:1px solid #ffffff26;border-radius:999px;align-items:center;gap:10px;width:fit-content;margin:0 auto 24px;padding:8px 17px;font-size:12px;display:flex;position:relative}.site-copyright>span{color:#ffe77b;font-size:11px}.site-copyright p{align-items:center;gap:9px;margin:0;display:flex}.site-copyright b{color:#fff2b0;font-family:var(--cartoon);font-size:13px}.site-copyright i{border-left:1px solid #ffffff38;padding-left:9px;font-style:normal}.primary-magic-button,.generate-button{color:#fff;min-height:55px;font:800 18px var(--cartoon);letter-spacing:.5px;cursor:pointer;background:linear-gradient(145deg,#ff6d82,#e74070);border:0;border-radius:18px;justify-content:center;align-items:center;gap:10px;padding:0 25px;transition:transform .15s,box-shadow .15s;display:inline-flex;box-shadow:0 7px #b62956,0 12px 20px #d9346533}.primary-magic-button:hover,.generate-button:hover{transform:translateY(-2px);box-shadow:0 9px #b62956,0 14px 24px #d9346538}.primary-magic-button:disabled,.generate-button:disabled{cursor:not-allowed;filter:grayscale(.7);opacity:.45;transform:none;box-shadow:0 5px #8d8290}.speech-label{color:#a84d0e;background:#ffe49a;border-radius:10px 10px 10px 2px;padding:5px 12px;font-size:13px;font-weight:900;display:inline-block}.opening-stage{grid-template-columns:1.05fr .95fr;align-items:center;gap:7%;height:535px;padding:26px 7%;display:grid}.magic-book{filter:drop-shadow(0 28px 20px #37225c40);justify-content:center;align-items:center;height:355px;display:flex;position:relative}.book-page{color:#493567;background:#fff8dc;border:5px solid #67549a;flex-direction:column;align-items:center;width:235px;height:290px;padding:55px 25px 30px;display:flex}.book-page.left-page{border-radius:28px 8px 15px 35px;transform:perspective(500px)rotateY(8deg)rotate(-4deg);box-shadow:inset -20px 0 28px #59487b1f}.book-page.right-page{border-radius:8px 28px 35px 15px;transform:perspective(500px)rotateY(-8deg)rotate(4deg);box-shadow:inset 20px 0 28px #59487b1f}.book-page span{color:#ffb72c;font-size:62px}.book-page b{font:800 37px var(--cartoon)}.book-page small{color:#e65f75;margin-top:15px;font-size:17px;font-weight:900}.book-wand{transform-origin:0 100%;font-size:92px;animation:2.8s ease-in-out infinite wandWave;position:absolute;top:1%;right:5%;transform:rotate(-24deg)}.book-glow{filter:blur(35px);opacity:.65;background:#fff3a5;border-radius:50%;width:320px;height:320px;position:absolute}@keyframes wandWave{45%{transform:rotate(-5deg)translateY(-12px)}}.opening-copy h2{font:800 34px/1.45 var(--cartoon);color:#3f3068;margin:16px 0 13px}.opening-copy p{color:#706683;margin:0 0 27px;font-size:19px;line-height:1.75}.spell-stage{text-align:center;height:535px;padding:36px 5% 15px}.spell-ribbon{grid-template-columns:repeat(4,1fr);align-items:center;gap:36px;display:grid}.spell-ribbon>div{border:4px solid var(--category);height:145px;box-shadow:0 8px 0 color-mix(in srgb, var(--category) 75%, #4c3b4b);background:#fff;border-radius:24px;padding:17px 12px;position:relative}.spell-ribbon>div>span{color:#fff;background:var(--category);border-radius:50%;place-items:center;width:31px;height:31px;font-weight:900;display:grid;position:absolute;top:-14px;left:-12px}.spell-ribbon small{color:var(--category);font-size:16px;font-weight:900;display:block}.spell-ribbon b{font:800 28px var(--cartoon);margin-top:17px;display:block}.ribbon-arrow{color:#c4a8a3;position:absolute;top:55px;right:-40px}.clap-card{background:#fff0bf;border-radius:20px;width:min(700px,90%);margin:40px auto 27px;padding:14px}.clap-card>span{font-size:30px}.clap-card p{color:#8e6a33;margin-left:10px;font-size:15px;display:inline}.clap-card h2{font:800 26px var(--cartoon);color:#dc5472;margin:8px 0 0}.demo-stage{text-align:center;height:535px;padding-top:24px}.demo-cards{justify-content:center;gap:17px;display:flex}.demo-card{background:#fff;border:4px solid #fff;border-radius:18px;width:155px;height:178px;position:relative;overflow:hidden;transform:rotate(-2deg);box-shadow:0 6px #d7c8bd,0 10px 18px #50394124}.demo-card:nth-child(2n){transform:rotate(2deg)translateY(5px)}.demo-card img{object-fit:cover;width:100%;height:100%}.demo-card>span{z-index:2;color:#fff;background:#59497d;border-radius:50%;place-items:center;width:27px;height:27px;font-weight:900;display:grid;position:absolute;top:5px;left:5px}.demo-card>b{display:none}.spell-scroll{color:#5d452a;background:#fff0ba;border:2px solid #e1bc69;border-radius:8px;width:min(780px,90%);margin:25px auto 19px;padding:14px 30px;position:relative;box-shadow:inset 0 0 18px #b4822d1f}.spell-scroll:before,.spell-scroll:after{content:"";background:#bd7d3c;border-radius:12px;width:16px;position:absolute;top:-7px;bottom:-7px}.spell-scroll:before{left:-8px}.spell-scroll:after{right:-8px}.spell-scroll span{color:#d25260;font-size:13px;font-weight:900}.spell-scroll p{font:700 18px/1.5 var(--cartoon);margin:3px 0}.card-stage{grid-template-columns:170px 1fr 292px;gap:18px;height:540px;padding-top:15px;display:grid}.category-tabs{flex-direction:column;gap:10px;display:flex}.category-tabs button{text-align:left;cursor:pointer;background:#f3ede5;border:3px solid #0000;border-radius:17px;flex:1;grid-template-rows:auto auto;grid-template-columns:33px 1fr;align-content:center;column-gap:8px;min-height:0;padding:9px 10px;display:grid}.category-tabs button>span{color:#fff;background:var(--category);border-radius:50%;grid-row:1/3;align-self:center;place-items:center;width:31px;height:31px;font-weight:900;display:grid}.category-tabs button b{font:800 16px var(--cartoon)}.category-tabs button small{color:#8c8293;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.category-tabs button.active{border-color:var(--category);background:color-mix(in srgb, var(--category) 9%, white);box-shadow:0 5px 0 color-mix(in srgb, var(--category) 55%, #8b7f75);transform:translate(5px)}.card-picker{border:3px solid color-mix(in srgb, var(--category) 60%, white);background:color-mix(in srgb, var(--category) 6%, white);border-radius:23px;min-width:0;padding:12px 16px 16px}.picker-title{align-items:center;gap:11px;height:48px;display:flex}.picker-title span{color:#fff;background:var(--category);border-radius:8px;padding:5px 10px;font-size:13px;font-weight:900}.picker-title h2{font:800 20px var(--cartoon);margin:0}.picker-title small{color:#95889a;margin-left:auto}.cards-grid{grid-template-rows:repeat(2,minmax(0,1fr));grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;height:445px;display:none}.cards-grid.active{display:grid}.cards-grid button{cursor:pointer;background:#fff;border:3px solid #0000;border-radius:15px;min-height:0;padding:0;transition:transform .15s,border .15s;position:relative;overflow:hidden;box-shadow:0 4px 8px #362a421f}.cards-grid button:hover{transform:translateY(-3px)rotate(-1deg)}.cards-grid button.selected{border-color:var(--category);box-shadow:0 0 0 3px color-mix(in srgb, var(--category) 25%, white), 0 6px 12px #362a4229}.cards-grid img{object-fit:contain;width:100%;height:100%}.card-check{color:#fff;background:var(--category);border:3px solid #fff;border-radius:50%;place-items:center;width:32px;height:32px;transition:transform .16s cubic-bezier(.2,1.8,.5,1);display:grid;position:absolute;top:6px;right:6px;transform:scale(0)}.selected .card-check{transform:scale(1)}.spell-board{color:#fff;background:linear-gradient(165deg,#3d347a,#29235d);border-radius:22px;min-width:0;padding:15px;box-shadow:inset 0 0 0 2px #ffffff1f,0 8px 18px #29235d40}.board-title{color:#ffeda0;height:30px;font:800 17px var(--cartoon);align-items:center;gap:8px;display:flex}.selected-stack{flex-direction:column;gap:6px;margin:10px 0;display:flex}.selected-stack button{color:#fff;cursor:pointer;text-align:left;background:#ffffff12;border:2px solid #ffffff21;border-radius:13px;grid-template-columns:24px 49px 1fr;align-items:center;gap:5px;height:67px;padding:5px 7px;display:grid}.selected-stack button>span{background:var(--category);border-radius:50%;place-items:center;width:23px;height:23px;font-size:12px;font-weight:900;display:grid}.selected-stack img{object-fit:cover;border-radius:7px;width:46px;height:53px}.selected-stack i{color:#ffffff80;border:2px dashed #ffffff59;border-radius:7px;place-items:center;width:46px;height:53px;font-size:24px;display:grid}.selected-stack small,.selected-stack b{display:block}.selected-stack small{color:#bbb9dd;font-size:11px}.selected-stack b{white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:15px;overflow:hidden}.spoken-spell{color:#fff0ae;height:37px;font:700 13px/1.4 var(--cartoon);text-align:center;margin:6px 1px}.generate-button{width:100%;min-height:48px;font-size:17px;box-shadow:0 5px #b62956}.reset-button{color:#c9c5e9;cursor:pointer;background:0 0;border:0;justify-content:center;gap:5px;width:100%;margin-top:10px;font-size:13px;display:flex}.detective-stage,.modify-stage,.finish-stage{grid-template-columns:minmax(380px,.95fr) minmax(400px,1.05fr);align-items:center;gap:6%;height:535px;padding:20px 3% 0;display:grid}.artwork-frame{aspect-ratio:1;background:#eee8dc;border:12px solid #fff;border-radius:28px;justify-self:end;width:min(495px,100%);position:relative;overflow:hidden;transform:rotate(-1deg);box-shadow:0 12px #f3b83f,0 22px 35px #39264e3d}.artwork-frame:after{content:"✦";color:#ffe46e;text-shadow:0 2px 7px #8f4c31;font-size:30px;position:absolute;top:9px;left:12px}.artwork-frame img{object-fit:cover}.artwork-frame>button{z-index:2;color:#33265d;cursor:pointer;background:#ffffffe6;border:0;border-radius:12px;align-items:center;gap:6px;padding:9px 13px;font-weight:800;display:flex;position:absolute;bottom:13px;right:13px}.frame-label{z-index:2;color:#fff;background:#2e2359d9;border-radius:10px;padding:6px 11px;font-weight:800;position:absolute;bottom:14px;left:14px}.celebration:before{content:"🎉";z-index:3;font-size:52px;position:absolute;top:-7px;right:-3px;transform:rotate(16deg)}.detective-list{max-width:600px}.detective-list h2,.wish-panel h2,.finish-panel h2{font:800 29px var(--cartoon);color:#3e3167;margin:10px 0 3px}.detective-list>p{color:#8c8293;margin:0 0 11px}.detective-list>button:not(.primary-magic-button){cursor:pointer;text-align:left;background:#fff;border:3px solid #e6ded6;border-radius:15px;grid-template-columns:60px 1fr 44px;align-items:center;width:100%;height:69px;margin:7px 0;padding:5px 9px;transition:all .15s;display:grid}.detective-list>button:not(.primary-magic-button).checked{background:#eafff3;border-color:#52c994;transform:translate(4px)}.detective-list img{object-fit:cover;border-radius:8px;width:56px;height:57px}.detective-list small,.detective-list b{display:block}.detective-list small{color:#978c9d}.detective-list b{font-size:18px}.detective-list button>span{color:#b5a9a4;background:#f0eae3;border-radius:50%;place-items:center;width:38px;height:38px;display:grid}.detective-list button.checked>span{color:#fff;background:#42bd83}.detective-list .primary-magic-button{width:100%;margin-top:8px}.wish-panel{background:#fff;border:3px solid #e0d6f2;border-radius:25px;max-width:570px;padding:25px;box-shadow:0 10px 24px #482c641f}.wish-chips{flex-wrap:wrap;gap:8px;margin:17px 0;display:flex}.wish-chips button{color:#9f3e60;cursor:pointer;background:#fff2f4;border:2px solid #edd0d7;border-radius:18px;padding:9px 12px;font-weight:800}.wish-panel label span{color:#71657d;margin-bottom:7px;font-weight:900;display:block}.wish-panel textarea{resize:none;border:3px solid #ded5ec;border-radius:15px;outline:none;width:100%;height:100px;padding:15px;font-size:18px}.wish-panel textarea:focus{border-color:#9c73d2;box-shadow:0 0 0 4px #eee3ff}.wish-panel>small{color:#a097a4;text-align:right;margin:5px 0 14px;display:block}.wish-panel .primary-magic-button{width:100%}.finish-panel{text-align:center;max-width:610px}.trophy{font-size:58px}.title-input{background:#fff;border:3px solid #f0c64c;border-radius:18px;margin:22px 0;padding:5px;display:flex;box-shadow:0 7px #edb73e}.title-input input{min-width:0;font:800 20px var(--cartoon);border:0;outline:0;flex:1;padding:10px 14px}.title-input button{color:#fff;cursor:pointer;background:#e85372;border:0;border-radius:12px;padding:0 18px;font-weight:900}.title-input button:disabled{opacity:.4}.closing-slogan{color:#fff;background:#342a70;border-radius:20px;padding:17px}.closing-slogan span{color:#bdb8e5;font-size:12px;display:block}.closing-slogan b{font:800 25px var(--cartoon);margin-top:6px;display:block}.closing-slogan em{color:#ffe675;font-style:normal}.finish-actions{grid-template-columns:repeat(3,1fr);gap:9px;margin-top:19px;display:grid}.finish-actions a,.finish-actions button{color:#51436d;cursor:pointer;background:#fff;border:2px solid #dfd7e7;border-radius:14px;justify-content:center;align-items:center;gap:6px;height:48px;font-weight:800;text-decoration:none;display:flex}.finish-actions svg{width:18px}.empty-artwork{text-align:center;flex-direction:column;grid-column:1/-1;justify-content:center;align-self:center;align-items:center;height:450px;display:flex}.empty-artwork>div{font-size:70px}.empty-artwork h2{font:800 29px var(--cartoon);margin:10px 0 4px}.empty-artwork p{color:#82778b;margin:0 0 22px}.error-banner{z-index:40;color:#8b2132;background:#fff1f1;border:3px solid #ff9d9d;border-radius:15px;width:min(650px,90vw);padding:14px 45px 14px 18px;font-weight:700;position:fixed;bottom:30px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #3c141e33}.error-banner span{font-weight:900}.error-banner button{cursor:pointer;background:0 0;border:0;position:absolute;top:11px;right:11px}.magic-loading{z-index:100;color:#fff;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0c0a30e6;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.loading-orbit{color:#5a3515;background:radial-gradient(circle,#fff3a1 0 30%,#ffc83e 31% 43%,#0000 44%);border-radius:50%;place-items:center;width:155px;height:155px;animation:1.8s ease-in-out infinite loadingPulse;display:grid;position:relative}.loading-orbit i{background:#80f1ff;border-radius:50%;width:14px;height:14px;animation:2.2s linear infinite orbit;position:absolute;box-shadow:0 0 18px #80f1ff}.loading-orbit i:nth-of-type(2){background:#ff8bab;animation-delay:-.7s}.loading-orbit i:nth-of-type(3){background:#ffe46c;animation-delay:-1.4s}@keyframes orbit{0%{transform:rotate(0)translate(100px)}to{transform:rotate(360deg)translate(100px)}}@keyframes loadingPulse{50%{filter:drop-shadow(0 0 34px #ffdf5780);transform:scale(1.06)}}.magic-loading h2{font:800 30px var(--cartoon);color:#fff1a6;margin:35px 0 8px}.magic-loading p{color:#d6d5f2;margin:0;font-size:17px}.loading-dots{gap:8px;margin-top:24px;display:flex}.loading-dots span{background:#fff;border-radius:50%;width:9px;height:9px;animation:.9s ease-in-out infinite alternate dot}.loading-dots span:nth-child(2){animation-delay:.2s}.loading-dots span:nth-child(3){animation-delay:.4s}@keyframes dot{to{background:var(--yellow);transform:translateY(-9px)}}.lightbox,.history-lightbox{z-index:110;background:#080822;position:fixed;inset:0}.lightbox>img,.history-lightbox>img{object-fit:contain;padding:28px}.lightbox-close{z-index:4;color:#fff;cursor:pointer;background:#282251cc;border:0;border-radius:14px;align-items:center;gap:6px;padding:10px 15px;display:flex;position:absolute;top:20px;right:22px}.lightbox-caption{z-index:3;color:#fff;font:800 19px var(--cartoon);white-space:nowrap;background:#1a1543d9;border-radius:15px;padding:10px 20px;position:absolute;bottom:22px;left:50%;transform:translate(-50%)}.history-page{color:#fff;padding-bottom:60px}.history-header{z-index:2;grid-template-columns:1fr auto 1fr;align-items:center;max-width:1440px;height:112px;margin:auto;padding:18px 30px;display:grid;position:relative}.history-header>a{color:#d8dcff;justify-self:start;align-items:center;gap:7px;font-weight:800;text-decoration:none;display:flex}.history-header>div{align-items:center;gap:13px;display:flex}.history-header>div>span{color:#3d2a5f;background:#ffe776;border-radius:18px;place-items:center;width:58px;height:58px;display:grid;box-shadow:0 6px #e5a839}.history-header p{margin:0}.history-header small,.history-header b{display:block}.history-header small{color:#b8c2fa;letter-spacing:2px}.history-header b{font:800 27px var(--cartoon)}.history-header>i{color:#ffe88a;background:#ffffff1a;border-radius:12px;justify-self:end;padding:8px 13px;font-style:normal}.gallery-grid{z-index:2;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;width:min(1380px,100% - 60px);margin:10px auto;display:grid;position:relative}.gallery-card{color:var(--ink);background:var(--cream);border:4px solid #fff;border-radius:26px;overflow:hidden;box-shadow:0 14px 30px #0504234d}.gallery-image{aspect-ratio:1.25;cursor:pointer;background:#e6ddcf;border:0;width:100%;padding:0;display:block;position:relative;overflow:hidden}.gallery-image img{object-fit:cover;transition:transform .3s}.gallery-image:hover img{transform:scale(1.035)}.gallery-image>span{z-index:2;color:#fff;background:#1f1a44bf;border-radius:10px;align-items:center;gap:5px;padding:7px 10px;font-size:13px;display:flex;position:absolute;bottom:12px;right:12px}.gallery-info{padding:15px 17px 17px}.gallery-info small{color:#e35470;font-weight:900}.gallery-info h2{font:800 20px var(--cartoon);white-space:nowrap;text-overflow:ellipsis;margin:3px 0 9px;overflow:hidden}.gallery-tags{flex-wrap:wrap;gap:5px;min-height:27px;display:flex}.gallery-tags span{color:#615675;background:#eee9f4;border-radius:9px;padding:4px 8px;font-size:12px}.gallery-info time{color:#a0969e;margin:10px 0;font-size:12px;display:block}.gallery-actions{grid-template-columns:1fr 1fr 1fr;gap:6px;display:grid}.gallery-actions button,.gallery-actions a{color:#57496d;cursor:pointer;background:#fff;border:2px solid #dfd6e6;border-radius:11px;justify-content:center;align-items:center;gap:5px;height:38px;font-weight:800;text-decoration:none;display:flex}.gallery-actions svg{width:16px}.gallery-actions .danger{color:#b84459;background:#fff4f5;border-color:#f0cdd3}.history-loading,.history-empty{z-index:2;text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:65vh;display:flex;position:relative}.history-loading svg{width:52px;height:52px;color:var(--yellow);animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.history-empty span{font-size:80px}.history-empty h1{font:800 31px var(--cartoon);margin:12px 0 4px}.history-empty p{color:#c5c9ec}.history-empty a{color:#3b2d59;background:#ffe676;border-radius:14px;gap:7px;margin-top:15px;padding:13px 19px;font-weight:900;text-decoration:none;display:flex}.history-lightbox-info{z-index:3;color:#fff;text-align:center;background:#1d1746e6;border-radius:17px;min-width:400px;padding:12px 15px;position:absolute;bottom:22px;left:50%;transform:translate(-50%)}.history-lightbox-info h2{font:800 21px var(--cartoon);margin:0}.history-lightbox-info p{color:#c8c6e2;margin:3px 0 9px;font-size:13px}.history-lightbox-info a{color:#ffe777;align-items:center;gap:5px;font-weight:900;text-decoration:none;display:inline-flex}.history-lightbox-info svg{width:17px}@media (max-width:1100px){.class-slogan{display:none}.topbar{grid-template-columns:1fr 1fr}.lesson-steps{grid-template-columns:repeat(7,125px);padding-bottom:7px;overflow-x:auto}.stage-panel{width:calc(100% - 34px);padding-left:20px;padding-right:20px}.stage-heading{height:78px}.teacher-note{max-width:390px}.card-stage{grid-template-columns:140px 1fr 260px;gap:10px}.gallery-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:820px){.topbar{padding:10px 17px}.brand b{font-size:18px}.history-link{padding:10px;font-size:0}.lesson-steps{padding:0 17px 7px}.stage-panel{min-height:900px}.teacher-note{display:none}.opening-stage{text-align:center;grid-template-columns:1fr;height:auto;padding:20px}.magic-book{height:350px}.spell-stage{height:auto}.spell-ribbon{grid-template-columns:repeat(2,1fr)}.ribbon-arrow{display:none}.demo-stage{height:auto}.demo-cards{grid-template-columns:repeat(2,155px);display:grid}.card-stage{grid-template-columns:1fr;height:auto}.category-tabs{flex-direction:row}.category-tabs button{height:70px}.card-picker{height:570px}.cards-grid{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(3,1fr);height:490px}.spell-board{grid-template-columns:1fr 1fr;gap:8px;display:grid}.selected-stack{grid-column:1/-1;grid-template-columns:repeat(4,1fr);display:grid}.selected-stack button{grid-template-columns:22px 48px;height:68px}.selected-stack button div{display:none}.board-title,.spoken-spell{align-self:center}.detective-stage,.modify-stage,.finish-stage{grid-template-columns:1fr;gap:35px;height:auto;padding:30px 4%}.artwork-frame{justify-self:center;width:min(500px,86vw)}.detective-list,.wish-panel,.finish-panel{justify-self:center;width:min(600px,100%)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}