/*!*****************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./app/election-defense/styles.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************/
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500;600&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Serif:ital,wght@0,600;0,700;1,600&display=swap');

.ed-page {
  --paper: #f5f1e8;
    --paper-raised: #fbf8f1;
    --ink: #211d1a;
    --ink-soft: #5b5347;
    --line: #d9d0bd;
    --line-strong: #b8ab8f;
    --rust: #a8431f;
    --rust-dark: #7c3016;
    --teal: #2c5f5a;
    --teal-dark: #1c403c;
    --tag-bg: #eee7d4;
    --focus: #1c5cff;
    --start-bg: #f0ece0;
  margin:0;
    background: var(--paper);
    background-image:
      radial-gradient(circle at 1px 1px, rgba(0,0,0,0.035) 1px, transparent 0);
    background-size: 22px 22px;
    color: var(--ink);
    font-family: 'DM Sans', sans-serif;
    line-height: 1.5;
    padding: 0 0 80px 0;
}

.ed-page *{ box-sizing: border-box; }

.ed-page a{ color: var(--rust); }

.ed-page a:hover{ color: var(--rust-dark); }

.ed-page .wrap{
    max-width: 880px;
    margin: 0 auto;
    padding: 0 24px;
  }

.ed-page header.masthead{
    border-bottom: 3px solid var(--ink);
    padding: 36px 0 20px 0;
    margin-bottom: 28px;
  }

.ed-page .eyebrow{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--rust-dark);
    display:flex;
    align-items:center;
    gap: 10px;
  }

.ed-page .eyebrow::before{
    content:"";
    width: 8px; height: 8px;
    background: var(--rust);
    display:inline-block;
    border-radius: 1px;
  }

.ed-page h1{
    font-family: 'DM Sans', sans-serif;
    font-weight: 700;
    font-size: clamp(28px, 4.2vw, 40px);
    margin: 10px 0 8px 0;
    letter-spacing: -0.01em;
  }

.ed-page .masthead p{
    color: var(--ink-soft);
    max-width: 640px;
    margin: 0;
    font-size: 15px;
  }

.ed-page section.intake{
    background: var(--paper-raised);
    border: 1.5px solid var(--ink);
    box-shadow: 4px 4px 0 var(--line-strong);
    padding: 22px 24px 24px 24px;
    margin-bottom: 30px;
  }

.ed-page label.field-label{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ink-soft);
    display:block;
    margin-bottom: 8px;
  }

.ed-page textarea#situation{
    width:100%;
    min-height: 92px;
    resize: vertical;
    font-family: 'DM Sans', sans-serif;
    font-size: 15.5px;
    padding: 12px 14px;
    border: 1.5px solid var(--line-strong);
    background: #fff;
    color: var(--ink);
    outline: none;
  }

.ed-page textarea#situation:focus{
    border-color: var(--focus);
    box-shadow: 0 0 0 3px rgba(28,92,255,0.15);
  }

.ed-page .intake-row{
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 14px;
    flex-wrap: wrap;
  }

.ed-page .hint{
    font-size: 13px;
    color: var(--ink-soft);
  }

.ed-page button.primary{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    background: var(--rust);
    color: #fff8ef;
    border: none;
    padding: 12px 20px;
    cursor: pointer;
    transition: background 0.15s ease;
  }

.ed-page button.primary:hover{ background: var(--rust-dark); }

.ed-page button.primary:focus-visible{ outline: 3px solid var(--focus); outline-offset:2px; }

.ed-page section.matches h2,
  .ed-page section.selected h2{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ink);
    margin: 0 0 14px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
    display:flex;
    justify-content: space-between;
    align-items:baseline;
    flex-wrap: wrap;
    gap: 8px;
  }

.ed-page .empty-state{
    font-size: 14px;
    color: var(--ink-soft);
    padding: 14px 0 4px 0;
  }

.ed-page .match-list{
    list-style:none;
    margin:0 0 8px 0;
    padding:0;
    display:flex;
    flex-direction: column;
    gap: 10px;
  }

.ed-page .match-card{
    display:flex;
    gap: 14px;
    align-items:flex-start;
    background: var(--paper-raised);
    border: 1px solid var(--line-strong);
    padding: 14px 16px;
    transition: border-color 0.15s ease, background 0.15s ease;
  }

.ed-page .match-card:hover{ border-color: var(--rust); }

.ed-page .match-card.checked{
    background: #fff;
    border-color: var(--teal);
    box-shadow: 3px 3px 0 rgba(44,95,90,0.18);
  }

.ed-page .match-card input[type="checkbox"]{
    width: 20px; height:20px;
    margin-top: 3px;
    accent-color: var(--teal);
    flex: none;
    cursor:pointer;
  }

.ed-page .match-body{ flex:1; }

.ed-page .match-tagrow{
    display:flex;
    align-items:center;
    gap: 10px;
    margin-bottom: 4px;
    flex-wrap: wrap;
  }

.ed-page .scen-num{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    background: var(--tag-bg);
    border: 1px solid var(--line-strong);
    padding: 2px 7px;
    color: var(--rust-dark);
  }

.ed-page .phase-tag{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 10.5px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ink-soft);
  }

.ed-page .match-title{
    font-family: 'DM Sans', sans-serif;
    font-weight: 600;
    font-size: 17px;
    margin: 2px 0 4px 0;
  }

.ed-page .match-desc{
    font-size: 13.5px;
    color: var(--ink-soft);
    margin:0;
  }

.ed-page section.selected{ margin-top: 40px; }

.ed-page .brief-card{
    background: var(--paper-raised);
    border-left: 5px solid var(--rust);
    border-top: 1px solid var(--line);
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 20px 24px 22px 22px;
    margin-bottom: 22px;
    overflow-wrap: break-word;
    word-break: break-word;
    /* "See Actions" (ElectionDefenseClient.tsx) scrolls this element
       (id="scenario-N") to the top of the viewport via scrollIntoView({
       block: "start" }). On desktop, GlobalNav's top strip is
       position: fixed at 54px tall and stays on screen through the
       scroll, so without this the card's own top edge — the SCENARIO N /
       title row — landed directly under that bar and was chopped off.
       scroll-margin-top is honored by scrollIntoView in modern browsers,
       so this clears the fixed bar plus a little breathing room instead.
       0 on mobile: GlobalNav's mobile bar is fixed to the BOTTOM, not
       top, so nothing covers the top of the viewport there. */
    scroll-margin-top: 20px;
  }

@media (min-width: 640px){
  .ed-page .brief-card{
    /* Matches GlobalNav's fixed desktop top-strip height (54px) — see
       app/components/GlobalNav.tsx — plus ~20px so the title isn't
       flush against the bar's bottom edge either. */
    scroll-margin-top: 74px;
  }
}

.ed-page .brief-head{
    display:flex;
    align-items:baseline;
    gap: 12px;
    flex-wrap:wrap;
    margin-bottom: 4px;
  }

.ed-page .brief-num{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 13px;
    font-weight: 600;
    color: var(--rust-dark);
    letter-spacing: 0.04em;
  }

.ed-page .brief-title{
    font-family: 'DM Sans', sans-serif;
    font-weight: 700;
    font-size: 21px;
    margin: 0;
  }

.ed-page .brief-phase{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ink-soft);
    margin: 2px 0 16px 0;
  }

/* Moved here from the scenario list (used to reveal inline on hover/
   "more…" there) — its own box, positioned above start-here-box below.
   Rust accent rather than teal specifically so it doesn't read as another
   action item — teal is reserved for "start here"/action-list content
   throughout this palette; rust already marks descriptive/identifying
   info (brief-card's own left border, .brief-num, .scen-num). */
.ed-page .brief-desc-box{
    background: var(--paper-raised);
    border: 1px solid var(--line-strong);
    border-left: 3px solid var(--rust);
    padding: 12px 16px;
    margin-bottom: 14px;
    font-size: 14px;
    overflow-wrap: break-word;
    word-break: break-word;
  }

.ed-page .brief-desc-label{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--rust-dark);
    margin-right: 6px;
  }

.ed-page .brief-desc-text{
    color: var(--ink-soft);
  }

.ed-page .start-here-box{
    background: var(--start-bg);
    border: 1px solid var(--line-strong);
    border-left: 3px solid var(--teal);
    padding: 12px 16px;
    margin-bottom: 18px;
    font-size: 14.5px;
    overflow-wrap: break-word;
    word-break: break-word;
  }

.ed-page .start-here-label{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--teal-dark);
    margin-right: 6px;
  }

.ed-page .brief-sub{
    font-family: 'DM Mono', 'Courier New', monospace;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--teal-dark);
    margin: 4px 0 10px 0;
  }

.ed-page ul.action-list{
    margin: 0;
    padding-left: 0;
    list-style: none;
  }

.ed-page ul.action-list li{
    position: relative;
    padding-left: 26px;
    margin-bottom: 12px;
    font-size: 14.5px;
    overflow-wrap: break-word;
    word-break: break-word;
  }

.ed-page ul.action-list li::before{
    content: "";
    position:absolute;
    left:0; top: 4px;
    width: 14px; height:14px;
    border: 2px solid var(--teal);
    background: transparent;
  }

/* Long unbroken URLs (e.g. ballotpedia.org/Election_recount_laws_and_...)
   were overflowing past the edge of .start-here-box / .brief-card instead
   of wrapping — overflow-wrap above handles ordinary text, but links
   specifically need their own rule in some browsers since an anchor's
   content can otherwise resist breaking even with overflow-wrap set on an
   ancestor. */
.ed-page .start-here-box a,
.ed-page ul.action-list a{
    overflow-wrap: break-word;
    word-break: break-word;
  }

.ed-page .no-actions-note{
    font-size: 13.5px;
    color: var(--ink-soft);
    font-style: italic;
  }

.ed-page footer.note{
    max-width: 880px;
    margin: 40px auto 0 auto;
    padding: 0 24px;
    font-size: 12.5px;
    color: var(--ink-soft);
    border-top: 1px solid var(--line);
    padding-top: 16px;
  }

/* ── Compact scenario list (redesign) ──────────────────────────────────────
   Added for the compact "all 18 scenarios, title-only, grouped by phase"
   redesign — see app/election-defense/ElectionDefenseClient.tsx. Kept
   separate from the original ported rules above rather than editing them,
   since .match-card/.match-list/etc. are still used for the flat
   "Possible matches" results when the user has filtered. */

.ed-page .ed-title-standalone{
  padding-top: 28px;
  margin-bottom: 0;
}

.ed-page .ed-title{
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: clamp(0.85rem, 4.4vw, 2.1rem);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: -0.01em;
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
}

.ed-page .ed-instructions{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--line);
  padding-bottom: 14px;
  margin-bottom: 18px;
}

.ed-page .ed-instructions-text{
  font-size: 14px;
  color: var(--ink-soft);
  margin: 0;
}

.ed-page .ed-instructions-link{
  flex-shrink: 0;
  background: none;
  border: none;
  font-family: 'DM Mono', 'Courier New', monospace;
  font-size: 12px;
  letter-spacing: 0.05em;
  color: var(--teal-dark);
  text-decoration: underline;
  cursor: pointer;
  padding: 6px 0;
}

.ed-page .ed-phase-heading{
  font-family: 'DM Mono', 'Courier New', monospace;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rust-dark);
  margin: 16px 0 5px 0;
  padding-bottom: 3px;
  border-bottom: 1px solid var(--line);
}

.ed-page .ed-phase-group:first-child .ed-phase-heading{ margin-top: 0; }

.ed-page .ed-row-list{
  display: flex;
  flex-direction: column;
}

.ed-page .ed-row{
  border-bottom: 1px solid var(--line);
}

.ed-page .ed-row-titleline{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 0;
}

.ed-page .ed-row-label{
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  cursor: pointer;
  padding: 2px 0;
}

.ed-page .ed-row-label input[type="checkbox"]{
  width: 15px; height: 15px;
  accent-color: var(--teal);
  flex: none;
  cursor: pointer;
}

.ed-page .ed-row-tag{
  font-family: 'DM Mono', 'Courier New', monospace;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--rust-dark);
  flex: none;
}

.ed-page .ed-row-title-text{
  font-family: 'DM Sans', sans-serif;
  font-weight: 600;
  font-size: 14.5px;
  color: var(--ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.ed-page .ed-row-phase-tag{
  font-family: 'DM Mono', 'Courier New', monospace;
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink-soft);
  flex: none;
}

.ed-page .ed-row-see-actions{
  flex: none;
  margin-left: auto;
  background: var(--teal);
  border: none;
  border-radius: 2px;
  font-family: 'DM Mono', 'Courier New', monospace;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #fff8ef;
  cursor: pointer;
  padding: 5px 10px;
  transition: background 0.15s ease;
}

.ed-page .ed-row-see-actions:hover{ background: var(--teal-dark); }

.ed-page .ed-row.checked .ed-row-title-text{ color: var(--teal-dark); }

@media (max-width: 640px){
  .ed-page .ed-row-title-text{ white-space: normal; }
  .ed-page .ed-row-phase-tag{ display: none; }
}

@media (max-width: 560px) {
  .ed-page .brief-card{ padding: 16px; }
  .ed-page section.intake{ padding: 18px; }
}

