.kdv{
  --d-bg:#ffffff; --d-panel:#f4f6f4; --d-line:#e0e5e1; --d-ink:#16191a;
  --d-mut:#5f6b67; --d-accent:#12684a; --d-accent-ink:#ffffff; --d-soft:#e6f0ea;
  --d-err:#a8301f;
  --d-ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-family:var(--d-ui); color:var(--d-ink);
  max-width:1000px; margin:56px auto; padding-inline:16px; box-sizing:border-box;
}
.kdv *,.kdv *::before,.kdv *::after{box-sizing:border-box;}
@media (prefers-color-scheme:dark){
  .kdv:not([data-theme="light"]){
    --d-bg:#171c19; --d-panel:#1d2320; --d-line:#2b332e; --d-ink:#e7ece9;
    --d-mut:#94a29c; --d-accent:#42b285; --d-accent-ink:#0b1310; --d-soft:#1a2b23;
    --d-err:#e08573;
  }
}
.kdv-head{max-width:64ch; margin-bottom:20px;}
.kdv-head h2{font-size:27px; font-weight:650; letter-spacing:-.022em; margin:0 0 8px; text-wrap:balance;}
.kdv-head p{margin:0; color:var(--d-mut); font-size:15.5px; line-height:1.65;}

.kdv-srlabel{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);}
.kdv-field{display:flex; gap:9px; align-items:flex-end; background:var(--d-panel);
  border:1px solid var(--d-line); border-radius:12px; padding:9px 9px 9px 13px;}
.kdv-field:focus-within{border-color:var(--d-accent);}
.kdv-field textarea{flex:1; border:0; background:transparent; resize:none; outline:none;
  font:400 15px/1.55 var(--d-ui); color:var(--d-ink); max-height:150px; padding:4px 0;}
.kdv-go{flex:none; border:0; border-radius:9px; background:var(--d-accent); color:var(--d-accent-ink);
  padding:10px 16px; font:600 13.5px var(--d-ui); cursor:pointer;}
.kdv-go:hover{filter:brightness(1.08);}
.kdv-go:disabled{opacity:.5; cursor:progress;}
.kdv-examples{display:flex; flex-wrap:wrap; gap:7px; margin-top:10px;}
.kdv-ex{border:1px solid var(--d-line); background:transparent; border-radius:999px;
  padding:6px 12px; font:400 12.5px var(--d-ui); color:var(--d-mut); cursor:pointer;}
.kdv-ex:hover{color:var(--d-ink); border-color:var(--d-accent);}

.kdv-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:22px;}
@media (max-width:760px){ .kdv-grid{grid-template-columns:1fr;} }
.kdv-col{border:1px solid var(--d-line); border-radius:12px; background:var(--d-bg);
  padding:15px; display:flex; flex-direction:column; gap:11px;}
.kdv-col.is-picked{border-color:var(--d-accent); box-shadow:inset 0 0 0 1px var(--d-accent);}
.kdv-col header{display:flex; align-items:baseline; justify-content:space-between; gap:10px;}
.kdv-tag{font:700 10.5px var(--d-ui); letter-spacing:.12em; text-transform:uppercase; color:var(--d-accent);}
.kdv-who{font-size:12px; color:var(--d-mut);}
.kdv-body{font-size:14.5px; line-height:1.68; white-space:pre-wrap; overflow-wrap:anywhere; flex:1; min-height:60px;}
.kdv-body.is-err{color:var(--d-err);}
.kdv-vote{border:1px solid var(--d-line); background:var(--d-panel); color:var(--d-ink);
  border-radius:9px; padding:8px 12px; font:600 12.5px var(--d-ui); cursor:pointer; align-self:flex-start;}
.kdv-vote:hover{border-color:var(--d-accent);}
.kdv-vote:disabled{opacity:.45; cursor:default;}

.kdv-dots{display:inline-flex; gap:4px; align-items:center; height:18px;}
.kdv-dots i{width:5px; height:5px; border-radius:50%; background:var(--d-mut); animation:kdv-b 1.1s infinite;}
.kdv-dots i:nth-child(2){animation-delay:.15s;}
.kdv-dots i:nth-child(3){animation-delay:.3s;}
@keyframes kdv-b{0%,60%,100%{opacity:.3;transform:translateY(0);}30%{opacity:1;transform:translateY(-3px);}}

.kdv-tally{margin:16px 0 0; font-size:13.5px; color:var(--d-mut);}
.kdv-legal{margin:18px 0 0; padding-top:14px; border-top:1px solid var(--d-line);
  font-size:11.5px; line-height:1.6; color:var(--d-mut);}
@media (prefers-reduced-motion:reduce){.kdv-dots i{animation:none; opacity:.6;}}