@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Barlow:wght@300;400;500;600&family=Barlow+Condensed:wght@400;500;600;700&display=swap');

*{box-sizing:border-box;margin:0;padding:0;}
html,body{font-family:'Barlow',sans-serif;background:#080808;color:#f0f0f0;min-height:100vh;}
body::before{content:'';position:fixed;inset:0;background-image:repeating-linear-gradient(45deg,rgba(255,255,255,0.012) 0,rgba(255,255,255,0.012) 1px,transparent 1px,transparent 8px),repeating-linear-gradient(-45deg,rgba(255,255,255,0.012) 0,rgba(255,255,255,0.012) 1px,transparent 1px,transparent 8px);background-size:8px 8px;pointer-events:none;z-index:0;}
.wrap{position:relative;z-index:1;}
a{color:inherit;text-decoration:none;}
img{display:block;}

/* NAV */
.nav{display:flex;align-items:center;gap:2rem;padding:0 2rem;height:56px;background:#0a0a0a;border-bottom:1px solid rgba(255,255,255,0.07);position:sticky;top:0;z-index:100;backdrop-filter:blur(12px);}
.logo{font-family:'Bebas Neue',sans-serif;font-size:26px;letter-spacing:0.12em;color:#fff;cursor:pointer;flex-shrink:0;}
.logo span{color:#3b9eff;}
.nl{display:flex;gap:2rem;list-style:none;margin-right:auto;}
.nl li a{font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:rgba(255,255,255,0.45);font-weight:600;transition:color 0.15s;position:relative;padding-bottom:2px;}
.nl li a::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:1px;background:#3b9eff;transform:scaleX(0);transition:transform 0.2s;}
.nl li a:hover{color:#fff;}
.nl li a:hover::after,.nl li a.active::after{transform:scaleX(1);}
.nl li a.active{color:#3b9eff;}
.sb{padding:0 20px;height:34px;background:#3b9eff;color:#fff;border:none;border-radius:3px;font-family:'Barlow Condensed',sans-serif;font-size:11px;letter-spacing:0.18em;font-weight:700;text-transform:uppercase;cursor:pointer;transition:background 0.15s;}
.sb:hover{background:#2a8ae8;}

/* BREADCRUMB */
.bc{padding:0.75rem 2rem;display:flex;align-items:center;gap:6px;border-bottom:1px solid rgba(255,255,255,0.05);background:rgba(255,255,255,0.01);}
.bci{font-size:10px;color:rgba(255,255,255,0.25);font-family:'Barlow Condensed',sans-serif;letter-spacing:0.08em;cursor:pointer;transition:color 0.15s;}
.bci:hover{color:#3b9eff;}
.bcs{font-size:10px;color:rgba(255,255,255,0.1);}
.bcc{font-size:10px;color:rgba(255,255,255,0.5);font-family:'Barlow Condensed',sans-serif;}

/* FOOTER */
.footer{margin-top:4rem;border-top:1px solid rgba(255,255,255,0.07);background:#060606;padding:2.5rem 2rem 1.5rem;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2.5rem;max-width:1280px;margin:0 auto;}
.f-brand{display:flex;flex-direction:column;gap:12px;}
.f-logo{font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:0.12em;color:#fff;}
.f-logo span{color:#3b9eff;}
.f-tag{font-size:12px;color:rgba(255,255,255,0.35);line-height:1.7;max-width:280px;}
.f-col h4{font-family:'Barlow Condensed',sans-serif;font-size:10px;letter-spacing:0.2em;text-transform:uppercase;color:#3b9eff;font-weight:700;margin-bottom:14px;}
.f-col ul{list-style:none;display:flex;flex-direction:column;gap:8px;}
.f-col ul li a{font-size:12px;color:rgba(255,255,255,0.4);transition:color 0.15s;}
.f-col ul li a:hover{color:#fff;}
.f-bottom{max-width:1280px;margin:2rem auto 0;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,0.05);display:flex;justify-content:space-between;align-items:center;font-size:10px;color:rgba(255,255,255,0.18);font-family:'Barlow Condensed',sans-serif;letter-spacing:0.12em;text-transform:uppercase;}

/* BUTTONS */
.btn-primary{padding:12px 22px;background:#3b9eff;color:#fff;border:none;border-radius:3px;font-family:'Barlow Condensed',sans-serif;font-size:12px;letter-spacing:0.15em;font-weight:700;text-transform:uppercase;cursor:pointer;transition:background 0.15s;}
.btn-primary:hover{background:#2a8ae8;}
.btn-outline{padding:11px 22px;background:transparent;border:1px solid rgba(255,255,255,0.15);border-radius:3px;color:rgba(255,255,255,0.55);font-family:'Barlow Condensed',sans-serif;font-size:11px;letter-spacing:0.15em;font-weight:600;text-transform:uppercase;cursor:pointer;transition:all 0.15s;}
.btn-outline:hover{border-color:#3b9eff;color:#3b9eff;}

/* CARDS */
.card{background:#0d0d0d;border:1px solid rgba(255,255,255,0.07);border-radius:5px;}
.divider{height:1px;background:rgba(255,255,255,0.06);margin:1.2rem 0;}

/* PART CARDS */
.parts-body{padding:1rem 1.5rem 1.5rem;}
.parts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;}
.part-card{background:#111;border:1px solid rgba(255,255,255,0.07);border-radius:4px;padding:12px 14px;cursor:pointer;transition:border-color 0.15s,background 0.15s,transform 0.1s;display:flex;gap:12px;align-items:flex-start;}
.part-card:hover{border-color:rgba(59,158,255,0.4);background:#141414;transform:translateY(-1px);}
.part-icon{width:40px;height:40px;border-radius:3px;background:#0d1a2e;border:1px solid rgba(59,158,255,0.2);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-family:'Bebas Neue',sans-serif;font-size:13px;color:#3b9eff;}
.part-info{flex:1;min-width:0;}
.part-name{font-size:12px;font-weight:600;color:#f0f0f0;line-height:1.35;margin-bottom:2px;}
.part-brand{font-size:10px;color:rgba(255,255,255,0.28);text-transform:uppercase;letter-spacing:0.1em;font-family:'Barlow Condensed',sans-serif;margin-bottom:6px;}
.part-bottom{display:flex;align-items:center;justify-content:space-between;}
.part-price{font-family:'Barlow Condensed',sans-serif;font-size:15px;font-weight:700;color:#3b9eff;}
.part-badge{font-size:8px;padding:2px 7px;border-radius:2px;font-family:'Barlow Condensed',sans-serif;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;}
.badge-s{background:rgba(59,158,255,0.12);color:#3b9eff;border:1px solid rgba(59,158,255,0.25);}
.badge-l{background:rgba(255,100,50,0.12);color:#ff6432;border:1px solid rgba(255,100,50,0.25);}

/* MISC */
.no-parts{padding:3rem;text-align:center;color:rgba(255,255,255,0.15);font-size:12px;font-family:'Barlow Condensed',sans-serif;letter-spacing:0.15em;text-transform:uppercase;}
.section-eyebrow{font-family:'Barlow Condensed',sans-serif;font-size:10px;letter-spacing:0.22em;text-transform:uppercase;color:#3b9eff;font-weight:700;display:flex;align-items:center;gap:6px;margin-bottom:5px;}
.section-eyebrow::before{content:'';width:14px;height:1.5px;background:#3b9eff;}
.section-title{font-family:'Bebas Neue',sans-serif;font-size:32px;color:#fff;letter-spacing:0.05em;line-height:1;}

/* THEME + SESSION CONTROLS */
:root{
  color-scheme:dark;
  --th-bg:#080808;
  --th-surface:#0d0d0d;
  --th-surface-2:#111;
  --th-nav:#0a0a0a;
  --th-footer:#060606;
  --th-text:#f0f0f0;
  --th-heading:#fff;
  --th-muted:rgba(255,255,255,0.45);
  --th-soft:rgba(255,255,255,0.07);
  --th-field:rgba(255,255,255,0.04);
  --th-accent:#3b9eff;
  --th-accent-hover:#2a8ae8;
}

html[data-theme="light"]{
  color-scheme:light;
  --th-bg:#f5f7fb;
  --th-surface:#fff;
  --th-surface-2:#f9fbff;
  --th-nav:rgba(255,255,255,0.92);
  --th-footer:#eef2f7;
  --th-text:#151922;
  --th-heading:#070b12;
  --th-muted:rgba(21,25,34,0.58);
  --th-soft:rgba(15,23,42,0.12);
  --th-field:rgba(15,23,42,0.04);
  --th-accent:#1769d8;
  --th-accent-hover:#0f58ba;
}

html,body{background:var(--th-bg);color:var(--th-text);}
html[data-theme="light"] body::before{background-image:repeating-linear-gradient(45deg,rgba(15,23,42,0.025) 0,rgba(15,23,42,0.025) 1px,transparent 1px,transparent 8px),repeating-linear-gradient(-45deg,rgba(15,23,42,0.025) 0,rgba(15,23,42,0.025) 1px,transparent 1px,transparent 8px);}
.nav{background:var(--th-nav);border-bottom-color:var(--th-soft);}
.logo,.f-logo,.section-title{color:var(--th-heading);}
.nl li a{color:var(--th-muted);}
.nl li a:hover{color:var(--th-heading);}
.sb,.btn-primary{background:var(--th-accent);}
.sb:hover,.btn-primary:hover{background:var(--th-accent-hover);}
.btn-outline{border-color:var(--th-soft);color:var(--th-muted);}
.card,.part-card{background:var(--th-surface);border-color:var(--th-soft);}
.footer{background:var(--th-footer);border-top-color:var(--th-soft);}
.theme-toggle{width:36px;height:34px;border:1px solid var(--th-soft);border-radius:3px;background:var(--th-field);color:var(--th-text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:15px;line-height:1;transition:border-color 0.15s,background 0.15s,color 0.15s;}
.theme-toggle:hover{border-color:var(--th-accent);color:var(--th-accent);}
.theme-toggle:focus-visible{outline:2px solid var(--th-accent);outline-offset:2px;}
.auth-link.is-hidden{display:none;}
.auth-user{display:none;align-items:center;gap:8px;font-family:'Barlow Condensed',sans-serif;font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--th-muted);font-weight:700;}
.auth-user.is-visible{display:flex;}
.auth-user strong{color:var(--th-heading);font-weight:700;}
.inline-status{margin-top:10px;font-size:12px;color:var(--th-accent);line-height:1.5;}
.inline-status.is-error{color:#ff6432;}

html[data-theme="light"] .wrap,
html[data-theme="light"] .hero,
html[data-theme="light"] .builds-section,
html[data-theme="light"] .section,
html[data-theme="light"] .comments-section,
html[data-theme="light"] .photo-col,
html[data-theme="light"] .parts-col,
html[data-theme="light"] .user-hero,
html[data-theme="light"] .bhead{color:var(--th-text);}

html[data-theme="light"] .selector,
html[data-theme="light"] .bcard,
html[data-theme="light"] .build-card,
html[data-theme="light"] .signin-card,
html[data-theme="light"] .signup-card,
html[data-theme="light"] .comment-input,
html[data-theme="light"] .stat-box,
html[data-theme="light"] .part-link,
html[data-theme="light"] .thread,
html[data-theme="light"] .part-card,
html[data-theme="light"] .build-drawer,
html[data-theme="light"] .panel,
html[data-theme="light"] .card{background:var(--th-surface)!important;border-color:var(--th-soft)!important;}

html[data-theme="light"] .h1,
html[data-theme="light"] .bs-title,
html[data-theme="light"] .cta-title,
html[data-theme="light"] .bh-title,
html[data-theme="light"] .pc-title,
html[data-theme="light"] .cs-title,
html[data-theme="light"] .signin-h1,
html[data-theme="light"] .signup-h1,
html[data-theme="light"] .uh-name,
html[data-theme="light"] .sec-title,
html[data-theme="light"] .bc-name,
html[data-theme="light"] .bcar,
html[data-theme="light"] .part-name,
html[data-theme="light"] .pl-name,
html[data-theme="light"] .cmt-user,
html[data-theme="light"] .add-text{color:var(--th-heading)!important;}

html[data-theme="light"] .hs,
html[data-theme="light"] .bs-sub,
html[data-theme="light"] .cta-sub,
html[data-theme="light"] .signin-sub,
html[data-theme="light"] .signup-sub,
html[data-theme="light"] .bh-meta,
html[data-theme="light"] .story-text,
html[data-theme="light"] .uh-meta,
html[data-theme="light"] .bc-meta,
html[data-theme="light"] .cmt-text,
html[data-theme="light"] .add-sub,
html[data-theme="light"] .f-tag{color:var(--th-muted)!important;}

html[data-theme="light"] .form-input,
html[data-theme="light"] .ci-input,
html[data-theme="light"] .sw select{background:var(--th-field)!important;border-color:var(--th-soft)!important;color:var(--th-text)!important;}

html[data-theme="light"] .bc,
html[data-theme="light"] .stats-bar,
html[data-theme="light"] .cta-section{border-color:var(--th-soft)!important;background:rgba(23,105,216,0.035)!important;}

@media (max-width:760px){
  .nav{gap:0.8rem;padding:0 1rem;overflow-x:auto;}
  .nl{gap:1rem;}
  .theme-toggle{width:34px;flex-shrink:0;}
  .auth-user{display:none!important;}
}