:root{font-family:Inter,'Segoe UI','Microsoft YaHei',system-ui,sans-serif;color:#192a43;background:#f7f9fd;--blue:#2563eb;--muted:#8491a5;--line:#e4eaf3}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit}button:disabled{cursor:default;opacity:.4}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #93b6ff;outline-offset:3px}[hidden]{display:none!important}.icon{width:21px;height:21px;flex-shrink:0;vertical-align:middle}.skip{position:fixed;top:-100px;left:15px;z-index:100;background:var(--blue);padding:10px;color:#fff}.skip:focus{top:15px}.header{height:84px;background:#ffffffec;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40;backdrop-filter:blur(12px)}.header-inner{max-width:1320px;padding:0 34px;margin:auto;display:flex;align-items:center;justify-content:space-between;height:100%;gap:30px}.brand{display:flex;align-items:center;gap:11px;flex-shrink:0}.brand img{width:38px;height:38px;box-shadow:0 4px 12px #2563eb20;border-radius:10px}.brand>span{font-size:24px;font-weight:750;letter-spacing:-.5px}.brand>span>span{font-weight:600;margin-left:4px}.brand small{display:block;font-size:7px;letter-spacing:1.5px;color:#8392a6;font-weight:500;margin-top:3px}#nav{display:flex;height:100%;align-items:center;gap:36px}#nav button{font-size:13px;font-weight:500;height:100%;padding:0;position:relative;color:#8390a3;white-space:nowrap}#nav button.active{color:var(--blue)}#nav button.active:after{content:'';height:3px;position:absolute;bottom:0;left:0;right:0;background:var(--blue);border-radius:3px}#nav b{font-size:9px;padding:2px 5px;background:#eaf1ff;border-radius:4px;margin-left:6px}.favorites-toggle{font-size:22px;display:flex;align-items:center;gap:7px;color:#77869b}.favorites-toggle>span{font-size:12px}.favorites-toggle>b{font-size:10px;background:#edf2fa;min-width:18px;height:18px;border-radius:6px;display:grid;place-items:center;font-weight:500}.favorites-toggle.active{color:var(--blue)}.container{max-width:1320px;margin:auto;padding:36px 34px 0}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:390px;border:1px solid #dbe6f7;border-radius:18px;background:linear-gradient(115deg,#edf4ff 0%,#f6f9ff 45%,#e9f0fc 100%);overflow:hidden;position:relative;padding:42px 46px}.hero>div:first-child{z-index:2}.eyebrow{font-size:10px;letter-spacing:1.3px;color:#6c8db9;font-weight:600}.hero h1{font-size:42px;letter-spacing:-1px;font-weight:750;line-height:1.45;margin:17px 0;color:#1c365d}.hero h1 span{color:var(--blue)}.hero p{font-size:13px;color:#7e90a9;line-height:1.9;margin:0}.hero-buttons{display:flex;gap:13px;margin-top:27px}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:7px;font-size:12px;font-weight:500;min-height:40px;padding:10px 18px;gap:12px;white-space:nowrap;transition:background .15s,transform .15s}.btn.primary{background:var(--blue);color:#fff;box-shadow:0 3px 8px #2563eb15}.btn.primary:hover{background:#1b53d1;transform:translateY(-1px)}.btn.secondary{background:#fff;border:1px solid #dce5f3;color:#7385a0}.btn.secondary:hover{border-color:#9ab9ec;color:var(--blue)}.btn.small{min-height:32px;font-size:11px;padding:7px 12px}.hero-stats{display:flex;gap:22px;font-size:10px;color:#97a5b8;margin-top:27px}.hero-stats b{color:#7288a4;font-size:12px;font-weight:600;margin-right:3px}.hero-visual{position:relative;min-width:0}.visual-grid{position:absolute;inset:-25px -15px;background-image:linear-gradient(#adbfde22 1px,transparent 1px),linear-gradient(90deg,#adbfde22 1px,transparent 1px);background-size:28px 28px;transform:perspective(800px) rotateX(15deg) rotateZ(-10deg);mask-image:radial-gradient(ellipse,#000 30%,transparent 75%)}.hero-chip{position:absolute;width:76%;height:225px;top:-35px;left:24%;transform:rotate(8deg)}.hero-gpu{position:absolute;width:98%;height:240px;top:110px;left:0;transform:rotate(-5deg)}.hero-chip svg,.hero-gpu svg{width:100%;height:100%}.visual-caption{position:absolute;bottom:-6px;right:9px;font-size:7px;letter-spacing:1.7px;color:#718cad;text-align:right;font-family:monospace}.visual-caption small{display:block;letter-spacing:1.4px;font-size:6px;margin-top:7px;color:#95a9c3}.visual-plus{position:absolute;font-size:25px;color:#9fb4d3;font-weight:200}.plus-one{left:30px;top:30px}.plus-two{right:10px;bottom:45px}
.category-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:24px 0 46px}.category-grid button{display:flex;align-items:center;gap:12px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:9px;padding:16px 14px;min-width:0;transition:box-shadow .15s,transform .15s}.category-grid button:hover{box-shadow:0 4px 16px #294a7a0b;transform:translateY(-2px);border-color:#bed1ef}.category-grid button.active{border-color:#92b6f1;background:#edf4ff}.category-grid .icon{width:25px;height:25px;color:#819cc4}.category-grid span{font-size:12px;font-weight:550;line-height:1.4;min-width:0}.category-grid small{display:block;color:#b0bbca;font-size:8px;font-weight:400;margin-top:5px}.category-grid b{margin-left:auto;font-size:9px;font-weight:400;color:#b3bfce}
.section-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:23px}.section-heading h2{font-size:25px;font-weight:650;margin:8px 0}.section-heading p{font-size:12px;color:#92a0b2;margin:0;line-height:1.8}.live-label{font-size:11px;color:#94a2b4;display:flex;gap:7px;align-items:center}.live-label i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#78a58b}.text-btn{font-size:11px;color:#8a9bb2;padding:4px;white-space:nowrap}.text-btn:hover{color:var(--blue)}.search-box{display:flex;align-items:center;gap:12px;border:1px solid #dce5f2;background:#fff;border-radius:9px;padding:0 18px;height:53px;box-shadow:0 3px 12px #23487803}.search-box .icon{color:#99abc3;width:19px}.search-box input{border:0;outline:none;background:none;width:100%;height:100%;color:#596d8a;font-size:13px}.search-box input::placeholder{color:#a5b1c3}.search-box input::-webkit-search-cancel-button{display:none}.search-box button{font-size:23px;color:#b3bfd0;line-height:1}.filters{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:19px 0}.filters>div{display:flex;align-items:center;gap:18px}.filters label{display:flex;gap:9px;align-items:center;color:#90a0b6;font-size:11px}.filters select{height:33px;border:1px solid #dfe6f1;border-radius:6px;font-size:11px;background:#fff;color:#778ba7;padding:0 23px 0 10px;max-width:160px}.filters #results-count{font-size:11px;color:#9cabbf}.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.card{border:1px solid #e1e8f3;background:#fff;border-radius:11px;overflow:hidden;transition:transform .2s,box-shadow .2s;min-width:0}.card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #253e660b}.card-art{height:172px;position:relative;background:#edf2f8}.type-cpu{background:linear-gradient(135deg,#eff4f2,#e5ece8)}.type-gpu{background:linear-gradient(135deg,#ecf1f8,#e4eaf2)}.type-board{background:linear-gradient(135deg,#f0f3ee,#e9eeea)}.type-ram{background:linear-gradient(135deg,#f0f0fa,#e8eaf4)}.type-storage{background:linear-gradient(135deg,#f0f3f7,#e6ebf2)}.type-psu{background:linear-gradient(135deg,#ecf1f7,#e4eaf1)}.type-case{background:linear-gradient(135deg,#f7f3ed,#eee7dd)}.type-cooler{background:linear-gradient(135deg,#f6f2ec,#eee9df)}.tag{position:absolute;left:12px;top:12px;color:#93a0b2;background:#ffffffad;border:1px solid #ffffffcc;padding:4px 6px;font-size:8px;border-radius:4px;z-index:2}.save-button{position:absolute;right:10px;top:10px;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;color:#9eadc1;z-index:2;padding:0}.save-button .icon{width:17px;height:17px}.save-button.active{color:var(--blue)}.save-button.active .icon{fill:#2563eb15}.save-button:hover{background:#ffffffa8}.art-link{height:100%;width:100%;display:block;padding:8px 0}.art-link svg{width:100%;height:100%;transition:transform .25s}.art-link:hover svg{transform:scale(1.04)}.card-content{padding:19px 17px 0}.card-brand{display:flex;justify-content:space-between;gap:8px;font-size:9px;font-weight:600;color:#8b9db6}.card-brand>span{font-size:9px;font-weight:400;color:#a6b3c4}.card-title{text-align:left;padding:0;margin:8px 0 15px;font-size:13px;font-weight:600;line-height:1.6;min-height:41px}.card-title:hover{color:var(--blue)}dl{margin:0}dl>div{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:10px;line-height:1.6}dt{color:#9dabc0;flex-shrink:0}dd{color:#7689a5;margin:0;text-align:right}.card-actions{margin-top:17px;border-top:1px solid #edf1f7;padding:13px 0;display:flex;justify-content:space-between;gap:10px}.card-actions button{display:inline-flex;gap:5px;align-items:center;padding:0;color:#a0aec2;font-size:10px;white-space:nowrap}.card-actions .icon{height:14px;width:14px}.card-actions button.active,.card-actions button:hover{color:var(--blue)}.pagination{display:flex;align-items:center;justify-content:center;gap:20px;padding:31px 0 50px}.pagination>span{font-size:11px;color:#9aa9bf}.pagination .btn{font-size:11px;min-height:35px;padding:8px 14px}.loading{padding:60px 20px;text-align:center;color:#95a6bf;font-size:13px}.empty{background:#fff;border:1px solid var(--line);border-radius:12px;text-align:center;padding:65px 20px;margin-bottom:35px}.empty>.icon{height:40px;width:40px;color:#a8bddd}.empty h3{font-size:20px;font-weight:550;margin:22px 0 10px}.empty p{font-size:12px;line-height:1.9;color:#95a6bc;margin-bottom:25px}.page-heading{margin:16px 0 35px}.page-heading h1{font-size:32px;margin:13px 0;font-weight:650}.page-heading p{font-size:13px;line-height:1.9;color:#91a1b7}footer{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid var(--line);padding:30px 0 45px;margin-top:25px;color:#a9b5c7;font-size:10px;line-height:2}footer strong{font-size:16px;color:#7e91ad;font-weight:600}footer p{margin:2px 0;font-size:10px}footer>span{text-align:right}footer button{color:#849abc;font-size:10px;padding:0}
.tray{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);width:min(1180px,calc(100vw - 40px));background:#fff;border:1px solid #d7e3f6;border-radius:12px;box-shadow:0 7px 35px #253f6821;z-index:50;display:flex;align-items:center;gap:20px;padding:15px 20px}.tray>div{display:flex;align-items:center;gap:8px;flex-shrink:0}.tray>div .icon{color:var(--blue);width:19px}.tray strong{font-size:12px;font-weight:600}.tray>div>span{font-size:10px;color:#99abc4;background:#f1f5fc;padding:4px 7px;border-radius:5px}.tray>p{margin:0;display:flex;gap:9px;flex:1;flex-wrap:wrap}.tray>p>span{background:#f5f7fc;padding:7px 9px;border-radius:6px;font-size:10px;color:#8092ad;display:flex;align-items:center;gap:8px}.tray>p button{color:#a5b4cb;padding:0;font-size:15px}.compare-toolbar{display:flex;align-items:center;gap:20px;justify-content:flex-end;margin:0 0 20px}.compare-toolbar label{margin-right:auto;display:flex;align-items:center;gap:8px;color:#879bb7;font-size:12px}.compare-toolbar input{accent-color:var(--blue)}.table-scroll{overflow:auto;border:1px solid var(--line);border-radius:12px;background:#fff;margin-bottom:40px}table{border-collapse:collapse;min-width:650px;table-layout:fixed;width:100%;font-size:12px;text-align:left}table th,table td{padding:19px 24px;line-height:1.8;border-bottom:1px solid #e8eef8;border-right:1px solid #e8eef8}table th:first-child{width:175px;background:#fafcff;color:#8a9db8;font-weight:500}table td{color:#657f9f}table thead th{position:relative;vertical-align:top}table th:last-child,table td:last-child{border-right:0}table tr:last-child th,table tr:last-child td{border-bottom:0}.table-art{height:142px;background:#f3f6fc;border-radius:8px;margin-bottom:16px}.table-art svg{width:100%;height:100%}table h3{font-size:14px;margin:8px 0;line-height:1.7}table small{font-size:10px;color:#95a7c0}table a{font-size:11px;color:var(--blue)}.remove-model{position:absolute;right:8px;top:7px;font-size:21px;color:#a8b9ce}.diff-only .same{display:none}.different td{background:#f9fbff}.build-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:26px;margin-bottom:40px}.component-list{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}.component-header{display:flex;align-items:center;justify-content:space-between;background:#fafcff;padding:18px 24px;border-bottom:1px solid var(--line)}.component-header h2{font-size:15px;font-weight:600;margin:0}.component-header h2 span{font-size:10px;color:#9cacc5;background:#eff3fb;border-radius:5px;padding:3px 6px;margin-left:8px}.component{display:flex;align-items:center;gap:18px;padding:22px 24px;min-height:100px;border-bottom:1px solid #edf1f7}.component:last-child{border-bottom:0}.component-type{display:flex;gap:12px;align-items:center;min-width:121px;color:#879cba;font-size:12px}.component-type .icon{width:25px;height:25px}.component-type small{display:block;font-size:9px;margin-top:6px;color:#aab9ce}.component-art{width:95px;height:56px;border-radius:6px;background:#f4f7fc;flex-shrink:0}.component-art svg{width:100%;height:100%}.component-name{flex:1;padding:0;text-align:left;min-width:0}.component-name small{display:block;font-size:9px;color:#9cacc4;margin-bottom:5px}.component-name b{display:block;font-size:12px;font-weight:550;line-height:1.8}.component-placeholder{flex:1;color:#b2bfd1;font-size:11px}.component .remove{font-size:21px;color:#b2c1d6}.build-summary{border:1px solid var(--line);border-radius:12px;background:#fff;padding:25px;align-self:start;position:sticky;top:110px}.build-summary h2{font-size:22px;margin:12px 0 20px;font-weight:600}.check-summary{font-size:12px;color:#5d84b4;background:#eef4fd;padding:13px;border-radius:7px;margin-bottom:18px}.check-summary.conflict{background:#fff1e9;color:#c27f53}.check{display:flex;align-items:flex-start;gap:10px;padding:10px 0}.check>span{margin-top:1px;flex-shrink:0;height:20px;width:20px;border-radius:50%;display:grid;place-items:center;background:#f0f3f9;color:#a2b3cc;font-size:12px}.check strong{font-size:11px;font-weight:500;color:#869bb8}.check p{font-size:10px;color:#a0b0c7;line-height:1.8;margin:4px 0 0}.check.pass>span{background:#eaf5f0;color:#77a38f}.check.fail>span{background:#fff0e8;color:#cf895d}.check.fail strong,.check.fail p{color:#c18b66}.missing{color:#a1b1c6;font-size:10px;line-height:1.8;margin:17px 0}.power{margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}.power>span{font-size:11px;color:#97a9c3}.power>b{display:block;font-size:32px;font-weight:600;color:#5c7b9f;margin:8px 0}.power small{font-size:13px;color:#96aaca;font-weight:400}.power p{font-size:10px;line-height:1.9;color:#a4b4cb;margin-bottom:25px}.full{width:100%}.local-caption{font-size:9px;color:#adbbcf;text-align:center;line-height:1.8;margin:12px 0 0}.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.guide-card{padding:32px;border:1px solid var(--line);border-radius:12px;background:#fff;text-align:left;transition:transform .2s}.guide-card:hover{transform:translateY(-3px);border-color:#b0c7ef}.guide-card>span{font-size:9px;color:#a4b7d2;letter-spacing:1px}.guide-card h2{font-size:19px;font-weight:550;line-height:1.8;margin:24px 0 14px}.guide-card p{font-size:12px;color:#94a8c3;line-height:1.9}.guide-card b{display:block;font-size:11px;font-weight:500;color:var(--blue);margin-top:30px}.guide-note{font-size:11px;color:#a3b4ce;line-height:2;margin:28px 0 50px}
dialog{width:min(940px,calc(100vw - 40px));max-height:calc(100dvh - 50px);padding:0;border:1px solid #d7e3f6;border-radius:16px;color:#243b5b;box-shadow:0 25px 90px #13244045;overflow:auto}dialog::backdrop{background:#192d4969;backdrop-filter:blur(4px)}.dialog-close{position:absolute;top:14px;right:15px;z-index:5;background:#edf2fa;color:#91a5c1;height:31px;width:31px;display:grid;place-items:center;border-radius:50%;font-size:24px;line-height:1}.detail{display:grid;grid-template-columns:40% 60%}.detail-image{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:15px;background-color:#edf2fa;min-height:520px}.detail-image svg{width:100%}.detail-image small{font-size:9px;color:#9cadc5}.detail-info{padding:45px 35px 35px}.detail-info h2{font-size:27px;line-height:1.5;font-weight:650;margin:15px 0}.detail-info>p{font-size:12px;line-height:1.9;color:#91a4bf}.detail-info dl{margin:22px 0}.detail-info dl>div{font-size:12px;padding:11px 0;border-bottom:1px solid #edf1f8}.detail-buttons{display:flex;gap:11px;flex-wrap:wrap}.detail-buttons .icon{height:17px;width:17px}.source{display:block;font-size:12px;color:var(--blue);margin-top:25px}.detail-info .detail-note{font-size:10px;color:#a5b6ce;margin-top:12px}.picker{padding:42px}.picker h2{font-size:27px;font-weight:600}.picker>input{width:100%;padding:14px 16px;background:#f8faff;border:1px solid #dce6f5;border-radius:8px;color:#6884a8;font-size:13px;margin-bottom:16px}.picker-item{display:flex;align-items:center;gap:22px;padding:20px 0;border-bottom:1px solid var(--line)}.picker-item>div{width:140px;height:82px;background:#f2f5fb;border-radius:8px;flex-shrink:0}.picker-item>div svg{height:100%;width:100%}.picker-item>span{flex:1;min-width:0}.picker-item small{font-size:10px;color:#9dafc8}.picker-item b{display:block;font-size:14px;font-weight:550;margin:7px 0;line-height:1.7}.picker-item p{font-size:11px;color:#9bafcb;margin:0;line-height:1.8}.empty-note{padding:25px 0;font-size:12px;color:#9aacc8}.article{padding:48px;max-width:800px;margin:auto}.article h2{font-size:28px;line-height:1.6;font-weight:600;margin:20px 0}.article p,.article li{font-size:14px;line-height:2;color:#859dbb}.article p.lead{color:#a1b3ce;margin-bottom:27px}.article h3{font-size:18px;font-weight:550;margin:30px 0 15px}.article ul{padding-left:20px}.article li{margin-bottom:14px}.error-message{font-size:12px;color:#c18464;line-height:1.8}#toast{position:fixed;left:50%;bottom:104px;transform:translate(-50%,12px);background:#28456b;color:#fff;box-shadow:0 4px 20px #21345425;padding:13px 21px;font-size:12px;line-height:1.8;border-radius:8px;z-index:100;opacity:0;pointer-events:none;max-width:90vw;width:max-content;text-align:center;transition:opacity .2s,transform .2s}#toast.visible{opacity:1;transform:translate(-50%,0)}
@media(max-width:1150px){.header-inner{gap:20px}#nav{gap:25px}.hero{padding:36px}.hero h1{font-size:36px}.category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.build-layout{grid-template-columns:minmax(0,1fr) 285px;gap:20px}.component{padding:20px 16px;gap:12px}.component-type{min-width:105px}.component-art{width:62px}.build-summary{padding:22px}.guide-card{padding:25px}.guide-card h2{font-size:17px}}
@media(max-width:850px){.header-inner{padding:0 24px;gap:20px}.brand>span{font-size:21px}.brand img{width:34px;height:34px}.brand small{font-size:6px}#nav{gap:22px}#nav button{font-size:11px}.favorites-toggle>span{display:none}.container{padding:26px 24px 0}.hero{padding:30px;min-height:360px}.hero h1{font-size:30px}.hero p{font-size:11px}.hero-stats{gap:15px;font-size:8px}.hero-buttons{gap:10px}.hero-buttons .btn{font-size:11px;padding:10px 13px}.hero-chip{top:-10px;width:88%;left:15%}.hero-gpu{width:110%;left:-10%;top:110px}.visual-caption{font-size:6px;letter-spacing:.7px}.category-grid{gap:10px}.category-grid button{padding:13px 12px}.category-grid span{font-size:11px}.category-grid small{font-size:7px}.category-grid .icon{width:23px}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.card-art{height:143px}.card-content{padding:16px 13px 0}.card-title{font-size:12px}.card-actions button{font-size:9px}.card-actions{gap:6px}.card-actions .icon{width:12px;height:12px}.card-content dl>div{font-size:9px}.build-layout{grid-template-columns:1fr}.build-summary{position:static}.component{padding:22px 25px;gap:20px}.component-type{min-width:115px}.component-art{width:90px}.guide-grid{grid-template-columns:1fr}.guide-card{padding:28px}.guide-card h2{margin-top:15px;font-size:20px}.tray{gap:14px;padding:14px}.tray>p>span{font-size:8px;max-width:170px}.tray>p{max-height:58px;overflow:auto}.tray>.btn{font-size:10px;padding:9px 13px}.detail-info{padding:42px 26px 30px}.detail-info h2{font-size:22px}}
@media(max-width:600px){.header{height:112px;position:relative}.header-inner{padding:0 18px;height:65px;position:relative}.brand img{width:32px;height:32px}.brand>span{font-size:21px}.favorites-toggle>span{display:inline;font-size:11px}#nav{position:absolute;top:65px;left:0;right:0;height:47px;border-top:1px solid #eef2f8;padding:0 18px;justify-content:space-between;gap:10px}#nav button{font-size:11px}#nav b{font-size:8px;padding:1px 4px}.container{padding:20px 18px 0}.hero{grid-template-columns:1fr;padding:28px 25px;min-height:380px}.hero h1{font-size:31px;margin:16px 0;letter-spacing:-.5px}.hero p{font-size:11px}.hero>div:first-child{max-width:100%}.hero-visual{position:absolute;inset:0;opacity:.25;pointer-events:none}.visual-grid{inset:0}.hero-chip{width:50%;left:64%;top:60px;transform:rotate(10deg)}.hero-gpu{width:66%;left:52%;top:184px;transform:rotate(-9deg)}.hero .eyebrow{font-size:9px}.visual-caption,.visual-plus{display:none}.hero-buttons{margin-top:26px}.hero-buttons .btn{font-size:11px;min-height:40px;padding:11px 13px}.hero-stats{font-size:8px;gap:14px;margin-top:25px;flex-wrap:wrap}.hero-stats b{font-size:10px}.category-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:18px 0 33px}.category-grid button{display:block;text-align:center;padding:15px 6px 12px;position:relative}.category-grid .icon{width:22px;height:22px;display:block;margin:0 auto 8px}.category-grid span{font-size:10px;font-weight:500}.category-grid small{font-size:6px;margin-top:4px;letter-spacing:.2px}.category-grid b{position:absolute;top:7px;right:8px;font-size:7px;color:#b4c2d6}.section-heading{margin-bottom:19px;gap:10px}.section-heading h2{font-size:23px}.section-heading p{font-size:11px}.eyebrow{font-size:8px;letter-spacing:.8px}.live-label{font-size:8px;white-space:nowrap;gap:4px}.live-label i{width:5px;height:5px}.search-box{height:48px;padding:0 12px;gap:9px}.search-box input{font-size:11px}.search-box .icon{width:16px}.filters{gap:12px;flex-wrap:wrap;padding:15px 0}.filters>div{gap:10px}.filters label{font-size:9px;gap:6px}.filters select{font-size:9px;max-width:107px;padding-right:14px;height:30px}.filters .text-btn{font-size:9px}.filters>div:last-child{margin-left:auto}.filters #results-count{font-size:9px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.card-art{height:143px}.card-content{padding:14px 12px 0}.card-brand,.card-brand>span{font-size:8px}.card-title{font-size:11px;line-height:1.7;min-height:38px;margin-bottom:12px}.card-content dl>div{font-size:8px;gap:6px;line-height:1.6;padding:5px 0}.card-content dt{max-width:50%}.card-content dd{max-width:53%}.tag{font-size:7px;top:9px;left:9px}.save-button{right:7px;top:7px;width:24px;height:24px}.save-button .icon{width:15px;height:15px}.card-actions{margin-top:12px;padding:12px 0;gap:8px}.card-actions button{font-size:8px;gap:4px}.card-actions .icon{width:11px;height:11px}.pagination{gap:14px;padding:25px 0 35px}.pagination>span{font-size:10px}.pagination .btn{font-size:10px;padding:8px 12px}.page-heading{margin:15px 0 25px}.page-heading h1{font-size:27px;margin:10px 0}.page-heading p{font-size:11px}.empty{padding:55px 20px}.empty h3{font-size:18px}.empty p{font-size:11px}.tray{bottom:10px;width:calc(100vw - 20px);padding:12px;gap:9px;flex-wrap:wrap}.tray>div{margin-right:auto;gap:6px}.tray strong{font-size:11px}.tray>div>span{font-size:9px}.tray>p{display:none}.tray>.text-btn{font-size:10px}.tray>.btn{font-size:10px;min-height:34px;padding:7px 12px}.compare-toolbar{gap:12px}.compare-toolbar label{font-size:10px;gap:6px}.compare-toolbar .text-btn{font-size:10px}.compare-toolbar .btn{font-size:10px;padding:8px 10px}table th,table td{padding:16px;font-size:11px}table th:first-child{width:135px}.table-art{height:115px}table h3{font-size:13px}.component-header{padding:17px}.component-header h2{font-size:13px}.component{padding:18px 14px;gap:10px;min-height:93px}.component-type{min-width:82px;font-size:10px;gap:8px}.component-type .icon{width:19px;height:19px}.component-type small{font-size:7px}.component-art{width:51px;height:45px}.component-name b{font-size:10px}.component-name small{font-size:8px}.component .text-btn{font-size:10px}.component-placeholder{font-size:9px}.component .btn{font-size:9px;padding:7px 9px}.component .remove{font-size:19px}.build-summary{padding:24px}.guide-card{padding:23px}.guide-card h2{font-size:18px}.guide-card p{font-size:11px}.guide-card b{margin-top:20px}.guide-card>span{font-size:8px}.guide-note{font-size:10px}.detail{grid-template-columns:1fr}.detail-image{height:195px;min-height:0;max-height:195px;padding:10px}.detail-image svg{height:164px}.detail-image small{font-size:8px}.detail-info{padding:30px 24px}.detail-info h2{font-size:24px}.detail-info>p{font-size:11px}.detail-info dl>div{font-size:11px}.detail-buttons .btn{font-size:11px;padding:9px 13px}.picker{padding:36px 24px}.picker h2{font-size:24px}.picker>input{font-size:11px;padding:12px}.picker-item{gap:12px;padding:17px 0}.picker-item>div{width:70px;height:60px}.picker-item b{font-size:11px;margin:5px 0}.picker-item small{font-size:8px}.picker-item p{font-size:9px}.picker-item .btn{font-size:9px;padding:6px 9px}.article{padding:40px 26px}.article h2{font-size:24px}.article p,.article li{font-size:12px}.article h3{font-size:16px}dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:12px}footer{padding-bottom:100px;margin-top:15px;font-size:8px;align-items:flex-start}footer strong{font-size:13px}footer p,footer button{font-size:8px}#toast{font-size:11px;bottom:90px}.local-caption{font-size:9px}}
@media(max-width:360px){.hero h1{font-size:28px}.hero{padding:25px 20px}.hero-stats{font-size:7px;gap:11px}.card-actions button:last-child{font-size:0}.card-actions button:last-child .icon{width:15px;height:15px}.card-art{height:127px}.filters>div{gap:8px}.component-art{display:none}}
.cpu-detail{background:#fff}.cpu-header{display:grid;grid-template-columns:210px minmax(0,1fr);gap:28px;padding:24px 45px 20px;background:linear-gradient(120deg,#eef4f5,#f6f9ff 55%,#fff)}.cpu-portrait{display:flex;flex-direction:column;justify-content:center;align-items:center;min-width:0}.cpu-portrait svg{width:100%;height:155px}.cpu-portrait small{font-size:10px;color:#8197af;margin-top:-7px}.cpu-heading{padding:2px 25px 0 0;min-width:0}.cpu-heading h2{font-size:29px;line-height:1.3;letter-spacing:-.6px;margin:12px 0;color:#233e63}.cpu-heading>p{font-size:12px;color:#7890ac;line-height:1.8;margin:0 0 13px}.cpu-summary{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.cpu-summary>span{font-size:11px;color:#647f9f;padding:5px 10px;border:1px solid #dfe8f3;background:#ffffffa8;border-radius:5px}.cpu-tabs{display:flex;gap:30px;padding:0 45px;border-top:1px solid #e9eef6;border-bottom:1px solid #e9eef6;background:#fff}.cpu-tabs button{position:relative;font-size:13px;font-weight:550;padding:18px 0;color:#8293aa}.cpu-tabs button[aria-selected=true]{color:var(--blue)}.cpu-tabs button[aria-selected=true]:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:3px;background:var(--blue);border-radius:3px}.cpu-body{padding:25px 45px 28px}.cpu-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 15px}.cpu-section-title h3{font-size:16px;font-weight:650;margin:0}.cpu-section-title>span{font-size:10px;color:#8195b0}.cpu-scores{display:grid;grid-template-columns:1fr 1fr;gap:16px}.score-card{border:1px solid #d7e4fb;background:linear-gradient(125deg,#edf4ff,#f7faff);border-radius:10px;padding:19px 22px}.score-card>span{font-size:11px;color:#5d7da7}.score-card strong{display:block;font-size:36px;font-weight:750;letter-spacing:-1px;color:#2563eb;margin:8px 0;line-height:1.2;font-variant-numeric:tabular-nums}.score-card strong small{font-size:11px;font-weight:400;color:#7690b2;letter-spacing:0}.score-card p{font-size:10px;color:#7991ae;margin:0}.score-card.single{background:linear-gradient(125deg,#eff7f5,#f8fbfa);border-color:#dcece6}.score-card.single strong{color:#298976}.score-card.single>span{color:#6a9087}.benchmark-meta{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:13px 0 7px;font-size:10px;color:#8095af}.benchmark-meta a,.cpu-source-line a,.cpu-footer a{color:var(--blue)}.cpu-footnote{font-size:10px;line-height:1.9;color:#8a9db5;margin:8px 0 21px}.chipset-tags{display:flex;flex-wrap:wrap;gap:9px}.chipset-tags span{background:#f2f5fa;border:1px solid #e4eaf3;border-radius:6px;padding:8px 15px;font-size:12px;color:#5e789a;font-weight:550}.cpu-source-line{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:11px}.cpu-source-line .text-btn{font-size:11px;color:var(--blue)}.cpu-spec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 25px}.cpu-spec-grid>section{border:1px solid #e7edf5;border-radius:9px;padding:17px 20px;min-width:0}.cpu-spec-grid h4{font-size:13px;color:#506e94;font-weight:650;margin:0 0 10px}.cpu-spec-list{margin:0}.cpu-spec-list>div{display:flex;justify-content:space-between;gap:15px;padding:9px 0;border-bottom:1px solid #edf1f7;font-size:11px;line-height:1.7}.cpu-spec-list>div:last-child{border-bottom:0}.cpu-spec-list dt{color:#889bb5;flex:1;min-width:0}.cpu-spec-list dd{color:#536e91;text-align:right;flex:1.2;margin:0;min-width:0;overflow-wrap:anywhere}.cpu-compat-notes{display:grid;gap:20px;margin:25px 0}.cpu-compat-notes>div{display:flex;gap:15px}.cpu-compat-notes>div>span{display:grid;place-items:center;border:1px solid #e3eafb;border-radius:8px;background:#f5f8fe;color:#6d8cb7;width:34px;height:34px;font-size:11px;flex-shrink:0}.cpu-compat-notes h4{font-size:13px;font-weight:600;margin:0 0 7px}.cpu-compat-notes p{font-size:11px;line-height:1.9;color:#8196b1;margin:0}.cpu-footer{display:flex;justify-content:space-between;gap:12px;margin:0;padding:16px 45px;border-top:1px solid #edf1f7;background:#fafcff;font-size:10px;color:#93a5be}
@media(max-width:600px){.cpu-header{grid-template-columns:90px minmax(0,1fr);gap:12px;padding:30px 20px 23px}.cpu-portrait svg{height:100px}.cpu-portrait small{font-size:7px;margin-top:-12px}.cpu-heading{padding:5px 9px 0 0}.cpu-heading h2{font-size:21px;margin:10px 0;letter-spacing:-.3px}.cpu-heading>p{font-size:10px}.cpu-summary{gap:5px;margin-bottom:12px}.cpu-summary>span{font-size:8px;padding:4px 6px}.cpu-heading .detail-buttons{gap:7px}.cpu-heading .detail-buttons .btn{font-size:9px;padding:7px 9px;min-height:33px;gap:5px}.cpu-heading .detail-buttons .icon{width:12px;height:12px}.cpu-tabs{padding:0 22px;gap:25px}.cpu-tabs button{font-size:11px;padding:15px 0}.cpu-body{padding:23px 22px}.cpu-section-title h3{font-size:14px}.cpu-section-title>span{font-size:8px}.cpu-scores{gap:10px}.score-card{padding:15px 12px}.score-card>span{font-size:9px;line-height:1.6;display:block}.score-card strong{font-size:28px}.score-card strong small{font-size:8px}.score-card p{font-size:8px;line-height:1.6}.benchmark-meta{font-size:8px;line-height:1.8}.cpu-footnote{font-size:9px}.chipset-tags{gap:7px}.chipset-tags span{font-size:10px;padding:7px 11px}.cpu-source-line,.cpu-source-line .text-btn{font-size:10px}.cpu-spec-grid{grid-template-columns:1fr;gap:15px}.cpu-spec-grid>section{padding:15px}.cpu-spec-list>div{font-size:10px}.cpu-compat-notes h4{font-size:12px}.cpu-compat-notes p{font-size:10px}.cpu-footer{padding:15px 22px;font-size:8px;align-items:center}}
.benchmark-selector{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 17px;padding:12px 15px;background:#f7f9fc;border:1px solid #e6ecf5;border-radius:8px}.benchmark-selector label{font-size:11px;font-weight:600;color:#627d9f}.benchmark-selector select{padding:8px 30px 8px 11px;min-width:170px;border:1px solid #ccdbee;background:#fff;border-radius:6px;color:#285a9f;font-size:12px;cursor:pointer}.benchmark-selector>span{font-size:10px;color:#8d9eb5;margin-left:auto}.benchmark-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 0 13px}.benchmark-heading h4{font-size:16px;font-weight:650;margin:0 0 5px;color:#314f76}.benchmark-heading>div>span{font-size:10px;color:#8297b2}.benchmark-kind{font-size:10px;background:#f0f5fd;border:1px solid #e2eafa;padding:5px 9px;border-radius:5px;color:#708aac}.benchmark-conditions{font-size:10px;color:#7890ad;line-height:1.9;margin:9px 0}.benchmark-conditions summary{cursor:pointer;color:#57769d;padding:6px 0;width:fit-content}.benchmark-conditions p{margin:7px 0;padding:0 12px;border-left:2px solid #e2eafa}.benchmark-caution{margin-bottom:26px}.benchmark-empty{padding:25px;border:1px dashed #d6e2f2;border-radius:9px;color:#7086a4;margin-bottom:25px}.benchmark-empty strong{font-size:13px}.benchmark-empty p{font-size:11px;line-height:1.9}.recommendation-title{margin-top:4px}.chipset-recommendations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.chipset-recommendations>section{min-width:0;border:1px solid #dce6f6;border-radius:9px;background:linear-gradient(130deg,#f2f7ff,#fff);padding:17px 20px}.recommendation-label{font-size:10px;color:#6f8cb2}.chipset-recommendations h4{font-size:20px;color:#2b62b6;margin:10px 0;letter-spacing:.3px}.chipset-recommendations p{font-size:11px;color:#7b91ae;line-height:1.9;margin:0 0 12px}.chipset-recommendations a{font-size:10px;color:var(--blue)}.recommendation-note{margin-top:11px}.chipset-tags span.recommended{background:#eef5ff;color:#3e6fae;border-color:#d2e2fb;display:inline-flex;align-items:center;gap:8px}.chipset-tags small{font-size:8px;color:#729bd4;font-weight:400}.cpu-tabs{position:sticky;top:0;z-index:3}
@media(max-width:600px){.benchmark-selector{gap:8px;padding:10px 12px}.benchmark-selector label{font-size:10px}.benchmark-selector select{font-size:11px;min-width:155px}.benchmark-selector>span{width:100%;margin:0;font-size:9px}.benchmark-heading h4{font-size:14px}.benchmark-heading>div>span,.benchmark-kind{font-size:9px}.benchmark-conditions{font-size:9px}.chipset-recommendations{grid-template-columns:1fr;gap:12px}.chipset-recommendations>section{padding:15px 17px}.chipset-recommendations h4{font-size:18px;margin:8px 0}.chipset-recommendations p{font-size:10px}.recommendation-label,.chipset-recommendations a{font-size:9px}.chipset-tags small{font-size:7px}.chipset-tags span.recommended{gap:5px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}