@font-face{font-family:Inter;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/inter-latin-400-normal-C38fXH4l.woff2)format("woff2"),url(/assets/inter-latin-400-normal-CyCys3Eg.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/inter-latin-500-normal-Cerq10X2.woff2)format("woff2"),url(/assets/inter-latin-500-normal-BL9OpVg8.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/inter-latin-600-normal-LgqL8muc.woff2)format("woff2"),url(/assets/inter-latin-600-normal-CiBQ2DWP.woff)format("woff")}@font-face{font-family:JetBrains Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/jetbrains-mono-latin-400-normal-V6pRDFza.woff2)format("woff2"),url(/assets/jetbrains-mono-latin-400-normal-6-qcROiO.woff)format("woff")}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f2f5f7;font-synthesis:none;text-rendering:optimizelegibility;--background:#0b0f14;--panel:#131a22;--panel-raised:#19222c;--border:#26313d;--border-strong:#394858;--text:#f2f5f7;--muted:#93a1af;--accent:#24c8db;--accent-dark:#087f8e;--success:#35d07f;--warning:#f5b942;--error:#f05a67;background:#0b0f14;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{min-width:320px;height:100%;margin:0}body{background:var(--background)}html,body{overflow:hidden}button,input,select{font:inherit}button,select,input[type=range],input[type=color],summary{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}a{color:var(--accent)}.app-shell{grid-template-rows:auto minmax(0,1fr) auto;height:100dvh;min-height:0;display:grid;position:fixed;inset:0}.app-header{border-bottom:1px solid var(--border);z-index:10;background:#0b0f14f5;justify-content:space-between;align-items:center;gap:16px;min-height:72px;padding:12px 18px;display:flex;position:relative}.brand{color:var(--text);align-items:center;gap:11px;text-decoration:none;display:inline-flex}.brand>span:last-child{gap:2px;display:grid}.brand strong{letter-spacing:-.02em;font-size:16px}.brand small{color:var(--muted);font-size:11px}.brand-mark{color:#82f1fd;background:linear-gradient(90deg,#0000 48%,#24c8db61 49% 51%,#0000 52%),linear-gradient(#0000 48%,#24c8db61 49% 51%,#0000 52%),#14252b;border:1px solid #39717a;border-radius:10px;place-items:center;width:42px;height:42px;font-family:JetBrains Mono,monospace;font-size:12px;font-weight:600;display:grid}.project-actions{align-items:center;gap:8px;min-width:0;display:flex}.history-actions{border:1px solid var(--border);background:#0b1117;border-radius:8px;flex:none;grid-template-columns:34px 34px;gap:2px;padding:3px;display:grid}.history-button{color:#c7d3db;background:0 0;border:0;border-radius:5px;min-height:34px;padding:0;font-size:19px;line-height:1}.history-button:hover:not(:disabled){color:#e8fcff;background:#1a3037}.history-button:disabled{color:#4e5b65;cursor:not-allowed}.header-navigation{justify-content:center;align-items:center;gap:8px;min-width:0;display:flex}.workspace-switch{border:1px solid var(--border);background:#0b1117;border-radius:9px;flex:none;grid-template-columns:repeat(4,1fr);padding:3px;display:grid}.workspace-switch button{min-height:38px;color:var(--muted);white-space:nowrap;background:0 0;border:0;border-radius:6px;padding:0 13px;font-size:11px;font-weight:700}.workspace-switch button.is-active{color:#e8fcff;background:#16464f;box-shadow:inset 0 0 0 1px #247582}.pattern-context-switch{background:#0e171d;border:1px solid #28535b;border-radius:9px;align-items:center;gap:8px;min-height:46px;padding:4px 5px 4px 10px;display:flex}.pattern-context-switch>span{color:#76919d;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;font-family:JetBrains Mono,monospace;font-size:8px;font-weight:700}.pattern-context-switch>div{background:#091015;border-radius:6px;grid-template-columns:auto auto;padding:2px;display:grid}.pattern-context-switch button{min-height:32px;color:var(--muted);background:0 0;border:0;border-radius:5px;padding:0 10px;font-size:10px;font-weight:700}.pattern-context-switch button.is-active{color:#e8fcff;background:#16464f;box-shadow:inset 0 0 0 1px #247582}.pattern-context-switch button:disabled{cursor:not-allowed}.tutorial-header-status{justify-items:end;gap:3px;min-width:190px;font-family:JetBrains Mono,monospace;display:grid}.tutorial-header-status span{color:var(--muted);letter-spacing:.12em;font-size:9px}.tutorial-header-status strong{color:var(--text);font-size:11px}.project-select select{width:min(230px,26vw)}.button,.tool-button{border:1px solid var(--border-strong);min-height:42px;color:var(--text);background:var(--panel-raised);border-radius:8px;font-weight:600;transition:border-color .12s,background .12s,transform .12s}.button{padding:0 15px}.button:hover,.tool-button:hover{background:#202c38;border-color:#52667a}.button:active,.tool-button:active{transform:translateY(1px)}.button:disabled{opacity:.48;cursor:not-allowed}.tool-button:disabled{opacity:.42;cursor:not-allowed}.button--primary{color:#061114;background:var(--accent);border-color:#50e1f1}.button--primary:hover{background:#48d8e8;border-color:#8cf2fc}.button--danger,.danger-text{color:var(--error)!important}.more-menu{position:relative}.more-menu>summary{place-items:center;min-width:44px;list-style:none;display:grid}.more-menu>summary::-webkit-details-marker{display:none}.menu-popover{z-index:30;border:1px solid var(--border-strong);background:#17202a;border-radius:10px;width:250px;padding:7px;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 16px 50px #00000073}.menu-popover button{text-align:left;width:100%;min-height:42px;color:var(--text);background:0 0;border:0;border-radius:6px;padding:9px 10px}.menu-popover button:hover{background:#222e3a}.menu-popover button:disabled{opacity:.4}.workspace{grid-template-columns:380px minmax(0,1fr);min-height:0;display:grid;overflow:hidden}.settings-panel{border-right:1px solid var(--border);background:#10161d;min-height:0;overflow-y:auto}.controls{padding:0 16px 28px}.control-section{border-bottom:1px solid var(--border);padding:20px 2px}.control-section:last-child{border-bottom:0}.control-section--intro{padding-top:16px}.section-heading{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.section-heading h2{letter-spacing:.01em;margin:0;font-size:13px;font-weight:600}.badge{color:#8beaf5;text-transform:uppercase;letter-spacing:.06em;background:#10292e;border:1px solid #285964;border-radius:999px;padding:4px 7px;font-size:10px}.badge--warning{color:#ffd27c;background:#30240f;border-color:#7b5921}.segmented{border:1px solid var(--border);background:#0b1117;border-radius:9px;grid-template-columns:1fr 1fr;margin-bottom:16px;padding:3px;display:grid}.segmented button{min-height:40px;color:var(--muted);background:0 0;border:0;border-radius:6px;font-weight:600}.segmented button.is-active{color:#e8fcff;background:#16464f;box-shadow:inset 0 0 0 1px #247582}.canvas-screen-mode{color:#8beaf5;text-align:center;background:#10292e;border:1px solid #285964;border-radius:8px;margin-bottom:16px;padding:10px 11px;font-size:11px;font-weight:700}.canvas-type-context-note{background:#10292e;border:1px solid #285964;border-radius:8px;grid-template-columns:1fr auto;align-items:center;gap:3px 12px;margin-bottom:16px;padding:10px 11px;display:grid}.canvas-type-context-note span,.canvas-type-context-note small{color:#8aa5af;font-size:9px}.canvas-type-context-note strong{color:#bff9ff;text-transform:uppercase;font-size:11px}.canvas-type-context-note small{grid-column:1/-1}.field{gap:7px;min-width:0;margin:0 0 13px;display:grid}.field>span:first-child,.export-name>span{color:var(--muted);letter-spacing:.015em;font-size:11px;font-weight:600}.field-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.control-subheading{color:#dffaff;letter-spacing:.08em;text-transform:uppercase;margin:2px 0 12px;font-size:11px;font-weight:700}.control-subheading--spaced{border-top:1px solid var(--border);margin-top:8px;padding-top:15px}.projection-geometry-heading{justify-content:space-between;align-items:center;gap:10px;min-height:32px;display:flex}.projection-geometry-lock{border:1px solid var(--border-strong);min-height:30px;color:var(--muted);letter-spacing:0;text-transform:none;white-space:nowrap;background:#0c1218;border-radius:7px;align-items:center;gap:6px;padding:0 9px;font-size:9px;font-weight:700;display:inline-flex}.projection-geometry-lock:hover{color:#dffaff;border-color:#3e8994}.projection-geometry-lock.is-active{color:#bffaff;background:#11323a;border-color:#287887}input:not([type=range],[type=checkbox],[type=color],[type=file]),select{border:1px solid var(--border-strong);width:100%;min-height:42px;color:var(--text);background:#0d1319;border-radius:7px;padding:9px 10px}input[aria-invalid=true]{box-shadow:0 0 0 1px color-mix(in srgb, var(--error) 28%, transparent);border-color:var(--error)!important}.field-error{color:var(--error);font-size:10px;line-height:1.35}.grid-result{border:1px solid var(--border);background:#0b1117;border-radius:7px;gap:3px;margin:2px 0 13px;padding:10px 11px;display:grid}.grid-result>span{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:10px;font-weight:600}.grid-result>strong{color:#dffaff;font-family:JetBrains Mono,monospace;font-size:11px;font-weight:500}.grid-result>small{color:#ffbf69;margin-top:3px;font-size:10px;line-height:1.35}.grid-result>.grid-result__physical{color:var(--muted);margin-top:0;font-family:JetBrains Mono,monospace}.advanced-grid{border-top:1px solid var(--border);margin-top:4px}.advanced-grid>summary{color:var(--muted);cursor:pointer;padding:12px 0 4px;font-size:11px;font-weight:600}.advanced-grid__content{padding-top:10px}input[type=number],.color-text{font-family:JetBrains Mono,monospace;font-size:12px}.input-with-suffix{position:relative}.input-with-suffix input{padding-right:42px!important}.input-with-suffix>span,.input-with-suffix>small{color:var(--muted);pointer-events:none;font-size:11px;position:absolute;top:50%;right:10px;translate:0 -50%}.color-field{grid-template-columns:minmax(0,1fr) auto;align-items:center}.color-field-error{grid-column:1/-1}.color-input{align-items:center;gap:7px;display:flex}input[type=color]{border:1px solid var(--border-strong);background:#0d1319;border-radius:7px;width:42px;height:42px;padding:4px}.color-text{width:92px!important}.toggle-grid{gap:10px;margin-bottom:14px;display:grid}.toggle{color:#d9e0e6;cursor:pointer;align-items:center;gap:9px;min-height:32px;font-size:12px;display:flex}.toggle input{opacity:0;pointer-events:none;position:absolute}.toggle-track{background:#222c36;border:1px solid #475666;border-radius:999px;flex:none;width:36px;height:20px;padding:2px;transition:all .12s}.toggle-track:after{content:"";background:#aab5c0;border-radius:50%;width:14px;height:14px;transition:all .12s;display:block}.toggle input:checked+.toggle-track{background:#175662;border-color:#2392a0}.toggle input:checked+.toggle-track:after{background:#72effb;translate:16px}.toggle input:focus-visible+.toggle-track{outline:2px solid var(--accent);outline-offset:2px}.range-field>span{justify-content:space-between;display:flex}.range-field output{color:var(--text);font-family:JetBrains Mono,monospace}input[type=range]{width:100%;accent-color:var(--accent)}.file-picker{color:#d9e1e8;text-align:center;cursor:pointer;overflow-wrap:anywhere;background:#0d1319;border:1px dashed #526270;border-radius:8px;place-items:center;min-height:46px;padding:11px;font-size:12px;display:grid;position:relative}.file-picker:hover{border-color:var(--accent)}.file-picker input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.control-hint{color:var(--muted);margin:-3px 0 16px;font-size:11px;line-height:1.55}.control-hint strong{color:#dffbff}.power-label-field{margin-top:12px}.route-list{gap:7px;margin-top:17px;display:grid}.route-item{border:1px solid var(--border);background:#0d1319;border-radius:8px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;min-height:48px;padding:6px 7px 6px 10px;display:grid}.route-swatch{width:9px;height:28px;box-shadow:0 0 10px color-mix(in srgb, currentColor 35%, transparent);border-radius:99px}.route-item>span:nth-child(2){gap:2px;min-width:0;display:grid}.route-item strong,.route-item small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.route-item strong{font-size:11px}.route-item small{color:var(--muted);font-size:10px}.route-actions{align-items:center;gap:2px;display:flex}.route-actions button{width:34px;height:34px;color:var(--muted);background:0 0;border:0;border-radius:6px;font-size:19px}.route-actions button:hover{color:var(--error);background:#f05a671a}.route-actions button:first-child:hover{color:var(--accent);background:#36d1dc1a}.route-name-input{font-size:11px;min-height:30px!important;padding:5px 7px!important}.clear-routes{width:100%;margin-top:4px}.preview-panel{background:radial-gradient(circle at 50% 25%,#18232e 0,#0b0f14 58%);grid-template-rows:minmax(0,1fr) auto;gap:12px;min-width:0;min-height:0;padding:16px;display:grid}.preview-panel:has(.canvas-edit-banner){grid-template-rows:auto minmax(0,1fr) auto}.tutorial-page{background-color:#0d1218;background-image:linear-gradient(#59758a0e 1px,#0000 1px),linear-gradient(90deg,#59758a0e 1px,#0000 1px);background-size:32px 32px;min-width:0;min-height:0;overflow-y:auto}.tutorial-content{gap:48px;width:min(1240px,100% - 40px);margin:0 auto;padding:44px 0 64px;display:grid}.tutorial-hero{border-bottom:1px solid var(--border-strong);grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);align-items:end;gap:56px;padding:0 0 42px;display:grid}.tutorial-kicker,.tutorial-section-heading>p,.tutorial-lesson>header>p{color:var(--accent);letter-spacing:.1em;margin:0 0 12px;font-family:JetBrains Mono,monospace;font-size:10px;font-weight:600}.tutorial-hero h1{letter-spacing:-.055em;max-width:760px;margin:0;font-size:clamp(34px,5vw,64px);line-height:.98}.tutorial-lead{color:#b2bdc7;max-width:720px;margin:22px 0 0;font-size:16px;line-height:1.65}.tutorial-hero-actions{flex-wrap:wrap;gap:10px;margin-top:26px;display:flex}.tutorial-hero-actions .button,.tutorial-lesson-actions .button{padding:0 16px}.tutorial-spec{border:1px solid var(--border-strong);background:#111820;grid-template-columns:1fr 1fr;display:grid}.tutorial-spec>div{border-right:1px solid var(--border);border-bottom:1px solid var(--border);flex-direction:column;justify-content:space-between;min-height:105px;padding:18px;display:flex}.tutorial-spec>div:nth-child(2n){border-right:0}.tutorial-spec>div:nth-child(n+3){border-bottom:0}.tutorial-spec span,.tutorial-diagram-header span,.tutorial-diagram-footer,.tutorial-limitations span{color:var(--muted);letter-spacing:.08em;font-family:JetBrains Mono,monospace;font-size:9px}.tutorial-spec strong{font-family:JetBrains Mono,monospace;font-size:18px}.tutorial-paths{gap:18px;display:grid}.tutorial-path-grid{border-top:1px solid var(--border-strong);border-left:1px solid var(--border-strong);grid-template-columns:repeat(4,1fr);display:grid}.tutorial-path-grid button{border:0;border-right:1px solid var(--border-strong);border-bottom:1px solid var(--border-strong);min-height:132px;color:var(--text);text-align:left;background:#111820eb;grid-template-columns:1fr auto;align-content:space-between;gap:8px;padding:18px;transition:background .12s,color .12s;display:grid}.tutorial-path-grid button:hover{background:#14333a}.tutorial-path-grid button>span,.tutorial-path-grid button>em{color:var(--accent);font-family:JetBrains Mono,monospace;font-size:9px;font-style:normal}.tutorial-path-grid button>strong,.tutorial-path-grid button>small{grid-column:1/-1}.tutorial-path-grid button>strong{margin-top:18px;font-size:14px}.tutorial-path-grid button>small{color:#8fa0ad;font-size:10px}.tutorial-guide{border:1px solid var(--border-strong);background:#111820;grid-template-columns:300px minmax(0,1fr);min-height:620px;display:grid}.tutorial-topic-nav{border-right:1px solid var(--border);background:#0d1319;flex-direction:column;gap:4px;padding:10px;display:flex}.tutorial-topic-nav button{min-height:86px;color:var(--muted);text-align:left;background:0 0;border:1px solid #0000;border-radius:7px;grid-template-columns:28px minmax(0,1fr) auto;align-items:start;gap:8px;padding:13px 12px;display:grid}.tutorial-topic-nav button:hover{color:var(--text);background:#151d26}.tutorial-topic-nav button.is-active{color:var(--text);background:#14333a;border-color:#2c6670}.tutorial-topic-nav button>span:first-child,.tutorial-topic-nav em{color:#6f8495;font-family:JetBrains Mono,monospace;font-size:9px;font-style:normal}.tutorial-topic-nav button>span:nth-child(2){gap:4px;display:grid}.tutorial-topic-nav button>span:nth-child(2)>em{color:#5fc9d6;letter-spacing:.09em;font-size:7px}.tutorial-topic-nav strong{font-size:12px}.tutorial-topic-nav small{color:#8393a1;font-size:10px;line-height:1.35}.tutorial-topic-nav em{color:var(--success)}.tutorial-lesson{grid-template-rows:auto minmax(0,1fr) auto;gap:30px;min-width:0;padding:34px;display:grid}.tutorial-lesson>header h2,.tutorial-section-heading h2{letter-spacing:-.025em;margin:0}.tutorial-lesson>header h2{font-size:clamp(24px,3vw,38px)}.tutorial-lesson>header>span{color:#9eacb8;max-width:780px;margin-top:12px;font-size:13px;line-height:1.6;display:block}.tutorial-lesson-body{grid-template-columns:minmax(260px,.8fr) minmax(360px,1.2fr);align-items:stretch;gap:28px;min-width:0;display:grid}.tutorial-step-list{align-content:start;margin:0;padding:0;list-style:none;display:grid}.tutorial-step-list li{border-bottom:1px solid var(--border);grid-template-columns:30px 1fr;gap:9px;padding:15px 0;display:grid}.tutorial-step-list li:first-child{padding-top:0}.tutorial-step-list li>span{color:var(--accent);font-family:JetBrains Mono,monospace;font-size:9px}.tutorial-step-list p{color:#c1cad2;margin:0;font-size:12px;line-height:1.55}.tutorial-instructions{align-content:start;gap:18px;min-width:0;display:grid}.tutorial-field-note{border-left:2px solid var(--accent);background:#0d1d23;gap:6px;padding:12px 13px;display:grid}.tutorial-field-note strong{color:#78e7f3;letter-spacing:.09em;font-family:JetBrains Mono,monospace;font-size:8px}.tutorial-field-note span{color:#9fb1bd;font-size:10px;line-height:1.5}.tutorial-lesson-actions{grid-template-columns:auto 1fr auto;gap:10px;display:grid}.tutorial-lesson-actions .button:nth-child(2){justify-self:center}.tutorial-lesson-actions .button:disabled{opacity:.38;cursor:not-allowed}.tutorial-diagram{background:#080c11;border:1px solid #344352;border-radius:8px;grid-template-rows:auto minmax(0,1fr) auto;min-width:0;min-height:330px;padding:12px;display:grid;overflow:hidden}.tutorial-diagram-header,.tutorial-diagram-footer{justify-content:space-between;align-items:center;gap:12px;min-height:32px;display:flex}.tutorial-diagram-header strong{color:#c5d1da;font-family:JetBrains Mono,monospace;font-size:10px}.tutorial-led-grid{background:#19212a;border:2px solid #d7e0e6;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(8,1fr);display:grid;position:relative}.tutorial-led-grid>span{color:#dce4ea;background:#45505d;border-bottom:2px solid #e6edf2;border-right:2px solid #e6edf2;padding:5px;font-family:JetBrains Mono,monospace;font-size:7px}.tutorial-led-grid>span:nth-child(2n){background:#913d9c}.tutorial-led-grid>span:nth-child(8n){border-right:0}.tutorial-led-grid>span:nth-child(n+25){border-bottom:0}.tutorial-led-grid>strong{color:#fff;background:#05080bd9;border:1px solid #52616f;padding:7px 10px;font-family:JetBrains Mono,monospace;font-size:10px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.tutorial-cable-grid{border:2px solid #dce5eb;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(4,1fr);display:grid;position:relative}.tutorial-cable-grid>span{color:#aebbc6;background:#333d48;border-bottom:2px solid #dce5eb;border-right:2px solid #dce5eb;padding:6px;font-family:JetBrains Mono,monospace;font-size:8px}.tutorial-cable-grid>span:nth-child(2n){background:#314d52}.tutorial-cable-grid>span:nth-child(4n){border-right:0}.tutorial-cable-grid>span:nth-child(n+9){border-bottom:0}.tutorial-cable-grid svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.tutorial-cable-grid polyline{fill:none;stroke:#f5b942;stroke-linecap:round;stroke-linejoin:round;stroke-width:8px}.tutorial-cable-grid circle{fill:#0b0f14;stroke:#fff0bd;stroke-width:4px}.tutorial-projection-grid{background-color:#242d38;background-image:linear-gradient(90deg,#0000 24.5%,#dce5eb 25%,#0000 25.5%),linear-gradient(90deg,#0000 49.5%,#dce5eb 50%,#0000 50.5%),linear-gradient(90deg,#0000 74.5%,#dce5eb 75%,#0000 75.5%),linear-gradient(#0000 32.7%,#dce5eb 33.2%,#0000 33.7%),linear-gradient(#0000 65.7%,#dce5eb 66.2%,#0000 66.7%),linear-gradient(32deg,#0000 49.4%,#5bd2e0 49.8% 50.2%,#0000 50.6%),linear-gradient(-32deg,#0000 49.4%,#5bd2e0 49.8% 50.2%,#0000 50.6%);border:2px solid #dce5eb;place-items:center;display:grid;position:relative;overflow:hidden}.tutorial-projection-grid strong,.tutorial-projection-grid small{z-index:2;background:#070b0fe0;border:1px solid #52616f;padding:6px 9px;font-family:JetBrains Mono,monospace;position:absolute}.tutorial-projection-grid strong{font-size:10px}.tutorial-projection-grid small{color:#b9c5ce;font-size:8px;bottom:10px}.tutorial-projection-cross:before,.tutorial-projection-cross:after{content:"";z-index:1;background:#f5b942;position:absolute}.tutorial-projection-cross:before{width:2px;height:100%;top:0;left:50%}.tutorial-projection-cross:after{width:100%;height:2px;top:50%;left:0}.tutorial-projection-circle{z-index:1;aspect-ratio:1;border:2px solid #f5b942;border-radius:50%;width:42%;position:absolute}.tutorial-geometry-locks span{color:#bffaff}.tutorial-canvas-frame{background-color:#111820;background-image:linear-gradient(#677d8f1a 1px,#0000 1px),linear-gradient(90deg,#677d8f1a 1px,#0000 1px);background-size:18px 18px;border:2px solid #718695;position:relative;overflow:hidden}.tutorial-screen-block{z-index:1;color:#fff;background-color:#1f313dd1;background-image:linear-gradient(#7a9db22e 1px,#0000 1px),linear-gradient(90deg,#7a9db22e 1px,#0000 1px),linear-gradient(32deg,#0000 49.5%,#4ccddcbf 50%,#0000 50.5%),linear-gradient(-32deg,#0000 49.5%,#4ccddcbf 50%,#0000 50.5%);background-size:22px 22px,22px 22px,auto,auto;border:2px dashed #24c8db;place-items:center;display:grid;position:absolute}.tutorial-screen-block span{font-family:JetBrains Mono,monospace;font-size:7px;position:absolute;top:5px;left:5px}.tutorial-screen-block strong{font-family:JetBrains Mono,monospace;font-size:9px}.tutorial-screen-block--a{width:43%;height:76%;top:12%;left:3%}.tutorial-screen-block--b{width:43%;height:76%;top:12%;left:29%}.tutorial-screen-block--c{width:42%;height:76%;top:12%;left:55%}.tutorial-blend-zone{z-index:3;color:#ffd4f0;writing-mode:vertical-rl;background:#ff41be38;border:1px solid #ff70d2;place-items:center;width:17%;height:76%;font-family:JetBrains Mono,monospace;font-size:7px;font-style:normal;display:grid;position:absolute;top:12%}.tutorial-blend-zone--a{left:29%}.tutorial-blend-zone--b{left:55%}.tutorial-corner-point{background:#087d8c;border:2px solid #b9f8ff;border-radius:50%;width:11px;height:11px;position:absolute;bottom:calc(8% - 5px);right:calc(8% - 5px);box-shadow:0 0 0 3px #080c10cc}.tutorial-canvas-frame--led{background-size:14px 14px}.tutorial-led-canvas-screen{color:#effdff;background-color:#253541;background-image:linear-gradient(#bce8ee2e 1px,#0000 1px),linear-gradient(90deg,#bce8ee2e 1px,#0000 1px);background-size:22px 22px;border:2px solid #65dce9;flex-direction:column;justify-content:space-between;padding:9px;display:flex;position:absolute;box-shadow:0 0 0 2px #090e12b3}.tutorial-led-canvas-screen span,.tutorial-led-canvas-screen small{color:#b8cbd4;font-family:JetBrains Mono,monospace;font-size:7px}.tutorial-led-canvas-screen strong{align-self:center;font-family:JetBrains Mono,monospace;font-size:10px}.tutorial-led-canvas-screen--a{width:49%;height:55%;top:15%;left:5%}.tutorial-led-canvas-screen--b{width:31%;height:55%;bottom:12%;right:5%}.tutorial-resolution-panel,.tutorial-tools-panel{border:1px solid var(--border);background-color:#0d1319;background-image:linear-gradient(#3f596a14 1px,#0000 1px),linear-gradient(90deg,#3f596a14 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:18px 18px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;align-content:center;padding:22px;display:grid}.tutorial-resolution-panel{grid-template-columns:1fr auto 1fr;gap:14px}.tutorial-resolution-panel>div:not(.tutorial-resolution-native){background:#151e27;border:1px solid #40505f;flex-direction:column;justify-content:space-between;min-height:86px;padding:13px;display:flex}.tutorial-resolution-panel>div span,.tutorial-resolution-lock small,.tutorial-resolution-native span{color:var(--muted);font-family:JetBrains Mono,monospace;font-size:7px}.tutorial-resolution-panel>div strong{color:#e1fbff;font-family:JetBrains Mono,monospace;font-size:18px}.tutorial-resolution-panel>i{color:#79909f;align-self:center;font-style:normal}.tutorial-resolution-lock{color:#c8fbff;text-align:left;background:#102a30;border:1px solid #2b7783;border-radius:6px;grid-column:1/-1;grid-template-columns:auto 1fr;gap:2px 9px;min-height:56px;padding:9px 12px;display:grid}.tutorial-resolution-lock>span{grid-row:1/3;align-self:center}.tutorial-resolution-lock>strong{font-family:JetBrains Mono,monospace;font-size:10px}.tutorial-resolution-native{border-top:1px solid var(--border);grid-column:1/-1;justify-content:space-between;padding-top:10px;display:flex}.tutorial-resolution-native strong{font-size:9px!important}.tutorial-tools-panel{gap:18px}.tutorial-tools-position{grid-template-columns:1fr 1fr;gap:8px;display:grid}.tutorial-tools-position>span{color:var(--muted);grid-column:1/-1;font-family:JetBrains Mono,monospace;font-size:8px}.tutorial-tools-position label{color:#8396a3;background:#151e27;border:1px solid #40505f;justify-content:space-between;padding:11px;font-family:JetBrains Mono,monospace;font-size:9px;display:flex}.tutorial-tools-position label strong{color:#e1fbff}.tutorial-tools-keys{justify-content:center;align-items:center;gap:7px;display:flex}.tutorial-tools-keys kbd{color:#e3eef3;background:#1a2530;border:1px solid #526675;border-bottom-width:3px;border-radius:5px;padding:8px 10px;font-family:JetBrains Mono,monospace;font-size:8px}.tutorial-tools-keys i,.tutorial-tools-keys span{color:#76dce7;font-size:9px;font-style:normal}.tutorial-tools-actions{border:1px solid var(--border);grid-template-columns:repeat(3,1fr);display:grid}.tutorial-tools-actions span{border-right:1px solid var(--border);color:#9fb0bb;text-align:center;padding:10px 5px;font-family:JetBrains Mono,monospace;font-size:7px}.tutorial-tools-actions span:last-child{border-right:0}.tutorial-project-flow{border:1px solid var(--border);background:#0d1319;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:12px;padding:20px;display:grid}.tutorial-project-flow>div{background:#171f28;border:1px solid #40505f;flex-direction:column;justify-content:space-between;min-height:125px;padding:14px;display:flex}.tutorial-project-flow span,.tutorial-project-flow small{color:var(--muted);font-family:JetBrains Mono,monospace;font-size:8px}.tutorial-project-flow strong{font-size:11px}.tutorial-project-flow>i{background:var(--accent);width:18px;height:1px}.tutorial-ratio-flow{border:1px solid var(--border);background-color:#0d1319;background-image:linear-gradient(#3f596a14 1px,#0000 1px),linear-gradient(90deg,#3f596a14 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:18px 18px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;padding:22px;display:grid}.tutorial-ratio-flow>div{background:#151e27;border:1px solid #40505f;flex-direction:column;justify-content:space-between;min-height:128px;padding:15px;display:flex}.tutorial-ratio-flow>div:last-child{background:#102a30;border-color:#2b7783}.tutorial-ratio-flow span,.tutorial-ratio-flow small{color:var(--muted);letter-spacing:.04em;font-family:JetBrains Mono,monospace;font-size:8px}.tutorial-ratio-flow strong{color:#e1fbff;font-family:JetBrains Mono,monospace;font-size:13px}.tutorial-ratio-flow>i{background:var(--accent);width:34px;height:1px;position:relative}.tutorial-ratio-flow>i:after{content:"";border-top:1px solid var(--accent);border-right:1px solid var(--accent);width:6px;height:6px;position:absolute;top:-3px;right:0;rotate:45deg}.tutorial-ratio-flow>i span{color:#96f5ff;white-space:nowrap;font-style:normal;position:absolute;bottom:7px;left:50%;translate:-50%}.tutorial-section{gap:20px;display:grid}.tutorial-section-heading h2{font-size:24px}.tutorial-feature-grid{border-top:1px solid var(--border-strong);border-left:1px solid var(--border-strong);grid-template-columns:repeat(3,1fr);display:grid}.tutorial-feature-grid article{border-right:1px solid var(--border-strong);border-bottom:1px solid var(--border-strong);background:#111820eb;min-height:170px;padding:22px}.tutorial-feature-grid article>span{color:var(--accent);font-family:JetBrains Mono,monospace;font-size:9px}.tutorial-feature-grid h3{margin:32px 0 8px;font-size:14px}.tutorial-feature-grid p,.tutorial-data-note>p{color:#94a4b1;margin:0;font-size:11px;line-height:1.6}.tutorial-reference-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}.tutorial-shortcuts,.tutorial-data-note{border:1px solid var(--border-strong);background:#111820;padding:24px}.tutorial-shortcuts dl{margin:22px 0 0}.tutorial-shortcuts dl>div{border-bottom:1px solid var(--border);grid-template-columns:150px 1fr;gap:14px;padding:10px 0;display:grid}.tutorial-shortcuts dt{color:#dce5eb;font-family:JetBrains Mono,monospace;font-size:9px}.tutorial-shortcuts dd{color:#93a3b0;margin:0;font-size:10px}.tutorial-data-note>p{margin-top:22px;font-size:12px}.tutorial-limitations{border-top:1px solid var(--border);grid-template-columns:1fr 1fr;gap:10px 18px;margin-top:24px;padding-top:18px;display:grid}.tutorial-limitations strong{grid-column:1/-1;font-size:11px}.tutorial-limitations span:before{content:"— ";color:var(--accent)}.preview-shell{border:1px solid var(--border);background:#0a0d11;border-radius:12px;grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;display:grid;overflow:hidden;box-shadow:0 18px 70px #00000047}.preview-shell:has(.cable-context){grid-template-rows:auto auto minmax(0,1fr)}.preview-toolbar{border-bottom:1px solid var(--border);background:#121920;justify-content:space-between;align-items:center;gap:12px;min-height:58px;padding:9px 10px 9px 14px;display:flex}.cable-context{background:#0c2025;border-bottom:1px solid #285c64;grid-template-columns:minmax(145px,1.1fr) auto auto 82px minmax(120px,.8fr) auto;align-items:end;gap:8px;min-height:64px;padding:8px 10px;display:grid}.cable-context.is-complete{background:#10231a;border-color:#286441;grid-template-columns:auto minmax(140px,1fr) auto;align-items:center}.cable-context.is-complete>strong{color:#a7f3c6;font-size:12px}.cable-context.is-complete>span{color:var(--muted);font-size:11px}.cable-context label{margin:0}.cable-context label>span,.cable-context__width>span{color:#9eb2b6;letter-spacing:.04em;text-transform:uppercase;margin-bottom:4px;font-size:9px;font-weight:700;display:block}.cable-context input:not([type=checkbox],[type=color]){min-height:34px;padding:6px 8px}.cable-context__toggle{color:#dcebed;white-space:nowrap;align-items:center;gap:6px;min-height:34px;font-size:11px;display:flex}.cable-context__toggle input{width:16px;height:16px;accent-color:var(--accent)}.cable-context__compact input[type=color]{width:36px;height:34px;padding:3px}.cable-context__width{position:relative}.cable-context__width input{padding-right:25px!important}.cable-context__width small{color:var(--muted);pointer-events:none;font-size:9px;position:absolute;bottom:10px;right:8px}.cable-context__progress{color:#b8d9dd;white-space:nowrap;align-self:center;font-size:11px}.cable-context__actions{justify-content:flex-end;align-items:center;gap:6px;display:flex}.cable-context__actions .button{white-space:nowrap;min-height:34px;padding:7px 10px}.preview-status{flex-wrap:wrap;align-items:baseline;gap:4px 14px;min-width:0;display:flex}.preview-status strong{font-family:JetBrains Mono,monospace;font-size:12px}.preview-status span{color:var(--muted);font-size:10px}.preview-actions{flex-wrap:wrap;justify-content:flex-end;gap:5px;display:flex}.tool-button{min-width:40px;min-height:40px;padding:0 10px}.tool-button--wide{min-width:52px;font-size:11px}.tool-button.is-active,.cable-tool.is-active{color:#081315;background:var(--accent);border-color:#69eefb}.tool-button--confirm{color:#06130c;background:var(--success);border-color:#3acb7e}.preview-stage{touch-action:none;cursor:grab;background-color:#202832;background-image:linear-gradient(45deg,#2a3540 25%,#0000 25%),linear-gradient(-45deg,#2a3540 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#2a3540 75%),linear-gradient(-45deg,#0000 75%,#2a3540 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;min-width:0;min-height:0;position:relative;overflow:hidden}.preview-stage:active{cursor:grabbing}.preview-stage.is-drawing-cable,.preview-stage.is-drawing-cable:active{cursor:crosshair}.preview-stage canvas{display:block}.canvas-stage{cursor:default}.canvas-stage:active{cursor:grabbing}.canvas-stage.is-moving-screen,.canvas-stage.is-moving-screen:active{cursor:move}.canvas-stage:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.canvas-status-warning{color:var(--warning)!important}.preview-stage:fullscreen{width:100vw;height:100vh}.cursor-readout,.zoom-readout{color:#dce4ea;pointer-events:none;background:#080c10db;border:1px solid #42505e;border-radius:6px;padding:6px 8px;font:500 10px JetBrains Mono,monospace;position:absolute;bottom:10px}.cursor-readout{left:10px}.cursor-readout.is-snapped{color:#b9f8ff;border-color:var(--accent)}.canvas-corner-snap-marker{pointer-events:none;background:#087d8c;border:2px solid #b9f8ff;border-radius:50%;width:9px;height:9px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #080c10b8}.zoom-readout{right:10px}.export-bar{border:1px solid var(--border);background:var(--panel);border-radius:10px;align-items:end;gap:10px;padding:10px;display:flex}.export-name{flex:1;gap:6px;min-width:0;display:grid}.export-name input{font-family:JetBrains Mono,monospace;font-size:11px}.export-button{min-width:140px}.modal-backdrop{z-index:80;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#02060acc;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.export-dialog{background:#0d141b;border:1px solid #344554;border-radius:14px;width:min(760px,100%);max-height:calc(100vh - 40px);padding:22px;overflow-y:auto;box-shadow:0 28px 80px #0000008c}.export-dialog__header{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.export-dialog__header h2{letter-spacing:-.02em;margin:4px 0 0;font-size:22px}.eyebrow{color:var(--accent);letter-spacing:.16em;font-family:JetBrains Mono,monospace;font-size:10px;font-weight:700}.export-dialog__summary{border:1px solid var(--border);background:#080d12;border-radius:8px;gap:3px;margin-top:18px;padding:11px 13px;display:grid}.export-dialog__summary strong{text-overflow:ellipsis;white-space:nowrap;font-family:JetBrains Mono,monospace;font-size:11px;overflow:hidden}.export-dialog__summary span{color:var(--muted);font-size:11px}.export-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px;display:grid}.export-choice{min-height:166px;color:var(--text);text-align:left;background:#111a22;border:1px solid #30404e;border-radius:10px;flex-direction:column;align-items:flex-start;gap:9px;padding:15px;display:flex}.export-choice:hover:not(:disabled),.export-choice:focus-visible{background:#16232d;border-color:#5c7183}.export-choice--primary{background:#10272c;border-color:#2baaba;box-shadow:inset 0 0 0 1px #24c8db1a}.export-choice--resolume{background:#1b1629;border-color:#6a53ad}.export-choice--resolume:hover:not(:disabled),.export-choice--resolume:focus-visible{background:#251c38;border-color:#9f83ef}.export-choice__icon{color:#9beef6;text-align:center;background:#071015;border:1px solid #3e5668;border-radius:5px;min-width:42px;padding:5px 7px;font-family:JetBrains Mono,monospace;font-size:9px;font-weight:700}.export-choice strong{font-size:13px}.export-choice small{color:var(--muted);font-size:11px;line-height:1.5}.export-dialog__note{color:var(--muted);margin:14px 0 0;font-size:11px;line-height:1.55}.export-dialog__note code{color:#b9f8ff;font-family:JetBrains Mono,monospace}.export-dialog__warning{color:#f4d48b;background:#241d10;border:1px solid #735922;border-radius:7px;margin:10px 0 0;padding:9px 11px;font-size:11px;line-height:1.5}.export-dialog__progress{color:#c6faff;background:#0d252b;border:1px solid #275966;border-radius:7px;align-items:center;gap:9px;margin-top:14px;padding:10px 12px;font-size:11px;display:flex}.export-spinner{border:2px solid #9beef64d;border-top-color:#9beef6;border-radius:50%;flex:none;width:14px;height:14px;animation:.7s linear infinite export-spin}@keyframes export-spin{to{transform:rotate(360deg)}}.ratio-guard-page{background-color:#0d1218;background-image:linear-gradient(#59758a0b 1px,#0000 1px),linear-gradient(90deg,#59758a0b 1px,#0000 1px);background-size:32px 32px;min-width:0;min-height:0;overflow-y:auto}.ratio-guard-content{gap:24px;width:min(1320px,100% - 40px);min-width:0;margin:0 auto;padding:40px 0 64px;display:grid}.ratio-guard-content>*,.ratio-guard-grid,.ratio-card,.ratio-results,.ratio-alternatives{min-width:0}.ratio-guard-hero{border-bottom:1px solid var(--border-strong);grid-template-columns:minmax(0,1fr) minmax(270px,.38fr);align-items:end;gap:48px;padding:6px 0 34px;display:grid}.ratio-guard-kicker,.ratio-card-heading>div>span,.ratio-summary-primary>span,.ratio-section-heading>div>span{color:var(--accent);letter-spacing:.12em;margin:0 0 10px;font-family:JetBrains Mono,monospace;font-size:9px;font-weight:700;display:block}.ratio-guard-hero h1{letter-spacing:-.055em;margin:0;font-size:clamp(38px,5vw,62px);line-height:.98}.ratio-guard-hero>div:first-child>p:last-child{color:#aeb9c4;max-width:720px;margin:18px 0 0;font-size:15px;line-height:1.6}.ratio-guard-health{background:#10242a;border:1px solid #36616a;gap:6px;padding:18px;display:grid}.ratio-guard-health[data-state=warning]{background:#251f14;border-color:#735b2e}.ratio-guard-health span,.ratio-guard-health small{color:var(--muted);letter-spacing:.08em;font-family:JetBrains Mono,monospace;font-size:9px}.ratio-guard-health strong{color:#8bf4a9;font-size:14px}.ratio-guard-health[data-state=warning] strong{color:#ffd17a}.ratio-guard-grid{grid-template-columns:minmax(360px,.8fr) minmax(520px,1.2fr);gap:16px;display:grid}.ratio-card,.ratio-results,.ratio-alternatives{border:1px solid var(--border-strong);background:#111820}.ratio-card{padding:22px}.ratio-card-heading,.ratio-section-heading{justify-content:space-between;align-items:flex-start;gap:18px;display:flex}.ratio-card-heading h2,.ratio-section-heading h2{letter-spacing:-.02em;margin:0;font-size:17px}.ratio-lock{border:1px solid var(--border-strong);min-height:36px;color:var(--muted);white-space:nowrap;background:#0c1218;border-radius:7px;align-items:center;gap:7px;padding:0 11px;font-size:10px;font-weight:700;display:inline-flex}.ratio-lock.is-active{color:#bffaff;background:#11323a;border-color:#287887}.ratio-dimensions{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:10px;margin-top:26px;display:grid}.ratio-dimensions label{min-width:0;color:var(--muted);gap:7px;font-size:10px;font-weight:600;display:grid}.ratio-input-wrap{position:relative}.ratio-input-wrap input{font-weight:650;min-height:56px!important;padding:10px 38px 10px 12px!important;font-size:19px!important}.ratio-input-wrap small{color:var(--muted);pointer-events:none;font-size:10px;position:absolute;top:50%;right:12px;translate:0 -50%}.ratio-dimensions-separator{color:#5d6d7c;padding-bottom:17px;font-family:JetBrains Mono,monospace}.ratio-readout{border:1px solid var(--border);background:#0b1117;grid-template-columns:repeat(3,1fr);margin-top:18px;display:grid}.ratio-readout>div,.ratio-summary-specs>div{border-right:1px solid var(--border);gap:5px;min-width:0;padding:13px;display:grid}.ratio-readout>div:last-child,.ratio-summary-specs>div:nth-child(2n){border-right:0}.ratio-readout span,.ratio-summary-specs span{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-size:9px;font-weight:600}.ratio-readout strong,.ratio-summary-specs strong{color:#dffaff;text-overflow:ellipsis;font-family:JetBrains Mono,monospace;font-size:11px;overflow:hidden}.ratio-presets{flex-wrap:wrap;gap:6px;margin-top:12px;display:flex}.ratio-presets button,.ratio-profile-actions button,.ratio-table button{border:1px solid var(--border);min-height:30px;color:var(--muted);background:#0b1117;border-radius:6px;padding:0 9px;font-family:JetBrains Mono,monospace;font-size:9px;font-weight:600}.ratio-presets button:hover,.ratio-profile-actions button:hover,.ratio-table button:hover:not(:disabled){color:var(--text);border-color:#4c6275}.ratio-profile-actions{gap:5px;display:flex}.ratio-profile-groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px;margin-top:20px;display:grid}.ratio-profile-groups fieldset{border:0;gap:7px;min-width:0;margin:0;padding:0;display:grid}.ratio-profile-groups legend{color:#718393;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px;font-family:JetBrains Mono,monospace;font-size:9px;font-weight:700}.ratio-profile-option{border:1px solid var(--border);cursor:pointer;background:#0d1319;border-radius:7px;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:9px;min-width:0;padding:10px;display:grid}.ratio-profile-option:has(input:checked){background:#10272d;border-color:#286a76}.ratio-profile-option input{opacity:0;position:absolute}.ratio-profile-option>span:first-of-type{background:#090e13;border:1px solid #536372;border-radius:4px;place-items:center;width:16px;height:16px;margin-top:1px;display:grid}.ratio-profile-option>span:first-of-type:after{content:"";opacity:0;border-bottom:2px solid #071114;border-left:2px solid #071114;width:7px;height:4px;translate:0 -1px;rotate:-45deg}.ratio-profile-option input:checked+span:first-of-type{border-color:var(--accent);background:var(--accent)}.ratio-profile-option input:checked+span:first-of-type:after{opacity:1}.ratio-profile-option input:focus-visible+span:first-of-type{outline:2px solid var(--accent);outline-offset:2px}.ratio-profile-option>span:last-child{gap:4px;min-width:0;display:grid}.ratio-profile-option strong{font-size:11px}.ratio-profile-option small{color:var(--muted);font-size:9px;line-height:1.4}.ratio-summary{background:linear-gradient(115deg,#102b32,#111820 62%);border:1px solid #30737e;grid-template-columns:minmax(0,1.1fr) minmax(400px,.9fr);display:grid}.ratio-summary-primary{border-right:1px solid #28535b;padding:25px}.ratio-summary-primary h2{color:#e5fdff;letter-spacing:-.04em;margin:0;font-family:JetBrains Mono,monospace;font-size:clamp(25px,3vw,38px)}.ratio-summary-primary p{color:#a6bac1;margin:9px 0 18px;font-size:11px}.ratio-summary-primary .button{min-height:38px;font-size:11px}.ratio-summary-specs{grid-template-columns:repeat(2,1fr);display:grid}.ratio-summary-specs>div{border-bottom:1px solid var(--border);justify-content:center;padding:17px}.ratio-summary-specs>div:nth-child(n+3){border-bottom:0}.ratio-alternatives,.ratio-results{padding:22px}.ratio-section-heading{align-items:end}.ratio-section-heading>p{max-width:480px;color:var(--muted);text-align:right;margin:0;font-size:10px;line-height:1.45}.ratio-alternative-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px;display:grid}.ratio-candidate{border:1px solid var(--border);background:#0d1319;grid-template-rows:auto auto minmax(42px,auto) auto auto;gap:10px;min-width:0;padding:16px;display:grid}.ratio-candidate.is-recommended{background:#10242a;border-color:#317681}.ratio-candidate header{color:#b9c5cf;text-transform:uppercase;justify-content:space-between;align-items:center;gap:10px;font-size:10px;font-weight:700;display:flex}.ratio-candidate header small{color:#9ef6ff;border:1px solid #2c6973;padding:3px 5px;font-family:JetBrains Mono,monospace;font-size:8px}.ratio-candidate>strong{color:#e1fbff;font-family:JetBrains Mono,monospace;font-size:17px}.ratio-candidate p{color:var(--muted);margin:0;font-size:10px;line-height:1.45}.ratio-candidate dl{border-top:1px solid var(--border);grid-template-columns:repeat(2,1fr);gap:8px;margin:0;padding-top:10px;display:grid}.ratio-candidate dl>div{gap:3px;display:grid}.ratio-candidate dt{color:var(--muted);text-transform:uppercase;font-size:8px}.ratio-candidate dd{margin:0;font-family:JetBrains Mono,monospace;font-size:9px}.ratio-candidate .button{min-height:34px;font-size:10px}.ratio-table-wrap{border:1px solid var(--border);margin-top:18px;overflow-x:auto}.ratio-table{border-collapse:collapse;background:#0d1319;width:100%;min-width:940px;font-size:10px}.ratio-table th,.ratio-table td{border-right:1px solid var(--border);border-bottom:1px solid var(--border);text-align:left;vertical-align:top;padding:12px 11px}.ratio-table th:last-child,.ratio-table td:last-child{border-right:0}.ratio-table tbody tr:last-child td{border-bottom:0}.ratio-table th{color:#7f909f;letter-spacing:.07em;text-transform:uppercase;background:#0a1016;font-family:JetBrains Mono,monospace;font-size:8px}.ratio-table td:first-child,.ratio-table td:nth-child(4),.ratio-table td:nth-child(5){white-space:nowrap}.ratio-table td>strong,.ratio-table td>small{display:block}.ratio-table td>strong,.ratio-table td:nth-child(4),.ratio-table td:nth-child(5){font-family:JetBrains Mono,monospace}.ratio-table td>small{color:#718291;max-width:420px;margin-top:5px;font-size:8px;line-height:1.4}.ratio-table ul{color:#e7b75d;margin:0;padding-left:15px;line-height:1.45}.ratio-table-pass{color:#78d99b}.ratio-status{letter-spacing:.05em;text-transform:uppercase;border:1px solid;border-radius:999px;padding:4px 6px;font-family:JetBrains Mono,monospace;font-size:8px;font-weight:700;display:inline-block}.ratio-status--pass{color:#73e49a;background:#10271a;border-color:#296840}.ratio-status--warning{color:#ffd17a;background:#2a2110;border-color:#705622}.ratio-status--adjust{color:#ff929b;background:#2b1518;border-color:#74323a}.ratio-table button:disabled{opacity:.35;cursor:not-allowed}.ratio-table-empty{color:var(--muted);text-align:center!important;padding:28px!important}.ratio-disclaimer{color:#758694;margin:14px 0 0;font-size:9px;line-height:1.55}@media (max-width:1080px){.ratio-guard-grid,.ratio-summary{grid-template-columns:1fr}.ratio-summary-primary{border-bottom:1px solid #28535b;border-right:0}}@media (max-width:720px){.ratio-guard-content{width:min(100% - 20px,680px);padding:26px 0 42px}.ratio-guard-hero{grid-template-columns:1fr;align-items:start;gap:22px}.ratio-card{padding:17px}.ratio-card-heading,.ratio-section-heading{flex-direction:column;align-items:flex-start}.ratio-section-heading>p{text-align:left}.ratio-profile-groups,.ratio-alternative-grid{grid-template-columns:1fr}.ratio-alternatives,.ratio-results{padding:17px}.ratio-summary-specs{grid-template-columns:1fr}.ratio-summary-specs>div,.ratio-summary-specs>div:nth-child(2n),.ratio-summary-specs>div:nth-child(n+3){border-right:0;border-bottom:1px solid var(--border)}.ratio-summary-specs>div:last-child{border-bottom:0}.modal-backdrop{padding:10px}.export-dialog{max-height:calc(100vh - 20px);padding:16px}.export-choice-grid{grid-template-columns:1fr}.export-choice{min-height:118px}}@media (max-width:1180px){.app-header{flex-wrap:wrap}.header-navigation{order:3;width:100%}.workspace-switch{flex:1}}.canvas-controls,.pattern-controls{padding-top:8px}.collapsible-control-section,.collapsible-control-section.control-section--intro{padding:0 2px}.control-section-toggle{width:100%;min-height:62px;color:var(--text);text-align:left;background:0 0;border:0;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 0;display:grid}.control-section-toggle:hover .control-section-chevron{color:#bdf8ff;background:#153138;border-color:#3e8994}.control-section-chevron{border:1px solid var(--border-strong);width:25px;height:25px;color:var(--accent);background:#111a22;border-radius:6px;place-items:center;font-family:JetBrains Mono,monospace;font-size:14px;display:grid}.control-section-title{gap:3px;min-width:0;display:grid}.control-section-title strong{font-size:12px;font-weight:700}.control-section-title small{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-family:JetBrains Mono,monospace;font-size:9px;overflow:hidden}.collapsible-control-content{padding:2px 0 18px}.collapsible-control-content>:last-child{margin-bottom:0}.canvas-add-actions,.canvas-rotation-actions,.canvas-secondary-actions{flex-wrap:wrap;gap:7px;display:flex}.canvas-add-actions .button,.canvas-rotation-actions .button{flex:130px;padding:0 10px;font-size:11px}.canvas-saved-add{grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-top:8px;display:grid}.canvas-saved-add .button{padding:0 12px}.canvas-clipboard-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:8px;display:grid}.canvas-clipboard-actions .button{padding:0 12px}.canvas-clipboard-actions>span{color:var(--muted);text-align:center;grid-column:1/-1;font:9px/1.4 JetBrains Mono,monospace}.canvas-screen-list{gap:6px;margin-top:12px;display:grid}.canvas-screen-row{border:1px solid var(--border);width:100%;min-height:52px;color:var(--text);background:#0b1117;border-radius:7px;grid-template-columns:minmax(0,1fr) auto;display:grid;overflow:hidden}.canvas-screen-row.allows-multi-select{grid-template-columns:34px minmax(0,1fr) auto}.canvas-screen-row:hover{background:#131d26;border-color:#415263}.canvas-screen-row.is-selected{background:#10272c;border-color:#2baaba}.canvas-screen-check{border-right:1px solid var(--border);cursor:pointer;background:#24c8db06;place-items:center;display:grid}.canvas-screen-check input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;margin:0}.canvas-screen-select{min-width:0;color:inherit;text-align:left;background:0 0;border:0;gap:3px;padding:8px 34px 8px 10px;display:grid;position:relative}.canvas-screen-select span{text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700;overflow:hidden}.canvas-screen-select small{color:var(--muted);font-family:JetBrains Mono,monospace;font-size:9px}.canvas-screen-select strong{color:var(--warning);position:absolute;top:50%;right:10px;translate:0 -50%}.canvas-screen-rename-form{align-items:center;min-width:0;padding:7px;display:grid}.canvas-screen-rename-form input{width:100%;min-width:0;min-height:36px;padding:7px 9px}.canvas-screen-actions{align-self:stretch;display:flex}.canvas-screen-edit{border:0;border-left:1px solid var(--border);min-width:48px;color:var(--accent);background:#24c8db0a;padding:0 8px;font-size:10px;font-weight:700}.canvas-screen-edit:hover{color:#c6faff;background:#24c8db24}.canvas-screen-cancel{color:var(--muted)}.canvas-distribution-actions{gap:7px;display:grid}.canvas-distribution-actions .button,.canvas-clear-selection{width:100%}.canvas-clear-selection{margin-top:8px}.badge--blend{color:#ff9cdd;background:#271020;border-color:#7b3569}.canvas-blend-list{gap:6px;display:grid}.canvas-blend-row{background:linear-gradient(135deg,#ff41be1f,#0b1117 58%);border:1px solid #653056;border-radius:7px;gap:4px;padding:9px 10px;display:grid}.canvas-blend-row>div{align-items:center;gap:7px;display:flex}.canvas-blend-row>div small{color:#ff9cdd;margin-left:auto}.canvas-blend-row>span{color:#f5cce8;text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.canvas-blend-row small{color:var(--muted);font-family:JetBrains Mono,monospace;font-size:9px}.canvas-blend-swatch{background:#ff41be73;border:1px solid #ff9cdd;border-radius:2px;flex:none;width:10px;height:10px}.canvas-object-stats{border:1px solid var(--border);background:#0b1117;border-radius:7px;justify-content:space-between;align-items:center;gap:12px;margin:4px 0 12px;padding:9px 10px;display:flex}.canvas-position-heading{margin-top:4px;margin-bottom:8px}.canvas-object-stats span{color:var(--muted);font-size:10px}.canvas-object-stats strong{font-family:JetBrains Mono,monospace;font-size:10px}.canvas-warning{color:#ffd38a;background:#2a210f;border:1px solid #6b5124;border-radius:6px;margin:0 0 9px;padding:8px 9px;font-size:10px;line-height:1.4}.canvas-edit-screen{width:100%;margin-top:3px}.canvas-secondary-actions{margin-top:8px}.canvas-secondary-actions .button{flex:80px;min-height:36px;padding:0 8px;font-size:10px}.canvas-help .control-hint+.control-hint{margin-top:10px}.canvas-edit-banner,.canvas-apply-bar{color:#dffaff;background:#0c2025;border:1px solid #285c64;border-radius:9px;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;font-size:11px;display:flex}.canvas-edit-banner>span:last-child,.canvas-apply-bar>span{color:var(--muted);font-size:10px}.canvas-apply-bar .button{flex:none}.app-footer{border-top:1px solid var(--border);min-height:42px;color:var(--muted);background:#0b0f14;justify-content:space-between;align-items:center;gap:16px;padding:9px 18px;font-size:10px;display:flex}.footer-info{flex-direction:column;gap:2px;min-width:0;display:flex}.footer-copyright{color:var(--text)}.footer-links{white-space:nowrap;flex:none;justify-content:flex-end;align-items:center;gap:12px;display:flex}.notice{z-index:50;border:1px solid var(--border-strong);background:#17202a;border-radius:9px;max-width:min(420px,100vw - 36px);padding:12px 14px;font-size:12px;position:fixed;bottom:58px;right:18px;box-shadow:0 18px 60px #00000073}.notice--success{border-color:#278957}.notice--error{border-color:#a83d48}.notice--info{border-color:#287985}.error-text,.danger-text{color:var(--error)}.fatal-error{min-height:100dvh;color:var(--text);background:var(--page);place-items:center;padding:24px;display:grid}.fatal-error>div{border:1px solid var(--border-strong);background:var(--panel);border-radius:12px;max-width:560px;padding:24px}.fatal-error p{color:var(--muted)}.sr-only{clip:rect(0, 0, 0, 0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}@media (max-width:900px){html,body,#root{height:auto;min-height:100%}html{overflow:hidden auto}body{min-height:100dvh;overflow:visible}#root{min-height:100dvh}.app-shell{height:auto;min-height:100dvh;display:block;position:static;inset:auto}.app-header{flex-wrap:wrap;position:sticky;top:0}.header-navigation{order:3;width:100%}.workspace-switch{flex:1}.tutorial-header-status{min-width:0}.brand small{display:none}.project-actions{flex:1;justify-content:flex-end}.project-select{flex:1;max-width:260px}.project-select select{width:100%}.workspace{flex-direction:column;display:flex;overflow:visible}.tutorial-page,.ratio-guard-page{overflow:visible}.tutorial-content{gap:36px;width:min(100% - 24px,900px);padding:32px 0 48px}.tutorial-hero{grid-template-columns:1fr;align-items:start;gap:30px}.tutorial-spec{grid-template-columns:repeat(4,1fr)}.tutorial-spec>div,.tutorial-spec>div:nth-child(2n),.tutorial-spec>div:nth-child(n+3){border-right:1px solid var(--border);border-bottom:0;min-height:86px}.tutorial-spec>div:last-child{border-right:0}.tutorial-guide{grid-template-columns:1fr}.tutorial-topic-nav{border-right:0;border-bottom:1px solid var(--border);grid-template-columns:repeat(8,minmax(185px,1fr));display:grid;overflow-x:auto}.tutorial-topic-nav button{min-height:76px}.tutorial-reference-grid{grid-template-columns:1fr}.tutorial-path-grid{grid-template-columns:repeat(2,1fr)}.preview-panel{order:-1;grid-template-rows:minmax(360px,52vh) auto;padding:10px}.canvas-edit-banner,.canvas-apply-bar{flex-direction:column;align-items:stretch}.settings-panel{border-right:0;border-top:1px solid var(--border);overflow:visible}.controls{max-width:720px;margin:0 auto}.app-footer{margin-top:0}}@media (max-width:580px){.app-header{gap:8px;padding:9px 10px}.brand-mark{width:38px;height:38px}.brand strong,.tutorial-header-status{display:none}.workspace-switch button{padding:0 6px;font-size:9px}.header-navigation{flex-direction:column;align-items:stretch}.pattern-context-switch{justify-content:space-between}.pattern-context-switch>div{flex:1}.pattern-context-switch button{width:100%}.ratio-dimensions{gap:6px}.ratio-input-wrap input{font-size:15px!important}.ratio-readout{grid-template-columns:1fr}.ratio-readout>div{border-right:0;border-bottom:1px solid var(--border)}.ratio-readout>div:last-child{border-bottom:0}.project-actions{gap:5px}.back-to-canvas{width:100%}.project-actions:has(.back-to-canvas){flex-wrap:wrap}.project-actions>.button{padding:0 10px}.project-select{min-width:105px}.preview-panel{grid-template-rows:minmax(310px,48vh) auto}.preview-panel:has(.cable-context){grid-template-rows:minmax(560px,72vh) auto}.preview-toolbar{flex-direction:column;align-items:flex-start}.preview-actions{justify-content:flex-start;width:100%}.cable-context,.cable-context.is-complete{grid-template-columns:1fr 1fr;align-items:end}.cable-context__name,.cable-context__progress,.cable-context__actions,.cable-context.is-complete>strong,.cable-context.is-complete>span{grid-column:1/-1}.cable-context__actions{flex-wrap:wrap;justify-content:flex-start}.tool-button{flex:44px}.export-bar{flex-direction:column;align-items:stretch}.export-button{width:100%}.field-row{grid-template-columns:1fr;gap:0}.tutorial-content{width:calc(100% - 20px);padding-top:24px}.tutorial-hero{padding-bottom:30px}.tutorial-hero h1{font-size:38px}.tutorial-lead{font-size:14px}.tutorial-hero-actions{flex-direction:column;align-items:stretch}.tutorial-path-grid{grid-template-columns:1fr}.tutorial-spec{grid-template-columns:1fr 1fr}.tutorial-spec>div,.tutorial-spec>div:nth-child(2n),.tutorial-spec>div:nth-child(n+3){border-right:1px solid var(--border);border-bottom:1px solid var(--border)}.tutorial-spec>div:nth-child(2n){border-right:0}.tutorial-spec>div:nth-child(n+3){border-bottom:0}.tutorial-lesson{padding:22px 16px}.tutorial-lesson-body{grid-template-columns:1fr}.tutorial-diagram{min-height:290px}.tutorial-lesson-actions{grid-template-columns:1fr 1fr}.tutorial-lesson-actions .button{width:100%}.tutorial-lesson-actions .button:nth-child(2){grid-area:1/1/auto/-1}.tutorial-feature-grid{grid-template-columns:1fr}.tutorial-feature-grid article{min-height:145px}.tutorial-shortcuts,.tutorial-data-note{padding:20px 16px}.tutorial-shortcuts dl>div{grid-template-columns:115px 1fr}.tutorial-limitations{grid-template-columns:1fr}.tutorial-project-flow{grid-template-columns:1fr;padding:12px}.tutorial-project-flow>div{min-height:84px}.tutorial-project-flow>i{justify-self:center;width:1px;height:14px}.tutorial-ratio-flow{grid-template-columns:1fr;padding:12px}.tutorial-ratio-flow>div{min-height:92px}.tutorial-ratio-flow>i{justify-self:center;width:1px;height:18px}.tutorial-ratio-flow>i:after{top:auto;bottom:0;right:-3px;rotate:135deg}.tutorial-ratio-flow>i span{bottom:4px;left:10px;translate:0}.app-footer{flex-direction:column;align-items:flex-start;gap:3px}.footer-links{flex-wrap:wrap;justify-content:flex-start}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important}}