:root{--bg-dark: #121214;--panel-bg: #18181c;--card-bg: #1f1f24;--card-border: #323238;--sketch-border: #44444c;--accent-cyan: #00f3ff;--accent-pink: #ff007f;--accent-green: #00ff88;--accent-amber: #ffe600;--accent-purple: #a29bfe;--text-main: #f5f5f7;--text-muted: #a0a0aa;--font-sans: "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-handwritten: "Architects Daughter", "Caveat", cursive;--font-code: "Fira Code", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);background-image:radial-gradient(#2c2c32 1.5px,transparent 1.5px);background-size:24px 24px;color:var(--text-main);font-family:var(--font-sans);min-height:100vh;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.pro-card{border:1.5px solid var(--card-border);border-radius:12px;background:var(--card-bg);box-shadow:0 4px 14px #0006;transition:all .2s ease}.sketch-box{border:2px solid var(--sketch-border);border-radius:14px;background:var(--panel-bg);box-shadow:3px 3px #000;transition:all .2s ease}.handwritten-annotation{font-family:var(--font-handwritten);letter-spacing:.5px;font-size:1.1em;color:var(--accent-cyan)}.sketch-text{font-family:var(--font-handwritten);letter-spacing:.5px}.sketch-sub{font-family:var(--font-handwritten);color:var(--accent-cyan)}.app-container{display:flex;flex-direction:column;height:100vh;overflow:hidden}.top-navbar{height:58px;background:#141418;border-bottom:1.5px solid var(--card-border);display:flex;align-items:center;justify-content:space-between;padding:0 20px;z-index:50;box-shadow:0 2px 10px #0009}.nav-brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px}.mobile-menu-btn{display:none;background:none;border:none;color:var(--accent-cyan);cursor:pointer;padding:4px}.brand-name{color:var(--text-main);font-size:18px;font-weight:800;letter-spacing:-.02em}.nav-divider{color:#44444e}.series-name{color:var(--accent-cyan);font-size:13.5px;font-weight:600}.header-controls{display:flex;align-items:center;gap:10px}.mode-toggle-group{display:flex;background:#1a1a20;padding:3px;border-radius:10px;border:1.5px solid var(--card-border);gap:3px}.mode-btn{background:none;border:none;color:var(--text-muted);padding:5px 12px;border-radius:7px;font-size:12px;font-weight:600;font-family:var(--font-sans);display:flex;align-items:center;gap:6px;cursor:pointer;transition:all .2s ease}.mode-btn.active{background:var(--accent-cyan);color:#121214;font-weight:800;box-shadow:0 2px 8px #00f3ff4d}.view-mode-toggle{display:flex;background:#1a1a20;padding:3px;border-radius:10px;border:1.5px solid var(--card-border);gap:3px}.toggle-btn{background:#1a1a20;border:1.5px solid var(--card-border);color:var(--text-muted);padding:5px 11px;border-radius:8px;font-size:12px;font-weight:600;font-family:var(--font-sans);display:flex;align-items:center;gap:6px;cursor:pointer;transition:all .2s ease}.toggle-btn.active{background:var(--accent-cyan);color:#121214;font-weight:800;border-color:var(--accent-cyan)}.fullscreen-btn{color:var(--text-main)}.fullscreen-btn:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}.obs-mode-btn{border-color:var(--accent-pink);color:#fff}.obs-mode-btn:hover,.obs-mode-btn.active{background:var(--accent-pink);color:#fff;box-shadow:0 0 12px #ff007f80}.floating-studio-controls{position:fixed;top:14px;right:16px;z-index:300;display:flex;align-items:center}.exit-fullscreen-badge{background:#141418e0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#f5f5f7;border:1.5px solid #383842;padding:8px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;box-shadow:0 4px 14px #000c}.exit-fullscreen-badge:hover{background:var(--accent-pink);color:#fff;border-color:var(--accent-pink);transform:scale(1.08)}.fullscreen-quick-mode{display:flex;background:#18181cf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:4px;border-radius:8px;gap:4px;border:1.5px solid var(--card-border)}.quick-mode-btn{background:none;border:none;color:var(--text-muted);padding:5px 12px;border-radius:6px;font-size:12px;font-family:var(--font-sans);font-weight:600;cursor:pointer;display:flex;align-items:center;gap:5px}.quick-mode-btn.active{background:var(--accent-cyan);color:#121214;font-weight:800}.main-content-layout{display:flex;flex:1;height:calc(100vh - 58px);overflow:hidden;position:relative}.sidebar-wrapper{height:100%;z-index:40}.sidebar{width:310px;background:#141418;border-right:1.5px solid var(--card-border);display:flex;flex-direction:column;padding:14px 12px;gap:10px;height:100%}.sidebar-header{display:flex;flex-direction:column;gap:2px}.sidebar-brand-title{font-size:17px;font-weight:800;letter-spacing:-.02em;color:var(--text-main)}.sidebar-brand{display:flex;align-items:center;gap:8px}.sidebar-subtitle{font-size:13px;color:var(--accent-amber)}.search-box{display:flex;align-items:center;gap:8px;background:#1c1c22;padding:7px 11px;border-radius:8px;border:1.5px solid var(--card-border)}.search-box input{background:none;border:none;color:var(--text-main);font-size:13px;font-family:var(--font-sans);width:100%;outline:none}.search-box input::placeholder{color:#71717a}.lessons-list.syllabus-tree{display:flex;flex-direction:column;gap:8px;overflow-y:auto;flex:1;padding-right:2px}.phase-group{display:flex;flex-direction:column;gap:5px}.phase-header-btn{width:100%;background:#1a1a20;border:1.5px solid var(--card-border);border-radius:8px;padding:7px 10px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;text-align:left;transition:all .2s ease}.phase-header-btn:hover{background:#24242c;border-color:var(--accent-cyan)}.phase-title-wrap{display:flex;align-items:center;gap:6px}.phase-title-text{font-size:12.5px;font-weight:700;color:var(--text-main);font-family:var(--font-sans)}.phase-meta{display:flex;align-items:center;gap:6px;color:#71717a}.phase-count-tag{font-size:10px;background:#111114;padding:2px 6px;border-radius:4px;color:var(--accent-cyan);font-family:var(--font-code);font-weight:700}.phase-episodes-container{display:flex;flex-direction:column;gap:4px;padding-left:6px;border-left:2px solid #27272e;margin-left:6px}.lesson-item.episode-item{display:flex;align-items:center;gap:8px;background:#18181e;padding:7px 9px;border-radius:8px;text-align:left;cursor:pointer;border:1.5px solid transparent;transition:all .2s ease}.lesson-item:hover{background:#22222a;border-color:#00f3ff66;transform:translate(2px)}.lesson-item.active{background:#202028;border:1.5px solid var(--accent-cyan);box-shadow:0 0 12px #00f3ff33}.day-tag.ep-tag{background:#272730;color:var(--accent-amber);font-size:10.5px;font-weight:800;font-family:var(--font-code);padding:3px 6px;border-radius:5px;border:1px solid #3c3c46;white-space:nowrap}.lesson-item.active .day-tag.ep-tag{background:var(--accent-pink);color:#fff;border-color:transparent}.lesson-info{display:flex;flex-direction:column;flex:1;overflow:hidden}.lesson-title{font-size:12px;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600;font-family:var(--font-sans)}.episode-sub-meta{display:flex;align-items:center;gap:6px;margin-top:2px}.lesson-cat{font-size:10px;color:var(--text-muted)}.slide-count-pill{font-size:9.5px;background:#111114;color:var(--accent-cyan);padding:1px 5px;border-radius:4px;font-family:var(--font-code)}.arrow-icon{color:#555562}.stage-container.studio-stage-container{flex:1;height:calc(100vh - 58px);padding:12px 18px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;position:relative}.presentation-workspace{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;position:relative}.stage-wrapper.current-slide-stage{display:flex;justify-content:center;align-items:center;flex:1;width:100%;max-height:calc(100% - 50px)}.teaching-slide-frame{position:relative;overflow:hidden;display:flex;flex-direction:column;background:#18181c;background-image:radial-gradient(#292930 1.3px,transparent 1.3px);background-size:20px 20px;border:2px solid #383842;box-shadow:4px 4px #000}.youtube-stage.teaching-slide-frame{width:min(92vw,1080px);height:calc(min(92vw,1080px)*.5625);aspect-ratio:16 / 9;max-height:calc(100vh - 135px);border-radius:20px;padding:18px 24px}.reel-stage.teaching-slide-frame{height:min(80vh,760px);width:calc(min(80vh,760px)*.5625);aspect-ratio:9 / 16;max-width:92vw;border-radius:20px;padding:16px 14px}.drawing-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100;pointer-events:none;cursor:crosshair}.drawing-canvas.active{pointer-events:auto}.slide-inner-viewport{flex:1;display:flex;flex-direction:column;overflow:hidden;z-index:10}.slide-content-layout{display:flex;flex-direction:column;height:100%;justify-content:space-between;gap:12px}.yt-header,.reel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;z-index:10}.brand-badge-large,.brand-badge{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--text-main)}.brand-title-text{font-family:var(--font-sans);letter-spacing:-.01em}.day-badge-large,.day-badge{background:var(--accent-pink);color:#fff;padding:3px 10px;border-radius:8px;font-size:11px;font-weight:800;font-family:var(--font-code);letter-spacing:.5px;border:1.5px solid #000;box-shadow:2px 2px #000}.slide-header-section{display:flex;flex-direction:column;gap:4px}.section-pill{display:inline-block;align-self:flex-start;background:#202026;color:var(--accent-cyan);font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:5px;border:1px solid rgba(0,243,255,.3);font-family:var(--font-code);letter-spacing:.5px}.section-pill-pink{color:var(--accent-pink);border-color:#ff007f66}.slide-heading{font-size:25px;font-weight:800;line-height:1.2;letter-spacing:-.025em;color:#fff}.slide-subheading{font-size:14px;font-weight:500;color:var(--accent-cyan)}.title-slide-layout{display:flex;flex-direction:column;justify-content:space-around;height:100%;padding:6px 0}.hero-header-section{text-align:center;display:flex;flex-direction:column;align-items:center;gap:5px}.hero-badge{display:inline-flex;align-items:center;gap:6px;background:#1e1e24;border:1.5px solid var(--accent-cyan);padding:3px 10px;border-radius:8px;font-size:11px;color:var(--accent-cyan);font-weight:700;font-family:var(--font-code)}.hero-main-title{font-size:34px;font-weight:900;color:#fff;letter-spacing:-.03em;line-height:1.15}.hero-subtitle{font-size:15.5px;font-weight:500;color:var(--accent-amber)}.hero-tagline-pill{display:inline-block;background:#1c1c22;border:1.5px dashed #484852;padding:4px 14px;border-radius:10px;margin-top:4px}.keypoints-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.keypoint-card{padding:12px 14px;background:#1f1f26;display:flex;flex-direction:column;gap:4px}.card-top-tag{font-size:10px;color:var(--accent-cyan);font-family:var(--font-code);font-weight:700;text-transform:uppercase}.keypoint-title{font-size:15px;font-weight:700;color:var(--text-main)}.keypoint-desc{font-size:12px;color:var(--text-muted);line-height:1.35}.comparison-layout{display:flex;flex-direction:column;gap:10px}.comparison-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px;flex:1}.code-compare-card{background:#1a1a20;padding:10px;display:flex;flex-direction:column;gap:6px}.compare-header{display:flex;align-items:center}.lang-tag{font-size:11px;font-weight:700;padding:3px 8px;border-radius:5px;font-family:var(--font-code)}.lang-heavy{background:#381920;color:#ff7675;border:1px solid #ff7675}.lang-python{background:#122c20;color:var(--accent-green);border:1.5px solid var(--accent-green)}.code-snippet-box{font-family:var(--font-code);font-size:12.5px;background:#0f0f12;padding:10px;border-radius:7px;color:#ddd;line-height:1.4;flex:1;overflow-x:auto}.highlight-py-box{border:1.5px solid var(--accent-green);color:#55efc4}.takeaway-banner{display:flex;align-items:center;gap:10px;background:#22222a;padding:8px 14px;border:1.5px solid var(--accent-amber)}.takeaway-text{font-size:1.25em;color:var(--accent-amber);font-weight:700}.features-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:1}.feature-item-card{padding:11px 14px;background:#1f1f26;display:flex;flex-direction:column;gap:3px}.feature-label{font-size:15.5px;font-weight:700}.feature-desc{font-size:12.5px;color:var(--text-muted);line-height:1.35}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;flex:1;align-items:center}.stat-card{background:#1f1f26;padding:14px 10px;text-align:center;display:flex;flex-direction:column;gap:3px}.stat-number{font-size:32px;font-weight:900;color:var(--accent-cyan);letter-spacing:-.03em}.stat-label{font-size:13px;font-weight:700;color:var(--text-main)}.stat-sub{font-size:13px;color:var(--accent-amber)}.domains-container{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;flex:1}.domain-pill-card{padding:9px 12px;background:#1f1f26;display:flex;flex-direction:column;gap:3px}.domain-header{display:flex;align-items:center;gap:8px}.domain-dot{width:9px;height:9px;border-radius:50%}.domain-name{font-size:14px;font-weight:700;color:var(--text-main)}.domain-tools{font-size:11.5px;color:var(--accent-amber);font-family:var(--font-code)}.showcase-grid,.audience-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:1}.project-card,.audience-card{padding:9px 12px;background:#1f1f26;display:flex;gap:10px;align-items:center}.project-num-badge{font-size:17px;font-weight:800;color:var(--accent-pink);font-family:var(--font-code)}.project-title,.audience-role{font-size:14px;color:var(--text-main);font-weight:700}.project-desc,.audience-reason{font-size:12px;color:var(--text-muted);line-height:1.3}.roadmap-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;flex:1;align-items:center}.roadmap-step-card{padding:12px 10px;background:#1f1f26;text-align:center;display:flex;flex-direction:column;align-items:center;gap:5px;position:relative}.step-circle{width:30px;height:30px;border-radius:50%;background:var(--accent-cyan);color:#121214;font-weight:800;display:flex;align-items:center;justify-content:center;font-family:var(--font-code);font-size:12.5px}.step-title{font-size:13px;font-weight:700;color:var(--text-main)}.step-desc{font-size:11px;color:var(--text-muted)}.curriculum-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:1}.module-card{padding:11px 13px;background:#1f1f26;display:flex;flex-direction:column;gap:4px}.module-phase-tag{font-size:11px;color:var(--accent-pink);font-weight:700;font-family:var(--font-code)}.module-focus{font-size:13.5px;font-weight:600;color:var(--text-main)}.next-preview-layout{display:flex;flex-direction:column;gap:10px}.preview-checklist{padding:12px 16px;background:#1f1f26;display:flex;flex-direction:column;gap:8px}.checklist-heading{font-size:14.5px;font-weight:700;color:var(--accent-amber)}.checklist-items{display:flex;flex-direction:column;gap:6px}.check-item{display:flex;align-items:center;gap:8px;font-size:13px;color:#eee}.cta-banner{display:flex;align-items:center;justify-content:center;gap:10px;background:#2b1420;border:1.5px solid var(--accent-pink);color:#fff;padding:9px}.cta-text{font-size:13.5px;font-weight:700}.editor-window{background:#141418;border-radius:12px;border:1.5px solid var(--sketch-border);overflow:hidden;z-index:10;display:flex;flex-direction:column;flex:1}.window-header{background:#1e1e24;padding:7px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1.5px solid #2e2e36}.window-dots{display:flex;gap:6px}.dot{width:9px;height:9px;border-radius:50%}.dot.red{background:#ff5f56}.dot.yellow{background:#ffbd2e}.dot.green{background:#27c93f}.file-name{font-family:var(--font-code);font-size:10.5px;color:#888894}.code-body{padding:10px 12px;font-family:var(--font-code);font-size:12px;line-height:1.5;flex:1;color:var(--text-main);overflow-y:auto}.console{background:#0d0d10;border-top:1.5px solid #2a2a32;padding:7px 12px;font-family:var(--font-code);font-size:11.5px;color:var(--accent-cyan);flex-shrink:0}.console-header{display:flex;align-items:center;gap:6px;font-size:9.5px;text-transform:uppercase;color:#777782;margin-bottom:3px;font-weight:800}.console-text{white-space:pre-wrap;color:#00f3ff;font-weight:600}.reel-analogy-card{padding:10px 12px;margin-bottom:10px;background:#1a1a20}.analogy-header{font-size:12px;color:var(--accent-amber);font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:6px}.memory-boxes{display:flex;gap:8px}.box-item.handwritten-memory-box{flex:1;background:#141418;border:1.5px dashed #4e4e58;border-radius:8px;padding:8px 4px;text-align:center;position:relative}.box-label{position:absolute;top:-8px;left:50%;transform:translate(-50%);background:var(--accent-cyan);color:#121214;font-size:9.5px;font-weight:800;padding:1px 5px;border-radius:4px;border:1px solid #000}.box-content{font-family:var(--font-code);font-size:11.5px;font-weight:700;margin-top:2px}.bottom-nav-container{margin-top:6px;z-index:50}.slide-navigation{display:flex;align-items:center;gap:8px;background:#141418e0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:4px 8px;border-radius:8px;border:1px solid var(--card-border)}.nav-arrow-btn.icon-only{background:#18181e;border:1px solid var(--card-border);color:var(--text-main);padding:4px 7px;border-radius:5px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.nav-arrow-btn.icon-only:hover:not(:disabled){background:var(--accent-cyan);color:#121214;border-color:transparent}.nav-arrow-btn.icon-only:disabled{opacity:.25;cursor:not-allowed}.slide-pips{display:flex;gap:4px}.pip-dot{width:5px;height:5px;border-radius:50%;background:#3a3a44;border:none;cursor:pointer;transition:all .2s ease}.pip-dot.active{background:var(--accent-cyan);width:12px;border-radius:3px}.yt-footer-bar{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-size:11px;color:#71717a}.footer-series-tag{font-weight:500}.reel-footer{text-align:center;font-size:11px;color:var(--text-muted);z-index:10;margin-top:auto}.highlight-yt{color:var(--accent-pink);font-weight:700}.highlight-link{color:var(--accent-cyan);font-weight:700}.whiteboard-stage-container{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.whiteboard-canvas-card{position:relative;overflow:hidden;display:flex;flex-direction:column}.whiteboard-youtube{width:min(92vw,1080px);height:calc(min(92vw,1080px)*.5625);aspect-ratio:16 / 9;max-height:calc(100vh - 120px);border-radius:20px}.whiteboard-reel{height:min(80vh,760px);width:calc(min(80vh,760px)*.5625);aspect-ratio:9 / 16;max-width:92vw;border-radius:20px}.grid-bg{background-color:#16161a;background-image:radial-gradient(#2c2c34 1.5px,transparent 1.5px);background-size:20px 20px}.plain-bg{background-color:#16161a}.whiteboard-header{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background:#1c1c22;border-bottom:1.5px solid var(--card-border);z-index:10;pointer-events:none}.whiteboard-badge{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--accent-amber);font-weight:700}.whiteboard-title{font-family:var(--font-sans)}.whiteboard-mode-indicator{font-size:13px;color:var(--accent-cyan)}.whiteboard-canvas-element{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:5;cursor:crosshair}.whiteboard-floating-toolbar{position:absolute;bottom:12px;left:50%;transform:translate(-50%);z-index:120;background:#18181cf2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:5px 12px;border-radius:12px;border:1.5px solid var(--card-border);box-shadow:0 6px 20px #000c;display:flex;align-items:center;gap:8px}.tool-toggle-group{display:flex;gap:3px}.wb-tool-btn{background:#202028;border:1px solid var(--card-border);color:var(--text-muted);padding:4px 8px;border-radius:6px;font-size:11.5px;font-family:var(--font-sans);font-weight:600;cursor:pointer;display:flex;align-items:center;gap:4px;transition:all .2s ease}.wb-tool-btn.active-pen{background:var(--accent-cyan);color:#121214;border-color:transparent;font-weight:800}.wb-tool-btn.active-eraser{background:var(--accent-pink);color:#fff;border-color:transparent;font-weight:800}.wb-divider{width:1px;height:18px;background:#383842}.wb-color-group{display:flex;align-items:center;gap:5px}.wb-color-dot{width:15px;height:15px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:all .2s ease}.wb-color-dot.selected{border-color:#fff;transform:scale(1.3);box-shadow:0 0 8px currentColor}.wb-size-group{display:flex;gap:2px;background:#17171c;padding:2px;border-radius:5px}.wb-size-btn{background:none;border:none;color:var(--text-muted);font-size:10px;font-family:var(--font-sans);padding:2px 6px;border-radius:3px;cursor:pointer}.wb-size-btn.active{background:#2a2a34;color:var(--accent-cyan);font-weight:800}.wb-actions-group{display:flex;align-items:center;gap:4px}.wb-action-btn{background:#202028;border:1px solid var(--card-border);color:var(--text-muted);padding:4px 6px;border-radius:6px;cursor:pointer;display:flex;align-items:center;gap:4px;font-size:11px;font-family:var(--font-sans)}.wb-action-btn:hover:not(:disabled){background:#2e2e38;color:var(--text-main)}.wb-action-btn:disabled{opacity:.3;cursor:not-allowed}.wb-clear-btn:hover:not(:disabled){background:var(--accent-pink);color:#fff;border-color:var(--accent-pink)}.pen-toolbar{position:absolute;bottom:10px;right:14px;z-index:110;background:#141418e0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:3px 8px;border-radius:20px;border:1px solid var(--card-border);box-shadow:0 4px 14px #000000b3;display:flex;gap:6px;align-items:center}.toolbar-btn.icon-only-btn{background:#18181e;border:1px solid #383842;color:#a0a0aa;padding:3px 5px;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.toolbar-btn.icon-only-btn:hover{background:#282832;color:#fff;border-color:#555562}.toolbar-btn.icon-only-btn.clear-btn:hover{background:var(--accent-pink);color:#fff;border-color:var(--accent-pink)}.color-swatch{width:14px;height:14px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform .2s ease}.color-swatch.selected{border-color:#fff;transform:scale(1.25)}.size-btn{background:none;border:none;color:var(--text-muted);font-size:9.5px;font-family:var(--font-sans);padding:2px 5px;border-radius:3px;cursor:pointer;display:flex;align-items:center;gap:3px}.size-btn.active{background:#2a2a34;color:var(--accent-cyan);font-weight:800}.clear-btn:hover{color:var(--accent-pink)}.app-container.fullscreen-studio-active{background:#0e0e10}.app-container.fullscreen-studio-active .main-content-layout{width:100vw;height:100vh}.app-container.fullscreen-studio-active .stage-container.studio-stage-container{width:100vw;height:100vh;padding:0;margin:0;justify-content:center;align-items:center}.app-container.fullscreen-studio-active .presentation-workspace{width:100vw;height:100vh}.app-container.fullscreen-studio-active .stage-wrapper.current-slide-stage{width:100vw;height:100vh;max-height:100vh}.app-container.fullscreen-studio-active .youtube-stage.teaching-slide-frame{width:100vw!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;border:none!important;border-radius:0!important;box-shadow:none!important;padding:36px 60px 48px}.app-container.fullscreen-studio-active .whiteboard-youtube{width:100vw!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;border:none!important;border-radius:0!important;box-shadow:none!important}.app-container.fullscreen-studio-active .hero-main-title{font-size:46px;line-height:1.15}.app-container.fullscreen-studio-active .hero-subtitle{font-size:20px}.app-container.fullscreen-studio-active .slide-heading{font-size:32px}.app-container.fullscreen-studio-active .slide-subheading{font-size:17px}.app-container.fullscreen-studio-active .keypoint-card{padding:18px 20px}.app-container.fullscreen-studio-active .keypoint-title{font-size:18px}.app-container.fullscreen-studio-active .keypoint-desc{font-size:14px}.app-container.fullscreen-studio-active .feature-item-card{padding:16px 20px}.app-container.fullscreen-studio-active .feature-label{font-size:18px}.app-container.fullscreen-studio-active .feature-desc{font-size:14.5px}.app-container.fullscreen-studio-active .code-body{font-size:14.5px;line-height:1.55}.app-container.fullscreen-studio-active .bottom-nav-container{position:fixed;bottom:14px;left:50%;transform:translate(-50%);z-index:200;opacity:.25;transition:opacity .25s ease}.app-container.fullscreen-studio-active .bottom-nav-container:hover{opacity:1}.app-container.obs-mode-active .bottom-nav-container{opacity:.05;transition:opacity .3s ease}.app-container.obs-mode-active .bottom-nav-container:hover{opacity:1}.shortcuts-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:500;display:flex;align-items:center;justify-content:center;padding:20px}.shortcuts-modal-card{width:min(92vw,540px);background:#18181c;border:1.5px solid var(--card-border);padding:20px;border-radius:14px;display:flex;flex-direction:column;gap:16px;box-shadow:0 10px 40px #000000e6}.shortcuts-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1.5px solid #282830;padding-bottom:10px}.shortcuts-title{display:flex;align-items:center;gap:8px}.shortcuts-title h3{font-size:16px;font-weight:800;color:#fff}.close-modal-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:4px}.close-modal-btn:hover{color:#fff}.shortcuts-grid{display:flex;flex-direction:column;gap:8px}.shortcut-row{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;background:#202026;border-radius:8px;font-size:13px;color:#ddd}.key-badge{background:#2c2c36;color:var(--accent-cyan);border:1px solid #444452;padding:3px 8px;border-radius:5px;font-family:var(--font-code);font-weight:700;font-size:12px;box-shadow:0 2px #111114}@media (max-width: 768px){.app-container{height:100dvh;width:100vw;overflow:hidden}.top-navbar{padding:0 12px;height:50px}.mobile-menu-btn{display:flex}.desktop-only{display:none!important}.nav-divider,.series-name{display:none}.brand-name{font-size:15px}.main-content-layout{height:calc(100dvh - 50px);width:100vw}.stage-container.studio-stage-container{padding:10px 14px 16px;width:100vw;height:calc(100dvh - 50px);display:flex;align-items:center;justify-content:center}.app-container.fullscreen-studio-active .stage-container.studio-stage-container{height:100dvh;width:100vw;padding-top:12vh!important;padding-bottom:23vh!important;padding-right:36px!important;padding-left:16px!important;box-sizing:border-box;display:flex;align-items:center;justify-content:center}.reel-stage.teaching-slide-frame,.youtube-stage.teaching-slide-frame,.app-container.fullscreen-studio-active .youtube-stage.teaching-slide-frame,.app-container.fullscreen-studio-active .reel-stage.teaching-slide-frame{width:calc(100vw - 52px)!important;max-width:340px!important;height:100%!important;max-height:100%!important;border-radius:18px!important;border:1.5px solid var(--card-border)!important;box-shadow:0 12px 36px #000000e6,0 0 20px #00f3ff14!important;padding:10px 12px!important;aspect-ratio:auto!important;margin:auto!important}.drawing-canvas{touch-action:none!important}.sidebar-wrapper{position:fixed;top:50px;left:0;bottom:0;width:290px;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);box-shadow:10px 0 30px #000c;z-index:200}.sidebar-wrapper.mobile-open{transform:translate(0)}.sidebar{width:100%}.app-container.fullscreen-studio-active .hero-main-title,.hero-main-title{font-size:16.5px!important;line-height:1.2!important}.app-container.fullscreen-studio-active .hero-subtitle,.hero-subtitle{font-size:10.5px!important;line-height:1.25!important}.app-container.fullscreen-studio-active .slide-heading,.slide-heading{font-size:15.5px!important;line-height:1.25!important}.app-container.fullscreen-studio-active .slide-subheading,.slide-subheading{font-size:10.5px!important}.app-container.fullscreen-studio-active .keypoint-card,.keypoint-card{padding:4px 7px!important;gap:1px!important}.app-container.fullscreen-studio-active .keypoint-title,.keypoint-title{font-size:11px!important}.app-container.fullscreen-studio-active .keypoint-desc,.keypoint-desc{font-size:9px!important;line-height:1.3!important}.card-top-tag{font-size:8.5px!important}.hero-tagline-pill{padding:2px 6px!important;margin-top:1px!important}.hero-tagline-pill .handwritten-annotation{font-size:.8em!important}.title-slide-layout{gap:2px!important;padding:2px 0!important}.hero-header-section{gap:2px!important}.keypoints-grid{grid-template-columns:1fr;gap:3px!important}.comparison-columns{grid-template-columns:1fr;gap:4px}.code-compare-card{padding:4px 6px}.code-snippet-box{font-size:9.5px;padding:4px 6px}.features-grid{grid-template-columns:1fr;gap:4px}.feature-item-card{padding:4px 7px}.feature-label{font-size:12px}.feature-desc{font-size:9.5px}.stats-grid{grid-template-columns:1fr 1fr;gap:4px}.stat-card{padding:8px 6px}.stat-number{font-size:21px}.stat-label{font-size:11px}.stat-sub{font-size:10.5px}.domains-container{grid-template-columns:1fr;gap:5px}.domain-pill-card{padding:7px 9px}.showcase-grid,.audience-grid{grid-template-columns:1fr;gap:6px}.project-card,.audience-card{padding:7px 9px}.roadmap-steps{grid-template-columns:1fr 1fr;gap:5px}.roadmap-step-card{padding:7px 5px}.curriculum-grid{grid-template-columns:1fr;gap:5px}.module-card{padding:7px 9px}.preview-checklist{padding:8px 10px;gap:5px}.check-item{font-size:11.5px}.bottom-nav-container{position:fixed;bottom:6px;left:50%;transform:translate(-50%);z-index:150}.slide-navigation{padding:3px 8px;gap:6px}.slide-navigation .nav-arrow-btn{display:none!important}}