:root{--bg:#e7eaec;--panel:#fff;--ink:#1c2228;--muted:#667078;--line:#c9cfd3;--soft:#f4f6f7;--green:#14845c;--green-soft:#dff4eb;--red:#c83e3a;--red-soft:#f9e7e6;--amber:#9a6a16;--focus:#7449d8}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font:14px/1.4 Arial,"Helvetica Neue",sans-serif}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:inherit}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.skip{position:fixed;z-index:20;top:6px;left:6px;background:white;padding:8px;transform:translateY(-150%)}.skip:focus{transform:none}.appbar{height:58px;background:var(--ink);color:white;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 18px;border-bottom:1px solid #000}.logo{display:flex;align-items:center;gap:8px;text-decoration:none}.logo svg{width:28px;fill:none;stroke:#7de0b9;stroke-width:1.8}.logo b{letter-spacing:.04em}.logo span{color:#aab2b8}.demo-flag{font-size:12px;color:#ccd1d4;display:flex;align-items:center;gap:7px}.demo-flag i{width:7px;height:7px;border-radius:50%;background:#f1c75b}.demo-flag b{color:#fff}.reset{justify-self:end;background:transparent;color:white;border:1px solid #687078;padding:7px 12px}.reset:hover{background:#30373e}
.workspace{min-height:calc(100vh - 58px);display:grid;grid-template-columns:290px minmax(540px,1fr) 330px;max-width:1800px;margin:auto;border-left:1px solid var(--line);border-right:1px solid var(--line)}.catalog,.inspector{background:var(--soft)}.catalog{border-right:1px solid var(--line);display:flex;flex-direction:column}.catalog>header,.inspector>header{padding:19px 18px;border-bottom:1px solid var(--line)}.catalog h1,.build h2,.inspector h2{font-size:18px;margin:0}.catalog header p,.inspector header p{color:var(--muted);font-size:12px;margin:4px 0 0}.category-list{display:flex;flex-direction:column;border-bottom:1px solid var(--line)}.category-list button{border:0;border-bottom:1px solid #d8dde0;background:transparent;text-align:left;padding:10px 18px;display:grid;grid-template-columns:90px 1fr;gap:10px;min-height:48px}.category-list button span{font-weight:700}.category-list button b{font:11px/1.4 "Courier New",monospace;color:var(--muted)}.category-list button:hover{background:#fff}.category-list button[aria-current=true]{background:var(--ink);color:#fff}.category-list button[aria-current=true] b{color:#bfc6ca}.variants{padding:15px 12px;min-height:240px}.variants-head{display:flex;justify-content:space-between;align-items:center;padding:0 6px 10px}.variants h2{font-size:13px;margin:0}.variants-head span{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.variant{width:100%;background:white;border:1px solid var(--line);text-align:left;padding:11px;margin-bottom:7px;display:grid;grid-template-columns:1fr auto;gap:4px}.variant b{font-size:12px}.variant span{font:11px "Courier New",monospace;color:var(--muted)}.variant i{grid-row:1/3;grid-column:2;font-style:normal;color:var(--green);align-self:center}.variant:hover{border-color:#707980}.variant.is-selected{border:2px solid var(--ink);padding:10px}
.build{background:var(--panel);min-width:0}.build-head{height:76px;padding:14px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.build-head>div>span{font-size:11px;color:var(--muted)}.build-head label{display:flex;align-items:center;gap:10px;font-size:12px}.build-head select{border:1px solid var(--line);background:white;padding:8px 28px 8px 10px}.build-list{padding:14px 18px 0}.part-row,.empty-slot{display:grid;grid-template-columns:40px 115px minmax(170px,1fr) 150px 26px;gap:10px;align-items:center;min-height:62px;border-bottom:1px solid var(--line)}.part-icon{width:32px;height:32px;border:1px solid var(--line);background:var(--soft);display:grid;place-items:center;font:10px "Courier New",monospace}.part-type{font-weight:700}.part-main b{display:block}.part-main small,.part-spec{font:11px/1.4 "Courier New",monospace;color:var(--muted)}.part-status{font-size:11px;color:var(--green);display:flex;gap:6px;align-items:center}.part-status:before{content:"✓";width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:var(--green-soft);font-weight:700}.part-status.bad{color:var(--red)}.part-status.bad:before{content:"!";background:var(--red-soft)}.part-edit{border:0;background:transparent;font-size:18px;padding:8px}.part-edit:hover{background:var(--soft)}.empty-slot{margin:0 18px;color:var(--muted);border:1px dashed var(--line);padding:0 10px}.empty-slot>span{font-size:24px;text-align:center}.empty-slot div{grid-column:2/4}.empty-slot div small{display:block}.empty-slot button{border:0;background:transparent;color:var(--muted);font-size:11px}.budget-strip{margin-top:14px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1.15fr;background:var(--soft)}.budget-strip>div{padding:16px 20px}.budget-strip>div+div{border-left:1px solid var(--line)}.budget-strip label,.allocation>span b{font-size:11px;font-weight:700;display:block}.budget-input{display:flex;align-items:baseline;gap:7px;font:12px "Courier New",monospace;margin:6px 0}.budget-input input{font:bold 24px Arial,sans-serif;width:150px;border:0;border-bottom:1px solid var(--ink);background:transparent;padding:1px}.budget-strip small{font-size:10px;color:var(--muted)}.bar{height:28px;display:flex;margin-top:10px}.bar i{width:var(--w);display:grid;place-items:center;background:#35424d;color:white;border-right:1px solid white;font:9px Arial,sans-serif;font-style:normal}.bar i:nth-child(2){background:#53626e}.bar i:nth-child(3){background:#73808a}.bar i:nth-child(4){background:#97a1a8}
.inspector{border-left:1px solid var(--line)}.inspector>header>div{display:flex;align-items:center;gap:9px}.status-dot{width:10px;height:10px;border-radius:50%;background:var(--green)}.inspector section{padding:17px 18px;border-bottom:1px solid var(--line)}.inspector h3{font-size:11px;text-transform:uppercase;letter-spacing:.07em;margin:0 0 12px}.checks-panel ul{list-style:none;margin:0;padding:0}.checks-panel li{display:grid;grid-template-columns:20px 1fr;gap:8px;padding:7px 0;font-size:12px}.checks-panel li:before{content:"✓";color:var(--green);font-weight:700}.checks-panel li.bad:before{content:"×";color:var(--red)}.checks-panel li small{display:block;color:var(--muted);font:10px "Courier New",monospace;margin-top:2px}.load-panel>div{display:flex;justify-content:space-between}.load-panel meter{width:100%;height:14px;margin:9px 0}.load-panel p{font-size:11px;color:var(--muted);margin:0}.summary-panel p{font-size:12px;color:var(--muted)}.primary{width:100%;background:var(--ink);color:white;border:0;padding:11px;font-weight:700}.primary:hover{background:#303a42}.copy-state{min-height:17px;color:var(--green)!important}.inspector footer{padding:16px 18px;font-size:11px;color:var(--muted)}.inspector footer b{color:var(--ink)}.inspector footer p{margin:4px 0}.noscript{padding:20px;background:#fff2c7}
@media(max-width:1050px){.workspace{grid-template-columns:230px minmax(500px,1fr)}.inspector{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr 1fr}.inspector>header,.inspector footer{display:none}.inspector section{border-right:1px solid var(--line)}}
@media(max-width:720px){.appbar{height:auto;min-height:56px;grid-template-columns:1fr auto;padding:8px 12px}.logo span,.demo-flag span{display:none}.demo-flag{position:absolute;top:45px;left:12px;color:var(--ink);background:#f1c75b;padding:3px 7px;z-index:2}.demo-flag i{display:none}.workspace{display:flex;flex-direction:column;border:0}.build{order:1;padding-top:17px}.catalog{order:2;border-right:0;border-top:8px solid var(--bg)}.inspector{order:3;display:block;border-top:8px solid var(--bg)}.inspector>header{display:block}.inspector footer{display:block}.build-head{height:auto;display:block;padding:18px 14px 12px}.build-head label{margin-top:12px;display:grid}.build-head select{width:100%}.build-list{padding:8px 12px 0}.part-row{grid-template-columns:34px 82px 1fr 25px;min-height:72px;gap:6px}.part-spec{display:none}.part-status{grid-column:3;font-size:10px}.part-edit{grid-column:4;grid-row:1/3}.empty-slot{margin:0 12px;grid-template-columns:34px 1fr;min-height:58px}.empty-slot div{grid-column:2}.empty-slot button{display:none}.budget-strip{grid-template-columns:1fr}.budget-strip>div+div{border-left:0;border-top:1px solid var(--line)}.catalog>header{padding-top:16px}.category-list{display:grid;grid-template-columns:1fr 1fr}.category-list button{grid-template-columns:1fr;padding:10px 12px}.category-list button b{display:block}.variants{min-height:0}.inspector section{border-right:0}.review{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.part-row{grid-template-columns:40px 115px minmax(170px,1fr) 150px 88px 26px}
@media(max-width:720px){.part-row{grid-template-columns:34px 82px 1fr 25px}}
@media(max-width:720px){.appbar{grid-template-columns:1fr auto auto}.demo-flag{position:static;background:#f1c75b;color:var(--ink);padding:4px 6px}.demo-flag span{display:block;font-size:0}.demo-flag span:after{content:"DEMO";font-size:10px;font-weight:700}.part-row{grid-template-columns:34px 1fr 25px}.part-type{display:none}.part-main{grid-column:2}.part-status{grid-column:2}.part-edit{grid-column:3;grid-row:1/3}}
html,body{overflow-x:hidden}.workspace{width:100%}
@media(max-width:720px){.reset{font-size:0;width:34px;height:34px;padding:0}.reset:after{content:"↺";font-size:18px}.build{width:100%;overflow:hidden}}
.notice{min-height:28px;background:var(--ink);color:#d7dce0;display:flex;justify-content:center;align-items:center;gap:9px;padding:5px 18px;font-size:11px}.notice b{color:#f1c75b}.storebar{height:62px;background:white;display:grid;grid-template-columns:260px 1fr auto;align-items:center;padding:0 20px;border-bottom:1px solid var(--line)}.storebar .logo{color:var(--ink)}.storebar .logo svg{stroke:var(--green)}.storebar nav{display:flex;align-self:stretch}.storebar nav a{display:flex;align-items:center;padding:0 18px;text-decoration:none;font-weight:700;border-bottom:3px solid transparent}.storebar nav a:hover,.storebar nav a[aria-current=page]{border-color:var(--green)}.quote-top{background:var(--ink);color:white;border:0;padding:11px 16px;font-weight:700}.quote-top:hover{background:#34404a}.quickbar{background:#dfe3e5;border-bottom:1px solid #bcc3c8;display:grid;grid-template-columns:260px repeat(3,1fr);padding:10px 20px;gap:8px}.quickbar>div{display:flex;flex-direction:column;justify-content:center}.quickbar>div span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.quickbar>div b{font-size:12px}.quickbar button{background:white;border:1px solid #bbc2c7;padding:9px 12px;text-align:left}.quickbar button:hover{border-color:var(--ink);box-shadow:inset 3px 0 var(--green)}.quickbar button b,.quickbar button small{display:block}.quickbar button small{color:var(--muted);margin-top:2px}.workspace{min-height:calc(100vh - 177px)}
@media(max-width:720px){.notice{justify-content:flex-start;min-height:34px}.notice span{display:none}.storebar{height:58px;grid-template-columns:1fr auto;padding:0 12px}.storebar nav{display:none}.quote-top{font-size:11px;padding:9px}.quickbar{display:flex;overflow-x:auto;padding:8px 12px}.quickbar>div{min-width:135px}.quickbar button{min-width:180px}.workspace{min-height:0}.logo b{font-size:13px}}

/* Retail builder v4 */
:root{--bg:#0d0f12;--panel:#15181d;--ink:#f3f5f6;--muted:#9ba3ab;--line:#30363d;--soft:#111419;--green:#f0c419;--green-soft:#3c3513;--red:#ff665c;--red-soft:#401d1c;--focus:#f0c419}html,body{background:var(--bg);color:var(--ink);font-family:"Space Grotesk",Arial,sans-serif}.notice{background:#f0c419;color:#16181b;font-weight:500}.notice b{color:#16181b}.storebar{background:#0d0f12;border-color:#272c32}.storebar .logo{color:#fff}.storebar .logo svg{stroke:#f0c419}.storebar nav a{color:#cbd0d5}.storebar nav a:hover,.storebar nav a[aria-current=page]{border-color:#f0c419;color:#fff}.quote-top{background:#f0c419;color:#16181b}.quote-top:hover{background:#ffd83d}.quickbar{background:#171b20;border-color:#30363d}.quickbar>div span{color:#f0c419}.quickbar button{background:#22272e;border-color:#353c45;color:white;transition:border-color .18s,background .18s}.quickbar button:hover{border-color:#f0c419;box-shadow:inset 3px 0 #f0c419;background:#282e36}.quickbar button small{color:#aeb5bc}.workspace{grid-template-columns:minmax(0,1fr) 340px;grid-template-rows:auto 1fr;grid-template-areas:"catalog inspector" "build inspector";border:0;gap:1px;background:#30363d}.catalog{grid-area:catalog;border:0;background:#15191e;display:block}.catalog>header{display:none}.category-list{display:grid;grid-template-columns:repeat(7,1fr);border:0}.category-list button{min-height:64px;display:flex;flex-direction:column;gap:5px;border:0;border-right:1px solid #30363d;padding:12px 16px;background:#15191e;color:#fff}.category-list button:hover{background:#20252b}.category-list button[aria-current=true]{background:#f0c419;color:#17191c;box-shadow:none}.category-list button b,.category-list button[aria-current=true] b{color:inherit;opacity:.7}.variants{padding:12px 16px;background:#101318;display:grid;grid-template-columns:170px repeat(3,1fr);gap:10px;min-height:0;border-top:1px solid #30363d}.variants-head{display:block;padding:7px 0}.variants-head h2{font-size:15px}.variants-head span{color:#f0c419}.variants>div:last-child{display:contents}.variant{margin:0;background:#1d2228;border-color:#353c45;color:white;min-height:62px;transition:border-color .18s,background .18s}.variant:hover{border-color:#f0c419;background:#252b32}.variant.is-selected{border:2px solid #f0c419;background:#272a22}.variant i{color:#f0c419}.build{grid-area:build;background:#0f1216;display:grid;grid-template-columns:minmax(300px,38%) 1fr;grid-template-areas:"head head" "preview list" "preview empty" "budget budget";align-content:start}.build-head{grid-area:head;background:#171b20;border-color:#30363d}.build-head select{background:#242a31;border-color:#3b434c;color:#fff}.rig-preview{grid-area:preview;margin:16px 8px 0 16px;background:#090b0e;border:1px solid #30363d;min-height:510px;position:relative;display:flex;flex-direction:column;justify-content:center;overflow:hidden}.rig-preview:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#252a3022 1px,transparent 1px),linear-gradient(90deg,#252a3022 1px,transparent 1px);background-size:24px 24px}.rig-stage{position:relative;width:270px;height:340px;margin:0 auto;z-index:1}.case-shell{position:absolute;inset:15px 25px 35px 25px;border:2px solid #69727c;box-shadow:18px 18px 0 #151a20}.case-shell:before{content:"";position:absolute;inset:14px;border:1px solid #303740}.fan{position:absolute;width:62px;height:62px;border:1px solid #7b858e;border-radius:50%;right:24px}.fan:before,.fan:after{content:"";position:absolute;left:50%;top:5px;width:8px;height:50px;background:#343b43;border-radius:50%;transform:translateX(-50%)}.fan:after{transform:translateX(-50%) rotate(90deg)}.fan-a{top:26px}.fan-b{top:98px}.board-shape{position:absolute;left:28px;top:34px;width:104px;height:130px;border:1px solid #65717c;background:#1c2228}.board-shape:after{content:"CPU";position:absolute;left:27px;top:35px;border:1px solid #f0c419;color:#f0c419;font:11px "IBM Plex Mono";padding:12px}.gpu-shape{position:absolute;left:28px;top:184px;width:165px;height:38px;border:2px solid #f0c419;background:#302d1b}.gpu-shape:after{content:"GPU";position:absolute;right:9px;top:9px;font:11px "IBM Plex Mono"}.ram-shape{position:absolute;left:141px;top:34px;width:10px;height:115px;background:#737d86;box-shadow:15px 0 #737d86}.psu-shape{position:absolute;left:28px;bottom:24px;width:90px;height:48px;border:1px solid #65717c}.axis{position:absolute;color:#89939d;font:10px "IBM Plex Mono"}.axis-x{bottom:5px;left:62px}.axis-y{right:0;top:150px;transform:rotate(90deg)}.rig-caption{position:relative;z-index:1;padding:18px 22px;border-top:1px solid #30363d}.rig-caption span{display:block;color:#f0c419;font-size:11px}.rig-caption b,.rig-caption small{display:block}.rig-caption small{color:#8e979f;margin-top:4px}.build-list{grid-area:list;padding:16px 16px 0 8px}.part-row{grid-template-columns:34px 104px minmax(150px,1fr) 76px 26px;background:#171b20;border:1px solid #30363d;margin-bottom:7px;padding:0 10px;min-height:61px;transition:border-color .18s}.part-row:hover{border-color:#59636d}.part-spec{display:none}.part-icon{background:#252b32;border-color:#3b434c}.part-main small,.part-status,.category-list button b,.variant span,.checks-panel li small{font-family:"IBM Plex Mono",monospace}.part-status{color:#f0c419}.part-status:before{background:#393516;color:#f0c419}.empty-slot{grid-area:empty;margin:0 16px 0 8px;border-color:#3c444d}.budget-strip{grid-area:budget;background:#171b20;border-color:#30363d}.budget-strip>div+div{border-color:#30363d}.budget-input input{color:white;border-color:#707981}.bar i:first-child{background:#f0c419;color:#17191c}.bar i:nth-child(2){background:#8e791c}.bar i:nth-child(3){background:#5f5626}.bar i:nth-child(4){background:#3d3b2f}.inspector{grid-area:inspector;background:#15191e;border:0;position:sticky;top:0;height:calc(100vh - 28px)}.inspector>header,.inspector section{border-color:#30363d}.status-dot{background:#f0c419}.checks-panel li:before{color:#f0c419}.primary{background:#f0c419;color:#17191c}.primary:hover{background:#ffd83d}.inspector footer{color:#939ca4}.inspector footer b{color:#fff}.load-panel meter{accent-color:#f0c419}.copy-state{color:#f0c419!important}
@media(max-width:1050px){.workspace{grid-template-columns:1fr;grid-template-areas:"catalog" "build" "inspector"}.inspector{position:static;height:auto;grid-column:auto;display:grid;grid-template-columns:repeat(3,1fr)}.inspector>header,.inspector footer{display:none}.category-list{grid-template-columns:repeat(4,1fr)}.variants{grid-template-columns:150px repeat(3,1fr)}}
@media(max-width:720px){.notice{background:#f0c419}.quickbar{background:#171b20}.workspace{display:flex}.build{order:1;display:block;background:#0f1216}.rig-preview{display:none}.catalog{order:2;border-top:8px solid #080a0c}.inspector{order:3;display:block;border-top:8px solid #080a0c}.inspector>header,.inspector footer{display:block}.category-list{grid-template-columns:1fr 1fr}.variants{display:block;padding:14px 12px}.variants-head{display:flex}.variant{margin-bottom:8px}.part-row{grid-template-columns:34px 1fr 30px;margin-bottom:6px;padding:0 8px}.part-type{display:none}.part-main{grid-column:2}.part-status{grid-column:2}.part-edit{grid-column:3;grid-row:1/3}.build-list{padding:8px 12px 0}.empty-slot{margin:0 12px}.budget-strip{display:grid}.storebar{background:#0d0f12}.storebar .logo{color:white}.quote-top{background:#f0c419;color:#17191c}}