:root { --ink:#111; --muted:#555; --accent:#e49ac2; --line:#ddd; }
  html, body { background:#fff !important; color:var(--ink) !important; margin:0; padding:0; }
  body { font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; }
  .wrap { max-width: 860px; margin: 24px auto 48px; padding: 0 16px; }
  h1 { font-size: 26px; margin: 8px 0 4px; }
  .sub { color:var(--muted); margin:0 0 18px; font-size: 14px; }
  .meta-row { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin:12px 0 18px; }
  .btn { border:2px solid var(--accent); color:var(--accent); background:#fff; padding:8px 12px; border-radius:10px; font-weight:700; cursor:pointer; min-width: 44px}
  .btn:hover {background:#ffeef7; color:#000;}
  .score { margin-left:auto; font-weight:700; border:2px solid var(--accent); padding:6px 10px; border-radius:999px; }

  /* checklist */
  form { margin-top:10px; }
  .trait { display:grid; grid-template-columns: 22px 1fr 160px; gap:10px 16px; align-items:start; padding:10px 0; border-bottom:1px solid var(--line); }
  .trait:last-child { border-bottom:0; }
  .trait input[type="checkbox"] { margin-top:3px; transform:scale(1.1); }
  .trait label { font-weight:600; line-height:1.25; }
  .trait select { justify-self:end; padding:6px 8px; border:1px solid #bbb; border-radius:6px; background:#fff; }
  .blurb { grid-column: 2 / -1; font-size: 0.92rem; color: #666; margin-top:2px; display:none; }
  body.with-blurbs .blurb { display:block; }

  .notes { margin-top:18px; }
  .notes h2 { font-size:18px; margin:18px 0 6px; }
  textarea { width:100%; min-height:110px; border:1px solid #bbb; border-radius:8px; padding:10px 12px; font:14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; box-sizing:border-box; }
  .footer { color:var(--muted); font-size:12px; margin-top:18px; }
:root {
  --offwhite: #eae7e2; /* soft off-white */
  --footer-bg: #1b1b1b; /* near-black */
}

footer { /* or .footer if that’s your element */
  background: var(--footer-bg);
  color: var(--offwhite);
  font-size: 15px;
  margin-top: 18px;
  padding: 16px 0;
}

footer a { color: #f3e9ff; }         /* subtle highlight for links */
footer a:hover { text-decoration: underline; }

/* Keep print crisp */
@media print {
  footer { background: #fff !important; color: #000 !important; }
  footer a { color: #000 !important; }
}

  /* compact mode */
  .compact .trait { padding:6px 0; }
  .compact .blurb { font-size:0.85rem; }

  /* avoid splitting traits */
  .trait, .trait * { break-inside: avoid; page-break-inside: avoid; }


  
  

  /* print */
  @media print {
    .btn, .toggle-wrap { display:none !important; }
    @page { margin: 16mm; }
    body::before{
    content: "Interpersonal Dynamics Checklist (Client Version)  |  " attr(data-url) "  |  " attr(data-date);
      display:block; font-size:10pt; margin-bottom:8mm; padding-bottom:3mm; border-bottom:1px solid #000;
    }
    body::after {
      counter-reset: page;
      content: "© NarcyNarc.com(ics) — Page " counter(page);
      display:block; font-size:10pt; margin-top:8mm; padding-top:3mm; border-top:1px solid #000;
    }
    /* Print blurbs only if body has .print-with-blurbs */
    .blurb { display:none !important; }
    body.print-with-blurbs .blurb { display:block !important; }
  }


/* Matching PDF Download Button */
a.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border: 2px solid var(--accent);
  color: var(--accent);
  background: #fff;
  padding: 8px 12px;
  border-radius: 10px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

a.btn:hover {
  background: #f8f4f7; /* same gentle hover tint */
  color: var(--accent);
  text-decoration: none;
}
.ver-tag{ color:#999; font-weight:600; margin-left:.35rem }
.info-row{
  display:flex; flex-wrap:wrap; gap:12px; margin:10px 0 6px;
}
.info-row label{
  display:flex; flex-direction:column; gap:6px; font-weight:600; font-size:13px;
}
.info-row input{
  padding:6px 8px; border:1px solid #bbb; border-radius:6px; background:#fff; min-width:180px;
}
@media print{
  .info-row input{ border:1px solid #000 }
}
.results-box{
  border:1px solid var(--line); border-radius:10px;
  padding:10px 12px; background:#fafafa; color:#222; margin:-4px 0 8px;
}
.results-row{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; font-size:14px }
.results-row .dot{ opacity:.5 }
.top3{ margin:0; padding-left:18px }
@media print{
  .results-box{ background:#fff }
}
.score{
  margin-left:auto; font-weight:600;
  border:1px solid var(--line);
  padding:4px 8px; border-radius:999px; color:#444; background:#fff;
  opacity:.85;
}
.hide-score .score{ display:none; }
.trait:nth-child(even){background:#fcfcfc;}
.trait select { justify-self:end; margin-top:2px; }
.score { background:#fff7fb; border-color:#e49ac2; color:#222; }

@media print { h1 {text-align:center;} }
@media(max-width:600px){
  .wrap{padding:0 10px;}
  .trait{grid-template-columns:20px 1fr 130px;}
}
footer a { color: #f3e9ff; transition: color .2s; }
footer a:hover { color: #fff; text-decoration: underline; }
@media print {
  body::after {
    content: "© NarcyNarc.com(ics) — Page " counter(page) "  |  Thank you for using this tool responsibly.";
  }
}
/* Larger hit area + clear focus */
.btn { min-width:44px; min-height:36px; }
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible { outline: 3px solid #e49ac2; outline-offset: 2px; }

/* Zebra rows help scanning */
.trait:nth-child(even) { background: #fafafa; }

/* Better list density on mobile */
@media (max-width: 560px){
  .trait { grid-template-columns: 22px 1fr; }
  .trait select { grid-column: 2 / -1; justify-self: start; }
}

/* Print: optional header/footer bands */
@media print {
  .btn, .toggle-wrap, .hamburger, .side-menu { display:none !important; }
  @page { margin: 16mm; }
  body::before{
    content: "Interpersonal Dynamics Checklist (Client Version)  |  " attr(data-url) "  |  " attr(data-date);
    display:block; font-size:10pt; margin-bottom:8mm; padding-bottom:3mm; border-bottom:1px solid #000;
  }
  body::after {
    counter-reset: page;
    content: "© NarcyNarc.com(ics) — Page " counter(page);
    display:block; font-size:10pt; margin-top:8mm; padding-top:3mm; border-top:1px solid #000;
  }
  /* Only print blurbs if toggle is on */
  .blurb { display:none !important; }
  body.print-with-blurbs .blurb { display:block !important; }
}
.score { opacity:.9; }
.small-muted { color:#888; font-size: .95rem; }
footer .small-muted a { color: inherit; text-decoration: underline; }
#resetAll { border-style:dashed; opacity:.85; }
#resetAll:hover { opacity:1; }
@media print {
  body::after {
    border: none !important;
    background: none !important;
  }
}
.creator-voice-box {
  margin-top: 60px;
  margin-bottom: 40px;
  padding: 20px;
  line-height: 1.55;
}
.creator-voice-box p,
.creator-voice-box li {
  margin-bottom: 12px;
}