.sbg-draft-wrapper,.sbg-draft-wrapper *,.sbg-draft-wrapper *::before,.sbg-draft-wrapper *::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --blood:#8B0000;--blood-light:#B22222;--blood-dark:#4A0000;
  --gold:#C9A84C;--gold-dim:#8B7535;--parchment:#F5E6C8;--parchment-dark:#D4C4A0;
  --ink:#1A1A1A;--ink-light:#3A3A3A;--shadow:rgba(0,0,0,0.6);
  --townsfolk:#2E86AB;--outsider:#4ECDC4;--minion:#E85D5D;--demon:#CC2222;
  --bg:#0D0A06;--surface:#1A1510;--surface2:#251E15;
  --radius:6px;
}
.sbg-draft-wrapper{font-size:14px;line-height:normal;
  font-family:'Crimson Text',Georgia,serif;background:var(--bg);color:var(--parchment);
  min-height:100vh;overflow-x:hidden;
  background-image:
    radial-gradient(ellipse at 20% 50%, rgba(139,0,0,0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 50%, rgba(139,0,0,0.06) 0%, transparent 50%);
}
.sbg-draft-wrapper h1,.sbg-draft-wrapper h2,.sbg-draft-wrapper h3,.sbg-draft-wrapper h4{font-family:'Cinzel',serif;letter-spacing:0.05em}
.sbg-draft-wrapper button{font-family:'Cinzel',serif;cursor:pointer;border:none;transition:all 0.2s ease}
.sbg-draft-wrapper ::-webkit-scrollbar{width:6px}
.sbg-draft-wrapper ::-webkit-scrollbar-track{background:var(--surface)}
.sbg-draft-wrapper ::-webkit-scrollbar-thumb{background:var(--blood-dark);border-radius:3px}
#roleChangeGrid::-webkit-scrollbar{width:6px}
#roleChangeGrid::-webkit-scrollbar-track{background:var(--surface)}
#roleChangeGrid::-webkit-scrollbar-thumb{background:var(--blood-dark);border-radius:3px}
#roleChangeGrid{scrollbar-width:thin;scrollbar-color:var(--blood-dark) var(--surface)}
.app{max-width:1400px;margin:0 auto;padding:1rem}

header{text-align:center;padding:2rem 0 1rem}
header h1{font-size:2.2rem;color:var(--gold);text-shadow:0 0 30px rgba(201,168,76,0.3)}
header .subtitle{color:var(--parchment-dark);font-style:italic;margin-top:0.3rem;font-size:1.1rem}
.ccc-logo-fixed{position:fixed;bottom:12px;left:12px;height:36px;z-index:9999999;pointer-events:none;display:none}
.ccc-logo-setup{display:block;margin:1.5rem auto 0;height:70px}

@media (hover: none) and (pointer: coarse) and (max-width: 1024px){
  .chrome-ext-tip{display:none}
}

html:has(.sbg-draft-wrapper){background-image:url('https://grimbits.com/wp-content/uploads/2026/02/Sushi-Buffet.png') !important;background-size:cover;background-position:center top;background-attachment:fixed;}

.phase{display:none;animation:fadeIn 0.4s ease}
.phase.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

.setup-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem;margin-top:1.5rem}
@media(max-width:900px){.setup-grid{grid-template-columns:minmax(0,1fr)}.setup-grid>div{display:contents}.setup-grid .panel{margin-top:0!important}.setup-grid>div:last-child>.panel:first-child{order:-1}}
.panel{background:var(--surface);border:1px solid var(--surface2);border-radius:var(--radius);padding:1.2rem}
.panel h3{color:var(--gold);font-size:1rem;margin-bottom:0.8rem;border-bottom:1px solid var(--surface2);padding-bottom:0.5rem}

.script-btns{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:1rem}
.sbg-draft-wrapper .script-btn,.overlay .script-btn{padding:0.4rem 0.8rem;background:var(--surface2);color:var(--parchment-dark);border-radius:var(--radius);font-size:0.85rem;border:1px solid transparent}
.script-btn.active{border-color:var(--gold);color:var(--gold);background:rgba(201,168,76,0.1)}
.script-btn:hover{border-color:var(--gold-dim)}

.char-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:0.4rem;max-height:400px;overflow-y:auto;padding-right:0.3rem}
.char-chip{padding:0.3rem 0.5rem;border-radius:var(--radius);font-size:0.8rem;cursor:pointer;border:1px solid transparent;transition:all 0.2s ease;display:flex;align-items:center;gap:0.4rem;background:var(--surface2);color:var(--parchment-dark);overflow:hidden}
.char-chip:hover{border-color:var(--parchment-dark);background:rgba(37,30,21,0.9)}
.char-chip.selected{border-color:var(--gold);color:var(--parchment);background:rgba(201,168,76,0.08)}
.char-chip .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.char-chip .dot.townsfolk{background:var(--townsfolk)}
.char-chip .dot.outsider{background:var(--outsider)}
.char-chip .dot.minion{background:var(--minion)}
.char-chip .dot.demon{background:var(--demon)}

.sbg-draft-wrapper .select-type-btn,.overlay .select-type-btn{padding:0.25rem 0.6rem;border-radius:var(--radius);font-size:0.75rem;background:transparent;color:var(--parchment-dark);border:1px solid var(--surface2)}
.select-type-btn:hover{border-color:var(--parchment-dark)}

.config-row{display:flex;align-items:center;gap:0.8rem;margin-bottom:0.8rem;flex-wrap:wrap}
.config-row label{color:var(--parchment-dark);font-size:0.9rem;min-width:120px}
.config-input{width:60px;padding:0.4rem;background:var(--surface2);border:1px solid var(--ink-light);border-radius:var(--radius);color:var(--parchment);font-family:'Cinzel',serif;font-size:0.9rem;text-align:center}
.config-input:focus{outline:none;border-color:var(--gold)}
.sbg-draft-wrapper .stepper-btn,.overlay .stepper-btn{width:44px;height:44px;min-width:44px;max-width:44px;min-height:44px;max-height:44px;padding:0;margin:0 !important;flex:0 0 auto;box-sizing:border-box;border-radius:50%;border:2px solid var(--gold-dim);background:var(--surface2);color:var(--gold);font-size:1.5rem;font-weight:700;cursor:pointer;transition:all 0.2s;display:flex;align-items:center;justify-content:center;line-height:1;font-family:'Cinzel',serif}
.stepper-btn:hover{border-color:var(--gold);background:rgba(139,117,53,0.2);color:var(--parchment)}
.stepper-btn:active{transform:scale(0.92)}

.sbg-draft-wrapper button,.overlay button{margin-right:0 !important;margin-bottom:0 !important}
.sbg-draft-wrapper .action-btn,.overlay .action-btn,.sbg-draft-wrapper .restart-btn,.overlay .restart-btn{margin-left:auto !important;margin-right:auto !important}

#floatingControls button,#floatingControls select{margin:0 !important;white-space:nowrap !important;text-transform:none !important;flex:0 0 auto !important;width:auto !important}
.type-dist-row{display:flex;justify-content:space-around;gap:0.3rem;padding:0.6rem 0.2rem;background:var(--surface2);border-radius:var(--radius);margin-top:0.2rem}
.type-dist-item{display:flex;flex-direction:column;align-items:center;gap:0.15rem;min-width:50px}
.type-dist-count{font-family:'Cinzel',serif;font-size:1.3rem;font-weight:700;line-height:1}
.type-dist-label{font-size:0.6rem;color:var(--parchment-dark);text-transform:uppercase;letter-spacing:0.06em}
.option-label{display:flex;align-items:center;gap:0.6rem;font-size:0.85rem;color:var(--parchment-dark);margin-bottom:0.5rem;cursor:pointer}
.toggle-switch{position:relative;display:inline-block;width:36px;height:20px;flex-shrink:0}
.toggle-switch input{opacity:0;width:0;height:0;position:absolute}
.toggle-switch .slider{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--surface2);border:1px solid var(--ink-light);border-radius:10px;cursor:pointer;transition:all 0.2s}
.toggle-switch .slider:before{content:'';position:absolute;width:14px;height:14px;left:2px;bottom:2px;background:var(--parchment-dark);border-radius:50%;transition:all 0.2s}
.toggle-switch input:checked+.slider{background:rgba(201,168,76,0.25);border-color:var(--gold)}
.toggle-switch input:checked+.slider:before{transform:translateX(16px);background:var(--gold)}
.adv-toggle{display:flex;align-items:center;gap:0.4rem;cursor:pointer;font-size:0.75rem;color:var(--gold-dim);letter-spacing:0.04em;text-transform:uppercase;margin-top:0.8rem;padding-top:0.6rem;border-top:1px solid var(--surface2);-webkit-user-select:none;user-select:none}
.adv-toggle:hover{color:var(--gold)}
.adv-toggle .chevron{transition:transform 0.2s;font-size:0.6rem}
.adv-toggle.open .chevron{transform:rotate(90deg)}
.adv-body{display:none;padding-top:0.5rem}
.adv-toggle.open+.adv-body{display:block}
.tor-note{display:none}
.tor-masked>.tor-note{display:block;text-align:center;max-width:460px;margin:0 auto 1rem;position:relative;z-index:1}
.tor-masked>.tor-note p{color:var(--parchment-dark);line-height:1.5;margin-top:0.4rem}
.tor-masked>h2,.tor-masked>p,.tor-masked>.pick-sub,.tor-masked>.picked-name,.tor-masked>.picked-type,.tor-masked>#confirmTokenWrap,.tor-masked>#hermitFinalRoles{display:none!important}
.tor-card .tor-q{display:flex;align-items:center;justify-content:center;width:64px;height:64px;margin:0.6rem auto 0.4rem;border-radius:50%;border:2px solid var(--gold-dim);font-family:'Cinzel',serif;font-size:2rem;color:var(--gold)}
.option-hint{font-size:0.7rem;color:var(--parchment-dark);margin:-0.2rem 0 0.5rem 2.8rem;opacity:0.6}
.seg-group{display:inline-flex;border:1px solid var(--ink-light);border-radius:var(--radius);overflow:hidden;flex-shrink:0}
.sbg-draft-wrapper .seg-btn,.overlay .seg-btn{padding:0.25rem 0.55rem;font-family:'Crimson Text',Georgia,serif;font-size:0.8rem;background:var(--surface2);color:var(--parchment-dark);border:none;cursor:pointer;transition:all 0.15s;border-right:1px solid var(--ink-light)}
.seg-btn:last-child{border-right:none}
.seg-btn:hover{color:var(--parchment)}
.seg-btn.active{background:rgba(201,168,76,0.15);color:var(--gold);border-color:var(--gold-dim)}
.tip-wrap{position:relative;display:inline-flex;align-items:center;margin-left:auto;flex-shrink:0}
.tip-icon{width:18px;height:18px;border-radius:50%;border:1px solid var(--ink-light);background:var(--surface2);color:var(--parchment-dark);font-size:0.65rem;display:flex;align-items:center;justify-content:center;cursor:help;-webkit-user-select:none;user-select:none;transition:all 0.15s;font-style:italic;font-family:Georgia,serif;line-height:1}
.tip-icon:hover,.tip-wrap.show .tip-icon{border-color:var(--gold);color:var(--gold);background:rgba(201,168,76,0.1)}
.tip-bubble{position:absolute;right:0;top:calc(100% + 6px);width:220px;padding:0.55rem 0.7rem;background:var(--surface);border:1px solid var(--gold-dim);border-radius:var(--radius);font-size:0.75rem;color:var(--parchment-dark);line-height:1.45;box-shadow:0 4px 16px rgba(0,0,0,0.5);z-index:10;opacity:0;pointer-events:none;transform:translateY(-4px);transition:all 0.15s ease}
.tip-wrap:hover .tip-bubble,.tip-wrap.show .tip-bubble{opacity:1;pointer-events:auto;transform:translateY(0)}

.count-row{display:flex;justify-content:space-between;font-size:0.85rem;padding:0.2rem 0;color:var(--parchment-dark)}
.count-row .val{color:var(--parchment);font-family:'Cinzel',serif}
.note{font-size:0.8rem;color:var(--parchment-dark);font-style:italic;margin-top:0.5rem}
.error-msg{color:var(--minion);font-size:0.85rem;margin-top:0.5rem;text-align:center}

.sbg-draft-wrapper .action-btn,.overlay .action-btn{
  display:inline-block;padding:0.8rem 3rem;line-height:1.4;
  background:linear-gradient(135deg,var(--blood),var(--blood-dark));
  color:var(--gold);font-size:1.1rem;border-radius:var(--radius);
  border:1px solid var(--blood-light);text-shadow:0 1px 3px rgba(0,0,0,0.5);
  overflow:visible;
}
.action-btn:hover{background:linear-gradient(135deg,var(--blood-light),var(--blood));box-shadow:0 0 20px rgba(139,0,0,0.4)}
.action-btn:disabled{opacity:0.4;cursor:not-allowed}

.overlay{
  position:fixed;top:0;left:0;right:0;bottom:0;
  display:flex;align-items:center;justify-content:flex-start;flex-direction:column;
  z-index:999999;text-align:center;padding:2rem 2rem 5rem;gap:1.5rem;
  pointer-events:auto;isolation:isolate;
  overflow-y:auto;-webkit-overflow-scrolling:touch;

  --blood:#8B0000;--blood-light:#B22222;--blood-dark:#4A0000;
  --gold:#C9A84C;--gold-dim:#8B7535;--parchment:#F5E6C8;--parchment-dark:#D4C4A0;
  --ink:#1A1A1A;--ink-light:#3A3A3A;--shadow:rgba(0,0,0,0.6);
  --townsfolk:#2E86AB;--outsider:#4ECDC4;--minion:#E85D5D;--demon:#CC2222;
  --bg:#0D0A06;--surface:#1A1510;--surface2:#251E15;
  --radius:6px;
  font-family:'Crimson Text',Georgia,serif;color:var(--parchment);
}

.overlay::before{content:'';flex:1 0 0px}
.overlay::after{content:'';flex:1 0 0px}
@media(max-height:700px){
  .overlay{padding:1rem 1rem 4.5rem;gap:1rem}
  .overlay-choices h2{font-size:1.4rem}
  .overlay-choices .pick-sub{margin-bottom:0.8rem;font-size:0.9rem}
  .choice-btn{padding:1rem 1.2rem 1.2rem;min-width:180px}
  .choice-btn .choice-name{font-size:1rem}
  .choice-btn .choice-desc{font-size:0.75rem}
  .choices{gap:0.8rem}
  .overlay-confirm .picked-name{font-size:2rem}
  .overlay-confirm{gap:0.4rem}
}
@media(max-width:400px){
  .overlay{padding:0.8rem;gap:0.8rem}
  .choices{gap:0.6rem;padding:0 0.3rem}
  .choice-btn{min-width:0;padding:0.8rem 1rem 1rem}
}
.overlay *{pointer-events:auto}
.overlay h2,.overlay h3{font-family:'Cinzel',serif;letter-spacing:0.05em}
.overlay button{font-family:'Cinzel',serif;cursor:pointer;border:none;transition:all 0.2s ease}
.overlay .action-btn{position:relative;z-index:1;align-self:center;margin-left:auto;margin-right:auto;flex-shrink:0}
.overlay.hidden{display:none}

html:has(body > .overlay:not(.hidden)){overflow:hidden}

.overlay-spinner{background:rgba(13,10,6,0.97)}
.overlay-spinner .spin-text{font-family:'Cinzel',serif;font-size:2.5rem;color:var(--gold);animation:pulse 1s infinite}
.overlay-spinner .spin-sub{color:var(--parchment-dark);font-style:italic;font-size:1rem}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.3}}

.overlay-handoff{background:rgba(13,10,6,0.97)}
.overlay-handoff h2{color:var(--gold);font-size:1.4rem}
.overlay-handoff p{color:var(--parchment-dark);font-size:1.05rem;max-width:420px}
.overlay-handoff .seat-badge{
  font-size:3.5rem;color:var(--gold);font-family:'Cinzel',serif;font-weight:900;
  width:110px;height:110px;border-radius:50%;border:3px solid var(--gold);
  display:flex;align-items:center;justify-content:center;margin:0.5rem auto;
  box-shadow:0 0 40px rgba(201,168,76,0.25);
}

.overlay-choices{background:rgba(13,10,6,0.97)}
.overlay-choices h2{color:var(--gold);font-size:1.8rem;text-shadow:0 0 30px rgba(201,168,76,0.3)}
.overlay-choices .pick-sub{color:var(--parchment-dark);font-style:italic;font-size:1rem;margin-bottom:1.5rem;letter-spacing:0.02em}
.choices{display:flex;gap:1.2rem;justify-content:center;flex-wrap:wrap;padding:0 1rem;max-width:1000px}
.overlay .choice-btn{
  padding:1.4rem 1.6rem 1.6rem;min-width:220px;max-width:280px;border-radius:10px;
  color:var(--parchment);font-size:1.1rem;flex:1;
  border:2px solid rgba(201,168,76,0.15);
  background:linear-gradient(170deg, rgba(37,30,21,0.95) 0%, rgba(26,21,16,0.98) 100%);
  display:flex;flex-direction:column;align-items:center;gap:0.5rem;
  position:relative;overflow:hidden;
  box-shadow:0 4px 20px rgba(0,0,0,0.4);
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
}
.choice-btn::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg, transparent, var(--gold-dim), transparent);
  opacity:0.5;transition:opacity 0.3s;
}
.choice-btn::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 0%, rgba(201,168,76,0.06) 0%, transparent 70%);
  pointer-events:none;
}
.choice-btn .choice-name{
  font-family:'Cinzel',serif;font-size:1.15rem;font-weight:700;
  margin:0.3rem 0 0.1rem;letter-spacing:0.03em;
  text-shadow:0 2px 6px rgba(0,0,0,0.8);
  position:relative;z-index:1;
}
.choice-btn .choice-desc{
  font-family:'Crimson Text',Georgia,serif;font-size:0.8rem;color:var(--parchment-dark);
  line-height:1.5;text-align:center;font-style:italic;
  opacity:0.85;padding:0 0.2rem;
  position:relative;z-index:1;
}
.choice-btn .type-badge{
  font-size:0.6rem;font-family:'Cinzel',serif;
  padding:0.2rem 0.7rem;border-radius:10px;text-transform:uppercase;letter-spacing:0.12em;
  position:relative;z-index:1;
}
.choice-btn .type-badge.townsfolk{background:rgba(46,134,171,0.15);color:var(--townsfolk);border:1px solid rgba(46,134,171,0.3)}
.choice-btn .type-badge.outsider{background:rgba(78,205,196,0.15);color:var(--outsider);border:1px solid rgba(78,205,196,0.3)}
.choice-btn .type-badge.minion{background:rgba(232,93,93,0.15);color:var(--minion);border:1px solid rgba(232,93,93,0.3)}
.choice-btn .type-badge.demon{background:rgba(139,0,0,0.15);color:var(--demon);border:1px solid rgba(139,0,0,0.3)}
.choice-btn:hover{
  border-color:var(--gold);
  box-shadow:0 8px 40px rgba(201,168,76,0.2), 0 0 60px rgba(201,168,76,0.08);
  transform:translateY(-4px);
}
.choice-btn:hover::before{opacity:1}
.choice-btn:active{transform:translateY(-1px);box-shadow:0 4px 20px rgba(201,168,76,0.15)}
@keyframes cardReveal{
  0%{opacity:0;transform:translateY(30px) scale(0.95)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}
.choice-btn{animation:cardReveal 0.5s cubic-bezier(0.16,1,0.3,1) backwards}
.choice-btn:nth-child(1){animation-delay:0.1s}
.choice-btn:nth-child(2){animation-delay:0.25s}
.choice-btn:nth-child(3){animation-delay:0.4s}

@media(max-width:600px){
  .overlay{padding:1.2rem 1rem 3.5rem;gap:1rem}
  .overlay-choices h2{font-size:1.3rem}
  .overlay-choices .pick-sub{margin-bottom:0.4rem;font-size:0.85rem}
  .choices{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:0.7rem;width:100%;padding:0 0.4rem;max-width:440px}
  .overlay .choice-btn{flex:0 0 auto;width:100%;min-width:0;max-width:none;padding:0.7rem 0.9rem 0.8rem;gap:0.3rem}
  .choice-btn .choice-name{font-size:1.05rem;margin:0.05rem 0 0}
  .choice-btn .choice-desc{font-size:0.78rem;line-height:1.4}
  .choice-btn .token-bg{
    mask-image:linear-gradient(to bottom, rgba(0,0,0,0.32) 0%, rgba(0,0,0,0.13) 65%, transparent 100%);
    -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0.32) 0%, rgba(0,0,0,0.13) 65%, transparent 100%);
  }

  .choices .mulligan-wrap{margin-top:0.5rem!important}
  .choices .action-btn{padding:0.8rem 1.5rem}
}

@media(min-width:390px) and (max-width:600px){
  .overlay .choice-btn{min-height:min(calc((100vh - 340px)/3),230px);min-height:min(calc((100dvh - 340px)/3),230px);justify-content:center}
  .choice-btn .choice-name{font-size:1.12rem}
  .choice-btn .choice-desc{font-size:0.8rem}
  .choice-btn .token-bg{
    mask-image:linear-gradient(to bottom, rgba(0,0,0,0.38) 0%, rgba(0,0,0,0.16) 65%, transparent 100%);
    -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0.38) 0%, rgba(0,0,0,0.16) 65%, transparent 100%);
  }

  .choices:has(.mulligan-wrap) .choice-btn{min-height:min(calc((100vh - 430px)/3),230px);min-height:min(calc((100dvh - 430px)/3),230px)}
}

.overlay-confirm{background:rgba(13,10,6,0.97);transition:background 0.5s;gap:0.6rem}
.overlay-confirm.demon-reveal{background:radial-gradient(ellipse at 50% 45%, rgb(45,10,10) 0%, rgb(13,10,6) 60%)}
.overlay-confirm h2{color:var(--gold);font-size:1.3rem;letter-spacing:0.05em;margin:0}
.overlay-confirm .picked-name{font-size:2.4rem;color:var(--parchment);font-family:'Cinzel',serif;margin:0;text-shadow:0 2px 20px rgba(201,168,76,0.2)}
.demon-reveal .picked-name{animation:demonNameReveal 0.8s cubic-bezier(0.16,1,0.3,1) both;text-shadow:0 0 40px rgba(139,0,0,0.6),0 0 80px rgba(139,0,0,0.3)}
.demon-reveal h2{color:var(--demon)}
@keyframes demonNameReveal{
  0%{opacity:0;transform:scale(1.8);filter:blur(10px)}
  50%{opacity:1;filter:blur(2px)}
  100%{transform:scale(1);filter:blur(0)}
}
@keyframes demonPulse{
  0%,100%{text-shadow:0 0 30px rgba(139,0,0,0.5),0 0 60px rgba(139,0,0,0.2)}
  50%{text-shadow:0 0 50px rgba(139,0,0,0.8),0 0 100px rgba(139,0,0,0.4)}
}
.demon-reveal .picked-name{animation:demonNameReveal 0.8s cubic-bezier(0.16,1,0.3,1) both, demonPulse 2s ease-in-out 0.8s infinite}
.overlay-confirm .picked-type{font-size:0.85rem;color:var(--parchment-dark);text-transform:uppercase;letter-spacing:0.2em;font-family:'Cinzel',serif}
.overlay-confirm .confirm-note{color:var(--parchment-dark);font-style:italic;font-size:0.85rem;margin-top:0.5rem;max-width:350px;line-height:1.4}

.results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0.8rem;margin-top:1rem}
.result-card{background:var(--surface);border:1px solid var(--surface2);border-radius:var(--radius);padding:0.8rem;display:flex;align-items:center;gap:0.6rem;position:relative;overflow:hidden}
.result-card .seat{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Cinzel',serif;font-weight:700;font-size:0.85rem;flex-shrink:0;position:relative;z-index:1}
.result-card .seat.townsfolk{background:rgba(46,134,171,0.2);color:var(--townsfolk);border:1px solid var(--townsfolk)}
.result-card .seat.outsider{background:rgba(78,205,196,0.2);color:var(--outsider);border:1px solid var(--outsider)}
.result-card .seat.minion{background:rgba(232,93,93,0.2);color:var(--minion);border:1px solid var(--minion)}
.result-card .seat.demon{background:rgba(139,0,0,0.2);color:var(--demon);border:1px solid var(--demon)}
.result-token-bg{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:120%;height:120%;
  background-image:var(--result-token);
  background-size:contain;background-position:center;background-repeat:no-repeat;
  opacity:0.1;pointer-events:none;
}
.result-card:hover .result-token-bg{opacity:0.22;transition:opacity 0.3s ease}
.result-card .info{position:relative;z-index:1;min-width:0;overflow-wrap:anywhere}
.result-card .info .name{color:var(--parchment);font-size:0.95rem}
.result-card .info .meta{color:var(--parchment-dark);font-size:0.75rem;font-style:italic}
.result-card .info .secret{color:var(--blood-light);font-size:0.7rem;font-family:'Cinzel',serif;margin-top:0.15rem}
.sbg-draft-wrapper .redraft-btn,.overlay .redraft-btn{flex-shrink:0;width:36px;height:36px;min-width:36px;min-height:36px;border-radius:50%;background:var(--surface2);color:var(--parchment-dark);font-size:1.15rem;display:flex;align-items:center;justify-content:center;border:1px solid transparent;opacity:0.4;transition:all 0.2s;padding:0;box-sizing:border-box}
.redraft-btn:hover{opacity:1;border-color:var(--gold);color:var(--gold);background:var(--surface)}

.bluffs-box{background:var(--surface);border:1px solid var(--surface2);border-radius:var(--radius);padding:1.2rem;margin-top:1.5rem}
.bluffs-box h3{color:var(--blood-light);margin-bottom:0.8rem}
.bluffs-box .bluffs-sub{margin:-0.5rem 0 0.9rem;font-size:0.85rem;color:var(--parchment-dark);font-style:italic}
.bluff-list{display:flex;gap:0.8rem;flex-wrap:wrap}
.bluff-chip{padding:0.4rem 0.8rem;background:rgba(139,0,0,0.15);border:1px solid var(--blood);border-radius:var(--radius);color:var(--parchment);font-size:0.9rem}

.sbg-draft-wrapper .restart-btn,.overlay .restart-btn{display:block;margin:2rem auto 0;padding:0.6rem 2rem;background:var(--surface2);color:var(--gold);border-radius:var(--radius);border:1px solid var(--gold-dim);font-size:1rem}
.restart-btn:hover{background:var(--surface);border-color:var(--gold)}

.char-chip .chip-token{
  width:24px;height:24px;border-radius:50%;object-fit:cover;flex-shrink:0;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,0.5));
  transition:transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
}
.char-chip:hover .chip-token{transform:scale(1.15)}
.char-chip.selected .chip-token{
  filter:drop-shadow(0 0 6px rgba(201,168,76,0.5)) drop-shadow(0 1px 3px rgba(0,0,0,0.5));
}
.char-chip .chip-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.choice-btn{--token-bg:none}
.choice-btn .token-bg{
  position:absolute;inset:0;
  background-image:var(--token-bg);
  background-size:140%;background-position:center 20%;background-repeat:no-repeat;
  opacity:0;
  animation:tokenBgReveal 0.8s cubic-bezier(0.16,1,0.3,1) forwards;
  pointer-events:none;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.08) 60%, transparent 100%);
  -webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.08) 60%, transparent 100%);
}
.choice-btn:nth-child(1) .token-bg{animation-delay:0.1s}
.choice-btn:nth-child(2) .token-bg{animation-delay:0.25s}
.choice-btn:nth-child(3) .token-bg{animation-delay:0.4s}
.choice-btn:hover .token-bg{
  opacity:0.35;
  transition:opacity 0.3s ease;
}

@keyframes tokenBgReveal{
  0%{opacity:0;background-size:200%;filter:blur(8px)}
  60%{filter:blur(2px)}
  100%{opacity:1;background-size:140%;filter:blur(0px)}
}

#confirmTokenWrap{
  position:relative;z-index:1;
  width:min(240px,30vh);height:min(240px,30vh);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
#confirmTokenWrap::before{content:none}
#confirmTokenWrap::after{
  content:'';position:absolute;inset:-40px;border-radius:50%;
  background:radial-gradient(circle,rgba(201,168,76,0.12) 0%,rgba(201,168,76,0.04) 40%,transparent 70%);
  animation:glowReveal 1.2s cubic-bezier(0.16,1,0.3,1) 0.2s both;
  pointer-events:none;
}
.demon-reveal #confirmTokenWrap::after{
  background:radial-gradient(circle,rgba(139,0,0,0.18) 0%,rgba(139,0,0,0.06) 40%,transparent 70%);
}
.confirm-token{
  width:100%;height:100%;border-radius:50%;object-fit:cover;
  animation:confirmTokenReveal 0.9s cubic-bezier(0.16,1,0.3,1) both;
  filter:drop-shadow(0 0 35px rgba(201,168,76,0.35)) drop-shadow(0 8px 30px rgba(0,0,0,0.7));
}
.confirm-token.loaded{
  animation:confirmTokenReveal 0.9s cubic-bezier(0.16,1,0.3,1) both, tokenFloat 3s ease-in-out 1.2s infinite;
}
.demon-reveal .confirm-token{
  filter:drop-shadow(0 0 40px rgba(139,0,0,0.6)) drop-shadow(0 0 80px rgba(139,0,0,0.3)) drop-shadow(0 8px 30px rgba(0,0,0,0.7));
  animation:confirmTokenReveal 0.9s cubic-bezier(0.16,1,0.3,1) both, confirmTokenPulse 2.5s ease-in-out 1s infinite;
}

@keyframes confirmTokenReveal{
  0%{opacity:0;transform:rotateY(540deg) scale(0.1)}
  40%{opacity:1;transform:rotateY(180deg) scale(0.6)}
  70%{transform:rotateY(30deg) scale(1.05)}
  100%{opacity:1;transform:rotateY(0deg) scale(1)}
}
@keyframes tokenFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}
@keyframes confirmTokenPulse{
  0%,100%{filter:drop-shadow(0 0 40px rgba(139,0,0,0.5)) drop-shadow(0 0 80px rgba(139,0,0,0.2)) drop-shadow(0 8px 30px rgba(0,0,0,0.7))}
  50%{filter:drop-shadow(0 0 60px rgba(139,0,0,0.8)) drop-shadow(0 0 120px rgba(139,0,0,0.4)) drop-shadow(0 8px 30px rgba(0,0,0,0.7));transform:translateY(-6px)}
}
@keyframes ringReveal{
  0%{opacity:0;transform:scale(0.5);border-width:8px}
  60%{border-width:3px}
  100%{opacity:1;transform:scale(1);border-width:2px}
}
@keyframes ringPulse{
  0%,100%{box-shadow:0 0 50px rgba(139,0,0,0.25),inset 0 0 50px rgba(139,0,0,0.12);border-color:rgba(139,0,0,0.4)}
  50%{box-shadow:0 0 80px rgba(139,0,0,0.4),inset 0 0 80px rgba(139,0,0,0.2);border-color:rgba(139,0,0,0.6)}
}
@keyframes glowReveal{
  0%{opacity:0;transform:scale(0.3)}
  100%{opacity:1;transform:scale(1)}
}

.gwb-banner{max-width:720px;margin:0.6rem auto 0;padding:0.5rem 0.9rem;border-radius:var(--radius);font-size:0.8rem;line-height:1.5;text-align:center;border:1px solid rgba(255,255,255,0.22);background:rgba(24,12,32,0.55);color:#e9dfc8}
.gwb-banner a{color:var(--gold)}
.gwb-banner.gwb-outdated{border-color:#c0392b;background:rgba(139,0,0,0.6);color:#fff}
.gwb-banner.gwb-outdated strong{color:#ffb3a7}
.gwb-banner .gwb-pin{margin-top:0.3rem;font-size:0.72rem;opacity:0.8}
html.clocktower .sbg-draft-wrapper header .gwb-banner,html.clocktower .sbg-draft-wrapper header .gwb-banner .gwb-pin{color:#e9dfc8 !important}
html.clocktower .sbg-draft-wrapper header .gwb-banner.gwb-outdated,html.clocktower .sbg-draft-wrapper header .gwb-banner.gwb-outdated .gwb-pin{color:#fff !important}
html.clocktower .sbg-draft-wrapper header .gwb-banner.gwb-outdated strong{color:#ffb3a7 !important}