:root{--bg-primary:#0b0d10;--bg-sidebar:#0f1115;--bg-panel:#15181e;--bg-elevated:#1a1e25;--border-subtle:#292e38;--border-focus:#ff6b2c;--text-primary:#f4f5f7;--text-secondary:#9da4af;--text-muted:#5c6370;--accent:#ff6b2c;--accent-hover:#ff7d42;--accent-dim:#ff6b2c1f;--accent-glow:#ff6b2c40;--success:#42d392;--warning:#f3b63f;--danger:#ff5d5d;--info:#60a5fa;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--text-xs:.6875rem;--text-sm:.75rem;--text-base:.8125rem;--text-md:.875rem;--text-lg:1rem;--text-xl:1.125rem;--text-2xl:1.25rem;--text-3xl:1.5rem;--weight-normal:400;--weight-medium:500;--weight-semi:600;--leading-tight:1.25;--leading-normal:1.5;--leading-relaxed:1.65;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--radius-sm:4px;--radius:6px;--radius-md:8px;--radius-lg:10px;--shadow-sm:0 1px 2px #0006;--shadow:0 2px 8px #00000080;--shadow-lg:0 8px 24px #0009;--transition-fast:.12s ease;--transition:.2s ease;--transition-slow:.35s ease;--sidebar-width:268px;--topbar-height:56px}@media (prefers-reduced-motion:reduce){:root{--transition-fast:0s;--transition:0s;--transition-slow:0s}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-sans);font-size:var(--text-base);font-weight:var(--weight-normal);line-height:var(--leading-normal);color:var(--text-primary);background-color:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100dvw;height:100dvh;overflow:hidden}h1,h2,h3,h4,h5,h6{font-weight:var(--weight-semi);line-height:var(--leading-tight)}p{line-height:var(--leading-relaxed)}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover)}button{font-family:inherit;font-size:inherit;cursor:pointer;color:inherit;background:0 0;border:none}input,select,textarea{font-family:inherit;font-size:inherit}img,svg{max-width:100%;display:block}ul,ol{list-style:none}canvas{display:block}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-sm)}:focus:not(:focus-visible){outline:none}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-subtle);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:#3a4050}#app-loading{justify-content:center;align-items:center;gap:var(--space-4);height:100dvh;color:var(--text-secondary);font-size:var(--text-md);flex-direction:column;display:flex}.loading-spinner{border:2px solid var(--border-subtle);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.loading-spinner{border-top-color:var(--accent);animation:none}}#app{grid-template-areas:"sidebar topbar""sidebar main";grid-template-columns:var(--sidebar-width) 1fr;grid-template-rows:var(--topbar-height) 1fr;width:100dvw;height:100dvh;display:grid;overflow:hidden}.sidebar{background:var(--bg-sidebar);border-right:1px solid var(--border-subtle);z-index:10;flex-direction:column;grid-area:sidebar;display:flex;overflow:hidden}.sidebar__brand{align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-4) var(--space-3);border-bottom:1px solid var(--border-subtle);flex-shrink:0;display:flex}.sidebar__logo{flex-shrink:0}.sidebar__brand-name{flex-direction:column;gap:1px;display:flex}.sidebar__brand-title{font-size:var(--text-sm);font-weight:var(--weight-semi);color:var(--text-primary);letter-spacing:.02em}.sidebar__brand-sub{font-size:var(--text-xs);color:var(--text-muted);letter-spacing:.04em;text-transform:uppercase}.sidebar__search{padding:var(--space-3) var(--space-4);flex-shrink:0}.sidebar__search-input{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius);width:100%;color:var(--text-primary);font-size:var(--text-sm);padding:var(--space-2) var(--space-3);transition:border-color var(--transition-fast);align-items:center;gap:var(--space-2);display:flex}.sidebar__search-wrap{position:relative}.sidebar__search-wrap input{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius);width:100%;color:var(--text-primary);font-size:var(--text-sm);padding:var(--space-2) var(--space-3) var(--space-2) 2rem;transition:border-color var(--transition-fast)}.sidebar__search-wrap input:focus{border-color:var(--accent);outline:none}.sidebar__search-icon{left:var(--space-2);color:var(--text-muted);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.sidebar__search-wrap input::placeholder{color:var(--text-muted)}.sidebar__nav{padding:var(--space-2) 0 var(--space-4);flex:1;overflow-y:auto}.sidebar__group{margin-bottom:var(--space-1)}.sidebar__group-label{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;padding:var(--space-3) var(--space-4) var(--space-1)}.sidebar__item{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--weight-normal);text-align:left;background:0 0;border:none;border-radius:0;width:100%;display:flex;position:relative}.sidebar__item:hover{background:var(--bg-elevated);color:var(--text-primary)}.sidebar__item.active{color:var(--text-primary);background:var(--accent-dim)}.sidebar__item.active:before{content:"";background:var(--accent);border-radius:0 2px 2px 0;width:2px;position:absolute;top:0;bottom:0;left:0}.sidebar__item-icon{color:currentColor;opacity:.7;flex-shrink:0}.sidebar__item.active .sidebar__item-icon{opacity:1;color:var(--accent)}.sidebar__item-text{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.sidebar__item-progress{background:var(--border-subtle);border-radius:99px;flex-shrink:0;width:32px;height:3px;overflow:hidden}.sidebar__item-progress-fill{background:var(--accent);height:100%;transition:width var(--transition-slow);border-radius:99px}.sidebar__item-progress-fill.complete{background:var(--success)}.sidebar__footer{padding:var(--space-3) var(--space-4);border-top:1px solid var(--border-subtle);gap:var(--space-1);flex-direction:column;flex-shrink:0;display:flex}.sidebar__footer-btn{align-items:center;gap:var(--space-2);color:var(--text-muted);font-size:var(--text-xs);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);transition:color var(--transition-fast), background var(--transition-fast);cursor:pointer;text-align:left;background:0 0;border:none;width:100%;display:flex}.sidebar__footer-btn:hover{color:var(--text-secondary);background:var(--bg-elevated)}.topbar{background:var(--bg-sidebar);border-bottom:1px solid var(--border-subtle);align-items:center;gap:var(--space-4);padding:0 var(--space-5);z-index:9;grid-area:topbar;display:flex}.topbar__module-info{align-items:baseline;gap:var(--space-3);flex:1;min-width:0;display:flex}.topbar__title{font-size:var(--text-md);font-weight:var(--weight-semi);color:var(--text-primary);white-space:nowrap}.topbar__desc{font-size:var(--text-sm);color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.topbar__actions{align-items:center;gap:var(--space-2);flex-shrink:0;display:flex}.main{background:var(--bg-primary);grid-area:main;grid-template-rows:1fr;grid-template-columns:1fr 300px;display:grid;overflow:hidden}.main__simulation-area{flex-direction:column;min-width:0;display:flex;overflow:hidden}.simulation-viewport{background:#080a0d;flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.simulation-viewport canvas{object-fit:contain;max-width:100%;max-height:100%}.controls-strip{background:var(--bg-panel);border-top:1px solid var(--border-subtle);padding:var(--space-4) var(--space-5);flex-shrink:0;max-height:260px;overflow-y:auto}.right-panel{background:var(--bg-sidebar);border-left:1px solid var(--border-subtle);flex-direction:column;display:flex;overflow:hidden}.right-panel__tabs{border-bottom:1px solid var(--border-subtle);flex-shrink:0;display:flex}.right-panel__tab{padding:var(--space-3) var(--space-2);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted);text-align:center;cursor:pointer;transition:color var(--transition-fast), border-color var(--transition-fast);letter-spacing:.04em;text-transform:uppercase;background:0 0;border:none;border-bottom:2px solid #0000;flex:1;margin-bottom:-1px}.right-panel__tab:hover{color:var(--text-secondary)}.right-panel__tab.active{color:var(--accent);border-bottom-color:var(--accent)}.right-panel__content{padding:var(--space-4);flex:1;overflow-y:auto}.module-container{display:contents}.sidebar-overlay{z-index:9;background:#0009;display:none;position:fixed;inset:0}.divider{background:var(--border-subtle);height:1px;margin:var(--space-3) 0}.section-label{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--space-3)}.btn{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);font-size:var(--text-sm);font-weight:var(--weight-medium);border-radius:var(--radius);cursor:pointer;transition:background var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);white-space:nowrap;border:1px solid #0000;flex-shrink:0;display:inline-flex}.btn-icon{padding:var(--space-2);border-radius:var(--radius)}.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn-ghost{color:var(--text-secondary);border-color:var(--border-subtle);background:0 0}.btn-ghost:hover{background:var(--bg-elevated);color:var(--text-primary)}.btn-ghost.active{background:var(--accent-dim);color:var(--accent);border-color:var(--accent)}.btn-danger{color:var(--danger);background:0 0;border-color:#ff5d5d4d}.btn-danger:hover{background:#ff5d5d1a}.toggle-wrap{align-items:center;gap:var(--space-3);cursor:pointer;display:flex}.toggle-wrap label{font-size:var(--text-sm);color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none}.toggle{flex-shrink:0;width:32px;height:18px;display:inline-block;position:relative}.toggle input{opacity:0;width:0;height:0;position:absolute}.toggle__track{background:var(--border-subtle);transition:background var(--transition-fast);border-radius:99px;position:absolute;inset:0}.toggle input:checked~.toggle__track{background:var(--accent)}.toggle__thumb{width:14px;height:14px;transition:transform var(--transition-fast);box-shadow:var(--shadow-sm);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px}.toggle input:checked~.toggle__thumb{transform:translate(14px)}.slider-wrap{gap:var(--space-2);flex-direction:column;display:flex}.slider-header{justify-content:space-between;align-items:center;gap:var(--space-2);display:flex}.slider-label{font-size:var(--text-sm);color:var(--text-secondary);font-weight:var(--weight-medium)}.slider-value{font-size:var(--text-sm);font-family:var(--font-mono);color:var(--accent);font-weight:var(--weight-medium);text-align:right;min-width:60px}.slider-track{align-items:center;height:20px;display:flex;position:relative}.slider-input{appearance:none;background:var(--border-subtle);cursor:pointer;z-index:1;border-radius:99px;outline:none;width:100%;height:3px;position:relative}.slider-input::-webkit-slider-thumb{appearance:none;background:var(--accent);cursor:pointer;border:2px solid var(--bg-panel);width:14px;height:14px;transition:transform var(--transition-fast), box-shadow var(--transition-fast);box-shadow:0 0 0 0 var(--accent-glow);border-radius:50%}.slider-input::-webkit-slider-thumb:hover{box-shadow:0 0 0 4px var(--accent-glow);transform:scale(1.2)}.slider-input::-moz-range-thumb:hover{box-shadow:0 0 0 4px var(--accent-glow);transform:scale(1.2)}.slider-input::-moz-range-thumb{background:var(--accent);cursor:pointer;border:2px solid var(--bg-panel);width:14px;height:14px;transition:transform var(--transition-fast), box-shadow var(--transition-fast);border-radius:50%}.slider-fill{background:var(--accent);pointer-events:none;z-index:0;border-radius:99px;height:3px;position:absolute;top:50%;left:0;transform:translateY(-50%)}.segmented-control{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius);gap:2px;padding:2px;display:inline-flex}.segmented-control__option{padding:var(--space-1) var(--space-3);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-secondary);border-radius:calc(var(--radius) - 2px);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);white-space:nowrap;background:0 0;border:none;flex:1}.segmented-control__option:hover{color:var(--text-primary)}.segmented-control__option.active{background:var(--bg-panel);color:var(--text-primary);box-shadow:var(--shadow-sm)}.segmented-control__option.active-accent{background:var(--accent);color:#fff}.badge{align-items:center;gap:var(--space-1);padding:2px var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--weight-medium);font-family:var(--font-mono);letter-spacing:.02em;flex-shrink:0;display:inline-flex}.badge-neutral{background:var(--bg-elevated);color:var(--text-secondary);border:1px solid var(--border-subtle)}.badge-accent{background:var(--accent-dim);color:var(--accent);border:1px solid #ff6b2c4d}.badge-success{color:var(--success);background:#42d3921a;border:1px solid #42d39240}.badge-warning{color:var(--warning);background:#f3b63f1a;border:1px solid #f3b63f40}.badge-danger{color:var(--danger);background:#ff5d5d1a;border:1px solid #ff5d5d40}[data-tooltip]{cursor:help;border-bottom:1px dashed var(--text-muted);position:relative}[data-tooltip]:after{content:attr(data-tooltip);background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius);padding:var(--space-2) var(--space-3);font-size:var(--text-xs);color:var(--text-primary);white-space:nowrap;white-space:normal;text-align:center;pointer-events:none;opacity:0;max-width:220px;transition:opacity var(--transition-fast);z-index:100;box-shadow:var(--shadow-lg);font-style:normal;line-height:var(--leading-normal);border-bottom:none;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%)}[data-tooltip]:hover:after{opacity:1}.value-grid{gap:var(--space-2);grid-template-columns:repeat(2,1fr);display:grid}.value-item{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius);padding:var(--space-3);gap:var(--space-1);flex-direction:column;display:flex}.value-item__label{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em}.value-item__val{font-size:var(--text-lg);font-weight:var(--weight-semi);font-family:var(--font-mono);color:var(--text-primary);line-height:1}.value-item__val.accent{color:var(--accent)}.value-item__val.success{color:var(--success)}.value-item__val.warning{color:var(--warning)}.value-item__val.danger{color:var(--danger)}.value-item__sub{font-size:var(--text-xs);color:var(--text-muted)}.learn-panel{gap:var(--space-4);flex-direction:column;display:flex}.learn-panel__dynamic{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-4);gap:var(--space-3);transition:border-color var(--transition);flex-direction:column;display:flex}.learn-panel__dynamic:has(.learn-panel__what:not(:empty)){border-color:#ff6b2c33}.learn-panel__section-title{font-size:var(--text-xs);font-weight:var(--weight-medium);text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);align-items:center;gap:var(--space-2);display:flex}.learn-panel__text{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-relaxed)}.learn-panel__pros-cons{gap:var(--space-2);flex-direction:column;display:flex}.learn-panel__pro,.learn-panel__con{align-items:flex-start;gap:var(--space-2);font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-relaxed);display:flex}.learn-panel__pro-icon{color:var(--success);flex-shrink:0;margin-top:2px}.learn-panel__con-icon{color:var(--danger);flex-shrink:0;margin-top:2px}.learn-panel__merksatz{background:var(--accent-dim);border-radius:var(--radius);padding:var(--space-3) var(--space-4);font-size:var(--text-sm);color:var(--accent);font-weight:var(--weight-medium);line-height:var(--leading-relaxed);border:1px solid #ff6b2c33;position:relative}.learn-panel__merksatz:before{content:"💡";top:var(--space-3);right:var(--space-3);font-size:12px;position:absolute}.challenge-panel{gap:var(--space-3);flex-direction:column;display:flex}.challenge-card{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);transition:border-color var(--transition-fast);overflow:hidden}.challenge-card:hover{border-color:#ff6b2c4d}.challenge-card__header{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border-subtle);align-items:center;gap:var(--space-3);display:flex}.challenge-card__num{background:var(--bg-panel);border:1px solid var(--border-subtle);width:20px;height:20px;font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.challenge-card.completed .challenge-card__num{background:var(--success);border-color:var(--success);color:#000}.challenge-card__title{font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--text-primary);flex:1}.challenge-card__body{padding:var(--space-4);gap:var(--space-3);flex-direction:column;display:flex}.challenge-card__scenario{font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-relaxed)}.challenge-card__goal{font-size:var(--text-sm);color:var(--text-primary);font-weight:var(--weight-medium);background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3)}.challenge-card__feedback{font-size:var(--text-sm);color:var(--text-secondary);background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:var(--space-3);line-height:var(--leading-relaxed);display:none}.challenge-card__feedback.visible{display:block}.challenge-card__feedback.good{color:var(--success);border-color:#42d3924d}.challenge-card__feedback.ok{color:var(--warning);border-color:#f3b63f4d}.challenge-card__feedback.hint{color:var(--accent);border-color:#ff6b2c4d}.frame-timeline{padding:var(--space-2) 0;gap:3px;display:flex;overflow-x:auto}.frame-thumb{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);background:#111;flex-shrink:0;width:40px;height:30px;overflow:hidden}.frame-thumb canvas{width:100%;height:100%}.compare-view{border-radius:var(--radius-md);cursor:col-resize;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.compare-view__layer{position:absolute;inset:0}.compare-view__layer--b{clip-path:inset(0 50% 0 0)}.compare-divider{cursor:col-resize;background:#fff;width:2px;position:absolute;top:0;bottom:0;left:50%;box-shadow:0 0 8px #000c}.compare-divider:before,.compare-divider:after{content:"";width:24px;height:24px;box-shadow:var(--shadow);background:#fff;border-radius:50%;margin-top:-12px;position:absolute;top:50%;left:50%;transform:translate(-50%)}.monitor-canvas{border-radius:var(--radius);border:1px solid var(--border-subtle);background:#060810}.control-row{gap:var(--space-4);flex-direction:column;display:flex}.control-cols{gap:var(--space-4);grid-template-columns:repeat(2,1fr);display:grid}.control-group{gap:var(--space-3);flex-direction:column;display:flex}.control-group__title{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;padding-bottom:var(--space-2);border-bottom:1px solid var(--border-subtle)}.preset-row{gap:var(--space-2);flex-wrap:wrap;display:flex}.preset-btn{padding:var(--space-1) var(--space-3);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-elevated);color:var(--text-secondary);font-size:var(--text-xs);cursor:pointer;transition:border-color var(--transition-fast), color var(--transition-fast)}.preset-btn:hover{border-color:var(--accent);color:var(--accent)}.preset-btn.active{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.indicator-bar{gap:var(--space-1);flex-direction:column;display:flex}.indicator-bar__label{font-size:var(--text-xs);color:var(--text-muted);justify-content:space-between;display:flex}.indicator-bar__track{background:var(--border-subtle);border-radius:99px;height:4px;overflow:hidden}.indicator-bar__fill{height:100%;transition:width var(--transition);border-radius:99px}.iris-display{justify-content:center;align-items:center;display:flex}.depth-scale{align-items:center;gap:var(--space-2);font-size:var(--text-xs);color:var(--text-muted);display:flex}.depth-scale__bar{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:99px;flex:1;height:12px;position:relative;overflow:hidden}.depth-scale__sharp{background:var(--accent);opacity:.7;transition:left var(--transition), width var(--transition);border-radius:99px;position:absolute;top:0;bottom:0}.dropdown-wrap{position:relative}.dropdown-btn{width:100%;padding:var(--space-2) var(--space-3);background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius);font-size:var(--text-sm);color:var(--text-primary);cursor:pointer;transition:border-color var(--transition-fast);justify-content:space-between;align-items:center;display:flex}.dropdown-btn:hover{border-color:var(--accent)}.dropdown-menu{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius);z-index:50;box-shadow:var(--shadow-lg);display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow:hidden}.dropdown-menu.open{display:block}.dropdown-option{padding:var(--space-2) var(--space-3);font-size:var(--text-sm);color:var(--text-secondary);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast)}.dropdown-option:hover{background:var(--bg-panel);color:var(--text-primary)}.dropdown-option.selected{color:var(--accent)}.glossary-list{gap:var(--space-2);flex-direction:column;display:flex}.glossary-item{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius);overflow:hidden}.glossary-item__header{padding:var(--space-3) var(--space-4);cursor:pointer;transition:background var(--transition-fast);justify-content:space-between;align-items:center;display:flex}.glossary-item__header:hover{background:var(--bg-panel)}.glossary-item__term{font-size:var(--text-md);font-weight:var(--weight-medium);color:var(--text-primary)}.glossary-item__body{padding:0 var(--space-4) var(--space-3);font-size:var(--text-sm);color:var(--text-secondary);line-height:var(--leading-relaxed);display:none}.glossary-item.open .glossary-item__body{display:block}.split-sim{gap:var(--space-2);grid-template-columns:1fr 1fr;height:100%;display:grid}.split-sim__panel{border-radius:var(--radius-md);border:1px solid var(--border-subtle);flex-direction:column;gap:0;display:flex;overflow:hidden}.split-sim__label{background:var(--bg-panel);border-bottom:1px solid var(--border-subtle);padding:var(--space-2) var(--space-3);font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted);align-items:center;gap:var(--space-2);display:flex}.split-sim__canvas{flex:1;min-height:0}@media (width<=1280px){:root{--sidebar-width:240px}.main{grid-template-columns:1fr 260px}}@media (width<=1024px){:root{--sidebar-width:220px}.main{grid-template-rows:1fr auto;grid-template-columns:1fr}.right-panel{border-left:none;border-top:1px solid var(--border-subtle);max-height:280px}.control-cols{grid-template-columns:1fr}}@media (width<=768px){body{overflow:auto}#app{grid-template-columns:1fr;grid-template-areas:"topbar""main";grid-template-rows:var(--topbar-height) 1fr;height:auto;min-height:100dvh;overflow:auto}.sidebar{width:var(--sidebar-width);z-index:20;transition:transform var(--transition-slow);position:fixed;top:0;bottom:0;left:0;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-overlay{display:block}.topbar{border-bottom:1px solid var(--border-subtle);padding:0 var(--space-4);grid-area:topbar}.sidebar-toggle{display:flex!important}.main{grid-area:main;grid-template-rows:auto auto auto;grid-template-columns:1fr;height:auto;overflow:auto}.main__simulation-area{overflow:visible}.simulation-viewport{min-height:300px}.right-panel{border-left:none;border-top:1px solid var(--border-subtle);max-height:none}.controls-strip{max-height:none;overflow:visible}.split-sim{grid-template-columns:1fr}.value-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=390px){:root{--sidebar-width:100vw;--topbar-height:52px}.topbar__desc,.topbar__actions .btn-ghost:not(.btn-play){display:none}.value-grid{grid-template-columns:1fr 1fr}.control-cols{grid-template-columns:1fr}.preset-row{gap:var(--space-1)}.preset-btn{padding:2px var(--space-2);font-size:10px}.right-panel__tab{padding:var(--space-2) var(--space-1);font-size:10px}.simulation-viewport{min-height:240px}}.sidebar-toggle{border:1px solid var(--border-subtle);border-radius:var(--radius);width:32px;height:32px;color:var(--text-secondary);cursor:pointer;transition:background var(--transition-fast);background:0 0;flex-shrink:0;justify-content:center;align-items:center;display:none}.sidebar-toggle:hover{background:var(--bg-elevated);color:var(--text-primary)}.landing-page{background:var(--bg-body);width:100vw;height:100vh;color:var(--text-primary);font-family:var(--font-sans);z-index:1000;flex-direction:column;display:flex;position:fixed;inset:0;overflow-y:auto}.landing-nav{padding:var(--space-4) var(--space-8);border-bottom:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:100;background:#060810cc;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.landing-brand{align-items:center;gap:var(--space-3);display:flex}.landing-logo{object-fit:contain;width:32px;height:32px}.landing-brand-title{font-size:var(--text-lg);font-weight:var(--weight-medium)}.landing-brand-sub{color:var(--text-secondary);font-weight:var(--weight-regular);font-size:var(--text-sm);margin-left:var(--space-1)}.landing-nav-actions{align-items:center;gap:var(--space-4);display:flex}.landing-nav-link{color:var(--text-secondary);font-size:var(--text-sm);transition:color var(--transition-fast);text-decoration:none}.landing-nav-link:hover{color:var(--accent)}.welcome-btn-sm{background:var(--accent);color:#fff;border-radius:var(--radius);padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-weight:var(--weight-medium);cursor:pointer;transition:background var(--transition-fast);border:none}.welcome-btn-sm:hover{background:var(--accent-hover)}.landing-hero{text-align:center;padding:var(--space-8) var(--space-6) var(--space-8);background:radial-gradient(circle at top,#ff6b2c1f 0%,#0000 60%);flex-direction:column;align-items:center;width:100%;max-width:960px;margin:0 auto;display:flex}.hero-badge{background:var(--accent-dim);color:var(--accent);font-size:var(--text-xs);font-weight:var(--weight-medium);padding:var(--space-1) var(--space-3);margin-bottom:var(--space-4);border:1px solid #ff6b2c4d;border-radius:99px}.hero-title{letter-spacing:-.03em;margin-bottom:var(--space-4);font-size:2.75rem;font-weight:700;line-height:1.15}.hero-highlight{color:var(--accent)}.hero-subtitle{font-size:var(--text-lg);color:var(--text-secondary);max-width:680px;margin-bottom:var(--space-6);line-height:1.6}.hero-cta-group{align-items:center;gap:var(--space-4);margin-bottom:var(--space-8);display:flex}.welcome-btn{background:var(--accent);color:#fff;border-radius:var(--radius-md);padding:var(--space-3) var(--space-6);font-size:var(--text-md);font-weight:var(--weight-semi);cursor:pointer;transition:background var(--transition-fast), transform var(--transition-fast);border:none;box-shadow:0 4px 16px #ff6b2c4d}.welcome-btn:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 6px 20px #ff6b2c66}.hero-secondary-btn{color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--weight-medium);padding:var(--space-3) var(--space-4);transition:color var(--transition-fast);text-decoration:none}.hero-secondary-btn:hover{color:var(--text-primary)}.hero-stats{gap:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--border-subtle);grid-template-columns:repeat(3,1fr);width:100%;max-width:700px;display:grid}.stat-item{flex-direction:column;align-items:center;display:flex}.stat-num{color:var(--text-primary);font-size:1.75rem;font-weight:700;font-family:var(--font-mono)}.stat-label{font-size:var(--text-xs);color:var(--text-muted);margin-top:2px}.landing-features{padding:var(--space-8) var(--space-6);width:100%;max-width:1100px;margin:0 auto}.section-header{text-align:center;margin-bottom:var(--space-8)}.section-tag{color:var(--accent);font-size:var(--text-xs);font-weight:var(--weight-semi);text-transform:uppercase;letter-spacing:.1em}.section-header h2{font-size:2rem;font-weight:var(--weight-semi);margin:var(--space-2) 0}.section-header p{color:var(--text-secondary);font-size:var(--text-md)}.features-grid{gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(240px,1fr));display:grid}.feature-card{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-6);transition:transform var(--transition-fast), border-color var(--transition-fast)}.feature-card:hover{border-color:#ff6b2c66;transform:translateY(-4px)}.feature-icon{margin-bottom:var(--space-3);font-size:2rem}.feature-card h3{font-size:var(--text-lg);font-weight:var(--weight-semi);margin-bottom:var(--space-2)}.feature-card p{color:var(--text-secondary);font-size:var(--text-sm);line-height:1.5}.landing-faq{padding:var(--space-8) var(--space-6);width:100%;max-width:800px;margin:0 auto}.faq-list{gap:var(--space-4);flex-direction:column;display:flex}.faq-item{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-4)}.faq-item summary{font-weight:var(--weight-medium);font-size:var(--text-md);cursor:pointer;color:var(--text-primary)}.faq-item p{color:var(--text-secondary);font-size:var(--text-sm);margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--border-subtle);line-height:1.6}.landing-footer{padding:var(--space-6) var(--space-8);border-top:1px solid var(--border-subtle);background:#06081099;justify-content:space-between;align-items:center;margin-top:auto;display:flex}.footer-brand{align-items:center;gap:var(--space-2);font-size:var(--text-sm);display:flex}.footer-logo{width:20px;height:20px}.footer-copy{color:var(--text-muted);font-size:var(--text-xs)}.login-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1100;opacity:0;pointer-events:none;transition:opacity var(--transition);background:#060810d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.login-overlay.open{opacity:1;pointer-events:auto}.login-modal{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-6);width:100%;max-width:420px;box-shadow:var(--shadow-xl);transition:transform var(--transition);position:relative;transform:scale(.95)}.login-overlay.open .login-modal{transform:scale(1)}.login-modal h2{font-size:var(--text-xl);font-weight:var(--weight-semi);color:var(--text-primary);margin-bottom:var(--space-2)}.login-modal p{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--space-5)}.login-form{gap:var(--space-3);text-align:left;flex-direction:column;display:flex}.login-label{font-size:var(--text-xs);font-weight:var(--weight-medium);color:var(--text-muted)}.login-input{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--radius);padding:var(--space-3);font-size:var(--text-sm);color:var(--text-primary);transition:border-color var(--transition-fast);outline:none}.login-input:focus{border-color:var(--accent)}.login-actions{gap:var(--space-2);margin-top:var(--space-3);flex-direction:column;display:flex}.login-btn-submit{background:var(--accent);color:#fff;border-radius:var(--radius);padding:var(--space-3);font-size:var(--text-sm);font-weight:var(--weight-semi);cursor:pointer;transition:background var(--transition-fast);border:none}.login-btn-submit:hover{background:var(--accent-hover)}.login-btn-register{color:var(--text-muted);border:1px solid var(--border-subtle);border-radius:var(--radius);padding:var(--space-3);font-size:var(--text-sm);font-weight:var(--weight-medium);cursor:not-allowed;opacity:.6;background:0 0}.login-close{top:var(--space-3);right:var(--space-3);color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;font-size:24px;line-height:1;position:absolute}.login-close:hover{color:var(--text-primary)}@media (width<=640px){.landing-nav{padding:var(--space-3) var(--space-4)}.hero-title{font-size:2rem}.hero-stats{gap:var(--space-4);grid-template-columns:1fr}.landing-footer{gap:var(--space-3);text-align:center;flex-direction:column}}