/* =========================================================================
   מצפן פריימריז - design system (R2 redesign)
   One sans font (Heebo), mobile-first, master-detail results.
   ========================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500;600;700;800;900&display=swap');

:root{
  /* palette */
  --bg:#e9eef6;
  --surface:#ffffff;
  --surface-2:#f4f7fc;
  --surface-3:#eaf0f8;
  --ink:#0f1b2d;
  --ink-2:#33425b;
  --muted:#67768d;
  --line:#dce4ef;
  --line-2:#c9d4e3;
  --brand:#1d5fd6;
  --brand-dark:#123f96;
  --brand-50:#eaf1fe;
  --brand-100:#d6e4fd;
  --good:#0f9d6b;
  --good-bg:#e4f6ee;
  --good-dark:#0a7a52;
  --good-100:#c6ecdb;
  /* 3rd accent (violet) for result actions: the change-selection toggle + show-results button */
  --accent:#6b46e0;
  --accent-bg:#efeafb;
  --accent-dark:#5233c0;
  --accent-100:#ddd2f6;
  --mid:#d98a0b;
  --mid-bg:#fbf0d9;
  --low:#8694a8;
  --danger:#c23a2b;
  /* type */
  --font-sans:"Heebo","Assistant","Noto Sans Hebrew",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  /* shape */
  --radius:20px;
  --radius-md:14px;
  --radius-sm:10px;
  --pill:999px;
  --shadow-sm:0 1px 2px rgba(15,27,45,.05),0 3px 10px rgba(15,27,45,.05);
  --shadow:0 14px 40px rgba(15,27,45,.10);
  --shadow-lg:0 24px 60px rgba(15,27,45,.16);
  --wrap:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px;overflow-x:clip}
/* safety net: no stray wide element can ever shift/scroll the page horizontally */
body{overflow-x:clip;max-width:100%}
/* Animate <details> open/close (change-selection, all-candidates, wizard steps, etc.).
   Uses the modern ::details-content + interpolate-size; degrades to instant elsewhere. */
@media (prefers-reduced-motion:no-preference){
  details{interpolate-size:allow-keywords}
  details::details-content{block-size:0;overflow:clip;transition:block-size .26s ease,content-visibility .26s allow-discrete}
  details[open]::details-content{block-size:auto}
}
body{
  margin:0;
  font-family:var(--font-sans);
  font-weight:400;
  background:var(--bg);
  color:var(--ink);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
/* guarantee: never a serif, anywhere */
*,*::before,*::after{font-family:var(--font-sans)}

h1,h2,h3,h4{line-height:1.2;margin:0;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
h1{font-size:clamp(30px,5vw,52px)}
h2{font-size:clamp(23px,3.2vw,32px)}
h3{font-size:clamp(18px,2.2vw,21px)}
h4{font-size:16px;font-weight:700}
p{margin:0 0 12px}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
small{font-size:12.5px}
b,strong{font-weight:700}
.muted{color:var(--muted)}
.small{font-size:13px}
.hidden{display:none !important}
img{max-width:100%}

.wrap{width:min(100% - 40px,var(--wrap));margin-inline:auto}

/* ---------------------------------------------------------------- nav --- */
.topnav{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.82);
  backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid var(--line);
}
.topnav-inner{display:flex;align-items:center;gap:18px;height:62px}
.brand-mark{display:flex;align-items:center;gap:9px;font-weight:800;font-size:18px;color:var(--ink);white-space:nowrap}
.brand-mark:hover{text-decoration:none}
.brand-dot{width:26px;height:26px;flex:0 0 auto}
.nav-links{display:flex;gap:4px;margin-inline-start:auto;align-items:center}
.nav-links a{color:var(--ink-2);font-weight:600;font-size:14.5px;padding:8px 12px;border-radius:var(--pill)}
.nav-links a:hover{background:var(--surface-3);text-decoration:none;color:var(--ink)}
.nav-links .btn{padding:9px 16px}
.nav-toggle{display:none}

/* ---------------------------------------------------------------- hero -- */
.hero{
  background:
    radial-gradient(1100px 420px at 88% -10%,rgba(255,255,255,.18),transparent 60%),
    linear-gradient(135deg,var(--brand-dark),var(--brand) 70%);
  color:#fff;padding:54px 0 64px;position:relative;overflow:hidden;
}
.hero::after{
  content:"";position:absolute;inset-inline-start:-80px;bottom:-120px;
  width:340px;height:340px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,255,255,.12),transparent 65%);
}
.back-link{position:relative;z-index:1}
.hero-grid{display:grid;grid-template-columns:1.5fr 1fr;grid-template-areas:"copy card" "note card" "actions card";gap:6px 36px;align-items:start;position:relative;z-index:1}
.hero-copy{grid-area:copy;min-width:0}
.hero-note{grid-area:note;min-width:0}
.hero-card{grid-area:card;align-self:center;min-width:0}
.actions{grid-area:actions;min-width:0}
.eyebrow{text-transform:none;font-weight:700;letter-spacing:.02em;color:#bcd4ff;margin:0 0 8px;font-size:14px}
.hero h1{color:#fff}
.lead{font-size:clamp(16px,2vw,20px);color:#e6efff;margin:14px 0 0}
.hero-note{font-size:13.5px;color:#cbdcf7;margin-top:16px;line-height:1.6}
.hero-note a{color:#fff;text-decoration:underline}
.actions{display:flex;flex-wrap:nowrap;align-items:center;gap:10px;margin-top:24px}
.actions .btn{flex:0 1 auto;white-space:nowrap}

.hero-card{
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);
  border-radius:var(--radius);padding:22px;
  /* No backdrop-filter: its GPU re-sampling flashed a highlight on every countdown
     tick / button hover. A plain translucent card gives the same look, no flicker. */
}
.hero-card>b{font-size:16px;display:block;margin-bottom:14px;color:#fff}
.hero-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.hero-ballot-note{margin:14px 0 0;color:#c7d6f5;font-size:13px;line-height:1.5}
.hero-steps li{display:flex;gap:12px;align-items:flex-start;color:#eaf1ff;font-size:14.5px;line-height:1.45}
.hero-steps span{
  flex:0 0 auto;width:27px;height:27px;border-radius:50%;
  background:#fff;color:var(--brand-dark);font-weight:800;
  display:grid;place-items:center;font-size:14px
}

/* ------------------------------------------------------------- buttons -- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:inherit;font-weight:700;font-size:15px;cursor:pointer;
  padding:11px 20px;border-radius:var(--pill);
  border:1px solid var(--line-2);background:var(--surface);color:var(--ink);
  transition:transform .06s ease,box-shadow .15s ease,background .15s ease,border-color .15s;
  text-decoration:none;line-height:1
}
.btn:hover{text-decoration:none;box-shadow:var(--shadow-sm);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{background:var(--brand-dark);border-color:var(--brand-dark)}
.btn.big{padding:15px 30px;font-size:17px}
.btn.compact{padding:8px 14px;font-size:13.5px}
.hero .btn:not(.primary){background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.4)}
.hero .btn.primary{background:#fff;color:var(--brand-dark);border-color:#fff}
.hero .btn.primary:hover{background:var(--brand-50);border-color:var(--brand-50);color:var(--brand-dark)}
.hero .btn:not(.primary):hover{background:rgba(255,255,255,.24)}
.hero .btn:hover{box-shadow:none;transform:none}
.hero-textlink{display:inline-flex;align-items:center;color:#fff;font-weight:700;font-size:15px;text-decoration:underline;text-underline-offset:3px;padding:11px 4px;opacity:.92;white-space:nowrap;transition:opacity .15s}
.hero-textlink:hover{opacity:1}
.link-btn{background:none;border:none;color:var(--brand);font-family:inherit;font-weight:600;font-size:14px;cursor:pointer;padding:6px 8px;border-radius:8px}
.link-btn:hover{background:var(--surface-3)}
.step1-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.step1-actions .next-step{background:var(--brand-50);border-color:var(--brand);color:var(--brand-dark);font-weight:800}
.step1-actions .next-step:hover{background:var(--brand-100);border-color:var(--brand-dark)}
.compute-note{flex-basis:100%;margin:6px 0 0}

/* -------------------------------------------------------------- panels -- */
main.wrap{padding-block:34px 60px;display:block}
.panel{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:26px;margin-bottom:26px;box-shadow:var(--shadow-sm)
}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px;flex-wrap:wrap}
.section-head h2{margin:0}

.collapsible{padding:0;overflow:hidden}
.collapsible>summary{
  list-style:none;cursor:pointer;padding:20px 26px;font-size:20px;font-weight:800;color:var(--ink);
  display:flex;justify-content:space-between;align-items:center
}
.collapsible>summary small{font-weight:600;color:var(--muted);font-size:13px}
.collapsible>summary::-webkit-details-marker{display:none}
.collapsible>summary::after{content:"▾";color:var(--brand);font-size:22px;line-height:1;transition:transform .2s}
.collapsible[open]>summary{border-bottom:1px solid var(--line)}
.collapsible[open]>summary::after{transform:rotate(180deg)}
.collapsible>*:not(summary){margin:22px 26px 26px}

/* --------------------------------------------------------------- wizard - */
.wizard-step{border:1px solid var(--line);border-radius:var(--radius-md);margin-bottom:14px;overflow:hidden;background:var(--surface)}
.wizard-step>summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;
  padding:16px 18px;font-weight:800;font-size:17px
}
.wizard-step>summary::-webkit-details-marker{display:none}
.wizard-step>summary>span{
  flex:0 0 auto;width:30px;height:30px;border-radius:50%;
  background:var(--brand-50);color:var(--brand);display:grid;place-items:center;font-size:15px;font-weight:800
}
.wizard-step[open]>summary{background:var(--surface-2);border-bottom:1px solid var(--line)}
.wizard-step[open]>summary>span{background:var(--brand);color:#fff}
.step-content{padding:18px}
.step-content.two-col{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.full-row{grid-column:1/-1}
.counter{font-weight:700;font-size:13.5px;color:var(--brand);margin:6px 0}
.counter.warn{color:var(--mid)}
/* Topics are blue-themed, boosts green-themed. Quiz step 2 (#stepMode) is all green. */
#stepMode{border-color:var(--good-100)}
#stepMode>summary{color:var(--good-dark)}
#stepMode>summary>span{background:var(--good-bg);color:var(--good)}
#stepMode[open]>summary{background:var(--good-bg);border-bottom-color:var(--good-100)}
#stepMode[open]>summary>span{background:var(--good);color:#fff}
#stepMode h3{color:var(--good-dark)}
#stepMode .counter{color:var(--good)}
/* "חשב המלצה" is a produce-the-list action -> violet accent (shared with the show-results button), in both steps */
.btn.primary.compute{background:var(--accent);border-color:var(--accent)}
.btn.primary.compute:hover{background:var(--accent-dark);border-color:var(--accent-dark)}
.form-error{color:var(--danger);font-weight:600;font-size:13.5px;margin:6px 0}

/* ---------------------------------------------------------------- chips - */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}
/* even element count (14 topics): use 4 / 2 / 1 columns, never a ragged 3 */
.issue-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
/* base chip = simple flex-row pill (compact / negative chips) */
.chip{
  display:flex;align-items:center;gap:9px;cursor:pointer;
  border:1.5px solid var(--line-2);border-radius:var(--radius-sm);
  padding:11px 14px;background:var(--surface);transition:border-color .15s,background .15s,box-shadow .15s
}
.chip:hover{border-color:var(--brand-100);box-shadow:var(--shadow-sm)}
.chip input{accent-color:var(--brand);width:18px;height:18px;flex:0 0 auto;cursor:pointer}
.chip .chip-ico{flex:0 0 auto;color:var(--brand);display:inline-flex}
.chip .chip-ico .ico{width:18px;height:18px}
.chip-title{font-weight:700;font-size:14px}
.chip:has(input:checked){border-color:var(--brand);background:var(--brand-50)}
.compact-chip{padding:9px 12px;gap:8px}
.compact-chip .chip-title{font-size:13.5px}
/* topic cards (main issue selector) */
.issue-chip{position:relative;flex-direction:column;align-items:flex-start;gap:9px;border-radius:var(--radius-md);padding:16px 16px 15px}
.issue-chip input{position:absolute;top:14px;inset-inline-end:14px;width:20px;height:20px}
.issue-chip .chip-ico{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:var(--brand-50);color:var(--brand);transition:background .15s,color .15s}
.issue-chip .chip-ico .ico{width:24px;height:24px}
.issue-chip .chip-title{font-size:15px;line-height:1.3;padding-inline-end:26px}
.issue-chip .chip-desc{color:var(--muted);font-size:12.5px;line-height:1.45}
/* mobile: collapse topics to checkbox+icon+title; expand the description only when selected */
@media (max-width:600px){
  .issue-chip .chip-desc{display:none}
  .issue-chip:has(input:checked) .chip-desc{display:block;margin-top:6px}
}
.issue-chip:has(input:checked) .chip-ico{background:var(--brand);color:#fff}
.negative-issue-grid{display:flex;flex-wrap:wrap;gap:8px}
.negative-issue-chip{white-space:normal;min-width:0;max-width:100%}
.negative-issue-chip .chip-ico{color:var(--muted)}
.negative-issue-chip:has(input:checked) .chip-ico{color:var(--brand)}
.advanced-negative{margin-top:14px;margin-bottom:24px;border-top:1px dashed var(--line-2);padding-top:8px}
.intro-row{display:grid;grid-template-columns:1fr;gap:18px;margin:0 0 18px;align-items:stretch}
@media(min-width:820px){.intro-row{grid-template-columns:1fr 1fr}}
.vote-cta{display:flex;align-items:flex-start;gap:12px;margin:0;padding:14px 18px;background:linear-gradient(100deg,var(--brand-50),var(--surface-3));border:1px solid var(--brand-100);border-radius:var(--radius-md)}
@media(min-width:820px){.vote-cta{align-items:center}}
.vote-cta-ico{flex:0 0 auto;width:26px;height:26px;color:var(--brand);margin-top:1px}
.vote-cta p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.vote-cta b{color:var(--ink)}
.spotlight{background:linear-gradient(100deg,var(--brand-50),var(--surface-3));border:1px solid var(--brand-100);border-radius:var(--radius-md);padding:15px 18px;margin:0}
.spotlight-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}
.spotlight-head .eyebrow{margin:0;color:var(--brand);font-weight:700;font-size:16px;letter-spacing:.01em}
.spotlight-cand{display:flex;align-items:center;gap:14px;width:100%;text-align:start;background:var(--surface-2);border:1px solid var(--brand-100);border-radius:var(--radius-md);padding:12px 14px;cursor:pointer;transition:background .15s,border-color .15s;font-family:inherit}
.spotlight-cand:hover{background:var(--brand-50);border-color:var(--brand-200,var(--brand))}
.spotlight-info{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.spotlight-info b{font-size:16px;color:var(--ink)}
.spotlight-info .muted{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.4}
.spotlight-go{flex:0 0 auto;color:var(--brand);font-weight:700;font-size:13.5px}
.spotlight-note{display:block;margin-top:8px;text-align:center}
.spotlight-cand{animation:spotlightFade .4s ease}
@keyframes spotlightFade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.spotlight-cand{animation:none}}
.onboard-overlay{position:fixed;inset:0;z-index:200}
.onboard-ring{position:fixed;border-radius:10px;box-shadow:0 0 0 9999px rgba(15,23,42,.55);border:2px solid #fff;pointer-events:none;transition:top .3s,left .3s,width .3s,height .3s}
.onboard-pop{position:fixed;width:min(300px,calc(100vw - 24px));background:var(--surface);border-radius:14px;padding:15px 17px;box-shadow:var(--shadow-lg);z-index:201;transition:top .3s,left .3s}
.onboard-pop h5{margin:0 0 5px;font-size:15.5px;color:var(--ink)}
.onboard-pop p{margin:0 0 13px;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
.onboard-actions{display:flex;justify-content:space-between;align-items:center;gap:10px}
.onboard-progress{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){.onboard-ring,.onboard-pop{transition:none}}
.vote-cta a{color:var(--brand-dark);font-weight:700;white-space:nowrap}
.advanced-negative>summary{cursor:pointer;font-weight:700;color:var(--brand);font-size:14px;padding:6px 0}
.advanced-negative-content{padding-top:8px}

/* boosts (checkbox pills) */
.mini-grid.boosts-grid{display:flex;flex-wrap:wrap;gap:9px;margin-top:10px}
.check{
  display:inline-flex;align-items:center;gap:9px;cursor:pointer;font-weight:600;font-size:14px;line-height:1.3;white-space:nowrap;
  border:1.5px solid var(--line-2);border-radius:var(--pill);padding:9px 16px;background:var(--surface);transition:all .15s
}
.check .boost-ico{flex:0 0 auto}
.check:hover{border-color:var(--good-100)}
.check input{accent-color:var(--good);width:17px;height:17px;cursor:pointer}
.check:has(input:checked){border-color:var(--good);background:var(--good-bg);color:var(--good-dark)}
.radio{
  display:flex;align-items:center;gap:9px;cursor:pointer;font-weight:600;font-size:15px;
  padding:11px 14px;border:1.5px solid var(--line-2);border-radius:var(--radius-sm);margin-bottom:9px;background:var(--surface);transition:all .15s
}
.radio:hover{border-color:var(--brand-100)}
.radio input{accent-color:var(--brand);width:18px;height:18px;cursor:pointer}
.radio:has(input:checked){border-color:var(--brand);background:var(--brand-50)}

.result-step{display:grid;grid-template-columns:1fr 1fr auto;gap:22px;align-items:center}
.result-step-controls label{font-weight:700;font-size:14px;display:block;margin-bottom:6px}
select,input[type="search"]{
  font-family:inherit;font-size:16px;padding:10px 13px;border:1.5px solid var(--line-2);
  border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);width:100%
}
select:focus,input:focus{outline:2px solid var(--brand-100);border-color:var(--brand)}

/* ----------------------------------------------------- results: split -- */
.results-head{align-items:flex-start}
.inline-disclaimer,.disclaimer{
  background:var(--mid-bg);border:1px solid #f0dcb6;border-radius:var(--radius-sm);
  padding:13px 16px;font-size:13.5px;color:#6e4d12;line-height:1.55;margin-bottom:18px
}
.share-cta{
  display:flex;gap:16px;align-items:center;flex-wrap:wrap;justify-content:space-between;
  background:var(--brand-50);border:1px solid var(--brand-100);border-radius:var(--radius-md);padding:14px 18px;width:100%
}
.share-cta-copy b{display:block;font-size:15px}
.share-cta-copy span{font-size:13px;color:var(--ink-2)}
.share-actions{display:flex;gap:8px;flex-wrap:wrap}

.results-split{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:22px;align-items:start}

/* shortlist column */
.shortlist{display:flex;flex-direction:column;gap:8px;position:sticky;top:74px;max-height:calc(100vh - 90px);overflow:auto;padding-inline-end:4px}
.shortlist-title{font-size:13px;font-weight:700;color:var(--muted);padding:2px 4px 4px}
.sl-ballot-hint{font-size:12.5px;line-height:1.45;color:var(--brand-dark);background:var(--brand-50);border:1px solid var(--line);border-radius:var(--radius-sm);padding:7px 10px;margin:0 2px 10px}
.sl-short-note{font-size:12.5px;line-height:1.45;color:var(--muted);background:var(--surface-2,#f6f8fb);border:1px dashed var(--line);border-radius:var(--radius-sm);padding:8px 11px;margin:10px 2px 2px}
.score-note{font-size:13px;line-height:1.55;color:var(--mid);background:var(--mid-bg);border:1px solid #f0dcb6;border-radius:var(--radius-sm);padding:10px 13px;margin:0 0 12px}
.score-note a{font-weight:700;text-decoration:underline;color:inherit}
.doc-nav{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 26px}
.doc-nav a{font-size:13.5px;font-weight:700;color:var(--brand-dark);background:var(--brand-50);border:1px solid rgba(29,95,214,.18);border-radius:var(--pill);padding:6px 14px;text-decoration:none}
.doc-nav a:hover{background:#dbe8fe;text-decoration:none}
.doc-page h2{scroll-margin-top:16px;margin-top:30px}
.doc-list{margin:8px 0 14px;padding-inline-start:20px;line-height:1.6}
.doc-list li{margin-bottom:6px}
/* FAQ accordion (about page) */
.faq{margin:10px 0 8px;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;background:var(--surface)}
.faq>details{border-top:1px solid var(--line)}
.faq>details:first-child{border-top:none}
.faq>details>summary{list-style:none;cursor:pointer;padding:15px 18px;font-weight:700;font-size:16.5px;color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:14px}
.faq>details>summary::-webkit-details-marker{display:none}
.faq>details>summary::after{content:"▾";color:var(--brand);font-size:20px;line-height:1;flex:0 0 auto;transition:transform .2s}
.faq>details:hover>summary{background:var(--surface-2)}
.faq>details[open]>summary{color:var(--brand-dark);border-bottom:1px solid var(--line)}
.faq>details[open]>summary::after{transform:rotate(180deg)}
.faq>details>*:not(summary){margin:14px 18px 16px;line-height:1.6}
.doc-contact{margin-top:22px;font-weight:600;color:var(--ink)}
/* About page: two columns (FAQ + intro on the reading side, stats rail on the other).
   RTL source order = FAQ first (right), stats second (left on desktop, below on mobile). */
.about-cols{display:grid;gap:20px;align-items:start}
@media(min-width:860px){.about-cols{grid-template-columns:minmax(0,1.85fr) minmax(0,1fr)}}
.stats-title{margin:2px 0 14px;font-size:20px}
.stat-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(128px,1fr))}
.stat-tile{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:15px 12px;display:flex;flex-direction:column;gap:3px;text-align:center;align-items:center}
.stat-num{font-size:30px;font-weight:800;color:var(--brand);line-height:1.05;font-variant-numeric:tabular-nums}
.stat-label{font-size:13px;font-weight:600;color:var(--ink-2);line-height:1.3}
.stat-sub{font-size:11.5px;color:var(--muted);line-height:1.3}
.stat-live .stat-num{color:var(--good-dark)}
.stat-num.stat-date{font-size:22px;color:var(--ink-2)}
.stats-foot{margin:14px 2px 0;font-size:12px;color:var(--muted);line-height:1.5}
.sl-row{
  display:flex;align-items:center;gap:12px;cursor:pointer;text-align:start;
  border:1.5px solid var(--line);border-radius:var(--radius-md);padding:10px 12px;background:var(--surface);
  transition:border-color .15s,box-shadow .15s,background .15s;width:100%;font-family:inherit
}
.sl-row:hover{border-color:var(--brand-100);box-shadow:var(--shadow-sm)}
.sl-row.active{border-color:var(--brand);background:var(--brand-50);box-shadow:var(--shadow-sm)}
.sl-rank{flex:0 0 auto;width:22px;text-align:center;font-weight:800;color:var(--muted);font-size:14px}
.sl-row.active .sl-rank{color:var(--brand)}
.sl-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;overflow:hidden}
.sl-name{display:block;font-weight:700;font-size:15px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sl-sub{font-size:12px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4;max-width:100%}
.sl-gauge{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:3px}

/* detail column */
.detail{min-width:0}
.detail-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow-sm)}
.detail-back{display:none}
.detail-top{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.detail-id{flex:1 1 260px;min-width:0}
.detail-id h3{font-size:clamp(21px,3vw,27px)}
.detail-id .muted{margin:6px 0 0}
.detail-gauge{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:4px}
.detail-gauge .gauge-label{font-size:12px;font-weight:700;color:var(--muted)}

.profile-facts{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:10px;font-size:13.5px;color:var(--ink-2)}
.profile-facts b{color:var(--ink)}

.tags{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}
.tag{
  font-size:12.5px;background:var(--surface-3);border:1px solid var(--line);border-radius:var(--pill);
  padding:4px 11px;color:var(--ink-2);display:inline-flex;align-items:center;line-height:1.3
}
.boost-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.boost-tags .tag{background:var(--brand-50);border-color:var(--brand-100);color:var(--brand-dark);font-weight:600}

/* balance bar */
.balance-box{margin:16px 0}
.balance-head{display:flex;justify-content:space-between;font-size:13.5px;margin-bottom:6px}
.balance-head b{font-weight:700}
.balance-head span{color:var(--brand);font-weight:700}
.balance-track{position:relative;height:8px;border-radius:var(--pill);background:linear-gradient(90deg,#cfe0fb,#bfead8)}
.balance-track i{position:absolute;top:50%;transform:translate(50%,-50%);width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid var(--brand);box-shadow:var(--shadow-sm)}
.balance-labels{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);margin-top:5px}

.detail-grid{margin-top:18px}
.detail-grid>section{margin-bottom:20px}
.detail-highlights{grid-area:high;min-width:0}.detail-selected{grid-area:sel;min-width:0}.detail-additional{grid-area:add;min-width:0}
.detail-grid h4{margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.additional-heading{margin-top:16px}

.reasons{margin:0;padding-inline-start:18px}
.reasons li{margin-bottom:7px;font-size:14px;line-height:1.5}
.match-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:9px;align-items:stretch}
.match-list li{border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px 12px;background:var(--surface-2)}
.match-list li.selected-core-issue{border-color:var(--brand-100);background:var(--brand-50)}
.match-list b{display:block;font-size:14.5px}
.match-list span{font-size:12.5px;color:var(--ink-2);display:block;margin-top:3px}
.match-list em{font-size:12px;color:var(--muted);display:block;margin-top:4px;font-style:normal}
.issue-bars{display:flex;gap:14px;margin-top:4px}
.issue-bar{flex:1}
.issue-bar .ib-label{font-size:11px;color:var(--muted);display:flex;justify-content:space-between;margin-bottom:3px}
.issue-bar .ib-track{height:6px;border-radius:var(--pill);background:var(--surface-3);overflow:hidden}
.issue-bar .ib-fill{height:100%;border-radius:var(--pill);background:var(--brand)}
.issue-bar.record .ib-fill{background:var(--good)}

.source-details{margin-top:18px;border-top:1px solid var(--line);padding-top:12px}
.source-details>summary{cursor:pointer;font-weight:700;color:var(--brand);font-size:14.5px}
.sources{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:7px}
.sources li{font-size:13.5px;line-height:1.9}
.source-type{font-size:11px;color:var(--muted);background:var(--surface-3);border-radius:var(--pill);padding:1px 8px;display:inline-block;white-space:nowrap;margin-inline-start:4px;vertical-align:middle}
/* Unlinked source (campaign material with no public URL): plain text, not a dead link. */
.source-nolink{color:var(--ink-2);border-bottom:1px dotted var(--line-2);cursor:help}

/* gauge (svg) */
.gauge{position:relative;display:inline-grid;place-items:center}
.gauge svg{transform:rotate(-90deg)}
.gauge .gauge-val{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--ink);line-height:1;white-space:nowrap}
.gauge.tier-high .gauge-arc{stroke:var(--good)}
.gauge.tier-mid .gauge-arc{stroke:var(--mid)}
.gauge.tier-low .gauge-arc{stroke:var(--low)}
.gauge.tier-high .gauge-val{color:var(--good)}
.gauge.tier-mid .gauge-val{color:var(--mid)}

/* data-quality badge */
.dq-badge{display:inline-block;font-size:11px;font-weight:700;color:var(--mid);background:var(--mid-bg);border:1px solid #f0dcb6;border-radius:var(--pill);padding:2px 9px;white-space:nowrap;vertical-align:middle}

/* socials */
.socials{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.social-link{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;border:1px solid var(--line);background:var(--surface);color:var(--brand);transition:all .15s}
.social-link:hover{background:var(--brand);color:#fff;border-color:var(--brand)}
.social-link svg{width:17px;height:17px;fill:currentColor;stroke:none}

/* list analysis */
.summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:18px 0}
.summary-box{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px}
.summary-box b{display:block;font-size:12px;color:var(--muted);font-weight:700;margin-bottom:3px}
.list-analysis{margin-top:8px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface-2)}
.list-analysis>summary{cursor:pointer;font-weight:700;padding:14px 16px;color:var(--ink)}
.analysis-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px;padding:0 16px 16px}
.analysis-grid b{display:block;margin-bottom:6px}
.analysis-grid ul{margin:0;padding-inline-start:18px;font-size:13.5px}
.analysis-grid li{margin-bottom:4px}

/* ---------------------------------------------------------- candidates -- */
.search-box{position:relative;max-width:460px;margin-top:8px}
.search-suggestions{position:absolute;top:calc(100% + 4px);inset-inline:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow);z-index:20;overflow:hidden}
.suggestion{display:flex;justify-content:space-between;gap:10px;width:100%;text-align:start;background:none;border:none;padding:10px 14px;cursor:pointer;font-family:inherit;font-size:14px;border-bottom:1px solid var(--line)}
.suggestion:hover{background:var(--surface-3)}
.suggestion em{color:var(--muted);font-style:normal;font-size:12px}

.table-wrap{overflow-x:auto;margin-top:14px;border:1px solid var(--line);border-radius:var(--radius-md)}
table{width:100%;border-collapse:collapse;font-size:14px}
thead th{background:var(--surface-2);text-align:start;font-weight:700;font-size:13px;color:var(--ink-2);padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
tbody td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--surface-2)}
.candidate-cell{display:flex;align-items:center;gap:11px;min-width:190px}
.candidate-cell-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.tags-cell{max-width:230px}
.match-cell{text-align:center}
.match-cell .gauge{margin:0 auto}
.match-pending{color:var(--muted);font-size:12px}

.candidate-info>summary,.all-issues>summary{cursor:pointer;font-weight:700;color:var(--brand);font-size:13.5px}
.candidate-info[open]>summary{margin-bottom:8px}
.candidate-info-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px;font-size:13px}
.candidate-info-list li{line-height:1.45}
.compact-list li{font-size:12.5px}
.sources-mini{gap:5px}

/* avatar */
.avatar{position:relative;border-radius:50%;background:var(--brand-50);color:var(--brand);display:grid;place-items:center;font-weight:800;overflow:hidden;flex:0 0 auto;border:1px solid var(--line)}
.avatar.small{width:38px;height:38px;font-size:14px}
.avatar.large{width:74px;height:74px;font-size:24px}
.avatar img{width:100%;height:100%;object-fit:cover}
.avatar:not(.no-image) span{display:none}
.photo-source{position:absolute;bottom:0;inset-inline:0;font-size:8px;background:rgba(0,0,0,.55);color:#fff;text-align:center;opacity:0;transition:opacity .15s}
.avatar:hover .photo-source{opacity:1}

/* method grid + docs */
.method-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
@media (max-width:900px){.method-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.method-grid h3{margin-bottom:6px;color:var(--brand)}
.method-grid p{font-size:14px;color:var(--ink-2)}
.param-list{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}
.param-list>div{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px}
.param-list b{color:var(--brand)}
.note-box{background:var(--brand-50);border:1px solid var(--brand-100);border-radius:var(--radius-sm);padding:16px;font-size:14px;line-height:1.6}
.legal-list{padding-inline-start:20px}
.legal-list li{margin-bottom:6px}
.contact-line{font-size:17px;font-weight:700}
.doc-page .hero{padding:36px 0}
.doc-page .hero h1{margin-top:6px}
.back-link{display:inline-block;margin-top:12px;color:#fff;font-weight:600;background:rgba(255,255,255,.16);padding:8px 16px;border-radius:var(--pill)}
.back-link:hover{background:rgba(255,255,255,.26);text-decoration:none}

/* name list (share/ballot fallback) */
.name-list{margin:0;padding-inline-start:22px}
.name-list li{margin-bottom:6px}

/* admin */
.admin-tools{display:flex;gap:12px;flex-wrap:wrap;margin:14px 0}
.admin-tools input,.admin-tools select{max-width:280px}
.admin-table td{font-size:13px}

/* footer */
.footer{padding:34px 0;color:var(--muted);font-size:13.5px;border-top:1px solid var(--line);margin-top:20px}
.footer-links{display:flex;flex-wrap:wrap;gap:18px;margin-bottom:10px}
@media (max-width:600px){.footer{text-align:center}.footer-links{justify-content:center;gap:14px 18px}}
.footer-links a{color:var(--ink-2);font-weight:600}

/* ----------------------------------------------------------- responsive- */
@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr;grid-template-areas:"copy" "card" "actions" "note";gap:16px}
  .hero h1{font-size:clamp(38px,11vw,50px)}
  .actions{margin-top:0;flex-wrap:wrap}
  .actions .btn{flex:1 1 auto;text-align:center}
  .hero-textlink{flex-basis:100%;justify-content:center;padding-top:2px}
  .hero-note{margin-top:0}
  .results-split{grid-template-columns:minmax(0,1fr)}
  .step-content.two-col{grid-template-columns:1fr}
  .detail-grid{grid-template-columns:1fr;grid-template-areas:none}
  .detail-highlights,.detail-selected,.detail-additional{grid-area:auto}
  .param-list{grid-template-columns:1fr}
  .result-step{grid-template-columns:1fr;gap:16px}
  .shortlist{position:static;max-height:none;overflow:visible}
}

@media (max-width:760px){
  .wrap{width:min(100% - 28px,var(--wrap))}
  .nav-links{
    position:fixed;inset:62px 0 auto 0;flex-direction:column;align-items:stretch;gap:4px;
    background:var(--surface);border-bottom:1px solid var(--line);padding:12px;box-shadow:var(--shadow);
    transform:translateY(-130%);transition:transform .25s ease;z-index:40
  }
  .nav-links.open{transform:translateY(0)}
  .nav-links a{padding:12px 14px;font-size:16px}
  .nav-links .btn{margin-top:4px}
  .nav-toggle{
    display:grid;place-items:center;margin-inline-start:auto;width:44px;height:44px;border-radius:12px;
    border:1px solid var(--line);background:var(--surface-2);cursor:pointer;gap:5px
  }
  .nav-toggle:hover{background:var(--brand-50);border-color:var(--brand-100)}
  .nav-toggle span{display:block;width:22px;height:2.5px;background:var(--brand-dark);border-radius:3px;transition:transform .2s,opacity .2s}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
  .panel{padding:18px}
  .collapsible>summary{padding:16px 18px;font-size:18px}
  .collapsible>*:not(summary){margin:18px}
  .issue-grid{grid-template-columns:1fr;gap:8px}
  .method-grid{grid-template-columns:1fr}
  .issue-grid .issue-chip{padding:12px 11px}
  .issue-grid .issue-chip .chip-title{font-size:13.5px;padding-inline-end:22px}
  .issue-grid .issue-chip .chip-ico .ico{width:21px;height:21px}
  .detail-grid{gap:16px}
  .btn{padding:12px 18px}
  .share-cta{flex-direction:column;align-items:stretch}
  .share-actions{justify-content:center}
}

@media (max-width:430px){
  .hero{padding:34px 0 40px}
  .detail-top{flex-direction:row}
  .detail-card{padding:18px}
  .social-link{width:36px;height:36px}
}

/* narrow phones: reclaim the width wasted by stacked gutters/padding
   (outer wrap + panel + inner content each added a margin). Aggressive on
   HORIZONTAL padding so content gets the width; vertical spacing kept. */
@media (max-width:480px){
  .wrap{width:min(100% - 8px,var(--wrap))}     /* 4px gutter, was 14 */
  .hero .wrap{width:min(100% - 28px,var(--wrap))}  /* hero keeps a comfortable gutter (all pages) */
  .panel{padding:14px 7px}
  .step-content{padding:14px 7px}
  .collapsible>summary{padding:14px 9px}
  .collapsible>*:not(summary){margin:14px 7px}
  .rc-panel{padding:12px 7px}
  .rc-section{padding:10px 7px}
  .detail-card{padding:14px 8px}
  .issue-grid .issue-chip{padding:12px 9px}
  .value-table .vt-row{padding-inline:8px}
}

/* ===== R3: candidate cards list, filters, recap, balance viz ===== */
.list-intro{margin:0 0 12px}
.list-controls{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.list-controls #candSearch{flex:2 1 220px}
.list-controls select{flex:1 1 200px}
#candCount{margin-top:2px;margin-bottom:12px}

.cand-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.cand-card{display:flex;flex-direction:column;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);padding:16px;box-shadow:var(--shadow-sm)}
.cand-card-top{display:flex;gap:12px;align-items:flex-start}
.cand-card-id{flex:1 1 auto;min-width:0}
.cand-name-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cand-name-row b{font-size:16.5px;font-weight:800}
.cand-card-id p{margin:4px 0 0}
.cand-gauge{flex:0 0 auto}
.cand-card .tags{margin:0}
.cand-card .socials{margin:0}
.cand-card-foot{display:flex;flex-direction:column;gap:8px;margin-top:2px;border-top:1px solid var(--line);padding-top:10px}

/* results recap (your choices) */
.results-extra{margin-top:22px}
.results-recap{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-md);padding:12px 14px;margin-bottom:14px}
.recap-label{font-weight:800;font-size:13.5px;color:var(--ink)}
.recap-chip{font-size:13px;background:var(--surface);border:1px solid var(--line);border-radius:var(--pill);padding:5px 12px;color:var(--ink-2)}
.recap-chip b{color:var(--brand);font-weight:700;margin-inline-end:3px}

/* balance: two-segment proportion bar */
.balance-viz{margin:0 0 16px}
.balance-viz-head{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;margin-bottom:6px}
.balance-viz-head b{font-weight:700}
.balance-viz-head span{color:var(--brand);font-weight:700;font-size:13px}
.split-bar{display:flex;height:30px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--line)}
.split-bar .seg{display:flex;align-items:center;justify-content:center;color:#fff;font-size:12.5px;font-weight:700;white-space:nowrap;min-width:0}
.split-bar .seg.stance{background:linear-gradient(90deg,#3b76e0,#2f63c8)}
.split-bar .seg.record{background:linear-gradient(90deg,#13a673,#0f8a60)}
.split-bar .seg span{padding:0 6px;overflow:hidden;text-overflow:ellipsis}

@media (max-width:760px){
  .list-controls{flex-direction:column}
  .list-controls #candSearch,.list-controls select{flex:1 1 auto;width:100%}
  .cand-grid{grid-template-columns:1fr}
  .results-recap{flex-direction:column;align-items:flex-start}
}

/* ===== R4: result-mode toggle, clickable cards, modal, tag/boost distinction ===== */
.result-mode{display:flex;align-items:center;gap:5px 12px;flex-wrap:wrap}
.result-mode-label{font-weight:800;font-size:13.5px}
.mode-switch{display:inline-flex;background:var(--surface-3);border:1px solid var(--line);border-radius:var(--pill);padding:3px}
.mode-btn{font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer;border:none;background:none;color:var(--ink-2);padding:7px 14px;border-radius:var(--pill);transition:all .15s}
.mode-btn.active{background:var(--brand);color:#fff;box-shadow:var(--shadow-sm)}
.mode-btn[data-boostmode]{white-space:nowrap}
.mode-btn[data-boostmode].active{background:var(--good)} /* boosts are green-themed everywhere */
.result-mode-hint{font-size:12.5px;color:var(--muted);flex:1 1 200px}
/* toggle + hint on one row; hint gets its own cell and wraps there (not under the toggle) */
.mode-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

/* clickable candidate cards */
.cand-card{cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .06s}
.cand-card:hover{border-color:var(--brand-100);box-shadow:var(--shadow);transform:translateY(-2px)}
.cand-card:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.cand-card-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:8px;border-top:1px solid var(--line)}
.cand-card-foot .socials{margin:0}
.cand-open-hint{font-size:13px;font-weight:700;color:var(--brand);white-space:nowrap}
.in-list-badge{display:inline-block;font-size:11px;font-weight:800;color:#fff;background:var(--brand);border-radius:var(--pill);padding:2px 9px;white-space:nowrap}

/* tag vs boost distinction */
.tags-labeled{align-items:center}
.tags-label,.boost-label{font-size:11px;font-weight:800;color:var(--muted);margin-inline-end:4px;text-transform:none}
.boost-tags{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:10px 0 4px;background:var(--good-bg);border:1px dashed #9cd9bd;border-radius:var(--radius-sm);padding:9px 12px}
.boost-label{color:var(--good)}
.boost-pill{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;line-height:1.35;background:var(--good);color:#fff;border-radius:var(--pill);padding:5px 13px;white-space:nowrap;max-width:100%}
.boost-pill.alt{background:var(--brand)}
.boost-pill.potential{background:var(--surface-2,#eef2f7);color:var(--ink-2,#5b6b80);font-weight:600;border:1px solid var(--line)}
.fit-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0 4px}
.fit-pill{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;background:var(--brand-50);color:var(--brand-dark);border:1px solid var(--brand-100);border-radius:var(--pill);padding:4px 12px;white-space:nowrap;cursor:help}

/* modal */
.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:18px;background:rgba(15,27,45,.55);backdrop-filter:blur(3px)}
.modal-card{position:relative;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-lg);width:min(720px,100%);max-height:90vh;overflow:hidden;display:flex;flex-direction:column}
.modal-close{position:absolute;inset-inline-end:12px;top:12px;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--surface);font-size:22px;line-height:1;cursor:pointer;color:var(--ink-2);z-index:2}
.modal-close:hover{background:var(--surface-3);color:var(--ink)}
.modal-body{overflow:auto;padding:26px}
.modal-body h4{margin:18px 0 8px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.profile-head{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.profile-id{flex:1 1 240px;min-width:0}
.profile-id h3{font-size:clamp(20px,3vw,26px)}
.match-list li.no-data{opacity:.6}
.match-list li.no-data b{font-weight:600}

@media (max-width:760px){
  .modal{padding:0}
  .modal-card{width:100%;max-height:100vh;max-height:100dvh;height:100%;border-radius:0}
  .result-mode{gap:8px}
  .mode-switch{flex:1 1 auto}
  .mode-btn{flex:1}
  .results-settings{gap:6px 18px}
}

/* ===== R5: candidate table, sortable headers, stat bars, detail-as-modal ===== */
.cand-table-wrap{border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden}
.cand-table{width:100%;border-collapse:collapse}
.cand-table th{background:var(--surface-2);text-align:start;font-size:13px;font-weight:700;color:var(--ink-2);padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.cand-table th.sortable{cursor:pointer;user-select:none}
.cand-table th.sortable:hover{color:var(--brand)}
.cand-table th.num{text-align:center;width:90px}
.cand-table th.sortable::after{content:"⇅";font-size:11px;color:var(--muted);margin-inline-start:5px}
.cand-table th.sortable.sorted::after{content:"▾";color:var(--brand)}
.cand-table th.sortable.sorted[data-dir="asc"]::after{content:"▴"}
.cand-row{cursor:pointer;transition:background .12s}
.cand-row:hover{background:var(--surface-2)}
.cand-row:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.cand-table td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.cand-table tbody tr:last-child td{border-bottom:none}
.cand-row-bio{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:none}
.cand-table .match-cell{text-align:center}
.cand-table .match-cell .gauge{margin:0 auto}
.cand-table .col-tags{max-width:340px}
.match-pending{color:var(--muted)}

/* visual list-stats bars */
.stat-bars{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:8px}
.stat-bars li{display:grid;grid-template-columns:minmax(110px,40%) 1fr auto;align-items:center;gap:10px;font-size:13px}
.stat-label{color:var(--ink-2)}
.stat-track{height:9px;border-radius:var(--pill);background:var(--surface-3);overflow:hidden}
.stat-fill{display:block;height:100%;border-radius:var(--pill);background:linear-gradient(90deg,var(--brand),var(--brand-dark))}
.stat-val{font-weight:700;color:var(--ink-2);font-size:12px;white-space:nowrap}

/* detail shown as modal on narrow screens */
.modal .detail-card{border:none;box-shadow:none;padding:0}
.modal .detail-back{display:none}

@media (max-width:960px){
  .results-split .detail{display:none}
}
@media (max-width:640px){
  .cand-table .col-tags{display:none}
  .cand-table th.num{width:60px}
  .cand-row-bio{max-width:none;white-space:normal}
  .candidate-cell{min-width:0;gap:9px}
  .cand-table td{padding:11px 9px}
  .cand-table .match-cell{padding-inline:4px}
}

/* ===== R7: responsive tags-in-name, match nowrap, per-topic avg, coverage ===== */
/* keep % match on one line */
.gauge,.gauge-val{white-space:nowrap}
.match-cell{white-space:nowrap}
.detail-gauge,.gauge-label{white-space:nowrap;text-align:center}

/* per-topic average grade */
.issue-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.issue-avg{flex:0 0 auto;font-weight:800;font-size:14px;border-radius:var(--pill);padding:2px 11px;white-space:nowrap;color:#fff}
.issue-avg::before{content:"ממוצע ";font-weight:600;font-size:10.5px;opacity:.85}
.issue-head .issue-avg{color:#fff}
.issue-avg.avg-high{background:#0b7a52}
.issue-avg.avg-mid{background:#b45309}
.issue-avg.avg-low{background:#5b6b80}
.issue-avg.avg-against{background:#d97706}
.against-flag{flex:0 0 auto;font-weight:800;font-size:11.5px;border-radius:var(--pill);padding:3px 10px;white-space:nowrap;color:#7a4a05 !important;background:#fde68a;border:1px solid #f59e0b}
.match-list li.against-issue{background:rgba(245,158,11,.09);border:1px solid rgba(245,158,11,.35);border-radius:var(--radius-sm,8px);padding:8px 10px}
.match-list li.against-issue em{color:#78350f}
.issue-bar.against .ib-label{color:#b45309}
.rc-flash{animation:rcflash .9s ease}
@keyframes rcflash{0%,100%{background:transparent}30%{background:rgba(194,58,43,.14);border-radius:8px}}
.match-list li.no-data .issue-head{opacity:.7}

/* data-coverage indicator (subtle) */
.coverage{display:block;margin-top:8px;font-size:12px;color:var(--muted)}
.coverage.low{color:var(--mid);font-weight:600}

/* table: move tags into the name cell when the tags column gets too narrow */
.cand-row-tags{display:none;flex-wrap:wrap;gap:6px;margin-top:7px}
@media (max-width:860px){
  .cand-table .col-tags{display:none}
  .cand-row-tags{display:flex}
  .cand-row-bio{max-width:none;white-space:normal}
}

/* coverage meter (subtle, more visible than plain text) */
.coverage{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:12px;color:var(--muted)}
.cov-meter{display:inline-flex;gap:2px;flex:0 0 auto}
.cov-meter i{width:6px;height:12px;border-radius:2px;background:var(--line-2)}
.cov-high .cov-meter i.on{background:var(--good)}
.cov-mid .cov-meter i.on{background:#e0a800}
.cov-low .cov-meter i.on{background:var(--mid)}
.cov-mid .cov-text{color:#a67c00}
.cov-low .cov-text{color:var(--mid);font-weight:600}

/* ===== R9: results settings, always-on editor, run row, gauge-label fix ===== */
/* keep %match label on one line even at the pre-collapse width */
.detail-gauge{flex:0 0 auto;min-width:98px}
.detail-gauge .gauge-label{font-size:11.5px}

/* run button spacing in step 2 */
.run-row{margin-top:16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}

/* results reset button + head layout */
.results-head-title{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

/* always-visible in-results editor */
.rc-panel{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface-2);padding:12px 14px;margin-bottom:12px;display:flex;flex-direction:column;gap:10px}
.rc-label{font-size:12.5px;font-weight:800;color:var(--muted);flex:0 0 auto;min-width:78px}
.rc-chips{display:flex;flex-wrap:wrap;gap:6px}
.rc-chip{font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer;border:1.5px solid var(--line-2);background:var(--surface);color:var(--ink-2);border-radius:var(--pill);padding:5px 11px;transition:background .12s,border-color .12s,color .12s}
.rc-chip:hover{border-color:var(--brand-100)}
.rc-chip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.rc-chip.boost.on{background:var(--good);border-color:var(--good);color:#fff}
.rc-chip.exclude.on{background:var(--mid);border-color:var(--mid);color:#fff}
.rc-exclude{padding-top:4px}
.rc-exclude>summary{cursor:pointer;font-size:12.5px;font-weight:700;color:var(--brand);list-style:none}
.rc-exclude>summary::-webkit-details-marker{display:none}
.rc-exclude>summary::before{content:"▸ "}
.rc-exclude[open]>summary::before{content:"▾ "}
.rc-exclude .rc-chips{margin-top:8px}

/* list-type + result-count row, below the editor */
.results-settings{display:flex;align-items:center;gap:14px 18px;flex-wrap:wrap;margin-bottom:16px}
.result-count-wrap{display:flex;align-items:center;gap:8px}
.result-count-wrap label{font-weight:800;font-size:13.5px}
.result-count-wrap select{width:auto;padding:7px 12px}

/* ===== R10: collapsed editor, share popup, result-count in shortlist, count-on-filter ===== */
/* Neutral container; the two inner sections carry the blue (topics) / green (boosts) themes. */
.result-edit{border:1.5px solid var(--accent);border-radius:var(--radius-md);background:var(--accent-bg);margin-bottom:14px;overflow:hidden;box-shadow:var(--shadow-sm)}
.result-edit>summary{cursor:pointer;list-style:none;padding:13px 16px;font-weight:800;font-size:15px;color:var(--accent-dark);display:flex;align-items:center;gap:11px;transition:background .12s}
.result-edit>summary::-webkit-details-marker{display:none}
.result-edit>summary::before{content:"✎";display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;font-size:15px;flex:0 0 auto}
.result-edit>summary::after{content:"▾";color:var(--accent);font-size:20px;line-height:1;margin-inline-start:auto}
.result-edit[open]>summary::after{content:"▴"}
.result-edit>summary:hover{background:var(--accent-100)}
.result-edit .rc-panel{border:none;border-top:1px solid var(--accent-100);border-radius:0;margin:0;background:var(--surface)}
/* Two themed steps inside the editor */
.rc-section{padding:11px 13px;border-radius:var(--radius-sm)}
.rc-section>.rc-label{display:block;width:100%;min-width:0;margin-bottom:8px;font-size:13px}
.rc-section--topics{background:var(--brand-50);border:1px solid var(--brand-100)}
.rc-section--topics>.rc-label{color:var(--brand-dark)}
.rc-section--boosts{background:var(--good-bg);border:1px solid var(--good-100)}
.rc-section--boosts>.rc-label{color:var(--good-dark)}
.rc-section>.rc-exclude{margin-top:8px}
.rc-mode{margin-top:10px}
.rc-mode>.rc-label{display:block;margin-bottom:6px;font-size:13px;color:var(--good-dark)}
.btn.primary.rc-show{width:100%;margin-top:4px;background:var(--accent);border-color:var(--accent)}
.btn.primary.rc-show:hover{background:var(--accent-dark);border-color:var(--accent-dark)}

/* result-count moved into the shortlist header */
.shortlist-title{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--muted);padding:2px 4px 6px}
.sl-count{display:flex;align-items:center;gap:5px;font-weight:600;white-space:nowrap}
.sl-count select{width:auto;padding:3px 8px;font-size:13px}

/* share moved below the results */
.results-share{margin-top:22px;width:100%}

/* delayed share popup (call to action) */
.share-pop{position:fixed;inset-block-end:20px;inset-inline-start:20px;z-index:90;width:min(340px,calc(100vw - 32px));background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:18px 20px;display:flex;flex-direction:column;gap:7px;animation:popin .3s ease}
@keyframes popin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.share-pop b{font-size:16px}
.share-pop>span{font-size:13px;color:var(--ink-2);line-height:1.5}
.share-pop .share-actions{margin-top:8px;display:flex;gap:8px}
.share-pop-close{position:absolute;inset-inline-end:8px;top:6px;width:30px;height:30px;border-radius:50%;border:none;background:none;font-size:20px;cursor:pointer;color:var(--muted)}
.share-pop-close:hover{color:var(--ink)}

/* ===== R11: boost tag on shortlist rows ===== */
.sl-nameline{display:flex;align-items:center;gap:6px;min-width:0}
.sl-boost{flex:0 0 auto;font-size:10px;font-weight:800;color:#fff;background:var(--good);border-radius:var(--pill);padding:1px 7px;white-space:nowrap}
/* all-candidates: keep name + its tags grouped; tags wrap together after the name */
.cand-tags{display:inline-flex;flex-wrap:wrap;gap:6px;align-items:center}
.cand-name-row b{flex:0 0 auto}
.boost-count{color:var(--muted);font-size:.85em;font-weight:600}
.boost-mode{margin:16px 0 22px;overflow:clip}
/* slide-reveal when the first boost is picked (same block-size technique as the <details> animation) */
.boost-mode.collapsed{block-size:0;margin-block:0;opacity:0}
@media (prefers-reduced-motion:no-preference){
  .boost-mode{interpolate-size:allow-keywords;transition:block-size .26s ease,margin .26s ease,opacity .22s ease}
}
.bm-label{display:block;font-weight:600;font-size:.9rem;margin-bottom:8px}
#boostModeHint{display:block;margin-top:8px}
.more-topics{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.more-topics>summary{cursor:pointer;font-weight:700;color:var(--brand);font-size:14.5px;list-style:none}
.more-topics>summary::-webkit-details-marker{display:none}
.more-topics>summary::before{content:"▸ ";font-size:.85em}
.more-topics[open]>summary::before{content:"▾ "}
.more-topics-body{margin-top:10px}

/* ===== R12: toast feedback + unofficial badge ===== */
.toast{position:fixed;inset-block-end:24px;inset-inline:0;margin-inline:auto;width:max-content;max-width:calc(100vw - 32px);z-index:120;background:var(--ink);color:#fff;font-weight:600;font-size:14px;padding:11px 18px;border-radius:var(--pill);box-shadow:var(--shadow-lg);opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .2s,transform .2s}
.toast.show{opacity:1;transform:none}
.unofficial-badge{flex:0 0 auto;font-size:11.5px;font-weight:700;color:var(--mid);background:var(--mid-bg);border:1px solid #f0dcb6;border-radius:var(--pill);padding:3px 10px;white-space:nowrap}
/* On narrow phones the brand + badge + hamburger don't fit; drop the nav badge
   (the "unofficial" notice still shows in the hero note, footer and About). */
@media (max-width:440px){.unofficial-badge{display:none}}
/* countdown: its own non-sticky strip below the header */
.countdown-strip{display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--brand-dark);color:#fff;padding:8px 16px}
.cd-main{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.cd-label{font-size:13.5px;font-weight:700}
.cd-clock{display:inline-flex;align-items:flex-start;gap:9px;font-variant-numeric:tabular-nums}
.cd-unit{display:inline-flex;flex-direction:column;align-items:center;min-width:34px}
.cd-num{font-size:21px;font-weight:800;line-height:1}
.cd-cap{font-size:10px;opacity:.72;margin-top:3px}
.cd-sep{font-size:19px;font-weight:800;opacity:.45;line-height:1}
.cd-link{font-size:12.5px;font-weight:700;color:#fff;text-decoration:underline;text-underline-offset:2px;opacity:.9}
.cd-link:hover{opacity:1}
.cd-link-urgent{color:#ffd66b}
@media (max-width:560px){.countdown-strip{padding:8px 12px}.cd-main{gap:5px 12px}.cd-label{flex-basis:100%;text-align:center;font-size:12.5px}.cd-num{font-size:19px}.cd-unit{min-width:30px}}

/* ===== R13: topic/boost line-icons ===== */
.ico{width:17px;height:17px;display:inline-block;flex:0 0 auto}
.chip-ico{display:inline-flex;align-items:center;color:var(--brand)}
.rc-chip{display:inline-flex;align-items:center;gap:5px}
.rc-chip .chip-ico{color:inherit;margin:0;opacity:.9}
.rc-chip .ico{width:15px;height:15px}
.negative-issue-chip .chip-ico{color:var(--mid)}
.issue-head .chip-ico{color:var(--brand);display:inline-flex;align-items:center;vertical-align:middle;margin:0 0 1px;flex:0 0 auto}
.issue-head b{display:flex;align-items:center;gap:6px}
.issue-head .ico{width:16px;height:16px}
.boost-ico{display:inline-flex;align-items:center;color:var(--brand);margin-inline-start:4px;vertical-align:-0.2em}
.check:has(input:checked) .boost-ico{color:var(--good-dark)}
#stepMode .check .boost-ico{color:var(--good-dark)} /* step 2 is green: boost icons too */

/* ===== R13: hero illustration + empty state ===== */
.hero-illustration{width:96px;height:auto;display:block;margin:0 0 14px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.18))}
.empty-state{display:flex;flex-direction:column;align-items:center;gap:10px;padding:28px 16px;color:var(--muted);text-align:center}
.empty-state .ico{width:34px;height:34px;color:var(--line-2);stroke-width:1.6}
.empty-state span{font-size:14px;max-width:36ch}

/* ===== R14: correction form + value-direction table ===== */
.correction-form{display:flex;flex-direction:column;gap:14px;margin:18px 0}
.correction-form label{display:flex;flex-direction:column;gap:6px;font-weight:700;font-size:14px}
.correction-form input,.correction-form textarea{font-family:inherit;font-size:16px;font-weight:400;padding:10px 13px;border:1.5px solid var(--line-2);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);width:100%}
.correction-form input::placeholder,.correction-form textarea::placeholder{color:var(--muted)}
.correction-form textarea{resize:vertical}
.correction-form .req{color:var(--danger)}
.correction-form button[type=submit]{align-self:flex-start;margin-top:4px}
.correction-form .source-links{display:flex;flex-direction:column;gap:10px}
.correction-form #addSourceBtn{align-self:flex-start;font-size:13.5px;font-weight:700;color:var(--brand);background:none;border:none;cursor:pointer;padding:0}
.correction-form .topic-picker{border:0;padding:0;margin:0;min-inline-size:0}
.correction-form .topic-picker legend{padding:0 0 8px;font-weight:700;font-size:14px}
.correction-form .topic-check-grid{display:flex;flex-wrap:wrap;gap:9px}
.correction-form .topic-check-grid label{flex-direction:row;align-items:center;gap:8px;font-weight:600;font-size:13.5px;width:auto}
.correction-form .topic-check-grid input[type=checkbox]{width:17px;height:17px;padding:0;border:0;background:none;accent-color:var(--brand);flex:0 0 auto}
.correction-form .field-hint{margin:-6px 0 0;font-size:13px;font-weight:600;color:var(--danger)}
.correction-form .input-flash{border-color:var(--danger)!important;box-shadow:0 0 0 3px rgba(200,30,30,.13)}
.form-status{margin:14px 0 0;padding:11px 14px;border-radius:var(--radius-sm);font-size:14px;font-weight:600}
.form-status.success{background:var(--brand-50);color:var(--brand-dark);border:1px solid var(--brand-100)}
.form-status.error{background:#fdecec;color:#a01b1b;border:1px solid #f3c2c2}
.correction-form .contact-type{border:0;padding:0;margin:0;min-inline-size:0}
.correction-form .contact-type legend{padding:0 0 8px;font-weight:700;font-size:14px}
.correction-form .radio-line{flex-direction:row;align-items:center;gap:9px;font-weight:600;font-size:14px;margin:0 0 6px;width:auto;cursor:pointer}
.correction-form .radio-line input{width:17px;height:17px;padding:0;border:0;background:none;accent-color:var(--brand);flex:0 0 auto}
.correction-form .corr-intro{margin:0;font-weight:400;font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.correction-form .field-err{display:block;margin:5px 0 0;font-size:13px;font-weight:600;color:var(--danger)}
.correction-form .input-invalid,.correction-form .combo:has(.input-invalid){border-radius:var(--radius-sm)}
.correction-form .input-invalid{border-color:var(--danger)!important;box-shadow:0 0 0 3px rgba(200,30,30,.12)}
.correction-form .lbl{font-weight:700;font-size:14px}
.correction-form .field-pair{display:flex;gap:14px;margin:0}
.correction-form .field-pair>label{flex:1 1 0;min-width:0}
.correction-form #linksNote{margin:-6px 0 0}
.correction-form .combo{position:relative}
.combo-list{position:absolute;top:calc(100% + 4px);inset-inline:0;z-index:30;margin:0;padding:5px;list-style:none;background:var(--surface);border:1.5px solid var(--line-2);border-radius:var(--radius-sm);box-shadow:0 10px 28px rgba(15,27,45,.14);max-height:244px;overflow-y:auto}
.combo-opt{padding:9px 12px;border-radius:8px;cursor:pointer;font-weight:400;font-size:14.5px;color:var(--ink)}
.combo-opt:hover,.combo-opt.active{background:var(--brand-50);color:var(--brand-dark)}
@media(max-width:560px){ .correction-form .field-pair{flex-direction:column} }
/* honeypot: fully removed from layout. Formspree's _gotcha works with display:none,
   and it can't affect layout (the old left:-9999px caused huge RTL horizontal overflow). */
.hp-field{display:none}
.value-table{border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;margin:16px 0}
.value-table .vt-row{display:grid;grid-template-columns:minmax(140px,32%) 1fr;gap:12px;padding:11px 14px;border-bottom:1px solid var(--line);font-size:14px}
.value-table .vt-row:last-child{border-bottom:none}
.value-table .vt-row:nth-child(odd){background:var(--surface-2)}
.value-table .vt-topic{font-weight:700}
@media (max-width:560px){.value-table .vt-row{grid-template-columns:1fr;gap:2px}}
/* Accessibility: skip-to-content link */
.skip-link{position:fixed;right:8px;top:-56px;z-index:400;background:var(--brand);color:#fff;padding:9px 16px;border-radius:8px;font-weight:700;text-decoration:none;box-shadow:var(--shadow-md);transition:top .15s}
.skip-link:focus{top:8px}
#main:focus{outline:none}
/* Cookie notice banner */
.cookie-banner{position:fixed;inset-inline:12px;inset-block-end:12px;z-index:130;max-width:640px;margin-inline:auto;background:var(--ink);color:#fff;border-radius:12px;padding:12px 16px;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between}
.cookie-banner p{margin:0;font-size:13.5px;line-height:1.5;flex:1 1 260px}
.cookie-banner a{color:#fff;text-decoration:underline}
.cookie-actions{display:flex;gap:8px;flex:0 0 auto}
.cookie-banner button{font-family:inherit;font-weight:700;font-size:13.5px;cursor:pointer;padding:8px 18px;border-radius:var(--pill)}
.cookie-accept{border:none;background:#fff;color:var(--ink)}
.cookie-reject{border:1px solid rgba(255,255,255,.45);background:transparent;color:#fff}
