.editor-section{flex-wrap:wrap;gap:2rem;margin-bottom:2rem;display:flex}.editor-block{flex-direction:column;flex:350px;min-width:300px;display:flex}.editor-label{color:#1b3c2e;margin-bottom:.5rem;font-size:1.1rem;font-weight:600}html,body,#root{box-sizing:border-box;width:100%;height:100%;margin:0;padding:0}.fullscreen-app{background:#f8fafb;flex-direction:column;width:100vw;height:100vh;display:flex}.main-layout{flex:auto;align-items:stretch;height:calc(100vh - 64px);min-height:0;margin-top:64px;display:flex;overflow:hidden}.main-content-full{flex-direction:column;flex:auto;align-items:stretch;padding:2.5rem 3rem;display:flex;overflow-y:visible}.app-container{background:#f8fafb;border-radius:18px;max-width:900px;margin:2rem auto;font-family:Segoe UI,Roboto,Arial,sans-serif;overflow:hidden;box-shadow:0 4px 24px #0001}.app-header{color:#fff;background:linear-gradient(90deg,#1b3c2e 60%,#3a5c4d 100%);align-items:center;gap:1.5rem;padding:1rem 2rem;display:flex}.hdlab-logo{background:#fff;border-radius:8px;height:48px;padding:4px 8px;box-shadow:0 2px 8px #0002}.app-title{letter-spacing:1px;font-size:2rem;font-weight:600}h2{color:#1b3c2e;margin-top:0}.run-btn{color:#fff;cursor:pointer;background:linear-gradient(90deg,#1b3c2e 60%,#3a5c4d 100%);border:none;border-radius:8px;margin:1.5rem 0 1rem;padding:.7rem 2.2rem;font-size:1.2rem;transition:background .2s,box-shadow .2s;box-shadow:0 2px 8px #0001}.run-btn:disabled{cursor:not-allowed;background:#b2b2b2}.log-output{color:#eee;white-space:pre-wrap;background:#222;border-radius:8px;min-height:120px;max-height:320px;margin-bottom:0;padding:1rem;font-family:Fira Mono,Consolas,monospace;font-size:1rem;overflow-y:auto}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:20s linear infinite logo-spin}}.card{padding:2em}.read-the-docs{color:#888}[data-theme=dark] .fullscreen-app{background:#0f172a}[data-theme=dark] .main-content-full{color:#e5e7eb}[data-theme=dark] .editor-label{color:#cbd5e1}[data-theme=dark] h2,[data-theme=dark] h3,[data-theme=dark] summary{color:#e5e7eb}.waveform-toolbar{background:#f0f4f3;border-bottom:1px solid #d1d5d0;border-radius:8px 8px 0 0;flex-wrap:wrap;align-items:center;gap:1rem;padding:1rem;display:flex}[data-theme=dark] .waveform-toolbar{background:#1e293b;border-bottom-color:#334155}.waveform-toolbar button{cursor:pointer;background:#fff;border:1px solid #cbd5e0;border-radius:6px;align-items:center;gap:.4rem;padding:.5rem 1rem;font-size:.95rem;transition:all .2s;display:flex}[data-theme=dark] .waveform-toolbar button{color:#e2e8f0;background:#334155;border-color:#475569}.waveform-toolbar button:hover{background:#f7fafc;border-color:#a0aec0}[data-theme=dark] .waveform-toolbar button:hover{background:#475569;border-color:#64748b}.waveform-toolbar button:active{transform:scale(.98)}.waveform-toolbar-spacer{flex:1}.waveform-search{background:#fff;border:1px solid #cbd5e0;border-radius:6px;align-items:center;gap:.5rem;padding:.5rem 1rem;display:flex}[data-theme=dark] .waveform-search{background:#334155;border-color:#475569}.waveform-search input{background:0 0;border:none;width:150px;font-size:.95rem}[data-theme=dark] .waveform-search input{color:#e2e8f0}.editor-tabs{background:#e8eee9;border-bottom:2px solid #1b3c2e;border-radius:8px 8px 0 0;gap:0;margin-bottom:1rem;padding:.5rem;display:flex}[data-theme=dark] .editor-tabs{background:#1e293b;border-bottom-color:#64748b}.editor-tab{cursor:pointer;color:#475569;white-space:nowrap;background:0 0;border:none;border-bottom:3px solid #0000;align-items:center;gap:.6rem;padding:.6rem 1.2rem;font-size:.95rem;transition:all .2s;display:flex}[data-theme=dark] .editor-tab{color:#94a3b8}.editor-tab:hover{background:#1b3c2e1a}[data-theme=dark] .editor-tab:hover{background:#64748b33}.editor-tab.active{color:#1b3c2e;background:#fff;border-bottom-color:#1b3c2e}[data-theme=dark] .editor-tab.active{color:#e2e8f0;background:#0f172a;border-bottom-color:#93c5fd}.editor-tab-close{cursor:pointer;opacity:.6;justify-content:center;align-items:center;width:20px;height:20px;transition:opacity .2s;display:flex}.editor-tab-close:hover{opacity:1}.editor-tab-rename-btn{cursor:pointer;opacity:.5;border-radius:3px;justify-content:center;align-items:center;width:18px;height:18px;font-size:.9rem;transition:opacity .2s;display:inline-flex}.editor-tab-rename-btn:hover,.editor-tab-rename-btn:focus-visible{opacity:1}.editor-tab-rename{font:inherit;color:inherit;background:#fff;border:1px solid #3a5c4d;border-radius:3px;padding:0 .25rem}[data-theme=dark] .editor-tab-rename{background:#1e293b;border-color:#93c5fd}.editor-tab-status{align-items:center;font-size:.85rem;font-weight:700;display:inline-flex}.editor-tab-status.finished{color:#16a34a}.editor-tab-status.error{color:#dc2626}.editor-tab-spinner{border:2px solid;border-right-color:#0000;border-radius:50%;width:10px;height:10px;animation:.8s linear infinite editor-tab-spin}@keyframes editor-tab-spin{to{transform:rotate(360deg)}}.editor-tab-add{color:#fff;cursor:pointer;background:#3a5c4d;border:none;border-radius:4px;justify-content:center;align-items:center;margin-left:auto;padding:.6rem .8rem;font-size:1.2rem;transition:background .2s;display:flex}.editor-tab-add:hover{background:#2e4d3a}@media (width<=768px){.main-layout{flex-direction:column;height:auto;overflow:visible}.sidebar{z-index:99;border-radius:0;height:auto;max-height:0;transition:max-height .3s;position:fixed;top:64px;left:0;overflow:hidden;width:100%!important}.sidebar.open{border-bottom:1px solid #d1d5d0;max-height:80vh;box-shadow:0 4px 12px #0002}.main-content-full{margin-top:0;padding:1.5rem 1rem}.editor-section{gap:1rem;margin-bottom:1rem}.editor-block{flex:100%;min-width:100%}.topbar{padding:0 1rem}.topbar-menu{gap:.5rem}.topbar-menu button{padding:.4rem .8rem;font-size:.9rem}.language-picker{gap:.4rem;padding:.4rem .6rem}.waveform-toolbar{gap:.5rem;padding:.8rem}.waveform-toolbar button{padding:.4rem .8rem;font-size:.85rem}.waveform-search input{width:100px}.run-btn{width:100%;margin:1rem 0}.log-output{max-height:200px;font-size:.9rem}.editor-tabs{padding:.3rem}.editor-tab{padding:.5rem .8rem;font-size:.85rem}}@media (width<=480px){.main-content-full{padding:1rem}.editor-label{font-size:1rem}.topbar-title{font-size:1.2rem}.topbar-logo{height:32px}.waveform-toolbar{flex-direction:column;align-items:stretch}.waveform-toolbar button{justify-content:center;width:100%}.waveform-search,.waveform-search input{width:100%}.run-btn{padding:.6rem 1.5rem;font-size:1rem}.editor-tabs{overflow-x:auto}.editor-tab-add{margin-left:auto}}@media (width<=768px){.main-layout{height:auto;min-height:calc(100vh - 64px);margin-top:64px}.main-content-full{box-sizing:border-box;width:100%;padding:1rem}.fullscreen-app{height:auto;min-height:100vh;overflow-x:hidden}.log-output{max-height:200px;font-size:.82rem}.run-btn{width:100%;margin:.75rem 0}.waveform-toolbar{flex-wrap:nowrap;gap:.4rem;padding:.6rem;overflow-x:auto}.waveform-toolbar button{flex-shrink:0;padding:.4rem .7rem;font-size:.82rem}.waveform-search{flex-shrink:0}.waveform-search input{width:90px}.editor-tabs{flex-wrap:nowrap;gap:0;padding:.25rem;overflow-x:auto}.editor-tab{flex-shrink:0;padding:.5rem .7rem;font-size:.82rem}}@media (width<=420px){.main-content-full{padding:.75rem}.topbar-title{display:none}}.editor-block .fullscreen-panel:not(.is-fullscreen){border:1px solid #d1d5db;border-radius:6px;overflow:hidden}.editor-block .fullscreen-panel-title{font-size:1.1rem}[data-theme=dark] .editor-block .fullscreen-panel:not(.is-fullscreen){border-color:#334155}.sidebar{color:#fff;box-sizing:border-box;background:#1b3c2e;flex-direction:column;flex-shrink:0;gap:2rem;width:240px;height:100%;min-height:0;padding:2rem 1rem 1rem;display:flex;overflow-y:auto}.sidebar-section{flex-direction:column;gap:.5rem;display:flex}.sidebar label{margin-bottom:.2rem;font-weight:600}.sidebar select,.sidebar input[type=checkbox]{border:none;border-radius:6px;padding:.3rem;font-size:1rem}.sidebar button{color:#fff;cursor:pointer;background:#3a5c4d;border:none;border-radius:6px;margin-top:.5rem;padding:.5rem 1.2rem;font-size:1rem;transition:background .2s}.sidebar button:hover{background:#2e4d3a}.examples-accordion{flex-direction:column;gap:.45rem;display:flex}.code-examples-toggle{background:#315141;justify-content:space-between;align-items:center;width:100%;margin-top:0;padding:.5rem .7rem;font-size:.92rem;font-weight:700;display:flex}.code-examples-toggle.expanded{background:#2e4d3a}.examples-group{background:#0000001a;border:1px solid #ffffff1f;border-radius:8px;overflow:hidden}.examples-group-toggle{border-radius:0;justify-content:space-between;align-items:center;width:100%;margin:0;padding:.45rem .65rem;font-size:.85rem;font-weight:700;display:flex}.examples-group-toggle.expanded{background:#315141}.examples-group-icon{font-size:.8rem}.examples-list{max-height:180px;margin:0;padding:.35rem;list-style:none;overflow-y:auto}.examples-item{margin-bottom:.3rem}.examples-item:last-child{margin-bottom:0}.examples-item-button{text-align:left;background:#406351;width:100%;margin-top:0;padding:.45rem .65rem;font-size:.9rem}.examples-item-button:hover{background:#365543}@media (width<=768px){.sidebar-backdrop{z-index:149;background:#00000073;display:none;position:fixed;inset:0}.sidebar-backdrop.open{display:block}.sidebar{z-index:150;width:280px;height:calc(100vh - 64px);min-height:0;transition:transform .25s;position:fixed;top:64px;left:0;overflow-y:auto;transform:translate(-100%);box-shadow:4px 0 16px #0000004d}.sidebar.open{transform:translate(0)}}.module-library{background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;padding:16px}.library-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.library-header h3{color:#1f2937;margin:0;font-size:16px}.btn-save-module{color:#fff;cursor:pointer;white-space:nowrap;background:#3b82f6;border:none;border-radius:6px;padding:8px 12px;font-size:12px;font-weight:600;transition:background .2s}.btn-save-module:hover:not(:disabled){background:#2563eb}.btn-save-module:disabled{cursor:not-allowed;opacity:.6;background:#d1d5db}.library-message{color:#065f46;background:#d1fae5;border-left:4px solid #10b981;border-radius:4px;margin-bottom:12px;padding:8px 12px;font-size:12px}.save-module-form{background:#fff;border:1px solid #d1d5db;border-radius:6px;margin-bottom:12px;padding:12px}.form-group input,.form-group textarea{box-sizing:border-box;border:1px solid #d1d5db;border-radius:4px;width:100%;padding:6px;font-family:inherit;font-size:12px}.form-group input:focus,.form-group textarea:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 0 2px #3b82f61a}.form-actions{gap:8px;margin-top:10px;display:flex}.btn-primary,.btn-cancel{cursor:pointer;border:none;border-radius:4px;flex:1;padding:6px 12px;font-size:12px;font-weight:600;transition:background .2s}.btn-primary{color:#fff;background:#10b981}.btn-primary:hover:not(:disabled){background:#059669}.btn-primary:disabled{cursor:not-allowed;opacity:.6;background:#d1d5db}.btn-cancel{color:#374151;background:#e5e7eb}.btn-cancel:hover{background:#d1d5db}.modules-list{flex-direction:column;gap:10px;max-height:400px;display:flex;overflow-y:auto}.module-item{background:#fff;border:1px solid #d1d5db;border-radius:6px;justify-content:space-between;align-items:flex-start;gap:8px;padding:10px;transition:background .2s,box-shadow .2s;display:flex}.module-item:hover{background:#f3f4f6;box-shadow:0 1px 3px #0000001a}.module-info{flex:1}.module-name{color:#1f2937;font-size:13px;font-weight:600}.module-description{color:#666;margin-top:2px;font-size:11px}.module-tags{flex-wrap:wrap;gap:4px;margin-top:4px;display:flex}.tag{color:#1e40af;background:#dbeafe;border-radius:3px;padding:2px 6px;font-size:10px;display:inline-block}.module-meta{color:#999;margin-top:4px;font-size:10px}.module-actions{gap:4px;display:flex}.btn-insert,.btn-delete{cursor:pointer;background:0 0;border:none;padding:4px;font-size:14px;transition:transform .2s}.btn-insert:hover,.btn-delete:hover{transform:scale(1.2)}.empty-state{text-align:center;color:#999;padding:20px;font-size:12px}.loading{text-align:center;color:#666;padding:12px;font-size:12px}.modules-list::-webkit-scrollbar{width:6px}.modules-list::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.modules-list::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.modules-list::-webkit-scrollbar-thumb:hover{background:#94a3b8}:root{--wb-bg:#f8fafb;--wb-panel:#fff;--wb-panel-alt:#f0f4f3;--wb-hover:#e8eee9;--wb-border:#d1d5db;--wb-text:#1f2937;--wb-muted:#6b7280;--wb-accent:#1b3c2e;--wb-accent-strong:#3a5c4d;--wave-bg:#fff;--wave-grid:#e8ecea;--wave-bit:#17825a;--wave-bus:#2563eb;--wave-unknown:#d97706;--wave-cursor:#6b7280;--wave-cursor-pinned:#dc2626;--type-theory:#93c5fd;--type-exercise:#fbbf24;--nav-done:#5dd39e}[data-theme=dark]{--wb-bg:#0f172a;--wb-panel:#111c31;--wb-panel-alt:#1e293b;--wb-hover:#334155;--wb-border:#334155;--wb-text:#e5e7eb;--wb-muted:#94a3b8;--wb-accent:#93c5fd;--wb-accent-strong:#64748b;--wave-bg:#0b1220;--wave-grid:#1c2740;--wave-bit:#5dd39e;--wave-bus:#6cb6ff;--wave-unknown:#f2cc60;--wave-cursor:#94a3b8;--wave-cursor-pinned:#f87171}:root:root button.wb-btn{color:var(--btn-fg,inherit);background-color:var(--btn-bg,transparent);border-color:var(--btn-border,transparent)}.wb-btn:focus-visible{outline:2px solid var(--wb-accent-strong);outline-offset:1px}.workbench{background:var(--wb-bg);min-width:0;min-height:0;color:var(--wb-text);flex-direction:column;flex:1;display:flex}.workbench-top{flex:1;min-height:0;display:flex}.wb-pane{flex-direction:column;min-width:0;min-height:0;display:flex}.wb-pane-scroll{flex:1;overflow-y:auto}.wb-pane-scroll,.dock-panel,.wave-scroll{scrollbar-width:thin;scrollbar-color:var(--wb-border) transparent}.wb-splitter{cursor:col-resize;background:var(--wb-border);flex:0 0 5px;transition:background .15s}.wb-splitter:hover,.wb-resizing-x .wb-splitter{background:var(--wb-accent-strong)}body.wb-resizing{-webkit-user-select:none;user-select:none}body.wb-resizing *{pointer-events:none}body.wb-resizing-x{cursor:col-resize}body.wb-resizing-y{cursor:row-resize}.wb-empty{box-sizing:border-box;text-align:center;height:100%;min-height:60px;color:var(--wb-muted);justify-content:center;align-items:center;padding:12px 20px;font-size:.9rem;display:flex}.wb-icon-btn{--btn-fg:var(--wb-muted);cursor:pointer;border-style:solid;border-width:1px;border-radius:4px;justify-content:center;align-items:center;width:26px;height:26px;padding:0;font-size:.9rem;line-height:1;display:inline-flex}.wb-icon-btn:hover:not(:disabled){--btn-fg:var(--wb-text);--btn-bg:var(--wb-hover)}.wb-icon-btn:disabled{opacity:.35;cursor:default}.wb-modal-backdrop{z-index:1500;background:#0f172a73;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.wb-modal{width:100%;max-width:380px;color:var(--wb-text);background:var(--wb-panel);border:1px solid var(--wb-border);border-radius:8px;flex-direction:column;gap:12px;padding:18px 20px;display:flex;box-shadow:0 12px 32px #00000040}.wb-modal label{font-size:.95rem;font-weight:600}.wb-password-field{gap:6px;display:flex}.wb-password-field input{min-width:0;color:var(--wb-text);background:var(--wb-bg);border:1px solid var(--wb-border);border-radius:6px;flex:1;padding:7px 10px;font-size:.95rem}.wb-password-field input[aria-invalid=true]{border-color:#dc2626}.wb-password-field .wb-icon-btn{--btn-border:var(--wb-border);touch-action:none;-webkit-user-select:none;user-select:none;border-radius:6px;flex-shrink:0;width:36px;height:auto;font-size:1rem}.wb-modal-error{color:#dc2626;font-size:.85rem}[data-theme=dark] .wb-modal-error{color:#fca5a5}.wb-modal-actions{justify-content:flex-end;gap:8px;display:flex}.wb-modal-actions .wb-btn{--btn-fg:var(--wb-text);--btn-border:var(--wb-border);cursor:pointer;border-style:solid;border-width:1px;border-radius:6px;padding:7px 14px;font-size:.9rem;font-weight:600}.wb-modal-actions .wb-btn:hover{--btn-bg:var(--wb-hover)}.wb-modal-actions .wb-modal-primary,.wb-modal-actions .wb-modal-primary:hover{--btn-fg:#fff;--btn-bg:#3b82f6;--btn-border:#3b82f6}.wb-modal-actions .wb-modal-primary:hover{--btn-bg:#2563eb}.dock{background:var(--wb-panel);border-top:1px solid var(--wb-border);flex-direction:column;flex-shrink:0;min-height:0;display:flex;position:relative}.dock-resizer{cursor:row-resize;z-index:3;height:6px;position:absolute;top:-3px;left:0;right:0}.dock-resizer:hover,.wb-resizing-y .dock-resizer{background:var(--wb-accent-strong)}.dock.collapsed .dock-resizer,.dock.collapsed .dock-body{display:none}.dock-header{background:var(--wb-panel-alt);border-bottom:1px solid var(--wb-border);flex-shrink:0;align-items:stretch;gap:4px;min-height:34px;padding:0 8px;display:flex}.dock.collapsed .dock-header{border-bottom:none}.dock-tabs{flex:1;min-width:0;display:flex;overflow-x:auto}.dock-tab{--btn-fg:var(--wb-muted);white-space:nowrap;cursor:pointer;border-style:solid;border-width:0 0 2px;border-radius:0;align-items:center;gap:6px;padding:0 14px;font-size:.85rem;font-weight:500;display:inline-flex}.dock-tab:hover{--btn-fg:var(--wb-text)}.dock-tab.active{--btn-fg:var(--wb-text);--btn-border:var(--wb-accent);font-weight:600}.dock-tab-dot{background:#22c55e;border-radius:50%;width:7px;height:7px}.dock-header-btn{align-self:center}.dock-body{flex:1;min-height:0}.dock-panel{height:100%;overflow:auto}.dock-panel[hidden]{display:none}.dock-run-btn{--btn-fg:#fff;--btn-bg:#1b3c2e;white-space:nowrap;cursor:pointer;border-style:solid;border-width:1px;border-radius:6px;align-self:center;margin-right:8px;padding:5px 14px;font-size:.85rem;font-weight:600}.dock-run-btn:hover:not(:disabled){--btn-bg:#3a5c4d}.dock-run-btn:disabled{--btn-bg:#9ca3af;cursor:not-allowed}[data-theme=dark] .dock-run-btn{--btn-bg:#3a5c4d}[data-theme=dark] .dock-run-btn:hover:not(:disabled){--btn-bg:#4a715f}[data-theme=dark] .dock-run-btn:disabled{--btn-bg:#475569}.dock-output{padding:10px 14px;font-size:.85rem}.dock-output .log-output{min-height:0;max-height:none;margin:0;font-size:.82rem}.dock-output details{margin-top:10px}.dock-output summary{cursor:pointer;color:var(--wb-muted);margin-bottom:6px}.dock-output .validation-result{padding:10px 14px}[data-theme=dark] .validation-result.passed{color:#86efac;background:#10b9811f}[data-theme=dark] .validation-result.failed{color:#fca5a5;background:#ef44441f}[data-theme=dark] .validation-result.validating{color:#fcd34d;background:#f59e0b1f}[data-theme=dark] .validation-errors{background:#00000040}.sidebar.lesson-nav{gap:0;width:300px;padding:0}.lesson-nav-header{border-bottom:1px solid #ffffff1f;flex-shrink:0;padding:14px 14px 10px}.lesson-nav-title-row{justify-content:space-between;align-items:flex-start;gap:8px;display:flex}.lesson-nav-title{font-size:1rem;font-weight:700;line-height:1.3}.lesson-nav .lesson-nav-overview{--btn-fg:#fff;--btn-bg:#3a5c4d;border-radius:4px;flex-shrink:0;margin:0;padding:3px 9px;font-size:.75rem}.lesson-nav .lesson-nav-overview:hover,.lesson-nav .lesson-nav-overview.active{--btn-bg:#4a715f}.lesson-nav-progress{background:#ffffff26;border-radius:2px;height:4px;margin-top:8px;overflow:hidden}.lesson-nav-progress-bar{background:var(--nav-done);height:100%;transition:width .3s}.lesson-nav-legend{color:#ffffffbf;flex-wrap:wrap;gap:4px 12px;margin-top:8px;font-size:.72rem;display:flex}.lesson-nav-legend span{align-items:center;gap:5px;display:inline-flex}.lesson-nav-list{scrollbar-color:#ffffff4d transparent;flex:1;min-height:0;padding:6px 0 16px;overflow-y:auto}.lesson-nav .nav-chapter{--btn-fg:#fff;text-align:left;border-radius:0;align-items:center;gap:6px;width:100%;margin:0;padding:7px 12px 7px 8px;font-size:.85rem;font-weight:600;display:flex}.lesson-nav .nav-chapter:hover{--btn-bg:#ffffff14}.nav-chevron{text-align:center;opacity:.8;flex-shrink:0;width:14px;font-size:.65rem}.nav-chapter-title{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.nav-count{font-variant-numeric:tabular-nums;color:#fff9;flex-shrink:0;font-size:.7rem;font-weight:500}.lesson-nav .nav-lesson{--btn-fg:#ffffffdb;text-align:left;border-left:3px solid #0000;border-radius:0;align-items:flex-start;gap:8px;width:100%;margin:0;padding:5px 12px 5px 28px;font-size:.8rem;font-weight:400;line-height:1.35;display:flex}.lesson-nav .nav-lesson:hover{--btn-bg:#ffffff14}.lesson-nav .nav-lesson.active{--btn-fg:#fff;--btn-bg:#ffffff24;--btn-border:var(--nav-type);font-weight:600}.nav-lesson.type-theory,.nav-type-badge.type-theory{--nav-type:var(--type-theory)}.nav-lesson.type-exercise,.nav-lesson.type-project,.nav-type-badge.type-exercise,.nav-type-badge.type-project{--nav-type:var(--type-exercise)}.nav-type-badge{width:16px;height:16px;color:var(--nav-type);background:color-mix(in srgb, var(--nav-type) 18%, transparent);border:1px solid color-mix(in srgb, var(--nav-type) 55%, transparent);border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;margin-top:1px;font-size:.62rem;font-weight:700;display:inline-flex}.nav-lesson-title{-webkit-line-clamp:2;-webkit-box-orient:vertical;flex:1;min-width:0;display:-webkit-box;overflow:hidden}.nav-lesson.type-exercise .nav-lesson-title,.nav-lesson.type-project .nav-lesson-title{color:var(--type-exercise)}.nav-done{color:var(--nav-done);flex-shrink:0;font-size:.8rem;font-weight:700}.tutorial-container{flex:1;min-width:0;min-height:0;display:flex}.tutorial-container.loading,.tutorial-container.error{min-height:0}.wb-lesson{background:var(--wb-bg);flex:1;display:block}.wb-lesson .tutorial-lesson{max-width:920px;padding:20px 24px 28px}.wb-lesson .lesson-header{flex-wrap:wrap;gap:10px 14px;margin-bottom:18px;padding-bottom:14px}@media (width>=769px){.wb-lesson .lesson-header{z-index:10;background:var(--wb-bg);margin:-20px -24px 18px;padding:14px 24px;position:sticky;top:0}}.wb-lesson .lesson-header h1{flex:260px;font-size:1.5rem;line-height:1.25}.lesson-type-chip{white-space:nowrap;border-radius:999px;flex-shrink:0;padding:3px 10px;font-size:.75rem;font-weight:700}.lesson-type-chip.type-theory{color:#1e40af;background:#dbeafe}.lesson-type-chip.type-exercise,.lesson-type-chip.type-project{color:#92400e;background:#fef3c7}[data-theme=dark] .lesson-type-chip.type-theory{color:#bfdbfe;background:#3b82f638}[data-theme=dark] .lesson-type-chip.type-exercise,[data-theme=dark] .lesson-type-chip.type-project{color:#fde68a;background:#f59e0b33}.lesson-header-nav{flex-shrink:0;gap:6px;display:flex}.lesson-header-nav .wb-icon-btn{--btn-fg:var(--wb-text);--btn-bg:var(--wb-panel);--btn-border:var(--wb-border);width:32px;height:30px;font-size:1rem}.wb-lesson .lesson-navigation{margin-top:28px}.wb-lesson .explanation-text :is(h1,h2,h3,h4,h5,h6){scroll-margin-top:76px}.hint-section{--hint-accent:#d97706;flex-direction:column;gap:10px;display:flex}[data-theme=dark] .hint-section{--hint-accent:#fbbf24}.hint-card{background:color-mix(in srgb, var(--hint-accent) 10%, var(--wb-panel));border-left:4px solid var(--hint-accent);border-radius:4px;padding:10px 14px}.hint-card>:last-child{margin-bottom:0}.hint-card-label{color:var(--hint-accent);margin-bottom:4px;font-size:.78rem;font-weight:700}.hint-actions{flex-wrap:wrap;gap:8px;display:flex}.hint-actions .wb-btn{--btn-fg:var(--wb-text);--btn-bg:var(--wb-panel);--btn-border:var(--wb-border);cursor:pointer;border-style:solid;border-width:1px;border-radius:6px;padding:7px 14px;font-size:.9rem;font-weight:600}.hint-actions .btn-hint{--btn-border:var(--hint-accent)}.hint-actions .wb-btn:hover{--btn-bg:var(--wb-hover)}.hint-actions .btn-hint-hide{--btn-fg:var(--wb-muted);font-weight:500}.wb-lesson .explanation-text img{max-width:100%;height:auto}.wb-lesson .explanation-text table{max-width:100%;display:block;overflow-x:auto}.wb-editor{background:var(--wb-panel);flex-shrink:0}.wb-editor .fullscreen-panel:not(.is-fullscreen){flex:1;min-height:0}.wb-editor-actions{align-items:center;gap:8px;display:flex}.wb-editor-actions .lesson-last-saved,.wb-editor-actions .lesson-loading-indicator{white-space:nowrap;margin-left:0}.wb-editor-actions .btn-reset{padding:3px 10px;font-size:.8rem}.wb-editor-extras{border-top:1px solid var(--wb-border);flex-direction:column;flex-shrink:0;gap:8px;max-height:60%;padding:8px 10px;display:flex;overflow-y:auto}.wb-editor-extras .editor-container{flex-shrink:0}.wb-editor-footer .btn-testbench-toggle,.wb-editor-footer .btn-solution-toggle{border-radius:6px;align-self:auto;padding:7px 14px;font-size:.9rem}.wb-editor-footer{background:var(--wb-panel-alt);border-top:1px solid var(--wb-border);flex-wrap:wrap;flex-shrink:0;align-items:center;gap:8px;padding:8px 10px;display:flex}.wb-editor-footer .btn-save,.wb-editor-footer .btn-submit{padding:7px 14px;font-size:.9rem}.wb-editor-footer .btn-submit{--btn-fg:#fff;--btn-bg:#10b981;box-shadow:0 0 0 2px #10b9814d}.wb-editor-footer .btn-submit:hover:not(:disabled){--btn-bg:#059669}.wb-editor-footer .btn-submit:disabled{--btn-bg:#9ca3af;box-shadow:none;opacity:1}[data-theme=dark] .wb-editor-footer .btn-submit:disabled{--btn-bg:#475569}.wb-status-chip{white-space:nowrap;border-radius:999px;margin-left:auto;padding:4px 12px;font-size:.82rem;font-weight:600}.wb-status-chip.passed{color:#166534;background:#dcfce7}.wb-status-chip.failed{color:#991b1b;background:#fee2e2}.wb-status-chip.validating{color:#92400e;background:#fef3c7}.home-main{flex-direction:column;flex:1;min-height:0;padding:10px 14px 12px;display:flex}.home-main .editor-tabs{flex-shrink:0;margin-bottom:10px}.home-main .editor-section{flex-wrap:nowrap;flex:1;gap:12px;min-height:0;margin-bottom:0}.home-main .editor-block{flex:1 1 0;min-width:0;min-height:0}.home-main .editor-block .fullscreen-panel:not(.is-fullscreen){flex:1;min-height:0}.home-main .editor-section.has-split{gap:0}.home-main .editor-section.has-split .code-block{flex:var(--code-grow,1) 1 0}.home-main .editor-section.has-split .testbench-block{flex:var(--testbench-grow,1) 1 0}.editor-splitter{cursor:col-resize;flex:0 0 12px;position:relative}.editor-splitter:after{content:"";background:var(--wb-muted);opacity:.45;border-radius:2px;width:4px;height:40px;transition:background .15s,opacity .15s,top .15s,height .15s;position:absolute;top:calc(50% - 20px);left:4px}.editor-splitter:hover:after,.wb-resizing-x .editor-splitter:after{background:var(--wb-accent-strong);opacity:1;height:100%;top:0}@media (width<=768px){.workbench{min-height:auto}.workbench-top{flex-direction:column;flex:none}.wb-pane-scroll{overflow-y:visible}.wb-splitter{display:none}.wb-editor{border-top:1px solid var(--wb-border);height:460px;width:auto!important}.wb-lesson .tutorial-lesson{padding:14px 12px 20px}.wb-lesson .lesson-header h1{flex:none}.dock:not(.collapsed){height:320px!important}.home-main{flex:none;padding:8px}.home-main .editor-section{flex-direction:column;flex:none}.home-main .editor-block,.home-main .editor-section.has-split .editor-block{flex:none;height:380px}.home-main .editor-section.has-split{gap:12px}.editor-splitter{display:none}}.dock.is-fullscreen{z-index:2000;border-top:none;position:fixed;inset:0;height:auto!important}.dock.is-fullscreen .dock-resizer{display:none}.notes-drawer{--notes-accent:#3a5c4d;--notes-code-bg:#f3f4f6;--notes-inline-code:#b45309;--notes-mark-yellow:#fde68a;--notes-mark-green:#bbf7d0;--notes-mark-blue:#bfdbfe;--notes-mark-pink:#fbcfe8;z-index:150;box-sizing:border-box;background:var(--wb-panel);max-width:calc(100vw - 40px);height:calc(100vh - 64px);color:var(--wb-text);flex-direction:column;animation:.22s notesSlideIn;display:flex;position:fixed;top:64px;right:0;box-shadow:-4px 0 20px #00000026}[data-theme=dark] .notes-drawer{--notes-code-bg:#0f172a;--notes-inline-code:#fbbf24;--notes-mark-yellow:#facc1561;--notes-mark-green:#22c55e52;--notes-mark-blue:#3b82f666;--notes-mark-pink:#ec489957;box-shadow:-4px 0 20px #00000073}@keyframes notesSlideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.notes-resize{z-index:10;cursor:col-resize;width:6px;position:absolute;top:0;bottom:0;left:-3px}.notes-resize:hover{background:var(--notes-accent);opacity:.6}.notes-header{color:#fff;background:#1b3c2e;flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 16px;font-size:1rem;font-weight:600;display:flex}.notes-close{--btn-fg:#fff;border-width:0;border-radius:4px;padding:4px 8px;font-size:1.05rem;line-height:1}.notes-close:hover{--btn-bg:#ffffff26}.notes-error{color:#b91c1c;background:#fef2f2;border-bottom:1px solid #fecaca;flex-shrink:0;align-items:center;gap:8px;padding:6px 8px 6px 14px;font-size:.82rem;display:flex}[data-theme=dark] .notes-error{color:#fca5a5;background:#dc262626;border-bottom-color:#dc26264d}.notes-error .wb-btn{--btn-fg:currentColor;border-width:0;border-radius:4px;margin-left:auto;padding:2px 6px;font-size:.8rem}.notes-loading{text-align:center;color:var(--wb-muted);padding:24px}.notes-empty{text-align:center;color:var(--wb-muted);padding:40px 28px;font-size:.9rem}.notes-empty-title{color:var(--wb-text);margin-bottom:4px;font-size:1.05rem;font-weight:600}.notes-primary{--btn-bg:var(--notes-accent);--btn-fg:#fff;border-width:0;border-radius:6px;margin-top:10px;padding:8px 16px;font-size:.92rem;font-weight:600}.notes-primary:hover{--btn-bg:#2e4d3a}.notes-bar{border-bottom:1px solid var(--wb-border);flex-shrink:0;align-items:center;gap:6px;padding:8px 10px;display:flex}.notes-picker{flex:1;min-width:0;position:relative}.notes-picker-btn{--btn-fg:var(--wb-text);--btn-border:var(--wb-border);text-align:left;border-style:solid;border-width:1px;border-radius:6px;align-items:center;gap:8px;width:100%;padding:5px 10px;font-size:.92rem;font-weight:600;display:flex}.notes-picker-btn:hover{--btn-bg:var(--wb-hover)}.notes-picker-title{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.notes-picker-count{background:var(--wb-panel-alt);color:var(--wb-muted);border-radius:10px;padding:0 7px;font-size:.75rem;font-weight:500}.notes-list-backdrop{z-index:20;position:fixed;inset:0}.notes-list{z-index:21;background:var(--wb-panel);border:1px solid var(--wb-border);border-radius:8px;max-height:60vh;margin:0;padding:4px;list-style:none;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;box-shadow:0 8px 24px #0000002e}.notes-list-item{--btn-fg:var(--wb-text);text-align:left;border-width:0;border-radius:6px;flex-direction:column;align-items:flex-start;gap:1px;width:100%;padding:7px 10px;display:flex}.notes-list-item:hover{--btn-bg:var(--wb-hover)}.notes-list-item.active{--btn-bg:var(--wb-panel-alt);box-shadow:inset 3px 0 0 var(--notes-accent)}.notes-list-title{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:.9rem;font-weight:600;overflow:hidden}.notes-list-date{color:var(--wb-muted);font-size:.75rem}.notes-bar-btn{width:32px;height:32px;font-size:1.05rem}.notes-danger:hover:not(:disabled){--btn-fg:#dc2626}.notes-modebar{border-bottom:1px solid var(--wb-border);background:var(--wb-panel-alt);flex-shrink:0;align-items:center;gap:8px;padding:6px 10px;display:flex}.notes-modes{border:1px solid var(--wb-border);border-radius:6px;display:inline-flex;overflow:hidden}.notes-mode{--btn-fg:var(--wb-text);--btn-bg:var(--wb-panel);--btn-border:var(--wb-border);border-style:solid;border-width:0 0 0 1px;border-radius:0;padding:3px 11px;font-size:.82rem;font-weight:500}.notes-mode:first-child{border-left-width:0}.notes-mode:hover:not(.active){--btn-bg:var(--wb-hover)}.notes-mode.active{--btn-bg:var(--notes-accent);--btn-fg:#fff}.notes-save{color:var(--wb-muted);white-space:nowrap;align-items:center;gap:6px;margin-left:auto;font-size:.78rem;display:flex}.notes-save-error,.notes-save-tooLarge{color:#dc2626}.notes-retry{--btn-fg:currentColor;font-size:inherit;border-width:0;padding:0;text-decoration:underline}.notes-format{border-bottom:1px solid var(--wb-border);flex-wrap:wrap;flex-shrink:0;align-items:center;gap:2px;padding:4px 8px;display:flex}.notes-format .wb-icon-btn{width:30px;height:28px;font-size:.88rem}.notes-format-sep{background:var(--wb-border);align-self:stretch;width:1px;margin:4px 5px}.notes-format-bold{font-weight:800}.notes-format-italic{font-family:Georgia,Times New Roman,serif;font-style:italic}.notes-format-strike{text-decoration:line-through}.notes-format-heading{font-weight:700}.notes-format-highlight mark,.notes-selbar-unmark mark{background:var(--notes-mark-yellow);color:inherit;border-radius:2px;padding:0 3px}.notes-selbar-unmark mark{text-decoration:line-through}.notes-body{flex-direction:column;flex:1;min-height:0;display:flex}.notes-body-split.wide{flex-direction:row}.notes-body-split>*{flex:50%;min-width:0;min-height:0}.notes-textarea{box-sizing:border-box;resize:none;background:var(--wb-panel);min-height:0;color:var(--wb-text);tab-size:4;border:none;outline:none;flex:1;margin:0;padding:12px 14px;font-family:Courier New,Consolas,monospace;font-size:.9rem;line-height:1.55}.notes-textarea::placeholder{color:var(--wb-muted);opacity:.8}.notes-body-split .notes-textarea{border-bottom:1px solid var(--wb-border)}.notes-body-split.wide .notes-textarea{border-bottom:none;border-right:1px solid var(--wb-border)}.notes-preview-wrap{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}.notes-preview{overflow-wrap:break-word;outline:none;flex:1;min-height:0;padding:12px 16px;font-size:.93rem;line-height:1.6;overflow:auto}.notes-preview-empty{color:var(--wb-muted);font-style:italic}.notes-preview-hint{border-top:1px solid var(--wb-border);color:var(--wb-muted);flex-shrink:0;padding:4px 12px;font-size:.72rem}.notes-preview>:first-child{margin-top:0}.notes-preview h1,.notes-preview h2,.notes-preview h3,.notes-preview h4,.notes-preview h5,.notes-preview h6{margin:1em 0 .45em;font-weight:650;line-height:1.3}.notes-preview h1{border-bottom:1px solid var(--wb-border);padding-bottom:4px;font-size:1.5rem}.notes-preview h2{font-size:1.25rem}.notes-preview h3{font-size:1.1rem}.notes-preview h4,.notes-preview h5,.notes-preview h6{font-size:1rem}.notes-preview p{margin:.6em 0}.notes-preview ul,.notes-preview ol{margin:.5em 0;padding-left:1.5em}.notes-preview li+li{margin-top:.2em}.notes-preview li>p{margin:.3em 0}.notes-preview .contains-task-list{padding-left:.3em;list-style:none}.notes-preview .contains-task-list .contains-task-list{padding-left:1.4em}.notes-preview .task-list-item input{vertical-align:middle;cursor:pointer;accent-color:var(--notes-accent);margin:0 .45em 0 0}.notes-preview blockquote{border-left:3px solid var(--notes-accent);background:var(--wb-panel-alt);color:var(--wb-muted);border-radius:0 6px 6px 0;margin:.6em 0;padding:.2em .9em}.notes-preview code{background:var(--notes-code-bg);color:var(--notes-inline-code);border-radius:4px;padding:.1em .35em;font-family:Courier New,monospace;font-size:.88em}.notes-preview .notes-code{margin:.7em 0}.notes-preview .notes-code pre{border:1px solid var(--wb-border);background:var(--notes-code-bg);border-radius:6px;margin:0;padding:10px 12px;font-size:.85rem;overflow:auto}.notes-preview .notes-code code{color:inherit;font-size:inherit;background:0 0;padding:0}.notes-preview table{border-collapse:collapse;max-width:100%;margin:.7em 0;display:block;overflow-x:auto}.notes-preview th,.notes-preview td{border:1px solid var(--wb-border);padding:4px 10px}.notes-preview th{background:var(--wb-panel-alt)}.notes-preview hr{border:none;border-top:1px solid var(--wb-border);margin:1.2em 0}.notes-preview img{max-width:100%}.notes-preview mark{background:var(--notes-mark-yellow);color:inherit;border-radius:3px;padding:0 .1em}.notes-preview mark.green{background:var(--notes-mark-green)}.notes-preview mark.blue{background:var(--notes-mark-blue)}.notes-preview mark.pink{background:var(--notes-mark-pink)}.notes-selbar{z-index:15;background:#1f2937;border-radius:8px;align-items:center;gap:2px;padding:4px;display:flex;position:absolute;top:0;left:0;box-shadow:0 6px 18px #00000047}[data-theme=dark] .notes-selbar{background:#334155}.notes-selbar .wb-btn{--btn-fg:#f9fafb;border-width:0;border-radius:5px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;font-size:.9rem;line-height:1;display:inline-flex}.notes-selbar .wb-btn:hover{--btn-bg:#ffffff29}.notes-selbar-sep{background:#ffffff38;align-self:stretch;width:1px;margin:3px 2px}.notes-swatch:before{content:"";background:var(--swatch);border-radius:50%;width:16px;height:16px;box-shadow:inset 0 0 0 1px #00000040}.notes-swatch-yellow{--swatch:#fde047}.notes-swatch-green{--swatch:#4ade80}.notes-swatch-blue{--swatch:#60a5fa}.notes-swatch-pink{--swatch:#f472b6}@media (width<=768px){.notes-drawer{max-width:100vw;width:100vw!important}.notes-resize{display:none}}.topbar{color:#fff;box-sizing:border-box;z-index:100;background:linear-gradient(90deg,#1b3c2e 60%,#3a5c4d 100%);justify-content:space-between;align-items:center;gap:1rem;width:100vw;height:64px;padding:0 2rem;display:flex;position:fixed;top:0;left:0;box-shadow:0 2px 8px #0002}.topbar-left{flex-shrink:0;align-items:center;gap:1.2rem;display:flex}.topbar-home{color:inherit;cursor:pointer;background:0 0;border:none;margin:0;padding:0}.topbar-home:focus-visible{outline-offset:4px;border-radius:8px;outline:2px solid #e7f5ee}.topbar-logo{background:#fff;border-radius:8px;height:40px;padding:2px 6px;box-shadow:0 2px 8px #0002}.topbar-title{letter-spacing:1px;font-size:1.5rem;font-weight:600}.topbar-menu{align-items:center;gap:.6rem;display:flex}.topbar-menu button{color:#fff;cursor:pointer;white-space:nowrap;background:#3a5c4d;border:none;border-radius:6px;padding:.5rem 1.2rem;font-size:1rem;transition:background .2s}.topbar-menu button:hover{background:#2e4d3a}.topbar-menu .btn-tutorial{color:#fff;background:linear-gradient(#ef4444 0%,#dc2626 100%);border:1px solid #ffffff2e;padding:.62rem 1.35rem;font-weight:700;box-shadow:0 4px 10px #b91c1c40}.topbar-menu .btn-tutorial:hover{background:linear-gradient(#f87171 0%,#ef4444 100%)}.topbar-menu .btn-tutorial:active{transform:translateY(1px)}.topbar-menu .btn-editor.active{color:#1b3c2e;background:#fff;font-weight:700}.language-picker{background:#3a5c4d;border-radius:6px;flex-shrink:0;align-items:center;gap:.6rem;padding:.5rem .8rem;transition:background .2s;display:flex}.language-picker:hover{background:#2e4d3a}.globe-icon{color:#fff;flex-shrink:0;width:20px;height:20px}.language-picker select{color:#fff;cursor:pointer;appearance:none;background:0 0;border:none;margin:0;padding:0;font-size:1rem}.language-picker select:focus{outline:none}.language-picker select option{color:#fff;background:#1b3c2e}.hamburger-menu{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.4rem;transition:background .2s;display:none}.hamburger-menu:hover{background:#ffffff26}.profile-menu{position:relative}.profile-button{color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:6px;padding:.5rem 1.2rem;font-size:1rem;transition:background .2s;background:#3a5c4d!important}.profile-button:hover{background:#2e4d3a!important}.profile-dropdown{z-index:1000;background:#fff;border-radius:8px;min-width:200px;padding:12px;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 4px 12px #00000026}.profile-info{color:#333;padding:8px 0}.profile-username{margin-bottom:4px;font-size:14px;font-weight:600}.profile-email{color:#666;font-size:12px}.logout-button{color:#fff;cursor:pointer;border:none;border-radius:4px;width:100%;padding:8px 12px;font-size:14px;transition:background .2s;background:#ef4444!important}.logout-button:hover{background:#dc2626!important}.teaching-menu{position:relative}.topbar-menu .btn-teaching.active{color:#1b3c2e;background:#fff;font-weight:700}.teaching-backdrop{z-index:999;position:fixed;inset:0}.teaching-dropdown{z-index:1000;background:#fff;border-radius:8px;flex-direction:column;gap:2px;min-width:240px;padding:6px;display:flex;position:absolute;top:calc(100% + 8px);left:0;box-shadow:0 4px 12px #00000026}.topbar-menu .teaching-dropdown .teaching-item{color:#1b3c2e;text-align:left;background:0 0;border-radius:6px;padding:.55rem .8rem;font-size:.95rem}.topbar-menu .teaching-dropdown .teaching-item:hover{background:#e8f0ec}.topbar-menu .teaching-dropdown .teaching-item.active{background:#d4e4dc;font-weight:700}@media (width<=768px){.topbar{gap:.5rem;padding:0 .75rem}.hamburger-menu{display:flex}.topbar-title{font-size:1.2rem}.topbar-logo{height:32px}.topbar-menu{gap:.4rem}.topbar-menu>button:not(.profile-button):not(.login-button){padding:.4rem .6rem;font-size:.8rem}.language-picker{gap:.3rem;padding:.4rem .5rem}.globe-icon{width:16px;height:16px}.language-picker select{max-width:60px;font-size:.85rem}.profile-button{padding:.4rem .6rem!important;font-size:.85rem!important}@media (width<=420px){.profile-button .profile-username-text,.topbar-menu .btn-editor,.topbar-menu .btn-tutorial,.topbar-menu .btn-help{display:none}}}.btn-modules,.btn-notes{color:#fff;cursor:pointer;white-space:nowrap;background:#3a5c4d;border:none;border-radius:6px;padding:.5rem 1.2rem;font-size:1rem;transition:background .2s}.btn-modules:hover,.btn-notes:hover{background:#2e4d3a}.btn-modules.active,.btn-notes.active{background:#1b3c2e;box-shadow:inset 0 2px 4px #0000004d}.module-drawer-backdrop{z-index:149;background:#00000059;position:fixed;inset:0}.module-drawer{z-index:150;background:#fff;flex-direction:column;width:340px;height:calc(100vh - 64px);animation:.22s drawerSlideIn;display:flex;position:fixed;top:64px;right:0;box-shadow:-4px 0 20px #00000026}@keyframes drawerSlideIn{0%{transform:translate(100%)}to{transform:translate(0)}}.module-drawer-header{color:#fff;background:#1b3c2e;flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 20px;font-size:1rem;font-weight:600;display:flex}.module-drawer-close{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:1.1rem;line-height:1;transition:background .2s}.module-drawer-close:hover{background:#ffffff26}.module-drawer-body{flex:1;padding:16px;overflow-y:auto}@media (width<=768px){.module-drawer{width:100vw}.btn-modules,.btn-notes{padding:.4rem .6rem;font-size:.8rem}}.wave-viewer,.netlist-viewer{--wave-label-width:250px;background:var(--wave-bg);height:100%;min-height:0;color:var(--wb-text);flex-direction:column;font-size:12px;display:flex;position:relative}.wave-toolbar{background:var(--wb-panel-alt);border-bottom:1px solid var(--wb-border);white-space:nowrap;flex-shrink:0;align-items:center;gap:8px;padding:5px 10px;display:flex;overflow-x:auto}.wave-toolbar form{display:flex}.wave-toolbar-spacer{flex:1}.wave-input{width:130px;font:inherit;color:var(--wb-text);background:var(--wb-panel);border:1px solid var(--wb-border);border-radius:4px;padding:3px 7px}.wave-input:focus{border-color:var(--wb-accent-strong);outline:none}.wave-goto{width:140px}.wave-info{color:var(--wb-muted)}.wave-cursor-time{color:var(--wb-text);font-family:Fira Mono,Consolas,monospace}.wave-hint{cursor:help}.wb-tool-btn{--btn-fg:var(--wb-text);--btn-bg:var(--wb-panel);--btn-border:var(--wb-border);cursor:pointer;box-sizing:border-box;border-style:solid;border-width:1px;border-radius:4px;justify-content:center;align-items:center;min-width:26px;height:24px;padding:0 7px;font-size:12px;font-weight:500;line-height:1;display:inline-flex}.wb-tool-btn:hover,.wb-tool-btn.active{--btn-bg:var(--wb-hover)}.wave-popover-backdrop{z-index:9;position:fixed;inset:0}.wave-popover{z-index:10;background:var(--wb-panel);border:1px solid var(--wb-border);border-radius:6px;flex-direction:column;width:280px;max-width:calc(100% - 20px);max-height:calc(100% - 44px);display:flex;position:absolute;top:36px;left:10px;box-shadow:0 8px 24px #00000040}.wave-popover-actions{border-bottom:1px solid var(--wb-border);flex-shrink:0;gap:6px;padding:8px;display:flex}.wave-popover-list{padding:4px 0;overflow-y:auto}.wave-popover-item{cursor:pointer;align-items:center;gap:8px;padding:3px 10px;font-family:Fira Mono,Consolas,monospace;display:flex}.wave-popover-item:hover{background:var(--wb-hover)}.wave-popover-item span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}a.wb-tool-btn,a.wb-tool-btn:hover{color:var(--wb-text);background:var(--wb-panel);border-color:var(--wb-border);text-decoration:none}a.wb-tool-btn:hover{background:var(--wb-hover)}.wave-scroll{cursor:crosshair;flex:1;min-height:0;overflow:hidden auto}.wave-inner{min-height:100%;position:relative}.wave-row{border-bottom:1px solid var(--wave-grid);align-items:stretch;height:26px;display:flex}.wave-ruler-row{z-index:2;background:var(--wave-bg);border-bottom-color:var(--wb-border);height:22px;position:sticky;top:0}.wave-labels{width:var(--wave-label-width);box-sizing:border-box;background:var(--wb-panel);border-right:1px solid var(--wb-border);cursor:default;flex-shrink:0;align-items:center;gap:6px;padding:0 8px 0 10px;font-family:Fira Mono,Consolas,monospace;display:flex}.wave-hide{--btn-fg:var(--wb-muted);cursor:pointer;opacity:0;border-radius:3px;flex-shrink:0;width:14px;height:14px;margin-left:-4px;padding:0;font-size:13px;line-height:1}.wave-row:hover .wave-hide,.wave-hide:focus-visible{opacity:1}.wave-hide:hover{--btn-fg:var(--wb-text);--btn-bg:var(--wb-hover)}.wave-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.wave-value{text-overflow:ellipsis;white-space:nowrap;text-align:right;min-width:14px;max-width:96px;color:var(--wb-muted);flex-shrink:0;overflow:hidden}.wave-radix{--btn-fg:var(--wb-muted);--btn-bg:transparent;--btn-border:var(--wb-border);text-transform:uppercase;cursor:pointer;border-style:solid;border-width:1px;border-radius:3px;flex-shrink:0;height:15px;padding:0 4px;font-size:9px;font-weight:600;line-height:1}.wave-radix:hover{--btn-fg:var(--wb-text)}.wave-track,.wave-ruler{flex:1;min-width:0;display:block}.wave-grid{stroke:var(--wave-grid);stroke-width:1px}.wave-tick{stroke:var(--wb-muted);stroke-width:1px}.wave-tick-label{fill:var(--wb-muted);font-size:10px}.wave-line{fill:none;stroke-width:1.4px;stroke-linejoin:round}.wave-line.bit{stroke:var(--wave-bit)}.wave-line.bus{stroke:var(--wave-bus)}.wave-line.unknown{stroke:var(--wave-unknown)}.wave-unknown-band{fill:var(--wave-unknown);fill-opacity:.28;stroke:var(--wave-unknown);stroke-width:1px}.wave-dense{fill-opacity:.4}.wave-dense.bit{fill:var(--wave-bit)}.wave-dense.bus{fill:var(--wave-bus)}.wave-bus-label{fill:var(--wave-bus);font-family:Fira Mono,Consolas,monospace;font-size:10px}.wave-bus-label.unknown{fill:var(--wave-unknown)}.wave-cursor{border-left:1px dashed var(--wave-cursor);pointer-events:none;z-index:1;width:0;position:absolute;top:0;bottom:0}.wave-cursor.pinned{border-left:1px solid var(--wave-cursor-pinned)}.netlist-canvas{cursor:grab;touch-action:none;background-color:var(--wave-bg);background-image:radial-gradient(var(--wave-grid) 1px, transparent 1px);background-size:16px 16px;flex:1;min-height:0;position:relative;overflow:hidden}.netlist-canvas:active{cursor:grabbing}.netlist-img{-webkit-user-select:none;user-select:none;max-width:none;position:absolute;top:0;left:0}[data-theme=dark] .netlist-img{filter:invert()hue-rotate(180deg)}@media (width<=768px){.wave-viewer,.netlist-viewer{--wave-label-width:150px}}.netlist-path{align-items:center;gap:4px;min-width:0;display:inline-flex}.netlist-path-item{align-items:center;gap:4px;display:inline-flex}.netlist-path-sep{color:var(--wb-muted)}.netlist-path .netlist-path-link{--btn-fg:var(--wb-accent-strong);font:inherit;cursor:pointer;background:0 0;border:none;padding:0;text-decoration:underline}[data-theme=dark] .netlist-path .netlist-path-link{--btn-fg:var(--wb-accent)}.netlist-jump{max-width:220px;font:inherit;color:var(--wb-text);background:var(--wb-panel);border:1px solid var(--wb-border);border-radius:4px;padding:2px 4px}.netlist-hotspots{pointer-events:none;position:absolute;top:0;left:0}.netlist-canvas .netlist-hotspot{pointer-events:auto;cursor:pointer;background:0 0;border:2px solid #0000;border-radius:4px;padding:0;position:absolute}.netlist-canvas .netlist-hotspot:hover,.netlist-canvas .netlist-hotspot:focus-visible{background:#2563eb14;border-color:#2563ebb3;outline:none}.netlist-canvas>.wb-empty{position:absolute;inset:0}.b3{height:100%;min-height:0;color:var(--wb-text);flex-direction:column;display:flex}.b3-toolbar{border-bottom:1px solid var(--wb-border);flex-wrap:wrap;flex-shrink:0;align-items:center;gap:6px;padding:6px 10px;display:flex}.b3-toolbar .b3-synth{margin-right:4px}.b3-tool{--btn-fg:var(--wb-text);--btn-bg:var(--wb-panel);--btn-border:var(--wb-border);cursor:pointer;white-space:nowrap;border-style:solid;border-width:1px;border-radius:6px;padding:4px 10px;font-size:.82rem}.b3-tool:hover:not(:disabled){--btn-bg:var(--wb-hover)}.b3-tool:disabled{opacity:.5;cursor:not-allowed}.b3-speed{color:var(--wb-muted);align-items:center;gap:4px;margin-left:4px;font-size:.82rem;display:inline-flex}.b3-speed-value,.b3-speed select,.b3-speed .b3-speed-step{box-sizing:border-box;height:26px}.b3-speed-value{font-variant-numeric:tabular-nums;text-align:right;width:5.5em;color:var(--wb-text);background:var(--wb-panel);border:1px solid var(--wb-border);border-radius:6px;padding:3px 6px;font-size:.82rem}.b3-speed-value:disabled{opacity:.6}.b3-speed .b3-speed-step{--btn-fg:var(--wb-text);--btn-bg:var(--wb-panel);--btn-border:var(--wb-border);cursor:pointer;border-style:solid;border-width:1px;border-radius:6px;width:24px;padding:2px 0;font-size:.9rem;line-height:1}.b3-speed .b3-speed-step:hover{--btn-bg:var(--wb-hover)}.b3-speed select{color:var(--wb-text);background:var(--wb-panel);border:1px solid var(--wb-border);border-radius:6px;padding:3px 6px;font-size:.82rem}.b3-stale{color:#92400e;background:#fef3c7;border-radius:999px;padding:2px 8px;font-size:.78rem}[data-theme=dark] .b3-stale{color:#fcd34d;background:#422006}.b3-status{font-variant-numeric:tabular-nums;color:var(--wb-muted);white-space:nowrap;margin-left:auto;font-size:.8rem}.b3-error{color:#991b1b;background:#fef2f2;border:1px solid #fecaca;border-radius:6px;flex-shrink:0;margin:8px 10px 0;padding:8px 10px;font-size:.82rem}[data-theme=dark] .b3-error{color:#fecaca;background:#2a1215;border-color:#7f1d1d}.b3-error pre{white-space:pre-wrap;max-height:140px;margin:6px 0 0;font-size:.78rem;overflow:auto}.b3-stage{flex:1;justify-content:center;min-height:140px;padding:8px 10px;display:flex}.b3-svg{-webkit-user-select:none;user-select:none;touch-action:none;width:100%;max-width:1100px;height:100%}.b3-idle .b3-svg{opacity:.75}.b3-info{color:var(--wb-muted);flex-wrap:wrap;flex-shrink:0;gap:4px 14px;padding:4px 10px 8px;font-size:.78rem;display:flex}.b3-warn{color:#b45309}[data-theme=dark] .b3-warn{color:#fbbf24}.b3-pcb{fill:#1e4b38;stroke:#12321f;stroke-width:2px}.b3-hole{fill:#0f2419;stroke:#b8a46a;stroke-width:2px}.b3-silk{fill:#e8efe9;font-family:system-ui,sans-serif;font-size:12px}.b3-title{letter-spacing:2px;font-size:22px;font-weight:700}.b3-small{font-size:10px}.b3-display{fill:#121212;stroke:#2b2b2b;stroke-width:2px}.b3-seg{fill:#ff3b2f}.b3-led{fill:#2c3a30;stroke:#0e1a12}.b3-clk-on{fill:#ffb020}.b3-clk-glow{fill:#ffa000}.b3-scope-screen{fill:#0b1510;stroke:#0a2a1a;stroke-width:2px}.b3-scope-grid{stroke:#1f3a2b;stroke-dasharray:2 3}.b3-scope-trace{fill:none;stroke:#ffd54a;stroke-width:2px;stroke-linejoin:round}.b3-scope-text{fill:#9fd8b4;font-family:ui-monospace,Consolas,monospace;font-size:10px}.b3-tool.active{--btn-bg:var(--wb-hover)}.b3-led-on{fill:#7dff6a}.b3-led-glow{fill:#5dff4a}.b3-switch,.b3-button{cursor:pointer;outline:none}.b3-switch-body{fill:#e6e6e6;stroke:#9a9a9a}.b3-switch-slot{fill:#3b3b3b}.b3-switch-knob{fill:#fafafa;stroke:#6b6b6b;transition:y 80ms ease-out}.b3-switch.on .b3-switch-knob{fill:#fff}.b3-switch:hover .b3-switch-body,.b3-switch:focus-visible .b3-switch-body{stroke:#facc15;stroke-width:2px}.b3-button-base{fill:#c8c8c8;stroke:#8a8a8a}.b3-button-cap{fill:#2f2f2f;stroke:#111;stroke-width:2px}.b3-button-letter{pointer-events:none;font-size:11px;font-weight:700}.b3-button.pressed .b3-button-cap{fill:#575757}.b3-button.latched .b3-button-base{fill:#facc15}.b3-button:hover .b3-button-base,.b3-button:focus-visible .b3-button-base{stroke:#facc15;stroke-width:2px}.b3-switch.unconnected,.b3-button.unconnected,.b3-led.unconnected{opacity:.45}.design-explorer{color:#334155;background:#f9fafb;flex-direction:column;height:100%;min-height:0;font-size:.85rem;display:flex}.explorer-view-switch{border-bottom:1px solid #e5e7eb;flex-shrink:0;display:flex}.explorer-view-switch button{font:inherit;color:#64748b;cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;flex:1;padding:5px 4px}.explorer-view-switch button.active{color:#1b3c2e;border-bottom-color:#1b3c2e;font-weight:600}.explorer-toolbar{border-bottom:1px solid #e5e7eb;flex-wrap:wrap;flex-shrink:0;gap:4px;padding:6px;display:flex}.explorer-toolbar button{font:inherit;color:#3a5c4d;cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:4px;padding:2px 6px;font-size:.78rem;font-weight:600}.explorer-toolbar button:hover{background:#e8eee9}.explorer-tree{flex:1;min-height:0;padding:4px 0;overflow:auto}.explorer-tree.drop{outline-offset:-2px;outline:2px dashed #3a5c4d}.explorer-unused{border-top:1px solid #e5e7eb;flex:none;max-height:35%}.explorer-row{white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:5px;min-height:24px;padding-right:4px;display:flex}.explorer-row:hover,.explorer-row:focus-visible{background:#1b3c2e14;outline:none}.explorer-row.active{color:#1b3c2e;background:#dbeae1}.explorer-row.selected .explorer-name{font-weight:600}.explorer-row.drop{background:#c7e0d0}.explorer-row.root{color:#64748b;padding-left:6px}.explorer-caret{color:#64748b;flex-shrink:0;width:10px;font-size:.7rem}.explorer-icon{flex-shrink:0;font-size:.8rem}.explorer-name{text-overflow:ellipsis;min-width:0;font-family:monospace;overflow:hidden}.explorer-name.keep{flex-shrink:0}.explorer-file{text-overflow:ellipsis;color:#94a3b8;flex-shrink:1000;min-width:0;font-family:monospace;font-size:.75rem;overflow:hidden}.explorer-top{color:#d97706}.explorer-actions{flex-shrink:0;margin-left:auto;display:none}.explorer-row:hover .explorer-actions,.explorer-row:focus-within .explorer-actions,.explorer-row.active .explorer-actions{display:inline-flex}.explorer-action{color:inherit;cursor:pointer;opacity:.6;background:0 0;border:none;padding:0 3px;font-size:.75rem}.explorer-action:hover,.explorer-action:focus-visible{opacity:1}.explorer-group{text-transform:uppercase;letter-spacing:.04em;color:#64748b;padding:6px 6px 2px;font-size:.72rem;font-weight:700}.explorer-hint{color:#94a3b8;padding:4px 18px}.design-workspace{height:100%;min-height:0;display:flex}.design-workspace-explorer{width:var(--explorer-width,210px);flex-shrink:0;min-width:140px;max-width:calc(100% - 240px);min-height:0}.design-workspace-splitter{cursor:col-resize;background:#e5e7eb;flex:0 0 4px;transition:background .15s}.design-workspace-splitter:hover,.wb-resizing-x .design-workspace-splitter{background:var(--wb-accent-strong)}.design-workspace-editor{flex:1;min-width:0;min-height:0}@media (width<=768px){.design-workspace{flex-direction:column}.design-workspace-explorer{border-bottom:1px solid #e5e7eb;width:auto;max-width:none;height:170px}.design-workspace-splitter{display:none}}[data-theme=dark] .design-explorer{color:#cbd5e1;background:#0f172a}[data-theme=dark] .explorer-view-switch,[data-theme=dark] .explorer-toolbar,[data-theme=dark] .explorer-unused,[data-theme=dark] .design-workspace-explorer{border-color:#334155}[data-theme=dark] .design-workspace-splitter{background:#334155}[data-theme=dark] .explorer-view-switch button.active{color:#e2e8f0;border-bottom-color:#93c5fd}[data-theme=dark] .explorer-toolbar button{color:#93c5fd;background:#1e293b;border-color:#334155}[data-theme=dark] .explorer-toolbar button:hover{background:#334155}[data-theme=dark] .explorer-row:hover,[data-theme=dark] .explorer-row:focus-visible{background:#94a3b81f}[data-theme=dark] .explorer-row.active{color:#e2e8f0;background:#1e3a5f}[data-theme=dark] .explorer-row.drop{background:#1e40af}[data-theme=dark] .explorer-tree.drop{outline-color:#93c5fd}.fullscreen-panel{flex-direction:column;display:flex;position:relative}.fullscreen-panel.is-fullscreen{z-index:2000;background:#fff;position:fixed;inset:0}.fullscreen-panel-toolbar{background:#f3f4f6;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;gap:8px;min-height:32px;padding:2px 6px;display:flex}.fullscreen-panel-title{color:#1b3c2e;font-size:.95rem;font-weight:600}.fullscreen-panel.is-fullscreen .fullscreen-panel-toolbar{padding:6px 12px}.fullscreen-panel.is-fullscreen .fullscreen-panel-title{font-size:1.1rem}.fullscreen-panel-body{flex:1;min-height:0}.fullscreen-panel.is-fullscreen .fullscreen-panel-body{overflow:auto}.fullscreen-panel-floating{z-index:5;position:absolute;top:6px;right:6px}.fullscreen-toggle{color:#374151;cursor:pointer;opacity:.85;background:#fff;border:1px solid #d1d5db;border-radius:4px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;font-size:1rem;line-height:1;display:inline-flex}.fullscreen-toggle:hover{opacity:1;background:#e5e7eb}[data-theme=dark] .fullscreen-panel.is-fullscreen{background:#1e1e1e}[data-theme=dark] .fullscreen-panel-toolbar{background:#1e293b;border-bottom-color:#334155}[data-theme=dark] .fullscreen-panel-title{color:#cbd5e1}[data-theme=dark] .fullscreen-toggle{color:#e5e7eb;background:#0f172a;border-color:#334155}[data-theme=dark] .fullscreen-toggle:hover{background:#334155}.fullscreen-panel-actions{align-items:center;gap:8px;min-width:0;display:flex}.tutorial-overview{max-width:1000px;margin:0 auto;padding:24px}.tutorial-header{text-align:center;border-bottom:2px solid #e5e7eb;margin-bottom:40px;padding:20px 0}.tutorial-header h1{color:#1f2937;margin:0 0 8px;font-size:2.5rem}.tutorial-subtitle{color:#6b7280;margin:0;font-size:1.1rem}.tutorial-start-section{justify-content:center;margin-bottom:40px;display:flex}.btn-start-beginner{color:#fff;cursor:pointer;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border:none;border-radius:8px;padding:12px 24px;font-size:1rem;font-weight:600;transition:transform .2s,box-shadow .2s}.btn-start-beginner:hover{transform:scale(1.05);box-shadow:0 4px 12px #10b9814d}.tutorial-lessons-section{margin-top:40px}.tutorial-lessons-section h2{color:#1f2937;margin-bottom:20px;font-size:1.5rem}.difficulty-group{background:#fff;border:1px solid #d1d5db;border-radius:8px;margin-bottom:16px;overflow:hidden}.difficulty-header{cursor:pointer;color:#1f2937;background:#f3f4f6;border:none;align-items:center;gap:12px;width:100%;padding:16px;font-size:1.1rem;font-weight:600;transition:background .2s;display:flex}.difficulty-header:hover,.difficulty-header.expanded{background:#e5e7eb}.difficulty-icon{justify-content:center;align-items:center;width:20px;display:inline-flex}.difficulty-label{text-align:left;flex:1}.lesson-count{color:#6b7280;font-size:.95rem;font-weight:500}.lesson-list{background:#fafbfc;border-top:1px solid #d1d5db}.lesson-item{cursor:pointer;text-align:left;background:0 0;border:none;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;width:100%;padding:12px 16px;transition:background .2s;display:flex}.lesson-item:last-child{border-bottom:none}.lesson-item:hover{background:#f0fdf4}.lesson-content{flex:1}.lesson-title-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.lesson-title{color:#1f2937;margin:0;font-size:1rem;font-weight:600}.lesson-description{color:#6b7280;margin:4px 0 0;font-size:.875rem}.lesson-arrow{color:#d1d5db;margin-left:12px;font-size:1.2rem}.lesson-item:hover .lesson-arrow{color:#10b981}.btn-show-more{color:#374151;cursor:pointer;text-align:center;background:#f3f4f6;border:none;width:100%;padding:10px 16px;font-size:.9rem;font-weight:600;transition:background .2s}.btn-show-more:hover{background:#e5e7eb}.tutorial-lesson{max-width:1200px;margin:0 auto;padding:20px}.tutorial-lesson-wrapper{max-width:900px;margin:0 auto;padding:20px}.lesson-header{border-bottom:2px solid #e5e7eb;align-items:center;gap:20px;margin-bottom:30px;padding-bottom:20px;display:flex}.btn-back{cursor:pointer;color:#374151;white-space:nowrap;background:#f3f4f6;border:1px solid #d1d5db;border-radius:6px;flex-shrink:0;padding:8px 12px;font-size:.95rem;transition:background .2s}.btn-back:hover{background:#e5e7eb}.lesson-header h1{color:#1f2937;flex:1;margin:0;font-size:1.8rem}.lesson-loading-indicator{color:#999;font-size:12px}.lesson-last-saved{color:#666;margin-left:auto;font-size:11px}.lesson-content{flex-direction:column;gap:24px;display:flex}.explanation-section{background:#f0fdf4;border-left:4px solid #10b981;border-radius:4px;padding:16px}.explanation-section h2{color:#1f2937;margin:0 0 12px;font-size:1.1rem}.explanation-text{color:#374151;word-wrap:break-word;font-size:.95rem;line-height:1.7}.explanation-text h1,.explanation-text h2,.explanation-text h3,.explanation-text h4,.explanation-text h5,.explanation-text h6{color:#1f2937;margin-top:20px;margin-bottom:12px;font-weight:600;line-height:1.4}.explanation-text h1{border-bottom:2px solid #e5e7eb;padding-bottom:8px;font-size:1.8rem}.explanation-text h2{font-size:1.5rem}.explanation-text h3{font-size:1.25rem}.explanation-text h4{font-size:1.1rem}.explanation-text p{margin:12px 0}.explanation-text ul{margin:12px 0;padding-left:24px}.explanation-text li{margin-bottom:8px;line-height:1.6}.explanation-text strong{color:#1f2937;font-weight:600}.explanation-text code{color:#d97706;background:#f3f4f6;border-radius:4px;padding:2px 6px;font-family:Courier New,monospace}.explanation-text pre{color:#1f2937;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:6px;margin:12px 0;padding:12px;overflow-x:auto}.explanation-text pre code{color:inherit;background:0 0;padding:0}.explanation-text table{border-collapse:collapse;margin:12px 0;font-size:.9rem}.explanation-text th,.explanation-text td{text-align:left;border:1px solid #e5e7eb;padding:6px 12px}.explanation-text th{color:#1f2937;background:#f3f4f6;font-weight:600}.exercise-section{flex-direction:column;gap:12px;display:flex}.exercise-section h2{color:#1f2937;margin:0;font-size:1.1rem}.exercise-section-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.btn-reset{color:#6b7280;cursor:pointer;background:0 0;border:1px solid #d1d5db;border-radius:4px;padding:6px 12px;font-size:.85rem;transition:background .2s,color .2s,border-color .2s}.btn-reset:hover:not(:disabled){color:#991b1b;background:#fef2f2;border-color:#fca5a5}.btn-reset:disabled{cursor:not-allowed;opacity:.5}.editor-container{border:1px solid #d1d5db;border-radius:6px;overflow:hidden}.testbench-section,.solution-section{background:#f9fafb;border-radius:6px;flex-direction:column;gap:12px;padding:12px;display:flex}.btn-testbench-toggle,.btn-solution-toggle{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:4px;align-self:flex-start;padding:8px 12px;font-size:.95rem;transition:background .2s}.btn-testbench-toggle:hover,.btn-solution-toggle:hover{background:#2563eb}.validation-result{border-left:4px solid;border-radius:6px;padding:16px}.validation-result h3{color:inherit;margin:0 0 8px;font-size:1rem}.validation-result.passed{color:#166534;background:#f0fdf4;border-left-color:#10b981}.validation-result.failed{color:#991b1b;background:#fef2f2;border-left-color:#ef4444}.validation-result.validating{color:#92400e;background:#fffbeb;border-left-color:#f59e0b}.validation-errors{background:#ffffff80;border-radius:4px;margin:8px 0 0;padding:8px;font-size:.85rem;line-height:1.5;overflow-x:auto}.validation-errors strong{margin-bottom:4px;display:block}.validation-log-details{margin-top:10px}.btn-log-toggle{color:inherit;cursor:pointer;opacity:.85;background:0 0;border:1px solid;border-radius:4px;padding:6px 10px;font-size:.85rem;transition:opacity .2s,background .2s}.btn-log-toggle:hover{opacity:1;background:#0000000d}.validation-full-log{color:#d1d5db;white-space:pre-wrap;word-break:break-word;background:#000000d9;border-radius:4px;max-height:320px;margin:8px 0 0;padding:8px;font-size:.8rem;line-height:1.5;overflow:auto}.lesson-actions{justify-content:center;gap:12px;display:flex}.btn-submit{color:#fff;cursor:pointer;background:#10b981;border:none;border-radius:6px;padding:10px 20px;font-size:1rem;font-weight:600;transition:background .2s}.btn-submit:hover:not(:disabled){background:#059669}.btn-submit:disabled{cursor:not-allowed;opacity:.6;background:#d1d5db}.btn-save{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:6px;padding:10px 20px;font-size:1rem;font-weight:600;transition:background .2s}.btn-save:hover:not(:disabled){background:#2563eb}.btn-save:disabled{cursor:not-allowed;opacity:.6;background:#d1d5db}.lesson-navigation{border-top:1px solid #e5e7eb;justify-content:space-between;gap:12px;margin-top:40px;padding-top:20px;display:flex}.btn-nav-prev,.btn-nav-next{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:6px;padding:10px 20px;font-size:.95rem;font-weight:600;transition:background .2s}.btn-nav-prev:hover:not(:disabled),.btn-nav-next:hover:not(:disabled){background:#2563eb}.btn-nav-next:disabled{cursor:not-allowed;opacity:.6;background:#d1d5db}.btn-nav-prev{margin-right:auto}.lesson-status-marker{white-space:nowrap;border-radius:20px;align-items:center;padding:8px 16px;font-size:.9rem;font-weight:600;display:inline-flex}.lesson-status-marker.completed{color:#166534;background:#f0fdf4}.lesson-status-marker.not-completed{color:#6b7280;background:#f3f4f6}.view-mode-selector{flex-wrap:wrap;justify-content:center;gap:8px;margin:24px 0;display:flex}.mode-btn{cursor:pointer;color:#374151;background:#f3f4f6;border:2px solid #d1d5db;border-radius:6px;padding:8px 16px;font-size:.95rem;font-weight:500;transition:all .2s}.mode-btn:hover{background:#e5e7eb;border-color:#9ca3af}.mode-btn.active{color:#fff;background:#3b82f6;border-color:#3b82f6}.section-group,.type-group{margin-bottom:24px}.section-header,.type-header{color:#1f2937;border-bottom:2px solid #e5e7eb;margin-bottom:12px;padding-bottom:8px;font-size:1.2rem;font-weight:600}.lesson-meta{color:#6b7280;align-items:center;gap:12px;font-size:.85rem;display:flex}.lesson-type,.lesson-duration,.lesson-difficulty{white-space:nowrap;background:#f3f4f6;border-radius:4px;align-items:center;gap:4px;padding:4px 8px;font-size:.8rem;font-weight:500;display:inline-flex}.lesson-type{color:#1e40af;background:#dbeafe}.lesson-duration{color:#92400e;background:#fef3c7}.lesson-difficulty{color:#6b21a8;background:#f3e8ff}.tutorial-container{width:100%;min-height:400px}.tutorial-container.loading,.tutorial-container.error{justify-content:center;align-items:center;min-height:600px;display:flex}.spinner{text-align:center;padding:40px}.spinner p{color:#6b7280;margin:0;font-size:1.2rem;animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.error-message{text-align:center;background:#fef2f2;border:2px solid #fecaca;border-radius:8px;padding:40px 20px}.error-message h2{color:#991b1b;margin:0 0 12px}.error-message p{color:#7f1d1d;margin:0 0 20px;font-size:.95rem}.error-message button{color:#fff;cursor:pointer;background:#dc2626;border:none;border-radius:6px;padding:10px 20px;font-weight:600;transition:background .2s}.error-message button:hover{background:#b91c1c}@media (width<=768px){.lesson-item{flex-wrap:wrap;align-items:flex-start;gap:8px}.lesson-content{width:100%}.lesson-meta{flex-wrap:wrap;justify-content:space-between;width:100%;margin-left:0}.lesson-arrow{position:absolute;top:50%;right:12px;transform:translateY(-50%)}.view-mode-selector{flex-direction:column}.mode-btn{width:100%}.lesson-header{flex-direction:column;align-items:flex-start}.lesson-header h1{font-size:1.5rem}.btn-back{width:100%}.tutorial-overview{padding:12px}.tutorial-header{margin-bottom:20px;padding:12px 0}.tutorial-header h1{font-size:1.6rem}.tutorial-subtitle{font-size:.95rem}.tutorial-start-section{margin-bottom:20px}.btn-start-beginner{width:100%;padding:14px 20px;font-size:1rem}.view-mode-selector{gap:6px;margin:12px 0}.mode-btn{flex:1;padding:8px 10px;font-size:.9rem}.difficulty-header{padding:12px;font-size:1rem}.lesson-item{padding:10px 12px;position:relative}.lesson-title{font-size:.9rem}.lesson-description{font-size:.8rem}.lesson-meta{gap:6px;margin-top:6px}.lesson-type,.lesson-duration,.lesson-difficulty{padding:3px 6px;font-size:.75rem}.tutorial-lesson-wrapper{flex-direction:column;gap:16px;padding:10px}.tutorial-lesson{padding:0}.lesson-header{flex-wrap:wrap;gap:10px;margin-bottom:16px;padding-bottom:12px}.lesson-header h1{order:2;width:100%;font-size:1.2rem}.btn-back{order:1;padding:6px 10px;font-size:.85rem}.editor-container .fullscreen-panel:not(.is-fullscreen) .fullscreen-panel-body>section{height:220px!important;min-height:220px!important}.explanation-section{padding:12px}.explanation-text{font-size:.9rem}.explanation-text pre{padding:8px;font-size:.78rem}.explanation-text code{font-size:.82rem}.lesson-actions{flex-direction:column;gap:8px}.btn-submit,.btn-save{width:100%;padding:12px}.btn-testbench-toggle,.btn-solution-toggle{text-align:center;width:100%;padding:10px}.validation-result{padding:12px}.validation-errors{font-size:.78rem;overflow-x:auto}.lesson-navigation{flex-wrap:wrap;gap:8px;margin-top:24px;padding-top:16px}.btn-nav-prev,.btn-nav-next{text-align:center;flex:1;min-width:120px;padding:10px;font-size:.9rem}.lesson-status-marker{flex:100%;order:1;justify-content:center}}@media (width<=420px){.tutorial-header h1{font-size:1.3rem}.lesson-header h1{font-size:1.05rem}.explanation-text{font-size:.85rem}}[data-theme=dark] .tutorial-header{border-bottom-color:#334155}[data-theme=dark] .tutorial-header h1,[data-theme=dark] .tutorial-lessons-section h2,[data-theme=dark] .lesson-header h1,[data-theme=dark] .exercise-section h2,[data-theme=dark] .section-header,[data-theme=dark] .type-header{color:#f1f5f9}[data-theme=dark] .tutorial-subtitle,[data-theme=dark] .lesson-meta,[data-theme=dark] .spinner p,[data-theme=dark] .lesson-loading-indicator,[data-theme=dark] .lesson-last-saved{color:#94a3b8}[data-theme=dark] .difficulty-group{background:#1e293b;border-color:#334155}[data-theme=dark] .difficulty-header{color:#e5e7eb;background:#1e293b}[data-theme=dark] .difficulty-header:hover,[data-theme=dark] .difficulty-header.expanded{background:#334155}[data-theme=dark] .lesson-count{color:#94a3b8}[data-theme=dark] .lesson-list{background:#1e293b;border-top-color:#334155}[data-theme=dark] .lesson-item{border-bottom-color:#334155}[data-theme=dark] .lesson-item:hover{background:#0f2e22}[data-theme=dark] .lesson-title{color:#e5e7eb}[data-theme=dark] .lesson-description{color:#94a3b8}[data-theme=dark] .lesson-arrow{color:#475569}[data-theme=dark] .btn-show-more{color:#cbd5e1;background:#1e293b}[data-theme=dark] .btn-show-more:hover{background:#334155}[data-theme=dark] .lesson-header{border-bottom-color:#334155}[data-theme=dark] .btn-back{color:#cbd5e1;background:#1e293b;border-color:#334155}[data-theme=dark] .btn-back:hover{background:#334155}[data-theme=dark] .explanation-section{background:#10b9811a}[data-theme=dark] .explanation-section h2,[data-theme=dark] .explanation-text h1,[data-theme=dark] .explanation-text h2,[data-theme=dark] .explanation-text h3,[data-theme=dark] .explanation-text h4,[data-theme=dark] .explanation-text h5,[data-theme=dark] .explanation-text h6,[data-theme=dark] .explanation-text strong{color:#f1f5f9}[data-theme=dark] .explanation-text{color:#cbd5e1}[data-theme=dark] .explanation-text h1{border-bottom-color:#334155}[data-theme=dark] .explanation-text code{color:#fbbf24;background:#0f172a}[data-theme=dark] .explanation-text pre{color:#e5e7eb;background:#0f172a;border-color:#334155}[data-theme=dark] .explanation-text th,[data-theme=dark] .explanation-text td{border-color:#334155}[data-theme=dark] .explanation-text th{color:#f1f5f9;background:#0f172a}[data-theme=dark] .btn-reset{color:#94a3b8;border-color:#475569}[data-theme=dark] .btn-reset:hover:not(:disabled){color:#fca5a5;background:#ef444426;border-color:#f87171}[data-theme=dark] .editor-container{border-color:#334155}[data-theme=dark] .testbench-section,[data-theme=dark] .solution-section{background:#1e293b}[data-theme=dark] .lesson-navigation{border-top-color:#334155}[data-theme=dark] .mode-btn{color:#cbd5e1;background:#1e293b;border-color:#334155}[data-theme=dark] .mode-btn:hover{background:#334155;border-color:#475569}.auth-container{background:linear-gradient(135deg,#022215 0%,#40a078 100%);justify-content:center;align-items:center;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;display:flex}.auth-card{background:#fff;border-radius:12px;width:100%;max-width:400px;padding:40px;box-shadow:0 10px 40px #0003}.auth-card h1{color:#333;margin:0 0 10px;font-size:28px;font-weight:600}.subtitle{color:#999;margin:0 0 30px;font-size:14px}.form-group{margin-bottom:20px}.form-group label{color:#333;margin-bottom:8px;font-size:14px;font-weight:500;display:block}.form-group input{box-sizing:border-box;border:1px solid #ddd;border-radius:6px;width:100%;padding:12px;font-size:14px;transition:all .3s}.form-group input:focus{border-color:#0f532e;outline:none;box-shadow:0 0 0 3px #219b581a}.form-group input:disabled{cursor:not-allowed;color:#999;background-color:#f5f5f5}.password-input{align-items:center;display:flex;position:relative}.password-input input{padding-right:40px}.password-toggle{cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;font-size:18px;display:flex;position:absolute;right:12px}.error-message{color:#c33;background-color:#fee;border-left:4px solid #c33;border-radius:6px;margin-bottom:20px;padding:12px;font-size:14px}.success-message{color:#174;background-color:#efe;border-left:4px solid #174;border-radius:6px;margin-bottom:20px;padding:12px;font-size:14px}.submit-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#1caa57 0%,#085014 100%);border:none;border-radius:6px;width:100%;padding:12px;font-size:16px;font-weight:600;transition:all .3s}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 20px #0c642966}.submit-button:disabled{opacity:.7;cursor:not-allowed}.auth-divider{text-align:center;color:#999;margin:16px 0;font-size:13px}.oauth-button{color:#333;cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:6px;width:100%;padding:12px;font-size:16px;font-weight:600;transition:all .3s}.oauth-button:hover:not(:disabled){border-color:#0f532e;box-shadow:0 0 0 3px #219b581a}.oauth-button:disabled{opacity:.7;cursor:not-allowed}.switch-auth{text-align:center;color:#666;margin-top:20px;font-size:14px}.switch-auth a{color:#667eea;font-weight:600;text-decoration:none;transition:color .3s}.switch-auth a:hover{color:#764ba2}:root{color:#1f2937;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f8fafb;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}:root[data-theme=dark]{color:#e5e7eb;background-color:#0f172a}a{color:#646cff;-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}:root[data-theme=dark] a{color:#93c5fd}a:hover{color:#535bf2}:root[data-theme=dark] a:hover{color:#bfdbfe}body{min-width:320px;min-height:100vh;color:inherit;background:#f8fafb;margin:0}:root[data-theme=dark] body{color:#e5e7eb;background:#0f172a}h1{font-size:3.2em;line-height:1.1}button{color:#111827;cursor:pointer;background-color:#f3f4f6;border:1px solid #0000;border-radius:8px;padding:.6em 1.2em;font-family:inherit;font-size:1em;font-weight:500;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}:root[data-theme=dark] button{color:#e5e7eb;background-color:#1f2937;border-color:#374151}
