/* 娛樂區桌遊工具 + 封面強化 */

.tm-tools {
  padding: 12px 12px 28px;
  max-width: 720px;
  margin: 0 auto;
}
.tm-tools-input {
  width: 4.5rem;
  font: inherit;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid var(--border, #d6d3d1);
  margin-left: 4px;
}
.tm-tools-textarea {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border, #d6d3d1);
  margin-bottom: 10px;
  resize: vertical;
  min-height: 120px;
}
.tm-tools-muted { color: var(--muted, #64748b); }
.tm-tools-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.9rem;
}

.tm-dice-tray {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0;
  min-height: 56px;
  align-items: center;
}
.tm-dice-face {
  display: inline-grid;
  place-items: center;
  min-width: 48px;
  height: 48px;
  padding: 0 10px;
  border-radius: 12px;
  background: linear-gradient(145deg, #fff, #ecfeff);
  border: 2px solid #0f766e;
  font-weight: 900;
  font-size: 1.25rem;
  color: #115e59;
  box-shadow: 0 2px 0 #0f766e33;
}

.tm-coin-stage {
  display: grid;
  place-items: center;
  margin: 16px 0;
}
.tm-coin-disc {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 2rem;
  font-weight: 900;
  background: #cbd5e1;
  color: #334155;
  border: 4px solid #94a3b8;
  transition: transform 0.25s ease;
}
.tm-coin-disc.is-h {
  background: radial-gradient(circle at 35% 30%, #fde68a, #f59e0b);
  border-color: #b45309;
  color: #78350f;
  transform: rotateY(12deg);
}
.tm-coin-disc.is-t {
  background: radial-gradient(circle at 35% 30%, #e2e8f0, #64748b);
  border-color: #334155;
  color: #0f172a;
  transform: rotateY(-12deg);
}

.tm-timer-display {
  font-size: clamp(2.5rem, 10vw, 3.5rem);
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.06em;
  text-align: center;
  margin: 12px 0 16px;
  color: #0f172a;
}

.tm-score-list { display: grid; gap: 8px; margin-bottom: 12px; }
.tm-score-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 8px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--card-bg, #fff) 90%, #e2e8f0);
  border: 1px solid color-mix(in srgb, var(--border, #d6d3d1) 70%, transparent);
}
.tm-score-name { width: 7rem !important; }
.tm-score-val {
  min-width: 2.5rem;
  text-align: center;
  font-weight: 900;
  font-size: 1.15rem;
}

.tm-wheel-wrap {
  position: relative;
  width: min(100%, 280px);
  margin: 16px auto;
}
.tm-wheel-pointer {
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 16px solid #0f172a;
  z-index: 2;
}
.tm-wheel {
  transition: transform 2.2s cubic-bezier(0.12, 0.75, 0.08, 1);
}
.tm-wheel-disc {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 4px solid #0f172a;
  box-shadow: inset 0 0 0 6px rgba(255,255,255,0.25);
}

/* covers */
.tm-card-cover {
  position: relative;
  overflow: hidden;
}
.tm-card-cover--has-img > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.tm-card-cover__art {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  z-index: 1;
  pointer-events: none;
  opacity: 0.92;
}
.tm-card-cover--has-img .tm-card-cover__art { opacity: 0; }
.tm-card-cover__label {
  position: relative;
  z-index: 2;
}
.tm-cover-svg {
  width: 72%;
  height: 72%;
  max-width: 140px;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,.25));
}

.tm-card-cover--tool-dice {
  background: linear-gradient(145deg, #0f766e, #115e59 55%, #042f2e);
}
.tm-card-cover--tool-coin {
  background: linear-gradient(145deg, #b45309, #78350f 55%, #1c1917);
}
.tm-card-cover--tool-timer {
  background: linear-gradient(145deg, #1e3a8a, #0f172a 60%, #ea580c33);
}
.tm-card-cover--tool-picker {
  background: linear-gradient(145deg, #9d174d, #4c0519);
}
.tm-card-cover--tool-score {
  background: linear-gradient(145deg, #92400e, #1c1917);
}
.tm-card-cover--tool-seats {
  background: linear-gradient(145deg, #0369a1, #0c4a6e);
}
.tm-card-cover--tool-wheel {
  background: linear-gradient(145deg, #4c1d95, #1e1b4b);
}
.tm-card-cover--tool-rng {
  background: linear-gradient(145deg, #334155, #0f172a);
}
.tm-card-cover--tool-dice .tm-card-cover__label,
.tm-card-cover--tool-coin .tm-card-cover__label,
.tm-card-cover--tool-timer .tm-card-cover__label,
.tm-card-cover--tool-picker .tm-card-cover__label,
.tm-card-cover--tool-score .tm-card-cover__label,
.tm-card-cover--tool-seats .tm-card-cover__label,
.tm-card-cover--tool-wheel .tm-card-cover__label,
.tm-card-cover--tool-rng .tm-card-cover__label,
.tm-card-cover--has-img .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 3px rgba(0,0,0,.55);
  background: rgba(15, 23, 42, 0.45);
  padding: 4px 10px;
  border-radius: 999px;
}

/* extra2 game UI */
.tm-slide {
  display: grid;
  gap: 6px;
  width: min(100%, 300px);
  margin: 0 auto;
}
.tm-slide-cell {
  aspect-ratio: 1;
  border: none;
  border-radius: 10px;
  background: #0284c7;
  color: #fff;
  font-weight: 900;
  font-size: 1.25rem;
  cursor: pointer;
}
.tm-slide-cell.is-blank { background: #e0f2fe; cursor: default; }

.tm-mm-guess {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-bottom: 12px;
}
.tm-mm-slot, .tm-mm-dot {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid #44403c;
  display: inline-block;
}
.tm-mm-slot { cursor: pointer; }
.tm-mm-row { display: inline-flex; gap: 4px; align-items: center; }
.tm-mm-slot.c0, .tm-mm-dot.c0 { background: #ef4444; }
.tm-mm-slot.c1, .tm-mm-dot.c1 { background: #22c55e; }
.tm-mm-slot.c2, .tm-mm-dot.c2 { background: #3b82f6; }
.tm-mm-slot.c3, .tm-mm-dot.c3 { background: #eab308; }
.tm-mm-slot.c4, .tm-mm-dot.c4 { background: #a855f7; }
.tm-mm-dot.c5, .tm-mm-slot.c5 { background: #f97316; }

.tm-bo {
  position: relative;
  margin: 0 auto 12px;
  background: #0f172a;
  border-radius: 10px;
  overflow: hidden;
  max-width: 100%;
}
.tm-bo-brick {
  position: absolute;
  background: #38bdf8;
  border-radius: 3px;
}
.tm-bo-paddle {
  position: absolute;
  bottom: 8px;
  height: 10px;
  background: #f8fafc;
  border-radius: 4px;
}
.tm-bo-ball {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fbbf24;
}

.tm-whack {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  width: min(100%, 280px);
  margin: 0 auto;
}
.tm-whack-cell {
  aspect-ratio: 1;
  border: none;
  border-radius: 50%;
  background: #365314;
  color: #fff;
  font-size: 1.5rem;
  font-weight: 900;
  cursor: pointer;
}
.tm-whack-cell.is-on { background: #a3e635; color: #14532d; }

.tm-card-cover--tool-metro { background: linear-gradient(145deg, #475569, #0f172a); }
.tm-card-cover--tool-notes { background: linear-gradient(145deg, #ca8a04, #713f12); }
.tm-card-cover--tool-cards { background: linear-gradient(145deg, #14532d, #052e16); }
.tm-card-cover--tool-counter { background: linear-gradient(145deg, #0f766e, #134e4a); }
.tm-card-cover--dots { background: linear-gradient(145deg, #0369a1, #0c4a6e); }
.tm-card-cover--pour { background: linear-gradient(145deg, #06b6d4, #0e7490); }
.tm-card-cover--rhythm { background: linear-gradient(145deg, #22c55e, #14532d); }
.tm-card-cover--pinball { background: linear-gradient(145deg, #f97316, #7c2d12); }
.tm-card-cover--mathrush { background: linear-gradient(145deg, #eab308, #a16207); }

.tm-card-chip {
  display: inline-grid;
  place-items: center;
  min-width: 42px;
  height: 56px;
  padding: 0 8px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #cbd5e1;
  font-weight: 800;
  font-family: ui-monospace, Consolas, monospace;
}
.tm-life-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 10px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--card-bg, #fff) 90%, #ccfbf1);
  border: 1px solid #99f6e4;
}
.tm-life-val {
  min-width: 3rem;
  text-align: center;
  font-size: 1.5rem;
  font-weight: 900;
}
.tm-metro-pad {
  width: min(100%, 220px);
  aspect-ratio: 1;
  margin: 12px auto;
  border-radius: 50%;
  background: #1e293b;
  transition: background 0.05s linear, transform 0.05s linear;
}
.tm-metro-pad.is-on {
  background: #22c55e;
  transform: scale(1.04);
}

.tm-dots { width: min(100%, 320px); margin: 0 auto; }
.tm-dots-row { display: flex; align-items: center; }
.tm-dots-dot {
  width: 10px; height: 10px; border-radius: 50%; background: #0f172a; flex: 0 0 auto;
}
.tm-dots-h {
  flex: 1; height: 10px; margin: 0 2px; border: none; background: #cbd5e1; cursor: pointer; border-radius: 4px;
}
.tm-dots-v {
  width: 10px; height: 36px; border: none; background: #cbd5e1; cursor: pointer; border-radius: 4px; flex: 0 0 auto;
}
.tm-dots-h.is-on.s1, .tm-dots-v.is-on.s1 { background: #2563eb; }
.tm-dots-h.is-on.s2, .tm-dots-v.is-on.s2 { background: #dc2626; }
.tm-dots-box {
  flex: 1; height: 36px; display: grid; place-items: center; font-weight: 900; color: #64748b;
}
.tm-dots-box.s1 { background: #dbeafe; color: #1d4ed8; }
.tm-dots-box.s2 { background: #fee2e2; color: #b91c1c; }
.tm-dots-vrow { min-height: 36px; }

.tm-pour-jugs { display: flex; gap: 24px; justify-content: center; margin: 16px 0; }
.tm-pour-jug { text-align: center; }
.tm-pour-glass {
  width: 72px; height: 140px; border: 3px solid #0e7490; border-radius: 0 0 12px 12px;
  margin: 0 auto 8px; position: relative; overflow: hidden; background: #ecfeff;
}
.tm-pour-glass > i {
  position: absolute; left: 0; right: 0; bottom: 0; background: #22d3ee; display: block;
}

.tm-rhythm-pad {
  width: min(100%, 220px); aspect-ratio: 1; margin: 16px auto; display: block;
  border: none; border-radius: 50%; background: #14532d; color: #fff;
  font-size: 1.5rem; font-weight: 900; cursor: pointer;
}
.tm-rhythm-pad.is-on { background: #4ade80; color: #14532d; box-shadow: 0 0 0 8px rgba(74,222,128,.35); }

.tm-pin-stage {
  position: relative; width: min(100%, 360px); height: 280px; margin: 0 auto;
  background: #0f172a; border-radius: 12px; overflow: hidden;
}
.tm-pin-target {
  position: absolute; border: none; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fdba74, #ea580c);
  transform: translate(-50%, -50%); cursor: pointer;
}

.tm-math-q {
  text-align: center; font-size: 1.75rem; font-weight: 900; margin: 16px 0;
}


.tm-card-cover--slider { background: linear-gradient(145deg, #0369a1, #0c4a6e); }
.tm-card-cover--rps { background: linear-gradient(145deg, #c026d3, #701a75); }
.tm-card-cover--mastermind { background: linear-gradient(145deg, #57534e, #1c1917); }
.tm-card-cover--breakout { background: linear-gradient(145deg, #2563eb, #1e3a8a); }
.tm-card-cover--dicewar { background: linear-gradient(145deg, #ea580c, #9a3412); }
.tm-card-cover--whack { background: linear-gradient(145deg, #65a30d, #3f6212); }
.tm-card-cover--slider .tm-card-cover__label,
.tm-card-cover--rps .tm-card-cover__label,
.tm-card-cover--mastermind .tm-card-cover__label,
.tm-card-cover--breakout .tm-card-cover__label,
.tm-card-cover--dicewar .tm-card-cover__label,
.tm-card-cover--whack .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-card-cover--simon { background: linear-gradient(145deg, #7c3aed, #312e81); }
.tm-card-cover--match3 { background: linear-gradient(145deg, #f472b6, #9d174d); }
.tm-card-cover--catch { background: linear-gradient(145deg, #38bdf8, #075985); }
.tm-card-cover--oddone { background: linear-gradient(145deg, #facc15, #a16207); }
.tm-card-cover--penalty { background: linear-gradient(145deg, #22c55e, #14532d); }
.tm-card-cover--tool-teams { background: linear-gradient(145deg, #14b8a6, #be123c); }
.tm-card-cover--simon .tm-card-cover__label,
.tm-card-cover--match3 .tm-card-cover__label,
.tm-card-cover--catch .tm-card-cover__label,
.tm-card-cover--oddone .tm-card-cover__label,
.tm-card-cover--penalty .tm-card-cover__label,
.tm-card-cover--tool-teams .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-simon {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  width: min(100%, 280px);
  margin: 12px auto;
}
.tm-simon-pad {
  aspect-ratio: 1;
  border: none;
  border-radius: 16px;
  cursor: pointer;
  opacity: 0.55;
  transition: opacity 0.08s linear, transform 0.08s linear;
}
.tm-simon-pad.c0 { background: #ef4444; border-radius: 16px 4px 4px 4px; }
.tm-simon-pad.c1 { background: #3b82f6; border-radius: 4px 16px 4px 4px; }
.tm-simon-pad.c2 { background: #22c55e; border-radius: 4px 4px 4px 16px; }
.tm-simon-pad.c3 { background: #eab308; border-radius: 4px 4px 16px 4px; }
.tm-simon-pad.is-on { opacity: 1; transform: scale(1.04); box-shadow: 0 0 0 4px rgba(255,255,255,.35); }
.tm-simon-pad:disabled { cursor: default; }

.tm-m3 {
  display: grid;
  gap: 4px;
  width: min(100%, 360px);
  margin: 0 auto;
}
.tm-m3-cell {
  aspect-ratio: 1;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}
.tm-m3-cell.is-sel { outline: 3px solid #0f172a; outline-offset: -2px; }
.tm-m3-cell.c1 { background: #ef4444; }
.tm-m3-cell.c2 { background: #22c55e; }
.tm-m3-cell.c3 { background: #3b82f6; }
.tm-m3-cell.c4 { background: #eab308; }
.tm-m3-cell.c5 { background: #a855f7; }
.tm-m3-cell.c6 { background: #f97316; }

.tm-catch {
  position: relative;
  margin: 0 auto 12px;
  max-width: 100%;
  background: linear-gradient(180deg, #0c4a6e, #082f49);
  border-radius: 12px;
  overflow: hidden;
}
.tm-catch-paddle {
  position: absolute;
  bottom: 10px;
  height: 12px;
  border-radius: 8px;
  background: #f8fafc;
}
.tm-catch-ball {
  position: absolute;
  width: 14px;
  height: 14px;
  margin-left: -7px;
  border-radius: 50%;
  background: #fb923c;
  box-shadow: 0 0 8px rgba(251, 146, 60, 0.6);
}

.tm-odd {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  width: min(100%, 300px);
  margin: 0 auto;
}
.tm-odd-cell {
  aspect-ratio: 1;
  border: 2px solid #ca8a04;
  border-radius: 12px;
  background: #fef9c3;
  font-size: 1.5rem;
  font-weight: 900;
  color: #854d0e;
  cursor: pointer;
}

.tm-teams-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.tm-team-block {
  padding: 10px 12px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--card-bg, #fff) 88%, #99f6e4);
  border: 1px solid #5eead4;
}
.tm-team-block h4 {
  margin: 0 0 6px;
  font-size: 0.95rem;
}
.tm-team-block ul {
  margin: 0;
  padding-left: 1.1rem;
}

.tm-card-cover--hangman { background: linear-gradient(145deg, #78716c, #292524); }
.tm-card-cover--wordle { background: linear-gradient(145deg, #22c55e, #14532d); }
.tm-card-cover--blackjack { background: linear-gradient(145deg, #166534, #052e16); }
.tm-card-cover--flyer { background: linear-gradient(145deg, #38bdf8, #0369a1); }
.tm-card-cover--tool-stack { background: linear-gradient(145deg, #f59e0b, #92400e); }
.tm-card-cover--hangman .tm-card-cover__label,
.tm-card-cover--wordle .tm-card-cover__label,
.tm-card-cover--blackjack .tm-card-cover__label,
.tm-card-cover--flyer .tm-card-cover__label,
.tm-card-cover--tool-stack .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-hm-word {
  text-align: center;
  font-size: 1.75rem;
  font-weight: 900;
  letter-spacing: 0.2em;
  margin: 16px 0;
  font-family: ui-monospace, Consolas, monospace;
}
.tm-hm-keys {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
}
.tm-hm-key {
  min-width: 2rem;
  height: 2rem;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  font-weight: 700;
  cursor: pointer;
}
.tm-hm-key:disabled { opacity: 0.4; cursor: default; }

.tm-wd { width: min(100%, 280px); margin: 0 auto 12px; display: grid; gap: 6px; }
.tm-wd-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.tm-wd-cell {
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: 2px solid #cbd5e1;
  border-radius: 6px;
  font-weight: 900;
  font-size: 1.1rem;
  background: #fff;
  text-transform: uppercase;
}
.tm-wd-cell.is-g { background: #22c55e; border-color: #16a34a; color: #fff; }
.tm-wd-cell.is-y { background: #eab308; border-color: #ca8a04; color: #fff; }
.tm-wd-cell.is-x { background: #64748b; border-color: #475569; color: #fff; }

.tm-bj-hand { margin: 12px 0; }
.tm-bj-label { font-weight: 800; margin-bottom: 6px; }
.tm-bj-cards { display: flex; flex-wrap: wrap; gap: 8px; }
.tm-bj-card {
  min-width: 48px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #cbd5e1;
  font-weight: 800;
  font-family: ui-monospace, Consolas, monospace;
}
.tm-bj-card.is-back { background: #14532d; color: #bbf7d0; }

.tm-fly {
  position: relative;
  margin: 0 auto 8px;
  max-width: 100%;
  background: linear-gradient(180deg, #7dd3fc, #bae6fd 70%, #86efac);
  border-radius: 12px;
  overflow: hidden;
}
.tm-fly-bird {
  position: absolute;
  left: 48px;
  width: 18px;
  height: 18px;
  border-radius: 50% 50% 40% 40%;
  background: #facc15;
  box-shadow: inset -3px -2px 0 #ca8a04;
}
.tm-fly-pipe {
  position: absolute;
  width: 36px;
  background: #16a34a;
  border: 2px solid #14532d;
  box-sizing: border-box;
}
.tm-fly-pipe.top { top: 0; border-radius: 0 0 6px 6px; }
.tm-fly-pipe.bot { border-radius: 6px 6px 0 0; }

.tm-card-cover--type { background: linear-gradient(145deg, #14b8a6, #0f766e); }
.tm-card-cover--colormix { background: linear-gradient(145deg, #f472b6, #3b82f6); }
.tm-card-cover--maze { background: linear-gradient(145deg, #60a5fa, #1e3a8a); }
.tm-card-cover--tool-init { background: linear-gradient(145deg, #64748b, #1e293b); }
.tm-card-cover--type .tm-card-cover__label,
.tm-card-cover--colormix .tm-card-cover__label,
.tm-card-cover--maze .tm-card-cover__label,
.tm-card-cover--tool-init .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-type-line {
  display: flex;
  flex-wrap: wrap;
  gap: 1px;
  justify-content: center;
  font-family: ui-monospace, Consolas, monospace;
  font-size: 1.15rem;
  font-weight: 700;
  margin: 16px 0;
  line-height: 1.6;
}
.tm-type-ch.is-ok { color: #16a34a; }
.tm-type-ch.is-bad { color: #dc2626; background: #fee2e2; }
.tm-type-ch.is-cur { outline: 2px solid #2563eb; outline-offset: 1px; border-radius: 2px; }
.tm-type-input { width: min(100%, 420px); display: block; margin: 0 auto; }

.tm-cmix-swatches {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 12px 0;
}
.tm-cmix-sw {
  aspect-ratio: 1.4;
  border-radius: 12px;
  border: 2px solid #e2e8f0;
  display: flex;
  align-items: flex-end;
  padding: 8px;
}
.tm-cmix-sw span {
  background: rgba(15,23,42,.55);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 800;
  padding: 2px 8px;
  border-radius: 999px;
}
.tm-cmix-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0;
  font-weight: 800;
}
.tm-cmix-row input { flex: 1; }

.tm-maze {
  display: grid;
  gap: 1px;
  width: min(100%, 360px);
  margin: 0 auto 12px;
  background: #1e3a8a;
  padding: 4px;
  border-radius: 8px;
}
.tm-maze-cell {
  aspect-ratio: 1;
  background: #eff6ff;
}
.tm-maze-cell.is-wall { background: #1e3a8a; }
.tm-maze-cell.is-you { background: #facc15; border-radius: 50%; }
.tm-maze-cell.is-exit { background: #4ade80; }

.tm-init-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  margin: 6px 0;
  border-radius: 10px;
  border: 1px solid #cbd5e1;
  background: color-mix(in srgb, var(--card-bg, #fff) 92%, #e2e8f0);
}
.tm-init-row.is-on {
  border-color: #2563eb;
  background: color-mix(in srgb, var(--card-bg, #fff) 85%, #bfdbfe);
}

.tm-card-cover--hilow { background: linear-gradient(145deg, #dc2626, #7f1d1d); }
.tm-card-cover--pong { background: linear-gradient(145deg, #22d3ee, #0e7490); }
.tm-card-cover--clicker { background: linear-gradient(145deg, #a855f7, #4c1d95); }
.tm-card-cover--tool-vote { background: linear-gradient(145deg, #14b8a6, #ea580c); }
.tm-card-cover--hilow .tm-card-cover__label,
.tm-card-cover--pong .tm-card-cover__label,
.tm-card-cover--clicker .tm-card-cover__label,
.tm-card-cover--tool-vote .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-hl-card {
  width: min(100%, 140px);
  aspect-ratio: 0.7;
  margin: 16px auto;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: #fff;
  border: 2px solid #fecaca;
  font-size: 2.5rem;
  font-weight: 900;
  color: #b91c1c;
  box-shadow: 0 8px 24px rgba(185, 28, 28, 0.15);
}

.tm-pong {
  position: relative;
  margin: 0 auto 12px;
  max-width: 100%;
  background: #0f172a;
  border-radius: 12px;
  overflow: hidden;
}
.tm-pong-paddle {
  position: absolute;
  height: 10px;
  border-radius: 6px;
  background: #e2e8f0;
}
.tm-pong-paddle.ai { top: 8px; background: #67e8f9; }
.tm-pong-paddle.you { bottom: 8px; background: #f8fafc; }
.tm-pong-ball {
  position: absolute;
  width: 12px;
  height: 12px;
  margin-left: -6px;
  margin-top: -6px;
  border-radius: 50%;
  background: #fbbf24;
}

.tm-click-pad {
  display: block;
  width: min(100%, 240px);
  aspect-ratio: 1;
  margin: 16px auto;
  border: none;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #c084fc, #7c3aed 55%, #4c1d95);
  color: #fff;
  font-size: 1.5rem;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(124, 58, 237, 0.35);
}
.tm-click-pad:disabled { opacity: 0.55; cursor: default; }
.tm-click-pad:not(:disabled):active { transform: scale(0.96); }

.tm-vote-row {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  gap: 8px;
  align-items: center;
  margin: 10px 0;
}
.tm-vote-bar {
  grid-column: 1 / -1;
  height: 8px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.tm-vote-bar > i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #14b8a6, #f97316);
}

.tm-card-cover--numseq { background: linear-gradient(145deg, #6366f1, #312e81); }
.tm-card-cover--ships { background: linear-gradient(145deg, #0ea5e9, #0c4a6e); }
.tm-card-cover--fruits { background: linear-gradient(145deg, #84cc16, #3f6212); }
.tm-card-cover--truth { background: linear-gradient(145deg, #fb7185, #0d9488); }
.tm-card-cover--tool-nametag { background: linear-gradient(145deg, #5eead4, #0f766e); }
.tm-card-cover--tool-multitimer { background: linear-gradient(145deg, #86efac, #ea580c); }
.tm-card-cover--numseq .tm-card-cover__label,
.tm-card-cover--ships .tm-card-cover__label,
.tm-card-cover--fruits .tm-card-cover__label,
.tm-card-cover--truth .tm-card-cover__label,
.tm-card-cover--tool-nametag .tm-card-cover__label,
.tm-card-cover--tool-multitimer .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-ns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  width: min(100%, 280px);
  margin: 12px auto;
}
.tm-ns-pad {
  aspect-ratio: 1;
  border: none;
  border-radius: 12px;
  background: #312e81;
  color: #e0e7ff;
  font-size: 1.25rem;
  font-weight: 900;
  cursor: pointer;
  opacity: 0.65;
}
.tm-ns-pad.is-on { opacity: 1; background: #818cf8; color: #fff; transform: scale(1.04); }
.tm-ns-pad:disabled { cursor: default; }

.tm-ships {
  display: grid;
  gap: 4px;
  width: min(100%, 320px);
  margin: 0 auto;
}
.tm-ship-cell {
  aspect-ratio: 1;
  border: none;
  border-radius: 6px;
  background: #0c4a6e;
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}
.tm-ship-cell.is-hit { background: #ef4444; }
.tm-ship-cell.is-miss { background: #64748b; }
.tm-ship-cell:disabled { cursor: default; }

.tm-fruit-stage {
  position: relative;
  margin: 0 auto 12px;
  max-width: 100%;
  background: linear-gradient(180deg, #bbf7d0, #86efac 70%, #4ade80);
  border-radius: 12px;
  overflow: hidden;
}
.tm-fruit-basket {
  position: absolute;
  bottom: 8px;
  height: 14px;
  border-radius: 8px;
  background: #78350f;
}
.tm-fruit {
  position: absolute;
  width: 16px;
  height: 16px;
  margin-left: -8px;
  border-radius: 50%;
}
.tm-fruit.is-good { background: #f97316; }
.tm-fruit.is-bad { background: #7f1d1d; border-radius: 2px; }

.tm-truth-card {
  min-height: 120px;
  padding: 16px;
  border-radius: 16px;
  background: color-mix(in srgb, var(--card-bg, #fff) 88%, #fda4af);
  border: 1px solid #fb7185;
  text-align: center;
}
.tm-truth-card p {
  margin: 10px 0 0;
  font-size: 1.15rem;
  font-weight: 700;
}

.tm-nt-card {
  margin-top: 16px;
  padding: 28px 16px;
  border-radius: 16px;
  background: linear-gradient(145deg, #ecfdf5, #ccfbf1);
  border: 2px solid #14b8a6;
  text-align: center;
}
.tm-nt-name {
  margin: 0;
  font-size: clamp(2rem, 8vw, 3.5rem);
  font-weight: 900;
  color: #0f766e;
  word-break: break-word;
}

.tm-mt-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 10px;
  margin: 8px 0;
  border-radius: 12px;
  border: 1px solid #cbd5e1;
}

.tm-card-cover--blocks { background: linear-gradient(145deg, #6366f1, #1e1b4b); }
.tm-card-cover--balloons { background: linear-gradient(145deg, #38bdf8, #f472b6); }
.tm-card-cover--buzzer { background: linear-gradient(145deg, #facc15, #b91c1c); }
.tm-card-cover--tool-pass { background: linear-gradient(145deg, #a78bfa, #4c1d95); }
.tm-card-cover--blocks .tm-card-cover__label,
.tm-card-cover--balloons .tm-card-cover__label,
.tm-card-cover--buzzer .tm-card-cover__label,
.tm-card-cover--tool-pass .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-blk {
  display: grid;
  gap: 1px;
  width: min(100%, 240px);
  margin: 0 auto 12px;
  background: #0f172a;
  padding: 4px;
  border-radius: 8px;
}
.tm-blk-cell { aspect-ratio: 1; background: #1e293b; border-radius: 2px; }
.tm-blk-cell.is-on { background: #22d3ee; }
.tm-blk-cell.c1 { background: #22d3ee; }
.tm-blk-cell.c2 { background: #a78bfa; }
.tm-blk-cell.c3 { background: #f472b6; }
.tm-blk-cell.c4 { background: #facc15; }
.tm-blk-cell.c5 { background: #4ade80; }
.tm-blk-cell.c6 { background: #fb923c; }

.tm-bal-stage {
  position: relative;
  width: min(100%, 360px);
  height: 260px;
  margin: 0 auto;
  background: linear-gradient(180deg, #bae6fd, #e0f2fe);
  border-radius: 12px;
  overflow: hidden;
}
.tm-bal {
  position: absolute;
  width: 44px;
  height: 56px;
  margin-left: -22px;
  margin-top: -28px;
  border: none;
  border-radius: 50% 50% 50% 50% / 45% 45% 55% 55%;
  cursor: pointer;
  box-shadow: inset -6px -8px 0 rgba(0,0,0,.12);
}
.tm-bal.c1 { background: #ef4444; }
.tm-bal.c2 { background: #3b82f6; }
.tm-bal.c3 { background: #22c55e; }
.tm-bal.c4 { background: #eab308; }
.tm-bal.c5 { background: #a855f7; }

.tm-buz-pad {
  display: block;
  width: min(100%, 220px);
  aspect-ratio: 1;
  margin: 16px auto;
  border: none;
  border-radius: 50%;
  font-size: 1.35rem;
  font-weight: 900;
  color: #fff;
  cursor: pointer;
}
.tm-buz-pad.is-idle { background: #64748b; }
.tm-buz-pad.is-wait { background: #b91c1c; }
.tm-buz-pad.is-go { background: #16a34a; box-shadow: 0 0 0 10px rgba(22,163,74,.25); }
.tm-buz-pad.is-early { background: #ea580c; }

.tm-pass-card {
  margin-top: 16px;
  padding: 24px 16px;
  border-radius: 16px;
  text-align: center;
  background: linear-gradient(145deg, #f5f3ff, #ede9fe);
  border: 2px solid #8b5cf6;
}

.tm-card-cover--putt { background: linear-gradient(145deg, #4ade80, #166534); }
.tm-card-cover--shop { background: linear-gradient(145deg, #f59e0b, #9a3412); }
.tm-card-cover--solitaire { background: linear-gradient(145deg, #166534, #14532d); }
.tm-card-cover--tool-auction { background: linear-gradient(145deg, #b45309, #7c2d12); }
.tm-card-cover--putt .tm-card-cover__label,
.tm-card-cover--shop .tm-card-cover__label,
.tm-card-cover--solitaire .tm-card-cover__label,
.tm-card-cover--tool-auction .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-putt-fairway {
  position: relative;
  height: 64px;
  margin: 16px 0;
  border-radius: 12px;
  background: linear-gradient(180deg, #86efac, #22c55e);
  border: 2px solid #166534;
}
.tm-putt-ball {
  position: absolute;
  top: 22px;
  width: 16px;
  height: 16px;
  margin-left: -8px;
  border-radius: 50%;
  background: #f8fafc;
  box-shadow: 0 2px 4px rgba(0,0,0,.25);
}
.tm-putt-hole {
  position: absolute;
  top: 20px;
  width: 20px;
  height: 20px;
  margin-left: -10px;
  border-radius: 50%;
  background: #0f172a;
  box-shadow: inset 0 0 0 3px #f8fafc;
}

.tm-shop-stall {
  display: block;
  width: min(100%, 260px);
  margin: 16px auto;
  padding: 28px 16px;
  border: none;
  border-radius: 16px;
  background: linear-gradient(145deg, #fdba74, #ea580c);
  color: #fff;
  font-size: 1.35rem;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(234, 88, 12, 0.3);
}
.tm-shop-stall:disabled { opacity: 0.6; cursor: default; }

.tm-war-row {
  display: flex;
  justify-content: center;
  gap: 24px;
  margin: 16px 0;
}

.tm-life-row.is-lead {
  border-color: #f59e0b;
  background: color-mix(in srgb, var(--card-bg, #fff) 85%, #fde68a);
}

.tm-card-cover--invaders { background: linear-gradient(145deg, #7c3aed, #1e1b4b); }
.tm-card-cover--scramble { background: linear-gradient(145deg, #c084fc, #5b21b6); }
.tm-card-cover--tower { background: linear-gradient(145deg, #34d399, #065f46); }
.tm-card-cover--tool-rules { background: linear-gradient(145deg, #fde68a, #92400e); }
.tm-card-cover--invaders .tm-card-cover__label,
.tm-card-cover--scramble .tm-card-cover__label,
.tm-card-cover--tower .tm-card-cover__label,
.tm-card-cover--tool-rules .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-inv {
  position: relative;
  margin: 0 auto 12px;
  max-width: 100%;
  background: #0f172a;
  border-radius: 12px;
  overflow: hidden;
}
.tm-inv-p {
  position: absolute;
  bottom: 8px;
  width: 24px;
  height: 14px;
  background: #22d3ee;
  border-radius: 4px;
}
.tm-inv-e {
  position: absolute;
  width: 18px;
  height: 14px;
  margin-left: -9px;
  background: #a3e635;
  border-radius: 3px;
}
.tm-inv-b {
  position: absolute;
  width: 4px;
  height: 10px;
  margin-left: -2px;
  background: #fbbf24;
}

.tm-tw {
  position: relative;
  margin: 0 auto 12px;
  max-width: 100%;
  background: #ecfdf5;
  border-radius: 12px;
  overflow: hidden;
  border: 2px solid #10b981;
  cursor: crosshair;
}
.tm-tw-path {
  position: absolute;
  left: 0; right: 0;
  top: 42%;
  height: 28px;
  background: #a7f3d0;
}
.tm-tw-tower {
  position: absolute;
  width: 22px;
  height: 22px;
  margin-left: -11px;
  margin-top: -11px;
  border-radius: 6px;
  background: #0f766e;
  box-shadow: 0 0 0 40px rgba(15, 118, 110, 0.12);
}
.tm-tw-creep {
  position: absolute;
  width: 14px;
  height: 14px;
  margin-top: -7px;
  border-radius: 50%;
  background: #ef4444;
}

.tm-card-cover--balance { background: linear-gradient(145deg, #d6d3d1, #78716c); }
.tm-card-cover--darts { background: linear-gradient(145deg, #ef4444, #7f1d1d); }
.tm-card-cover--traffic { background: linear-gradient(145deg, #22c55e, #b91c1c); }
.tm-card-cover--tool-roles { background: linear-gradient(145deg, #a78bfa, #4c1d95); }
.tm-card-cover--balance .tm-card-cover__label,
.tm-card-cover--darts .tm-card-cover__label,
.tm-card-cover--traffic .tm-card-cover__label,
.tm-card-cover--tool-roles .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-bal-scale {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 8px;
  margin: 24px auto;
  width: min(100%, 320px);
  transition: transform 0.2s ease;
}
.tm-bal-pan {
  width: 90px;
  height: 70px;
  border-radius: 8px;
  background: #e7e5e4;
  border: 2px solid #78716c;
  display: grid;
  place-items: center;
  font-size: 1.5rem;
  font-weight: 900;
}
.tm-bal-fulcrum {
  width: 16px;
  height: 40px;
  background: #57534e;
  border-radius: 4px;
}

.tm-dart-board {
  width: 140px;
  height: 140px;
  margin: 16px auto;
  border-radius: 50%;
  background: radial-gradient(circle, #fef2f2 18%, #ef4444 19% 38%, #fff 39% 55%, #ef4444 56% 72%, #111 73%);
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 900;
  font-size: 1.5rem;
  text-shadow: 0 1px 2px #000;
}

.tm-traf {
  width: 72px;
  margin: 16px auto;
  padding: 10px;
  border-radius: 16px;
  background: #0f172a;
  display: grid;
  gap: 8px;
}
.tm-traf > i {
  display: block;
  width: 48px;
  height: 48px;
  margin: 0 auto;
  border-radius: 50%;
  opacity: 0.25;
}
.tm-traf > i.r { background: #ef4444; }
.tm-traf > i.y { background: #eab308; }
.tm-traf > i.g { background: #22c55e; }
.tm-traf > i.is-on { opacity: 1; box-shadow: 0 0 12px currentColor; }

.tm-role-card {
  margin-top: 16px;
  padding: 24px 16px;
  border-radius: 16px;
  text-align: center;
  background: linear-gradient(145deg, #f5f3ff, #ede9fe);
  border: 2px solid #8b5cf6;
}

.tm-card-cover--scoops { background: linear-gradient(145deg, #f9a8d4, #db2777); }
.tm-card-cover--dig { background: linear-gradient(145deg, #fbbf24, #92400e); }
.tm-card-cover--tool-steps { background: linear-gradient(145deg, #6ee7b7, #0f766e); }
.tm-card-cover--scoops .tm-card-cover__label,
.tm-card-cover--dig .tm-card-cover__label,
.tm-card-cover--tool-steps .tm-card-cover__label {
  color: #f8fafc;
  font-weight: 800;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.tm-scoop-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
  margin: 8px 0 12px;
  min-height: 36px;
}
.tm-scoop {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: inline-block;
}
.tm-scoop.c1, .tm-scoop-btn.c1 { background: #ef4444; }
.tm-scoop.c2, .tm-scoop-btn.c2 { background: #3b82f6; }
.tm-scoop.c3, .tm-scoop-btn.c3 { background: #22c55e; }
.tm-scoop.c4, .tm-scoop-btn.c4 { background: #eab308; }
.tm-scoop-btn {
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  cursor: pointer;
}

.tm-dig {
  display: grid;
  gap: 4px;
  width: min(100%, 300px);
  margin: 0 auto;
}
.tm-dig-cell {
  aspect-ratio: 1;
  border: none;
  border-radius: 8px;
  background: #d97706;
  color: #fff;
  font-weight: 900;
  cursor: pointer;
}
.tm-dig-cell.is-gem { background: #22d3ee; color: #0f172a; }
.tm-dig-cell.is-sand { background: #fde68a; color: #92400e; }

.tm-step-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 8px;
  margin: 6px 0;
  border-radius: 10px;
  border: 1px solid #99f6e4;
}
.tm-step-row.is-done {
  opacity: 0.55;
  text-decoration: line-through;
}

.tm-buzz-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.tm-ice-card {
  padding: 1.25rem;
  margin: 0.75rem 0;
  border-radius: 14px;
  background: linear-gradient(145deg, #e0f2fe, #f0f9ff);
  border: 1px solid #7dd3fc;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.45;
}
.tm-bracket-round { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0; }
.tm-bracket-match {
  flex: 1 1 140px;
  padding: 8px;
  border-radius: 10px;
  border: 1px solid #bbf7d0;
  background: #f0fdf4;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: stretch;
}
.tm-ci-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.tm-ci-btn.is-on { background: #16a34a; color: #fff; border-color: #15803d; }
.tm-tal-bars { min-width: 4rem; font-weight: 800; letter-spacing: 0.05em; }

.tm-rain-field {
  position: relative;
  height: 220px;
  margin: 8px auto;
  max-width: 360px;
  border-radius: 12px;
  background: linear-gradient(180deg, #0ea5e9 0%, #e0f2fe 70%);
  overflow: hidden;
}
.tm-rain-drop {
  position: absolute;
  width: 10px;
  height: 14px;
  margin-left: -5px;
  border-radius: 50% 50% 50% 50% / 40% 40% 60% 60%;
  background: #0369a1;
}
.tm-rain-bucket {
  position: absolute;
  bottom: 8px;
  width: 44px;
  height: 22px;
  margin-left: -22px;
  border-radius: 0 0 10px 10px;
  background: #0f766e;
  border: 2px solid #134e4a;
}
.tm-piano {
  display: flex;
  gap: 4px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 12px 0;
}
.tm-piano-key {
  min-width: 40px;
  height: 96px;
  border-radius: 0 0 8px 8px;
  border: 1px solid #334155;
  background: #fff;
  font-weight: 800;
  cursor: pointer;
}
.tm-piano-key.is-on { background: #fde68a; box-shadow: 0 0 0 2px #f59e0b; }
.tm-react-box {
  display: block;
  width: min(100%, 280px);
  height: 160px;
  margin: 12px auto;
  border: none;
  border-radius: 16px;
  font-size: 1.4rem;
  font-weight: 900;
  cursor: pointer;
}
.tm-react-box.is-wait { background: #fecaca; color: #7f1d1d; }
.tm-react-box.is-go { background: #86efac; color: #14532d; }
.tm-react-box.is-done { background: #e2e8f0; color: #334155; }

.tm-hourglass {
  width: 90px;
  height: 140px;
  margin: 12px auto;
  border: 3px solid #b45309;
  border-radius: 12px;
  background: #fffbeb;
  position: relative;
  overflow: hidden;
}
.tm-hourglass-sand {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(180deg, #fbbf24, #d97706);
  transition: height 0.4s linear;
}
.tm-slide-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  max-width: 240px;
  margin: 12px auto;
}
.tm-slide-cell {
  aspect-ratio: 1;
  border: none;
  border-radius: 10px;
  background: #0f766e;
  color: #fff;
  font-size: 1.25rem;
  font-weight: 900;
  cursor: pointer;
}
.tm-slide-cell.is-empty { background: #ccfbf1; cursor: default; }
.tm-scoop-btn.is-flash { outline: 3px solid #fbbf24; transform: scale(1.08); }

.tm-flip-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  max-width: 320px;
  margin: 12px auto;
}
.tm-flip-card {
  aspect-ratio: 1;
  border: none;
  border-radius: 10px;
  background: #1e3a8a;
  color: #fff;
  font-weight: 900;
  font-size: 1.1rem;
  cursor: pointer;
}
.tm-flip-card.is-open, .tm-flip-card.is-done { background: #93c5fd; color: #0f172a; }
.tm-meter {
  position: relative;
  height: 28px;
  margin: 16px auto;
  max-width: 320px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.tm-meter-zone {
  position: absolute;
  top: 0;
  bottom: 0;
  background: #86efac;
  opacity: 0.85;
}
.tm-meter i {
  position: absolute;
  top: 2px;
  bottom: 2px;
  width: 8px;
  margin-left: -4px;
  border-radius: 4px;
  background: #0f172a;
  z-index: 1;
}
.tm-mood-range { width: 100%; max-width: 360px; display: block; margin: 12px auto; }
.tm-mood-bar {
  height: 14px;
  max-width: 360px;
  margin: 0 auto;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.tm-mood-bar i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #38bdf8, #f97316, #ef4444);
}
.tm-cb-digit { min-width: 2rem; text-align: center; font-size: 1.4rem; }

.tm-whack-grid, .tm-mine-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  max-width: 240px;
  margin: 12px auto;
}
.tm-mine-grid { grid-template-columns: repeat(5, 1fr); max-width: 280px; }
.tm-whack-cell, .tm-mine-cell {
  aspect-ratio: 1;
  border: none;
  border-radius: 10px;
  background: #cbd5e1;
  cursor: pointer;
}
.tm-whack-cell.is-on { background: #fbbf24; box-shadow: 0 0 0 3px #f59e0b; }
.tm-mine-cell.is-open { background: #e2e8f0; font-weight: 800; }
.tm-mine-cell.is-mine { background: #fecaca; color: #991b1b; }

.tm-sudo-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
  max-width: 240px;
  margin: 12px auto;
}
.tm-sudo-cell {
  aspect-ratio: 1;
  border: 1px solid #64748b;
  border-radius: 6px;
  background: #fff;
  font-weight: 900;
  cursor: pointer;
}
.tm-sudo-cell.is-fixed { background: #e2e8f0; }
.tm-sudo-cell.is-sel { outline: 2px solid #0f766e; }

.tm-card-cover--tool-draft { background: linear-gradient(145deg, #6366f1, #312e81); }
.tm-card-cover--tool-colorcheck { background: linear-gradient(145deg, #f472b6, #38bdf8); }
.tm-card-cover--tool-turnclock { background: linear-gradient(145deg, #fbbf24, #334155); }

.tm-card-cover--tool-rotate { background: linear-gradient(145deg, #0ea5e9, #075985); }
.tm-card-cover--tool-consensus { background: linear-gradient(145deg, #a78bfa, #5b21b6); }

.tm-tools-rank li{display:flex;justify-content:space-between;gap:12px;padding:9px 12px;border-bottom:1px solid #cbd5e1}.tm-tools-rank li.is-current{border-radius:8px;background:#ccfbf1;box-shadow:inset 4px 0 #0f766e}
.tm-turntimerplus{display:flex;flex-direction:column;align-items:center;margin:14px auto;padding:18px;border:2px solid #0f766e;border-radius:14px;background:#f0fdfa}.tm-turntimerplus strong{font-size:1.25rem}.tm-turntimerplus span{font-size:2.5rem;font-weight:900}.tm-turntimerplus.is-warn{border-color:#dc2626;background:#fee2e2;color:#991b1b}
.tm-card-cover--tool-initiative{background:linear-gradient(145deg,#7c3aed,#312e81)}.tm-card-cover--tool-lootsplit{background:linear-gradient(145deg,#fbbf24,#92400e)}.tm-card-cover--tool-cardodds{background:linear-gradient(145deg,#dc2626,#111827)}.tm-card-cover--tool-turntimerplus{background:linear-gradient(145deg,#14b8a6,#134e4a)}
.tm-card-cover--tool-seatingchart{background:linear-gradient(145deg,#0ea5e9,#164e63)}.tm-card-cover--tool-blindbid{background:linear-gradient(145deg,#f59e0b,#78350f)}.tm-card-cover--tool-rulepoll{background:linear-gradient(145deg,#8b5cf6,#312e81)}
.tm-seating-chart{display:grid;gap:8px;margin-top:14px;overflow-x:auto}.tm-seating-chart label{display:grid;gap:4px;padding:8px;border:1px solid #7dd3fc;border-radius:10px;background:#f0f9ff;font-size:.8rem}.tm-seating-chart input,.tm-tools-form-grid input{min-width:0;padding:8px;border:1px solid #94a3b8;border-radius:7px}.tm-blind-bids{display:grid;gap:7px;padding:0;list-style:none}.tm-blind-bids li{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:8px;padding:9px;border:1px solid #fcd34d;border-radius:9px;background:#fffbeb}.tm-bid-ranking{margin-top:12px}.tm-rule-question{min-height:44px;height:44px}.tm-rulepoll{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:14px 0}.tm-rulepoll button{display:grid;gap:5px;padding:14px 7px;border:1px solid #8b5cf6;border-radius:11px;background:#f5f3ff}.tm-rulepoll strong{font-size:1.5rem}

.tm-cc-clock{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.tm-cc-side{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:120px;border:2px solid #0f766e;border-radius:16px;background:#f0fdfa;font:inherit;cursor:pointer}
.tm-cc-side strong{font-size:2rem;font-weight:900}
.tm-cc-side.is-on{background:#99f6e4;box-shadow:inset 0 0 0 3px #0f766e}
.tm-mod-list,.tm-rg-grid{display:flex;flex-direction:column;gap:8px;margin:10px 0}
.tm-mod-row{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;border:1px solid #cbd5e1;border-radius:10px;background:#fff}
.tm-rg-player{padding:10px;border:1px solid #99f6e4;border-radius:12px;background:#f0fdfa}
.tm-rg-cell{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.tm-sc-wrap{overflow-x:auto;margin-top:10px}
.tm-sc-table{width:100%;border-collapse:collapse}
.tm-sc-table th,.tm-sc-table td{padding:6px;border-bottom:1px solid #e2e8f0;text-align:center}
.tm-tb-list .tm-tb-current{font-weight:900;color:#0f766e}
.tm-tb-list .tm-tb-done{opacity:.45;text-decoration:line-through}
.tm-card-cover--tool-roundtrack{background:linear-gradient(145deg,#14b8a6,#134e4a)}
.tm-card-cover--tool-scorecat{background:linear-gradient(145deg,#fbbf24,#92400e)}
.tm-card-cover--tool-chessclock{background:linear-gradient(145deg,#64748b,#0f172a)}
.tm-card-cover--tool-simulock{background:linear-gradient(145deg,#8b5cf6,#312e81)}
.tm-card-cover--tool-modscript{background:linear-gradient(145deg,#334155,#0f172a)}
.tm-card-cover--tool-packlist{background:linear-gradient(145deg,#22c55e,#14532d)}
.tm-card-cover--tool-resgrid{background:linear-gradient(145deg,#0ea5e9,#075985)}
.tm-card-cover--tool-tradelog{background:linear-gradient(145deg,#f97316,#9a3412)}
.tm-card-cover--tool-tiebreak{background:linear-gradient(145deg,#eab308,#854d0e)}

/* 2026 tabletop helpers */
.tm-dp-die{position:relative;cursor:pointer;border:2px solid transparent}
.tm-dp-die.is-kept{border-color:#0f766e;background:#ccfbf1;box-shadow:inset 0 0 0 2px #99f6e4}
.tm-dp-die small{display:block;font-size:.65rem;font-weight:700;color:#0f766e}
.tm-passdir-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;margin:16px 0;padding:28px 16px;border-radius:18px;border:3px solid #7c3aed;background:#f5f3ff;min-height:160px;text-align:center}
.tm-passdir-stage.is-left{border-color:#0ea5e9;background:#e0f2fe}
.tm-passdir-stage.is-right{border-color:#ea580c;background:#ffedd5}
.tm-passdir-arrow{font-size:4rem;font-weight:900;line-height:1;color:#312e81}
.tm-passdir-stage.is-left .tm-passdir-arrow{color:#0369a1}
.tm-passdir-stage.is-right .tm-passdir-arrow{color:#c2410c}
.tm-passdir-label{font-size:1.35rem;font-weight:800}
.tm-cmd-table td,.tm-maj-table td{white-space:nowrap}
.tm-cmd-table .tm-cmd-self{opacity:.35}
.tm-cmd-table td.is-dead,.tm-maj-table td.is-lead{background:#fee2e2}
.tm-maj-table td.is-lead{background:#ccfbf1}
.tm-ds-list{display:grid;gap:12px;margin:12px 0}
.tm-ds-card{padding:12px;border:1px solid #cbd5e1;border-radius:12px;background:#fff}
.tm-ds-row{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.tm-ds-dot{width:22px;height:22px;border-radius:50%;border:2px solid #94a3b8;background:#f8fafc;padding:0;cursor:pointer}
.tm-ds-dot.is-ok{background:#22c55e;border-color:#15803d}
.tm-ds-dot.is-fail{background:#ef4444;border-color:#b91c1c}
.tm-ss-lv{min-width:3.5rem;font-weight:700}
.tm-mo-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:6px 0}
.tm-dutch-price{font-size:3.25rem;font-weight:900;text-align:center;margin:16px 0;color:#b45309;letter-spacing:.02em}
.tm-poi-n{min-width:2rem;text-align:center;font-size:1.25rem}