body:has(dialog[open]){overflow:hidden}
dialog.reveal-dialog{width:min(960px,calc(100% - 24px));max-width:960px;padding:0;border:3px solid var(--teal);overflow:auto;overscroll-behavior:contain}
.reveal-dialog .close{position:sticky;float:right;top:10px;right:10px;margin:10px 10px -54px 0;z-index:6;background:var(--paper)}
.reveal-show{position:relative;isolation:isolate;padding:1.5rem 1.5rem 0;overflow:clip}
.reveal-heading{display:block;background:none;color:var(--ink);padding:0 48px 1rem 0;min-height:0;text-align:left}
#dialog-content .reveal-heading h2{padding:0;margin:0;font-size:clamp(1.6rem,4vw,2.6rem);line-height:1.1;text-wrap:balance}
#dialog-content .reveal-heading p{margin:.35rem 0;font-size:.95rem;line-height:1.4}
.reveal-heading p:first-child{font-weight:700;color:#456356}
.reveal-ballots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin:.2rem 0 1.2rem}
.reveal-votes-title{font-family:inherit;font-size:.9rem;margin:1rem 0 .65rem}
.reveal-ballot{min-width:0;text-align:center;padding:.65rem;background:#e6edda;border:1px solid #6a8175;border-radius:8px;perspective:800px}
.reveal-ballot.your-ballot{border:2px solid var(--coral);background:#fff0dd;padding:calc(.65rem - 1px)}
.reveal-ballot h3{font-family:inherit;font-size:1rem;line-height:1.3;overflow-wrap:anywhere;margin:0 0 .5rem;min-height:2.6em}
.reveal-ballot h3 span{font-size:.8rem;font-weight:400;white-space:nowrap}
.ballot-flipper{height:98px;position:relative;transform-style:preserve-3d;transform:rotateY(180deg)}
.ballot-cover,.ballot-answer{position:absolute;inset:0;backface-visibility:hidden;border-radius:5px;overflow:hidden}
.ballot-cover{display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--teal);color:var(--paper);border:2px solid var(--teal)}
.ballot-cover strong{font-family:"Arial Rounded MT Bold","Trebuchet MS",sans-serif;font-size:3rem;line-height:1}
.ballot-cover span{font-size:.8rem;font-weight:700}
.ballot-answer{transform:rotateY(180deg);display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center;gap:.3rem;background:var(--paper);border:1px solid #6a8175;padding:4px}
.ballot-answer img{width:100%;height:88px;object-fit:contain;border-radius:3px}
.ballot-answer>div{display:flex;flex-direction:column;font-size:.75rem}
.ballot-answer strong{font-family:"Arial Rounded MT Bold","Trebuchet MS",sans-serif;font-size:3.2rem;line-height:1.1}
#dialog-content .reveal-ballot>p{font-size:.75rem;margin:.4rem 0 0;color:#456356}
.reveal-outcome{display:flex;align-items:center;gap:1.2rem;padding:1rem 1.2rem;background:#e6edda;border:2px solid var(--teal);border-radius:8px;margin-bottom:1rem}
.reveal-outcome.split{border-color:var(--coral);background:#fff0dd}
.reveal-outcome>div:last-child{min-width:0;flex:1}
.reveal-outcome h3{font-size:clamp(1.3rem,3vw,1.9rem);line-height:1.1}
#dialog-content .reveal-outcome p{margin:.55rem 0;font-size:.95rem}
.reveal-feature{position:relative;flex:0 0 85px;width:85px;isolation:isolate}
.reveal-feature img{width:100%;display:block;border-radius:6px;box-shadow:3px 5px 0 #184d4720}
.reveal-winner-number{position:absolute;left:-8px;top:-8px;min-width:36px;height:36px;border:2px solid var(--teal);background:var(--paper);border-radius:50%;font-size:1.3rem;font-weight:900;display:grid;place-items:center;z-index:3}
.reveal-connection{display:flex;flex-wrap:wrap;gap:.35rem 1rem;align-items:center}
.reveal-connection strong{font-size:1.05rem}
.reveal-connection span{font-size:.85rem}
.reveal-controls{position:sticky;bottom:0;z-index:5;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.55rem;padding:.9rem 0 calc(.9rem + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid #6a8175}
.reveal-controls #reveal-skip{margin-right:auto;font-weight:400}
.reveal-controls button{font-size:.9rem}
.reveal-controls button[hidden]{display:none}
.grand-reveal .reveal-heading{text-align:center}
.grand-reveal .reveal-outcome{background:var(--teal);color:var(--paper);gap:2rem;padding:1.5rem 2rem;min-height:290px}
.grand-reveal .grand-stage{flex-basis:250px;width:250px;overflow:clip;box-shadow:6px 8px 0 #0b302966;border-radius:7px}
.grand-stage .reveal-winner-number{left:6px;top:6px;color:var(--ink)}
.grand-reveal .reveal-ballots{margin-top:1.2rem}
.reveal-curtain{position:absolute;top:0;bottom:0;width:51%;z-index:2;background:#285f54;color:#fff9e9;font-family:"Arial Rounded MT Bold","Trebuchet MS",sans-serif;font-size:4rem;font-weight:900;display:grid;place-items:center;border:2px solid #fed69a;pointer-events:none}
.reveal-curtain.left{left:0;transform:translateX(-110%) rotate(-8deg);transform-origin:top left}
.reveal-curtain.right{right:0;transform:translateX(110%) rotate(8deg);transform-origin:top right}
.reveal-celebration{position:absolute;inset:0;overflow:clip;z-index:4;pointer-events:none}
.paper-confetti{position:absolute;top:0;width:9px;height:18px;opacity:0;pointer-events:none}
.sealed-choice .choice-mark{border-radius:5px;box-shadow:0 0 0 2px var(--paper);font-size:.8rem;padding:.5rem .6rem}
.votes-on-card{display:block;width:100%;text-align:left;min-height:0}
.vote-count{display:block;font-size:.85rem;margin:.4rem 0;line-height:1.3}
.voter-names{display:flex;flex-wrap:wrap;gap:.3rem}
.voter-name{display:inline-block;border:1px solid #6a8175;border-radius:4px;padding:.3rem .45rem;background:var(--paper);font-size:.8rem;line-height:1.2;overflow-wrap:anywhere;max-width:100%}
.voter-name.your-vote{border-color:var(--coral);font-weight:700;background:#fff0dd}
@media(min-width:701px) and (max-width:1000px){.reveal-ballots{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){
  dialog.reveal-dialog{width:calc(100% - 16px);max-height:calc(100dvh - 16px);border-width:2px}
  .reveal-show{padding:1rem 1rem 0}
  .reveal-heading{padding-right:38px}
  #dialog-content .reveal-heading h2{font-size:1.5rem}
  #dialog-content .reveal-heading p{font-size:.8rem}
  .reveal-ballots{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}
  .reveal-ballot{padding:.5rem}
  .reveal-ballot.your-ballot{padding:calc(.5rem - 1px)}
  .reveal-ballot h3{font-size:.9rem;min-height:2.6em}
  .ballot-answer{grid-template-columns:minmax(0,1fr) 46px;gap:0}
  .ballot-flipper{height:82px}
  .ballot-answer img{height:72px}
  .ballot-answer strong{font-size:2.7rem}
  .ballot-answer>div{font-size:.7rem}
  .reveal-outcome{padding:.8rem;gap:.8rem;align-items:flex-start}
  .reveal-feature{flex-basis:65px;width:65px}
  #dialog-content .reveal-outcome p{font-size:.8rem}
  .reveal-outcome h3{font-size:1.25rem}
  .reveal-connection{display:block}
  .reveal-connection strong,.reveal-connection span{display:block;font-size:.85rem}
  .reveal-controls{gap:.45rem;padding:.7rem 0 calc(.7rem + env(safe-area-inset-bottom))}
  .reveal-controls button{font-size:.8rem;flex:1;padding:.55rem}
  .reveal-controls #reveal-skip{flex-basis:100%;margin:0}
  .grand-reveal .reveal-heading{text-align:left}
  .grand-reveal .reveal-outcome{flex-direction:column;align-items:center;text-align:center;padding:1rem;gap:1rem;min-height:0}
  .grand-reveal .grand-stage{flex-basis:auto;width:180px}
  .grand-reveal .reveal-outcome h3{font-size:1.4rem}
  .vote-count{font-size:.75rem}
  .voter-name{font-size:.75rem;padding:.25rem}
}
