:root{--bg:#06080d;--text:#f4f7fb;--muted:#9ca3af;--green:#00e07b;--cyan:#19c0ff;--border:#1e2d3d;--card-bg:linear-gradient(180deg, #111827f7, #090c12fc);--warn:#fbbf24;--radius-lg:18px;--radius-pill:999px}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text);background:radial-gradient(circle at top,#111827 0%,#06080d 45%,#020308 100%);min-height:100vh;font-family:system-ui,-apple-system,Segoe UI,sans-serif}.nav{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;max-width:1240px;margin:0 auto;padding:18px 20px;display:flex}.brand{align-items:center;gap:10px;display:flex}.logo{color:#02110b;background:linear-gradient(135deg,#19c0ff,#00e07b);border-radius:12px;place-items:center;width:36px;height:36px;font-size:17px;font-weight:900;display:grid}.brand-text h1{letter-spacing:.18em;text-transform:uppercase;font-size:16px}.brand-text p{color:var(--muted);letter-spacing:.16em;text-transform:uppercase;margin-top:2px;font-size:10px}.nav-links{gap:6px;display:flex}.nav-link{border-radius:var(--radius-pill);color:var(--muted);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;background:#0f172ab3;border:1px solid #94a3b847;padding:6px 14px;font-size:12px;transition:border-color .18s,color .18s}.nav-link:hover{color:var(--text);border-color:#94a3b8b3}.page{display:none}.page.active{display:block}.wizard-wrap{max-width:900px;margin:0 auto;padding:10px 20px 40px}.wizard-shell{background:linear-gradient(135deg,#94a3b812,#0f172af5);border:1px solid #94a3b838;border-radius:32px;padding:28px 30px 30px;box-shadow:0 18px 45px #000000a6}.wizard-eyebrow{letter-spacing:.25em;text-transform:uppercase;color:var(--cyan);text-align:center;margin-bottom:8px;font-size:11px}.wizard-title{letter-spacing:.18em;text-transform:uppercase;text-align:center;font-size:26px}.wizard-sub{color:var(--muted);text-align:center;margin-top:6px;font-size:13px}.progress-wrap{max-width:460px;margin:16px auto 22px}.progress-track{border-radius:var(--radius-pill);background:#1f2937e6;height:4px;overflow:hidden}.progress-bar{background:linear-gradient(90deg, var(--cyan), var(--green));border-radius:inherit;height:100%;transition:width .26s ease-out}.progress-labels{color:var(--muted);text-transform:uppercase;letter-spacing:.16em;justify-content:space-between;margin-top:6px;font-size:11px;display:flex}.progress-labels span.active{color:var(--green)}.step-body{min-height:300px}.step-title{letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px;font-size:17px}.step-sub{color:var(--muted);margin-bottom:18px;font-size:13px}.card-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;display:grid}.c-card{border-radius:var(--radius-lg);border:1px solid var(--border);cursor:pointer;background:radial-gradient(circle at top,#0f172ae6,#020617 55%);flex-direction:column;gap:6px;padding:13px 13px 12px;transition:border-color .16s,box-shadow .16s,transform .12s,background .2s;display:flex}.c-card:hover{border-color:#94a3b899;transform:translateY(-1px)}.c-card.selected{border-color:var(--green);background:radial-gradient(circle at top,#22c55e1f,#020617 55%);box-shadow:0 0 0 1px #22c55e80,0 12px 30px #16a34a66}.c-tag{color:var(--cyan);letter-spacing:.16em;text-transform:uppercase;font-size:10px}.c-label-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.c-label{text-transform:uppercase;letter-spacing:.03em;font-size:13px;font-weight:600}.c-chip{border-radius:var(--radius-pill);color:var(--muted);white-space:nowrap;border:1px solid #94a3b880;padding:3px 9px;font-size:10px}.c-icon{border-radius:var(--radius-pill);background:radial-gradient(circle at top,#38bdf82e,#020617 65%);border:1px solid #94a3b873;place-items:center;width:26px;height:26px;font-size:13px;display:grid}.c-desc{color:var(--muted);font-size:12px;line-height:1.4}.budget-row{grid-template-columns:1fr 110px;align-items:center;gap:14px;margin-bottom:10px;display:grid}.budget-display{text-align:right}.budget-amount{letter-spacing:.12em;font-size:26px}.budget-tier{color:var(--muted);text-transform:uppercase;letter-spacing:.18em;margin-top:4px;font-size:11px}input[type=range]{-webkit-appearance:none;border-radius:var(--radius-pill);background:#111827;outline:none;width:100%;height:6px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--green);cursor:pointer;border:2px solid #022c22;border-radius:50%;width:18px;height:18px;box-shadow:0 0 0 4px #10b98138}.budget-scale{color:var(--muted);justify-content:space-between;margin-top:4px;font-size:11px;display:flex}.tier-chips{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.tier-chip{border-radius:var(--radius-pill);color:var(--muted);text-transform:uppercase;letter-spacing:.14em;cursor:pointer;background:0 0;border:1px solid #94a3b880;padding:4px 9px;font-size:11px}.tier-chip.active{border-color:var(--green);color:var(--green);background:#00e07b1a}.chips-wrap{flex-wrap:wrap;gap:8px;display:flex}.chip-toggle{border-radius:var(--radius-pill);border:1px solid var(--border);color:var(--muted);cursor:pointer;background:#020617;padding:6px 12px;font-size:12px;transition:border-color .14s,background .14s,color .14s}.chip-toggle:hover{border-color:#94a3b8cc}.chip-toggle.selected{border-color:var(--green);color:var(--green);background:#00e07b1a}.field-group{margin-bottom:18px}.field-label-row{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.field-label{text-transform:uppercase;letter-spacing:.16em;font-size:12px}.field-hint{color:var(--muted);font-size:11px}select,.c-input{border-radius:var(--radius-pill);border:1px solid var(--border);width:100%;color:var(--text);background:#020617;outline:none;padding:9px 11px;font-size:13px}select:focus,.c-input:focus{border-color:var(--cyan);box-shadow:0 0 0 1px #19c0ff66}.warning-banner{color:#fecaca;background:#7f1d1d59;border:1px solid #f8717199;border-radius:12px;margin-top:8px;padding:8px 12px;font-size:11px;display:none}.warning-banner.visible{display:block}.cta-row{justify-content:space-between;align-items:center;gap:10px;margin-top:20px;display:flex}.cta-left{color:var(--muted);align-items:center;gap:6px;font-size:11px;display:flex}.cta-dot{background:var(--cyan);border-radius:50%;width:6px;height:6px}.nav-btns{gap:10px;display:flex}.btn{border-radius:var(--radius-pill);color:var(--muted);cursor:pointer;text-transform:uppercase;letter-spacing:.16em;background:0 0;border:1px solid #94a3b880;align-items:center;gap:6px;padding:8px 18px;font-size:13px;transition:border-color .16s,color .16s,background .16s;display:inline-flex}.btn:hover:not(:disabled){color:var(--text);background:#0f172ae6;border-color:#94a3b8e6}.btn-primary{border-color:var(--green);color:#041b14;background:linear-gradient(135deg, var(--green), #22c55e);box-shadow:0 10px 28px #16a34a80}.btn-primary:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-1px)}.btn:disabled{opacity:.4;cursor:default}.loading-page{flex-direction:column;justify-content:center;align-items:center;gap:18px;min-height:80vh;display:flex}.spinner{border:3px solid #00e07b1f;border-top-color:var(--green);border-radius:50%;width:62px;height:62px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-title{letter-spacing:.22em;text-transform:uppercase;font-size:15px}.loading-sub{color:var(--muted);font-size:12px}.loading-steps{flex-direction:column;gap:7px;margin-top:6px;list-style:none;display:flex}.lstep{color:var(--muted);opacity:0;align-items:center;gap:8px;font-size:12px;transition:opacity .35s,transform .35s;display:flex;transform:translateY(5px)}.lstep.show{opacity:1;transform:translateY(0)}.lstep-tick{border:1px solid #94a3b859;border-radius:50%;place-items:center;width:16px;height:16px;font-size:8px;display:grid}.lstep.done .lstep-tick{border-color:var(--green);color:var(--green);background:#00e07b26}.results-wrap{max-width:1240px;margin:0 auto;padding:0 20px 48px}.hero-res{background:linear-gradient(135deg,#19c0ff21,#00e07b14);border:1px solid #ffffff14;border-radius:26px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;padding:22px 26px;display:flex}.ai-badge{border-radius:var(--radius-pill);letter-spacing:.18em;text-transform:uppercase;color:var(--green);background:#00e07b14;border:1px solid #00e07b66;align-items:center;gap:6px;margin-bottom:10px;padding:4px 10px;font-size:10px;display:inline-flex}.ai-dot{background:var(--green);width:7px;height:7px;box-shadow:0 0 8px var(--green);border-radius:50%}.res-title{letter-spacing:.18em;text-transform:uppercase;font-size:24px}.res-sub{color:var(--muted);margin-top:5px;font-size:13px}.hero-stats{flex-wrap:wrap;gap:22px;display:flex}.stat-v{color:var(--green);font-size:26px}.stat-v.cyan{color:var(--cyan)}.stat-l{color:var(--muted);letter-spacing:.18em;text-transform:uppercase;margin-top:2px;font-size:10px}.btn-export{border-radius:var(--radius-pill);cursor:pointer;background:linear-gradient(135deg, var(--green), #22c55e);color:#03120b;letter-spacing:.16em;text-transform:uppercase;border:none;padding:10px 20px;font-size:12px;transition:filter .18s,transform .18s;box-shadow:0 8px 28px #16a34a80}.btn-export:hover{filter:brightness(1.07);transform:translateY(-1px)}.res-grid{grid-template-columns:1.35fr 1fr;gap:18px;display:grid}.r-card{background:var(--card-bg);border:1px solid var(--border);border-radius:22px;padding:20px}.r-card-title{letter-spacing:.2em;text-transform:uppercase;justify-content:space-between;align-items:center;margin-bottom:16px;font-size:12px;display:flex}.badge-sm{border-radius:var(--radius-pill);color:var(--muted);letter-spacing:.14em;text-transform:uppercase;border:1px solid #94a3b859;padding:3px 10px;font-size:10px}.badge-green{color:var(--green);border-color:#00e07b73}.parts-list{flex-direction:column;display:flex}.part-row{cursor:pointer;background:#ffffff05;border:1px solid #0000;border-radius:14px;grid-template-columns:36px 1fr auto 22px;align-items:center;gap:10px;padding:10px 12px;transition:border-color .2s,background .2s;display:grid}.part-row:hover{background:#ffffff0a;border-color:#94a3b84d}.part-row.active{background:#19c0ff0f;border-color:#19c0ff73}.part-icon{background:#ffffff0a;border:1px solid #ffffff12;border-radius:10px;place-items:center;width:34px;height:34px;font-size:16px;display:grid}.part-cat{color:var(--muted);text-transform:uppercase;letter-spacing:.16em;font-size:10px}.part-name{font-size:13px;font-weight:600}.part-price{color:var(--green);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:13px}.part-arrow{color:var(--muted);font-size:14px;transition:transform .25s}.part-row.active .part-arrow{color:var(--cyan);transform:rotate(90deg)}.part-expand{opacity:0;max-height:0;margin:0 0 4px 46px;transition:max-height .38s cubic-bezier(.16,1,.3,1),opacity .28s,transform .32s cubic-bezier(.16,1,.3,1);overflow:hidden;transform:translateY(-6px)}.part-expand.open{opacity:1;max-height:220px;transform:translateY(0)}.part-expand-inner{background:#0a0f1aeb;border:1px solid #19c0ff2e;border-radius:14px;margin:6px 0 4px;padding:13px 15px}.expand-name{margin-bottom:6px;font-size:14px;font-weight:700}.expand-specs{color:var(--muted);font-size:12px;line-height:1.55}.expand-row{flex-wrap:wrap;align-items:center;gap:8px;margin-top:11px;display:flex}.expand-price{color:var(--green);font-size:14px;font-weight:600}.e-tag{border-radius:var(--radius-pill);letter-spacing:.13em;text-transform:uppercase;color:var(--green);border:1px solid #00e07b66;padding:4px 10px;font-size:11px}.e-tag.limited{color:var(--warn);border-color:#fbbf2480}.link-btn{border-radius:var(--radius-pill);letter-spacing:.13em;text-transform:uppercase;border:1px solid var(--cyan);color:var(--cyan);background:#19c0ff14;padding:5px 12px;font-size:11px;text-decoration:none;transition:background .18s}.link-btn:hover{background:#19c0ff2e}.total-row{border-top:1px solid var(--border);justify-content:space-between;align-items:center;margin-top:12px;padding-top:14px;display:flex}.total-label{color:var(--muted);text-transform:uppercase;letter-spacing:.18em;font-size:11px}.total-val{color:var(--green);font-size:20px}.total-note{color:var(--muted);text-align:right;margin-top:4px;font-size:11px}.sidebar{flex-direction:column;gap:16px;display:flex}.perf-item{margin-bottom:13px}.perf-top{justify-content:space-between;margin-bottom:5px;font-size:12px;display:flex}.perf-game{color:var(--muted)}.perf-fps span{color:var(--green);font-weight:600}.perf-res{color:#94a3b880;letter-spacing:.14em;text-transform:uppercase;margin-top:3px;font-size:10px}.bar-track{border-radius:var(--radius-pill);background:#111827;height:6px;overflow:hidden}.bar-fill{border-radius:var(--radius-pill);background:linear-gradient(90deg,var(--cyan),var(--green));width:0%;height:100%;transition:width .7s cubic-bezier(.16,1,.3,1)}.explain-text{color:var(--muted);font-size:13px;line-height:1.6}.explain-text strong{color:var(--text)}.compat-list{flex-direction:column;gap:9px;display:flex}.compat-item{color:var(--muted);align-items:flex-start;gap:8px;font-size:12px;display:flex}.compat-icon{border-radius:50%;flex-shrink:0;place-items:center;width:18px;height:18px;font-size:9px;display:grid}.c-ok{color:var(--green);background:#00e07b26;border:1px solid #00e07b66}.c-warn{color:var(--warn);background:#fbbf2426;border:1px solid #fbbf2466}.tags{flex-wrap:wrap;gap:7px;display:flex}.build-tag{border-radius:var(--radius-pill);letter-spacing:.13em;text-transform:uppercase;color:var(--muted);border:1px solid #94a3b847;padding:5px 11px;font-size:11px}.build-tag.hl{color:var(--cyan);background:#19c0ff12;border-color:#19c0ff73}.btn-restart{border-radius:var(--radius-pill);width:100%;color:var(--muted);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;background:0 0;border:1px solid #94a3b859;padding:10px;font-size:12px;transition:border-color .18s,color .18s}.btn-restart:hover{color:var(--text);border-color:#94a3b8cc}@media (width<=920px){.res-grid{grid-template-columns:1fr}.card-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.budget-row{grid-template-columns:1fr}.budget-display{text-align:left}.cta-row{flex-direction:column;align-items:stretch}.nav-btns{justify-content:flex-end}}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background:#020617d9;place-items:center;width:100%;height:100%;display:grid;position:fixed;top:0;left:0}.game-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:16px;margin-top:20px;padding-bottom:20px;display:grid}@media (width>=600px){.game-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}}.game-card{cursor:pointer;text-align:center;flex-direction:column;align-items:center;transition:transform .2s,filter .2s;display:flex}.game-card:hover{filter:drop-shadow(0 8px 16px #0006);transform:translateY(-4px)scale(1.02)}.game-image{aspect-ratio:3/4;background-position:50%;background-size:cover;border:2px solid #0000;border-radius:12px;width:100%;transition:all .2s;position:relative;box-shadow:0 4px 12px #00000080}.game-card.selected .game-image{border-color:var(--cyan);box-shadow:0 0 20px #19c0ff66}.game-card.selected .game-image:after{content:"";background:#19c0ff33;border-radius:10px;position:absolute;inset:0}.game-check{background:var(--cyan);color:#fff;z-index:10;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;font-weight:700;display:flex;position:absolute;top:8px;right:8px;box-shadow:0 2px 4px #0000004d}.game-name{color:var(--text);margin-top:10px;font-size:13px;font-weight:600;line-height:1.2}.modal-content{border:1px solid var(--border);text-align:center;background:linear-gradient(135deg,#0f172af5,#020617fa);border-radius:24px;width:90%;max-width:420px;padding:30px;box-shadow:0 24px 50px #000c}.modal-content h3{text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px;font-size:18px}.modal-content p{color:var(--muted);margin-bottom:24px;font-size:13px}.modal-options{flex-direction:column;gap:12px;display:flex}.modal-btn{color:var(--text);cursor:pointer;text-align:left;background:#ffffff08;border:1px solid #94a3b833;border-radius:16px;align-items:center;gap:16px;padding:16px;transition:all .2s;display:flex}.modal-btn:hover{background:#ffffff0f;border-color:#19c0ff66;transform:translateY(-2px)}.modal-btn-icon{font-size:24px}.modal-btn-text strong{margin-bottom:4px;font-size:14px;display:block}.modal-btn-text span{color:var(--green);text-transform:uppercase;letter-spacing:.1em;font-size:11px}.modal-close{color:var(--muted);text-transform:uppercase;letter-spacing:.15em;cursor:pointer;background:0 0;border:none;margin-top:24px;font-size:12px;transition:color .2s}.modal-close:hover{color:var(--text)}