/* ── Reset ─────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* ── Skip Link ───────────────────────────────────────── */
.skip-link{position:absolute;top:-100px;left:0;background:var(--accent);color:#fff;padding:8px 16px;font-size:13px;font-weight:600;text-decoration:none;z-index:9999;border-radius:0 0 var(--radius) 0;transition:top .1s}
.skip-link:focus{top:0}

/* ── CSS Variables ──────────────────────────────────── */
:root{
  --bg-base:#0d0f12;
  --bg-surface:#141720;
  --bg-card:#1a1e2b;
  --accent:#e8312a;
  --accent-dim:#b52420;
  --accent-glow:rgba(232,49,42,.18);
  --text-primary:#f0f2f5;
  --text-secondary:#9ea3bd;
  --text-muted:#4a4f65;
  --border:#222636;
  --radius:6px;
}

/* ── Base ────────────────────────────────────────────── */
html,body{background:var(--bg-base);color:var(--text-primary);font-family:'DM Sans','Inter',sans-serif;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
main{display:block}

/* ── Focus ───────────────────────────────────────────── */
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}

/* ── Navigation ─────────────────────────────────────── */
nav{position:sticky;top:0;z-index:100;padding:10px 32px;background:var(--bg-base);}
.nav-container{display:flex;align-items:center;max-width:1200px;margin:0 auto;background:rgba(26,30,43,0.95);border:1px solid rgba(240,242,245,0.08);border-radius:100px;padding:8px 8px 8px 24px;backdrop-filter:blur(12px);}
.logo{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:22px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-primary);text-decoration:none;flex-shrink:0;}
.logo span{color:var(--accent)}
.nav-links{display:flex;gap:2px;list-style:none;flex:1;justify-content:center;align-items:center;}
.nav-links a{text-decoration:none;color:var(--text-secondary);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;transition:color .15s,background .15s;padding:7px 12px;border-radius:100px;white-space:nowrap;}
.nav-links a:hover,.nav-links a.active{color:var(--text-primary);background:rgba(240,242,245,.07);}
.nav-compare{display:inline-flex;align-items:center;gap:5px;}
.nav-compare .badge{background:var(--accent);color:#fff;font-size:9px;font-weight:700;min-width:16px;height:16px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;padding:0 3px;}
.nav-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.nav-cta-mobile{display:none;}
.nav-cta{background:var(--accent);color:#fff!important;padding:9px 22px;border-radius:100px;font-family:'Barlow Condensed',sans-serif;font-weight:700!important;font-size:14px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:background .15s,box-shadow .15s;white-space:nowrap;}
.nav-cta:hover{background:var(--accent-dim);box-shadow:0 0 20px rgba(232,49,42,.3);}

/* ── Hamburger ───────────────────────────────────────── */
.hamburger{display:none;background:none;border:none;cursor:pointer;padding:4px;z-index:110}
.hamburger span{display:block;width:22px;height:2px;background:var(--text-primary);margin:5px 0;transition:all .3s}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* ── Footer ──────────────────────────────────────────── */
footer{border-top:1px solid var(--border);padding:28px 48px;display:flex;align-items:center;justify-content:space-between;color:var(--text-muted);font-size:12px;margin-top:64px;flex-wrap:wrap;gap:12px}
footer a{color:var(--text-muted);text-decoration:none}
footer a:hover{color:var(--text-secondary)}
.footer-links{display:flex;gap:24px}
.footer-disclaimer{width:100%;text-align:center;font-size:11px;color:var(--text-muted);padding-top:12px;border-top:1px solid var(--border)}

/* ── Section Utilities ───────────────────────────────── */
.section-alt{background:var(--bg-surface)}

/* ── Generic Card Hover ──────────────────────────────── */
a[class*="card"]:hover,a[class*="-card"]:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.35)}
a[class*="card"],a[class*="-card"]{transition:border-color .15s,transform .15s,box-shadow .15s}

/* ── Responsive: Navigation ─────────────────────────── */
@media(max-width:768px){
  nav{padding:8px 16px;}
  .nav-container{border-radius:16px;padding:8px 8px 8px 16px;}
  .nav-links{display:none;flex-direction:column;position:fixed;top:72px;left:16px;right:16px;background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:16px;gap:0;box-shadow:0 8px 32px rgba(0,0,0,.4);}
  .nav-links.open{display:flex;}
  .nav-links li{border-bottom:1px solid var(--border);}
  .nav-links li:last-child{border-bottom:none;}
  .nav-links a{padding:14px 8px;display:block;font-size:15px;border-radius:0;}
  .hamburger{display:block;}
  .nav-actions{display:none;}
  .nav-cta-mobile{display:list-item;}
  footer{flex-direction:column;gap:12px;padding:24px 20px;text-align:center}
}

/* ── Toggle Switch (skip-checkboxes) ─────────────────── */
.switch{position:relative;display:inline-block;width:36px;height:18px;vertical-align:middle}
.switch input{opacity:0;width:0;height:0}
.switch .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#334155;transition:.3s;border-radius:18px}
.switch .slider:before{position:absolute;content:"";height:12px;width:12px;left:3px;bottom:3px;background-color:white;transition:.3s;border-radius:50%}
.switch input:checked + .slider{background-color:var(--accent)}
.switch input:checked + .slider:before{transform:translateX(18px)}

/* ========== index.html ========== */
    .hero-video {
      position: absolute; inset: 0; width: 100%; height: 100%;
      object-fit: cover; z-index: 0; opacity: 0; transition: opacity 0.5s;
    }
    .hero-video:has(source) { opacity: 1; }
    .hero {
      position: relative; height: 100vh; min-height: 600px;
      display: flex; align-items: center; overflow: hidden;
      background-image: var(--hero-image, none); background-size: cover; background-position: center;
    }
    .hero-bg-overlay {
      position: absolute; inset: 0;
      background: linear-gradient(to right, rgba(13,15,18,0.92) 0%, rgba(13,15,18,0.80) 50%, rgba(13,15,18,0.55) 100%), radial-gradient(ellipse 50% 70% at 15% 80%, rgba(232,49,42,0.06) 0%, transparent 60%);
      pointer-events: none;
    }
    .hero-grid {
      position: absolute; inset: 0;
      background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px);
      background-size: 48px 48px; opacity: 0.25; pointer-events: none;
    }
    .hero-dartboard {
      position: absolute; right: -60px; top: 50%; transform: translateY(-50%);
      width: 560px; height: 560px; opacity: 0.05; pointer-events: none;
    }
    .dartboard-svg circle { fill: none; stroke: var(--text-primary); }
    .hero-content {
      position: relative; z-index: 2; width: 100%; max-width: 1400px;
      margin: 0 auto; padding: 0 64px; display: flex; align-items: center;
      justify-content: space-between; gap: 80px;
    }
    .hero-left { flex: 0 1 55%; max-width: 640px; }
    .hero-right { flex: 0 1 400px; display: flex; flex-direction: column; gap: 32px; }
    .hero-badge {
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(232,49,42,0.12); border: 1px solid rgba(232,49,42,0.3);
      color: var(--accent); font-size: 11px; font-weight: 600;
      letter-spacing: 0.12em; text-transform: uppercase;
      padding: 5px 14px; border-radius: 100px; margin-bottom: 24px;
    }
    .hero-badge::before {
      content: ''; width: 6px; height: 6px; border-radius: 50%;
      background: var(--accent); animation: pulse 2s infinite;
    }
    @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
    h1 {
      font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 96px;
      line-height: 0.90; letter-spacing: -0.01em; text-transform: uppercase; margin-bottom: 0;
    }
    h1 em { font-style: normal; color: var(--accent); }
    .hero-benefits { display: flex; flex-direction: column; gap: 10px; margin: 28px 0 32px; }
    .hero-benefit { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--text-secondary); }
    .hero-benefit svg { color: var(--accent); flex-shrink: 0; width: 18px; height: 18px; }
    .hero-stats { display: flex; gap: 32px; padding-top: 28px; border-top: 1px solid var(--border); }
    .stat-value { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 32px; color: var(--text-primary); letter-spacing: -0.01em; }
    .stat-value span { color: var(--accent); }
    .stat-label { font-size: 11px; color: var(--text-muted); letter-spacing: 0.08em; text-transform: uppercase; margin-top: 2px; }
    .hero-sub { font-size: 17px; color: var(--text-secondary); line-height: 1.7; }
    .hero-actions { display: flex; align-items: center; gap: 16px; }
    .btn-primary {
      display: inline-flex; align-items: center; gap: 10px;
      background: linear-gradient(to right, var(--accent-dim) 50%, var(--accent) 50%);
      background-size: 200% 100%; background-position: right center;
      color: #fff; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 17px;
      letter-spacing: 0.06em; text-transform: uppercase; padding: 14px 32px;
      border-radius: var(--radius); text-decoration: none; border: none; cursor: pointer;
      transition: background-position 0.3s ease, box-shadow 0.2s;
    }
    .btn-primary:hover { background-position: left center; box-shadow: 0 0 28px rgba(232,49,42,0.4); }
    .btn-primary svg { flex-shrink: 0; }
    .btn-ghost { display: inline-flex; align-items: center; gap: 8px; color: var(--text-secondary); font-size: 14px; font-weight: 500; text-decoration: none; transition: color 0.15s; }
    .btn-ghost:hover { color: var(--text-primary); }
    .section { padding: 96px 48px; }
    .section-label { font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); margin-bottom: 12px; }
    .section-title { font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: 44px; text-transform: uppercase; letter-spacing: -0.01em; line-height: 1; margin-bottom: 56px; }
    .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; }
    .step { background: var(--bg-card); border: 1px solid var(--border); padding: 36px 32px; position: relative; }
    .step:first-child { border-radius: var(--radius) 0 0 var(--radius); }
    .step:last-child  { border-radius: 0 var(--radius) var(--radius) 0; }
    .step-num { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 64px; line-height: 1; color: var(--border); margin-bottom: 16px; }
    .step-icon { width: 40px; height: 40px; background: var(--accent-glow); border: 1px solid rgba(232,49,42,0.2); border-radius: var(--radius); display: flex; align-items: center; justify-content: center; margin-bottom: 16px; color: var(--accent); font-size: 18px; }
    .step h3 { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 20px; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 8px; }
    .step p { font-size: 13px; color: var(--text-secondary); line-height: 1.65; }
    .darts-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 56px; }
    .dart-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 24px; transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s; }
    .dart-card:hover { border-color: rgba(232,49,42,0.4); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.35); }
    .dart-card-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; }
    .dart-brand { font-size: 11px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); }
    .dart-name { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 20px; text-transform: uppercase; letter-spacing: 0.03em; margin-top: 2px; }
    .match-badge { background: var(--accent-glow); border: 1px solid rgba(232,49,42,0.25); color: var(--accent); font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 18px; padding: 4px 10px; border-radius: 4px; white-space: nowrap; }
    .dart-visual { height: 3px; background: linear-gradient(90deg, var(--accent) 0%, var(--accent-dim) 60%, var(--bg-surface) 100%); border-radius: 2px; margin: 20px 0; }
    .dart-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .spec { background: var(--bg-surface); border-radius: 4px; padding: 8px 10px; }
    .spec-label { font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); }
    .spec-value { font-size: 14px; font-weight: 600; color: var(--text-primary); margin-top: 2px; }
    .cta-band { margin: 0 48px 96px; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: 56px 64px; display: flex; align-items: center; justify-content: space-between; gap: 40px; position: relative; overflow: hidden; }
    .cta-band::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent); }
    .cta-band-text h2 { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 40px; text-transform: uppercase; line-height: 1; margin-bottom: 8px; }
    .cta-band-text p { color: var(--text-secondary); font-size: 15px; }
    .darts-grid:has(.dart-card:hover) .dart-card:not(:hover) { transform: scale(0.97); opacity: 0.65; transition: transform 0.2s ease, opacity 0.2s ease; }
    .dart-card:hover { transform: translateY(-8px) scale(1.02) !important; border-color: rgba(232,49,42,0.5) !important; box-shadow: 0 20px 40px rgba(0,0,0,0.45), 0 0 28px rgba(232,49,42,0.12) !important; }
    @media(max-width:768px){
      .hero{min-height:auto;height:auto;padding:48px 0 40px}
      .hero-content{flex-direction:column;gap:40px;padding:0 20px}
      .hero-left{flex:none;width:100%;max-width:none}
      .hero-right{flex:none;width:100%}
      .hero-dartboard{display:none}
      h1{font-size:44px!important;line-height:.95}
      .hero-sub{font-size:15px}
      .hero-badge{font-size:10px}
      .hero-actions{flex-direction:column;gap:12px;align-items:flex-start}
      .btn-primary{width:100%;justify-content:center;padding:14px 24px}
      .hero-stats{gap:24px}
      .stat-value{font-size:26px}
      .section{padding:48px 20px}
      .section-title{font-size:32px;margin-bottom:32px}
      .steps{grid-template-columns:1fr;gap:12px}
      .step:first-child,.step:last-child{border-radius:var(--radius)}
      .step{border-radius:var(--radius)}
      .step-num{font-size:48px}
      .darts-grid{grid-template-columns:1fr 1fr;gap:12px;margin-top:32px}
      .dart-card{padding:16px}
      .dart-name{font-size:16px}
      .dart-specs{gap:6px}
      .spec{padding:6px 8px}
      .spec-label{font-size:9px}
      .spec-value{font-size:12px}
      .cta-band{margin:0 20px 48px;padding:32px 24px;flex-direction:column;text-align:center;gap:20px}
      .cta-band-text h2{font-size:28px}
      .cta-band-text p{font-size:13px}
    }
    @media(max-width:480px){
      h1{font-size:36px!important}
      .hero-stats{flex-direction:column;gap:16px}
      .darts-grid{grid-template-columns:1fr}
      .section-title{font-size:26px}
      .cta-band{margin:0 12px 32px;padding:24px 16px}
      .cta-band-text h2{font-size:24px}
    }

/* ========== finder.html ========== */
.container{max-width:1200px;margin:0 auto;padding:24px 48px 48px}
.page-header{margin-bottom:24px}
.page-header h1{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:36px;text-transform:uppercase;letter-spacing:-.01em}
.page-header p{color:var(--text-secondary);font-size:14px;margin-top:4px}
.filters{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px 24px;margin-bottom:24px}
.sect{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:14px;font-weight:600}
.slider-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin-bottom:24px}
.slider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.slider-label{font-size:13px;color:var(--text-secondary)}
.slider-val{font-size:13px;font-weight:600;color:var(--text-primary)}
.skip-lbl{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--text-muted);cursor:pointer;white-space:nowrap;user-select:none}
.slider-wrap{position:relative;transition:opacity .2s}
.slider-wrap.skipped{opacity:.2;pointer-events:none}
.range-wrap{position:relative;height:20px;margin:4px 0}
.range-wrap input[type=range]{position:absolute;width:100%;height:4px;background:transparent;-webkit-appearance:none;appearance:none;pointer-events:none;top:50%;transform:translateY(-50%)}
.range-wrap input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent);border:2px solid var(--text-primary);cursor:pointer;pointer-events:all;transition:transform .1s}
.range-wrap input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}
.range-wrap input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--accent);border:2px solid var(--text-primary);cursor:pointer;pointer-events:all}
.range-track{position:absolute;top:50%;transform:translateY(-50%);height:4px;width:100%;background:var(--border);border-radius:4px;z-index:0}
.range-fill{position:absolute;top:50%;transform:translateY(-50%);height:4px;background:var(--accent);border-radius:4px;z-index:1;pointer-events:none}
.range-hints{display:flex;justify-content:space-between;margin-top:4px;font-size:11px;color:var(--text-muted)}
.chip-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.chip-label{font-size:12px;color:var(--text-secondary);font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.chip-label-wrap{display:flex;align-items:center;gap:6px;margin-bottom:6px;position:relative}
.tip-btn{width:15px;height:15px;border-radius:50%;border:1px solid var(--border);background:var(--bg-card);color:var(--text-muted);font-size:9px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:border-color .12s,color .12s;line-height:1;padding:0}
.tip-btn:hover{border-color:var(--accent);color:var(--accent)}
.tip-popup{display:none;position:absolute;top:calc(100% + 4px);left:0;z-index:200;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;font-size:12px;color:var(--text-secondary);line-height:1.6;width:240px;box-shadow:0 4px 16px rgba(0,0,0,.5);pointer-events:none;font-weight:400;text-transform:none;letter-spacing:0}
.tip-popup.open{display:block;pointer-events:auto}
.chip-group{display:flex;flex-wrap:wrap;gap:5px}
.chip{font-size:12px;padding:4px 12px;border-radius:20px;border:1px solid var(--border);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;user-select:none;transition:all .12s}
.chip:hover{border-color:#444}
.chip.on{background:rgba(232,49,42,.15);border-color:var(--accent);color:var(--text-primary);font-weight:500}
.chip-visual{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 10px;min-width:72px;border-radius:var(--radius);height:auto;color:var(--text-secondary)}
.chip-visual svg{display:block;flex-shrink:0}
.chip-visual span{font-size:11px;white-space:nowrap}
.chip-visual.on{color:var(--accent)}
.results-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:8px}
.results-meta{font-size:14px;font-weight:600;color:var(--text-primary)}
.results-sub{font-size:11px;color:var(--text-muted);margin-top:2px}
.legend{display:flex;gap:16px;font-size:12px;color:var(--text-muted)}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:4px}
.results-list{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.dart-card{display:flex;align-items:flex-start;justify-content:space-between;padding:14px 20px;border-bottom:1px solid rgba(34,38,54,.6);gap:16px;border-left:3px solid transparent;transition:background .15s}
.dart-card:hover{background:rgba(26,30,43,.8)}
.dart-card:last-child{border-bottom:none}
.dart-name{font-family:'Barlow Condensed',sans-serif;font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:2px;text-transform:uppercase;letter-spacing:.02em}
.dart-brand{font-size:12px;color:var(--text-muted);margin-bottom:8px}
.tags{display:flex;flex-wrap:wrap;gap:4px}
.tag{font-size:11px;padding:2px 8px;border-radius:4px;background:var(--bg-card);border:1px solid var(--border);color:var(--text-secondary);white-space:nowrap}
.tag.std{background:rgba(232,49,42,.08);border-color:rgba(232,49,42,.2);color:var(--accent)}
.match-col{text-align:right;flex-shrink:0;min-width:70px}
.match-pct{font-family:'Barlow Condensed',sans-serif;font-size:28px;font-weight:700;line-height:1}
.match-lbl{font-size:11px;color:var(--text-muted);margin-top:2px}
.bar-bg{width:64px;height:4px;background:var(--bg-card);border-radius:4px;margin-top:6px;margin-left:auto}
.bar{height:4px;border-radius:4px}
.empty{padding:48px;text-align:center;color:var(--text-muted);font-size:14px}
.loading{padding:48px;text-align:center;color:var(--text-secondary);font-size:14px}
.why-row{display:none;background:rgba(26,30,43,.9);border-top:1px solid rgba(34,38,54,.8);padding:12px 20px;gap:8px;flex-wrap:wrap;align-items:center}
.why-row.open{display:flex}
.why-label{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-right:4px}
.why-chip{font-size:11px;padding:3px 9px;border-radius:4px;font-weight:500}
.why-chip.hit{background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.3);color:#22c55e}
.why-chip.miss{background:rgba(74,79,101,.15);border:1px solid var(--border);color:var(--text-muted)}
.why-chip.neutral{background:rgba(74,79,101,.1);border:1px solid var(--border);color:var(--text-muted)}
.dart-card-wrap{border-bottom:1px solid rgba(34,38,54,.6)}
.dart-card-wrap:last-child{border-bottom:none}
.dart-card{border-bottom:none!important}
.why-toggle{font-size:11px;color:var(--text-muted);background:none;border:none;cursor:pointer;padding:0;text-decoration:underline;transition:color .12s;white-space:nowrap;flex-shrink:0}
.why-toggle:hover{color:var(--text-secondary)}
.show-more{display:block;width:100%;padding:14px;background:var(--bg-card);border:none;border-top:1px solid var(--border);color:var(--accent);font-family:'Barlow Condensed',sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;cursor:pointer;transition:background .15s}
.show-more:hover{background:rgba(232,49,42,.08)}
@media(max-width:768px){
  .container{padding:16px 20px 48px}
  .page-header h1{font-size:28px}
  .filters{padding:16px}
  .slider-grid{grid-template-columns:1fr}
  .chip-grid{grid-template-columns:1fr 1fr}
  .dart-card{flex-direction:column;gap:8px}
  .match-col{text-align:left;display:flex;align-items:center;gap:12px}
  .match-pct{font-size:20px}
}
@media(max-width:480px){
  .chip-grid{grid-template-columns:1fr}
  .page-header h1{font-size:24px}
}

/* ========== dart.html ========== */
.container{max-width:900px;margin:0 auto;padding:32px 48px 64px}
.breadcrumb{display:flex;gap:8px;font-size:12px;color:var(--text-muted);margin-bottom:28px}
.breadcrumb a{color:var(--text-muted);text-decoration:none}
.breadcrumb a:hover{color:var(--text-secondary)}
.breadcrumb span{color:var(--text-muted)}
.product-header{margin-bottom:32px}
.product-brand{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.product-name{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:48px;text-transform:uppercase;letter-spacing:-.01em;line-height:1;margin-bottom:16px}
.weight-selector{display:flex;gap:8px;margin-bottom:32px;flex-wrap:wrap}
.weight-btn{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:16px;padding:10px 24px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;transition:all .15s;text-transform:uppercase;letter-spacing:.04em}
.weight-btn:hover{border-color:rgba(232,49,42,.4);color:var(--text-primary)}
.weight-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}
.specs-section{margin-bottom:40px}
.specs-title{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:20px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.specs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.spec-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px}
.spec-label{font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);margin-bottom:4px}
.spec-value{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:24px;color:var(--text-primary)}
.spec-value.accent{color:var(--accent)}
.barrel-visual{margin:32px 0;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;position:relative}
.barrel-vis-title{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-bottom:16px}
.barrel-bar{height:8px;background:var(--bg-surface);border-radius:4px;position:relative;overflow:hidden}
.barrel-fill{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--accent),var(--accent-dim));transition:width .3s}
.barrel-markers{display:flex;justify-content:space-between;margin-top:6px;font-size:10px;color:var(--text-muted)}
.variants-section{margin-top:40px}
.variants-table{width:100%;border-collapse:collapse;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.variants-table th{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);padding:12px 16px;text-align:left;border-bottom:1px solid var(--border);background:var(--bg-surface)}
.variants-table td{padding:12px 16px;font-size:14px;border-bottom:1px solid rgba(34,38,54,.4)}
.variants-table tr:last-child td{border-bottom:none}
.variants-table tr.active-row{background:rgba(232,49,42,.06)}
.variants-table tr.active-row td:first-child{font-weight:700;color:var(--accent)}
.product-cta{margin-top:40px;padding-top:32px;border-top:1px solid var(--border);display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.similar-section{margin-top:48px;padding-top:32px;border-top:1px solid var(--border)}
.similar-title{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:20px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:16px}
.similar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.similar-card{display:block;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;text-decoration:none;color:inherit;transition:border-color .15s,transform .15s,box-shadow .15s}
.similar-card:hover{border-color:rgba(232,49,42,.4);transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.35)}
.similar-brand{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}
.similar-name{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.02em;margin-bottom:8px;line-height:1.2}
.similar-tags{display:flex;flex-wrap:wrap;gap:4px}
.similar-tag{font-size:11px;padding:2px 7px;border-radius:3px;background:var(--bg-surface);border:1px solid var(--border);color:var(--text-secondary)}
.btn-primary{display:inline-flex;align-items:center;gap:10px;background:var(--accent);color:#fff;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:17px;letter-spacing:.06em;text-transform:uppercase;padding:14px 32px;border-radius:var(--radius);text-decoration:none;border:none;cursor:pointer;transition:background .15s,box-shadow .15s}
.btn-primary:hover{background:var(--accent-dim);box-shadow:0 0 24px rgba(232,49,42,.35)}
.btn-ghost{display:inline-flex;align-items:center;gap:8px;color:var(--text-secondary);font-size:14px;font-weight:500;text-decoration:none;transition:color .15s}
.btn-ghost:hover{color:var(--text-primary)}
.btn-compare{display:inline-flex;align-items:center;gap:8px;background:var(--bg-card);border:1px solid var(--accent);color:var(--accent);font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:15px;letter-spacing:.04em;text-transform:uppercase;padding:12px 24px;border-radius:var(--radius);cursor:pointer;transition:all .15s}
.btn-compare:hover{background:rgba(232,49,42,.1)}
.btn-compare.added{background:var(--accent);color:#fff;border-color:var(--accent)}
.compare-toast{position:fixed;bottom:24px;right:24px;background:var(--bg-card);border:1px solid var(--accent);border-radius:var(--radius);padding:14px 20px;display:flex;align-items:center;gap:12px;z-index:200;box-shadow:0 8px 24px rgba(0,0,0,.4);transform:translateY(100px);opacity:0;transition:all .3s;font-size:13px}
.compare-toast.show{transform:translateY(0);opacity:1}
.compare-toast a{color:var(--accent);font-weight:600;text-decoration:none}
.compare-toast a:hover{text-decoration:underline}
.loading-state{padding:80px;text-align:center;color:var(--text-secondary)}
.not-found{padding:80px;text-align:center}
.not-found h2{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:36px;text-transform:uppercase;margin-bottom:12px}
.not-found p{color:var(--text-secondary);margin-bottom:24px}
@media(max-width:768px){
  .container{padding:24px 20px 48px}
  .product-name{font-size:32px}
  .specs-grid{grid-template-columns:1fr 1fr}
  .weight-selector{gap:6px}
  .weight-btn{padding:8px 16px;font-size:14px}
  .variants-table{font-size:12px}
  .variants-table th,.variants-table td{padding:8px 10px}
  .product-cta{flex-direction:column;align-items:stretch}
  .product-cta .btn-primary,.product-cta .btn-compare{width:100%;justify-content:center;text-align:center}
  .compare-toast{left:16px;right:16px;bottom:16px}
}
@media(max-width:480px){
  .product-name{font-size:26px}
  .specs-grid{grid-template-columns:1fr}
  .breadcrumb{font-size:11px}
  .barrel-visual{padding:16px}
}

/* ========== compare.html ========== */
.container{max-width:1200px;margin:0 auto;padding:32px 48px 64px}
.page-header{margin-bottom:24px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.page-header h1{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:36px;text-transform:uppercase;letter-spacing:-.01em}
.page-header p{color:var(--text-secondary);font-size:14px;margin-top:4px}
.clear-btn{background:none;border:1px solid var(--border);border-radius:var(--radius);padding:8px 16px;color:var(--text-muted);font-size:12px;cursor:pointer;transition:all .15s}
.clear-btn:hover{border-color:var(--accent);color:var(--accent)}
.add-section{margin-bottom:32px}
.add-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.add-search{flex:1;min-width:240px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:12px 16px;color:var(--text-primary);font-family:'DM Sans','Inter',sans-serif;font-size:14px;outline:none;transition:border-color .15s}
.add-search:focus{border-color:var(--accent)}
.add-search::placeholder{color:var(--text-muted)}
.search-results{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);margin-top:4px;max-height:240px;overflow-y:auto;display:none}
.search-results.open{display:block}
.sr-item{padding:10px 16px;cursor:pointer;transition:background .1s;font-size:13px;border-bottom:1px solid rgba(34,38,54,.4)}
.sr-item:last-child{border-bottom:none}
.sr-item:hover{background:rgba(232,49,42,.06)}
.sr-item .sr-name{color:var(--text-primary);font-weight:500}
.sr-item .sr-brand{color:var(--text-muted);font-size:11px;margin-left:8px}
.sr-item .sr-specs{color:var(--text-muted);font-size:11px;margin-top:2px}
.limit-msg{font-size:12px;color:var(--text-muted);margin-left:8px}
.compare-empty{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);padding:64px;text-align:center;color:var(--text-muted)}
.compare-empty h2{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:24px;text-transform:uppercase;color:var(--text-secondary);margin-bottom:8px}
.compare-grid{display:grid;gap:0;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.compare-row{display:grid;border-bottom:1px solid rgba(34,38,54,.5)}
.compare-row:last-child{border-bottom:none}
.compare-row.header-row{background:var(--bg-card)}
.compare-cell{padding:12px 16px;font-size:13px;color:var(--text-secondary);border-right:1px solid rgba(34,38,54,.3);display:flex;align-items:center}
.compare-cell:last-child{border-right:none}
.compare-cell.label-cell{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);background:var(--bg-card);min-width:120px}
.compare-cell.best{color:var(--accent);font-weight:600}
.dart-header{padding:16px;text-align:center;position:relative}
.dart-header .dh-brand{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-bottom:4px}
.dart-header .dh-name{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.02em;color:var(--text-primary);margin-bottom:8px}
.dart-header .dh-weight{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:20px;color:var(--accent)}
.remove-btn{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:#ef4444;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;line-height:1}
.remove-btn:hover{background:rgba(239,68,68,.2);border-color:#ef4444}
.view-link{display:inline-block;margin-top:8px;font-size:11px;color:var(--accent);text-decoration:none;font-weight:500}
.view-link:hover{text-decoration:underline}
.dh-weights{display:flex;gap:4px;justify-content:center;margin-top:8px;flex-wrap:wrap}
.dh-wbtn{font-size:11px;padding:3px 10px;border-radius:12px;border:1px solid var(--border);background:var(--bg-surface);color:var(--text-muted);cursor:pointer;transition:all .12s}
.dh-wbtn:hover{border-color:rgba(232,49,42,.4)}
.dh-wbtn.active{background:var(--accent);border-color:var(--accent);color:#fff}
.compare-row.diff .compare-cell:not(.label-cell){background:rgba(232,49,42,.03)}
@media(max-width:768px){
  .container{padding:16px 20px}
  .page-header{flex-direction:column;align-items:flex-start}
  .page-header h1{font-size:28px}
  .compare-grid{overflow-x:auto}
  .compare-row{min-width:600px}
  .compare-cell{padding:8px 10px;font-size:12px}
  .compare-cell.label-cell{min-width:80px;font-size:10px}
  .dart-header .dh-name{font-size:13px}
  .dart-header .dh-weight{font-size:16px}
  .add-row{flex-direction:column}
}
@media(max-width:480px){.page-header h1{font-size:24px}}

/* ========== database.html ========== */
.container{max-width:1200px;margin:0 auto;padding:32px 48px 64px}
.page-header{margin-bottom:24px}
.page-header h1{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:36px;text-transform:uppercase;letter-spacing:-.01em}
.page-header p{color:var(--text-secondary);font-size:14px;margin-top:4px}
.controls{display:flex;gap:12px;margin-bottom:20px;flex-wrap:wrap;align-items:center}
.search-box{flex:1;min-width:200px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 16px;color:var(--text-primary);font-family:'DM Sans','Inter',sans-serif;font-size:14px;outline:none;transition:border-color .15s}
.search-box:focus{border-color:var(--accent)}
.search-box::placeholder{color:var(--text-muted)}
.filter-select{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 36px 10px 12px;color:var(--text-primary);font-family:'DM Sans','Inter',sans-serif;font-size:13px;outline:none;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%234a4f65' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.filter-select option{background:var(--bg-card);color:var(--text-primary)}
.sort-btn{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;color:var(--text-secondary);font-size:13px;cursor:pointer;transition:all .12s;white-space:nowrap}
.sort-btn:hover{border-color:rgba(232,49,42,.4);color:var(--text-primary)}
.sort-btn.active{border-color:var(--accent);color:var(--accent)}
.results-count{font-size:13px;color:var(--text-muted);margin-bottom:12px}
.active-filters{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:10px;min-height:0}
.filter-pill{display:inline-flex;align-items:center;gap:5px;background:rgba(232,49,42,.1);border:1px solid rgba(232,49,42,.3);color:var(--accent);font-size:12px;padding:3px 10px;border-radius:100px}
.filter-pill-x{background:none;border:none;color:var(--accent);cursor:pointer;font-size:14px;line-height:1;padding:0;opacity:.7;transition:opacity .12s}
.filter-pill-x:hover{opacity:1}
.btn-clear-all{background:none;border:none;color:var(--text-muted);font-size:12px;cursor:pointer;text-decoration:underline;padding:2px 0;transition:color .15s;margin-left:4px}
.btn-clear-all:hover{color:var(--text-secondary)}
.db-table{width:100%;border-collapse:collapse;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.db-table th{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);padding:12px 14px;text-align:left;border-bottom:1px solid var(--border);background:var(--bg-card);cursor:pointer;user-select:none;transition:color .15s;white-space:nowrap}
.db-table th:hover{color:var(--text-primary)}
.db-table th.sorted{color:var(--accent)}
.db-table th .arrow{font-size:10px;margin-left:4px}
.db-table td{padding:10px 14px;font-size:13px;border-bottom:1px solid rgba(34,38,54,.4);color:var(--text-secondary)}
.db-table tr:last-child td{border-bottom:none}
.db-table tr:hover td{background:rgba(26,30,43,.6)}
.db-table tr{cursor:pointer;transition:background .12s}
.db-table .dart-link{color:var(--text-primary);font-weight:500;text-decoration:none}
.db-table .dart-link:hover{color:var(--accent)}
.db-table .brand-cell{color:var(--text-muted);font-size:12px}
.db-table .tag-cell{font-size:11px;padding:2px 6px;border-radius:3px;background:rgba(232,49,42,.08);color:var(--accent);display:inline-block}
.pagination{display:flex;gap:8px;justify-content:center;margin-top:20px;align-items:center}
.page-btn{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:8px 14px;color:var(--text-secondary);font-size:13px;cursor:pointer;transition:all .12s}
.page-btn:hover{border-color:rgba(232,49,42,.4);color:var(--text-primary)}
.page-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}
.page-btn:disabled{opacity:.3;cursor:not-allowed}
.page-info{font-size:12px;color:var(--text-muted)}
@media(max-width:768px){
  .container{padding:16px 20px}
  .page-header h1{font-size:28px}
  .controls{flex-direction:column}
  .search-box{min-width:100%}
  .db-table{font-size:12px}
  .db-table th,.db-table td{padding:8px 8px}
}
@media(max-width:480px){
  .db-table th:nth-child(4),.db-table td:nth-child(4),
  .db-table th:nth-child(5),.db-table td:nth-child(5),
  .db-table th:nth-child(8),.db-table td:nth-child(8){display:none}
  .page-header h1{font-size:24px}
}

/* ========== privacy.html ========== */
.container{max-width:720px;margin:0 auto;padding:64px 48px}
.page-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(232,49,42,.12);border:1px solid rgba(232,49,42,.3);color:var(--accent);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:5px 14px;border-radius:100px;margin-bottom:20px}
h1{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:48px;text-transform:uppercase;letter-spacing:-.01em;line-height:1;margin-bottom:8px}
.page-sub{color:var(--text-muted);font-size:13px;margin-bottom:40px}
.content h2{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:22px;text-transform:uppercase;letter-spacing:.03em;margin:40px 0 12px;color:var(--text-primary);padding-bottom:8px;border-bottom:1px solid var(--border)}
.content p{color:var(--text-secondary);font-size:15px;line-height:1.75;margin-bottom:16px}
.content p strong{color:var(--text-primary)}
.content ul{color:var(--text-secondary);font-size:15px;line-height:1.75;margin:0 0 16px 20px}
.content ul li{margin-bottom:6px}
.content ul li strong{color:var(--text-primary)}
.highlight-box{background:var(--bg-card);border:1px solid var(--border);border-left:4px solid var(--accent);border-radius:var(--radius);padding:20px 24px;margin:24px 0}
.highlight-box p{margin-bottom:0;color:var(--text-secondary);font-size:14px}
.highlight-box p strong{color:var(--text-primary)}
.cookie-table{width:100%;border-collapse:collapse;margin:20px 0 28px}
.cookie-table th{background:var(--bg-surface);color:var(--text-secondary);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:10px 14px;text-align:left;border-bottom:2px solid var(--border)}
.cookie-table td{padding:12px 14px;border-bottom:1px solid var(--border);color:var(--text-secondary);font-size:14px;vertical-align:top}
.cookie-table td:first-child{color:var(--text-primary);font-weight:500}
.cookie-table tr:last-child td{border-bottom:none}
.cookie-table tr:hover td{background:rgba(255,255,255,.02)}
.rights-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:16px 0 24px}
.right-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px}
.right-item strong{display:block;color:var(--text-primary);font-size:13px;font-weight:600;margin-bottom:4px}
.right-item span{color:var(--text-muted);font-size:12px;line-height:1.5}
@media(max-width:768px){
  .container{padding:32px 20px}
  h1{font-size:32px}
  .rights-grid{grid-template-columns:1fr}
  .cookie-table th,.cookie-table td{padding:10px 10px;font-size:13px}
}
@media(max-width:480px){h1{font-size:26px}.page-sub{font-size:13px}}

/* ========== contact.html ========== */
.container{max-width:640px;margin:0 auto;padding:64px 48px}
.page-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(232,49,42,.12);border:1px solid rgba(232,49,42,.3);color:var(--accent);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:5px 14px;border-radius:100px;margin-bottom:20px}
h1{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:48px;text-transform:uppercase;letter-spacing:-.01em;line-height:1;margin-bottom:12px}
.page-sub{color:var(--text-secondary);font-size:15px;margin-bottom:40px}
.form-group{margin-bottom:20px}
.form-label{display:block;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:6px}
.form-input,.form-textarea,.form-select{width:100%;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:12px 16px;color:var(--text-primary);font-family:'DM Sans','Inter',sans-serif;font-size:14px;transition:border-color .15s;outline:none}
.form-input:focus,.form-textarea:focus,.form-select:focus{border-color:var(--accent)}
.form-input::placeholder,.form-textarea::placeholder{color:var(--text-muted)}
.form-textarea{min-height:140px;resize:vertical}
.form-select{cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%234a4f65' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
.form-select option{background:var(--bg-card);color:var(--text-primary)}
.btn-submit{display:inline-flex;align-items:center;gap:10px;background:var(--accent);color:#fff;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:17px;letter-spacing:.06em;text-transform:uppercase;padding:14px 40px;border-radius:var(--radius);border:none;cursor:pointer;transition:background .15s,box-shadow .15s;width:100%;justify-content:center}
.btn-submit:hover{background:var(--accent-dim);box-shadow:0 0 24px rgba(232,49,42,.35)}
.form-note{font-size:12px;color:var(--text-muted);margin-top:16px;text-align:center}
.success-msg{display:none;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);border-radius:var(--radius);padding:20px;text-align:center;color:#22c55e;font-weight:500;margin-top:20px}
@media(max-width:768px){.container{padding:32px 20px}h1{font-size:32px}}
@media(max-width:480px){h1{font-size:26px}.page-sub{font-size:14px}}

/* ========== Utility classes (inline-style replacements) ========== */
.pt-0 { padding-top: 0; }
.link-reset { text-decoration: none; color: inherit; }
.filter-header-wrap { display: flex; align-items: center; gap: 6px; position: relative; }
.filter-value-wrap  { display: flex; align-items: center; gap: 8px; }
.dot-great  { background: #22c55e; }
.dot-good   { background: #f59e0b; }
.dot-weak   { background: #ef4444; }
.tag-best { background: rgba(34,197,94,.15); border-color: rgba(34,197,94,.4); color: #22c55e; font-weight: 600; }
.card-flex-content { min-width: 0; flex: 1; }
.tags-mb { margin-bottom: 6px; }
.opacity-75 { opacity: .75; }
.card-great { border-left-color: #22c55e; }
.card-good  { border-left-color: #f59e0b; }
.card-weak  { border-left-color: #ef4444; }
.match-great { color: #22c55e; }
.match-good  { color: #f59e0b; }
.match-weak  { color: #ef4444; }
.bar-great { background: #22c55e; }
.bar-good  { background: #f59e0b; }
.bar-weak  { background: #ef4444; }
.cursor-pointer { cursor: pointer; }
.search-wrap  { flex: 1; min-width: 240px; position: relative; }
.text-muted-sm { color: var(--text-muted); }
.share-url-wrap { margin-top: 16px; font-size: 12px; color: var(--text-muted); }
.link-accent { color: var(--accent); }
.label-muted { color: var(--text-muted); font-size: 12px; }
.bot-field { display: none; }

/* ========== Bar width classes (0-100%) ========== */
.bar-w-0{width:0%}.bar-w-1{width:1%}.bar-w-2{width:2%}.bar-w-3{width:3%}.bar-w-4{width:4%}
.bar-w-5{width:5%}.bar-w-6{width:6%}.bar-w-7{width:7%}.bar-w-8{width:8%}.bar-w-9{width:9%}
.bar-w-10{width:10%}.bar-w-11{width:11%}.bar-w-12{width:12%}.bar-w-13{width:13%}.bar-w-14{width:14%}
.bar-w-15{width:15%}.bar-w-16{width:16%}.bar-w-17{width:17%}.bar-w-18{width:18%}.bar-w-19{width:19%}
.bar-w-20{width:20%}.bar-w-21{width:21%}.bar-w-22{width:22%}.bar-w-23{width:23%}.bar-w-24{width:24%}
.bar-w-25{width:25%}.bar-w-26{width:26%}.bar-w-27{width:27%}.bar-w-28{width:28%}.bar-w-29{width:29%}
.bar-w-30{width:30%}.bar-w-31{width:31%}.bar-w-32{width:32%}.bar-w-33{width:33%}.bar-w-34{width:34%}
.bar-w-35{width:35%}.bar-w-36{width:36%}.bar-w-37{width:37%}.bar-w-38{width:38%}.bar-w-39{width:39%}
.bar-w-40{width:40%}.bar-w-41{width:41%}.bar-w-42{width:42%}.bar-w-43{width:43%}.bar-w-44{width:44%}
.bar-w-45{width:45%}.bar-w-46{width:46%}.bar-w-47{width:47%}.bar-w-48{width:48%}.bar-w-49{width:49%}
.bar-w-50{width:50%}.bar-w-51{width:51%}.bar-w-52{width:52%}.bar-w-53{width:53%}.bar-w-54{width:54%}
.bar-w-55{width:55%}.bar-w-56{width:56%}.bar-w-57{width:57%}.bar-w-58{width:58%}.bar-w-59{width:59%}
.bar-w-60{width:60%}.bar-w-61{width:61%}.bar-w-62{width:62%}.bar-w-63{width:63%}.bar-w-64{width:64%}
.bar-w-65{width:65%}.bar-w-66{width:66%}.bar-w-67{width:67%}.bar-w-68{width:68%}.bar-w-69{width:69%}
.bar-w-70{width:70%}.bar-w-71{width:71%}.bar-w-72{width:72%}.bar-w-73{width:73%}.bar-w-74{width:74%}
.bar-w-75{width:75%}.bar-w-76{width:76%}.bar-w-77{width:77%}.bar-w-78{width:78%}.bar-w-79{width:79%}
.bar-w-80{width:80%}.bar-w-81{width:81%}.bar-w-82{width:82%}.bar-w-83{width:83%}.bar-w-84{width:84%}
.bar-w-85{width:85%}.bar-w-86{width:86%}.bar-w-87{width:87%}.bar-w-88{width:88%}.bar-w-89{width:89%}
.bar-w-90{width:90%}.bar-w-91{width:91%}.bar-w-92{width:92%}.bar-w-93{width:93%}.bar-w-94{width:94%}
.bar-w-95{width:95%}.bar-w-96{width:96%}.bar-w-97{width:97%}.bar-w-98{width:98%}.bar-w-99{width:99%}
.bar-w-100{width:100%}

/* ========== Compare grid column layouts ========== */
.compare-cols-1 { grid-template-columns: 140px repeat(1, 1fr); }
.compare-cols-2 { grid-template-columns: 140px repeat(2, 1fr); }
.compare-cols-3 { grid-template-columns: 140px repeat(3, 1fr); }
.compare-cols-4 { grid-template-columns: 140px repeat(4, 1fr); }

/* ========== Featured dart card visual bar colors ========== */
.featured-visual-0 { background: linear-gradient(90deg, var(--accent) 0%, var(--accent-dim) 60%, var(--bg-surface) 100%); }
.featured-visual-1 { background: linear-gradient(90deg, #4a6fa5 0%, #4a6fa5 60%, var(--bg-surface) 100%); }
.featured-visual-2 { background: linear-gradient(90deg, #3ab0a0 0%, #3ab0a0 60%, var(--bg-surface) 100%); }
.featured-visual-3 { background: linear-gradient(90deg, #d97706 0%, #d97706 60%, var(--bg-surface) 100%); }
.featured-visual-4 { background: linear-gradient(90deg, #8b5cf6 0%, #8b5cf6 60%, var(--bg-surface) 100%); }
.featured-visual-5 { background: linear-gradient(90deg, #ec4899 0%, #ec4899 60%, var(--bg-surface) 100%); }