@import "https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:wght@400;700&family=Nunito:wght@500;700;800;900&display=swap";:root{color:#14213a;font-synthesis:none;text-rendering:optimizelegibility;--ink:#14213a;--purple:#6657e8;--purple-dark:#4f41c7;--mint:#8cffc9;--green:#34c98f;--line:#dfe4ec;--muted:#667089;background:#f5f7fb;font-family:Atkinson Hyperlegible,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}h1,h2,h3,strong,.button{font-family:Nunito,sans-serif}p{line-height:1.55}.center-page{background:radial-gradient(circle at 18% 18%,#e8e4ff 0 8%,#0000 28%),radial-gradient(circle at 82% 76%,#dcfaed 0 8%,#0000 28%),#f5f7fb;place-items:center;min-height:100vh;padding:28px;display:grid}.auth-card{border:1px solid var(--line);background:#fff;border-radius:30px;width:min(460px,100%);overflow:hidden;box-shadow:0 28px 90px #17224229}.auth-brand{color:#fff;background:var(--ink);padding:32px}.auth-brand>svg{color:#12392e;background:var(--mint);border-radius:18px;width:58px;height:58px;padding:13px}.auth-brand h1{margin:7px 0;font-size:34px;line-height:1.05}.auth-brand p:last-child{color:#ffffffb8}.auth-body{padding:28px 32px 32px}.eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--mint);margin:22px 0 0;font:900 12px/1 Nunito}.eyebrow.purple{color:var(--purple-dark);margin:0}.notice{color:#4336b0;background:#f1efff;border-radius:17px;gap:12px;padding:15px;display:flex}.notice svg{flex:none;margin-top:2px}.notice p{margin:0}.google-button{justify-content:center;width:100%;margin-top:20px}.small-center{color:var(--muted);text-align:center;justify-content:center;align-items:center;gap:8px;margin:22px 0 0;font-size:13px;font-weight:700;display:flex}.error-box,.info-message{border-radius:13px;padding:12px 14px;font-weight:700}.error-box{color:#a31b35;background:#fff0f3}.info-message{color:#4336b0;background:#f1efff}.loading-box,.message-card{border:1px solid var(--line);background:#fff;border-radius:20px;align-items:center;gap:12px;padding:20px 24px;font-weight:700;display:flex;box-shadow:0 18px 50px #17224217}.message-card{flex-direction:column;align-items:flex-start;width:min(500px,100%);padding:32px}.message-card h1,.message-card p{margin:0}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.button{border:1px solid #0000;border-radius:13px;justify-content:center;align-items:center;gap:8px;min-height:43px;padding:9px 15px;font-weight:900;text-decoration:none;transition:transform .15s,background .15s,border .15s;display:inline-flex}.button:hover:not(:disabled){transform:translateY(-1px)}.button:disabled{opacity:.55;cursor:wait}.button svg{width:18px;height:18px}.button.primary{color:#fff;background:var(--purple)}.button.primary:hover{background:var(--purple-dark)}.button.secondary{color:var(--ink);border-color:var(--line);background:#fff}.button.green{color:#102a22;background:var(--green)}.button.mint{color:#12392e;background:var(--mint)}.button.full{width:100%}.app-shell{grid-template-columns:280px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{color:#fff;background:#111c33;flex-direction:column;height:100vh;padding:20px 15px;display:flex;position:sticky;top:0}.logo-lockup{align-items:center;gap:12px;padding:4px 7px 20px;display:flex}.logo-lockup>span{color:#12392e;background:var(--mint);border-radius:15px;place-items:center;width:44px;height:44px;display:grid}.logo-lockup div{min-width:0;display:grid}.logo-lockup strong{letter-spacing:.04em;font-size:14px}.logo-lockup small{color:#ffffff94}.sidebar nav{border-top:1px solid #ffffff1a;flex:1;padding-top:14px}.nav-label{letter-spacing:.13em;color:#ffffff73;margin:10px 12px;font:800 11px/1 Nunito}.nav-button{color:#ffffffb8;text-align:left;background:0 0;border:0;border-radius:14px;align-items:center;gap:12px;width:100%;margin:4px 0;padding:13px;font-weight:800;display:flex}.nav-button svg{width:20px}.nav-button:hover,.nav-button.active{color:#fff;background:#ffffff1a}.nav-button.active{box-shadow:inset 3px 0 var(--mint)}.sidebar-profile{background:#ffffff0a;border-top:1px solid #ffffff1a;border-radius:16px;grid-template-columns:40px minmax(0,1fr) 34px;align-items:center;gap:10px;padding:12px;display:grid}.sidebar-profile>span{background:var(--purple);border-radius:12px;place-items:center;width:38px;height:38px;font:900 17px Nunito;display:grid}.sidebar-profile div{min-width:0;display:grid}.sidebar-profile strong,.sidebar-profile small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.sidebar-profile small{color:#ffffff80}.sidebar-profile button,.mobile-header button{color:#ffffffa6;background:0 0;border:0;place-items:center;display:grid}.sidebar-profile button svg{width:18px}.main-content{min-width:0;min-height:100vh}.mobile-header,.mobile-nav{display:none}.page{min-height:100vh;padding:30px clamp(20px,4vw,52px) 50px}.quest-bg{background-image:radial-gradient(#d9def0 1px,#0000 1px);background-size:23px 23px}.page-heading{justify-content:space-between;align-items:flex-end;gap:22px;max-width:1280px;margin:0 auto 26px;display:flex}.page-heading h1{margin:8px 0 4px;font-size:clamp(30px,4vw,44px);line-height:1.05}.page-heading p:last-child{color:var(--muted);margin:0}.pill,.limit-badge{letter-spacing:.14em;color:var(--purple-dark);background:#e9e5ff;border-radius:999px;margin:0;padding:7px 11px;font:900 11px/1 Nunito;display:inline-flex}.progress-card{border:1px solid var(--line);background:#fff;border-radius:18px;flex:none;width:270px;padding:17px 18px;box-shadow:0 10px 28px #17224212}.progress-card div{justify-content:space-between;display:flex}.progress-card progress{width:100%;height:12px;accent-color:var(--purple);margin-top:8px}.mission-card{border:1px solid var(--line);background:#fff;border-radius:26px;max-width:1120px;margin:auto;overflow:hidden;box-shadow:0 20px 60px #222d551a}.mission-card>header{color:#fff;background:var(--ink);justify-content:space-between;align-items:center;padding:20px 25px;display:flex}.mission-card header p{letter-spacing:.17em;color:var(--mint);margin:0;font:900 11px Nunito}.mission-card header h2{margin:4px 0 0}.mission-card header>strong{background:#ffffff1a;border-radius:12px;padding:9px 12px}.lesson-row{border-top:1px solid #edf0f5;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:15px;min-height:82px;padding:14px 21px;display:grid}.lesson-row.current{background:#fbfaff}.lesson-icon{width:45px;height:45px;color:var(--purple-dark);background:#ebe8ff;border-radius:15px;place-items:center;display:grid}.lesson-icon.done{color:#087558;background:#dff9ec}.lesson-icon.locked{color:#7c8598;background:#edf0f4}.lesson-icon svg{width:20px}.lesson-copy{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;display:grid}.lesson-copy small{color:var(--purple);font-weight:900}.lesson-copy p{color:var(--muted);grid-column:1/-1;margin:2px 0 0;font-size:14px}.lesson-state{color:#087558}.workspace-page{max-width:1600px;margin:auto}.workspace-header{border:1px solid var(--line);background:#fff;border-radius:22px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px;padding:15px 18px;display:flex;box-shadow:0 8px 26px #1722420f}.header-title,.header-actions{align-items:center;gap:12px;display:flex}.header-title p{letter-spacing:.14em;color:var(--purple-dark);margin:0;font:900 11px Nunito}.header-title input{width:min(330px,60vw);color:var(--ink);background:0 0;border:0;outline:0;padding:2px 0;font:900 25px Nunito}.icon-button{border:1px solid var(--line);width:43px;height:43px;color:var(--ink);background:#fff;border-radius:13px;place-items:center;display:grid}.save-status{max-width:230px;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;background:#eef1f6;border-radius:999px;padding:9px 12px;font-size:13px;font-weight:700;overflow:hidden}.tabs{border:1px solid var(--line);background:#fff;border-radius:17px;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:17px;padding:7px;display:grid}.tab-button{min-height:48px;color:var(--muted);background:0 0;border:0;border-radius:12px;justify-content:center;align-items:center;gap:8px;font:900 15px Nunito;display:flex}.tab-button.active{color:#fff;background:var(--purple)}.tab-button svg{width:18px}.panel{border:1px solid var(--line);background:#fff;border-radius:24px;padding:24px;box-shadow:0 10px 30px #1722420f}.panel h2,.panel h3{margin-top:0}.two-column,.code-layout,.play-layout{grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:18px;display:grid}.learn-panel h2{margin:8px 0;font-size:31px}.learn-panel>p:not(.eyebrow){max-width:760px;color:var(--muted);font-size:18px}.step-grid{grid-template-columns:repeat(2,1fr);gap:11px;margin:21px 0;display:grid}.step-grid>div{background:#f4f6fa;border-radius:15px;align-items:center;gap:11px;padding:14px;display:flex}.step-grid span{color:#fff;background:var(--purple);border-radius:11px;place-items:center;width:32px;height:32px;font:900 14px Nunito;display:grid}.xp-card{color:#fff;background:var(--ink);border-radius:24px;padding:27px;box-shadow:0 18px 40px #14213a2e}.xp-card>svg{color:#ffd45c;width:42px;height:42px}.xp-card h2{margin-bottom:7px}.xp-card p{color:#ffffffb8}.xp-card>div{background:#ffffff17;border-radius:15px;gap:8px;margin-top:22px;padding:15px;display:grid}.xp-card small{letter-spacing:.14em;color:var(--mint);font:900 11px Nunito}.section-heading{justify-content:space-between;gap:20px;margin-bottom:20px;display:flex}.section-heading h2{margin:7px 0 4px;font-size:28px}.section-heading p:last-child{color:var(--muted);margin:0}.limit-badge{white-space:nowrap;align-self:flex-start}.asset-code-help{color:#4336b0;background:#f1efff;border-radius:14px;flex-wrap:wrap;align-items:center;gap:8px;margin:-4px 0 18px;padding:13px 15px;display:flex}.asset-code-help code{color:#edf3ff;background:#101a2f;border-radius:8px;padding:6px 8px;font-size:12px}.image-mode-tabs{background:#eef1f6;border-radius:15px;grid-template-columns:repeat(2,minmax(0,220px));gap:8px;margin-bottom:20px;padding:6px;display:grid}.image-mode-tabs button{min-height:44px;color:var(--muted);background:0 0;border:0;border-radius:11px;justify-content:center;align-items:center;gap:8px;font:900 14px Nunito;display:flex}.image-mode-tabs button.active{color:#fff;background:var(--purple);box-shadow:0 7px 18px #6657e833}.image-mode-tabs svg{width:18px}.paint-layout{grid-template-columns:minmax(320px,560px) minmax(280px,1fr);gap:20px;display:grid}.paint-canvas-card{min-width:0}.paint-heading{justify-content:space-between;align-items:end;gap:14px;margin-bottom:12px;display:flex}.paint-heading h3{margin:5px 0 0;font-size:23px}.paint-heading select{border:1px solid var(--line);min-height:42px;color:var(--ink);background:#fff;border-radius:11px;padding:8px 11px;font-weight:800}.paint-canvas-card canvas{aspect-ratio:1;border:3px solid var(--ink);width:100%;max-width:560px;image-rendering:pixelated;touch-action:none;cursor:crosshair;background:#fff;border-radius:18px;display:block;box-shadow:inset 0 0 22px #14213a1a}.paint-message{min-height:24px;color:var(--muted);margin:10px 0 0;font-weight:700}.paint-tools{border:1px solid var(--line);background:#f9fafc;border-radius:20px;align-content:start;gap:22px;padding:20px;display:grid}.paint-tools h3{margin:0 0 10px}.paint-tool-row{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.paint-tool-row button{border:1px solid var(--line);min-height:43px;color:var(--ink);background:#fff;border-radius:11px;justify-content:center;align-items:center;gap:6px;font-weight:800;display:flex}.paint-tool-row button.active{color:#fff;border-color:var(--purple);background:var(--purple)}.paint-tool-row svg{width:17px}.paint-colors{flex-wrap:wrap;gap:9px;display:flex}.paint-colors button{width:43px;height:43px;box-shadow:0 0 0 1px var(--line);border:3px solid #fff;border-radius:12px}.paint-colors button.active{box-shadow:0 0 0 3px var(--ink);transform:scale(1.05)}.paint-actions{flex-wrap:wrap;gap:9px;display:flex}.paint-tip{color:#4336b0;background:#f1efff;border-radius:15px;padding:15px}.paint-tip p{margin:5px 0 0}.upload-grid{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.upload-card{cursor:pointer;background:#f9fafc;border:2px dashed #cfd5e3;border-radius:20px;min-width:0;overflow:hidden}.upload-card.has-image{border-style:solid}.upload-card>img,.upload-placeholder{object-fit:contain;background-image:linear-gradient(45deg,#eef1f6 25%,#0000 25%),linear-gradient(-45deg,#eef1f6 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#eef1f6 75%),linear-gradient(-45deg,#0000 75%,#eef1f6 75%);background-position:0 0,0 12px,12px -12px,-12px 0;background-size:24px 24px;width:100%;height:230px}.upload-placeholder{color:var(--purple-dark);align-content:center;place-items:center;gap:9px;display:grid}.upload-placeholder svg{width:38px;height:38px}.upload-card>div{padding:17px}.upload-card p{min-height:44px;color:var(--muted);margin:4px 0 12px}.upload-card input{opacity:0;width:1px;height:1px;position:absolute;overflow:hidden}.code-panel{color:#edf3ff;background:#101a2f;border-radius:24px;overflow:hidden;box-shadow:0 18px 45px #101a2f33}.code-panel header,.code-panel footer{border-color:#ffffff1a;justify-content:space-between;align-items:center;gap:15px;padding:16px 20px;display:flex}.code-panel header{border-bottom:1px solid #ffffff1a}.code-panel footer{border-top:1px solid #ffffff1a}.code-panel header p{letter-spacing:.15em;color:var(--mint);margin:0;font:900 11px Nunito}.code-panel header strong{margin-top:4px;display:block}.code-panel header>span{background:#ffffff14;border-radius:10px;padding:7px 10px;font:12px monospace}.code-panel textarea{resize:vertical;color:#edf3ff;tab-size:4;background:#101a2f;border:0;outline:0;width:100%;min-height:500px;padding:23px;font:15px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;display:block}.code-panel footer p{color:#ffffff94}.help-stack{align-content:start;gap:14px;display:grid}.help-stack p{color:var(--muted)}.yellow-card{color:#6b5410;background:#fff7d8;border-radius:22px;gap:9px;padding:22px;display:grid}.yellow-card code{display:block}.play-layout{grid-template-columns:minmax(0,1fr) 360px}.game-stage{background:radial-gradient(circle at 70% 35%,#263d69,#14213a 70%) 50%/cover;border-radius:24px;min-height:560px;position:relative;overflow:hidden;box-shadow:0 18px 45px #101a2f38}.game-score{color:#fff;background:#09101fd1;justify-content:space-between;align-items:center;height:56px;padding:0 20px;display:flex;position:absolute;inset:0 0 auto}.game-score span{color:var(--mint);font-weight:900}.game-object{place-items:center;width:82px;height:82px;display:grid;position:absolute;transform:translate(-50%,-50%)}.game-object img{object-fit:contain;max-width:100%;max-height:100%;image-rendering:pixelated}.game-object>span{color:#fff;background:var(--purple);border-radius:14px;padding:13px;font-weight:900}.game-object.collectible{width:64px;height:64px}.game-object.collectible>span{color:#6b5410;background:#ffd45c;font-size:30px}.game-controls{grid-template-columns:repeat(4,47px);gap:7px;display:grid;position:absolute;bottom:16px;right:16px}.game-controls button{height:47px;color:var(--ink);background:#ffffffe6;border:0;border-radius:12px;font-weight:900}.platform-stage{background:linear-gradient(#223961 0 65%,#16233d 65%)}.preview-platform{background:#58d291;border-radius:8px;height:23px;position:absolute;box-shadow:inset 0 -7px #14213a38}.preview-platform.ground{border-radius:0;height:62px;bottom:0;left:0;right:0}.preview-platform.one{width:22%;bottom:25%;left:19%}.preview-platform.two{width:19%;bottom:42%;left:48%}.preview-platform.three{width:17%;bottom:58%;right:7%}.platform-controls{grid-template-columns:48px 86px 48px}.grade-panel{max-height:680px;overflow:auto}.score-circle{color:#087558;border:10px solid #dff9ec;border-radius:50%;align-content:center;place-items:center;width:112px;height:112px;margin:16px auto;font:900 36px/1 Nunito;display:grid}.score-circle small{font-size:13px}.grade-list{gap:8px;display:grid}.grade-list>div{border-radius:13px;gap:10px;padding:11px;display:flex}.grade-list .passed{color:#087558;background:#e9fbf3}.grade-list .missing{color:#8b5b00;background:#fff7d8}.grade-list svg{flex:none;width:19px}.grade-list span{gap:2px;display:grid}.grade-list small{color:inherit;opacity:.78}.grade-panel .button{margin-top:15px}.metric-grid{grid-template-columns:repeat(3,1fr);gap:14px;max-width:1280px;margin:0 auto 20px;display:grid}.metric-card{border:1px solid var(--line);background:#fff;border-radius:19px;align-items:center;gap:14px;padding:19px;display:flex;box-shadow:0 10px 28px #1722420f}.metric-card>span{width:46px;height:46px;color:var(--purple-dark);background:#ebe8ff;border-radius:14px;place-items:center;display:grid}.metric-card div{display:grid}.metric-card small{color:var(--muted)}.metric-card strong{font-size:25px}.page>.info-message{max-width:1280px;margin:0 auto 16px}.empty-state{border:1px solid var(--line);text-align:center;background:#fff;border-radius:24px;max-width:1280px;margin:auto;padding:50px}.empty-state>svg{width:42px;height:42px;color:var(--purple)}.review-layout{grid-template-columns:340px minmax(0,1fr);gap:17px;max-width:1280px;margin:auto;display:grid}.project-list,.review-code{border:1px solid var(--line);background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 12px 32px #17224212}.project-list>header{border-bottom:1px solid var(--line);padding:17px;font:900 17px Nunito}.project-list button{text-align:left;background:#fff;border:0;border-top:1px solid #edf0f5;grid-template-columns:minmax(0,1fr) auto;gap:3px 10px;width:100%;padding:15px 17px;display:grid}.project-list button.active,.project-list button:hover{background:#f1efff}.project-list button span{min-width:0;display:grid}.project-list button small{color:var(--muted);text-overflow:ellipsis;overflow:hidden}.project-list button b{color:var(--purple-dark)}.project-list button em{color:#087558;text-transform:uppercase;grid-column:1/-1;font-size:12px;font-style:normal;font-weight:800}.review-code{color:#edf3ff;background:#101a2f}.review-code>header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:17px 20px;display:flex}.review-code header p{letter-spacing:.14em;color:var(--mint);margin:0;font:900 11px Nunito}.review-code header h2{margin:4px 0 0}.review-code header>strong{color:var(--mint);font-size:25px}.review-code pre{min-height:380px;max-height:520px;margin:0;padding:22px;font:14px/1.8 ui-monospace,monospace;overflow:auto}.feedback-box{color:var(--ink);background:#fff;gap:9px;padding:18px;display:grid}.feedback-box label{font-weight:900}.feedback-box textarea{resize:vertical;border:1px solid var(--line);border-radius:12px;min-height:90px;padding:12px}.feedback-box .button{justify-self:end}.account-layout{grid-template-columns:360px minmax(0,1fr);gap:18px;max-width:1280px;margin:auto;display:grid}.account-form h2{align-items:center;gap:9px;display:flex}.account-form label{gap:6px;margin:14px 0;font-weight:800;display:grid}.account-form input,.account-form select{border:1px solid var(--line);width:100%;min-height:44px;color:var(--ink);background:#fff;border-radius:11px;padding:9px 11px}.account-table{padding:0;overflow:hidden}.account-table>header{border-bottom:1px solid var(--line);padding:20px}.account-table h2,.account-table p{margin:0}.account-table p{color:var(--muted);margin-top:4px}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;white-space:nowrap;border-bottom:1px solid #edf0f5;padding:14px 17px}th{color:var(--muted);font-size:13px}.course-message{max-width:1280px;margin:-10px auto 20px}.unit-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:1280px;margin:auto;display:grid}.unit-card{border:1px solid var(--line);background:#fff;border-radius:22px;align-content:start;gap:13px;min-width:0;padding:21px;display:grid;box-shadow:0 11px 30px #17224212}.unit-card.done{background:linear-gradient(145deg,#f4fff9,#fff);border-color:#a9ead0}.unit-card.locked{color:#727b8e;box-shadow:none;background:#f7f8fbe0}.unit-number{color:var(--purple-dark);letter-spacing:.1em;justify-content:space-between;align-items:center;font-size:12px;display:flex}.unit-number>span{width:38px;height:38px;color:var(--purple-dark);background:#ebe8ff;border-radius:13px;place-items:center;display:grid}.unit-card.done .unit-number>span{color:#087558;background:#dff9ec}.unit-card.locked .unit-number>span{color:#7c8598;background:#e8ebf0}.unit-number svg{width:18px}.unit-card h2{min-height:54px;margin:0;font-size:23px;line-height:1.15}.unit-card>p{min-height:72px;color:var(--muted);margin:0}.unit-meta{background:#f5f6fa;border-radius:14px;gap:8px;min-height:100px;padding:12px;display:grid}.unit-meta span{align-items:flex-start;gap:8px;font-size:13px;line-height:1.35;display:flex}.unit-meta svg{width:16px;color:var(--purple);flex:none}.unit-card .button{align-self:end}.check-list,.number-list{gap:9px;margin:12px 0 20px;padding:0;list-style:none;display:grid}.check-list li{align-items:flex-start;gap:9px;display:flex}.check-list svg{color:#087558;flex:none;width:18px}.number-list{padding-left:22px;list-style:decimal}.number-list li{padding-left:5px;line-height:1.5}.assignment-box{border-left:4px solid var(--purple);background:#f1efff;border-radius:0 15px 15px 0;margin:20px 0;padding:17px}.assignment-box p{margin:5px 0 0}.lesson-actions{flex-wrap:wrap;gap:10px;display:flex}.student-video{aspect-ratio:16/9;background:#101a2f;border-radius:18px;margin:20px 0;position:relative;overflow:hidden;box-shadow:0 14px 34px #101a2f26}.student-video iframe,.media-preview iframe{border:0;width:100%;height:100%}.tag-list{flex-wrap:wrap;gap:7px;display:flex}.tag-list span{color:#4336b0;background:#f1efff;border-radius:999px;padding:7px 10px;font-size:13px;font-weight:800}.resource-links{border-top:1px solid var(--line);gap:8px;margin-top:20px;padding-top:16px;display:grid}.resource-links a{color:var(--purple-dark);align-items:center;gap:8px;font-weight:800;display:flex}.resource-links svg{width:17px}.role-badge{color:#087558;background:#e5faef;border-radius:13px;align-items:center;gap:8px;padding:10px 13px;font-weight:900;display:inline-flex}.role-badge.admin{color:#4336b0;background:#ebe8ff}.role-badge svg{width:18px}.guide-layout,.builder-layout{grid-template-columns:300px minmax(0,1fr);gap:18px;max-width:1420px;margin:auto;display:grid}.unit-picker{border:1px solid var(--line);background:#fff;border-radius:20px;align-self:start;overflow:hidden;box-shadow:0 10px 30px #1722420f}.unit-picker>header{color:#fff;background:var(--ink);gap:3px;padding:17px;display:grid}.unit-picker header small{color:#fff9}.unit-picker>button{width:100%;color:var(--ink);text-align:left;background:#fff;border:0;border-top:1px solid #edf0f5;grid-template-columns:35px minmax(0,1fr);align-items:center;gap:9px;padding:11px 13px;display:grid}.unit-picker>button:hover,.unit-picker>button.active{background:#f1efff}.unit-picker>button.active{box-shadow:inset 4px 0 var(--purple)}.unit-picker button>span{width:32px;height:32px;color:var(--purple-dark);background:#ebe8ff;border-radius:10px;place-items:center;font-weight:900;display:grid}.unit-picker button svg{width:16px}.unit-picker button div{gap:2px;min-width:0;display:grid}.unit-picker button strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.unit-picker button small{color:var(--muted);letter-spacing:.09em;font-size:10px;font-weight:900}.guide-content{min-width:0}.guide-heading{border:1px solid var(--line);background:#fff;border-radius:21px;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:16px;padding:21px;display:flex}.guide-heading h2{margin:7px 0 4px;font-size:31px}.guide-heading p:last-child{color:var(--muted);margin:0}.guide-columns{grid-template-columns:minmax(320px,.8fr) minmax(420px,1.2fr);gap:16px;display:grid}.teacher-code{color:#edf3ff;background:#101a2f;border-radius:22px;min-width:0;overflow:hidden;box-shadow:0 16px 38px #101a2f2e}.teacher-code header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;gap:14px;padding:16px 19px;display:flex}.teacher-code header p{color:var(--mint);letter-spacing:.14em;margin:0;font:900 11px Nunito}.teacher-code header span{background:#ffffff14;border-radius:9px;padding:7px 9px;font-size:12px}.teacher-code pre{white-space:pre;min-height:430px;max-height:650px;margin:0;padding:21px;font:14px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;overflow:auto}.teacher-code footer{color:#ffffffa6;border-top:1px solid #ffffff1a;padding:14px 19px}.resource-editor{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px;display:grid}.resource-editor>div,.resource-editor>label:last-of-type{grid-column:1/-1}.resource-editor h3,.resource-editor p{margin:0}.resource-editor p{color:var(--muted);margin-top:4px}.resource-editor label,.builder-field{gap:6px;font-weight:800;display:grid}.resource-editor input,.resource-editor textarea,.builder-field input,.builder-field textarea{border:1px solid var(--line);width:100%;min-height:45px;color:var(--ink);background:#fff;border-radius:11px;padding:11px 12px}.resource-editor textarea{resize:vertical;min-height:90px}.resource-editor .button{justify-self:start}.media-layout{grid-template-columns:300px minmax(0,1fr);gap:18px;max-width:1420px;margin:auto;display:grid}.media-editor{gap:17px;min-width:0;display:grid}.media-editor header h2{margin:7px 0 3px;font-size:30px}.media-editor header p:last-child{color:var(--muted);margin:0}.media-editor label{gap:7px;font-weight:900;display:grid}.media-editor label>span{align-items:center;gap:8px;display:flex}.media-editor label svg{width:18px;color:var(--purple)}.media-editor input,.media-editor textarea{border:1px solid var(--line);width:100%;min-height:48px;color:var(--ink);background:#fff;border-radius:12px;padding:12px 13px}.media-editor textarea{resize:vertical;min-height:105px}.media-preview{aspect-ratio:16/9;background:#101a2f;border-radius:18px;overflow:hidden}.media-placeholder{min-height:240px;color:var(--muted);text-align:center;background:#f7f8fb;border:2px dashed #cfd5e3;border-radius:18px;align-content:center;place-items:center;gap:9px;padding:25px;display:grid}.media-placeholder svg{width:42px;height:42px;color:var(--purple)}.media-editor>footer{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:14px;padding-top:16px;display:flex}.media-editor>footer span{color:var(--muted);font-size:13px}.python-studio{grid-template-columns:minmax(460px,1fr) minmax(430px,1fr);gap:16px;display:grid}.idle-editor,.game-window,.python-console{color:#edf3ff;background:#101a2f;border-radius:22px;min-width:0;overflow:hidden;box-shadow:0 16px 40px #101a2f2e}.idle-editor{grid-template-rows:auto minmax(560px,1fr) auto;display:grid}.idle-editor>header,.idle-editor>footer,.game-window>header,.python-console>header{border-color:#ffffff1c;justify-content:space-between;align-items:center;gap:12px;padding:14px 17px;display:flex}.idle-editor>header,.game-window>header,.python-console>header{border-bottom:1px solid #ffffff1c}.idle-editor>footer{border-top:1px solid #ffffff1c;flex-direction:column;align-items:flex-start}.idle-editor header p{color:var(--mint);letter-spacing:.14em;margin:0;font:900 11px Nunito}.idle-editor header strong{margin-top:3px;display:block}.idle-editor header>span{color:#ffffffb3;background:#ffffff14;border-radius:9px;padding:7px 9px;font:12px ui-monospace,Consolas,monospace}.idle-editor textarea{resize:vertical;color:#edf3ff;tab-size:4;background:#101a2f;border:0;outline:0;width:100%;min-height:560px;padding:22px;font:15px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace}.idle-editor textarea:focus{box-shadow:inset 0 0 0 3px #8cffc959}.idle-editor footer p{color:#fff9;margin:0}.run-controls{flex-wrap:wrap;gap:8px;display:flex}.stop-button{color:#fff;background:#c93652}.dark-secondary{color:#fff;background:#ffffff14;border-color:#fff3}.runtime-stack{align-content:start;gap:16px;min-width:0;display:grid}.game-window>header{justify-content:flex-start;min-height:51px}.game-window>header svg,.python-console>header svg{width:19px;color:var(--mint)}.game-window>header span{color:#ffffff8c;margin-left:auto;font-size:12px}.canvas-wrap{background:#080d18;place-items:center;min-height:390px;padding:12px;display:grid}.canvas-wrap canvas{aspect-ratio:8/5;object-fit:contain;width:100%;max-height:520px;image-rendering:pixelated;background:#101a2f;outline:0;display:block}.python-console>header{justify-content:flex-start;min-height:48px}.python-console>header button{color:#ffffffb3;background:0 0;border:0;align-items:center;gap:5px;margin-left:auto;font-weight:800;display:flex}.python-console>header button svg{width:16px}.console-output{background:#080d18;height:225px;padding:14px 16px;overflow:auto}.console-output pre{white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 6px;font:13px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace}.console-output .system{color:#9ba8c1}.console-output .stdout{color:#dff9ec}.console-output .stderr{color:#ff8ea4}.builder-form{border:1px solid var(--line);background:#fff;border-radius:22px;min-width:0;overflow:hidden;box-shadow:0 12px 34px #17224214}.builder-form>header,.builder-form>footer{justify-content:space-between;align-items:center;gap:18px;padding:20px 23px;display:flex}.builder-form>header{border-bottom:1px solid var(--line)}.builder-form h2{margin:5px 0 0;font-size:28px}.publish-switch{align-items:center;gap:8px;font-weight:900;display:flex}.publish-switch input{width:19px;height:19px;accent-color:var(--purple)}.builder-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;padding:23px;display:grid}.builder-field.wide{grid-column:1/-1}.builder-field span{color:var(--muted);font-size:13px}.builder-field textarea{resize:vertical;min-height:105px;line-height:1.5}.builder-field .builder-code{color:#edf3ff;background:#101a2f;min-height:360px;font:14px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace}.builder-form>footer{border-top:1px solid var(--line);background:#f8f9fb}.builder-form>footer span{color:var(--muted);font-size:13px}@media (max-width:1100px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.mobile-header{z-index:20;color:#fff;background:var(--ink);justify-content:space-between;align-items:center;height:62px;padding:8px 16px;display:flex;position:sticky;top:0}.mobile-header .logo-lockup{padding:0}.mobile-nav{z-index:19;border-bottom:1px solid var(--line);background:#fffffff7;gap:7px;padding:8px 12px;display:flex;position:sticky;top:62px;overflow-x:auto;box-shadow:0 5px 18px #14213a14}.mobile-nav .nav-button{width:auto;min-height:42px;color:var(--muted);background:#f2f4f8;flex:none;margin:0;padding:9px 13px}.mobile-nav .nav-button:hover,.mobile-nav .nav-button.active{color:#fff;background:var(--purple)}.mobile-nav .nav-button.active{box-shadow:none}.two-column,.code-layout,.play-layout,.review-layout,.account-layout,.paint-layout,.guide-layout,.builder-layout,.guide-columns,.python-studio,.media-layout{grid-template-columns:1fr}.unit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.unit-picker{grid-template-columns:repeat(3,minmax(0,1fr));max-height:none;display:grid}.unit-picker>header{grid-column:1/-1}.workspace-header{flex-direction:column;align-items:flex-start}.header-actions{flex-wrap:wrap;width:100%}.upload-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:720px){.page{padding:20px 13px 35px}.page-heading{flex-direction:column;align-items:flex-start}.progress-card{width:100%}.mission-card>header{flex-direction:column;align-items:flex-start}.lesson-row{grid-template-columns:43px minmax(0,1fr)}.lesson-row .button,.lesson-state{grid-column:2;justify-self:start}.tabs{grid-template-columns:repeat(3,1fr)}.tab-button{flex-direction:column;gap:3px;font-size:12px}.step-grid,.upload-grid,.metric-grid,.unit-grid,.builder-grid,.resource-editor{grid-template-columns:1fr}.builder-field.wide,.resource-editor>div,.resource-editor>label:last-of-type{grid-column:auto}.unit-picker{grid-template-columns:1fr}.guide-heading,.builder-form>header,.builder-form>footer,.media-editor>footer{flex-direction:column;align-items:flex-start}.section-heading{flex-direction:column}.image-mode-tabs{grid-template-columns:repeat(2,1fr)}.paint-heading{flex-direction:column;align-items:stretch}.paint-tool-row{grid-template-columns:1fr}.limit-badge{white-space:normal}.code-panel footer{flex-direction:column;align-items:flex-start}.game-stage{min-height:470px}.game-controls{grid-template-columns:repeat(4,42px)}.game-controls button{height:42px}.save-status{order:5;width:100%;max-width:none}.header-title input{width:65vw}.idle-editor{grid-template-rows:auto minmax(430px,1fr) auto}.idle-editor textarea{min-height:430px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation-duration:.01ms!important}}
