@import "https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700&family=Space+Grotesk:wght@300;400;500;600;700&display=swap";
.pc-builder-glass{--glass-bg:#ffffff0d;--glass-bg-card:#ffffff12;--glass-bg-icon:#ffffff1a;--glass-bg-input:#ffffff14;--glass-border:#ffffff1a;--glass-border-card:#ffffff26;--glass-border-icon:#fff3;--accent-coral:#e94560;--accent-cyan:#00d9ff;--accent-purple:#533483;--bg-dark-1:#0a0a0a;--bg-dark-2:#111;--bg-dark-3:#1a1a1a;--font-display:"Orbitron",sans-serif;--font-mono:"JetBrains Mono",monospace;--font-body:"Space Grotesk",sans-serif}.font-display{font-family:var(--font-display)}.font-tech-mono{font-family:var(--font-mono)}.font-tech-body{font-family:var(--font-body)}@keyframes blob-move{0%,to{transform:translate(0)scale(1)}25%{transform:translate(30px,-50px)scale(1.1)}50%{transform:translate(-20px,20px)scale(.9)}75%{transform:translate(40px,30px)scale(1.05)}}@keyframes rotate-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shine{0%{left:-100%}50%,to{left:100%}}@keyframes float-up{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-15px)rotate(5deg)}}@keyframes pulse-glow{0%,to{opacity:.5}50%{opacity:1}}@keyframes typing-bounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-4px)}}@keyframes progress-pulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes scale-in{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes type-in{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}@keyframes glitch{0%,to{transform:translate(0)}10%{transform:translate(-2px)}20%{transform:translate(2px)}30%{transform:translate(-1px)}}.glass-background{background:linear-gradient(135deg,var(--bg-dark-1)0%,var(--bg-dark-2)50%,var(--bg-dark-3)100%);min-height:100vh}.glass-blob{pointer-events:none;opacity:.6;border-radius:50%;animation:20s ease-in-out infinite blob-move;position:absolute}.glass-blob-1{background:radial-gradient(circle,#e9456099 0%,#ff6b6b4d 30%,#0000 70%);width:580px;height:580px;animation-delay:0s;top:2%;left:0%}.glass-blob-2{background:radial-gradient(circle,#1a1a1a80 0%,#5334834d 30%,#0000 70%);width:530px;height:530px;animation-delay:-5s;bottom:2%;right:2%}.glass-blob-3{background:radial-gradient(circle,#e9456080 0%,#5334834d 30%,#0000 70%);width:480px;height:480px;animation-delay:-10s;top:45%;left:-3%}.glass-blob-4{background:radial-gradient(circle,#00d9ff80 0%,#1a1a1a4d 30%,#0000 70%);width:430px;height:430px;animation-delay:-15s;top:8%;right:0%}.glass-blob-5{opacity:.4;background:radial-gradient(circle,#00d9ff66 0%,#7dd3fc33 30%,#0000 70%);width:460px;height:460px;animation-delay:-8s;top:35%;left:30%}.glass-blob-6{opacity:.4;background:radial-gradient(circle,#e9456066 0%,#ff8fa333 30%,#0000 70%);width:440px;height:440px;animation-delay:-12s;top:50%;left:45%}.glass-ring{pointer-events:none;border:1px dashed #ffffff1a;animation:30s linear infinite rotate-slow}.glass-ring-reverse{animation-direction:reverse}.glass{-webkit-backdrop-filter:blur(32px);border:1px solid var(--glass-border);background:#0a0a0f80;border-radius:24px}.glass-card{-webkit-backdrop-filter:blur(32px);border:1px solid var(--glass-border-card);background:#0a0a0f80;border-radius:32px;transition:all .5s cubic-bezier(.23,1,.32,1);position:relative;overflow:hidden}.glass-card:before{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#ffffff1a,#0000);width:100%;height:100%;transition:none;position:absolute;top:0;left:-100%}.glass-card:hover:before{animation:1s forwards shine}.glass-card:hover{border-color:#ffffff40;transform:translateY(-10px)scale(1.02);box-shadow:0 25px 50px -12px #00000080,0 0 40px #e9456026}.glass-card-static{-webkit-backdrop-filter:blur(32px);border:1px solid var(--glass-border-card);background:#0a0a0f80;border-radius:24px}.glass-card-sm{-webkit-backdrop-filter:blur(28px);border:1px solid var(--glass-border);background:#0a0a0f80;border-radius:16px}.glass-icon{background:var(--glass-bg-icon);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border-icon);border-radius:20px;transition:all .5s}.glass-icon-hover:hover,.glass-card:hover .glass-icon-animate{background:#e9456033;border-color:#e9456066;transform:scale(1.1)rotate(-5deg);box-shadow:0 0 30px #e945604d}.glass-card:hover .glass-icon-animate-cyan{background:#00d9ff33;border-color:#00d9ff66;transform:scale(1.1)rotate(-5deg);box-shadow:0 0 30px #00d9ff4d}.glass-btn{-webkit-backdrop-filter:blur(10px);background:#e94560cc;border:1px solid #fff3;border-radius:16px;transition:all .3s;position:relative;overflow:hidden}.glass-btn:before{content:"";pointer-events:none;background:linear-gradient(#fff3,#0000);border-radius:16px 16px 0 0;height:50%;position:absolute;top:0;left:0;right:0}.glass-btn:hover{background:#e94560;transform:translateY(-3px);box-shadow:0 10px 30px #e9456066,0 0 20px #e9456033}.glass-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.glass-btn-cyan{background:#00d9ffcc}.glass-btn-cyan:hover{background:#00d9ff;box-shadow:0 10px 30px #00d9ff66,0 0 20px #00d9ff33}.glass-btn-secondary{background:#ffffff1a;border:1px solid #ffffff26}.glass-btn-secondary:hover{background:#ffffff26;box-shadow:0 10px 30px #0000004d}.glass-btn-sm{border-radius:12px}.glass-tag{-webkit-backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #ffffff1a}.glass-badge{-webkit-backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #ffffff26;border-radius:9999px}.glass-badge-good{color:#34d399;background:#10b98133;border-color:#10b9814d}.glass-badge-better{color:#00d9ff;background:#00d9ff33;border-color:#00d9ff4d}.glass-badge-best{color:#e94560;background:#e9456033;border-color:#e945604d}.glass-input{background:var(--glass-bg-input);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border-card);color:#fff;border-radius:16px;transition:all .3s}.glass-input::placeholder{color:#fff6}.glass-input:focus{border-color:var(--accent-coral);outline:none;box-shadow:0 0 20px #e9456033}.glass-input-cyan:focus{border-color:var(--accent-cyan);box-shadow:0 0 20px #00d9ff33}.glass-select{background:var(--glass-bg-input);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border-card);color:#fff;border-radius:12px;transition:all .3s}.glass-select:focus{border-color:var(--accent-coral);outline:none}.glass-select option{background:var(--bg-dark-2);color:#fff}.glass-modal-backdrop{-webkit-backdrop-filter:blur(8px);background:#000000bf}.glass-modal{-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border-card);background:linear-gradient(135deg,#0a0a0ffa,#0f0f16fa);border-radius:24px;box-shadow:0 25px 50px -12px #000000b3}.glass-progress-track{background:#ffffff1a;border-radius:9999px;overflow:hidden}.glass-progress-bar{background:linear-gradient(90deg,var(--accent-coral),var(--accent-cyan));border-radius:9999px;transition:width .5s;animation:2s ease-in-out infinite progress-pulse}.text-gradient{background:linear-gradient(135deg,var(--accent-coral),#ff6b6b,var(--accent-cyan));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.text-gradient-cyan{background:linear-gradient(135deg,var(--accent-cyan),#7dd3fc);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.glow-text{text-shadow:0 0 40px #e9456080}.glow-text-cyan{text-shadow:0 0 40px #00d9ff80}.float-animation{animation:4s ease-in-out infinite float-up}.float-animation-delayed{animation:4s ease-in-out -2s infinite float-up}.slide-up-animation{animation:.5s forwards slide-up}.fade-in-animation{animation:.3s forwards fade-in}.animate-scale-in{animation:.3s cubic-bezier(.34,1.56,.64,1) scale-in}.animate-type-in{animation:.3s ease-out both type-in}.animate-glitch{animation:.5s ease-out glitch}.typing-dot{animation:1.4s ease-in-out infinite typing-bounce}.typing-dot:nth-child(2){animation-delay:.15s}.typing-dot:nth-child(3){animation-delay:.3s}.glass-chat-user{background:linear-gradient(135deg,var(--accent-coral),#ff6b6b);border-radius:20px 20px 4px}.glass-chat-assistant{background:var(--glass-bg-card);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:20px 20px 20px 4px}.glass-component-card{-webkit-backdrop-filter:blur(10px);background:#ffffff08;border:1px solid #ffffff14;border-radius:16px;transition:all .3s}.glass-component-card:hover{background:#ffffff0f;border-color:#ffffff26;transform:translateY(-4px);box-shadow:0 15px 40px #0000004d}.glass-component-card-swapped{border-color:#facc1566;box-shadow:0 0 20px #facc151a}.glass-tier-good{--tier-color:#10b981;--tier-glow:#10b9814d}.glass-tier-better{--tier-color:#00d9ff;--tier-glow:#00d9ff4d}.glass-tier-best{--tier-color:#e94560;--tier-glow:#e945604d}.glass-tier-header{background:linear-gradient(135deg,rgba(var(--tier-rgb),.1),transparent);border-bottom:1px solid #ffffff1a}.glass-tab{background:0 0;border-bottom:2px solid #0000;transition:all .3s}.glass-tab:hover{background:#ffffff0d}.glass-tab-active{border-bottom-color:var(--accent-coral);background:#e945601a}.glass-tab-pill{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;transition:all .3s}.glass-tab-pill:hover{background:#ffffff1a}.glass-tab-pill-active{background:#e9456033;border-color:#e945604d}.glass-scrollbar::-webkit-scrollbar{width:6px;height:6px}.glass-scrollbar::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.glass-scrollbar::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.glass-scrollbar::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.glass-status-compatible{background:#10b98126;border:1px solid #10b9814d}.glass-status-warning{background:#f59e0b26;border:1px solid #f59e0b4d}.glass-status-incompatible{background:#ef44441a;border:1px solid #ef444466}.glass-corner-accent{pointer-events:none;background:linear-gradient(135deg,#e9456033,#0000);border-bottom-left-radius:100px;width:8rem;height:8rem;position:absolute;top:0;right:0}.glass-corner-accent-cyan{background:linear-gradient(135deg,#00d9ff33,#0000)}.glass-select-dropdown{animation:.15s ease-out glass-dropdown-enter}@keyframes glass-dropdown-enter{0%{opacity:0;transform:translateY(-8px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.glass-select-option{position:relative}.glass-select-option:before{content:"";background:0 0;width:3px;transition:background .15s;position:absolute;top:0;bottom:0;left:0}.glass-select-option:hover:before{background:#e9456080}.glass-select-option[data-selected=true]:before{background:#e94560}.glass-range-input{appearance:none;z-index:10;background:0 0}.glass-range-input::-webkit-slider-thumb{appearance:none;cursor:grab;background:#0a84ff;border:2px solid #fff;border-radius:50%;width:20px;height:20px;transition:transform .1s;box-shadow:0 2px 6px #0000004d}.glass-range-input::-webkit-slider-thumb:hover{transform:scale(1.15)}.glass-range-input::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(.95)}.glass-range-input::-moz-range-thumb{cursor:grab;background:#0a84ff;border:2px solid #fff;border-radius:50%;width:20px;height:20px;transition:transform .1s;box-shadow:0 2px 6px #0000004d}.glass-range-input::-moz-range-thumb:hover{transform:scale(1.15)}.glass-range-input::-moz-range-thumb:active{cursor:grabbing;transform:scale(.95)}@media (max-width:768px){.glass-blob{opacity:.5}.glass-blob-1{width:340px;height:340px}.glass-blob-2{width:320px;height:320px}.glass-blob-3{width:290px;height:290px}.glass-blob-4{width:260px;height:260px}.glass-blob-5{width:280px;height:280px}.glass-blob-6{width:270px;height:270px}.glass-card{border-radius:24px}.glass-card:hover{transform:translateY(-5px)scale(1.01)}}
