:root {
  --bg: #090914;
  --bg-2: #11101e;
  --panel: #12111f;
  --panel-2: #19172a;
  --panel-3: #22172a;
  --line: rgba(255,255,255,.10);
  --line-warm: rgba(255,152,122,.26);
  --text: #fffaf7;
  --muted: #b8b1c2;
  --accent: #ff3f72;
  --accent-2: #ff735f;
  --accent-3: #ffb15a;
  --rose: #ff8ca7;
  --good: #54d9a0;
  --danger: #ff7a84;
  --shadow: 0 22px 70px rgba(0,0,0,.42);
  --shadow-warm: 0 14px 38px rgba(255,63,114,.18);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { background: var(--bg); scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  background:
    radial-gradient(circle at 8% 2%, rgba(255,94,101,.18), transparent 24rem),
    radial-gradient(circle at 92% 8%, rgba(255,173,83,.12), transparent 24rem),
    radial-gradient(circle at 62% 48%, rgba(111,61,149,.08), transparent 35rem),
    linear-gradient(180deg, #090914 0%, #0b0a13 48%, #080810 100%);
  background-attachment: fixed;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image:
    radial-gradient(circle at 15% 20%, rgba(255,185,105,.24) 0 1px, transparent 2px),
    radial-gradient(circle at 82% 13%, rgba(255,94,101,.18) 0 1px, transparent 2px);
  background-size: 88px 88px, 126px 126px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.8), transparent 70%);
}

button, input, select { font: inherit; }
button { cursor: pointer; }
code, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, .brand-name, .hero-wordmark { font-family: Georgia, "Times New Roman", serif; }
h1 { margin-bottom: 0; font-size: clamp(2.5rem, 7vw, 5.7rem); line-height: .96; letter-spacing: -.05em; }
h2 { margin-bottom: .3rem; font-size: clamp(1.55rem, 3vw, 2.25rem); line-height: 1.05; }
h3 { margin-bottom: .45rem; font-size: 1.12rem; }
h4 { margin-bottom: .35rem; }

.topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem clamp(1rem, 4vw, 3rem);
  border-bottom: 1px solid rgba(255,255,255,.06);
  background: rgba(9,9,20,.80);
  backdrop-filter: blur(20px) saturate(140%);
}
.brand-button {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  border: 0;
  padding: 0;
  color: var(--text);
  background: transparent;
  text-align: left;
}
.brand-icon { width: 42px; height: 42px; border-radius: 12px; box-shadow: 0 8px 24px rgba(255,80,112,.16); }
.brand-button > span { display: grid; }
.brand-name { font-size: 1.45rem; line-height: 1; }
.brand-tagline { margin-top: .15rem; font-size: .65rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--rose); }
.top-actions { display: flex; gap: .55rem; }

.shell { width: min(1180px, calc(100% - 2rem)); margin: 1.5rem auto 4rem; }
.panel, .game-view, .home-view { animation: fadeIn .24s ease; }
.hidden { display: none !important; }

.eyebrow { color: var(--muted); font-size: .7rem; letter-spacing: .18em; font-weight: 900; }
.eyebrow.warm { color: #ffad8d; }
.muted { color: var(--muted); }
.tiny { font-size: .82rem; }
.card-kicker { margin-bottom: .4rem; color: #ff9e7b; font-size: .68rem; font-weight: 900; letter-spacing: .16em; }

.home-view { display: grid; gap: 1rem; }
.hero-card {
  min-height: 620px;
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  align-items: stretch;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line-warm);
  border-radius: 32px;
  background:
    linear-gradient(90deg, rgba(11,10,20,.98) 0%, rgba(11,10,20,.92) 48%, rgba(14,11,18,.58) 100%),
    radial-gradient(circle at 78% 44%, rgba(255,88,93,.20), transparent 28rem),
    #0d0c18;
  box-shadow: var(--shadow);
}
.hero-card::after {
  content: "";
  position: absolute;
  right: -4rem;
  bottom: -5rem;
  width: 36rem;
  height: 20rem;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(255,142,88,.18), rgba(255,63,114,.05) 46%, transparent 72%);
  filter: blur(8px);
  pointer-events: none;
}
.hero-glow { position: absolute; border-radius: 50%; filter: blur(12px); opacity: .7; pointer-events: none; }
.hero-glow-one { width: 230px; height: 230px; right: 15%; top: 14%; background: radial-gradient(circle, rgba(255,180,92,.22), transparent 68%); }
.hero-glow-two { width: 340px; height: 260px; right: -3%; bottom: 5%; background: radial-gradient(circle, rgba(255,63,114,.16), transparent 70%); }
.hero-copy { padding: clamp(2rem, 6vw, 5.5rem); align-self: center; position: relative; z-index: 2; }
.hero-copy h1 { margin-top: .8rem; max-width: 780px; }
.hero-lead { max-width: 700px; margin: 1.3rem 0 0; color: #d6ced8; font-size: clamp(1rem, 2vw, 1.18rem); line-height: 1.7; }
.hero-actions { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 2rem; }
.hero-cta { min-width: 230px; }
.play-triangle { font-size: .82em; margin-right: .2rem; }
.feature-row { display: flex; flex-wrap: wrap; gap: .65rem 1.2rem; margin-top: 2rem; color: #d4cbd7; font-size: .86rem; }
.feature-row span { display: inline-flex; align-items: center; gap: .35rem; }
.hero-art { display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; z-index: 2; padding: 2rem; }
.hero-art img { width: min(72%, 330px); border-radius: 30%; box-shadow: 0 24px 65px rgba(0,0,0,.42), 0 0 45px rgba(255,87,105,.12); }
.hero-wordmark { margin-top: 1.1rem; font-size: clamp(2.1rem, 4vw, 3.7rem); line-height: 1; }
.hero-script { margin-top: .8rem; color: #ff9d89; font-family: Georgia, "Times New Roman", serif; font-style: italic; font-size: 1.05rem; letter-spacing: .02em; }
.home-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.home-card {
  min-height: 190px;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 1.25rem;
  background: linear-gradient(180deg, rgba(255,255,255,.025), transparent), var(--panel);
  box-shadow: 0 16px 42px rgba(0,0,0,.22);
}
.home-card-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; margin-bottom: .9rem; color: #ffb486; background: linear-gradient(135deg, rgba(255,63,114,.15), rgba(255,177,90,.09)); border: 1px solid rgba(255,134,100,.22); font-size: 1.25rem; }
.home-card p { margin-bottom: 0; color: var(--muted); line-height: 1.6; }

.setup-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; padding-bottom: 7rem; }
.span-2 { grid-column: span 2; }
.setup-titlebar { padding: .6rem .3rem .25rem; }
.setup-intro { margin: .45rem 0 0; }
.card, .play-card, .session-strip, .game-meta {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.025), transparent), rgba(18,17,31,.96);
  border-radius: 24px;
  box-shadow: var(--shadow);
}
.card { padding: 1.2rem; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.section-head.compact { margin-bottom: .8rem; }
.row { display: flex; align-items: center; }
.gap-sm { gap: .6rem; flex-wrap: wrap; }
.stack { display: grid; gap: .7rem; margin: 1rem 0; }
.player-row { display: grid; grid-template-columns: 92px minmax(0,1fr) 130px 42px; gap: .6rem; align-items: center; }
.player-role { font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 900; color: var(--rose); }

input, select {
  width: 100%;
  color: var(--text);
  background: rgba(8,8,15,.76);
  border: 1px solid var(--line);
  border-radius: 13px;
  padding: .82rem .9rem;
  outline: none;
}
input:focus, select:focus { border-color: rgba(255,80,112,.72); box-shadow: 0 0 0 3px rgba(255,63,114,.10); }
input[type="range"] { padding: 0; accent-color: var(--accent); }
input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--accent); flex: 0 0 auto; }

.btn {
  border: 1px solid transparent;
  border-radius: 13px;
  padding: .78rem 1rem;
  font-weight: 850;
  color: var(--text);
  background: #242131;
  transition: transform .08s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn.primary { background: linear-gradient(135deg, #ff3268 0%, #ff4e73 52%, #ff7661 100%); box-shadow: var(--shadow-warm); }
.btn.primary:hover { box-shadow: 0 16px 42px rgba(255,63,114,.25); }
.btn.accent { background: linear-gradient(135deg, rgba(255,62,111,.95), rgba(255,113,91,.92)); box-shadow: var(--shadow-warm); }
.btn.ghost { background: transparent; border-color: var(--line); }
.btn.glass { background: rgba(255,255,255,.055); border-color: rgba(255,255,255,.12); backdrop-filter: blur(10px); }
.btn.choice { min-height: 58px; background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01)), var(--panel-2); border-color: var(--line); }
.btn.choice:hover { border-color: rgba(255,92,117,.58); background: #211829; }
.btn.xl { padding: 1rem 1.5rem; font-size: 1.05rem; min-width: 205px; }
.btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.icon-btn { width: 42px; height: 42px; padding: 0; }
.danger-text { color: var(--danger); }

.badge, .type-pill, .level-pill {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  width: fit-content;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .42rem .72rem;
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .04em;
  background: rgba(24,21,33,.95);
}
.mode-actions { display: flex; gap: .6rem; flex-wrap: wrap; justify-content: flex-end; }
.pair-matrix { display: grid; gap: .55rem; margin-top: .85rem; }
.pair-row { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .8rem .85rem; border-radius: 15px; background: rgba(8,8,15,.64); border: 1px solid var(--line); }
.pair-names { font-weight: 800; }
.pair-control { display: flex; align-items: center; gap: .7rem; }
.pair-control small { text-align: right; }
.source-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.source-box { border: 1px solid var(--line); border-radius: 18px; padding: 1rem; background: rgba(8,8,15,.56); }
.url-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .6rem; }
.schema-help { margin-top: .9rem; border-top: 1px solid var(--line); padding-top: .85rem; }
.schema-help summary { cursor: pointer; font-weight: 800; }
.schema-help pre { overflow: auto; padding: 1rem; border-radius: 14px; background: #07070d; color: #e6dfeb; }
.field-label { display: block; margin: .8rem 0 .35rem; color: var(--muted); font-size: .84rem; font-weight: 700; }
.range-labels { display: flex; justify-content: space-between; gap: .8rem; color: var(--muted); font-size: .78rem; margin-top: .35rem; }
.pace-grid { display: grid; gap: .65rem; margin-top: 1rem; }
.pace-card {
  width: 100%; text-align: left; display: grid; gap: .18rem; padding: .9rem 1rem;
  border-radius: 16px; border: 1px solid var(--line); background: rgba(8,8,15,.52);
  color: var(--text); cursor: pointer; transition: .18s ease;
}
.pace-card strong { font-size: .98rem; }
.pace-card small { color: var(--muted); line-height: 1.4; }
.pace-card:hover { border-color: rgba(255,126,105,.42); transform: translateY(-1px); }
.pace-card.selected { border-color: rgba(255,84,105,.72); background: linear-gradient(135deg, rgba(255,63,114,.14), rgba(255,172,85,.08)); box-shadow: 0 0 24px rgba(255,63,114,.08); }
.pace-note { margin-top: .75rem; }
.journey-copy { margin-top: .28rem; color: #e7dce6; font-weight: 800; letter-spacing: .01em; }

.switch-row { display: flex; gap: .75rem; align-items: flex-start; margin-top: .9rem; }
.switch-row span { display: grid; gap: .15rem; }
.switch-row small { color: var(--muted); }
.consent-switch { padding: .8rem; border: 1px solid rgba(255,104,115,.16); background: rgba(255,63,114,.05); border-radius: 14px; }
.file-btn { display: inline-flex; }

.launch-dock {
  position: sticky;
  bottom: 1rem;
  z-index: 15;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(255,126,105,.26);
  border-radius: 20px;
  background: rgba(14,12,23,.90);
  box-shadow: 0 18px 50px rgba(0,0,0,.38), 0 0 40px rgba(255,63,114,.08);
  backdrop-filter: blur(18px);
}
.status.error { color: var(--danger); }
.status.ok { color: var(--good); }
.launch-btn { flex: 0 0 auto; }

.game-view { display: grid; gap: 1rem; }
.game-meta { padding: .95rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.meta-right { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; justify-content: flex-end; }
.heat-track { display: flex; gap: .35rem; margin-top: .35rem; }
.heat-dot { width: 36px; height: 8px; border-radius: 999px; background: #2b2635; }
.heat-dot.on { background: linear-gradient(90deg, var(--accent), var(--accent-3)); box-shadow: 0 0 16px rgba(255,84,105,.18); }
.play-card {
  min-height: 430px;
  padding: clamp(1.4rem, 5vw, 3.4rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 90% 16%, rgba(255,162,89,.13), transparent 18rem),
    radial-gradient(circle at 82% 88%, rgba(255,63,114,.15), transparent 24rem),
    linear-gradient(140deg, #13111f, #17101d 62%, #24101c);
  border-color: rgba(255,126,105,.22);
}
.play-card::before {
  content: "♡";
  position: absolute;
  right: clamp(1.2rem, 5vw, 3rem);
  top: clamp(1.2rem, 5vw, 2.5rem);
  color: rgba(255,177,90,.46);
  font-size: clamp(2.5rem, 8vw, 5rem);
  font-family: Georgia, serif;
}
.card-topline { display: flex; gap: .5rem; margin-bottom: 1.5rem; }
.type-pill { color: #fff; background: rgba(255,63,114,.13); border-color: rgba(255,63,114,.36); }
.level-pill { color: #ffd5c1; background: rgba(255,172,85,.08); border-color: rgba(255,172,85,.24); }
.actor-label { color: var(--rose); font-size: clamp(1rem, 3vw, 1.35rem); font-weight: 900; }
.target-label { margin-top: .25rem; color: var(--muted); font-weight: 700; }
.prompt-text { margin: 1.1rem 0 0; max-width: 920px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.8rem, 5vw, 3.65rem); line-height: 1.08; letter-spacing: -.035em; font-weight: 700; }
.choice-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; }
.action-grid { display: grid; grid-template-columns: 1fr 1.35fr; gap: .7rem; }
.consent-note { text-align: center; color: var(--muted); font-size: .82rem; margin: 0; }
.session-strip { display: grid; grid-template-columns: repeat(4, 1fr) auto; gap: .8rem; align-items: center; padding: .9rem 1rem; }
.session-strip > div { display: grid; gap: .15rem; }
.session-strip strong { font-size: 1.2rem; }

dialog { border: 0; padding: 0; background: transparent; color: var(--text); }
dialog::backdrop { background: rgba(0,0,0,.72); backdrop-filter: blur(6px); }
.dialog-card { width: min(480px, calc(100vw - 2rem)); background: linear-gradient(180deg, #171423, #0f0e19); border: 1px solid rgba(255,127,106,.18); border-radius: 22px; padding: 1.3rem; box-shadow: var(--shadow); }
.dialog-card p { line-height: 1.65; color: #d7cfda; }
.dialog-card .btn { width: 100%; margin-top: .7rem; }


.skip-dialog-card { width: min(560px, calc(100vw - 2rem)); }
.skip-choice-stack { display: grid; gap: .65rem; margin-top: 1rem; }
.skip-choice-stack .btn { width: 100%; margin-top: 0; }
.btn.subtle { opacity: .78; }

@keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }

@media (max-width: 900px) {
  .hero-card { grid-template-columns: 1fr; min-height: auto; }
  .hero-copy { padding-bottom: 1.5rem; }
  .hero-art { padding-top: 0; padding-bottom: 2.3rem; }
  .hero-art img { width: min(46vw, 240px); }
  .home-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .shell { width: min(100% - 1rem, 1180px); margin-top: .7rem; }
  .setup-grid { grid-template-columns: 1fr; padding-bottom: 8rem; }
  .span-2 { grid-column: span 1; }
  .source-grid { grid-template-columns: 1fr; }
  .source-box.span-2 { grid-column: span 1; }
  .url-row { grid-template-columns: 1fr; }
  .player-row { grid-template-columns: 78px minmax(0,1fr) 105px 42px; }
  .section-head, .game-meta { align-items: stretch; flex-direction: column; }
  .topbar { padding: .75rem .8rem; }
  .top-actions .btn { padding: .68rem .8rem; }
  .brand-tagline { display: none; }
  .choice-row { grid-template-columns: 1fr; }
  .action-grid { grid-template-columns: 1fr; }
  .session-strip { grid-template-columns: repeat(2, 1fr); }
  .session-strip .btn { grid-column: span 2; }
  .meta-right { justify-content: flex-start; }
  .play-card { min-height: 360px; }
  .launch-dock { flex-direction: column; align-items: stretch; bottom: .5rem; }
  .launch-btn { width: 100%; }
  .mode-actions { justify-content: stretch; }
  .mode-actions .btn { flex: 1 1 180px; }
  .hero-card { border-radius: 24px; }
  .hero-copy { padding: 2rem 1.35rem 1.2rem; }
  .hero-copy h1 { font-size: clamp(2.7rem, 14vw, 4.2rem); }
  .hero-actions .btn { width: 100%; }
  .feature-row { display: grid; }
}

/* ===== Live game theatre ===== */
.room-heat {
  min-width: 210px;
  display: grid;
  gap: .45rem;
  padding: .72rem .9rem;
  border: 1px solid rgba(255,126,105,.18);
  border-radius: 17px;
  background: linear-gradient(135deg, rgba(255,63,114,.07), rgba(255,177,90,.04));
}
.room-heat-copy { display:flex; align-items:baseline; gap:.32rem; }
.room-heat-copy span { margin-right:auto; color:#ffad8d; font-size:.66rem; letter-spacing:.14em; font-weight:900; }
.room-heat-copy strong { font-size:1.25rem; line-height:1; }
.room-heat-copy small { color:var(--muted); }
.room-heat-track { height:8px; overflow:hidden; border-radius:999px; background:#2a2330; box-shadow:inset 0 0 0 1px rgba(255,255,255,.04); }
.room-heat-track span { display:block; width:0%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#ffb15a,#ff6f64 48%,#ff3f72 75%,#c65cff); box-shadow:0 0 18px rgba(255,63,114,.36); transition:width .8s cubic-bezier(.2,.8,.2,1); }

.wheel-card {
  display:grid;
  grid-template-columns:minmax(220px,.7fr) minmax(280px,1.3fr);
  gap:1rem;
  align-items:center;
  padding:1rem 1.2rem;
  border:1px solid rgba(255,126,105,.18);
  border-radius:24px;
  background:
    radial-gradient(circle at 78% 50%, rgba(255,78,107,.12), transparent 20rem),
    linear-gradient(145deg, rgba(20,17,31,.98), rgba(12,11,20,.98));
  box-shadow:var(--shadow);
  overflow:hidden;
}
.wheel-copy h3 { margin:.25rem 0 .4rem; font-size:clamp(1.15rem,3vw,1.75rem); }
.wheel-stage { position:relative; width:min(100%,390px); aspect-ratio:1; margin-inline:auto; display:grid; place-items:center; filter:drop-shadow(0 18px 30px rgba(0,0,0,.36)); }
#playerWheel { width:100%; height:100%; border-radius:50%; transition:filter .2s ease; }
.wheel-stage.spinning #playerWheel { filter:saturate(1.18) brightness(1.08); }
.wheel-stage.spinning { animation:wheelGlow 1s ease-in-out infinite alternate; }
.wheel-pointer { position:absolute; z-index:4; top:-2px; left:50%; transform:translateX(-50%); color:#ffd0a5; font-size:1.7rem; text-shadow:0 0 18px rgba(255,177,90,.8); }
.wheel-hub { position:absolute; z-index:3; width:24%; aspect-ratio:1; display:grid; place-items:center; border-radius:50%; background:radial-gradient(circle at 35% 30%,#33213a,#14111e 70%); border:4px solid rgba(255,255,255,.12); box-shadow:0 8px 28px rgba(0,0,0,.45),0 0 30px rgba(255,63,114,.18); }
.wheel-hub span { font-family:Georgia,serif; font-size:clamp(1.4rem,4vw,2.4rem); color:#ffb15a; }
@keyframes wheelGlow { from{filter:drop-shadow(0 18px 30px rgba(0,0,0,.36));} to{filter:drop-shadow(0 18px 38px rgba(255,63,114,.22));} }

.live-dashboard { display:grid; grid-template-columns:1.1fr .9fr; gap:1rem; }
.dashboard-card { border:1px solid var(--line); border-radius:22px; padding:1rem; background:linear-gradient(180deg,rgba(255,255,255,.025),transparent),rgba(18,17,31,.96); box-shadow:var(--shadow); }
.dashboard-head { display:flex; justify-content:space-between; align-items:flex-start; gap:.7rem; margin-bottom:.8rem; }
.dashboard-head h3 { margin-top:.18rem; margin-bottom:0; }
.btn.mini { padding:.48rem .7rem; font-size:.74rem; }
.micro { font-size:.72rem; }
.dashboard-note { margin:.75rem 0 0; line-height:1.45; }
.player-heatboard { display:grid; gap:.65rem; }
.heat-player { display:grid; grid-template-columns:minmax(90px,.9fr) minmax(100px,1.3fr) auto; gap:.75rem; align-items:center; padding:.72rem .78rem; border:1px solid rgba(255,255,255,.07); border-radius:15px; background:rgba(8,8,15,.48); }
.heat-player.active { border-color:rgba(255,103,110,.34); background:linear-gradient(90deg,rgba(255,63,114,.08),rgba(8,8,15,.5)); }
.heat-name { display:grid; gap:.12rem; min-width:0; }
.heat-name strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.heat-name small { color:var(--muted); font-size:.72rem; }
.heat-meter { height:9px; border-radius:999px; overflow:hidden; background:#292431; }
.heat-meter span { display:block; height:100%; width:0%; border-radius:inherit; background:linear-gradient(90deg,#ffb15a,#ff6a62,#ff3f72,#c65cff); transition:width .7s cubic-bezier(.2,.8,.2,1); }
.heat-score { min-width:50px; text-align:right; font-weight:950; font-size:1.1rem; }
.heat-score small { font-size:.65rem; color:var(--muted); font-weight:700; }

.session-history { display:grid; gap:.55rem; max-height:250px; overflow:auto; padding-right:.15rem; }
.history-card.expanded .session-history { max-height:520px; }
.history-empty { color:var(--muted); font-size:.82rem; padding:.65rem 0; }
.history-item { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.65rem; align-items:start; padding:.68rem .7rem; border-radius:14px; border:1px solid rgba(255,255,255,.06); background:rgba(8,8,15,.46); }
.history-icon { width:30px; height:30px; display:grid; place-items:center; border-radius:10px; background:rgba(255,255,255,.05); }
.history-item.complete .history-icon { color:var(--good); background:rgba(84,217,160,.08); }
.history-item.shy .history-icon { color:#ffc268; background:rgba(255,194,104,.08); }
.history-item.boundary .history-icon { color:#b8b1c2; }
.history-main { min-width:0; }
.history-main strong { display:block; font-size:.84rem; }
.history-main p { margin:.18rem 0 0; color:var(--muted); font-size:.73rem; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.history-meta { color:var(--muted); font-size:.68rem; white-space:nowrap; }

.play-card.reveal-pop { animation:cardPop .38s cubic-bezier(.2,.9,.2,1); }
.play-card.spike-moment { border-color:rgba(255,177,90,.48); box-shadow:0 22px 70px rgba(0,0,0,.42),0 0 40px rgba(255,96,87,.16); }
.play-card.spike-moment::after { content:"SURPRISE HEAT"; position:absolute; left:1.2rem; bottom:1rem; font-size:.62rem; font-weight:950; letter-spacing:.16em; color:#ffc092; opacity:.85; }
@keyframes cardPop { from{transform:translateY(12px) scale(.985);opacity:.3} to{transform:none;opacity:1} }

.spark-burst { position:fixed; inset:0; z-index:90; pointer-events:none; overflow:hidden; }
.spark { position:absolute; width:8px; height:8px; border-radius:50%; background:linear-gradient(135deg,#ffb15a,#ff3f72); animation:sparkFly 850ms ease-out forwards; box-shadow:0 0 14px rgba(255,83,111,.42); }
@keyframes sparkFly { 0%{transform:translate(0,0) scale(.6);opacity:0} 15%{opacity:1} 100%{transform:translate(var(--dx),var(--dy)) scale(0);opacity:0} }

.turn-timer { margin-top:.55rem; color:var(--muted); font-size:.78rem; font-weight:800; letter-spacing:.04em; }

@media (max-width: 900px) {
  .wheel-card { grid-template-columns:1fr; }
  .wheel-copy { text-align:center; }
  .live-dashboard { grid-template-columns:1fr; }
}
@media (max-width: 760px) {
  .room-heat { min-width:0; width:100%; }
  .heat-player { grid-template-columns:minmax(86px,1fr) minmax(90px,1.3fr) auto; }
  .wheel-stage { width:min(92vw,330px); }
}

/* Multi-game surprise system */
.choice-row { grid-template-columns: repeat(4, minmax(0,1fr)); }
.choice.mini-game-choice { border-color:rgba(198,92,255,.34); background:linear-gradient(180deg,rgba(198,92,255,.10),rgba(255,255,255,.02)); }
.choice.surprise-choice { border-color:rgba(255,177,90,.38); background:linear-gradient(180deg,rgba(255,177,90,.10),rgba(255,63,114,.04)); }
.mode-roulette { position:relative; overflow:hidden; border:1px solid rgba(255,137,105,.24); border-radius:20px; padding:.9rem 1rem; background:radial-gradient(circle at 50% 0%,rgba(255,93,122,.16),transparent 70%),rgba(16,14,25,.96); box-shadow:0 15px 38px rgba(0,0,0,.28); text-align:center; }
.mode-roulette-kicker { color:#ffb15a; font-size:.65rem; font-weight:950; letter-spacing:.18em; }
.mode-roulette-name { margin:.25rem 0 .5rem; font-size:clamp(1.25rem,4vw,2rem); font-weight:950; letter-spacing:.02em; background:linear-gradient(90deg,#ffb15a,#ff5f72,#c65cff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.mode-roulette-track { display:flex; justify-content:center; gap:.42rem; }
.mode-roulette-track span { width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.16); animation:modeDot 700ms ease-in-out infinite alternate; }
.mode-roulette-track span:nth-child(2){animation-delay:90ms}.mode-roulette-track span:nth-child(3){animation-delay:180ms}.mode-roulette-track span:nth-child(4){animation-delay:270ms}.mode-roulette-track span:nth-child(5){animation-delay:360ms}
.mode-roulette.rolling { animation:roulettePulse 520ms ease-in-out infinite alternate; }
.mode-roulette.landed { border-color:rgba(255,177,90,.5); box-shadow:0 0 40px rgba(255,93,122,.13),0 15px 38px rgba(0,0,0,.28); }
@keyframes modeDot { from{transform:translateY(0) scale(.75);opacity:.35} to{transform:translateY(-4px) scale(1.15);opacity:1} }
@keyframes roulettePulse { from{transform:scale(.992);filter:saturate(.92)} to{transform:scale(1.006);filter:saturate(1.18)} }
.game-mode-cloud { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:.8rem; }
.game-mode-cloud span { padding:.58rem .72rem; border-radius:999px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.035); color:#e9e4ef; font-size:.78rem; font-weight:800; }
.game-mix-card { background:radial-gradient(circle at 85% 20%,rgba(198,92,255,.10),transparent 18rem),rgba(18,17,31,.96); }
.type-pill.mode-wyr,.type-pill.mode-hotseat,.type-pill.mode-rapidfire,.type-pill.mode-guess,.type-pill.mode-chemistry,.type-pill.mode-compliment,.type-pill.mode-double,.type-pill.mode-everyone,.type-pill.mode-choicechain,.type-pill.mode-timed { color:#fff; background:linear-gradient(135deg,rgba(198,92,255,.22),rgba(255,63,114,.16)); border-color:rgba(198,92,255,.42); }
@media (max-width:760px){ .choice-row{grid-template-columns:repeat(2,1fr)} }

/* ===== Consent rule engine ===== */
.consent-rules-card {
  background:
    radial-gradient(circle at 92% 8%, rgba(255,177,90,.10), transparent 16rem),
    rgba(18,17,31,.96);
}
.rules-summary { display:flex; flex-wrap:wrap; gap:.45rem; margin:.8rem 0 1rem; }
.rule-summary-chip {
  display:inline-flex; align-items:center; min-height:30px; padding:.42rem .68rem;
  border-radius:999px; border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.035); color:#eee7f2; font-size:.73rem; font-weight:800;
}
.rules-dialog { width:min(1040px,96vw); max-width:none; padding:0; border:0; background:transparent; }
.rules-dialog::backdrop { background:rgba(4,3,8,.82); backdrop-filter:blur(8px); }
.rules-dialog-card {
  width:100%; max-height:92vh; overflow:hidden; display:grid; grid-template-rows:auto auto minmax(0,1fr) auto;
  padding:1.15rem; border:1px solid rgba(255,122,101,.22); border-radius:26px;
  background:
    radial-gradient(circle at 88% 0%, rgba(198,92,255,.11), transparent 24rem),
    radial-gradient(circle at 12% 0%, rgba(255,177,90,.09), transparent 20rem),
    #11101d;
  box-shadow:0 34px 90px rgba(0,0,0,.62);
}
.rules-dialog-head { display:flex; gap:1rem; align-items:flex-start; justify-content:space-between; }
.rules-dialog-head h3 { margin:.22rem 0 .28rem; font-size:clamp(1.35rem,3vw,2rem); }
.rules-dialog-head p { margin:0; max-width:760px; line-height:1.48; }
.rules-legend { display:flex; flex-wrap:wrap; gap:.45rem; padding:.8rem 0 .9rem; }
.rules-legend span { padding:.42rem .62rem; border-radius:999px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.06); color:var(--muted); font-size:.72rem; font-weight:800; }
.rules-editor { min-height:0; overflow:auto; padding:.15rem .35rem .8rem 0; display:grid; gap:.62rem; }
.rules-section-heading { display:grid; gap:.1rem; margin-top:.5rem; padding:.55rem .2rem .15rem; }
.rules-section-heading > span { color:#ffb15a; font-size:.62rem; font-weight:950; letter-spacing:.16em; }
.rules-section-heading > strong { font-size:1rem; }
.rules-section-heading > small { color:var(--muted); line-height:1.4; }
.rule-scope { border:1px solid rgba(255,255,255,.075); border-radius:18px; background:rgba(8,8,15,.48); overflow:hidden; }
.rule-scope[open] { border-color:rgba(255,121,105,.16); background:linear-gradient(180deg,rgba(255,86,111,.035),rgba(8,8,15,.5)); }
.rule-scope > summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:.75rem; padding:.85rem .9rem; }
.rule-scope > summary::-webkit-details-marker { display:none; }
.rule-scope > summary::after { content:'+'; margin-left:auto; color:#ffb15a; font-size:1.15rem; font-weight:900; }
.rule-scope[open] > summary::after { content:'−'; }
.rule-scope-title { display:grid; gap:.1rem; min-width:0; }
.rule-scope-title strong { overflow:hidden; text-overflow:ellipsis; }
.rule-scope-title small { color:var(--muted); font-size:.72rem; text-transform:capitalize; }
.rule-scope-badge { margin-left:auto; padding:.28rem .5rem; border-radius:999px; border:1px solid rgba(255,177,90,.18); color:#ffbc84; font-size:.58rem; font-weight:950; letter-spacing:.1em; }
.rule-scope > summary::after { margin-left:.2rem; }
.rule-scope.hard-blocked { opacity:.62; }
.rule-scope-body { padding:.1rem .9rem 1rem; display:grid; gap:.85rem; }
.rule-level-control, .pair-enabled-rule { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.72rem .76rem; border:1px solid rgba(255,255,255,.06); border-radius:14px; background:rgba(255,255,255,.022); }
.rule-level-control > span, .pair-enabled-rule > span { display:grid; gap:.12rem; }
.rule-level-control small, .pair-enabled-rule small { color:var(--muted); font-size:.7rem; line-height:1.35; }
.rule-level-select { min-width:180px; padding:.6rem .68rem; border-radius:11px; border:1px solid rgba(255,255,255,.10); background:#171522; color:var(--text); font-weight:800; }
.pair-enabled-rule input { width:20px; height:20px; accent-color:#ff646f; flex:0 0 auto; }
.rule-topic-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; }
.rule-topic-toggle { display:flex; align-items:flex-start; gap:.65rem; padding:.72rem; border-radius:14px; border:1px solid rgba(255,255,255,.06); background:rgba(255,255,255,.02); cursor:pointer; }
.rule-topic-toggle:has(input:checked) { border-color:rgba(84,217,160,.16); background:rgba(84,217,160,.025); }
.rule-topic-toggle input { width:18px; height:18px; margin-top:.1rem; accent-color:#65dda9; flex:0 0 auto; }
.rule-topic-toggle span { display:grid; gap:.14rem; }
.rule-topic-toggle strong { font-size:.8rem; }
.rule-topic-toggle small { color:var(--muted); font-size:.69rem; line-height:1.32; }
.rules-dialog-actions { display:flex; justify-content:space-between; gap:.75rem; padding-top:.9rem; border-top:1px solid rgba(255,255,255,.07); }
.card-topics { min-height:0; display:flex; justify-content:center; flex-wrap:wrap; gap:.38rem; margin:.18rem 0 .35rem; }
.card-topics:empty { display:none; }
.card-topics span { padding:.3rem .52rem; border-radius:999px; border:1px solid rgba(255,177,90,.18); background:rgba(255,177,90,.06); color:#ffc093; font-size:.64rem; font-weight:900; letter-spacing:.04em; }

@media (max-width:760px) {
  .rule-topic-grid { grid-template-columns:1fr; }
  .rule-level-control, .pair-enabled-rule { align-items:flex-start; flex-direction:column; }
  .rule-level-select { width:100%; min-width:0; }
  .rules-dialog-card { max-height:95vh; padding:.9rem; border-radius:20px; }
  .rules-dialog-actions { flex-direction:column-reverse; }
  .rules-dialog-actions .btn { width:100%; }
}

/* Card Workshop */
.content-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.workshop-dialog{width:min(1100px,96vw);max-width:none;border:none;background:transparent;padding:0;color:inherit}
.workshop-dialog::backdrop{background:rgba(4,3,12,.82);backdrop-filter:blur(8px)}
.workshop-dialog-card{width:100%;max-height:92vh;overflow:auto;padding:22px;background:linear-gradient(180deg,rgba(23,18,43,.98),rgba(10,9,24,.99));border:1px solid rgba(255,255,255,.13);box-shadow:0 30px 90px rgba(0,0,0,.58)}
.workshop-head,.card-editor-head,.workshop-actions{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.workshop-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) repeat(3,minmax(145px,auto));gap:10px;margin:18px 0 10px}
.workshop-toolbar input,.workshop-toolbar select,.card-editor input,.card-editor select,.card-editor textarea{width:100%;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);color:var(--text);border-radius:12px;padding:11px 12px;font:inherit;outline:none}
.workshop-toolbar input:focus,.workshop-toolbar select:focus,.card-editor input:focus,.card-editor select:focus,.card-editor textarea:focus{border-color:rgba(255,153,194,.75);box-shadow:0 0 0 3px rgba(255,75,143,.12)}
.workshop-toolbar select option,.card-editor select option{background:#151126;color:#fff}
.workshop-actions{align-items:center;margin:10px 0 14px}
.workshop-list{display:grid;gap:10px;max-height:58vh;overflow:auto;padding-right:4px}
.workshop-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px 14px;border-radius:15px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.035);transition:.18s ease}
.workshop-item:hover{border-color:rgba(255,143,190,.38);transform:translateY(-1px)}
.workshop-item.is-disabled{opacity:.52}
.workshop-card-main{min-width:0}
.workshop-card-title{font-weight:650;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.workshop-card-meta,.workshop-topic-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px;align-items:center}
.workshop-chip{font-size:10px;letter-spacing:.04em;padding:3px 7px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:var(--muted)}
.workshop-chip.level{color:#ffd5a5;border-color:rgba(255,176,88,.28)}
.workshop-chip.topic{color:#ffb0cf;border-color:rgba(255,92,151,.25)}
.workshop-chip.off{color:#aaa;border-color:rgba(255,255,255,.1)}
.workshop-item-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.workshop-index{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,rgba(255,87,153,.18),rgba(134,77,255,.2));border:1px solid rgba(255,255,255,.12);font-size:11px;color:#f5dbea}
.workshop-empty{text-align:center;padding:34px;border:1px dashed rgba(255,255,255,.13);border-radius:14px;color:var(--muted)}
.card-editor{margin-top:8px}
.card-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}
.editor-field{display:grid;gap:7px;font-size:13px;color:#f3eaf2}
.editor-field>span:first-child{font-weight:650}
.editor-field textarea{resize:vertical;min-height:130px;line-height:1.5}
.switch-editor .row{min-height:45px;align-items:center;padding:5px 0}
.switch-editor label{display:flex;gap:7px;align-items:center;color:var(--muted)}
.switch-editor input{width:auto}
.topic-fieldset{margin:14px 0;border:1px solid rgba(255,255,255,.11);border-radius:14px;padding:14px}
.topic-fieldset legend{padding:0 7px;font-weight:700}
.topic-checkbox-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:10px}
.topic-checkbox{display:flex;gap:9px;align-items:flex-start;padding:9px;border-radius:10px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07)}
.topic-checkbox input{width:auto;margin-top:2px}
.topic-checkbox strong{display:block;font-size:12px}.topic-checkbox small{display:block;color:var(--muted);font-size:10px;line-height:1.3;margin-top:2px}
.card-editor-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:16px}
.editor-hint{min-height:18px;margin-top:8px}
.workshop-pulse{animation:workshopPulse .38s ease}
@keyframes workshopPulse{0%{transform:scale(.985);opacity:.65}100%{transform:scale(1);opacity:1}}
@media(max-width:780px){.workshop-toolbar{grid-template-columns:1fr 1fr}.workshop-search{grid-column:1/-1}.workshop-item{grid-template-columns:auto minmax(0,1fr)}.workshop-item-actions{grid-column:1/-1;justify-content:flex-start;padding-left:44px}.card-editor-grid,.topic-checkbox-grid{grid-template-columns:1fr}.content-head-actions{justify-content:flex-start}.workshop-head{align-items:flex-start}}
@media(max-width:520px){.workshop-toolbar{grid-template-columns:1fr}.workshop-search{grid-column:auto}.workshop-dialog-card{padding:15px}.workshop-actions{align-items:flex-start;flex-direction:column}}

/* Shared heat / focus controls */
.focus-setting{margin-top:18px;padding:14px 16px;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:rgba(255,255,255,.035);display:flex;align-items:center;justify-content:space-between;gap:16px}
.focus-setting>div{display:flex;flex-direction:column;gap:4px}.focus-setting small{color:var(--muted,#a9a6b8);max-width:520px;line-height:1.35}.focus-setting select{min-width:180px;max-width:240px}
.heat-player.participation-only{grid-template-columns:minmax(150px,1fr) auto}.participation-stat{font-size:.82rem;color:var(--muted,#a9a6b8);text-align:right;white-space:nowrap}.participation-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-size:.72rem;margin-left:7px}
@media (max-width:640px){.focus-setting{align-items:stretch;flex-direction:column}.focus-setting select{max-width:none;width:100%}}

/* Chemistry balance */
.chemistry-controls{display:flex;gap:.55rem;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.chemistry-controls select{min-width:170px}
.chemistry-controls #focusPlayerSelect.chemistry-hidden{display:none}
.chemistry-setting[data-mode="female"]{border-color:rgba(255,95,144,.26);box-shadow:inset 0 0 0 1px rgba(255,95,144,.04);background:linear-gradient(135deg,rgba(255,95,144,.055),rgba(255,255,255,.025))}
@media (max-width:640px){.chemistry-controls{width:100%;justify-content:stretch}.chemistry-controls select{width:100%;max-width:none}}

/* ===== v16 activity suggestion wheel ===== */
.activity-wheel-card {
  display:grid;
  grid-template-columns:minmax(240px,.82fr) minmax(280px,1.18fr);
  gap:1rem;
  align-items:center;
  padding:1rem 1.15rem;
  border:1px solid rgba(198,92,255,.24);
  border-radius:24px;
  background:
    radial-gradient(circle at 78% 45%, rgba(198,92,255,.14), transparent 20rem),
    radial-gradient(circle at 18% 20%, rgba(255,177,90,.08), transparent 15rem),
    linear-gradient(145deg, rgba(20,17,31,.99), rgba(12,11,20,.99));
  box-shadow:var(--shadow);
  overflow:hidden;
}
.activity-wheel-copy h3 { margin:.25rem 0 .35rem; font-size:clamp(1.15rem,3vw,1.7rem); }
.activity-wheel-stage { position:relative; width:min(100%,350px); aspect-ratio:1; margin-inline:auto; display:grid; place-items:center; filter:drop-shadow(0 16px 28px rgba(0,0,0,.38)); }
#activityWheel { width:100%; height:100%; border-radius:50%; transition:filter .2s ease; }
.activity-wheel-stage.spinning { animation:wheelGlow .85s ease-in-out infinite alternate; }
.activity-wheel-stage.spinning #activityWheel { filter:saturate(1.25) brightness(1.1); }
.activity-wheel-pointer { position:absolute; z-index:4; top:-2px; left:50%; transform:translateX(-50%); color:#f1beff; font-size:1.6rem; text-shadow:0 0 18px rgba(198,92,255,.9); }
.activity-wheel-hub { position:absolute; z-index:3; width:23%; aspect-ratio:1; display:grid; place-items:center; border-radius:50%; background:radial-gradient(circle at 35% 30%,#39203f,#14111e 72%); border:4px solid rgba(255,255,255,.12); box-shadow:0 8px 28px rgba(0,0,0,.45),0 0 34px rgba(198,92,255,.22); }
.activity-wheel-hub span { font-size:clamp(1.4rem,4vw,2.3rem); color:#f0b6ff; text-shadow:0 0 16px rgba(198,92,255,.55); }
.activity-mode-picker { display:grid; gap:.4rem; margin-top:.85rem; }
.activity-mode-picker > span { color:var(--muted); font-size:.72rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.activity-mode-picker select { width:100%; min-height:46px; border:1px solid rgba(255,255,255,.10); border-radius:13px; background:#15121f; color:#fff8f6; padding:.7rem .8rem; font-weight:800; }
.activity-wheel-actions { display:grid; grid-template-columns:.85fr 1.15fr; gap:.65rem; margin-top:.7rem; }
.activity-wheel-actions .btn { margin:0; }
.activity-wheel-card.locked { opacity:.72; }
.activity-wheel-card.locked .activity-wheel-actions,
.activity-wheel-card.locked .activity-mode-picker { pointer-events:none; }
.action-grid-three { grid-template-columns:.85fr .95fr 1.25fr; }
.warm-action { border-color:rgba(255,177,90,.28)!important; background:linear-gradient(180deg,rgba(255,177,90,.07),rgba(255,255,255,.01))!important; }
.build-badge { opacity:.65; font-size:.66rem; }

@media (max-width:900px){
  .activity-wheel-card { grid-template-columns:1fr; }
  .activity-wheel-copy { text-align:center; }
  .activity-mode-picker { text-align:left; }
}
@media (max-width:760px){
  .activity-wheel-stage { width:min(86vw,310px); }
  .activity-wheel-actions { grid-template-columns:1fr 1fr; }
  .action-grid-three { grid-template-columns:1fr; }
}

/* ===== v17 focused game flow + responsive polish ===== */
.game-view {
  width:min(100%, 980px);
  margin-inline:auto;
  gap:.78rem;
}
.game-meta { order:0; position:sticky; top:68px; z-index:20; border:1px solid rgba(255,126,105,.18); border-radius:20px; background:rgba(10,9,17,.94); box-shadow:0 10px 34px rgba(0,0,0,.34); backdrop-filter:blur(18px); }
#wheelCard { order:1; }
#activityWheelCard { order:2; }
#playCard { order:3; }
.action-grid-three { order:4; }
.consent-note { order:5; }
.session-drawer { order:6; }

/* The three main actions behave like scenes. One scene owns attention at a time. */
.game-step { transition:opacity .3s ease, transform .36s ease, filter .3s ease, max-height .42s ease, padding .35s ease; transform-origin:center top; }
.game-step.is-focus { opacity:1; transform:scale(1); filter:none; }
.game-step.is-past { opacity:.62; transform:scale(.985); filter:saturate(.78); }
.game-step.is-future { opacity:.24; transform:scale(.98); filter:saturate(.55); pointer-events:none; }

/* Player wheel: large while spinning, compact summary once its job is done. */
.wheel-card { grid-template-columns:minmax(220px,.78fr) minmax(290px,1.22fr); padding:.9rem 1rem; min-height:330px; }
.wheel-stage { width:min(100%,360px); }
.wheel-card.is-past { grid-template-columns:minmax(0,1fr) 96px; min-height:92px; max-height:108px; padding:.55rem .8rem; overflow:hidden; align-items:center; }
.wheel-card.is-past .wheel-copy p { display:none; }
.wheel-card.is-past .wheel-copy h3 { margin:.15rem 0; font-size:1rem; }
.wheel-card.is-past .wheel-stage { width:86px; }
.wheel-card.is-past .wheel-pointer { font-size:.9rem; top:-5px; }
.wheel-card.is-past .wheel-hub { border-width:2px; }

/* Activity roulette follows the player wheel and becomes the second scene. */
.activity-wheel-card { min-height:310px; padding:.9rem 1rem; }
.activity-wheel-stage { width:min(100%,330px); }
.activity-wheel-card.is-past { grid-template-columns:minmax(0,1fr) 96px; min-height:92px; max-height:108px; padding:.55rem .8rem; overflow:hidden; align-items:center; }
.activity-wheel-card.is-past .activity-wheel-copy > p,
.activity-wheel-card.is-past .activity-mode-picker,
.activity-wheel-card.is-past .activity-wheel-actions { display:none; }
.activity-wheel-card.is-past .activity-wheel-copy h3 { margin:.15rem 0; font-size:1rem; }
.activity-wheel-card.is-past .activity-wheel-stage { width:86px; }
.activity-wheel-card.is-past .activity-wheel-pointer { font-size:.9rem; top:-5px; }
.activity-wheel-card.is-future { max-height:92px; min-height:92px; overflow:hidden; }
.activity-wheel-card.is-future .activity-wheel-stage,
.activity-wheel-card.is-future .activity-mode-picker,
.activity-wheel-card.is-future .activity-wheel-actions { display:none; }

/* Card is intentionally quiet until the two wheels finish. */
.play-card { min-height:315px; padding:clamp(1.15rem,3.8vw,2.35rem); }
.play-card.is-future { min-height:92px; max-height:92px; padding:.65rem .9rem; overflow:hidden; justify-content:center; }
.play-card.is-future .card-topline,
.play-card.is-future .target-label,
.play-card.is-future .card-topics,
.play-card.is-future .turn-timer,
.play-card.is-future::before { display:none; }
.play-card.is-future .actor-label { font-size:.78rem; opacity:.75; }
.play-card.is-future .prompt-text { margin:.18rem 0 0; font-family:inherit; font-size:.9rem; line-height:1.35; letter-spacing:0; font-weight:700; }
.prompt-text { font-size:clamp(1.55rem,4.1vw,2.75rem); line-height:1.12; }

/* Pass/complete controls only belong to the card scene. */
.action-grid-three,
.consent-note { transition:opacity .24s ease, max-height .3s ease, margin .3s ease; }
.game-view:not([data-phase="card"]) .action-grid-three,
.game-view:not([data-phase="card"]) .consent-note { opacity:0; max-height:0; overflow:hidden; pointer-events:none; margin:0; }
.game-view[data-phase="card"] .action-grid-three { opacity:1; max-height:90px; }
.game-view[data-phase="card"] .consent-note { opacity:1; max-height:70px; }
.action-grid-three .btn { min-height:58px; }

/* Shared Heat is now a mood object rather than a tiny utility bar. */
.room-heat {
  --heat:0;
  position:relative;
  isolation:isolate;
  min-width:310px;
  display:grid;
  grid-template-columns:54px minmax(200px,1fr);
  align-items:center;
  gap:.72rem;
  padding:.58rem .74rem;
  border-radius:18px;
  border:1px solid rgba(255,109,101,.23);
  background:linear-gradient(135deg,rgba(255,95,92,.08),rgba(198,92,255,.05)),rgba(12,10,19,.9);
  box-shadow:inset 0 0 28px rgba(255,63,114,.035),0 8px 26px rgba(0,0,0,.22);
  overflow:hidden;
}
.heat-orb {
  width:48px; aspect-ratio:1; display:grid; place-items:center; border-radius:50%;
  background:radial-gradient(circle at 35% 28%,#ffd29b 0 8%,#ff7a64 29%,#ff3f72 58%,#6d2a71 100%);
  box-shadow:0 0 18px rgba(255,72,103,.28), inset 0 0 12px rgba(255,255,255,.18);
  animation:heatOrbBreathe 2.3s ease-in-out infinite;
}
.heat-orb span { color:#fff7ef; font-size:1.28rem; text-shadow:0 0 10px rgba(255,255,255,.5); }
.room-heat-body { position:relative; min-width:0; }
.room-heat-copy { display:flex; align-items:baseline; gap:.3rem; margin-bottom:.38rem; }
.room-heat-copy span { margin-right:.2rem; }
.room-heat-copy strong { font-size:1.45rem; }
.room-heat-copy em { margin-left:auto; font-style:normal; color:#ffb996; font-size:.7rem; font-weight:850; letter-spacing:.04em; white-space:nowrap; }
.room-heat-track { position:relative; height:13px; overflow:visible; border-radius:999px; background:#28212d; box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),0 0 18px rgba(0,0,0,.18); }
.room-heat-track span { position:relative; display:block; width:0%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#ffb15a 0%,#ff795f 34%,#ff3f72 68%,#d354d9 100%); box-shadow:0 0 14px rgba(255,69,110,.28); transition:width .82s cubic-bezier(.2,.8,.2,1); animation:heatBarGlow 1.75s ease-in-out infinite alternate; }
.room-heat-track span::after { content:""; position:absolute; inset:1px 5px auto 8px; height:3px; border-radius:999px; background:linear-gradient(90deg,rgba(255,255,255,.65),rgba(255,255,255,0)); opacity:.65; }
.heat-bubbles { pointer-events:none; position:absolute; inset:-18px 0 -5px 0; overflow:visible; opacity:.18; transition:opacity .5s ease; }
.heat-bubbles i { position:absolute; bottom:2px; width:6px; height:6px; border-radius:50%; background:#ff825f; box-shadow:0 0 10px rgba(255,72,103,.8); animation:heatBubble 2.8s linear infinite; opacity:0; }
.heat-bubbles i:nth-child(1){left:10%;animation-delay:.1s}.heat-bubbles i:nth-child(2){left:23%;animation-delay:1.3s;width:4px;height:4px}.heat-bubbles i:nth-child(3){left:39%;animation-delay:.7s}.heat-bubbles i:nth-child(4){left:54%;animation-delay:2.1s;width:5px;height:5px}.heat-bubbles i:nth-child(5){left:68%;animation-delay:1.6s}.heat-bubbles i:nth-child(6){left:81%;animation-delay:.35s;width:4px;height:4px}.heat-bubbles i:nth-child(7){left:91%;animation-delay:2.35s}
.room-heat.heat-warm .heat-bubbles{opacity:.38}.room-heat.heat-hot .heat-bubbles{opacity:.62}.room-heat.heat-fire .heat-bubbles{opacity:.9}
.room-heat.heat-hot .heat-orb { animation-duration:1.7s; box-shadow:0 0 27px rgba(255,72,103,.48), inset 0 0 13px rgba(255,255,255,.22); }
.room-heat.heat-fire .heat-orb { animation-duration:1.18s; box-shadow:0 0 38px rgba(255,72,103,.66),0 0 70px rgba(198,92,255,.14),inset 0 0 14px rgba(255,255,255,.22); }
@keyframes heatOrbBreathe { 0%,100%{transform:scale(.95)} 50%{transform:scale(1.06)} }
@keyframes heatBarGlow { from{filter:saturate(1);box-shadow:0 0 10px rgba(255,69,110,.22)} to{filter:saturate(1.2);box-shadow:0 0 21px rgba(255,69,110,.42)} }
@keyframes heatBubble { 0%{transform:translateY(8px) scale(.45);opacity:0} 18%{opacity:.7} 100%{transform:translateY(-34px) scale(1.2);opacity:0} }

/* Session data is useful, but it should not compete with the game. */
.session-drawer { border:1px solid rgba(255,255,255,.065); border-radius:18px; background:rgba(12,11,19,.72); overflow:hidden; }
.session-drawer > summary { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.72rem .9rem; color:#e9dfe8; }
.session-drawer > summary::-webkit-details-marker { display:none; }
.session-drawer > summary span:first-child { display:grid; gap:.1rem; }
.session-drawer > summary b { font-size:.85rem; }
.session-drawer > summary small { color:var(--muted); font-size:.7rem; }
.drawer-chevron { transition:transform .22s ease; color:#ffad8d; }
.session-drawer[open] .drawer-chevron { transform:rotate(180deg); }
.session-drawer .live-dashboard { padding:.15rem .7rem .7rem; }
.session-drawer .session-strip { margin:.1rem .7rem .7rem; }

/* Better scaling: game should feel intentional rather than billboard-sized. */
.wheel-copy h3, .activity-wheel-copy h3 { font-size:clamp(1.05rem,2.5vw,1.45rem); }
.game-meta .journey-copy { font-size:.82rem; max-width:270px; line-height:1.4; }

@media (max-width:900px){
  .game-meta { top:58px; }
  .wheel-card, .activity-wheel-card { grid-template-columns:1fr; }
  .wheel-stage { width:min(82vw,330px); }
  .activity-wheel-stage { width:min(78vw,300px); }
  .wheel-card.is-past, .activity-wheel-card.is-past { grid-template-columns:minmax(0,1fr) 78px; }
  .wheel-card.is-past .wheel-stage, .activity-wheel-card.is-past .activity-wheel-stage { width:70px; }
}
@media (max-width:760px){
  .game-view { gap:.62rem; }
  .game-meta { padding:.65rem; border-radius:16px; }
  .game-meta > div:first-child { display:none; }
  .meta-right { display:none; }
  .room-heat { width:100%; min-width:0; grid-template-columns:46px 1fr; padding:.48rem .58rem; }
  .heat-orb { width:42px; }
  .room-heat-copy strong { font-size:1.25rem; }
  .room-heat-copy em { font-size:.63rem; }
  .wheel-card, .activity-wheel-card { padding:.72rem; border-radius:18px; min-height:0; }
  .wheel-stage { width:min(78vw,300px); }
  .activity-wheel-stage { width:min(74vw,285px); }
  .play-card { min-height:280px; border-radius:18px; }
  .prompt-text { font-size:clamp(1.45rem,7vw,2.2rem); }
  .action-grid-three { grid-template-columns:1fr 1fr 1.2fr; gap:.45rem; }
  .action-grid-three .btn { padding:.7rem .45rem; font-size:.78rem; }
  .consent-note { font-size:.7rem; line-height:1.35; padding-inline:.35rem; }
  .session-drawer .session-strip { grid-template-columns:repeat(3,1fr); }
  .session-drawer .session-strip .btn { grid-column:1/-1; }
}
@media (max-width:470px){
  .action-grid-three { grid-template-columns:1fr; }
  .game-view[data-phase="card"] .action-grid-three { max-height:180px; }
  .room-heat-copy em { display:none; }
  .wheel-stage { width:min(84vw,286px); }
  .activity-wheel-stage { width:min(80vw,270px); }
}


/* ===== v18 compact mood-first shell ===== */
.home-grid { display:none; }
.shell { width:min(1080px, calc(100% - 1.4rem)); margin:1rem auto 3rem; }
.hero-card { min-height:390px; grid-template-columns:1.12fr .72fr; border-radius:26px; }
.hero-copy { padding:clamp(1.55rem,4vw,3.2rem); }
.hero-copy h1 { max-width:620px; font-size:clamp(2.4rem,5vw,4.25rem); line-height:.96; }
.hero-lead { margin-top:.9rem; max-width:560px; font-size:1.02rem; line-height:1.55; }
.hero-actions { margin-top:1.35rem; }
.feature-row { margin-top:1.1rem; font-size:.78rem; }
.hero-art { padding:1.25rem; }
.hero-art img { width:min(64%,220px); border-radius:28%; }
.hero-wordmark { font-size:clamp(1.8rem,3vw,2.7rem); }
.hero-script { margin-top:.45rem; font-size:.9rem; }

/* v18 rules: no browser-details rendering dependency. */
.rule-scope { overflow:hidden; }
.rule-scope-head { width:100%; border:0; color:var(--text); background:transparent; display:flex; align-items:center; gap:.7rem; padding:.82rem .9rem; text-align:left; cursor:pointer; }
.rule-scope-head:hover { background:rgba(255,255,255,.025); }
.rule-scope.open { border-color:rgba(255,121,105,.22); background:linear-gradient(180deg,rgba(255,86,111,.04),rgba(8,8,15,.5)); }
.rule-scope-caret { flex:0 0 auto; width:24px; height:24px; display:grid; place-items:center; border-radius:50%; color:#ffb15a; background:rgba(255,177,90,.07); font-weight:900; }
.rule-scope-body[hidden] { display:none !important; }
.rules-dialog { width:min(900px,96vw); }
.rules-dialog-card { max-height:90vh; padding:1rem; }
.rules-dialog-head h3 { font-size:clamp(1.2rem,2.2vw,1.65rem); }
.rules-dialog-head p { font-size:.84rem; }
.rules-legend { padding:.55rem 0 .65rem; }
.rules-editor { gap:.42rem; }
.rules-section-heading { margin-top:.2rem; padding:.35rem .15rem .05rem; }
.rule-topic-toggle { padding:.6rem; }
.rule-level-control, .pair-enabled-rule { padding:.6rem .68rem; }

/* Game is a sequence of focused scenes, not a long dashboard. */
.game-view { width:min(100%,820px); margin-inline:auto; gap:.6rem; }
.game-meta { top:64px; padding:.58rem .7rem; display:grid; grid-template-columns:minmax(0,1fr); }
.game-meta > div:first-child, .game-meta .meta-right { display:none; }
.room-heat { width:100%; min-width:0; grid-template-columns:52px 1fr; padding:.62rem .78rem; border-radius:18px; box-shadow:0 12px 34px rgba(0,0,0,.28), 0 0 32px rgba(255,63,114,.08); }
.room-heat-track { height:16px; }
.room-heat-copy strong { font-size:1.6rem; }
.room-heat.heat-hot { box-shadow:0 12px 34px rgba(0,0,0,.28),0 0 38px rgba(255,63,114,.18); }
.room-heat.heat-fire { box-shadow:0 12px 34px rgba(0,0,0,.28),0 0 54px rgba(255,63,114,.28); }

.wheel-card, .activity-wheel-card { min-height:0; padding:.85rem; grid-template-columns:minmax(190px,.7fr) minmax(270px,1fr); border-radius:20px; }
.wheel-stage { width:min(100%,315px); }
.activity-wheel-stage { width:min(100%,300px); }
.wheel-copy p, .activity-wheel-copy p { margin-bottom:.55rem; }
.wheel-card.is-focus, .activity-wheel-card.is-focus, .play-card.is-focus { box-shadow:0 20px 55px rgba(0,0,0,.38),0 0 32px rgba(255,75,105,.08); }
.game-step.is-past { opacity:.38; max-height:72px; min-height:72px; overflow:hidden; padding:.42rem .65rem; }
.wheel-card.is-past, .activity-wheel-card.is-past { min-height:72px; max-height:72px; grid-template-columns:1fr 58px; }
.wheel-card.is-past .wheel-stage, .activity-wheel-card.is-past .activity-wheel-stage { width:52px; }
.game-step.is-future { opacity:.16; max-height:58px; min-height:58px; overflow:hidden; padding:.4rem .65rem; }
.play-card { min-height:260px; padding:clamp(1rem,3vw,1.7rem); }
.prompt-text { font-size:clamp(1.45rem,3.5vw,2.25rem); }
.actor-label { font-size:1rem; }
.action-grid-three .btn { min-height:52px; }
.consent-note { text-align:center; font-size:.72rem; color:#8f8998; }
.session-drawer { opacity:.72; }

@media (max-width:760px) {
  .topbar { padding:.65rem .8rem; }
  .brand-icon { width:36px; height:36px; }
  .brand-name { font-size:1.2rem; }
  .hero-card { min-height:0; grid-template-columns:1fr; }
  .hero-copy { padding:1.3rem; }
  .hero-art { display:none; }
  .feature-row { display:none; }
  .setup-grid { grid-template-columns:1fr; padding-bottom:6rem; }
  .span-2 { grid-column:auto; }
  .wheel-card, .activity-wheel-card { grid-template-columns:1fr; }
  .wheel-stage { width:min(76vw,290px); }
  .activity-wheel-stage { width:min(74vw,275px); }
  .game-step.is-past { max-height:62px; min-height:62px; }
  .game-step.is-future { max-height:48px; min-height:58px; }
}

/* ===== v19 polish (legacy base) ===== */
/* Rules are a setup tool, not a second game. Keep them compact, readable and unclipped. */
.rules-dialog { width:min(940px, calc(100vw - 20px)); }
.rules-dialog-card {
  max-height:calc(100dvh - 20px);
  overflow:hidden;
  grid-template-rows:auto auto minmax(0,1fr) auto;
  padding:1rem;
}
.rules-editor { overflow-y:auto; overflow-x:visible; padding:.15rem .2rem 1rem; scrollbar-gutter:stable; }
.rule-scope { overflow:visible !important; min-width:0; }
.rule-scope-head { min-width:0; }
.rule-scope-title { flex:1 1 auto; min-width:0; }
.rule-scope-title strong { white-space:normal; overflow:visible; text-overflow:clip; line-height:1.2; }
.rule-scope-title small { white-space:normal; line-height:1.3; }
.rule-scope-body { min-width:0; overflow:visible; padding:.2rem .75rem .8rem; gap:.6rem; }
.rule-level-control, .pair-enabled-rule { min-width:0; }
.rule-level-control > span, .pair-enabled-rule > span { min-width:0; }
.rule-level-control strong, .pair-enabled-rule strong { line-height:1.2; }
.rule-topic-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:.42rem; }
.rule-topic-toggle { min-width:0; padding:.58rem .62rem; align-items:center; }
.rule-topic-toggle span { min-width:0; }
.rule-topic-toggle strong { font-size:.76rem; line-height:1.15; white-space:normal; }
.rule-topic-toggle small { display:none; }
.rules-section-heading > small { font-size:.73rem; }
.rules-dialog-actions { background:#11101d; position:relative; z-index:2; }

/* Deck management */
.workshop-actions-stack { display:grid; gap:.7rem; }
.workshop-summary-row { display:flex; align-items:center; justify-content:space-between; gap:.8rem; flex-wrap:wrap; }
.deck-library-row { display:grid; grid-template-columns:minmax(190px,1fr) repeat(4,auto); gap:.5rem; align-items:center; }
.deck-library-row select { width:100%; min-width:0; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.11); color:var(--text); border-radius:11px; padding:.58rem .7rem; }
.deck-library-row select option { background:#151126; color:#fff; }

/* Optional prompt hints stay out of the way unless requested. */
.card-hint-wrap { margin:.25rem 0 .1rem; }
.hint-toggle { border:0; background:transparent; color:#ffb98f; font:inherit; font-size:.72rem; font-weight:800; padding:.15rem 0; cursor:pointer; }
.card-hint { margin-top:.35rem; padding:.6rem .72rem; border-radius:12px; border:1px solid rgba(255,177,90,.13); background:rgba(255,177,90,.045); color:#d9cbd4; font-size:.78rem; line-height:1.45; }

/* Bulk editor */
#bulkEditor textarea { min-height:230px; resize:vertical; }

/* Prompt copy should be strong, not billboard-sized. */
.prompt-text { max-width:100%; line-height:1.08; text-wrap:balance; }
.play-card { overflow:visible; }

@media(max-width:860px){
  .rule-topic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .deck-library-row { grid-template-columns:1fr 1fr; }
  .deck-library-row select { grid-column:1/-1; }
}
@media(max-width:560px){
  .rule-topic-grid { grid-template-columns:1fr; }
  .deck-library-row { grid-template-columns:1fr; }
  .deck-library-row select { grid-column:auto; }
  .rules-dialog-card { padding:.75rem; }
}

/* v19.1 Rules reliability: one scroll surface prevents expanded scopes from being clipped. */
.rules-dialog-card {
  display:block !important;
  max-height:calc(100dvh - 20px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
.rules-editor {
  overflow:visible !important;
  max-height:none !important;
  min-height:0;
}
.rule-scope.open .rule-scope-body {
  display:grid !important;
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
}
.rules-dialog-actions {
  position:sticky !important;
  bottom:0;
  margin-top:.8rem;
  padding:.8rem 0 .1rem;
  background:linear-gradient(180deg,rgba(17,16,29,0),#11101d 18%);
}

/* ===== v21: reliable compact rules + deck workshop ===== */
.rules-dialog[open] {
  display:flex;
  align-items:center;
  justify-content:center;
  width:100vw;
  max-width:none;
  height:100dvh;
  max-height:none;
  margin:0;
  padding:10px;
  overflow:hidden;
}
.rules-dialog-card {
  width:min(980px,100%);
  max-height:calc(100dvh - 20px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  border-radius:22px;
  padding:1rem;
  scrollbar-gutter:stable;
}
.rules-dialog-head { position:sticky; top:-1rem; z-index:4; padding:.95rem 0 .65rem; background:linear-gradient(180deg,#11101d 82%,rgba(17,16,29,0)); }
.rules-dialog-head h3 { margin:0; font-size:1.45rem; }
.rules-dialog-head p { margin:.25rem 0 0; font-size:.8rem; }
.rules-legend { padding:.25rem 0 .55rem; }
.rules-editor { display:grid !important; overflow:visible !important; gap:.48rem; }
.rule-scope,
.rule-scope.open { height:auto !important; max-height:none !important; min-height:0; overflow:visible !important; }
.rule-scope-head { min-height:54px; padding:.68rem .78rem; overflow:visible; }
.rule-scope-title { display:grid; gap:.08rem; min-width:0; overflow:visible; }
.rule-scope-title strong,
.rule-scope-title small { display:block; white-space:normal !important; overflow:visible !important; text-overflow:clip !important; overflow-wrap:anywhere; }
.rule-scope-title strong { font-size:.92rem; }
.rule-scope-title small { font-size:.68rem; }
.rule-scope-body { display:grid; height:auto !important; max-height:none !important; overflow:visible !important; padding:.15rem .78rem .8rem; gap:.52rem; }
.rule-level-control,
.pair-enabled-rule { display:grid; grid-template-columns:minmax(0,1fr) minmax(180px,240px); align-items:center; gap:.7rem; padding:.62rem .7rem; }
.rule-level-control > span,
.pair-enabled-rule > span { min-width:0; }
.rule-level-control strong,
.pair-enabled-rule strong,
.rule-level-control small,
.pair-enabled-rule small { white-space:normal; overflow:visible; overflow-wrap:anywhere; }
.rule-level-select { width:100%; min-width:0; }
.rule-topic-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:.4rem; }
.rule-topic-toggle { min-height:46px; padding:.52rem .58rem; align-items:center; overflow:visible; }
.rule-topic-toggle strong { font-size:.73rem; line-height:1.15; white-space:normal; overflow-wrap:anywhere; }
.rule-topic-toggle small { display:none; }
.rules-dialog-actions { position:sticky !important; bottom:-1rem; z-index:5; margin-top:.65rem; padding:.8rem 0 1rem; background:linear-gradient(180deg,rgba(17,16,29,0),#11101d 24%); }

/* Keep the main experience compact and mood-forward. */
.hero-card { min-height:330px; }
.hero-copy h1 { font-size:clamp(2.15rem,4.4vw,3.55rem); max-width:560px; }
.hero-lead { font-size:.96rem; }
.home-grid { margin-top:.8rem; }
.home-card { padding:1rem; }

/* Deck library is a first-class workflow, not a row of mystery buttons. */
.workshop-actions-stack { padding:.72rem; border:1px solid rgba(255,255,255,.07); border-radius:16px; background:rgba(255,255,255,.02); }
.deck-library-row { grid-template-columns:minmax(210px,1fr) repeat(6,auto); }
.workshop-dialog-card { max-height:calc(100dvh - 20px); border-radius:22px; }
.workshop-head h3 { margin:.2rem 0; }
.workshop-head p { max-width:720px; }

@media(max-width:860px){
  .rule-topic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rule-level-control,.pair-enabled-rule { grid-template-columns:1fr; }
  .deck-library-row { grid-template-columns:1fr 1fr; }
  .deck-library-row select { grid-column:1/-1; }
}
@media(max-width:560px){
  .rules-dialog[open] { padding:4px; align-items:stretch; }
  .rules-dialog-card { max-height:calc(100dvh - 8px) !important; border-radius:16px; padding:.72rem; }
  .rules-dialog-head { top:-.72rem; }
  .rule-topic-grid { grid-template-columns:1fr 1fr; }
  .deck-library-row { grid-template-columns:1fr; }
  .deck-library-row select { grid-column:auto; }
}

/* ===== v22 setup + refined limits ===== */
.setup-titlebar { align-items:flex-start; }
.chemistry-controls { flex:0 0 auto; }
.chemistry-controls select { min-width:250px !important; width:auto; max-width:320px !important; padding-right:2.4rem; }
.chemistry-setting { align-items:flex-start; }

.mode-toggle-cloud { display:flex; flex-wrap:wrap; gap:.5rem; }
.mode-chip-toggle { appearance:none; border:1px solid rgba(255,255,255,.09); background:rgba(255,255,255,.035); color:#8f8998; border-radius:999px; padding:.58rem .78rem; font:inherit; font-size:.76rem; font-weight:850; cursor:pointer; transition:.16s ease; }
.mode-chip-toggle.enabled { color:#fff5f7; border-color:rgba(255,97,129,.3); background:linear-gradient(135deg,rgba(255,70,111,.16),rgba(172,74,190,.1)); box-shadow:0 0 18px rgba(255,70,111,.06); }
.mode-chip-toggle:hover { transform:translateY(-1px); border-color:rgba(255,145,119,.38); }

.rule-topic-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; }
.rule-topic-group { min-width:0; border:1px solid rgba(255,255,255,.07); border-radius:14px; background:rgba(255,255,255,.018); overflow:visible; }
.rule-topic-group.topic-off { opacity:.62; }
.rule-topic-group-head { display:flex; align-items:center; gap:.45rem; min-width:0; padding:.42rem .48rem; }
.rule-topic-master { flex:1 1 auto; min-width:0; border:0 !important; background:transparent !important; padding:.35rem !important; }
.rule-topic-master small { display:block !important; }
.topic-advanced-btn { flex:0 0 auto; border:1px solid rgba(255,177,90,.16); background:rgba(255,177,90,.045); color:#ffbd91; border-radius:999px; padding:.38rem .58rem; font:inherit; font-size:.66rem; font-weight:850; cursor:pointer; }
.rule-detail-grid { border-top:1px solid rgba(255,255,255,.055); padding:.55rem; display:grid; grid-template-columns:1fr; gap:.34rem; }
.rule-detail-grid[hidden] { display:none !important; }
.rule-detail-toggle { display:flex; align-items:center; gap:.5rem; border-radius:10px; padding:.38rem .45rem; background:rgba(255,255,255,.022); color:#d8d1de; font-size:.72rem; cursor:pointer; }
.rule-detail-toggle input { width:17px; height:17px; accent-color:#65dda9; flex:0 0 auto; }
.rules-dialog-card { width:min(980px,calc(100vw - 16px)); }
.rules-editor { padding-bottom:1.5rem !important; }
.rule-scope-body { overflow:visible !important; }

.adult-launch-dialog { width:min(480px,calc(100vw - 28px)); }
.adult-launch-card { background:linear-gradient(160deg,#17101e,#100d19); border:1px solid rgba(255,112,126,.2); }
.adult-launch-card h3 { font-size:1.65rem; margin:.35rem 0 .55rem; }
.adult-launch-card p { color:#cbc1cc; line-height:1.5; }
.adult-launch-card .row .btn { flex:1; }

@media(max-width:760px){
  .rule-topic-groups { grid-template-columns:1fr; }
  .chemistry-controls { width:100%; }
  .chemistry-controls select { min-width:0 !important; width:100%; max-width:none !important; }
}

/* ===== v25 mobile-first interaction pass ===== */
.game-meta > .journey-stage-wrap{display:block!important;min-width:0}
.level-indicator{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.15rem .55rem;max-width:520px}
.level-indicator>span{grid-row:1/3;font-size:.64rem;font-weight:950;letter-spacing:.14em;color:#ffaf86;border:1px solid rgba(255,139,102,.25);border-radius:999px;padding:.3rem .48rem;background:rgba(255,102,90,.08)}
.level-indicator>strong{font-size:.98rem;line-height:1.1;color:#fff5f0}
.level-indicator>small{font-size:.68rem;line-height:1.25;color:#b9adbf;white-space:normal;overflow:visible}
.level-indicator.recovering>span{color:#f7c775;border-color:rgba(247,199,117,.35);box-shadow:0 0 16px rgba(247,199,117,.12)}

.rule-direction-grid{border-top:1px dashed rgba(255,255,255,.08);padding:.6rem;display:grid;gap:.4rem;background:rgba(255,143,91,.025)}
.rule-direction-title{font-size:.63rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase;color:#f0b18a}
.direction-toggle span{display:grid;gap:.1rem;min-width:0}
.direction-toggle small{display:block;color:#9d94a5;font-size:.66rem;line-height:1.3;white-space:normal}

.recovery-setting{margin-top:.9rem;padding:.9rem;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(255,255,255,.025);display:grid;gap:.7rem}
.recovery-setting>div:first-child{display:grid;gap:.15rem}.recovery-setting small{color:var(--muted);font-size:.72rem;line-height:1.35}
.recovery-editor{display:grid;gap:.45rem}
.recovery-row{display:grid;grid-template-columns:minmax(100px,1fr) auto minmax(135px,auto) minmax(155px,auto);align-items:center;gap:.45rem;padding:.5rem;border-radius:12px;background:rgba(255,255,255,.025)}
.recovery-row strong{font-size:.8rem;overflow:hidden;text-overflow:ellipsis}
.recovery-row select{min-width:0;width:100%;background:#171324;color:#f7edf7;border:1px solid rgba(255,255,255,.12);border-radius:9px;padding:.45rem .5rem}
.recovery-toggle{display:flex;align-items:center;gap:.35rem;font-size:.7rem;color:#cabfd0}.recovery-toggle input{accent-color:#f06a9a}

.composer-toolbar{display:flex;flex-wrap:wrap;gap:.4rem;margin:.35rem 0 .5rem}
.composer-token-btn{border:1px solid rgba(255,142,182,.22);background:rgba(255,78,140,.07);color:#ffc6dc;border-radius:999px;padding:.4rem .62rem;font-size:.68rem;font-weight:800;cursor:pointer}
.card-composer{min-height:130px;width:100%;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);color:var(--text);border-radius:12px;padding:12px;font:inherit;outline:none;line-height:1.55;white-space:pre-wrap}
.card-composer:focus{border-color:rgba(255,153,194,.75);box-shadow:0 0 0 3px rgba(255,75,143,.12)}
.card-composer:empty:before{content:attr(data-placeholder);color:#746d7b;pointer-events:none}
.composer-token{display:inline-flex;vertical-align:baseline;align-items:center;border:1px solid rgba(255,160,195,.28);background:linear-gradient(135deg,rgba(255,76,135,.17),rgba(190,91,255,.12));color:#ffd5e6;border-radius:999px;padding:.08rem .45rem;margin:0 .08rem;font-size:.77rem;font-weight:900;white-space:nowrap}
.interaction-builder-fieldset{grid-column:1/-1;border:1px solid rgba(255,255,255,.09);border-radius:16px;padding:.85rem;margin:.8rem 0;background:rgba(255,255,255,.018)}
.interaction-builder-fieldset legend{padding:0 .4rem;font-size:.73rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase;color:#ffb0cc}
.interaction-builder-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
.compact-switch{padding:.65rem!important;margin:0!important}.soft-hidden{display:none!important}
.penalty-topic-grid{margin-top:.75rem;padding-top:.65rem;border-top:1px dashed rgba(255,255,255,.08)}

.card-choice-game{margin:1rem auto 0;width:min(100%,620px);padding:.9rem;border:1px solid rgba(255,144,188,.16);border-radius:18px;background:radial-gradient(circle at 50% 0%,rgba(238,85,150,.10),rgba(18,14,29,.72) 58%);box-shadow:inset 0 1px rgba(255,255,255,.05)}
.choice-game-title{display:grid;gap:.15rem;text-align:center;margin-bottom:.7rem}.choice-game-title>span{font-size:.61rem;font-weight:950;letter-spacing:.17em;color:#ff9abe}.choice-game-title>strong{font-size:1rem;color:#fff3f8}.choice-game-title>small{font-size:.7rem;color:#a99eaf}
.mini-choice-wheel-stage{position:relative;width:min(72vw,280px);aspect-ratio:1;margin:.2rem auto .65rem;display:grid;place-items:center}.mini-choice-wheel{width:100%;height:100%;filter:drop-shadow(0 14px 24px rgba(0,0,0,.4))}.mini-choice-pointer{position:absolute;z-index:3;top:-.25rem;color:#ffd2e4;font-size:1.25rem;text-shadow:0 0 15px rgba(255,90,160,.8)}
.choice-main-btn{width:100%;max-width:420px;margin:.55rem auto 0;display:block;min-height:48px}
.choice-result{display:grid;gap:.25rem;text-align:center;margin:.6rem auto;padding:.75rem;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09)}.choice-result>span{font-size:.6rem;font-weight:950;letter-spacing:.16em;color:#ff9dbd}.choice-result>strong{font-size:1.02rem;line-height:1.35}.choice-result.correct{border-color:rgba(100,229,171,.25)}.choice-result.wrong,.choice-result.penalty{border-color:rgba(255,160,89,.28)}
.secret-choice-grid{display:grid;gap:.5rem}.secret-choice-btn{width:100%;text-align:left;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(255,255,255,.035);color:#f9eff8;padding:.75rem .85rem;font:inherit;font-size:.84rem;font-weight:750;line-height:1.35;cursor:pointer}.secret-choice-btn:active{transform:scale(.99)}.secret-choice-btn.selected{border-color:#ff8fb9;background:rgba(255,82,142,.1)}
.choice-flow-note{text-align:center;color:#c2b6c5;font-size:.76rem;line-height:1.45;margin:.55rem auto;max-width:500px}

/* Keep the live game focused on one action at a time on phones. */
@media(max-width:760px){
  .game-view{padding-inline:.35rem}
  .game-meta{position:sticky;top:56px;z-index:25;padding:.55rem .65rem!important;display:grid!important;grid-template-columns:1fr!important;gap:.45rem!important}
  .game-meta>.journey-stage-wrap{display:block!important}.game-meta>.room-heat{width:100%}.game-meta>.meta-right{display:none!important}
  .level-indicator{grid-template-columns:auto 1fr;max-width:none}.level-indicator>small{font-size:.64rem}
  .wheel-card.is-focus,.activity-wheel-card.is-focus,.play-card.is-focus{min-height:calc(100dvh - 190px);display:grid;align-content:center}
  .wheel-card.is-past,.activity-wheel-card.is-past{min-height:62px;max-height:70px}.play-card.is-past{min-height:72px;max-height:82px;overflow:hidden}
  .activity-wheel-actions{grid-template-columns:1fr 1.25fr}.activity-wheel-actions .btn{min-height:58px;font-size:.76rem}
  .play-card{padding:1rem!important}.prompt-text{font-size:clamp(1.05rem,5vw,1.35rem)!important;line-height:1.45!important}
  .action-grid-three{position:sticky;bottom:max(.35rem,env(safe-area-inset-bottom));z-index:18;background:rgba(8,7,14,.88);padding:.45rem;border-radius:14px;backdrop-filter:blur(12px)}
  .action-grid-three .btn{min-height:48px}
  .recovery-row{grid-template-columns:1fr 1fr}.recovery-row>strong{grid-column:1/-1}.recovery-toggle{justify-self:start}
  .interaction-builder-grid{grid-template-columns:1fr}.composer-token-btn{font-size:.66rem;padding:.42rem .55rem}
  .card-composer{min-height:150px}
}
@media(max-width:480px){
  .level-indicator>small{display:none}.level-indicator>strong{font-size:.92rem}
  .activity-wheel-actions{grid-template-columns:1fr}.mini-choice-wheel-stage{width:min(78vw,260px)}
  .recovery-row{grid-template-columns:1fr}.recovery-row>strong{grid-column:auto}
}

/* v25 final - friendly card workshop presets */
.quick-card-presets{display:flex;flex-wrap:wrap;align-items:center;gap:.42rem;margin:.1rem 0 .55rem;padding:.5rem .58rem;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.025)}
.quick-card-presets>span{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:800;margin-right:.1rem}
.quick-card-btn{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.045);color:#f8edf6;border-radius:999px;padding:.42rem .66rem;font:inherit;font-size:.72rem;font-weight:750;cursor:pointer}
.quick-card-btn:hover,.quick-card-btn:focus-visible{border-color:rgba(255,111,164,.55);background:rgba(255,77,139,.09);outline:none}
@media(max-width:620px){.quick-card-presets{gap:.35rem}.quick-card-btn{flex:1 1 calc(50% - .35rem);text-align:center}.quick-card-presets>span{flex-basis:100%}}


/* ===== v25 audio, timer and card-editor repair ===== */
/* Prevent the generic card-editor input rule from turning checkboxes into full-width bars. */
.card-editor input[type="checkbox"],
.interaction-builder-fieldset input[type="checkbox"]{
  width:18px !important;
  height:18px !important;
  min-width:18px;
  padding:0 !important;
  margin:.1rem 0 0;
  flex:0 0 18px;
}
.interaction-builder-grid{align-items:start}
.compact-switch{
  display:flex !important;
  align-items:flex-start !important;
  gap:.65rem !important;
  min-width:0;
}
.compact-switch>span{display:grid !important;gap:.18rem;min-width:0}
.compact-switch strong,.compact-switch small{white-space:normal;overflow-wrap:anywhere}
.interaction-builder-grid>.editor-field{min-width:0}
.interaction-builder-grid select,.interaction-builder-grid textarea{min-width:0;max-width:100%}

.sound-setting{margin-top:.8rem;padding:.85rem;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.018);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.8rem;align-items:center}
.sound-setting>div:first-child{display:grid;gap:.18rem}.sound-setting small{color:var(--muted);line-height:1.4}
.sound-setting-controls{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-end}
.sound-toggle-row{display:flex;align-items:center;gap:.42rem;padding:.48rem .62rem;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(255,255,255,.03);font-size:.72rem;font-weight:800;white-space:nowrap}
.sound-toggle-row input{width:18px!important;height:18px!important;padding:0!important}
.sound-setting-controls-three{max-width:360px}
.mood-volume-row{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,330px);align-items:center;gap:.8rem;padding:.72rem .76rem;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(255,255,255,.022)}
.mood-volume-row>span:first-child{display:grid;gap:.1rem}.mood-volume-row strong{font-size:.76rem}.mood-volume-row small{font-size:.66rem}
.mood-volume-control{display:grid;grid-template-columns:1fr 48px;align-items:center;gap:.65rem}.mood-volume-control input[type=range]{width:100%;accent-color:#ff6f8f}.mood-volume-control output{font-size:.7rem;font-weight:900;color:#ffd0df;text-align:right;font-variant-numeric:tabular-nums}
.audio-design-note{grid-column:1/-1;display:grid!important;grid-template-columns:34px 1fr!important;gap:.65rem!important;align-items:start!important;padding:.7rem .78rem;border:1px solid rgba(255,112,145,.13);border-radius:12px;background:linear-gradient(135deg,rgba(255,80,122,.055),rgba(186,90,220,.03))}
.audio-design-note>span{display:grid;place-items:center;width:32px;height:32px;border-radius:11px;background:rgba(255,94,132,.1);color:#ff9db4;font-size:.82rem}.audio-design-note p{margin:0;color:var(--muted);font-size:.68rem;line-height:1.45}.audio-design-note strong{color:#ffe9f0;font-size:.72rem}
.sound-mini-btn{width:36px;height:36px;border-radius:999px;border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.04);color:#ffd0df;font-size:1rem;font-weight:900;cursor:pointer;display:grid;place-items:center;padding:0}
.sound-mini-btn.muted{opacity:.5;text-decoration:line-through}

.activity-timer{width:min(100%,560px);margin:.85rem auto 0;padding:.85rem .9rem;border:1px solid rgba(255,134,174,.22);border-radius:16px;background:linear-gradient(135deg,rgba(255,61,118,.075),rgba(190,92,255,.045)),rgba(10,9,18,.64)}
.activity-timer.is-running{border-color:rgba(255,128,161,.4);box-shadow:0 0 24px rgba(255,68,122,.08)}
.activity-timer.is-finished{animation:timerFinishPulse .75s ease 2;border-color:rgba(255,185,129,.58);box-shadow:0 0 30px rgba(255,116,91,.18)}
.activity-timer-head{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem}.activity-timer-label{font-size:.63rem;font-weight:950;letter-spacing:.15em;color:#ffa6c8}.activity-timer-head strong{font-variant-numeric:tabular-nums;font-size:1.45rem;color:#fff4f8}
.activity-timer-track{height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;margin:.55rem 0}.activity-timer-track span{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffad65,#ff526f,#ca5bd6);transition:width .2s linear}
.activity-timer-actions{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:.45rem}.activity-timer-actions .btn{min-height:42px;padding:.55rem .7rem}
.activity-timer>small{display:block;margin-top:.5rem;color:var(--muted);font-size:.68rem;text-align:center}
@keyframes timerFinishPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.012)}}
@media(max-width:700px){.sound-setting{grid-template-columns:1fr}.sound-setting-controls{justify-content:flex-start}.mood-volume-row{grid-template-columns:1fr}.mood-volume-control{grid-template-columns:1fr 46px}.activity-timer-actions{grid-template-columns:1fr 1fr 1fr}.activity-timer-actions .btn{font-size:.72rem}}
@media(max-width:420px){.activity-timer-actions{grid-template-columns:1fr}.activity-timer-actions .btn{min-height:44px}}

/* v26 progression + routing polish */
.stage-progress{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;align-items:center;gap:.5rem;margin-top:.35rem;min-width:0}
.stage-progress::before{content:"";grid-column:1;grid-row:1;height:7px;border-radius:999px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)}
.stage-progress span{grid-column:1;grid-row:1;display:block;height:7px;width:0;border-radius:999px;background:linear-gradient(90deg,#ffb15d,#ff5d72,#cc61df);box-shadow:0 0 16px rgba(255,91,120,.18);transition:width .45s ease}
.stage-progress em{grid-column:2;grid-row:1;font-style:normal;font-size:.62rem;font-weight:900;letter-spacing:.08em;color:#ffc0a5;min-width:34px;text-align:right}
.mode-toggle-btn{appearance:none;border:1px solid rgba(255,255,255,.11);background:rgba(255,255,255,.035);color:#bcb2c4;border-radius:999px;padding:.62rem .8rem;min-height:42px;font:inherit;font-size:.76rem;font-weight:850;cursor:pointer;transition:.18s ease}
.mode-toggle-btn.on{color:#fff4f8;border-color:rgba(255,94,139,.35);background:linear-gradient(135deg,rgba(255,67,116,.16),rgba(188,82,214,.11));box-shadow:0 0 20px rgba(255,67,116,.06)}
.mode-toggle-btn:focus-visible{outline:2px solid #ff789d;outline-offset:2px}
#completeBtn:disabled{opacity:.34;filter:saturate(.55);cursor:not-allowed}
.card-choice-game .activity-timer{margin-top:.65rem}
@media(max-width:600px){.stage-progress{margin-top:.25rem}.mode-toggle-btn{flex:1 1 calc(50% - .5rem);font-size:.72rem;padding:.6rem .55rem}}

/* ===== v26.2 usability pass ===== */
[data-help]{position:relative}
@media (hover:hover) and (pointer:fine){
  [data-help]:hover::after,[data-help]:focus-visible::after{
    content:attr(data-help); position:absolute; z-index:120; left:50%; bottom:calc(100% + 10px); transform:translateX(-50%);
    width:min(310px,72vw); padding:.62rem .72rem; border:1px solid rgba(255,177,90,.28); border-radius:12px;
    background:#11101d; color:#f7f0f5; box-shadow:0 16px 38px rgba(0,0,0,.46); font-size:.72rem; line-height:1.42;
    font-weight:700; letter-spacing:0; text-transform:none; white-space:normal; pointer-events:none;
  }
}

.roulette-guide{margin-top:.8rem;border:1px solid rgba(255,255,255,.085);border-radius:15px;background:rgba(255,255,255,.025);overflow:hidden}
.roulette-guide summary{cursor:pointer;padding:.72rem .82rem;color:#ffd5bf;font-weight:900;font-size:.78rem;list-style:none;display:flex;align-items:center;justify-content:space-between}
.roulette-guide summary::-webkit-details-marker{display:none}
.roulette-guide summary::after{content:'+';font-size:1rem;color:#ffb15a}
.roulette-guide[open] summary::after{content:'−'}
.roulette-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;padding:0 .72rem .75rem}
.roulette-guide-item{padding:.66rem .72rem;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(10,9,18,.45)}
.roulette-guide-item strong{display:block;color:#fff2e9;font-size:.78rem}
.roulette-guide-item p{margin:.22rem 0;color:#c8becb;font-size:.7rem;line-height:1.42}
.roulette-guide-item small{display:block;color:#e6a985;font-size:.65rem;line-height:1.35}
.game-roulette-guide{grid-column:1/-1;margin-top:.15rem}

.multi-partner-setup{margin-top:.9rem;padding:.82rem;border:1px solid rgba(198,92,255,.16);border-radius:15px;background:rgba(198,92,255,.035);display:grid;gap:.62rem}
.multi-partner-head{display:grid;gap:.18rem}.multi-partner-head strong{font-size:.84rem;color:#f8edf8}.multi-partner-head small{font-size:.69rem;color:var(--muted);line-height:1.4}
.multi-partner-people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.48rem}
.multi-partner-toggle{display:flex;align-items:center;gap:.55rem;padding:.58rem .62rem;border:1px solid rgba(255,255,255,.075);border-radius:12px;background:rgba(255,255,255,.025)}
.multi-partner-toggle input{width:19px!important;height:19px!important;padding:0!important;flex:0 0 auto}
.multi-partner-toggle span{display:grid;gap:.08rem;min-width:0}.multi-partner-toggle strong{font-size:.75rem}.multi-partner-toggle small{color:var(--muted);font-size:.65rem}
.multi-partner-toys{border-color:rgba(255,177,90,.16)}

.custom-audio-grid{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.48rem .6rem;padding-top:.25rem}
.custom-audio-picker{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.58rem .66rem;border:1px solid rgba(255,255,255,.075);border-radius:12px;background:rgba(255,255,255,.025)}
.custom-audio-picker>span{display:grid;gap:.12rem;min-width:0}.custom-audio-picker strong{font-size:.74rem}.custom-audio-picker small{font-size:.64rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:390px}
.custom-audio-picker input[type=file]{width:min(220px,42vw);font-size:.66rem;color:var(--muted)}
.custom-audio-note{grid-column:1/-1;color:var(--muted);font-size:.64rem;line-height:1.35}

.how-dialog{width:min(760px,95vw);max-width:none;padding:0;border:0;background:transparent}
.how-dialog::backdrop{background:rgba(4,3,8,.84);backdrop-filter:blur(7px)}
.how-dialog-card{width:100%;max-height:90vh;overflow:auto;display:grid;gap:.85rem;border:1px solid rgba(255,122,101,.22);background:radial-gradient(circle at 90% 0%,rgba(198,92,255,.10),transparent 22rem),#11101d}
.how-steps{display:grid;gap:.5rem}.how-steps article{display:grid;grid-template-columns:34px 1fr;gap:.65rem;padding:.62rem .7rem;border:1px solid rgba(255,255,255,.07);border-radius:13px;background:rgba(255,255,255,.025)}
.how-steps article>b{width:30px;height:30px;border-radius:999px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(255,177,90,.22),rgba(255,63,114,.18));color:#ffd5ad;font-size:.75rem}
.how-steps strong{font-size:.78rem}.how-steps p,.how-key p{margin:.16rem 0 0;color:var(--muted);font-size:.7rem;line-height:1.45}.how-key{padding:.6rem .7rem;border-left:3px solid rgba(255,177,90,.55);background:rgba(255,177,90,.035);border-radius:0 10px 10px 0}.how-key strong{font-size:.76rem;color:#ffe0c2}

@media(max-width:700px){
  .roulette-guide-grid,.multi-partner-people{grid-template-columns:1fr}
  .custom-audio-grid{grid-template-columns:1fr}
  .custom-audio-picker{align-items:flex-start;flex-direction:column}
  .custom-audio-picker input[type=file]{width:100%}
  .custom-audio-grid>.btn{width:100%}
}
.activity-wheel-card.is-past .game-roulette-guide,
.activity-wheel-card.is-future .game-roulette-guide{display:none}
.game-flow-strip{order:1;display:flex;align-items:center;justify-content:center;gap:.42rem;flex-wrap:wrap;padding:.45rem .6rem;border:1px solid rgba(255,255,255,.065);border-radius:14px;background:rgba(255,255,255,.018);color:#958d9d;font-size:.68rem;font-weight:850}
.game-flow-strip span{display:inline-flex;align-items:center;gap:.28rem;padding:.34rem .48rem;border-radius:999px;transition:.2s ease}.game-flow-strip b{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.06);font-size:.62rem}.game-flow-strip i{font-style:normal;opacity:.45}
#gameView[data-phase="player"] .game-flow-strip [data-flow="player"],#gameView[data-phase="activity"] .game-flow-strip [data-flow="activity"],#gameView[data-phase="card"] .game-flow-strip [data-flow="card"],#gameView[data-phase="card"] .game-flow-strip [data-flow="complete"]{color:#fff2e8;background:linear-gradient(135deg,rgba(255,177,90,.12),rgba(255,63,114,.09));box-shadow:inset 0 0 0 1px rgba(255,177,90,.18)}
@media(max-width:620px){.game-flow-strip{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap}.game-flow-strip span{white-space:nowrap}.game-flow-strip i{display:none}}


/* ===== v26.3 player identity / avatar creator ===== */
.player-row { grid-template-columns: 58px minmax(160px,1.35fr) minmax(210px,260px) 42px; align-items:center; }
.player-identity-btn { position:relative; width:58px; height:58px; border-radius:18px; padding:0; overflow:hidden; border:1px solid rgba(255,126,105,.22); background:rgba(8,8,15,.68); display:grid; place-items:center; box-shadow:inset 0 0 0 1px rgba(255,255,255,.025); }
.gender-toggle{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;}
.gender-option{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.65rem .5rem;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(10,10,18,.62);color:#ece5ef;font-weight:800;cursor:pointer;transition:.18s ease;}
.gender-option:hover{border-color:rgba(255,126,105,.32);transform:translateY(-1px)}
.gender-option.selected{box-shadow:0 0 0 1px rgba(255,255,255,.06) inset, 0 10px 24px rgba(255,105,125,.15);}
.gender-option.male.selected{border-color:rgba(118,167,255,.65);background:linear-gradient(180deg,rgba(118,167,255,.18),rgba(118,167,255,.08));}
.gender-option.female.selected{border-color:rgba(255,120,155,.68);background:linear-gradient(180deg,rgba(255,120,155,.2),rgba(255,120,155,.08));}
.gender-option-icon{font-size:1rem;line-height:1;}
.player-identity-btn:hover { border-color:rgba(255,105,125,.58); }
.identity-image, .avatar-preview svg, .player-identity-btn svg { width:100%; height:100%; display:block; object-fit:cover; }
.identity-fallback { width:100%; height:100%; display:grid; place-items:center; font-weight:950; letter-spacing:.04em; color:#fff4ef; background:linear-gradient(145deg,rgba(255,63,114,.34),rgba(110,73,177,.28)); }
.avatar-dialog-card { width:min(980px,calc(100vw - 1.2rem)); max-height:min(92dvh,920px); overflow:auto; overflow-x:hidden; }
.avatar-dialog-head { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; }
.avatar-dialog-head h3 { margin:.2rem 0 .3rem; }
.avatar-editor-layout { display:grid; grid-template-columns:minmax(260px,300px) minmax(0,1fr); gap:1rem; margin-top:1rem; align-items:start; }
.avatar-preview-column { display:grid; align-content:start; justify-items:center; gap:.72rem; padding:1rem; min-width:0; border:1px solid var(--line); border-radius:20px; background:rgba(8,8,15,.5); text-align:center; }
.avatar-preview-large { width:100%; max-width:290px; aspect-ratio:1; border-radius:32px; overflow:hidden; border:1px solid rgba(255,126,105,.26); background:radial-gradient(circle at 50% 35%,rgba(255,122,113,.16),transparent 55%),#11101c; box-shadow:0 18px 46px rgba(0,0,0,.3); }
.avatar-source-tabs { display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem; width:100%; }
.avatar-source-tabs .btn { margin:0; width:auto; }
.avatar-controls { display:grid; gap:.85rem; align-content:start; min-width:0; max-height:min(70dvh,740px); overflow:auto; padding-right:.25rem; }
.avatar-control-section{display:grid;gap:.42rem;padding:.7rem .8rem;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(9,9,16,.44);}
.avatar-control-heading{color:#f4e1dd;font-weight:900;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;}
.avatar-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:.48rem;}
.avatar-choice-grid.color-grid{grid-template-columns:repeat(auto-fit,minmax(105px,1fr));}
.avatar-choice-btn{display:flex;align-items:center;gap:.55rem;padding:.58rem .62rem;border-radius:15px;border:1px solid rgba(255,255,255,.1);background:rgba(13,12,22,.78);color:#efe8ef;font-weight:800;text-align:left;cursor:pointer;transition:.18s ease;min-height:58px;}
.avatar-choice-btn:hover{border-color:rgba(255,126,105,.35);transform:translateY(-1px);}
.avatar-choice-btn.selected{border-color:rgba(255,118,141,.72);background:linear-gradient(180deg,rgba(255,112,136,.18),rgba(255,112,136,.08));box-shadow:0 12px 24px rgba(255,98,128,.12);}
.avatar-choice-icon{position:relative;width:44px;height:44px;border-radius:13px;display:grid;place-items:center;flex:0 0 44px;overflow:hidden;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);}
.avatar-choice-icon-glyph{font-size:1rem;line-height:1;color:#ffe0d8;}
.avatar-choice-swatch{width:16px;height:16px;border-radius:50%;background:var(--swatch);border:1px solid rgba(255,255,255,.35);display:block;box-shadow:0 0 0 2px rgba(0,0,0,.15) inset;}
.avatar-choice-label{font-size:.84rem;line-height:1.15;}
.avatar-controls.disabled { opacity:.42; pointer-events:none; }
.gender-pill{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .8rem;border-radius:999px;font-weight:900;font-size:.8rem;border:1px solid rgba(255,255,255,.12);background:rgba(8,8,15,.6);}
.gender-pill.male{border-color:rgba(118,167,255,.35);color:#cfe0ff;background:rgba(118,167,255,.12);}
.gender-pill.female{border-color:rgba(255,120,155,.35);color:#ffd4de;background:rgba(255,120,155,.12);} 
.avatar-dialog-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:.6rem; margin-top:1rem; }
.avatar-dialog-actions .btn { margin:0; width:auto; }
.selection-identity { min-height:0; display:flex; flex-wrap:wrap; align-items:center; gap:.45rem; margin:.35rem 0 .45rem; }
.selection-person { display:inline-flex; align-items:center; gap:.45rem; padding:.38rem .6rem .38rem .38rem; border:1px solid rgba(255,255,255,.1); border-radius:999px; background:rgba(8,8,15,.52); font-weight:900; }
.selection-person.receiver { border-color:rgba(255,126,105,.3); background:rgba(255,74,107,.07); }
.selection-arrow { color:#ffad8d; font-weight:950; font-size:1rem; }
.selection-person .identity-thumb, .heat-player .identity-thumb { position:relative; width:34px; height:34px; border-radius:50%; overflow:hidden; flex:0 0 auto; border:1px solid rgba(255,255,255,.12); }
.selection-person .identity-thumb .identity-fallback, .heat-player .identity-thumb .identity-fallback { font-size:.72rem; }
.heat-player { grid-template-columns:38px minmax(90px,.9fr) auto; }
.heat-player .identity-thumb { width:38px; height:38px; }
.wheel-winner-id { display:flex; align-items:center; gap:.55rem; margin-top:.55rem; min-height:42px; }
.wheel-winner-id .identity-thumb { position:relative; width:42px; height:42px; border-radius:50%; overflow:hidden; border:1px solid rgba(255,126,105,.25); }
.identity-thumb{position:relative;display:inline-grid;place-items:center;}
.identity-gender-badge{position:absolute;right:2px;bottom:2px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font-size:.7rem;font-weight:900;color:#fff;border:1px solid rgba(255,255,255,.34);box-shadow:0 2px 10px rgba(0,0,0,.35);background:#555;}
.identity-gender-badge.male{background:#76a7ff;}
.identity-gender-badge.female{background:#ff789b;}
@media (max-width:900px){ .player-row{grid-template-columns:54px minmax(140px,1fr) minmax(180px,220px) 42px;} .avatar-editor-layout{grid-template-columns:1fr} .avatar-preview-large{max-width:320px;} }
@media (max-width:620px){ .player-row{grid-template-columns:52px minmax(0,1fr) 42px; gap:.5rem}.player-identity-btn{grid-column:1;grid-row:1 / span 2}.player-row input{grid-column:2}.gender-toggle{grid-column:2}.player-row>.icon-btn{grid-column:3;grid-row:1 / span 2}.avatar-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.selection-person{max-width:100%}.selection-person span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} }

.player-identity-btn::after{content:'✎';position:absolute;right:3px;bottom:3px;width:18px;height:18px;display:grid;place-items:center;border-radius:7px;background:rgba(9,8,16,.88);color:#ffd0b1;font-size:.68rem;border:1px solid rgba(255,255,255,.14);box-shadow:0 2px 8px rgba(0,0,0,.35)}

.avatar-choice-icon svg{width:100%;height:100%;display:block;}

.avatar-preview-large svg{width:100%;height:100%;display:block;}
.avatar-preview-column{position:sticky;top:0;align-self:start;}
@media(max-width:900px){.avatar-preview-column{position:static;}}

/* v26.8 illustrated avatar selector polish */
.avatar-choice-portrait{background:linear-gradient(145deg,rgba(255,122,150,.08),rgba(70,86,138,.08));}
.avatar-choice-portrait svg{transform:scale(1);transform-origin:center;}
.avatar-choice-btn{min-height:64px;}
.avatar-choice-label{font-size:.84rem;}
.avatar-preview-large{width:100%;max-width:290px;}
@media (max-width:620px){.avatar-choice-btn{min-height:60px}.avatar-choice-icon{width:48px;height:48px;flex-basis:48px}}

/* v26.8 hand-drawn avatar art layer */
.avatar-art-layer{
  position:relative;
  width:100%;
  height:100%;
  display:block;
  overflow:hidden;
  background:radial-gradient(circle at 48% 30%,rgba(255,119,150,.10),transparent 62%);
}
.avatar-art-portrait{position:absolute;inset:0;display:block;transform:none;}
.avatar-art-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center 50%;
  transform:none;
}
.avatar-feature-overlay{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  pointer-events:none;
  overflow:visible;
}
.avatar-art-preview .avatar-art-image{object-fit:contain;object-position:center 50%;}
.player-role{display:none;}
.player-row input{min-width:0;}


.avatar-choice-portrait img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 48%;
  transform:none;
}
.avatar-choice-color{display:grid;place-items:center;}
.avatar-choice-swatch-large{
  width:30px;
  height:30px;
  display:block;
  border-radius:50%;
  background:var(--avatar-swatch);
  border:1px solid rgba(255,255,255,.42);
  box-shadow:0 0 0 5px rgba(255,255,255,.06), inset 0 3px 7px rgba(255,255,255,.14), inset 0 -3px 7px rgba(0,0,0,.18);
}
.avatar-preview-large>.avatar-art-layer{border-radius:inherit;}
.player-identity-btn .avatar-art-image,.identity-thumb .avatar-art-image{object-fit:cover;object-position:center 48%;}


.avatar-crop-card{width:min(760px,calc(100vw - 1.2rem));max-height:min(90dvh,860px);overflow:auto;}
.avatar-crop-layout{display:grid;grid-template-columns:minmax(260px,320px) minmax(0,1fr);gap:1rem;align-items:start;margin-top:1rem;}
.avatar-crop-stage-wrap{display:grid;justify-content:center;}
.avatar-crop-stage{position:relative;width:min(74vw,340px);aspect-ratio:1;border-radius:28px;overflow:hidden;background:radial-gradient(circle at 50% 35%,rgba(255,122,113,.12),transparent 55%),#11101c;border:1px solid rgba(255,126,105,.28);box-shadow:0 18px 46px rgba(0,0,0,.28);touch-action:none;cursor:grab;overscroll-behavior:contain;}
.avatar-crop-stage.dragging{cursor:grabbing;}
.avatar-crop-stage img{position:absolute;user-select:none;-webkit-user-drag:none;max-width:none;max-height:none;pointer-events:none;}
.avatar-crop-frame{position:absolute;inset:0;border-radius:28px;box-shadow:0 0 0 200vmax rgba(0,0,0,.20) inset, 0 0 0 2px rgba(255,255,255,.14) inset;pointer-events:none;}
.avatar-crop-frame::before{content:'';position:absolute;inset:16px;border:1px dashed rgba(255,255,255,.38);border-radius:20px;pointer-events:none;}
.avatar-crop-controls{display:grid;gap:.8rem;padding:.95rem 1rem;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(9,9,16,.44);}
.avatar-crop-zoom-row{display:grid;gap:.5rem;}
.crop-label{font-size:.86rem;font-weight:800;color:#f4e1dd;}
.avatar-crop-zoom-buttons{display:flex;flex-wrap:wrap;gap:.55rem;}
.avatar-crop-zoom-buttons .btn{min-width:54px;}
@media (max-width:760px){.avatar-crop-layout{grid-template-columns:1fr}.avatar-crop-stage{width:min(82vw,320px);}}

/* v27.4 simplified player identity: photo, camera, or initials only */
.identity-dialog-card{width:min(760px,calc(100vw - 1.2rem));max-height:min(92dvh,860px);overflow:auto;overflow-x:hidden;}
.identity-photo-layout{display:grid;grid-template-columns:minmax(220px,280px) minmax(0,1fr);gap:1rem;margin-top:1rem;align-items:start;}
.identity-preview-column{position:sticky;top:0;align-self:start;}
.identity-photo-actions{display:grid;gap:1rem;min-width:0;}
.identity-photo-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;}
.identity-action-card{display:grid;grid-template-columns:48px minmax(0,1fr);grid-template-rows:auto auto;column-gap:.75rem;row-gap:.2rem;align-items:center;padding:1rem;border:1px solid rgba(255,255,255,.10);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.015));cursor:pointer;transition:.18s ease;text-align:left;}
.identity-action-card:hover{border-color:rgba(255,118,141,.52);transform:translateY(-1px);box-shadow:0 12px 28px rgba(0,0,0,.18);}
.identity-action-card strong{font-size:.95rem;color:#fff1eb;}
.identity-action-card small{grid-column:2;color:#aaa1ad;line-height:1.35;}
.identity-action-icon{grid-row:1 / span 2;width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(255,108,135,.16),rgba(99,87,176,.13));border:1px solid rgba(255,255,255,.10);font-size:1.4rem;color:#ffd9ce;}
.identity-photo-copy{padding:1rem;border:1px solid rgba(255,255,255,.075);border-radius:18px;background:rgba(9,9,16,.42);}
.identity-photo-copy strong{display:block;margin-bottom:.35rem;color:#f6e7e3;}
.identity-photo-copy p{margin:0;}
.identity-dialog-actions{margin-top:1rem;}
.identity-fallback-large{font-size:4rem;border-radius:inherit;}
.avatar-preview-large .identity-image{width:100%;height:100%;object-fit:cover;display:block;}
@media(max-width:700px){
  .identity-photo-layout{grid-template-columns:1fr;}
  .identity-preview-column{position:static;}
  .identity-photo-action-grid{grid-template-columns:1fr;}
  .avatar-preview-large{max-width:300px;}
}


/* v27.4 re-spin consequence pools */
.reroll-consequence-card{margin-top:1rem;padding:.95rem 1rem;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(9,9,16,.44);}
.reroll-consequence-card>summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:.8rem;font-weight:900;list-style:none;}
.reroll-consequence-card>summary::-webkit-details-marker{display:none;}
.reroll-consequence-card>summary span:first-child{display:grid;gap:.2rem;}
.reroll-consequence-card>summary small{color:var(--muted);font-weight:700;}
.reroll-consequence-editor{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.8rem;margin:.8rem 0;}
.consequence-level-editor{display:grid;gap:.45rem;padding:.72rem;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:rgba(6,6,12,.42);}
.consequence-level-editor>span{display:grid;gap:.18rem;}
.consequence-level-editor strong{color:#fff2e8;}
.consequence-level-editor small{color:var(--muted);font-size:.74rem;}
.consequence-level-editor textarea{min-height:132px;resize:vertical;font-size:.82rem;line-height:1.35;}

/* ===== v27.5 consequence editor and re-spin flow polish ===== */
.reroll-consequence-card{
  overflow:hidden;
}
.reroll-consequence-card > .tiny{
  max-width:74ch;
}
.reroll-consequence-editor{
  display:grid;
  grid-template-columns:1fr;
  gap:.85rem;
  margin:.9rem 0;
}
.consequence-editor-intro{
  display:grid;
  gap:.32rem;
  padding:.8rem .9rem;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(255,177,90,.07),rgba(255,63,114,.045));
}
.consequence-editor-intro strong{color:#fff2e8;font-size:.98rem;}
.consequence-editor-intro span,.consequence-editor-intro small{color:var(--muted);line-height:1.35;}
.consequence-editor-intro code{padding:.08rem .28rem;border-radius:6px;background:rgba(255,255,255,.08);color:#ffe1d4;}
.consequence-level-card{
  border:1px solid rgba(255,255,255,.085);
  border-radius:18px;
  background:rgba(6,6,12,.42);
  overflow:hidden;
}
.consequence-level-card > summary{
  list-style:none;
  cursor:pointer;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:.75rem;
  padding:.85rem .95rem;
}
.consequence-level-card > summary::-webkit-details-marker{display:none;}
.consequence-level-card > summary > span:first-child{display:grid;gap:.2rem;min-width:0;}
.consequence-level-card > summary b{color:#fff2e8;font-size:1rem;}
.consequence-level-card > summary small{color:var(--muted);font-size:.76rem;font-weight:750;}
.consequence-count{font-style:normal;color:#ffccbb;background:rgba(255,126,105,.08);border:1px solid rgba(255,126,105,.18);border-radius:999px;padding:.32rem .58rem;font-size:.72rem;font-weight:900;white-space:nowrap;}
.consequence-level-body{display:grid;gap:.75rem;padding:0 .85rem .85rem;}
.consequence-item-list{display:grid;gap:.65rem;}
.consequence-item{
  display:grid;
  gap:.42rem;
  padding:.7rem;
  border:1px solid rgba(255,255,255,.075);
  border-radius:15px;
  background:rgba(255,255,255,.027);
}
.consequence-item-head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;}
.consequence-number{font-size:.72rem;font-weight:950;color:#ffb99e;letter-spacing:.04em;}
.consequence-item-tools{display:flex;gap:.35rem;flex-wrap:wrap;justify-content:flex-end;}
.btn.micro{min-height:0;padding:.34rem .5rem;border-radius:10px;font-size:.68rem;}
.consequence-item textarea{
  width:100%;
  min-height:64px;
  resize:none;
  overflow:hidden;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.13);
  color:var(--text);
  border-radius:12px;
  padding:.72rem .78rem;
  font:inherit;
  line-height:1.42;
  outline:none;
}
.consequence-item textarea:focus{border-color:rgba(255,153,194,.75);box-shadow:0 0 0 3px rgba(255,75,143,.12);}
.consequence-level-actions{display:flex;gap:.55rem;flex-wrap:wrap;justify-content:flex-start;}
.reroll-flow-card{
  display:grid;
  gap:.7rem;
  padding:.85rem .95rem;
  border:1px solid rgba(255,177,90,.22);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,177,90,.10),rgba(255,63,114,.06));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
}
.reroll-flow-head{display:grid;gap:.2rem;}
.reroll-flow-head span{color:#ffb99e;font-weight:950;letter-spacing:.08em;font-size:.7rem;}
.reroll-flow-head strong{color:#fff4ee;font-size:.96rem;}
.reroll-flow-steps{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;}
.reroll-flow-steps span{display:inline-flex;align-items:center;gap:.35rem;border:1px solid rgba(255,255,255,.11);background:rgba(8,8,15,.42);border-radius:999px;padding:.4rem .62rem;font-size:.76rem;font-weight:850;color:var(--muted);}
.reroll-flow-steps span.active{color:#fff2e8;border-color:rgba(255,177,90,.28);background:rgba(255,177,90,.08);}
.reroll-flow-steps b{display:grid;place-items:center;width:1.25rem;height:1.25rem;border-radius:50%;background:rgba(255,255,255,.08);font-size:.68rem;}
.reroll-flow-steps i{font-style:normal;color:#ffb99e;opacity:.65;}
.reroll-flow-meta{display:flex;gap:.45rem;flex-wrap:wrap;}
.reroll-flow-meta span{border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.035);border-radius:999px;padding:.32rem .55rem;font-size:.72rem;color:var(--muted);font-weight:800;}
.reroll-flow-copy{margin:0;color:#fff1ea;font-size:clamp(1rem,2.3vw,1.18rem);line-height:1.45;}
@media(max-width:620px){
  .consequence-level-card > summary{grid-template-columns:minmax(0,1fr) auto;}
  .consequence-level-card > summary .drawer-chevron{display:none;}
  .consequence-item-head{align-items:flex-start;}
  .consequence-item-tools .btn.micro{font-size:.64rem;padding:.32rem .42rem;}
}

/* ===== v27.7 user-friendly workshop + consequence editor ===== */
.friendly-editor-section{
  display:grid;gap:.8rem;margin:1rem 0;padding:1rem;border:1px solid rgba(255,255,255,.09);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.018));
}
.friendly-editor-heading{display:flex;align-items:flex-start;gap:.7rem;}
.friendly-editor-heading>div{display:grid;gap:.18rem;}
.friendly-editor-heading strong{font-size:.98rem;color:#fff2ea;}
.friendly-editor-heading small{color:var(--muted);line-height:1.35;}
.step-badge{width:28px;height:28px;flex:0 0 28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,rgba(255,91,145,.3),rgba(146,87,255,.28));border:1px solid rgba(255,255,255,.12);font-weight:950;color:#ffd8e7;}
.friendly-pairing-grid{display:grid;grid-template-columns:minmax(220px,.75fr) minmax(280px,1.25fr);gap:.8rem;align-items:stretch;}
.pairing-summary{padding:.72rem .8rem;border-radius:13px;background:rgba(107,84,160,.08);border:1px solid rgba(169,139,255,.18);color:#ddd5ea;font-size:.8rem;line-height:1.4;}
.advanced-editor-details{margin:.8rem 0;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(6,6,12,.3);overflow:hidden;}
.advanced-editor-details>summary{list-style:none;cursor:pointer;padding:.75rem .85rem;font-weight:850;display:flex;gap:.45rem;align-items:center;}
.advanced-editor-details>summary::-webkit-details-marker{display:none;}
.advanced-editor-details>summary small{color:var(--muted);font-weight:700;}
.advanced-editor-details[open]>summary{border-bottom:1px solid rgba(255,255,255,.06);}
.advanced-editor-details>.card-editor-grid,.advanced-editor-details>.editor-field,.advanced-editor-details>.row,.advanced-editor-details>.deck-library-row{margin:.75rem;}
.deck-tools-details{width:100%;}
.deck-tool-buttons{padding:.75rem .75rem 0;}
.friendly-workshop-actions{gap:.8rem;}

.grouped-topic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin-top:.8rem;}
.topic-group-card{border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(7,7,14,.42);overflow:hidden;}
.topic-group-card>summary{display:flex;align-items:center;justify-content:space-between;gap:.55rem;list-style:none;cursor:pointer;padding:.72rem .76rem;}
.topic-group-card>summary::-webkit-details-marker{display:none;}
.topic-group-main{display:flex;align-items:flex-start;gap:.55rem;min-width:0;cursor:pointer;}
.topic-group-main input{width:auto;margin-top:.16rem;flex:0 0 auto;}
.topic-group-main span{display:grid;gap:.14rem;min-width:0;}
.topic-group-main strong{font-size:.8rem;color:#f9eef2;}
.topic-group-main small{font-size:.7rem;line-height:1.3;color:var(--muted);}
.topic-group-card.has-selection{border-color:rgba(255,102,154,.3);background:rgba(255,73,139,.045);}
.topic-group-card.no-details .drawer-chevron{display:none;}
.topic-detail-grid{display:grid;gap:.45rem;padding:.65rem;border-top:1px solid rgba(255,255,255,.06);}
.topic-detail-checkbox{padding:.65rem;background:rgba(255,255,255,.025);}
.topic-detail-checkbox strong{font-size:.74rem;}
.topic-detail-checkbox small{font-size:.68rem;}

.consequence-help-card{display:grid;gap:.28rem;margin:.75rem 0;padding:.75rem .85rem;border-radius:14px;background:rgba(95,73,153,.08);border:1px solid rgba(160,130,255,.17);}
.consequence-help-card strong{color:#f7ecff;}
.consequence-help-card span{font-size:.78rem;line-height:1.4;color:var(--muted);}
.consequence-editor-intro.friendly{grid-column:1/-1;}
.consequence-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:.65rem;}
.consequence-library-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.7rem;padding:.8rem;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025);}
.consequence-library-card.is-disabled{opacity:.52;}
.consequence-library-main{min-width:0;}
.consequence-library-text{font-weight:750;line-height:1.4;color:#f5edf3;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.consequence-library-actions{display:flex;flex-direction:column;gap:.35rem;align-items:stretch;}
.consequence-toolbar{justify-content:space-between;}
.consequence-workshop-dialog{width:min(920px,96vw);max-width:none;border:none;background:transparent;padding:0;color:inherit;}
.consequence-editor-dialog-card{width:100%;max-height:92vh;overflow:auto;padding:22px;background:linear-gradient(180deg,rgba(23,18,43,.99),rgba(10,9,24,.99));border:1px solid rgba(255,255,255,.13);}
.consequence-composer{min-height:120px;}
.consequence-workshop-dialog textarea,.consequence-workshop-dialog select,.consequence-workshop-dialog input{width:100%;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);color:var(--text);border-radius:12px;padding:11px 12px;font:inherit;outline:none;}
.consequence-token-btn{border:1px solid rgba(255,142,182,.22);background:rgba(255,78,140,.07);color:#ffc6dc;border-radius:999px;padding:.4rem .62rem;font-size:.68rem;font-weight:800;cursor:pointer;}

@media(max-width:780px){
  .friendly-pairing-grid,.grouped-topic-grid{grid-template-columns:1fr;}
  .consequence-library-card{grid-template-columns:1fr;}
  .consequence-library-actions{flex-direction:row;flex-wrap:wrap;}
}

/* ===== v27.8 editor stability + media challenges ===== */
.workshop-dialog{overflow:hidden;}
.workshop-dialog-card,.consequence-editor-dialog-card{overflow-y:auto!important;overflow-x:hidden!important;scrollbar-gutter:stable;}
.workshop-head{position:sticky;top:-22px;z-index:18;padding:22px 0 12px;margin-top:-22px;background:linear-gradient(180deg,#17122b 78%,rgba(23,18,43,0));backdrop-filter:blur(8px);}
.workshop-head .icon-btn{position:sticky;top:0;z-index:20;flex:0 0 auto;}
.card-editor-head{position:sticky;top:68px;z-index:12;padding:.7rem 0;background:linear-gradient(180deg,rgba(18,14,35,.98),rgba(18,14,35,.92));border-bottom:1px solid rgba(255,255,255,.06);}
.consequence-workshop-dialog textarea,.consequence-workshop-dialog select,.consequence-workshop-dialog input:not([type="checkbox"]):not([type="radio"]){width:100%;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);color:var(--text);border-radius:12px;padding:11px 12px;font:inherit;outline:none;box-sizing:border-box;}
.consequence-workshop-dialog input[type="checkbox"],.consequence-workshop-dialog input[type="radio"],.topic-group-main input,.topic-detail-checkbox input,.compact-switch input{width:18px!important;height:18px!important;min-width:18px!important;flex:0 0 18px!important;padding:0!important;margin:.12rem 0 0!important;accent-color:#ff4778;}
.friendly-editor-section,.friendly-pairing-grid,.card-editor-grid,.grouped-topic-grid,.topic-group-card,.topic-group-main,.compact-switch,.compact-switch>span{min-width:0;}
.compact-switch{display:grid!important;grid-template-columns:20px minmax(0,1fr)!important;align-items:start!important;gap:.7rem!important;}
.compact-switch>span{width:auto!important;max-width:100%!important;}
.compact-switch strong,.compact-switch small{overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important;}
.grouped-topic-grid{grid-template-columns:repeat(2,minmax(260px,1fr));}
.topic-group-main{display:grid;grid-template-columns:20px minmax(0,1fr);align-items:start;}
.topic-group-main span,.topic-detail-checkbox span{min-width:0;}
.topic-group-main strong,.topic-group-main small,.topic-detail-checkbox strong,.topic-detail-checkbox small{word-break:normal;overflow-wrap:break-word;}
.workshop-toolbar{grid-template-columns:minmax(220px,1.2fr) repeat(4,minmax(140px,.65fr));}
.media-editor-note{display:grid;gap:.2rem;padding:.72rem .8rem;border-radius:13px;background:rgba(65,174,255,.06);border:1px solid rgba(94,176,255,.18);}
.media-editor-note strong{color:#ddecff;font-size:.8rem;}
.media-editor-note span{color:var(--muted);font-size:.74rem;line-height:1.4;}
.media-challenge{display:grid;gap:.7rem;margin-top:.9rem;padding:.9rem;border:1px solid rgba(255,118,154,.22);border-radius:16px;background:linear-gradient(135deg,rgba(255,68,115,.08),rgba(116,80,190,.08));}
.media-challenge-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.8rem;flex-wrap:wrap;}
.media-challenge-head>div{display:grid;gap:.12rem;}
.media-challenge-head span{font-size:.65rem;letter-spacing:.15em;font-weight:950;color:#ffb18e;}
.media-challenge-head strong{font-size:1rem;color:#fff3ed;}
.media-challenge-head small{color:var(--muted);max-width:360px;line-height:1.35;}
.media-challenge-actions{display:flex;gap:.55rem;flex-wrap:wrap;}
.media-challenge-preview{display:grid;gap:.5rem;padding:.55rem;border-radius:13px;background:rgba(0,0,0,.2);}
.media-challenge-preview img,.media-challenge-preview video{width:min(100%,420px);max-height:300px;object-fit:contain;border-radius:10px;background:#08070f;justify-self:center;}
.session-media-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.7rem;margin-top:.65rem;}
.session-media-item{display:grid;gap:.45rem;padding:.55rem;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.025);}
.session-media-item img,.session-media-item video{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:9px;background:#08070f;}
.session-media-meta{display:grid;gap:.15rem;font-size:.7rem;color:var(--muted);}
.session-media-actions{display:flex;gap:.35rem;flex-wrap:wrap;}
.media-gallery-empty{grid-column:1/-1;color:var(--muted);font-size:.78rem;padding:.7rem 0;}
@media(max-width:960px){.workshop-toolbar{grid-template-columns:1fr 1fr}.workshop-search{grid-column:1/-1}.grouped-topic-grid{grid-template-columns:1fr}.workshop-head{top:-15px;padding-top:15px;margin-top:-15px}.card-editor-head{top:58px;}}
@media(max-width:620px){.workshop-toolbar{grid-template-columns:1fr}.workshop-search{grid-column:auto}.workshop-head{align-items:flex-start}.workshop-head .icon-btn{position:absolute;right:0;top:14px}.workshop-head>div{padding-right:54px}.card-editor-head{top:54px}.media-challenge-actions .btn{width:100%;}}

/* ===== v27.9 private test host gate ===== */
.test-gate{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:1rem;background:rgba(5,5,10,.92);backdrop-filter:blur(18px);}
.test-gate.hidden{display:none;}
.test-gate-card{width:min(980px,calc(100vw - 1.5rem));max-height:min(94dvh,980px);overflow:auto;padding:1.2rem;border-radius:24px;border:1px solid rgba(255,126,105,.22);background:linear-gradient(180deg,rgba(24,19,43,.98),rgba(11,10,20,.98));box-shadow:0 30px 90px rgba(0,0,0,.55);}
.test-gate-card h2{margin:.25rem 0 .35rem;}
.test-auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem;}
.test-auth-card{display:grid;gap:.75rem;padding:1rem;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.025);}
.test-auth-card h3{margin:0;}
.test-consent-row{display:grid;grid-template-columns:auto 1fr;gap:.65rem;align-items:start;padding:.8rem;border-radius:14px;background:rgba(255,177,90,.055);border:1px solid rgba(255,177,90,.16);font-size:.76rem;line-height:1.45;color:#ddd4df;}
.test-consent-row input{margin-top:.18rem;width:18px;height:18px;}
@media(max-width:760px){.test-auth-grid{grid-template-columns:1fr}.test-gate-card{padding:1rem}.test-gate{padding:.5rem}}

/* Test-host media status */
.media-uploading{opacity:.78;}
.media-upload-state{font-size:.72rem;color:var(--muted);}
.media-upload-state.good{color:var(--good);}
.media-upload-state.bad{color:#ff889e;}

/* v28.4 universal in-app camera */
.media-challenge{margin-top:.9rem;}
.media-challenge.optional-media{border-color:rgba(255,255,255,.11);background:linear-gradient(135deg,rgba(255,255,255,.035),rgba(116,80,190,.045));}
.media-challenge.required-media{border-color:rgba(255,118,154,.35);background:linear-gradient(135deg,rgba(255,68,115,.10),rgba(116,80,190,.09));}
.media-challenge-actions .media-file-fallback{opacity:.78;}
.card-camera-dialog{padding:0;border:0;background:transparent;max-width:none;max-height:none;}
.card-camera-dialog::backdrop{background:rgba(4,3,9,.82);backdrop-filter:blur(8px);}
.card-camera-card{width:min(760px,calc(100vw - 1rem));max-height:min(94dvh,920px);overflow:auto;}
.card-camera-stage{position:relative;display:grid;place-items:center;min-height:360px;aspect-ratio:4/3;border:1px solid rgba(255,255,255,.10);border-radius:22px;overflow:hidden;background:#06060b;}
.card-camera-stage video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);}
.card-camera-stage.environment video{transform:none;}
.card-camera-idle{position:absolute;inset:0;display:grid;place-items:center;padding:2rem;text-align:center;color:var(--muted);background:radial-gradient(circle at 50% 35%,rgba(255,110,140,.08),transparent 60%),#080710;}
.card-camera-timer{position:absolute;right:14px;top:14px;padding:.48rem .7rem;border-radius:999px;background:rgba(0,0,0,.66);border:1px solid rgba(255,255,255,.15);font-weight:900;font-variant-numeric:tabular-nums;}
.card-camera-recording{position:absolute;left:14px;top:14px;padding:.48rem .7rem;border-radius:999px;background:rgba(150,0,30,.78);border:1px solid rgba(255,95,120,.55);font-weight:950;letter-spacing:.06em;}
.card-camera-actions{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:.9rem;}
.card-camera-actions .btn{min-width:150px;}
@media(max-width:620px){
  .card-camera-card{width:calc(100vw - .5rem);padding:.8rem;}
  .card-camera-stage{min-height:0;aspect-ratio:3/4;}
  .card-camera-actions{display:grid;grid-template-columns:1fr 1fr;}
  .card-camera-actions .btn{min-width:0;width:100%;}
}

/* ===== v28.8 clearer camera actions + retakes ===== */
.media-challenge{
  gap:.82rem;
  padding:1rem;
}
.media-challenge-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(240px,360px);
  align-items:center;
  gap:.8rem 1.1rem;
}
.media-challenge-head>div{min-width:0}
.media-challenge-head small{
  max-width:none;
  justify-self:end;
  text-align:left;
}
.media-capture-primary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.7rem;
}
.media-capture-btn{
  width:100%;
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:.8rem;
  padding:.85rem 1rem;
  border-radius:16px;
  text-align:left;
  border:1px solid rgba(255,116,150,.5);
  background:linear-gradient(135deg,rgba(255,58,111,.26),rgba(126,77,206,.18));
  box-shadow:0 10px 26px rgba(0,0,0,.2),inset 0 0 0 1px rgba(255,255,255,.035);
}
.media-capture-btn:hover{
  border-color:rgba(255,155,177,.82);
  transform:translateY(-1px);
  box-shadow:0 14px 34px rgba(255,62,113,.12),inset 0 0 0 1px rgba(255,255,255,.05);
}
.media-video-btn{
  background:linear-gradient(135deg,rgba(198,92,255,.24),rgba(255,78,121,.18));
  border-color:rgba(198,92,255,.46);
}
.media-capture-icon{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:rgba(8,7,15,.42);
  border:1px solid rgba(255,255,255,.1);
  font-size:1.35rem;
}
.media-capture-copy{
  display:grid;
  gap:.16rem;
  min-width:0;
}
.media-capture-copy strong{
  color:#fff6f3;
  font-size:.92rem;
  line-height:1.15;
}
.media-capture-copy small{
  color:#d8cbd9;
  font-size:.67rem;
  line-height:1.25;
  white-space:normal;
}
.media-capture-secondary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.7rem 1rem;
  padding-top:.05rem;
}
.media-capture-secondary>span{
  color:var(--muted);
  font-size:.67rem;
}
.media-capture-secondary>div{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.45rem;
}
.media-capture-secondary .btn{
  min-height:38px;
  padding:.55rem .8rem;
}
.media-challenge-preview{
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.media-challenge-preview img,.media-challenge-preview video{
  width:100%;
  max-width:420px;
}
@media(max-width:700px){
  .media-challenge-head{grid-template-columns:1fr}
  .media-challenge-head small{justify-self:start}
  .media-capture-primary{grid-template-columns:1fr}
  .media-capture-btn{min-height:72px}
  .media-capture-secondary{align-items:flex-start;flex-direction:column}
  .media-capture-secondary>div{width:100%;justify-content:stretch}
  .media-capture-secondary .btn{flex:1 1 calc(50% - .45rem);text-align:center}
}
\n\n/* ===== v28.9 active-session gallery ===== */\n.game-gallery-btn{display:inline-flex!important;align-items:center;gap:.45rem;border-color:rgba(255,108,143,.34)!important;background:linear-gradient(135deg,rgba(255,72,117,.14),rgba(255,169,102,.08))!important;white-space:nowrap}\n.game-gallery-btn>b{display:inline-grid;place-items:center;min-width:1.45rem;height:1.45rem;padding:0 .38rem;border-radius:999px;background:linear-gradient(135deg,#ff3f79,#ff7766);color:#fff;font-size:.72rem;line-height:1}\n.session-gallery-dialog{width:min(1040px,calc(100vw - 24px));max-width:none;padding:0;border:0;background:transparent;color:inherit}\n.session-gallery-dialog::backdrop{background:rgba(4,3,10,.82);backdrop-filter:blur(8px)}\n.session-gallery-dialog-card{width:100%;max-height:min(88vh,900px);overflow:auto;padding:0 1.05rem 1.05rem;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:linear-gradient(180deg,#171426,#0e0d18);box-shadow:0 28px 80px rgba(0,0,0,.5)}\n.session-gallery-head{position:sticky;top:0;z-index:3;display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.05rem 0 .9rem;background:linear-gradient(180deg,#171426 80%,rgba(23,20,38,0));}\n.session-gallery-head h3{margin:.16rem 0 .18rem}\n.session-gallery-notice{margin:.1rem 0 1rem;padding:.8rem .9rem;border:1px solid rgba(255,127,153,.18);border-radius:14px;background:rgba(255,127,153,.05);line-height:1.5}\n.session-media-gallery-large{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:.9rem}\n.session-media-gallery-large .session-media-item{border-radius:18px;overflow:hidden;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09)}\n.session-media-gallery-large .session-media-item>img,.session-media-gallery-large .session-media-item>video{width:100%;aspect-ratio:1/1;object-fit:cover;background:#05050a}\n.session-media-meta{padding:.7rem .75rem .25rem;display:grid;gap:.15rem;overflow-wrap:anywhere}\n.session-media-meta small{color:var(--muted)}\n.session-media-actions{display:flex;flex-wrap:wrap;gap:.45rem;padding:.55rem .7rem .75rem}\n.session-media-actions .btn{flex:1 1 110px}\n@media(max-width:720px){.game-meta .meta-right{gap:.4rem}.game-gallery-btn{order:-1;width:100%;justify-content:center}.session-gallery-dialog{width:calc(100vw - 12px)}.session-gallery-dialog-card{border-radius:18px;padding:0 .7rem .8rem}.session-media-gallery-large{grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.session-media-actions .btn{flex-basis:100%}}\n@media(max-width:430px){.session-media-gallery-large{grid-template-columns:1fr}}\n\n\n/* ===== v29.1 prominent end-game flow ===== */\n.game-end-btn{display:inline-flex!important;align-items:center;gap:.42rem;border-color:rgba(255,103,125,.34)!important;color:#ff9cab!important;background:rgba(255,74,104,.07)!important;white-space:nowrap}\n.game-end-btn:hover{background:rgba(255,74,104,.13)!important;border-color:rgba(255,103,125,.55)!important}\n.end-game-dialog{width:min(620px,calc(100vw - 24px));max-width:none;padding:0;border:0;background:transparent;color:inherit}\n.end-game-dialog::backdrop{background:rgba(4,3,10,.84);backdrop-filter:blur(8px)}\n.end-game-dialog-card{display:grid;grid-template-columns:auto 1fr;gap:1rem;width:100%;padding:1.25rem;border:1px solid rgba(255,255,255,.11);border-radius:24px;background:linear-gradient(180deg,#191528,#100e1a);box-shadow:0 28px 80px rgba(0,0,0,.55)}\n.end-game-dialog-card h3{margin:.15rem 0 .45rem;font-size:clamp(1.45rem,3.5vw,2rem)}\n.end-game-dialog-card p{margin:0;line-height:1.55}\n.end-game-dialog-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;border:1px solid rgba(255,102,128,.25);background:rgba(255,66,102,.1);color:#ff859b;font-size:1rem}\n.end-game-unsaved{grid-column:1/-1;display:grid;gap:.2rem;padding:.82rem .9rem;border:1px solid rgba(255,169,102,.22);border-radius:14px;background:rgba(255,169,102,.07)}\n.end-game-unsaved strong{color:#ffd0ad}.end-game-unsaved span{color:var(--muted);font-size:.9rem;line-height:1.4}\n.end-game-dialog-actions{grid-column:1/-1;display:grid;grid-template-columns:.8fr 1.25fr 1fr;gap:.65rem;margin-top:.25rem}\n.danger-action{background:linear-gradient(135deg,#ff3f67,#ff6b63)!important;box-shadow:0 10px 28px rgba(255,63,103,.2)}\n@media(max-width:720px){.game-meta .meta-right .game-end-btn{width:100%;justify-content:center;order:0}.end-game-dialog-card{grid-template-columns:1fr;padding:1rem;border-radius:20px}.end-game-dialog-icon{width:42px;height:42px}.end-game-dialog-actions{grid-column:1;grid-template-columns:1fr}.end-game-dialog-actions #endGameConfirmBtn{order:3}.end-game-dialog-actions #endGameReviewGalleryBtn{order:2}.end-game-dialog-actions #endGameCancelBtn{order:1}}\n
/* ===== v29.3 mobile-first game + simplified workshop ===== */
.card-editor-purpose{max-width:760px;margin:.2rem 0 0;line-height:1.45}
.editor-primary-section .card-composer{min-height:150px}
.choice-mechanic-details{margin-top:.7rem;padding:.8rem;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.018)}
.mechanics-master-switch{margin-top:.15rem!important}
.optional-mechanics-section .mechanic-special-grid{margin-top:.65rem}
.compact-advanced-details{margin-top:.7rem}
.editor-finishing-section{display:grid;gap:.75rem}
.sticky-editor-actions{position:sticky;bottom:-1px;z-index:14;padding:.8rem 0 max(.8rem,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(18,14,35,0),rgba(18,14,35,.98) 28%)}
.media-mobile-summary{display:none}

@media(max-width:760px){
  html{font-size:17px;-webkit-text-size-adjust:100%}
  body{font-size:1rem}
  .shell{width:100%;margin:.35rem auto 2rem;padding:0 .38rem}
  .topbar{padding:.5rem .65rem;gap:.5rem;min-height:52px}
  .brand-icon{width:34px;height:34px}.brand-name{font-size:1.12rem}
  .topbar .btn{min-height:40px;padding:.55rem .7rem;font-size:.84rem}

  /* One game scene at a time on a phone. Past/future scenes no longer consume scroll space. */
  .game-view{width:100%;padding:0;gap:.48rem}
  .game-flow-strip{display:none!important}
  .game-view .game-step.is-past,.game-view .game-step.is-future{display:none!important}
  .game-view .game-step.is-focus{display:grid!important;min-height:0!important;max-height:none!important;align-content:start!important;opacity:1!important;transform:none!important;filter:none!important;scroll-margin-top:118px}
  .wheel-card,.activity-wheel-card,.play-card{padding:.78rem!important;border-radius:16px!important}
  .wheel-card,.activity-wheel-card{grid-template-columns:1fr!important}
  .wheel-copy,.activity-wheel-copy{text-align:center}
  .wheel-copy p,.activity-wheel-copy>p{display:none}
  .wheel-copy h3,.activity-wheel-copy h3{font-size:1.12rem!important;line-height:1.25;margin:.15rem 0 .45rem}
  .wheel-stage{width:min(64vw,238px)!important;margin:.15rem auto 0}
  .activity-wheel-stage{width:min(62vw,226px)!important;margin:.15rem auto 0}
  .wheel-pointer,.activity-wheel-pointer{top:-5px}

  /* Compact sticky session header: enough context without taking half the screen. */
  .game-meta{position:sticky!important;top:52px!important;z-index:25;padding:.42rem!important;border-radius:14px!important;display:grid!important;grid-template-columns:1fr!important;gap:.36rem!important;background:rgba(10,9,17,.96)!important}
  .game-meta>.journey-stage-wrap{display:block!important}
  .level-indicator{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:.18rem .55rem!important;padding:.2rem .25rem!important}
  .level-indicator>span{font-size:.66rem!important}.level-indicator>strong{font-size:.95rem!important;line-height:1.05}.level-indicator>small{display:none!important}
  .stage-progress{grid-column:1/-1;height:8px!important;margin-top:.18rem!important}.stage-progress em{font-size:.58rem!important;top:-1.25rem!important}
  .room-heat{grid-template-columns:36px minmax(0,1fr)!important;gap:.45rem!important;padding:.34rem .48rem!important;border-radius:12px!important;min-width:0!important}
  .heat-orb{width:34px!important}.heat-orb span{font-size:.95rem!important}.heat-bubbles{display:none}
  .room-heat-copy{margin-bottom:.2rem!important}.room-heat-copy span{font-size:.62rem!important}.room-heat-copy strong{font-size:1.12rem!important}.room-heat-copy small{font-size:.66rem!important}.room-heat-copy em{font-size:.58rem!important}
  .room-heat-track{height:8px!important}
  .game-meta>.meta-right{display:grid!important;grid-template-columns:1fr 1fr!important;gap:.35rem!important}
  .game-meta>.meta-right .game-gallery-btn,.game-meta>.meta-right .game-end-btn{display:flex!important;width:100%!important;justify-content:center!important;min-height:38px!important;padding:.45rem .55rem!important;font-size:.78rem!important}
  .game-meta>.meta-right .sound-mini-btn,.game-meta>.meta-right .badge,.game-meta>.meta-right #progressText{display:none!important}

  /* Player/card text must be readable without pinch zoom. */
  .selection-identity{gap:.35rem;margin:.25rem 0}.selection-person{font-size:.88rem;padding:.32rem .5rem .32rem .32rem}
  .actor-label{font-size:1rem!important}.target-label{font-size:.95rem;line-height:1.35}
  .card-topics{gap:.3rem}.card-topics .topic-pill{font-size:.68rem}
  .prompt-text{font-size:clamp(1.48rem,7vw,1.9rem)!important;line-height:1.2!important;letter-spacing:-.015em!important;margin:.65rem 0!important}
  .card-choice-game{width:100%;padding:.72rem;margin:.65rem auto 0}.secret-choice-btn{font-size:.92rem;min-height:48px}
  .activity-timer{margin:.65rem 0;padding:.72rem}.activity-timer-display{font-size:1.35rem}.activity-timer-actions{gap:.4rem}.activity-timer-actions .btn{min-height:46px;font-size:.9rem}
  .turn-timer{font-size:.82rem}

  /* Optional camera tools collapse to a single obvious row until requested. */
  details.media-challenge{display:block!important;padding:.65rem .72rem!important;margin-top:.65rem!important;border-radius:14px!important}
  .media-mobile-summary{display:flex;align-items:center;justify-content:space-between;gap:.7rem;list-style:none;cursor:pointer;font-weight:900;font-size:.94rem;color:#fff2f5}
  .media-mobile-summary::-webkit-details-marker{display:none}.media-mobile-summary b{font-size:.68rem;color:#ffb8ca;border:1px solid rgba(255,107,149,.24);padding:.25rem .45rem;border-radius:999px}
  details.media-challenge[open] .media-mobile-summary{margin-bottom:.65rem;padding-bottom:.55rem;border-bottom:1px solid rgba(255,255,255,.07)}
  .media-challenge-head{grid-template-columns:1fr!important;gap:.35rem!important}.media-challenge-head small{font-size:.78rem!important;line-height:1.4}.media-challenge-head>div>span{font-size:.65rem}.media-challenge-head strong{font-size:.95rem}
  .media-capture-primary{grid-template-columns:1fr 1fr!important;gap:.45rem!important}.media-capture-btn{min-height:60px!important;padding:.55rem .62rem!important;gap:.5rem!important}.media-capture-icon{width:36px!important;height:36px!important;flex-basis:36px!important;font-size:1.05rem!important}.media-capture-copy strong{font-size:.85rem!important}.media-capture-copy small{font-size:.62rem!important}
  .media-capture-secondary{display:none!important}
  .media-challenge-preview{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.4rem!important}

  /* Completion controls stay reachable without forcing the whole card to be tall. */
  .action-grid-three{position:sticky!important;bottom:max(.25rem,env(safe-area-inset-bottom))!important;z-index:18!important;grid-template-columns:1fr 1fr 1.15fr!important;gap:.35rem!important;padding:.38rem!important;border-radius:12px!important;background:rgba(8,7,14,.94)!important;backdrop-filter:blur(12px)}
  .game-view[data-phase="card"] .action-grid-three{max-height:none!important}
  .action-grid-three .btn{min-height:46px!important;padding:.56rem .35rem!important;font-size:.76rem!important;line-height:1.1}
  .consent-note{font-size:.68rem!important;padding:.2rem .35rem!important}
  .session-drawer{font-size:.86rem}

  /* Camera modal uses the whole phone cleanly. */
  .card-camera-dialog{width:100vw!important;height:100dvh!important;margin:0!important;max-width:none!important;max-height:none!important}
  .card-camera-card{width:100vw!important;min-height:100dvh!important;max-height:100dvh!important;border-radius:0!important;padding:max(.7rem,env(safe-area-inset-top)) .65rem max(.7rem,env(safe-area-inset-bottom))!important;display:flex;flex-direction:column}
  .card-camera-stage{flex:1 1 auto;min-height:0!important;aspect-ratio:auto!important;border-radius:16px!important}.card-camera-stage video{min-height:0}
  .card-camera-actions{grid-template-columns:1fr 1fr!important;margin-top:.55rem!important}.card-camera-actions .btn{min-height:48px!important;font-size:.86rem!important}.card-camera-status{font-size:.78rem;line-height:1.4}

  /* Card Workshop is a phone editor, not a scaled desktop form. */
  .workshop-dialog{width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important}
  .workshop-dialog-card{width:100%!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important;padding:.7rem!important}
  .workshop-head{top:-.7rem!important;margin-top:-.7rem!important;padding:.8rem 3rem .65rem 0!important}
  .workshop-head h3{font-size:1.32rem!important}.workshop-head p{font-size:.78rem!important;line-height:1.35!important}
  .workshop-toolbar{grid-template-columns:1fr 1fr!important;gap:.4rem!important}.workshop-search{grid-column:1/-1!important}.workshop-toolbar input,.workshop-toolbar select{min-height:44px!important;font-size:.84rem!important;padding:.6rem .65rem!important}
  .friendly-workshop-actions{padding:.6rem!important}.workshop-summary-row{font-size:.86rem}.workshop-list{max-height:none!important;overflow:visible!important}
  .workshop-item{grid-template-columns:28px minmax(0,1fr)!important;padding:.7rem!important;gap:.55rem!important}.workshop-index{width:28px!important;height:28px!important}.workshop-card-title{font-size:.88rem!important;white-space:normal!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.workshop-card-meta,.workshop-topic-row{gap:.25rem!important}.workshop-chip{font-size:.58rem!important;padding:.2rem .4rem!important}.workshop-item-actions{grid-column:1/-1!important;padding-left:0!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important;width:100%}.workshop-item-actions .btn{min-height:38px!important;padding:.4rem!important;font-size:.72rem!important}
  .card-editor{gap:.62rem!important}.card-editor-head{top:-.7rem!important;margin:0 -.05rem!important;padding:.75rem 0 .55rem!important}.card-editor-head h3{font-size:1.28rem!important}.card-editor-purpose{font-size:.75rem!important;line-height:1.35!important}
  .friendly-editor-section{padding:.72rem!important;border-radius:14px!important}.friendly-editor-heading{gap:.55rem!important}.friendly-editor-heading strong{font-size:.92rem!important}.friendly-editor-heading small{font-size:.7rem!important;line-height:1.35!important}.step-badge{width:26px!important;height:26px!important;font-size:.78rem!important}
  .quick-card-presets{padding:.42rem!important}.quick-card-btn{font-size:.68rem!important;padding:.42rem .4rem!important}.composer-toolbar{gap:.32rem!important}.composer-token-btn{font-size:.64rem!important;padding:.42rem .48rem!important}.card-composer{min-height:118px!important;font-size:.95rem!important;line-height:1.48!important;padding:.72rem!important}
  .friendly-pairing-grid,.card-editor-grid,.interaction-builder-grid,.editor-basics-grid{grid-template-columns:1fr!important;gap:.55rem!important}.editor-field span{font-size:.76rem!important}.editor-field input,.editor-field select,.editor-field textarea{font-size:.9rem!important;padding:.65rem .7rem!important;min-height:44px!important}.switch-row{font-size:.82rem!important}.switch-row small{font-size:.68rem!important}
  .pairing-summary{font-size:.72rem!important;line-height:1.4!important;padding:.55rem!important}.advanced-editor-details summary{font-size:.8rem!important;padding:.6rem!important}
  .grouped-topic-grid{grid-template-columns:1fr!important;gap:.45rem!important}.topic-group-card{min-height:0!important;padding:.55rem!important}.topic-group-main{grid-template-columns:20px 1fr auto!important;gap:.45rem!important}.topic-group-main strong{font-size:.82rem!important}.topic-group-main small{font-size:.66rem!important;line-height:1.3!important}
  .sticky-editor-actions{display:grid!important;grid-template-columns:.75fr 1.25fr!important;gap:.5rem!important;margin:0 -.15rem!important;padding:.7rem .15rem max(.7rem,env(safe-area-inset-bottom))!important}.sticky-editor-actions .btn{min-height:48px!important}
}

@media(max-width:430px){
  .media-capture-primary{grid-template-columns:1fr!important}
  .action-grid-three{grid-template-columns:1fr 1fr!important}.action-grid-three #completeBtn{grid-column:1/-1}
  .workshop-toolbar{grid-template-columns:1fr!important}.workshop-search{grid-column:auto!important}
}
.workshop-head-actions{display:flex;align-items:center;gap:.45rem;flex:0 0 auto}
@media(max-width:760px){.workshop-head-actions{position:absolute;right:0;top:.75rem}.workshop-head-actions .icon-btn{position:static!important}.workshop-head-actions>a{display:none}}

/* v29.5 compact activity visuals and Heat Dice */
.activity-graphic{min-height:34px;display:flex;justify-content:center;align-items:center;gap:.55rem;margin:.2rem auto .45rem;opacity:.9;overflow:hidden}
.activity-graphic span{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;font-size:1.1rem;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1);transform-origin:center;animation:hrGraphicPulse 2.7s ease-in-out infinite;animation-delay:calc(var(--i) * 120ms)}
.activity-graphic-v1 span{animation-name:hrGraphicFloat;animation-duration:3.1s}
.activity-graphic-v2 span{animation-name:hrGraphicOrbit;animation-duration:3.4s}
.activity-graphic-v3 span{animation-name:hrGraphicWave;animation-duration:2.4s}
@keyframes hrGraphicPulse{0%,100%{transform:scale(.92);opacity:.62}50%{transform:scale(1.12);opacity:1}}
@keyframes hrGraphicFloat{0%,100%{transform:translateY(3px) rotate(-4deg)}50%{transform:translateY(-4px) rotate(5deg)}}
@keyframes hrGraphicOrbit{0%,100%{transform:translateX(-3px) scale(.96)}50%{transform:translateX(3px) scale(1.08)}}
@keyframes hrGraphicWave{0%,100%{transform:rotate(-7deg) translateY(1px)}50%{transform:rotate(7deg) translateY(-2px)}}
.dice-pool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-top:.8rem}
.dice-card-fields{width:100%;padding:.85rem;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:rgba(255,255,255,.025)}
.heat-dice-preview{display:flex;justify-content:center;gap:.8rem;font-size:2.2rem;margin:.75rem 0}
.heat-dice-preview span{display:grid;place-items:center;width:58px;height:58px;border-radius:15px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);animation:hrDiceTumble 1.8s ease-in-out infinite}
.heat-dice-preview span:nth-child(2){animation-delay:120ms}.heat-dice-preview span:nth-child(3){animation-delay:240ms}
@keyframes hrDiceTumble{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(7deg) translateY(-5px)}}
.dice-result small{display:block;margin-top:.35rem;opacity:.72}
@media(max-width:720px){.dice-pool-grid{grid-template-columns:1fr}.activity-graphic{margin:.05rem auto .25rem}.activity-graphic span{width:30px;height:30px}}
@media(prefers-reduced-motion:reduce){.activity-graphic span,.heat-dice-preview span{animation:none!important}}


/* ===== v29.7 intimacy-first navigation and progressive disappearing UI ===== */
.workshop-nav-btn{
  position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.48rem;
  border-color:rgba(255,125,141,.42);
  background:linear-gradient(135deg,rgba(126,36,72,.9),rgba(86,42,105,.88) 55%,rgba(163,67,74,.88));
  box-shadow:0 8px 26px rgba(118,35,77,.24),inset 0 1px 0 rgba(255,255,255,.08);
}
.workshop-nav-btn::after{content:"";position:absolute;inset:-1px;background:linear-gradient(110deg,transparent 15%,rgba(255,255,255,.13) 45%,transparent 72%);transform:translateX(-130%);transition:transform .5s ease;pointer-events:none}
.workshop-nav-btn:hover::after{transform:translateX(130%)}
.workshop-nav-btn>span:first-child{color:#ffd39b;text-shadow:0 0 14px rgba(255,180,105,.42)}
.workshop-location-note{font-size:.7rem;color:var(--muted);max-width:245px;line-height:1.35;text-align:right}.workshop-location-note b{color:#ffc4b0}
.boundary-safe-action{border-color:rgba(151,201,190,.23)!important;color:#d7f2eb!important}

/* Optional media behaves like a softly promoted memory collector, not a second task. */
.media-mobile-summary{display:flex;align-items:center;justify-content:space-between;gap:.7rem;list-style:none;cursor:pointer;font-weight:900;color:#fff2f5}
.media-mobile-summary::-webkit-details-marker{display:none}
.optional-media{padding:.62rem .72rem!important;background:linear-gradient(135deg,rgba(255,84,125,.055),rgba(120,76,180,.05))!important;border-color:rgba(255,139,164,.16)!important;box-shadow:inset 0 0 28px rgba(255,81,120,.025)}
.optional-media .media-mobile-summary span{display:inline-flex;align-items:center;gap:.35rem;color:#ffd9df}
.optional-media .media-mobile-summary b{font-size:.65rem;color:#f4aebf;border:1px solid rgba(255,107,149,.2);padding:.22rem .42rem;border-radius:999px;background:rgba(255,255,255,.025)}
.optional-media[open]{padding:.78rem!important}
.optional-media[open] .media-mobile-summary{margin-bottom:.6rem;padding-bottom:.55rem;border-bottom:1px solid rgba(255,255,255,.065)}
.optional-media .media-capture-primary{grid-template-columns:1fr 1fr;gap:.48rem}
.optional-media .media-capture-btn{min-height:58px;padding:.52rem .62rem;border-radius:13px}
.optional-media .media-capture-icon{width:34px;height:34px;flex-basis:34px;font-size:1rem}
.optional-media .media-capture-copy strong{font-size:.84rem}.optional-media .media-capture-copy small{font-size:.62rem}
.required-media .media-mobile-summary b{color:#fff0d5;border-color:rgba(255,183,92,.38);background:rgba(255,158,66,.09)}

/* From Reveal onward the interface yields visual space back to the people. */
.game-view.immersive-heat .game-flow-strip{display:none!important}
.game-view.immersive-heat .game-roulette-guide{display:none!important}
.game-view.immersive-heat #levelDescription{display:none}
.game-view.immersive-heat .journey-stage-wrap{opacity:.86}
.game-view.immersive-heat .session-drawer{opacity:.7;transition:opacity .2s ease}
.game-view.immersive-heat .session-drawer[open]{opacity:1}
.game-view.deep-heat .stage-progress{height:5px;opacity:.58}.game-view.deep-heat .stage-progress em{display:none}
.game-view.deep-heat .room-heat-copy em{display:none}.game-view.deep-heat .room-heat{padding:.42rem .55rem}
.game-view.deep-heat .activity-wheel-copy>p{display:none}
.game-view.deep-heat .activity-wheel-card{gap:.55rem}

@media(max-width:760px){
  .top-actions{gap:.35rem}.top-actions .btn{padding:.5rem .58rem!important}
  .workshop-nav-btn span:last-child{display:none}.workshop-nav-btn{width:42px;justify-content:center;padding:.5rem!important}
  .workshop-location-note{display:none}
  .optional-media .media-capture-primary{grid-template-columns:1fr 1fr!important}
}
@media(max-width:430px){.optional-media .media-capture-primary{grid-template-columns:1fr!important}}

/* ===== v29.7.1 weighted skip consequence decision ===== */
.skip-decision-dialog::backdrop{background:rgba(5,3,10,.82);backdrop-filter:blur(10px)}
.skip-decision-card{max-width:560px;border:1px solid rgba(255,126,162,.26);background:linear-gradient(160deg,rgba(35,12,26,.98),rgba(14,10,25,.98));box-shadow:0 30px 90px rgba(0,0,0,.55),0 0 50px rgba(215,58,105,.12)}
.skip-original-preview{margin:16px 0;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09);font-size:1rem;line-height:1.5;color:var(--text)}
.skip-decision-actions{display:grid;grid-template-columns:1.1fr .9fr;gap:10px;margin:18px 0 12px}
@media(max-width:560px){.skip-decision-actions{grid-template-columns:1fr}.skip-decision-card{margin:12px}}