:root{font-family:Noto Sans SC,Microsoft YaHei,system-ui,sans-serif;color:#252d38;background:#fffaf2;font-synthesis:none;text-rendering:optimizeLegibility;font-weight:400;--ink:#252d38;--muted:#818997;--line:#ece9e2;--orange:#ff9b53;--coral:#f47760;--purple:#7669dc;--green:#73b88f }*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(ellipse at 16% 0%,rgba(255,231,199,.4),transparent 36%),#fffaf2}button,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}.app-shell{min-height:100vh}.topbar{height:76px;padding:0 max(5vw,32px);display:flex;align-items:center;gap:40px;border-bottom:1px solid rgba(228,222,211,.75);background:#fffdf8e0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);position:sticky;top:0;z-index:2}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font-size:18px;white-space:nowrap}.brand b{font-weight:700}.brand-mark{width:32px;height:32px;border-radius:11px;background:linear-gradient(145deg,#ffb55f,#f47e68);display:flex;align-items:center;justify-content:center;gap:2px;transform:rotate(-4deg)}.brand-mark span{width:3px;background:#fff;border-radius:4px}.brand-mark span:nth-child(1){height:8px}.brand-mark span:nth-child(2){height:14px}.brand-mark span:nth-child(3){height:10px}.course-pill{font-size:13px;color:#68707b;border:1px solid #eee6d8;background:#fffdf8;padding:9px 13px;border-radius:999px}.live-dot{display:inline-block;width:7px;height:7px;background:#75bd8c;border-radius:50%;margin-right:7px;box-shadow:0 0 0 4px #e9f5eb}.top-actions{margin-left:auto;display:flex;align-items:center;gap:13px}.demo-chip{font-size:11px;color:#a06a35;background:#fff0da;border-radius:7px;padding:6px 9px;letter-spacing:.04em}.role-switch{display:flex;padding:3px;background:#f3f1ec;border-radius:10px}.role-switch button{border:0;color:#8c9098;background:transparent;padding:8px 12px;border-radius:8px;font-size:12px}.role-switch button.active{color:#443c86;background:#fff;box-shadow:0 2px 8px #262c3810}.teacher-avatar{width:34px;height:34px;border-radius:50%;background:#e9e5fb;color:#6558bb;display:grid;place-items:center;font-weight:700;font-size:13px}.teacher-page{max-width:1320px;margin:auto;padding:48px 34px 64px}.welcome-row{display:flex;justify-content:space-between;align-items:center;margin:0 2px 34px;min-height:190px}.eyebrow,.section-kicker{color:#c87a44;text-transform:uppercase;letter-spacing:.13em;font-size:11px;font-weight:700}.welcome-row h1{font-size:36px;line-height:1.32;letter-spacing:-.045em;margin:12px 0 9px;font-weight:700}.welcome-row h1 span,.child-heading h1 span{color:#e88455}.subtitle{font-size:14px;color:#777f8d;margin:0}.mascot-card{width:235px;height:176px;border-radius:30px;background:linear-gradient(145deg,#ffe5c5,#ffddc0 58%,#f7d9ed);position:relative;overflow:hidden;display:grid;place-items:center;margin-right:50px}.sun-orbit{position:absolute;border:1px solid #fff9;width:160px;height:160px;border-radius:50%}.orbit-one{transform:rotate(25deg) scaleX(1.4)}.orbit-two{transform:rotate(-36deg) scaleX(1.4)}.mascot{width:80px;height:67px;border-radius:45% 45% 46% 46%;background:#ffbd77;position:relative;box-shadow:inset -8px -5px #f2a65f,0 12px 22px #d9784c25;z-index:1}.ear{position:absolute;top:-17px;width:23px;height:37px;background:#ffbd77;border-radius:60% 60% 35% 35%;z-index:-1}.ear.left{left:7px;transform:rotate(-22deg)}.ear.right{right:7px;transform:rotate(22deg)}.eye{position:absolute;top:26px;width:5px;height:7px;background:#594339;border-radius:50%}.left-eye{left:24px}.right-eye{right:24px}.cheek{position:absolute;top:37px;width:11px;height:6px;background:#f18e7c;border-radius:50%;opacity:.8}.left-cheek{left:12px}.right-cheek{right:12px}.smile{position:absolute;width:12px;height:6px;border-bottom:2px solid #765143;border-radius:50%;left:34px;top:39px}.spark{position:absolute;color:#fff;z-index:1}.spark-a{top:28px;left:45px;font-size:19px}.spark-b{right:39px;top:56px;font-size:20px}.mascot-caption{position:absolute;bottom:18px;color:#8f6245;font-size:11px;font-weight:600}.class-layout{display:grid;grid-template-columns:minmax(0,1fr) 332px;gap:20px;align-items:start}.main-column,.side-column{display:flex;flex-direction:column;gap:18px}.card{border:1px solid #eeeae3;background:#fffefa;border-radius:20px;box-shadow:0 8px 26px #44331c09}.stage-card{padding:24px 25px 20px}.section-heading{display:flex;justify-content:space-between;align-items:center}.section-kicker{font-size:10px;color:#a6a19a;letter-spacing:.11em}.section-heading h2{margin:5px 0 0;font-size:19px;letter-spacing:-.03em}.class-meta{font-size:11px;color:#898f99;display:flex;gap:8px;align-items:center}.meta-icon{font-size:16px;color:#a69bdc}.meta-divider{height:12px;width:1px;background:#e9e5de;margin:0 4px}.stage-track{display:grid;grid-template-columns:repeat(4,1fr);padding:26px 7px 24px;position:relative}.stage-track:before{content:"";height:2px;background:#eeeae3;position:absolute;top:40px;left:35px;right:35px}.stage-item{position:relative;display:flex;gap:9px;align-items:center;z-index:1}.stage-marker{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:#f1efe9;color:#99958e;font-size:10px;font-weight:700;border:3px solid #fffefa;box-shadow:0 0 0 1px #eeeae3}.stage-item.current .stage-marker{background:#e88557;color:#fff;box-shadow:0 0 0 3px #ffecde}.stage-item.done .stage-marker{background:#84c49a;color:#fff}.stage-copy{display:flex;flex-direction:column;gap:3px}.stage-copy b{font-size:11px;color:#59616d}.stage-item.current .stage-copy b{color:#d2744e}.stage-copy small{font-size:10px;color:#a4a6aa}.stage-control{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #f0ede7;padding-top:17px}.control-copy{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:10px;row-gap:3px}.control-label{font-size:10px;color:#9ba0a7}.control-copy strong{font-size:12px;color:#4e5662}.control-copy small{grid-column:1/3;font-size:10px;color:#a0a3aa}.control-buttons{display:flex;gap:8px}.button{border:0;border-radius:10px;padding:10px 14px;font-size:11px;font-weight:600;transition:transform .16s,box-shadow .16s}.button:hover:not(:disabled){transform:translateY(-1px)}.button span{margin-left:7px}.button-primary{background:linear-gradient(120deg,#f49e57,#ee795e);color:#fff;box-shadow:0 5px 12px #ec95602b}.button-soft{background:#f5f3ee;color:#6f7580}.seats-card{padding:23px 25px 16px}.count-badge{font-size:10px;font-weight:600;background:#f3f0fb;color:#8174cd;padding:5px 8px;border-radius:999px;vertical-align:2px;margin-left:5px}.text-button{border:0;background:transparent;color:#878d97;font-size:11px}.text-button span{font-size:17px;margin-left:3px;vertical-align:-1px}.seat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin-top:20px}.seat-tile{min-height:113px;padding:10px 9px 9px;border-radius:12px;background:#fff3e7;border:1px solid transparent}.seat-tile.blue{background:#edf5ff}.seat-tile.pink{background:#fff0f1}.seat-tile.mint{background:#eff8ef}.seat-tile.lavender{background:#f3f0ff}.seat-tile.yellow{background:#fff9df}.seat-tile.peach{background:#fff2e7}.seat-top{display:flex;justify-content:space-between;align-items:center;gap:4px}.seat-number{font-size:9px;color:#898783;background:#fffa;padding:3px 5px;border-radius:5px}.seat-state{font-size:8px;color:#8c8a83;white-space:nowrap}.seat-state.ready{color:#559c6b}.seat-state.working{color:#b47e40}.pet-orb{width:37px;height:37px;border-radius:14px;background:#ffffffa8;margin:10px auto 5px;display:grid;place-items:center;color:#e8a15e;font-size:20px}.blue .pet-orb{color:#78a8da}.pink .pet-orb{color:#dc8b9a}.mint .pet-orb{color:#78b48c}.lavender .pet-orb{color:#8a7de0}.yellow .pet-orb{color:#d4b455}.seat-pet{text-align:center;font-size:9px;color:#68707a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.orb-spinner{animation:spin 1.2s linear infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.seats-footer{display:flex;justify-content:space-between;border-top:1px solid #f0ede7;margin-top:14px;padding-top:12px;color:#959aa2;font-size:10px}.seats-footer>span{display:flex;align-items:center;gap:6px}.legend-dot{width:6px;height:6px;border-radius:50%;display:inline-block}.dot-ready{background:#79bd8d}.dot-wait{background:#d5c49c}.reveal-card{padding:18px 18px 14px}.reveal-top{display:flex;align-items:center;justify-content:space-between}.screen-tag{font-size:9px;color:#8377c8;background:#f3f0ff;padding:6px 8px;border-radius:7px}.preview-stage{height:210px;margin:15px 0 13px;border-radius:15px;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 42%,#fff8d9 0,transparent 43%),linear-gradient(150deg,#d9efff,#e7e1ff 55%,#fde3de);display:flex;flex-direction:column;align-items:center;justify-content:center}.preview-stars{position:absolute;top:20px;color:#fff;font-size:12px;letter-spacing:12px}.preview-pet{width:76px;height:68px;border-radius:44% 44% 45% 45%;background:#b5a8f5;display:grid;place-items:center;position:relative;box-shadow:inset -8px -7px #9285dc,0 10px 18px #5e4eb52d}.pet-face{font-size:30px;color:#fff9}.pet-wing{position:absolute;color:#fff;right:-13px;top:-12px}.preview-title{position:absolute;bottom:15px;text-align:center;color:#56617b;font-size:11px;line-height:1.4}.preview-title b{font-size:13px;color:#5d4fa9}.preview-note{position:absolute;bottom:5px;color:#888da0;font-size:8px}.reveal-stats{display:grid;grid-template-columns:1fr 1fr;margin:3px 0 15px}.reveal-stats div{text-align:center;display:flex;flex-direction:column;gap:3px}.reveal-stats div+div{border-left:1px solid #eeebe5}.reveal-stats b{font-size:19px;color:#5e57a6}.reveal-stats b small{font-size:10px;color:#a1a0a8}.reveal-stats span{font-size:9px;color:#9298a2}.reveal-stats .unit{font-size:11px}.button-wide{width:100%;padding:12px}.privacy-note{text-align:center;margin:11px 0 0;color:#9a9ea4;font-size:9px}.privacy-note span{color:#80b88c;margin-right:4px}.tip-card{display:flex;gap:11px;border-radius:15px;background:#fff0da;border:1px solid #fae5c5;padding:14px 15px}.tip-icon{width:28px;height:28px;border-radius:9px;background:#ffd691;color:#b7723f;display:grid;place-items:center;flex:none}.tip-card b{font-size:11px;color:#765637}.tip-card p{font-size:10px;color:#947d64;line-height:1.6;margin:5px 0 0}.small-status{display:flex;align-items:center;gap:10px;background:#fffefa;border:1px solid #eeeae3;border-radius:13px;padding:13px 15px}.status-check{width:25px;height:25px;background:#eaf5ea;color:#63a174;border-radius:50%;display:grid;place-items:center;font-size:12px}.small-status div{display:flex;flex-direction:column;gap:3px}.small-status b{font-size:10px;color:#656e79}.small-status small{font-size:9px;color:#9da2aa}.lock-icon{margin-left:auto;color:#aaa2d6}.child-page{max-width:860px;margin:42px auto 80px;padding:0 24px}.child-header{display:flex;justify-content:space-between;align-items:center;margin:0 8px 18px}.child-step{font-size:12px;color:#8c84c9;font-weight:700}.child-seat{font-size:11px;color:#8b909a}.child-seat b{display:inline-grid;place-items:center;margin-left:6px;width:25px;height:25px;border-radius:8px;background:#eeeafd;color:#7166c6}.child-create-card{background:#fffefa;border:1px solid #eeeae3;box-shadow:0 12px 36px #57432809;border-radius:25px;padding:38px 54px 28px;text-align:center}.child-heading{position:relative}.child-magic{width:40px;height:40px;border-radius:14px;background:#fff1d9;color:#dd9659;display:grid;place-items:center;margin:0 auto 12px;font-size:21px}.child-heading .eyebrow{margin:0}.child-heading h1{font-size:29px;line-height:1.45;letter-spacing:-.04em;margin:9px 0}.child-heading>p:last-child{font-size:12px;color:#8b919b;margin:0 0 25px}.idea-box{text-align:left;border:1px solid #e9e5dc;border-radius:15px;background:#fffefa;padding:14px 16px}.idea-box label{font-size:11px;color:#6f7580;font-weight:700}.idea-box textarea{display:block;width:100%;height:100px;margin-top:8px;border:0;outline:0;resize:vertical;color:#404854;font-size:12px;line-height:1.7}.idea-box textarea::placeholder{color:#b6b8bc}.idea-bottom{display:flex;justify-content:space-between;font-size:9px;color:#a1a5ac}.quick-ideas{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:13px 0 17px;text-align:left}.quick-ideas span{font-size:10px;color:#969ba3}.quick-ideas button{border:1px solid #eee9df;border-radius:999px;padding:6px 10px;background:#fffaf0;color:#85817a;font-size:9px}.child-submit{min-width:220px;padding:13px 17px}.submitted-note{margin:15px auto 0;font-size:11px;color:#648f6d}.submitted-note span{color:#e9a44f;margin-right:5px}.child-safety{border-top:1px solid #f0ede7;margin-top:22px;padding-top:15px;color:#999ea6;font-size:10px}.child-safety span{color:#de9a97;margin-right:5px}.child-demo-note{text-align:center;color:#aaadb2;font-size:10px;margin:17px 0}.seat-tile{width:100%;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:transform .16s,border-color .16s,box-shadow .16s}.seat-tile:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 5px 12px #33333310}.seat-tile:focus-visible{outline:2px solid #7669dc;outline-offset:2px}.seat-tile:disabled{cursor:default;opacity:1}.seat-tile.selected{border-color:#8a7de0;box-shadow:0 0 0 2px #8a7de01c}.demo-action-row{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #f0ede7;margin-top:14px;padding-top:13px;color:#9398a0;font-size:10px}.demo-action-row .button{flex:none}.class-gate-note{max-width:480px;margin:14px auto 0;padding:10px 12px;border-radius:10px;background:#f6f4ef;color:#888e97;font-size:10px;line-height:1.6}.class-gate-note.ready{background:#eff8ef;color:#568562}.idea-box textarea:disabled{background:transparent;color:#9298a2;cursor:not-allowed}.quick-ideas button:disabled{cursor:not-allowed;opacity:.48}@media(max-width:940px){.topbar{gap:16px;padding:0 20px}.course-pill{display:none}.teacher-page{padding:34px 20px}.class-layout{grid-template-columns:minmax(0,1fr) 290px}.welcome-row{margin-bottom:22px}.welcome-row h1{font-size:30px}.mascot-card{margin-right:5px}.stage-card,.seats-card{padding-left:18px;padding-right:18px}.stage-item{gap:5px}.stage-copy b{font-size:10px}.seat-grid{gap:6px}.seat-tile{padding-left:5px;padding-right:5px}.demo-action-row{align-items:flex-start;flex-direction:column}}@media(max-width:720px){.topbar{height:64px;padding:0 14px}.brand{font-size:15px}.brand-mark{width:29px;height:29px}.demo-chip,.teacher-avatar{display:none}.role-switch{margin-left:auto}.teacher-page{padding:28px 14px 42px}.welcome-row{min-height:145px}.welcome-row h1{font-size:26px}.subtitle{max-width:320px;font-size:12px;line-height:1.6}.mascot-card{width:124px;height:122px;border-radius:24px;margin:0}.mascot{transform:scale(.77)}.mascot-caption{font-size:9px;bottom:12px}.class-layout{grid-template-columns:1fr}.side-column{display:grid;grid-template-columns:1fr 1fr;align-items:start}.reveal-card{grid-row:span 2}.preview-stage{height:180px}.stage-track{padding:23px 0;gap:6px}.stage-track:before{left:18px;right:18px}.stage-item{align-items:flex-start;flex-direction:column;gap:4px}.stage-copy{padding-left:3px}.stage-copy b{font-size:9px}.stage-copy small{font-size:8px}.stage-marker{width:26px;height:26px}.stage-control{align-items:flex-end;gap:12px}.control-copy small{max-width:190px;line-height:1.5}.control-buttons{flex-direction:column-reverse;min-width:115px}.button{padding:10px 9px;font-size:10px}.seat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.seat-tile{min-height:100px;padding:9px}.seat-tile .seat-state{white-space:normal;text-align:right}.demo-action-row .button{width:100%}.seat-grid .seat-tile:nth-child(n+7){display:none}.seats-footer{font-size:9px}.child-page{margin:26px auto 54px;padding:0 14px}.child-create-card{padding:30px 18px 22px;border-radius:20px}.child-heading h1{font-size:25px}.child-heading>p:last-child{line-height:1.6}.idea-box textarea{height:115px}.child-submit{width:100%}}@media(max-width:440px){.welcome-row{align-items:flex-start}.mascot-card{width:95px;height:105px}.mascot{transform:scale(.63)}.spark-a{left:16px;top:17px}.spark-b{right:13px;top:28px}.welcome-row h1{font-size:23px}.subtitle{font-size:11px}.section-heading h2{font-size:16px}.class-meta{font-size:9px;gap:4px}.stage-card,.seats-card{padding:17px 13px}.side-column{grid-template-columns:1fr}.reveal-card{grid-row:auto}.tip-card{order:2}.small-status{order:3}.preview-stage{height:200px}.seat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.control-copy small{max-width:155px}.child-header{margin-left:1px;margin-right:1px}}
