:root{color-scheme:dark;--bg:#080a09;--panel:#101311;--surface:#171b18;--line:#2b342e;--green:#01ff01;--text:#f1f3ef;--muted:#8b958e;--mono:'Titillium Web',monospace;--display:'Orbitron',Arial,sans-serif;font-family:'Titillium Web','Microsoft YaHei',Arial,sans-serif;font-size:16px;color:var(--text);background:var(--bg)}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,select,input{ -webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{color:inherit;cursor:pointer}button:disabled{opacity:.35;cursor:not-allowed}a{color:inherit;text-decoration:none}button{border:1px solid var(--line);background:transparent}button:hover:not(:disabled){border-color:#6d8274}a:hover{color:var(--green)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--green);outline-offset:4px}img{max-width:100%;display:block}svg{display:block}h1,h2,h3,p{margin:0}button svg{pointer-events:none}::selection{background:var(--green);color:#000}.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 3%;border-bottom:1px solid var(--line);gap:26px}.brand{display:flex;align-items:center;gap:20px}.brand img{width:126px}.brand span{font:11px var(--display);max-width:105px;line-height:1.6;color:var(--muted);letter-spacing:1px}.site-header nav{display:flex;align-items:center;height:100%;gap:34px}.site-header nav a{height:100%;display:flex;align-items:center;gap:8px;position:relative;font-size:14px;color:#a7b0a9}.site-header nav a.active{color:#fff}.site-header nav a.active:after{content:'';position:absolute;height:2px;background:var(--green);bottom:0;left:0;right:0}.site-header nav span{font:10px var(--mono);padding:2px 5px;color:var(--green);border:1px solid #245227}.header-cta{font-size:14px;display:flex;gap:30px;align-items:center}.header-cta span{color:var(--green);font-size:22px}.page{padding:34px 3% 26px}.eyebrow{font:12px var(--display);color:var(--green);letter-spacing:2px}.page-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:28px;gap:30px}.page-heading h1{font:700 clamp(25px,3.1vw,45px)/1.25 var(--display);letter-spacing:-1px;margin-top:12px}.page-heading h1 em{font-style:normal;color:var(--green)}.page-heading .intro{margin-top:13px;font-size:14px;color:var(--muted);line-height:1.8}.steps{display:flex;align-items:center;gap:20px;padding-bottom:6px}.step{display:flex;align-items:center;gap:9px;font-size:14px;color:#7a847d}.step b{font:12px var(--mono);border:1px solid #394239;width:26px;height:26px;display:grid;place-items:center}.step.active{color:#fff}.step.active b{background:var(--green);color:#050905;border-color:var(--green)}.step-line{height:1px;width:28px;background:var(--line)}.workspace{display:grid;grid-template-columns:232px minmax(0,1fr) 282px;border:1px solid #37403a;min-height:626px}.library{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column}.panel-title{padding:20px 18px 17px;display:flex;align-items:center;justify-content:space-between;font-size:15px}.panel-title small{color:var(--muted);font:12px var(--mono);letter-spacing:1px}.categories{display:flex;padding:0 14px 14px;gap:4px;border-bottom:1px solid var(--line)}.category{padding:6px 8px;flex:1;font-size:13px;border-color:transparent;color:var(--muted)}.category.active{color:var(--green);background:#1c291b;border-color:#325033}.module-list{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:14px;align-content:start;flex:1}.module-card{min-width:0;text-align:left;background:#171b18;position:relative;padding:10px 9px 9px;touch-action:none;cursor:grab}.module-card:hover{background:#202822;border-color:#5d7c62}.module-card:active{cursor:grabbing}.module-card img{width:69px;height:64px;object-fit:contain;margin:4px auto 12px;pointer-events:none}.module-card b{display:block;font-weight:400;font-size:13px;line-height:1.5}.module-card small{display:block;font:11px var(--mono);color:var(--muted);margin-top:3px}.module-card .plus{position:absolute;right:7px;top:3px;color:#95a699;font-size:17px}.library-hint{padding:14px 18px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);line-height:1.8;display:flex;gap:9px}.library-hint span:first-child{font-size:22px;color:var(--green)}.canvas{position:relative;display:flex;flex-direction:column;min-width:0;overflow:hidden;background-color:#080e0b;background-image:linear-gradient(#1b42252b 1px,transparent 1px),linear-gradient(90deg,#1b42252b 1px,transparent 1px);background-size:28px 28px}.canvas:after{content:'';pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse at 50% 43%,transparent 0%,#070c0acc 100%)}.canvas>*{position:relative;z-index:1}.canvas-toolbar{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #22372a;font:12px var(--mono);gap:15px;color:#90a195}.canvas-toolbar .tools{display:flex;gap:3px}.icon-btn{min-height:32px;min-width:32px;display:inline-grid;place-items:center;border:0;font-size:18px;color:#a5b4aa}.canvas-label{display:flex;align-items:center;gap:8px;letter-spacing:1px}.canvas-label i{height:6px;width:6px;border:1px solid var(--green);background:#008500;border-radius:50%}.stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;min-height:390px;padding:55px 20px 40px}.stage-corner{position:absolute;width:16px;height:16px;border-color:#41634c;border-style:solid}.stage-corner.tl{top:26px;left:23px;border-width:1px 0 0 1px}.stage-corner.tr{top:26px;right:23px;border-width:1px 1px 0 0}.stage-corner.bl{bottom:20px;left:23px;border-width:0 0 1px 1px}.stage-corner.br{bottom:20px;right:23px;border-width:0 1px 1px 0}.board-meta{position:absolute;top:28px;left:40px;font:11px var(--mono);letter-spacing:2px;color:#607b68}.board-design{width:100%;max-width:570px;transition:transform .2s;transform:scale(var(--zoom,1));transform-origin:center}.measure{display:flex;align-items:center;gap:14px;color:#728c79;font:11px var(--mono);letter-spacing:2px;margin:0 4px 20px}.measure:before,.measure:after{content:'';height:6px;border-top:1px solid #33573d;border-left:1px solid #33573d;border-right:1px solid #33573d;flex:1}.socket-board{--shell:#383e39;display:grid;grid-template-columns:repeat(var(--capacity),minmax(0,1fr));padding:12px 14px;gap:6px;background:linear-gradient(180deg,color-mix(in srgb,var(--shell),white 15%),var(--shell) 10%,color-mix(in srgb,var(--shell),black 45%) 92%,var(--shell));border:1px solid color-mix(in srgb,var(--shell),white 28%);box-shadow:0 15px 50px #000a,0 0 55px #04ff0712,inset 0 0 0 4px #0008;position:relative;border-radius:5px}.socket-board.double{grid-template-columns:repeat(calc(var(--capacity) / 2),minmax(0,1fr));max-width:360px;margin:auto}.slot{aspect-ratio:1;min-width:0;border:1px solid #535c55;border-radius:3px;padding:0;background:#101613;position:relative;touch-action:none;transition:background .15s,border-color .15s}.slot.filled{cursor:grab}.slot .socket-diagram{height:100%;width:100%;pointer-events:none}.slot.selected{outline:2px solid var(--green);outline-offset:3px;z-index:2}.slot.empty{border:1px dashed #738c74;background:#0c160e;color:#829e84;display:grid;place-items:center;font-size:24px}.slot.empty:hover,.slot.drag-over{border-color:var(--green);background:#163d1a;outline:2px solid var(--green);outline-offset:2px}.slot-index{position:absolute;bottom:-37px;left:0;right:0;font:11px var(--mono);color:#6c8773}.double .slot-index{display:none}.board-caption{margin-top:61px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:12px;color:#86a28d}.board-caption span{height:5px;width:5px;background:var(--green)}.canvas-help{position:absolute;bottom:38px;left:0;right:0;text-align:center;font-size:12px;color:#6d8875}.canvas-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 20px;border-top:1px solid #22372a;color:#819687;font-size:12px}.zoom{display:flex;align-items:center;gap:8px}.zoom button{border:0;width:24px;height:26px;font-size:18px;color:#a5b4aa}.view-toggle{display:flex;border:1px solid #344c3a}.view-toggle button{border:0;padding:7px 11px;color:#829687;font-size:12px}.view-toggle button.active{background:#213726;color:#cbe5ce}.settings{background:var(--panel);border-left:1px solid var(--line);display:flex;flex-direction:column}.settings .panel-title{border-bottom:1px solid var(--line)}.setting-section{padding:16px 18px;border-bottom:1px solid var(--line)}.field-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px;font-size:13px}.field-title span:last-child{font:12px var(--mono);color:var(--muted)}.segmented{display:flex;gap:6px}.segmented button{flex:1;padding:6px;font-size:13px;color:var(--muted)}.segmented button.active{color:var(--green);border-color:#4c874e;background:#192819}.swatches{display:flex;gap:9px;flex-wrap:wrap}.swatch{width:22px;height:22px;border-radius:50%;border:1px solid #6f766e;padding:3px;background:var(--swatch);position:relative}.swatch.active:after{content:'';position:absolute;inset:-4px;border:1px solid var(--green);border-radius:50%}.setting-section select,.setting-section input[type=number]{width:100%;background:#171c18;border:1px solid #3b493f;padding:8px 10px;font-size:14px;color:#d3ded5;border-radius:0}.selected-info{display:flex;align-items:center;justify-content:space-between;font-size:13px;margin-bottom:12px}.selected-info span{color:var(--green)}.edit-actions{display:flex;gap:6px;margin-top:13px}.edit-actions button{padding:6px;font-size:12px;flex:1}.configuration-count{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:8px;font-size:13px;color:#b2beb5}.configuration-count b{font:24px var(--display);color:var(--text)}.configuration-count small{color:var(--muted);font-size:13px}.capacity-line{height:3px;background:#2d382f}.capacity-line span{display:block;height:100%;background:var(--green);transition:width .2s}.configuration-notice{font-size:12px;color:var(--muted);line-height:1.7;margin-top:12px}.summary-action{margin-top:auto;padding:17px 18px}.primary-btn{background:var(--green);border:1px solid var(--green);color:#031003;min-height:45px;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:11px 16px;font-size:14px;font-weight:700}.primary-btn:hover:not(:disabled){background:#8bff6e;border-color:#8bff6e;color:#031003}.summary-action .primary-btn{width:100%}.summary-action small{display:block;text-align:center;font-size:11px;color:#6f7f73;margin-top:10px}.under-workspace{display:flex;align-items:center;justify-content:space-between;margin-top:18px;gap:20px;color:var(--muted);font-size:12px}.under-workspace .link{color:#b6c6ba;font-size:13px}.under-workspace code{color:#55735b;font:11px var(--mono);letter-spacing:2px}.drag-ghost{position:fixed;z-index:30;width:80px;height:80px;padding:8px;background:#253d28dd;border:1px solid var(--green);pointer-events:none;box-shadow:0 10px 35px #000b}.drag-ghost img{width:100%;height:100%;object-fit:contain}.dragging{opacity:.35}#toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,20px);z-index:70;background:#dfffda;color:#09200d;padding:12px 23px;font-size:14px;box-shadow:0 5px 35px #000a;opacity:0;pointer-events:none;transition:.2s;max-width:90vw}#toast.show{opacity:1;transform:translate(-50%,0)}footer{border-top:1px solid var(--line);margin-top:22px;padding:25px 3%;display:flex;gap:30px;color:#68766c;font-size:12px;align-items:center}.footer-brand{font:600 19px var(--display);letter-spacing:1px;color:#a0b1a5}footer span:nth-of-type(2){margin-left:auto}dialog{background:#101712;color:var(--text);border:1px solid #4f7255;max-width:690px;width:calc(100% - 32px);padding:0;max-height:85vh}dialog::backdrop{background:#000b;backdrop-filter:blur(6px)}.dialog-inner{padding:30px}.dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.dialog-top h2{font-size:24px}.dialog-subtitle{font-size:14px;color:var(--muted);line-height:1.8;margin-bottom:20px}.config-table{width:100%;border-collapse:collapse;font-size:14px}.config-table th,.config-table td{padding:11px 8px;border-bottom:1px solid var(--line);text-align:left}.config-table th{font-size:12px;color:var(--muted);font-weight:400}.dialog-meta{display:flex;flex-wrap:wrap;gap:12px 24px;color:#a6b8aa;font-size:14px;margin:22px 0}.dialog-actions{display:flex;gap:12px;margin-top:25px}.secondary-btn{padding:11px 18px;min-height:45px;font-size:14px}.empty-settings{color:var(--muted);font-size:13px;line-height:1.8}.content-page{max-width:1440px;margin:auto;padding:64px 5%}.content-page h1{font:700 clamp(32px,5vw,65px)/1.25 var(--display);letter-spacing:-1.5px}.content-page .lead{color:#a9b7ad;font-size:16px;line-height:1.9;max-width:590px;margin-top:25px}.content-page .eyebrow{margin-bottom:20px}.catalog-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:44px}.catalog-tabs{display:flex;gap:10px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:20px;margin-bottom:25px}.catalog-tabs button{padding:9px 22px;font-size:14px}.catalog-tabs button.active{color:var(--green);border-color:var(--green)}.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.product-card{border:1px solid var(--line);background:var(--panel);padding:24px;display:flex;flex-direction:column}.product-photo{height:195px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse,#25332a,transparent 70%);margin:0 0 25px}.product-photo img{max-width:80%;max-height:170px;object-fit:contain;transition:transform .3s}.product-card:hover .product-photo img{transform:translateY(-5px)}.product-card .product-code{font:12px var(--mono);color:#6d8f78;letter-spacing:2px}.product-card h2{font-size:21px;margin:8px 0 12px}.product-card p{font-size:14px;color:var(--muted);line-height:1.8;margin-bottom:20px;flex:1}.product-card button{width:100%;padding:10px 14px;font-size:14px;text-align:left;display:flex;justify-content:space-between}.product-card button span{color:var(--green)}.catalog-note{margin-top:26px;font-size:13px;color:var(--muted);line-height:1.8}.brand-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:50px;align-items:center;margin-bottom:80px}.brand-hero h1{font-size:clamp(36px,4.5vw,66px)}.brand-hero h1 span{color:var(--green)}.brand-hero .primary-btn{display:inline-flex;margin-top:30px;min-width:210px}.brand-image{background:radial-gradient(ellipse,#16311a,transparent 70%);padding:25px;min-height:300px;display:grid;place-items:center}.brand-image img{width:100%;max-height:400px;object-fit:contain}.brand-statement{display:grid;grid-template-columns:1fr 2fr;gap:50px;padding:50px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.brand-statement h2{font-size:24px;line-height:1.7}.brand-statement p{font-size:17px;line-height:2;color:#a0b0a5;max-width:770px}.brand-values{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:50px}.brand-values small{font:13px var(--display);color:var(--green)}.brand-values h3{font-size:20px;margin:20px 0 12px}.brand-values p{font-size:15px;color:var(--muted);line-height:1.9}.support-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;margin-top:50px}.guide-step{display:grid;grid-template-columns:38px 1fr;gap:18px;padding:25px 0;border-top:1px solid var(--line)}.guide-step b{font:18px var(--display);color:var(--green)}.guide-step h3{font-size:18px;margin-bottom:9px}.guide-step p{font-size:15px;line-height:1.8;color:var(--muted)}details{border-top:1px solid var(--line);padding:22px 0}details:last-child{border-bottom:1px solid var(--line)}summary{font-size:16px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:15px}summary:after{content:'+';color:var(--green)}details[open] summary:after{content:'−'}details p{font-size:15px;line-height:1.9;color:var(--muted);margin-top:17px}.support-grid h2{font-size:23px;margin-bottom:25px}.support-banner{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:50px;padding:30px;background:#122015;border:1px solid #324c37}.support-banner h3{font-size:21px;margin-bottom:8px}.support-banner p{font-size:14px;color:var(--muted)}.custom-length{margin-top:10px;display:flex;align-items:center;gap:8px;font-size:13px}.diagram-mode .slot{filter:grayscale(1)}
@media(min-width:1600px){.workspace{grid-template-columns:265px minmax(0,1fr) 310px;min-height:675px}.module-card img{width:85px;height:77px}.board-design{max-width:660px}.stage{min-height:450px}}
@media(max-width:1150px){.brand span{display:none}.site-header nav{gap:24px}.workspace{grid-template-columns:195px minmax(0,1fr) 248px}.module-list{padding:10px;gap:7px}.module-card{padding:7px}.module-card b{font-size:12px}.module-card img{width:58px;height:58px}.categories{padding:0 8px 12px}.category{padding:6px}.page{padding:30px 2%}.settings .setting-section{padding:15px}.steps{gap:10px}.step-line{width:14px}.stage{padding:55px 12px 40px}.socket-board{gap:4px;padding:10px}.canvas-toolbar{padding:15px 12px}.board-caption{font-size:11px}.board-meta{font-size:10px}.brand-hero{gap:30px}.support-grid{gap:40px}}
@media(max-width:960px){.workspace{grid-template-columns:185px minmax(0,1fr)}.settings{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr)}.settings .panel-title{grid-column:1/-1;padding:13px 18px}.settings .setting-section{border-right:1px solid var(--line)}.settings .summary-action{margin:0;display:flex;flex-direction:column;justify-content:center}.steps{display:none}.page-heading h1{font-size:35px}.canvas{min-height:510px}.module-card img{height:54px}.library .module-list{gap:7px}.site-header{gap:15px}.header-cta{display:none}.catalog-grid{grid-template-columns:repeat(2,1fr)}.brand-hero h1{font-size:38px}}
@media(max-width:650px){.site-header{height:auto;min-height:110px;padding:19px 5% 0;flex-wrap:wrap;gap:15px}.brand img{width:112px}.brand span{display:block;font-size:9px;max-width:none}.site-header nav{width:100%;height:44px;justify-content:space-between;gap:10px}.site-header nav a{font-size:13px;white-space:nowrap}.site-header nav span{display:none}.page{padding:27px 4% 20px}.page-heading{margin-bottom:22px}.page-heading h1{font-size:28px;letter-spacing:-.9px}.eyebrow{font-size:10px}.page-heading .intro{font-size:13px;margin-top:10px;max-width:300px}.workspace{display:flex;flex-direction:column}.canvas{order:0;min-height:355px}.stage{min-height:282px;padding:45px 12px 45px}.canvas-toolbar{padding:9px 12px}.board-design{max-width:460px}.canvas-help{bottom:16px;font-size:11px}.board-caption{margin-top:44px;font-size:10px}.board-meta{top:14px;left:20px;letter-spacing:1px}.stage-corner{display:none}.canvas-bottom{padding:9px 12px}.canvas-bottom>span{display:none}.measure{font-size:9px;margin-bottom:14px}.slot-index{bottom:-29px;font-size:10px}.socket-board{padding:9px;gap:4px}.slot.empty{font-size:20px}.library{order:1;border-right:0;border-top:1px solid var(--line)}.library .panel-title{padding:16px 15px 12px}.categories{padding:0 12px 10px}.category{flex:0 1 auto;padding:5px 15px}.module-list{display:flex;overflow-x:auto;gap:9px;padding:13px;scrollbar-width:thin}.module-card{flex:0 0 92px;padding:8px}.module-card img{height:62px;width:66px}.library-hint{display:none}.settings{order:2;grid-template-columns:1fr 1fr}.settings .setting-section{padding:16px 14px}.settings .summary-action{padding:16px 14px}.settings .panel-title{padding:16px 14px}.swatches{gap:10px}.swatch{width:21px;height:21px}.under-workspace{align-items:flex-start;line-height:1.8}.under-workspace code{display:none}.under-workspace p{max-width:230px}.under-workspace a{white-space:nowrap}footer{padding:25px 5%;gap:15px;flex-wrap:wrap}footer span:first-of-type{font-size:11px}footer span:nth-of-type(2){margin-left:0}footer>a:last-child{margin-left:auto}.content-page{padding:40px 5%}.content-page h1{font-size:34px}.catalog-head{align-items:flex-start;flex-direction:column;gap:22px}.catalog-head .primary-btn{min-width:190px}.catalog-tabs{gap:7px}.catalog-tabs button{padding:7px 14px;font-size:13px}.catalog-grid{gap:10px}.product-card{padding:15px}.product-photo{height:135px;margin-bottom:15px}.product-photo img{max-height:115px}.product-card h2{font-size:17px}.product-card p{font-size:13px}.product-card button{font-size:12px;padding:9px}.brand-hero{grid-template-columns:1fr;gap:15px;margin-bottom:35px}.brand-hero h1{font-size:38px}.brand-image{min-height:200px;padding:10px}.brand-image img{max-height:300px}.brand-statement{grid-template-columns:1fr;gap:20px;padding:30px 0}.brand-statement h2{font-size:22px}.brand-statement p{font-size:15px}.brand-values{grid-template-columns:1fr;gap:30px;margin-top:30px}.brand-values h3{margin-top:12px}.support-grid{grid-template-columns:1fr;gap:45px;margin-top:35px}.support-banner{align-items:flex-start;flex-direction:column;padding:22px}.dialog-inner{padding:22px}.dialog-actions{flex-direction:column}.dialog-meta{font-size:13px}.config-table{font-size:13px}.dialog-top h2{font-size:22px}.custom-length{flex-wrap:wrap}}
.workspace{height:696px;min-height:0}.library{min-height:0}.module-list{overflow-y:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#405144 #151c17}.module-card{min-height:137px}.module-price{font:600 14px var(--mono);color:#c4e6c8;display:block;margin-top:5px}.module-card small{font-size:11px;line-height:1.4;min-height:30px;letter-spacing:0}.canvas{min-height:0}.live-price{padding:18px;border-bottom:1px solid var(--line);background:linear-gradient(110deg,#192f1b,#111a13)}.live-price>span{display:flex;justify-content:space-between;font-size:12px;color:#b0c9b4}.live-price>span small{font:12px var(--mono);color:#6e9476}.live-price strong{display:block;font:500 32px var(--display);color:var(--green);letter-spacing:-1px;margin:6px 0 7px}.live-price>small{font-size:11px;color:#829487}.settings .setting-section{padding-top:12px;padding-bottom:12px}.settings .panel-title{padding-top:17px;padding-bottom:17px}.configuration-notice{margin-top:8px}.configuration-count b{font-size:21px}.settings .summary-action{padding-top:12px;padding-bottom:12px}.product-code{display:flex;justify-content:space-between;gap:10px}.product-code span{color:var(--green);font-size:18px;letter-spacing:0}.price-breakdown{border-top:1px solid var(--line);padding-top:16px}.price-breakdown>div{display:flex;justify-content:space-between;margin-bottom:9px;font-size:14px;color:#a2b5a7}.price-breakdown b{font-weight:400;color:#e1eae3}.price-breakdown .price-total{border-top:1px solid var(--line);padding-top:16px;margin-top:16px;align-items:center;color:#d4e5d8}.price-total b{font:26px var(--display);color:var(--green)}
@media(min-width:1600px){.workspace{height:720px}}
@media(max-width:960px){.workspace{height:auto;min-height:0}.library{max-height:560px}.canvas{min-height:560px}.settings .live-price{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 20px;padding:15px 18px}.live-price>span{justify-content:flex-start;gap:12px}.live-price strong{grid-column:2;grid-row:1/3;margin:0;font-size:29px}.live-price>small{grid-column:1}.settings .panel-title{display:none}}
@media(max-width:650px){.canvas{min-height:355px}.library{max-height:none}.module-list{overflow-y:hidden;overflow-x:auto;min-height:165px}.module-card{min-height:140px}.module-card small{font-size:10px;min-height:28px}.module-card img{height:48px;width:55px;margin-bottom:8px}.module-price{font-size:13px}.settings .live-price{position:sticky;bottom:0;z-index:4;background:#182b1a;box-shadow:0 1px 0 #324336}.workspace{position:relative}.settings .setting-section{padding:15px 14px}.config-table th,.config-table td{padding:10px 4px}}
.module-list{grid-auto-rows:174px}.module-card{min-height:174px}.module-card img{height:56px;width:64px;margin:2px auto 9px}.module-card b{font-size:13px;min-height:36px}.module-card small{min-height:29px;font-size:11px}.module-price{margin-top:3px}.stage{justify-content:flex-start;padding-top:150px}.settings{min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#405144 #151c17}.summary-action{position:sticky;bottom:0;background:var(--panel);border-top:1px solid var(--line)}
@media(max-width:960px){.stage{padding-top:120px}.settings{overflow:visible}.summary-action{position:static}}
@media(max-width:650px){.module-list{grid-auto-rows:auto;min-height:183px}.module-card{min-height:156px}.module-card img{height:46px;width:55px}.stage{justify-content:center;padding:45px 12px}.module-card b{min-height:34px;font-size:12px}.module-card small{font-size:10px;min-height:25px}.module-price{margin-top:2px}}
.stage:has(.double){padding-top:85px}.stage:has(.double) .board-caption{margin-top:30px}.mobile-price-bar{display:none}
@media(max-width:650px){body:has(.mobile-price-bar){padding-bottom:80px}.mobile-price-bar{position:fixed;z-index:20;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:12px 5%;background:#101c12f5;backdrop-filter:blur(12px);border-top:1px solid #427248}.mobile-price-bar small{display:block;color:#96ab99;font-size:11px}.mobile-price-bar strong{display:block;font:22px var(--display);color:var(--green);margin-top:5px}.mobile-price-bar .primary-btn{min-height:43px}.stage:has(.double){padding-top:45px;min-height:350px}.stage:has(.double) .board-caption{margin-top:20px}.socket-board.double{max-width:260px}.stage:has(.double) .canvas-help{bottom:10px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Brighter drafting grid and one consistent product vocabulary. */
.canvas{background-color:#060d08;background-image:linear-gradient(#01ff011f 1px,transparent 1px),linear-gradient(90deg,#01ff011f 1px,transparent 1px),linear-gradient(#01ff0133 1px,transparent 1px),linear-gradient(90deg,#01ff0133 1px,transparent 1px);background-size:28px 28px,28px 28px,112px 112px,112px 112px}
.canvas:after{background:radial-gradient(ellipse at 50% 43%,transparent 25%,#060d084d 100%)}
.workspace{user-select:none}.workspace input,.workspace select{user-select:text}
.canvas-toolbar,.canvas-bottom{background:#071109de;border-color:#2f5c36}.board-meta{color:#78a982}.stage-corner{border-color:#58a562}.canvas-help{color:#96c39d}.measure{color:#8bb493}.measure:before,.measure:after{border-color:#4b8456}.slot-index{color:#9abc9f}.board-caption{color:#b0ccb5}
.library-visual{display:block;width:64px;height:64px;margin:0 auto 10px;pointer-events:none}.library-visual svg{width:100%;height:100%;filter:drop-shadow(0 4px 5px #0006)}
.product-photo .socket-diagram{width:150px;height:150px;filter:drop-shadow(0 10px 16px #0007)}.product-photo .module-render{width:150px;height:150px}
.module-render{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--module-color,#383e39);border-radius:3px;border:1px solid #91a09266;box-shadow:inset 0 0 0 4px #10191244;pointer-events:none;padding:5%;overflow:hidden}
.module-render img{display:block;width:100%;height:100%;object-fit:contain;margin:0;max-height:none;max-width:none;filter:drop-shadow(0 2px 2px #0005)}
.control-switch img{transform:scale(1.18)}.control-breaker{padding:4%}.tooltip-visual{width:96px;height:86px;margin:0 auto 13px}.tooltip-visual .socket-diagram{height:100%;width:100%}.tooltip-visual .module-render{height:100%;width:100%}
.slot .module-render img{width:100%;height:100%}.library-visual .module-render img{width:100%;height:100%;margin:0}
.module-card{min-height:174px}.module-card b{min-height:38px}.module-card small{min-height:27px}.module-list{grid-auto-rows:184px}
.socket-board.double{max-width:none;width:100%;gap:7px;padding:16px 19px;grid-template-columns:repeat(calc(var(--capacity) / 2),minmax(0,1fr));box-shadow:0 14px 40px #000a,0 0 38px #04ff071c,inset 0 0 0 5px #0008}
.socket-board.double:before,.socket-board.double:after{content:'';position:absolute;top:9px;bottom:9px;width:13px;border:1px solid #738478;background:radial-gradient(ellipse 2px 7px at center 25%,#030604 95%,transparent),radial-gradient(ellipse 2px 7px at center 75%,#030604 95%,transparent),linear-gradient(90deg,#344139,#536157);z-index:-1}
.socket-board.double:before{left:-12px}.socket-board.double:after{right:-12px}.stage:has(.double){padding-left:30px;padding-right:30px;padding-top:102px}.stage:has(.double) .board-caption{margin-top:25px}
.remove-drop-hint{position:absolute;bottom:70px;left:50%;transform:translateX(-50%) translateY(8px);display:flex;align-items:center;gap:12px;white-space:nowrap;border:1px dashed #a2e8a8;padding:12px 18px;background:#132d17;color:#dcffe0;font-size:14px;opacity:0;pointer-events:none;transition:opacity .12s,transform .12s;z-index:5}.remove-drop-hint>span{font-size:24px;color:var(--green)}.remove-drop-hint small{color:#8db695;font-size:12px}.remove-ready .remove-drop-hint{opacity:1;transform:translateX(-50%)}.remove-ready .socket-board{opacity:.62}.remove-ready{box-shadow:inset 0 0 0 2px #70cc79;background:#26a43a12}.drag-ghost.will-remove{border-style:dashed;opacity:.6}.drag-ghost .socket-diagram{width:100%;height:100%}
#module-tooltip{position:fixed;z-index:90;max-width:min(292px,calc(100vw - 24px));padding:16px 17px;background:#112016f5;border:1px solid #517d59;box-shadow:0 14px 35px #0009;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .12s,transform .12s;color:#e9f2eb;backdrop-filter:blur(8px)}
#module-tooltip.visible{opacity:1;transform:translateY(0)}.tooltip-heading{display:flex;justify-content:space-between;gap:20px;font-size:15px}.tooltip-heading span{color:var(--green);font-family:var(--mono);white-space:nowrap}#module-tooltip p{font-size:14px;line-height:1.8;color:#b4c8ba;margin:9px 0}#module-tooltip>small{font-size:12px;color:#7e9f87;letter-spacing:.3px}
@media(max-width:960px){.stage:has(.double){padding-top:110px}}
@media(max-width:650px){.library-visual{width:52px;height:52px;margin:0 auto 9px}.module-list{min-height:193px}.module-card{min-height:165px}.module-card b{min-height:34px}.product-photo .socket-diagram,.product-photo .module-render{width:105px;height:105px}.stage:has(.double){padding:50px 21px 45px;min-height:330px}.socket-board.double{padding:10px 12px;gap:4px}.socket-board.double:before,.socket-board.double:after{width:9px}.socket-board.double:before{left:-9px}.socket-board.double:after{right:-9px}.stage:has(.double) .board-caption{font-size:10px;margin-top:20px}.remove-drop-hint{bottom:52px;padding:9px 11px;font-size:12px;gap:7px}.remove-drop-hint small{display:none}}

/* Format and cable choices sit together with the build settings. */
.workspace{grid-template-columns:250px minmax(0,1fr) 308px;height:740px}
.settings .live-price{position:sticky;top:0;z-index:5;background:linear-gradient(110deg,#192f1b,#111a13);flex-shrink:0;box-shadow:0 2px 0 #314837}
.settings .format-section{background:linear-gradient(135deg,#1c321d,#122016);border-left:3px solid var(--green);padding:17px 16px 18px}
.format-section>.field-title{font-size:16px;margin-bottom:13px}.format-section>.field-title>span{font-size:10px;letter-spacing:.6px;color:#8db796}
.layout-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}.layout-option{padding:12px 7px 10px;background:#0d170f;border:1px solid #3f6046;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;min-height:105px}
.layout-option b{font-size:15px;font-weight:600}.layout-option small{font-size:12px;color:#9eb5a3}.layout-option.active{border-color:var(--green);background:#1f4020;box-shadow:inset 0 0 0 1px #01ff0133}.layout-option.active b{color:var(--green)}
.layout-glyph{display:grid;grid-template-columns:repeat(4,9px);grid-template-rows:repeat(2,7px);gap:3px;height:20px;align-content:center;margin-bottom:5px}.layout-glyph.single{grid-template-rows:7px}.layout-glyph i{border:1px solid #8aa890;background:#233b28}.layout-option.active .layout-glyph i{border-color:var(--green);background:#01ff012e}
.format-section>.slot-count-label{margin:16px 0 9px;font-size:14px}.segmented button{min-height:36px;font-size:14px}
.cable-options{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.cable-options button{font-size:15px;min-height:49px;padding:7px 2px}.cable-options button small{display:block;font-size:9px;letter-spacing:.5px;line-height:1.3}.cable-options button.active,.custom-cable-toggle.active{color:var(--green);background:#192f1b;border-color:#62a167}
.custom-cable-toggle{display:flex;justify-content:space-between;width:100%;margin-top:7px;padding:6px 10px;font-size:13px;color:#acbfb0}.custom-cable-toggle span{color:var(--green)}.cable-price{font-size:12px;line-height:1.5;color:#91a196;margin-top:9px}.custom-length{font-size:14px}
.selected-module-name{font-size:15px;color:#d5e8d8;margin-bottom:12px}.field-title{gap:9px;font-size:14px}.field-title span:last-child{text-align:right}.edit-actions button{font-size:14px}
.configuration-count>span:last-child{white-space:nowrap}
.layout-status{font:12px var(--mono);letter-spacing:1px;color:#c0ddc6;white-space:nowrap}.layout-status b{font-weight:400;color:#6c9175;margin:0 3px}.canvas-bottom{gap:8px;padding:12px 14px}.canvas-bottom>span:nth-child(2){font-size:11px}
.module-list{grid-auto-rows:198px;gap:8px;padding:12px}.module-card{min-height:198px;padding:10px 9px}.module-card b{font-size:14px;line-height:1.35;min-height:38px}.module-card small{font-size:11px;line-height:1.4;min-height:31px}.library-visual{width:72px;height:72px;margin:0 auto 11px}.module-card .module-price{font-size:15px;margin-top:6px}.categories{padding-left:10px;padding-right:10px;gap:2px}.category{padding:6px 5px;font-size:13px}.panel-title{font-size:16px}.panel-title small{font-size:11px;letter-spacing:.4px}
.module-render{padding:3%;background:linear-gradient(145deg,color-mix(in srgb,var(--module-color),white 10%),var(--module-color) 35%,color-mix(in srgb,var(--module-color),black 25%));border-color:#94a69877;box-shadow:inset 0 0 0 2px #0003}
.module-render img,.product-card:hover .module-render img{transform:scale(var(--asset-scale,1))}.control-switch{--asset-scale:1.18}.control-us15{--asset-scale:1.17}.control-us20{--asset-scale:1.19}.control-usb{--asset-scale:1.1}.control-breaker{--asset-scale:1.08}.control-magnetic{--asset-scale:1.06}.control-filter{--asset-scale:1.12}.control-dualrocker{--asset-scale:1.31}.control-rocker{--asset-scale:1.09}
.product-photo .module-render{width:164px;height:164px}.product-photo .module-render img{width:100%;height:100%;max-height:none;max-width:none}
.page-heading .intro{font-size:16px}.empty-settings,.selected-info,.configuration-count{font-size:14px}.live-price>span{font-size:14px}.live-price>small{font-size:12px}.canvas-help{font-size:12px;padding:0 10px}.under-workspace{flex-wrap:wrap}.product-card p,.guide-step p,.brand-values p,details p{font-size:16px}.catalog-note{font-size:14px}.content-page h1{font-size:clamp(32px,4.3vw,61px)}
@media(max-width:650px){.settings .setting-section:has(.configuration-count){grid-column:1/-1}}
@media(max-width:1200px){.workspace{grid-template-columns:222px minmax(0,1fr) 282px}.library-visual{width:65px;height:65px}.module-list{padding:9px;gap:7px}.module-card{padding:10px 7px}.panel-title{padding-left:13px;padding-right:13px}.canvas-bottom>span:nth-child(2){display:none}.format-section>.field-title>span{font-size:9px}.board-caption{font-size:11px;gap:5px}.canvas-help{font-size:11px}}
@media(max-width:960px){.workspace{grid-template-columns:222px minmax(0,1fr);height:auto}.settings{grid-template-columns:repeat(2,minmax(0,1fr))}.settings .live-price{position:static}.library{max-height:620px}.canvas{min-height:620px}.settings .format-section{grid-row:2/4;grid-column:1}.settings .format-section .layout-option{min-height:120px;justify-content:center}.settings .summary-action{min-height:110px}.canvas-help{font-size:13px}}
@media(max-width:650px){.page-heading h1{font-size:26px}.page-heading .intro{font-size:14px}.workspace{display:flex;height:auto}.canvas{min-height:370px}.library{max-height:none}.module-list{min-height:205px;padding:12px;gap:10px}.module-card{flex-basis:126px;min-height:181px}.library-visual{width:62px;height:62px}.module-card b{font-size:14px;min-height:38px}.module-card small{font-size:11px;min-height:31px}.module-card .module-price{font-size:14px;margin-top:4px}.settings .format-section{grid-column:1/-1;grid-row:auto;padding:18px}.settings .format-section .layout-option{min-height:100px}.format-section>.field-title>span{font-size:11px}.settings .cable-section{grid-column:1/-1;grid-row:4}.cable-options button{min-height:51px}.cable-options button small{font-size:10px}.settings .setting-section{min-width:0}.settings .setting-section .field-title{align-items:flex-start;flex-wrap:wrap}.settings .format-section .field-title,.settings .cable-section .field-title{flex-wrap:nowrap}.settings .summary-action{grid-column:1/-1}.canvas-bottom>.layout-status{display:block;font-size:12px}.canvas-help{font-size:11px;bottom:15px}.board-caption{font-size:10px;gap:4px;white-space:nowrap}.site-header nav a{font-size:14px}.brand span{font-size:10px}.under-workspace{gap:8px}.under-workspace p{max-width:none;font-size:11px}.product-photo .module-render{width:110px;height:110px}.product-card h2{font-size:18px}.product-card p{font-size:14px}.product-card button{font-size:14px}.product-code span{font-size:16px}.catalog-grid{gap:12px}.catalog-note{font-size:13px}.dialog-top h2{font-size:21px}.config-table{font-size:12px}.config-table td:last-child{white-space:nowrap}.dialog-actions .primary-btn{gap:10px}}
/* Shipping is part of the live quote; tax is calculated separately at checkout. */
.shipping-mini{display:flex;justify-content:space-between;gap:12px;margin:10px 0 7px;font-size:11px;color:#a8c1ad}
.shipping-mini b{font:500 12px var(--mono);color:#def0e2;margin-left:5px}
.shipping-policy{padding:13px 17px;border-bottom:1px solid var(--line);background:#122419;display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.shipping-policy b{font-size:12px;font-weight:500;color:#c6e6ce;line-height:1.5}
.shipping-policy span{font-size:11px;color:#8dbb98;line-height:1.5}
.price-breakdown .merchandise-subtotal{padding-top:12px;border-top:1px solid var(--line);margin-top:12px}
@media(max-width:960px){.settings .shipping-policy{grid-column:1/-1}.settings .format-section{grid-row:auto}.live-price .shipping-mini{grid-column:1/-1;justify-content:flex-start;margin:4px 0}.settings .live-price>small{grid-column:1/-1}}
@media(max-width:650px){.settings .cable-section{grid-row:auto}.shipping-mini{gap:20px}}

.recommended-badge{display:block;color:var(--green);font-family:var(--mono);font-size:9px;line-height:12px;min-height:24px;font-weight:600;letter-spacing:0;margin:-3px 0 3px}.module-card:has(.recommended-badge){border-color:#477447}.module-card:has(.recommended-badge) .library-visual{height:53px}

.module-card:has(.recommended-badge){padding-top:8px}.module-card:has(.recommended-badge) .library-visual img{height:38px;margin:1px auto 3px}.safety-guidance{padding:15px 16px;border-bottom:1px solid #34503b;background:#112016}.safety-guidance>b{color:#01ff01;font-size:14px}.safety-guidance p{font-size:12px;line-height:1.5;color:#c5d1c8;margin:8px 0}.safety-guidance strong{font-size:12px}.safety-guidance ul{padding:0;list-style:none;font-size:12px;line-height:1.6;margin:8px 0}.safety-guidance li.complete{color:#01ff01}.safety-guidance small{display:block;font-size:11px;line-height:1.5;color:#a3b0a6;margin-top:7px}

/* Touch gestures: swipe the library horizontally, drag modules vertically. */
[data-drag-type],[data-drag-index]{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.module-drag-active .mobile-price-bar{pointer-events:none;opacity:.2}
.module-drag-active .drag-ghost{z-index:80}
.mobile-library-help{display:none}
@media(max-width:650px){.module-card{touch-action:pan-x pinch-zoom}.module-list{overscroll-behavior-x:contain}.mobile-library-help{display:block;color:var(--muted);padding:0 12px 8px;font-size:12px;line-height:1.5}}

/* Variable-width production modules */
.board-design{width:min(100%,calc(var(--physical-columns,6)*78px + 28px));max-width:none}.socket-board,.socket-board.double{grid-template-columns:repeat(var(--physical-columns,var(--capacity)),minmax(0,1fr));max-width:none}.slot{--span:1;grid-column:span var(--span);aspect-ratio:var(--span)/1}.wide-slot .module-render{padding:2%}.wide-module-card{grid-column:1/-1}.wide-module-card .library-visual{width:100%;height:58px}.wide-module-card .control-filter{--asset-scale:1}.footprint-badge{position:absolute;right:8px;bottom:8px;color:var(--green);font:10px var(--mono);letter-spacing:1px}.wide-module-card .module-price{padding-right:64px}@media(max-width:650px){.wide-module-card{flex-basis:190px}.wide-module-card .library-visual{width:150px;height:58px}}
.socket-board,.socket-board.double{display:flex;flex-direction:column;--module-gap:6px;--unit-width:calc((100% - (var(--row-count) - 1) * var(--module-gap)) / var(--physical-columns));gap:var(--module-gap)}.socket-row{display:flex;justify-content:flex-end;align-items:flex-start;gap:var(--module-gap);min-width:0}.socket-row>.slot{flex:0 0 calc(var(--unit-width) * var(--span));width:calc(var(--unit-width) * var(--span))}@media(max-width:650px){.socket-board,.socket-board.double{--module-gap:4px}}