/* Personal tracker: mobile-first layout. Game state and the shared board are unchanged. */
body.mobile-ui { font-family:system-ui,-apple-system,"Segoe UI","Apple SD Gothic Neo",sans-serif; }
body.mobile-ui #stage { width:100%; max-width:760px; margin:0 auto; }
body.mobile-ui button { touch-action:manipulation; }
body.mobile-ui button:focus-visible { outline:2px solid var(--gold2); outline-offset:3px; }
body.mobile-ui.tall #stage .top {
  display:grid; grid-template-columns:64px minmax(0,1fr) 44px; grid-template-rows:auto auto auto;
  grid-template-areas:"portrait identity settings" "passive passive passive" "toolbar toolbar toolbar";
  gap:10px 12px; align-items:start; padding:12px; margin:0 0 10px;
  background:linear-gradient(135deg,#30221b,var(--card)); border:1px solid var(--line); border-radius:16px;
}
body.mobile-ui.tall #stage .profile { grid-area:portrait; width:64px !important; height:76px !important; margin:0; align-self:start; }
body.mobile-ui.tall #stage .profile img,body.mobile-ui.tall #stage .profile .ph { width:64px !important; height:76px !important; border-radius:10px; }
body.mobile-ui #stage .edit { width:34px; height:34px; right:-3px; bottom:-3px; font-size:18px; line-height:32px; border-radius:10px; }
body.mobile-ui.tall #stage .who { grid-area:identity; width:auto; max-width:none; min-width:0; padding:0; overflow:visible; }
body.mobile-ui.tall #stage .who .name { font-family:inherit; font-size:18px; font-weight:800; line-height:1.35; letter-spacing:-.04em; white-space:normal; overflow-wrap:anywhere; color:var(--cream); }
body.mobile-ui.tall #stage .who .job { display:block !important; margin-top:4px; font-size:11px; line-height:1.5; white-space:normal; color:#C6B49E; }
body.mobile-ui.tall #stage .vitals { display:flex; gap:12px; margin:6px 0 0; }
body.mobile-ui.tall #stage .vital { display:flex; align-items:baseline; gap:4px; }
body.mobile-ui.tall #stage .vital span { font-size:10px; color:#C6B49E; margin:0; }
body.mobile-ui.tall #stage .vital b { font-family:inherit; font-size:18px; line-height:1; font-weight:800; font-variant-numeric:tabular-nums; }
body.mobile-ui.tall #stage #setBtn { grid-area:settings; height:44px; width:44px; padding:0; font-size:12px; border-radius:12px; background:#ffffff08; color:var(--gold2); }
body.mobile-ui.tall #stage #whoPass { grid-area:passive; display:flex !important; flex-wrap:wrap; gap:6px; margin:0; width:100%; max-height:none; overflow:visible; }
body.mobile-ui.tall #stage #whoPass:empty { display:none !important; }
body.mobile-ui #stage #whoPass .pb { width:100%; min-height:40px; height:auto; max-height:none; padding:9px 10px; border-radius:10px; text-align:left; font-family:inherit; font-size:12px; line-height:1.5; font-weight:500; color:#E7D5AE; border:1px solid #C4A35A35; background:#C4A35A0D; white-space:normal; word-break:keep-all; }
body.mobile-ui #stage #whoPass .pb::before { content:"패시브"; display:inline-block; margin-right:8px; font-size:10px; font-weight:800; color:var(--gold2); }
body.mobile-ui #stage #whoPass .pb.tog::after { content:" · 탭하여 적용"; font-size:10px; color:#BCA582; }
body.mobile-ui #stage #whoPass .pb.on { background:#5F4D23; border-color:var(--gold2); box-shadow:none; }
body.mobile-ui #stage #whoPass .pb.on::after { content:" · 적용 중 ✓"; color:#FFF0BF; }
body.mobile-ui #stage .sheet-toolbar { grid-area:toolbar; display:flex; gap:8px; align-items:center; min-width:0; }
body.mobile-ui.tall #stage .sheet-toolbar #locBtn { position:static !important; transform:none !important; display:flex !important; align-items:center; justify-content:flex-start; flex:1; width:auto !important; min-width:0 !important; max-width:none !important; height:44px !important; min-height:44px !important; border-radius:10px !important; padding:0 10px !important; font:600 12px/1.3 system-ui,sans-serif !important; text-align:left; white-space:normal; overflow-wrap:anywhere; background:#191512; clip-path:none !important; }
body.mobile-ui.tall #stage .sheet-toolbar .party { display:flex; flex:none; gap:0; margin:0; border:1px solid #715838; border-radius:10px; overflow:hidden; }
body.mobile-ui.tall #stage .party .nav,body.mobile-ui.tall #stage .party .lead { height:42px; min-width:0; width:36px; padding:0; margin:0; border:0; border-radius:0; line-height:42px; font:600 22px/42px system-ui,sans-serif; }
body.mobile-ui.tall #stage .party .lead { width:44px; font-size:12px; letter-spacing:0; border-left:1px solid #715838; border-right:1px solid #715838; }
body.mobile-ui.tall #stage .party .lead.num { font-size:18px; }
body.mobile-ui.tall #stage #countBtn { width:46px; height:44px; border-radius:10px; padding:0; font-size:13px; color:var(--cream); }
body.mobile-ui #stage .count-wrap { flex:none; margin:0; }
body.mobile-ui.tall #stage .sheet-toolbar #locBtn { word-break:keep-all !important; }
body.mobile-ui #stage .countpop { right:0; left:auto; max-width:calc(100vw - 32px); }
body.mobile-ui #stage .rerow { display:flex; flex-wrap:wrap; flex:none; align-items:center; gap:6px; margin:0 0 8px; padding:4px 8px; min-height:44px; height:auto; max-height:none; background:transparent; border:0; border-bottom:1px solid var(--line); }
body.mobile-ui #stage .rerow .lab { font-size:13px; font-weight:800; color:var(--gold2); }
body.mobile-ui #stage .round-extra { flex:1; min-width:0; }
body.mobile-ui #stage #roundBtn { height:36px; padding:0 10px; font-size:11px; background:transparent; border-color:#604D39; border-radius:9px; }
body.mobile-ui #stage #roundGear { flex:none; position:static; width:36px; height:36px; min-width:36px; margin:0; font-size:16px; border-radius:9px; }
body.mobile-ui.tall #stage .skills { gap:8px !important; padding:0 1px 16px; scrollbar-width:thin; scrollbar-color:#705C3E transparent; }
body.mobile-ui.tall #stage .skill,body.mobile-ui.tall #stage .skill.cols2,body.mobile-ui.tall #stage .skill:not(.cols2) {
  position:relative; display:grid !important; grid-template-columns:minmax(0,var(--sk-gen,1.25fr)) minmax(0,var(--sk-xtr,1fr)) !important;
  grid-template-rows:24px minmax(86px,1fr) auto !important; grid-template-areas:"name name" "gen extra" "flags flags" !important;
  gap:6px !important; padding:8px !important; height:auto !important; min-height:var(--sk-h,124px) !important; max-height:none !important; flex:0 0 auto !important;
  border:1px solid var(--line); border-radius:13px; background:var(--card); overflow:visible !important;
}
body.mobile-ui.tall #stage .skill.cols2 { grid-template-areas:"name name" "gen gen" "flags flags" !important; }
body.mobile-ui.tall #stage .skill.cols2 .extra-ph { display:none !important; }
body.mobile-ui.tall #stage .skname { justify-self:start; align-self:center; display:inline-flex; width:auto; min-width:0; height:24px; padding:0 9px; font:750 13px/24px system-ui,sans-serif !important; writing-mode:horizontal-tb !important; text-orientation:mixed; letter-spacing:0; border-radius:6px; text-shadow:none; }
body.mobile-ui.tall #stage .cell.formula-cell,body.mobile-ui.tall #stage .cell.extra-cell {
  position:relative !important; align-self:stretch; display:flex !important; min-width:0 !important; max-width:none !important; width:auto !important; min-height:86px !important; height:auto !important; padding:18px 5px 4px !important; border-radius:8px; border:1px solid #ffffff0D; overflow:visible !important;
}
body.mobile-ui.tall #stage .cell.formula-cell { background:#1B291E; }
body.mobile-ui.tall #stage .cell.formula-cell .tag { position:absolute !important; display:flex; justify-content:space-between; align-items:center; top:4px; left:6px; right:6px; transform:none; width:auto; max-width:none; height:12px; font:500 10px/12px system-ui,sans-serif !important; color:#D3DDCC; opacity:1; }
body.mobile-ui.tall #stage .cell.formula-cell .stepper.formula { grid-template-columns:var(--sk-btn,34px) minmax(0,1fr) var(--sk-btn,34px) !important; grid-template-rows:1fr 1fr !important; gap:4px 2px !important; min-height:72px !important; }
body.mobile-ui.tall #stage .cell.formula-cell .stepper.formula button,body.mobile-ui.tall #stage .cell.extra-cell button { width:var(--sk-btn,34px) !important; min-width:var(--sk-btn,34px) !important; max-width:var(--sk-btn,34px) !important; height:var(--sk-btn,34px) !important; min-height:var(--sk-btn,34px) !important; max-height:var(--sk-btn,34px) !important; border-radius:8px; font:500 20px/1 system-ui,sans-serif !important; background:#ffffff0A; border:1px solid #ffffff26; padding:0 !important; }
body.mobile-ui.tall #stage .n.form { display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:4px; line-height:1; min-width:0; width:100%; }
body.mobile-ui.tall #stage .n.form .tot,body.mobile-ui.tall #stage .n.extra2 .big { order:-1; font:800 var(--sk-fs,36px)/1 system-ui,sans-serif !important; letter-spacing:-.05em; font-variant-numeric:tabular-nums; color:#FFF2D7; }
body.mobile-ui.tall #stage .breakdown { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:1px; max-width:100%; line-height:1.3; }
body.mobile-ui.tall #stage .n.form .a,body.mobile-ui.tall #stage .n.form .b,body.mobile-ui.tall #stage .n.form .c,body.mobile-ui.tall #stage .n.form .d { font:600 11px/1.3 system-ui,sans-serif !important; margin:0; }
body.mobile-ui.tall #stage .cell.extra-cell .stepper.extra { grid-template-columns:var(--sk-btn,34px) minmax(0,1fr) var(--sk-btn,34px) !important; grid-template-rows:1fr !important; grid-template-areas:"minus num plus" !important; gap:2px !important; align-items:center; }
body.mobile-ui.tall #stage .cell.extra-cell .tag { position:absolute; top:4px; left:0; right:0; text-align:center; font:600 11px/12px system-ui,sans-serif !important; opacity:1; }
body.mobile-ui.tall #stage .n.extra2 { gap:4px; min-width:0; }
body.mobile-ui.tall #stage .n.extra2 .small { display:flex !important; justify-content:center; flex-wrap:wrap; line-height:1.3; }
body.mobile-ui.tall #stage .n.extra2 .small,body.mobile-ui.tall #stage .n.extra2 .small span { font:500 10px/1.3 system-ui,sans-serif !important; }
body.mobile-ui.tall #stage .flags { padding:0 !important; gap:5px !important; min-height:0 !important; max-height:none !important; height:auto !important; }
body.mobile-ui.tall #stage .flags .skgear { position:absolute; top:3px; right:6px; width:34px; height:34px; min-width:34px; padding:0; margin:0; border:none; background:transparent; font-size:16px; }
body.mobile-ui.tall #stage .flag .ft { height:32px !important; min-height:32px !important; max-height:none !important; padding:0 10px !important; font:600 12px/32px system-ui,sans-serif !important; border-radius:7px; }
body.mobile-ui #setPop.setpop { position:fixed !important; z-index:200; min-width:190px !important; padding:8px !important; border:1px solid #705C3E; border-radius:14px; }
body.mobile-ui #setPop.setpop button { height:44px !important; border-radius:8px; padding:0 12px; text-align:left; font:600 13px/1 system-ui,sans-serif; }
body.mobile-ui #appVerLab { padding:10px 4px 4px !important; border-top:1px solid var(--line); color:var(--muted) !important; font:500 11px/1.5 system-ui,sans-serif !important; }
@media(max-width:359px){
  body.mobile-ui.tall #stage .top { grid-template-columns:56px minmax(0,1fr) 40px; gap:8px; padding:10px; }
  body.mobile-ui.tall #stage .profile,body.mobile-ui.tall #stage .profile img,body.mobile-ui.tall #stage .profile .ph { width:56px !important; height:70px !important; }
  body.mobile-ui.tall #stage .who .name { font-size:16px; }
  body.mobile-ui #stage .sheet-toolbar { gap:5px; }
  body.mobile-ui.tall #stage .party .nav { width:32px; }
  body.mobile-ui.tall #stage .party .lead { width:38px; }
  body.mobile-ui.tall #stage .skill { padding:6px !important; gap:5px !important; }
  body.mobile-ui.tall #stage .cell.formula-cell,body.mobile-ui.tall #stage .cell.extra-cell { padding-left:3px !important; padding-right:3px !important; }
}
@media(max-height:700px){
  html:has(body.mobile-ui),body.mobile-ui { height:auto; min-height:100dvh; overflow-y:auto; }
  body.mobile-ui #stage { overflow:visible; min-height:100dvh; }
  body.mobile-ui.tall #stage .skills { flex:none !important; overflow:visible !important; }
}

/* Dice roller */
.dice-modal[hidden] { display:none !important; }
.dice-modal {
  position:fixed; inset:0; z-index:10000; display:grid; place-items:end center;
  padding:12px; background:rgba(3,5,7,.78); backdrop-filter:blur(7px);
}
.dice-sheet {
  width:min(100%,560px); max-height:calc(100dvh - 24px); overflow:auto;
  padding:16px; border:1px solid color-mix(in srgb,var(--gold) 52%,transparent);
  border-radius:20px; background:linear-gradient(165deg,color-mix(in srgb,var(--card) 94%,#111),color-mix(in srgb,var(--bg) 96%,#000));
  box-shadow:0 22px 70px rgba(0,0,0,.58);
}
.dice-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.dice-kicker { color:var(--gold2); font-size:11px; letter-spacing:.12em; }
.dice-head h2 { margin:2px 0 0; color:var(--cream); font-size:23px; line-height:1.1; }
.dice-narrative { margin:10px 0 2px; padding:9px 11px; border-left:3px solid var(--gold); border-radius:0 9px 9px 0; color:var(--cream); background:rgba(0,0,0,.2); font-size:13px; font-weight:800; line-height:1.45; animation:narrative-enter .38s ease-out; }
.dice-narrative.fail { border-color:#cf6359; color:#ffd0c9; background:rgba(86,12,23,.28); }
.dice-narrative.win { border-color:#f4d56d; color:#fff2b8; background:rgba(100,72,5,.24); }
.dice-narrative.good { border-color:#b7d67d; color:#e6ffc4; background:rgba(41,76,24,.24); }
.dice-close,.motion-permission,.dice-action {
  border:1px solid var(--line); color:var(--cream); background:var(--btn); font-weight:800;
}
.dice-close { min-width:58px; height:40px; border-radius:10px; }
.dice-count-adjust { display:flex; align-items:center; justify-content:center; gap:8px; margin:0 0 10px; color:var(--muted); font-size:12px; font-weight:800; }
.dice-count-adjust button { width:34px; height:34px; border:1px solid var(--line); border-radius:9px; color:var(--cream); background:var(--btn); font-size:20px; font-weight:900; }
.dice-count-adjust button:disabled { opacity:.35; }
.dice-count-adjust output { min-width:44px; color:var(--gold2); font-size:16px; text-align:center; }
.dice-stage {
  display:block; width:100%; min-height:210px; padding:14px; border:1px solid color-mix(in srgb,var(--gold) 42%,var(--line));
  border-radius:16px; color:var(--cream); background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--btn) 75%,#222),color-mix(in srgb,var(--bg) 91%,#000));
  touch-action:manipulation;
}
.dice-ready { display:block; color:var(--gold2); font-size:18px; font-weight:900; }
.dice-ready:has(+ .dice-grid:not(:empty)) { display:none; }
.dice-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(54px,1fr)); gap:9px; align-content:center; }
.dice-face {
  position:relative; display:grid; place-items:center; aspect-ratio:1; min-width:0;
  border:2px solid #d9d1b8; border-radius:13px; color:#171412; background:#f5efdd;
  box-shadow:inset 0 -5px 0 rgba(0,0,0,.13),0 5px 12px rgba(0,0,0,.27);
  font:900 clamp(22px,8vw,38px)/1 system-ui,sans-serif;
}
.dice-face.selected { outline:3px solid var(--gold); outline-offset:2px; transform:translateY(-2px); }
.dice-face.success { color:#0b603d; background:#efffdc; border-color:#b9d778; }
.dice-face.dice-target { outline:3px dashed var(--gold2); outline-offset:2px; cursor:pointer; }
.dice-grid.rolling .dice-face { animation:dice-tumble .23s cubic-bezier(.42,0,.58,1) infinite alternate; }
.dice-grid:not(.rolling) .dice-face { animation:dice-land .2s cubic-bezier(.2,.8,.35,1.35); }
@keyframes dice-tumble { from{transform:translateY(-12px) rotate(-13deg) scale(.86)} 55%{transform:translateY(7px) rotate(9deg) scale(1.05)} to{transform:translateY(-4px) rotate(-5deg) scale(.96)} }
@keyframes dice-land { from{transform:translateY(-9px) rotate(6deg) scale(1.05)} 65%{transform:translateY(3px) rotate(-2deg) scale(.99)} to{transform:translateY(0) rotate(0) scale(1)} }
@keyframes narrative-enter { from{opacity:0; transform:translateY(-7px); } to{opacity:1; transform:translateY(0); } }
.dice-result { min-height:31px; padding:10px 2px 6px; text-align:center; color:var(--muted); font-size:13px; font-weight:700; }
.dice-result strong { color:var(--gold2); font-size:19px; }
.dice-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.dice-action { min-height:44px; padding:6px; border-radius:10px; font-size:12px; }
.dice-action:disabled { opacity:.35; }
.dice-action.selecting { border-color:var(--gold2); background:color-mix(in srgb,var(--gold) 28%,var(--btn)); box-shadow:0 0 14px color-mix(in srgb,var(--gold2) 48%,transparent); }
.dice-action b { display:block; color:var(--gold2); font-size:15px; }
.motion-permission { width:100%; min-height:40px; margin-top:8px; border-radius:10px; }
.dice-help { margin:9px 2px 0; color:var(--muted); font-size:10px; line-height:1.4; text-align:center; }
.cell.dice-holding { outline:2px solid var(--gold); outline-offset:-2px; filter:brightness(1.16); }
body.dice-open { overflow:hidden !important; }
body.round-blessed { --bg:#111722; --card:#1b2635; --gold:#f7f8fa; --gold2:#ffffff; --cream:#ffffff; --muted:#cad9e8; --line:#9bb7d3; --btn:#30465d; }
body.round-cursed { --bg:#210b15; --card:#35101e; --gold:#a94a65; --gold2:#f0a0b2; --cream:#f8dce3; --muted:#c28a9b; --line:#713044; --btn:#491525; }
body.round-blessed #stage,body.round-blessed .dice-sheet { box-shadow:0 0 28px rgba(179,224,255,.23); }
body.round-cursed #stage,body.round-cursed .dice-sheet { box-shadow:0 0 28px rgba(185,39,79,.25); }
.round-mode { padding:2px 5px; border:1px solid var(--gold); border-radius:5px; color:var(--gold2); font-size:10px; font-weight:800; white-space:nowrap; }
.round-state { display:inline-block; margin-left:7px; padding:4px 8px; border-radius:7px; font-size:14px; line-height:1.15; font-weight:900; vertical-align:middle; }
.round-state[hidden] { display:none !important; }
.round-state.blessed { color:#fff; border:1px solid #dcefff; background:#54718f; }.round-state.cursed { color:#ffd9e2; border:1px solid #b75570; background:#58182b; }
.board-dice { position:fixed; inset:0; z-index:90; display:none; align-items:center; justify-content:center; flex-direction:column; padding:20px; text-align:center; background:rgba(5,8,12,.9); }
.board-dice.on { display:flex; }.board-dice.blessed { background:rgba(25,45,66,.93); color:#fff; }.board-dice.cursed { background:rgba(53,8,24,.94); color:#ffe3e9; }
.bd-kicker { font-size:18px; font-weight:800; }.bd-name { margin:6px 0 18px; font-size:28px; font-weight:900; }.bd-faces { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; max-width:900px; }.bd-face { display:grid; place-items:center; width:82px; height:82px; border-radius:16px; background:#f7f2e8; color:#18130f; font-size:42px; font-weight:900; }.bd-result { margin-top:22px; font-size:34px; font-weight:900; }.bd-result small { font-size:18px; }
.bcard.blessed { border-color:#b9d9f5; box-shadow:0 0 14px rgba(220,240,255,.25); }.bcard.cursed { border-color:#9e3c58; box-shadow:0 0 14px rgba(184,40,78,.25); }
@media(min-width:700px){ .dice-modal{place-items:center}.dice-sheet{padding:20px}.dice-stage{min-height:250px} }
@media(max-height:620px){
  .dice-modal{padding:5px}.dice-sheet{max-height:calc(100dvh - 10px);padding:11px;border-radius:14px}
  .dice-stage{min-height:145px}.dice-help{display:none}.dice-result{padding-top:6px}
}

/* Dense mobile sheet: fit all five skills into the available viewport. */
html:has(body.mobile-ui), body.mobile-ui { min-height:100dvh; background:var(--bg); }
body.mobile-ui { padding-bottom:0 !important; }
body.mobile-ui #stage { height:100%; min-height:0; }
/* iOS can report a shorter dynamic viewport after its browser chrome changes.
   Reserve the large viewport so the skill-height calculation fills that space too. */
@supports (height:100lvh) {
  html:has(body.mobile-ui), body.mobile-ui { height:100lvh; min-height:100lvh; }
}
body.mobile-ui.tall #stage .top {
  grid-template-columns:46px minmax(0,1fr) 38px;
  grid-template-rows:52px auto 36px;
  gap:4px 7px; padding:6px 7px; margin:0 0 3px;
  border-radius:10px;
}
body.mobile-ui.tall #stage .profile,
body.mobile-ui.tall #stage .profile img,
body.mobile-ui.tall #stage .profile .ph {
  width:46px !important; height:52px !important; border-radius:7px;
}
body.mobile-ui #stage .edit {
  width:25px; height:25px; right:-3px; bottom:-3px;
  font-size:13px; line-height:23px; border-radius:7px;
}
body.mobile-ui.tall #stage .who .name {
  font-size:15px; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
body.mobile-ui.tall #stage .who .job {
  margin-top:2px; font-size:9px; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
body.mobile-ui.tall #stage .vitals { gap:9px; margin:3px 0 0; }
body.mobile-ui.tall #stage .vital { gap:3px; }
body.mobile-ui.tall #stage .vital span { font-size:9px; }
body.mobile-ui.tall #stage .vital b { font-size:14px; }
body.mobile-ui.tall #stage #setBtn {
  width:38px; height:36px; align-self:start; font-size:11px; border-radius:8px;
}
body.mobile-ui.tall #stage #whoPass {
  min-height:25px; max-height:31px; gap:0; overflow:hidden; align-items:stretch;
}
body.mobile-ui #stage #whoPass .pb {
  min-height:25px; height:auto; max-height:31px; padding:4px 7px;
  border-radius:6px; font-size:10px; line-height:1.15;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;
}
body.mobile-ui #stage #whoPass .pb::before { margin-right:5px; font-size:9px; }
body.mobile-ui #stage #whoPass .pb.tog::after { content:" · 적용"; font-size:9px; }
body.mobile-ui #stage #whoPass .pb.on::after { content:" · 적용 중 ✓"; }
body.mobile-ui #stage .sheet-toolbar { gap:5px; }
body.mobile-ui.tall #stage .sheet-toolbar #locBtn {
  height:34px !important; min-height:34px !important; padding:0 7px !important;
  border-radius:7px !important; font-size:10px !important; line-height:1.15 !important;
}
body.mobile-ui.tall #stage .sheet-toolbar .party { height:34px; border-radius:7px; }
body.mobile-ui.tall #stage .party .nav,
body.mobile-ui.tall #stage .party .lead {
  width:30px; height:32px; font-size:16px; line-height:32px;
}
body.mobile-ui.tall #stage .party .lead { width:38px; font-size:10px; }
body.mobile-ui.tall #stage .party .lead.num { font-size:15px; }
body.mobile-ui.tall #stage #countBtn {
  width:38px; height:34px; border-radius:7px; font-size:11px;
}
body.mobile-ui #stage .rerow {
  min-height:31px; height:31px; margin:0 0 3px; padding:1px 4px; gap:4px;
}
body.mobile-ui #stage .rerow .lab { font-size:11px; }
body.mobile-ui #stage #roundBtn { height:27px; padding:0 7px; font-size:9px; border-radius:6px; }
body.mobile-ui #stage #roundGear { width:27px; min-width:27px; height:27px; font-size:12px; border-radius:6px; }
body.mobile-ui.tall #stage .skills {
  gap:4px !important; padding:0 !important; overflow:hidden !important;
}
body.mobile-ui.tall #stage .skill,
body.mobile-ui.tall #stage .skill.cols2,
body.mobile-ui.tall #stage .skill:not(.cols2) {
  grid-template-rows:18px minmax(0,1fr) auto !important;
  gap:2px 4px !important; padding:4px !important;
  height:var(--sk-h) !important; min-height:var(--sk-h) !important; max-height:var(--sk-h) !important;
  margin:0 !important; border-radius:8px;
}
body.mobile-ui.tall #stage .skname {
  height:18px; padding:0 6px; font-size:11px !important; line-height:18px !important; border-radius:4px;
}
body.mobile-ui.tall #stage .cell.formula-cell,
body.mobile-ui.tall #stage .cell.extra-cell {
  min-height:0 !important; height:auto !important; padding:13px 3px 2px !important; border-radius:5px;
}
body.mobile-ui.tall #stage .cell.formula-cell .tag {
  top:2px; left:4px; right:4px; height:10px; font-size:8px !important; line-height:10px !important;
}
body.mobile-ui.tall #stage .cell.formula-cell .stepper.formula {
  min-height:0 !important; gap:2px !important;
}
body.mobile-ui.tall #stage .cell.formula-cell .stepper.formula button,
body.mobile-ui.tall #stage .cell.extra-cell button {
  border-radius:5px; font-size:16px !important;
}
body.mobile-ui.tall #stage .n.form { gap:1px; }
body.mobile-ui.tall #stage .n.form .a,
body.mobile-ui.tall #stage .n.form .b,
body.mobile-ui.tall #stage .n.form .c,
body.mobile-ui.tall #stage .n.form .d { font-size:9px !important; line-height:1 !important; }
body.mobile-ui.tall #stage .cell.extra-cell .tag {
  top:2px; font-size:9px !important; line-height:10px !important;
}
body.mobile-ui.tall #stage .n.extra2 { gap:1px; }
body.mobile-ui.tall #stage .n.extra2 .small,
body.mobile-ui.tall #stage .n.extra2 .small span { font-size:8px !important; line-height:1 !important; }
body.mobile-ui.tall #stage .flags {
  gap:3px !important; min-height:0 !important; height:auto !important; max-height:24px !important;
}
body.mobile-ui.tall #stage .flags .skgear {
  top:0; right:3px; width:26px; height:22px; min-width:26px; font-size:12px;
}
body.mobile-ui.tall #stage .flag .ft {
  height:22px !important; min-height:22px !important; padding:0 6px !important;
  font-size:9px !important; line-height:22px !important; border-radius:4px;
}
body.mobile-ui #scalePop { max-height:min(90dvh,620px); overflow-y:auto; }
body.mobile-ui #scalePop .scale-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
body.mobile-ui #scalePop .scale-actions button { width:100%; height:40px; margin:0 !important; }
@media(max-width:359px){
  body.mobile-ui.tall #stage .top {
    grid-template-columns:42px minmax(0,1fr) 35px; grid-template-rows:48px auto 34px;
    gap:3px 5px; padding:5px;
  }
  body.mobile-ui.tall #stage .profile,
  body.mobile-ui.tall #stage .profile img,
  body.mobile-ui.tall #stage .profile .ph { width:42px !important; height:48px !important; }
  body.mobile-ui.tall #stage #setBtn { width:35px; height:33px; }
  body.mobile-ui.tall #stage .party .nav { width:27px; }
  body.mobile-ui.tall #stage .party .lead { width:34px; }
  body.mobile-ui.tall #stage #countBtn { width:35px; }
}
@media(max-height:700px){
  html:has(body.mobile-ui),body.mobile-ui { height:100dvh; min-height:0; overflow:hidden; }
  body.mobile-ui #stage { height:100%; min-height:0; overflow:hidden; }
  body.mobile-ui.tall #stage .skills { flex:1 1 auto !important; overflow:hidden !important; }
}

/* Bright platinum blessing and a dice tray with a reserved tap margin. */
body.round-blessed { --bg:#f5f5f3; --card:#ffffff; --gold:#697078; --gold2:#343e49; --cream:#27313b; --muted:#5a6570; --line:#c5cbd1; --btn:#e9edf0; background:radial-gradient(ellipse at top,#fff 30%,#e8ebee 100%) !important; color:var(--cream); }
html:has(body.round-blessed) { background:#e8ebee; }
body.round-blessed #stage, body.round-blessed .dice-sheet { box-shadow:0 0 32px rgba(255,255,255,.95),0 0 12px rgba(177,182,188,.35); }
body.round-blessed.mobile-ui #stage .top,
body.round-blessed .dice-sheet { background:linear-gradient(135deg,#fff,#f0f1f2) !important; }
body.round-blessed .dice-stage { background:radial-gradient(ellipse,#fff,#e6e9ec); border-color:#bac1c8; }
body.round-blessed .dice-modal { background:rgba(223,227,231,.75); }
body.round-blessed.mobile-ui #stage .who .job,
body.round-blessed.mobile-ui #stage .vital span,
body.round-blessed.mobile-ui #stage #whoPass .pb,
body.round-blessed.mobile-ui #stage #whoPass .pb::after { color:#495560; }
body.round-blessed.mobile-ui #stage #whoPass .pb { background:#eef0f2; border-color:#c5cbd1; }
body.round-blessed.mobile-ui #stage #whoPass .pb.on { background:#dae6db; }
body.round-blessed.mobile-ui #stage .sheet-toolbar #locBtn { background:#fff; color:#34404a; }
body.round-blessed.mobile-ui #stage .cell.formula-cell { background:#e5ede5; }
body.round-blessed.mobile-ui #stage .cell.extra-cell { background:#ece8ef; }
body.round-blessed.mobile-ui #stage .cell .tag,
body.round-blessed.mobile-ui #stage .n.form .tot,
body.round-blessed.mobile-ui #stage .n.extra2 .big { color:#26343a; }
body.round-blessed.mobile-ui #stage .cell button { background:#fff; border-color:#aab4bd; color:#34404a; }
.round-state.blessed { color:#35414b; border-color:#b7bdc4; background:linear-gradient(135deg,#fff,#dce0e4,#fff); }
.board-dice.blessed { background:rgba(246,247,248,.98); color:#303b45; }
.bcard.blessed { background:#f4f5f6; border-color:#d4d8dc; box-shadow:0 0 20px #ffffffb3; color:#303b45; }
.dice-grid { grid-template-columns:repeat(auto-fit,minmax(54px,76px)); justify-content:center; padding:20px 0; }
.dice-roll-again { display:block; width:100%; margin:0 0 9px; min-height:44px; }

/* Large, high-contrast scoreboard results for viewing across a table. */
.board-dice {
  box-sizing:border-box; gap:8px; padding:clamp(12px,2vw,28px);
  background:#0b1017; overflow:auto;
  --bd-size:min(180px,calc((94vw - (var(--bd-cols) - 1)*12px)/var(--bd-cols)),calc((55dvh - (var(--bd-rows) - 1)*12px)/var(--bd-rows)));
}
.bd-kicker { font-size:clamp(16px,2.5vw,32px); line-height:1.2; }
.bd-name { margin:0 0 8px; font-size:clamp(22px,3.5vw,48px); line-height:1.2; }
.bd-faces { display:grid; grid-template-columns:repeat(var(--bd-cols),var(--bd-size)); gap:12px; max-width:none; flex-shrink:0; }
.bd-face { position:relative; box-sizing:border-box; width:var(--bd-size); height:var(--bd-size); font-size:calc(var(--bd-size)*.56); line-height:1; border:3px solid #9ca6b2; border-radius:16%; background:#e3e7ec; color:#37414c; }
.bd-face.success { background:#d6ffc0; color:#125326; border:4px solid #52c56c; box-shadow:0 0 16px #64eb7455; }
.bd-faces.rolling .bd-face { animation:board-die-roll .17s linear infinite; }
.bd-faces.rolling .bd-face:nth-child(2n) { animation-delay:-.08s; }
.bd-faces.rolling .bd-face:nth-child(3n) { animation-delay:-.13s; }
@keyframes board-die-roll { 0% { transform:rotate(-4deg) scale(.96); } 50% { transform:rotate(5deg) scale(1.04); } 100% { transform:rotate(-4deg) scale(.96); } }

/* A failed roll makes the dice tray and remote display visibly crack. */
.dice-shattered .dice-sheet { animation:dice-tray-shatter .48s cubic-bezier(.2,.7,.2,1); }
.dice-grid.shattered .dice-face { animation:dice-face-shatter .52s cubic-bezier(.2,.7,.2,1); border-color:#9f4e43; box-shadow:inset 0 0 0 2px #3b1a20,0 0 14px #c2443e88; }
.dice-grid.shattered .dice-face:nth-child(2n) { animation-delay:.035s; }
.dice-grid.shattered .dice-face:nth-child(3n) { animation-delay:.07s; }
.board-dice.shattered { animation:board-shatter .58s cubic-bezier(.2,.7,.2,1); }
.board-dice.shattered::after { content:"✦  ✧  ✦"; position:absolute; inset:46% 0 auto; color:#ffb09c; font-size:clamp(30px,6vw,76px); letter-spacing:.6em; text-align:center; pointer-events:none; animation:shatter-sparks .65s ease-out both; }
.dice-shattered { background:radial-gradient(ellipse at 50% 35%,rgba(109,21,32,.42),rgba(4,3,7,.94) 72%) !important; }
.dice-shattered .dice-sheet { position:relative; overflow:hidden; border-color:#9b433f !important; box-shadow:0 0 0 100vmax rgba(18,0,8,.18),0 0 38px #7b202bcc !important; }
.dice-shattered .dice-sheet::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.86; background:linear-gradient(57deg,transparent 0 44%,rgba(255,193,167,.75) 44.3% 44.8%,transparent 45.1% 100%),linear-gradient(138deg,transparent 0 53%,rgba(255,150,136,.64) 53.3% 53.8%,transparent 54.1% 100%),linear-gradient(13deg,transparent 0 66%,rgba(116,12,24,.82) 66.4% 67%,transparent 67.4% 100%); mix-blend-mode:screen; animation:crack-flash .72s ease-out both; }
.dice-shattered .dice-sheet > * { position:relative; z-index:1; }
.dice-grid.shattered .dice-face { color:#e2d2cf; background:linear-gradient(135deg,#443239 0 47%,#170f15 48% 52%,#2d2027 53%); text-shadow:0 2px 3px #000; }
.dice-result.failure { min-height:48px; padding-top:6px; color:#ffd1ca; text-shadow:0 2px 7px #4c0710; }
.dice-result.failure .dice-failure { display:block; color:#ff9f91; font-size:clamp(26px,8vw,42px); letter-spacing:.08em; animation:failure-stamp .5s cubic-bezier(.15,.8,.25,1.25); }
.dice-result.failure span { display:block; margin-top:3px; font-size:12px; }
.board-dice.shattered { background:radial-gradient(ellipse at 50% 42%,#5b1724 0,#1b0710 55%,#050407 100%) !important; box-shadow:inset 0 0 110px #000; }
.board-dice.shattered .bd-result.failure strong { color:#ffaea1; font-size:clamp(45px,8vw,96px); letter-spacing:.08em; text-shadow:0 4px 16px #4a0610; }
.board-dice.shattered .bd-result.failure small { display:block; color:#ffd0c8; margin-top:8px; }
body.round-blessed .dice-shattered { background:radial-gradient(ellipse at 50% 35%,rgba(123,113,118,.5),rgba(41,34,40,.94) 72%) !important; }
body.round-blessed .dice-shattered .dice-sheet { border-color:#8f8585 !important; box-shadow:0 0 38px #5f5963cc !important; }
body.round-cursed .dice-shattered { background:radial-gradient(ellipse at 50% 35%,rgba(159,16,38,.56),rgba(19,0,9,.96) 72%) !important; }
@keyframes crack-flash { 0% { opacity:0; transform:scale(.82); } 30% { opacity:1; transform:scale(1.04); } 100% { opacity:.42; transform:scale(1); } }
@keyframes failure-stamp { 0% { opacity:0; transform:scale(1.7); filter:blur(8px); } 55% { opacity:1; transform:scale(.94); filter:none; } 100% { transform:scale(1); } }

/* Every die succeeded: a brief, bright triumph instead of the normal landing. */
.dice-celebrating { background:radial-gradient(ellipse at 50% 38%,rgba(194,215,229,.26),rgba(11,15,24,.94) 72%) !important; }
.dice-celebrating .dice-sheet { position:relative; overflow:hidden; border-color:#bac7d0 !important; box-shadow:0 0 0 100vmax rgba(197,218,235,.045),0 0 var(--victory-glow) #b8d2e066 !important; }
.dice-celebrating .dice-sheet::before { content:"✦  ·  ✧  ·  ✦  ·  ✧  ·  ✦"; position:absolute; inset:34% -22%; z-index:2; color:#dcebf0; font-size:var(--victory-star-size); letter-spacing:var(--victory-letter); text-align:center; pointer-events:none; text-shadow:0 0 var(--victory-face-glow) #b7d6e3; animation:victory-sparkle .84s ease-out both; }
.dice-celebrating .dice-sheet > * { position:relative; z-index:1; }
.dice-celebrating.perfect-1 .dice-sheet { box-shadow:0 0 0 100vmax rgba(255,224,139,.035),0 0 14px #ffe18a77 !important; }
.dice-celebrating.perfect-1 .dice-sheet::before { opacity:.3; animation-duration:.42s; }
.dice-celebrating.perfect-1 .dice-face { animation-duration:.32s; box-shadow:inset 0 0 0 2px #fff5bb,0 0 8px #ffe58199; }
.dice-celebrating.perfect-2 .dice-sheet::before { opacity:.7; }
.dice-grid.celebrating .dice-face { border-color:#c4d4dc; color:#304550; background:radial-gradient(circle at 32% 25%,#f9ffff,#cedce0 58%,#8197a1); box-shadow:inset 0 0 0 2px #edf8fa,0 0 var(--victory-face-glow) #b7dce699; animation:victory-die .58s cubic-bezier(.15,.8,.25,1.25); }
.dice-grid.celebrating .dice-face:nth-child(2n) { animation-delay:.06s; }
.dice-grid.celebrating .dice-face:nth-child(3n) { animation-delay:.12s; }
.dice-result.victory { min-height:51px; padding-top:5px; color:#dcebf0; text-shadow:0 2px 8px #172832; }
.dice-result.victory .dice-victory { display:block; color:#e9f4f6; font-size:clamp(28px,8vw,44px); letter-spacing:.1em; animation:victory-stamp .58s cubic-bezier(.15,.8,.25,1.25); }
.dice-result.victory span { display:block; margin-top:3px; font-size:12px; }
.board-dice.celebrating { background:radial-gradient(ellipse at 50% 42%,#405662 0,#101922 56%,#040608 100%) !important; box-shadow:inset 0 0 110px #000,0 0 var(--victory-board-glow) #b8dce077; }
.board-dice.celebrating::after { content:"✦  ✧  ✦  ✧  ✦"; position:absolute; inset:35% 0 auto; color:#dfeef1; font-size:var(--victory-board-star); letter-spacing:var(--victory-board-letter); text-align:center; pointer-events:none; text-shadow:0 0 var(--victory-face-glow) #bddfe7; animation:victory-sparkle .9s ease-out both; }
.board-dice.celebrating .bd-face.success { border-color:#ffe275; box-shadow:inset 0 0 0 3px #fff6bf,0 0 25px #ffe481cc; animation:victory-die .62s cubic-bezier(.15,.8,.25,1.25); }
.board-dice.celebrating .bd-result.victory strong { color:#e5f3f5; font-size:clamp(48px,9vw,104px); letter-spacing:.1em; text-shadow:0 4px 17px #172b35; }
.board-dice.celebrating .bd-result.victory small { display:block; margin-top:8px; color:#d5e5e8; }
.board-dice.celebrating.perfect-1 { box-shadow:inset 0 0 110px #000,0 0 22px #ffe38777; }
.board-dice.celebrating.perfect-1::after { opacity:.35; animation-duration:.42s; }
.board-dice.celebrating.perfect-1 .bd-face.success { animation-duration:.32s; box-shadow:inset 0 0 0 2px #fff6bf,0 0 10px #ffe48199; }
body.round-blessed .dice-celebrating { background:radial-gradient(ellipse at 50% 38%,rgba(255,255,255,.72),rgba(198,176,166,.86) 72%) !important; }
body.round-blessed .dice-celebrating .dice-sheet { border-color:#f8f8f2 !important; box-shadow:0 0 42px #ffffedcc !important; }
body.round-cursed .dice-celebrating { background:radial-gradient(ellipse at 50% 38%,rgba(177,112,243,.46),rgba(29,5,51,.94) 72%) !important; }
body.round-cursed .dice-celebrating .dice-sheet { border-color:#bd78ee !important; box-shadow:0 0 42px #b367e1bb !important; }
body.round-cursed .dice-celebrating .dice-face { border-color:#c682f2; background:radial-gradient(circle at 32% 25%,#f6dfff,#bd79df 58%,#5c2678); color:#311143; box-shadow:inset 0 0 0 2px #f5dcff,0 0 20px #c77bf0cc; }
@keyframes victory-die { 0% { transform:scale(.7) rotate(-12deg); filter:brightness(.6); } 55% { transform:scale(1.14) rotate(5deg); filter:brightness(1.35); } 100% { transform:scale(1) rotate(0); } }
@keyframes victory-sparkle { 0% { opacity:0; transform:translateY(18px) scale(.6); } 40% { opacity:1; transform:translateY(-8px) scale(1.12); } 100% { opacity:.15; transform:translateY(-30px) scale(1.25); } }
@keyframes victory-stamp { 0% { opacity:0; transform:scale(.45); filter:blur(6px); } 60% { opacity:1; transform:scale(1.12); filter:none; } 100% { transform:scale(1); } }
@keyframes dice-tray-shatter { 0%,100% { transform:translateX(0); } 18% { transform:translateX(-11px) rotate(-.4deg); } 38% { transform:translateX(10px) rotate(.35deg); } 58% { transform:translateX(-6px); } }
@keyframes dice-face-shatter { 0% { transform:scale(1); filter:none; } 35% { transform:translate(-4px,3px) rotate(-7deg) scale(.94); filter:brightness(.6); } 65% { transform:translate(5px,-3px) rotate(8deg) scale(.91); } 100% { transform:scale(1); filter:none; } }
@keyframes board-shatter { 0%,100% { transform:translateX(0); } 20% { transform:translateX(-18px); } 42% { transform:translateX(15px); } 65% { transform:translateX(-8px); } }
@keyframes shatter-sparks { 0% { opacity:0; transform:scale(.3); } 35% { opacity:1; transform:scale(1.15); } 100% { opacity:0; transform:translateY(32px) scale(1.35); } }
.bd-check { position:absolute; right:7%; bottom:5%; font-size:calc(var(--bd-size)*.17); font-weight:900; }
.bd-result { margin-top:8px; font-size:clamp(30px,5vw,72px); line-height:1.1; font-weight:900; }
.bd-result strong { font-size:1.4em; font-variant-numeric:tabular-nums; }
.bd-result small { display:block; margin-top:4px; font-size:clamp(18px,2.5vw,32px); }
.bd-close { position:absolute; z-index:4; top:clamp(12px,2.4vw,28px); right:clamp(12px,2.4vw,28px); width:clamp(42px,5vw,64px); height:clamp(42px,5vw,64px); border:2px solid currentColor; border-radius:50%; color:#f8fbff; background:rgba(0,0,0,.42); font-size:clamp(28px,4vw,44px); line-height:1; font-weight:400; }
.board-dice,.bd-close,.bd-reopen,.bd-history { pointer-events:auto; touch-action:manipulation; -webkit-user-select:none; user-select:none; }
.bd-close { cursor:pointer; }
.board-dice.blessed .bd-close { color:#142832; background:rgba(255,255,255,.62); }
.board-dice.blessed.celebrating .bd-close,.board-dice.blessed.shattered .bd-close { color:#f8fbff; background:rgba(0,0,0,.42); }
.bd-reopen { position:fixed; z-index:91; right:clamp(14px,3vw,36px); bottom:clamp(14px,3vw,36px); min-height:48px; padding:10px 16px; border:2px solid #d8edf4; border-radius:999px; color:#f8fbff; background:#102d3be8; box-shadow:0 4px 16px #0008; font-size:clamp(15px,2.3vw,24px); font-weight:900; }
.bd-reopen[hidden] { display:none; }
.bd-history { position:fixed; z-index:91; left:clamp(14px,3vw,36px); bottom:clamp(14px,3vw,36px); min-height:48px; padding:10px 16px; border:2px solid #d8edf4; border-radius:999px; color:#f8fbff; background:#102d3be8; box-shadow:0 4px 16px #0008; font-size:clamp(15px,2.3vw,24px); font-weight:900; }
.bd-history[hidden] { display:none; }
.room-control-label { display:grid; gap:4px; margin-top:8px; color:var(--muted); font-size:11px; font-weight:800; }
.room-control-label select { width:100%; min-height:34px; border:1px solid #806e57; border-radius:7px; padding:4px 8px; color:var(--ink); background:var(--panel); font-weight:800; }
.peer-dice-toast { position:fixed; z-index:170; left:50%; bottom:max(18px,env(safe-area-inset-bottom)); translate:-50% 0; display:grid; grid-template-columns:minmax(0,1fr) 36px; width:min(92vw,520px); border:2px solid #d2b96d; border-radius:16px; overflow:hidden; background:#17141eeF; box-shadow:0 8px 30px #0009; }
.peer-dice-toast[hidden] { display:none; }
.peer-dice-toast button { min-height:58px; border:0; color:#fff5dc; background:transparent; font-size:14px; font-weight:900; text-align:left; padding:10px 14px; }
.peer-dice-toast .peer-toast-x { padding:0; text-align:center; font-size:22px; color:#d9cdbd; }
.peer-dice-modal,.peer-history { position:fixed; inset:0; z-index:180; display:flex; align-items:center; justify-content:center; padding:14px; background:#050609e8; }
.peer-dice-modal[hidden],.peer-history[hidden] { display:none; }
.peer-dice-sheet,.peer-history>section { width:min(94vw,680px); max-height:92vh; overflow:auto; border:2px solid #bba66c; border-radius:18px; padding:16px; color:#fff4dc; background:radial-gradient(circle at top,#30293a,#131119 70%); box-shadow:0 18px 60px #000; }
.peer-dice-sheet header,.peer-history header { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.peer-dice-sheet header h2,.peer-history h2 { margin:3px 0 12px; color:#fff8e8; }
.peer-dice-sheet header button,.peer-history header button { min-height:38px; margin-left:6px; border:1px solid #a99268; border-radius:9px; color:#fff4dc; background:#3c3344; font-weight:900; }
.peer-faces { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:18px 0; }
.peer-face { display:grid; place-items:center; width:clamp(54px,17vw,92px); aspect-ratio:1; border:3px solid #786d77; border-radius:15px; background:#ece5d8; color:#241f24; font-size:clamp(30px,10vw,58px); font-weight:1000; }
.peer-face.success { border-color:#ffe074; background:#d8ffc4; box-shadow:0 0 18px #ffe17499; }
.peer-dice-result { text-align:center; font-size:clamp(26px,8vw,48px); font-weight:1000; color:#fff0a8; }
.peer-dice-meta,.peer-dice-reason { margin:10px 0; text-align:center; color:#ddd1c6; line-height:1.45; }
.peer-history article { padding:12px 0; border-bottom:1px solid #665c69; }
.peer-history article strong { display:block; color:#fff1b9; }
.peer-history article p { margin:6px 0 0; color:#ddd4df; line-height:1.45; }

/* Blessed condition card: parchment, rose light and weathered silver. */
body.round-blessed { --bg:#d7b4a8; --card:#f2e5cc; --gold:#927357; --gold2:#65483e; --cream:#3d342f; --muted:#796258; --line:#a79b8d; --btn:#e4d2b9; background:radial-gradient(ellipse at 50% 0%,#fff0d8 0%,#e5b3a4 40%,#a87778 100%) !important; }
body.round-blessed #stage,body.round-blessed .dice-sheet { box-shadow:0 0 24px #ffe5ca70,0 4px 18px #58463f35; }
body.round-blessed.mobile-ui #stage .top,body.round-blessed .dice-sheet { background:radial-gradient(ellipse at top,#fff0da80,transparent 70%),linear-gradient(140deg,#edc1af,#f5e7cb 55%,#cfaaaa) !important; border-color:#9b9690; }
body.round-blessed .dice-stage { background:radial-gradient(ellipse,#faecd4,#e6c9b8 65%,#ccaaa1); border-color:#aaa096; }
body.round-blessed .dice-modal { background:rgba(91,62,58,.64); }
body.round-blessed.mobile-ui #stage .who .job,body.round-blessed.mobile-ui #stage .vital span,body.round-blessed.mobile-ui #stage #whoPass .pb,body.round-blessed.mobile-ui #stage #whoPass .pb::after { color:#71594b; }
body.round-blessed.mobile-ui #stage #whoPass .pb { background:#f4e8d0b3; border-color:#b5a390; }
body.round-blessed.mobile-ui #stage #whoPass .pb.on { background:#ddd8b8; }
body.round-blessed.mobile-ui #stage .sheet-toolbar #locBtn { background:#efe0c5; color:#56443a; }
body.round-blessed.mobile-ui #stage .cell.formula-cell { background:#e1e0c8; }
body.round-blessed.mobile-ui #stage .cell.extra-cell { background:#e6cfc7; }
body.round-blessed.mobile-ui #stage .cell .tag,body.round-blessed.mobile-ui #stage .n.form .tot,body.round-blessed.mobile-ui #stage .n.extra2 .big { color:#423a30; }
body.round-blessed.mobile-ui #stage .cell button { background:#f7ecd8; border-color:#ac9d8e; color:#604c3d; }
.round-state.blessed { color:#674a41; border-color:#a59b8e; background:linear-gradient(135deg,#eed0bc,#f9ecd2,#d9b5a7); }
.board-dice.blessed { background:radial-gradient(ellipse at top,#f9ebd1,#e2b9a9 65%,#b98380); color:#4d3c33; }
.bcard.blessed { background:#efe1c8; border-color:#b7aa96; color:#4d3c33; box-shadow:0 0 18px #f6d5b870; }
#rqPop .round-condition { display:flex; gap:6px; margin:12px 0; }
#rqPop .round-condition label { flex:1; position:relative; cursor:pointer; }
#rqPop .round-condition input { position:absolute; opacity:0; width:1px; height:1px; }
#rqPop .round-condition span { display:flex; align-items:center; justify-content:center; min-height:44px; border:1px solid var(--line); border-radius:8px; background:var(--btn); color:var(--cream); font-weight:800; }
#rqPop .round-condition input:checked + span { border:2px solid var(--gold2); box-shadow:inset 0 -3px 0 var(--gold); }
#rqPop .round-condition input:checked + span::before { content:'✓ '; margin-right:4px; }
#rqPop .round-condition input:focus-visible + span { outline:2px solid var(--gold2); outline-offset:3px; }

/* Keep scoreboard labels independent of the controller's condition palette. */
#boardDiceOverlay { color:#fff7ed; }
#boardDiceOverlay.blessed { color:#382820; }
#boardDiceOverlay.cursed { color:#fff1f5; }
#boardDiceOverlay .bd-name,
#boardDiceOverlay .bd-kicker,
#boardDiceOverlay .bd-result,
#boardDiceOverlay .bd-result strong,
#boardDiceOverlay .bd-result small { color:inherit; opacity:1; }
#boardDiceOverlay:not(.blessed) .bd-name,
#boardDiceOverlay:not(.blessed) .bd-result { text-shadow:0 2px 4px #000; }
.bd-narrative { max-width:min(94vw,1120px); margin:4px 0 14px; padding:11px 18px; border-radius:12px; border:2px solid currentColor; background:rgba(0,0,0,.32); color:#f5fbff; font-size:clamp(22px,3.9vw,52px); font-weight:900; line-height:1.35; text-shadow:0 2px 5px #000; }
.bd-narrative.fail { color:#ffd6d0; border-color:#ff8678; background:rgba(83,8,19,.7); }
.bd-narrative.win { color:#ecfbff; border-color:#b8eaff; background:rgba(13,48,63,.74); }
.bd-narrative.good { color:#edffd5; border-color:#bcf28c; background:rgba(29,68,28,.72); }
#boardDiceOverlay:not(.blessed) .bd-kicker,
#boardDiceOverlay:not(.blessed) .bd-name,
#boardDiceOverlay:not(.blessed) .bd-result,
#boardDiceOverlay:not(.blessed) .bd-result strong,
#boardDiceOverlay:not(.blessed) .bd-result small,
#boardDiceOverlay:not(.blessed) .bd-breakdown { color:#f8fbff !important; }
#boardDiceOverlay.blessed .bd-kicker,
#boardDiceOverlay.blessed .bd-name,
#boardDiceOverlay.blessed .bd-result,
#boardDiceOverlay.blessed .bd-result strong,
#boardDiceOverlay.blessed .bd-result small,
#boardDiceOverlay.blessed .bd-breakdown { color:#142832 !important; text-shadow:none !important; }
#boardDiceOverlay.cursed .bd-kicker,
#boardDiceOverlay.cursed .bd-name,
#boardDiceOverlay.cursed .bd-result,
#boardDiceOverlay.cursed .bd-result strong,
#boardDiceOverlay.cursed .bd-result small,
#boardDiceOverlay.cursed .bd-breakdown { color:#fff3f7 !important; }
#boardDiceOverlay.blessed.celebrating .bd-kicker,
#boardDiceOverlay.blessed.celebrating .bd-name,
#boardDiceOverlay.blessed.celebrating .bd-result,
#boardDiceOverlay.blessed.celebrating .bd-result strong,
#boardDiceOverlay.blessed.celebrating .bd-result small,
#boardDiceOverlay.blessed.celebrating .bd-breakdown,
#boardDiceOverlay.blessed.shattered .bd-kicker,
#boardDiceOverlay.blessed.shattered .bd-name,
#boardDiceOverlay.blessed.shattered .bd-result,
#boardDiceOverlay.blessed.shattered .bd-result strong,
#boardDiceOverlay.blessed.shattered .bd-result small,
#boardDiceOverlay.blessed.shattered .bd-breakdown { color:#f8fbff !important; text-shadow:0 3px 8px #06131c !important; }
#boardDiceOverlay.blessed.celebrating .bd-result.victory strong { color:#f1fbff !important; text-shadow:0 4px 18px #102d3b !important; }
#stage { touch-action:pan-y pinch-zoom; }
.bd-breakdown { color:inherit; font-size:clamp(18px,2.8vw,36px); line-height:1.35; font-weight:800; margin-top:6px; }

.dice-head-buttons { display:flex; gap:8px; }
.dice-history { position:fixed; inset:5%; z-index:150; padding:18px; border:2px solid #aa9780; border-radius:16px; background:#201b28; color:#fff4e6; overflow:auto; box-shadow:0 0 0 100vmax #000b; }
.dice-history[hidden] { display:none; }
.dice-history header { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.dice-history h2 { color:#fff4e6; }
.dice-history article { padding:14px 0; border-bottom:1px solid #766777; }
.dice-history p { white-space:pre-line; line-height:1.5; margin:8px 0; }
.dice-history .history-values { font-size:20px; font-weight:800; color:#e4ffcc; }
.dice-history small { color:#ded2e4; }
/* Prevent iOS long-press selection before and after the dice dialog opens. */
.skill .cell[data-part],
.skill .cell[data-part] *,
#diceModal,
#diceModal * {
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
.skill .cell[data-part] input,
.skill .cell[data-part] textarea,
#diceModal input,
#diceModal textarea {
  -webkit-user-select:text;
  user-select:text;
  -webkit-touch-callout:default;
}

/* The skill list owns the remaining viewport.  A taller manual card setting
   scrolls inside this area instead of slipping behind the bottom viewport. */
body.mobile-ui.tall #stage {
  min-height:0 !important;
  background:var(--bg);
}
body.mobile-ui.tall {
  padding-bottom:0 !important;
}
body.mobile-ui.tall #stage .skills {
  flex:1 1 0 !important;
  min-height:0 !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior:contain;
  padding-bottom:0 !important;
  background:var(--bg);
}
body.mobile-ui.tall #stage .skill:last-child {
  margin-bottom:0 !important;
}
/* Fit the +/- controls to the coloured cell without exceeding the chosen size. */
.skill-head,.flag-items { display:contents; }
body.mobile-ui.tall #stage .cell.formula-cell,
body.mobile-ui.tall #stage .cell.extra-cell {
  height:100% !important;
  min-height:0 !important;
}
body.mobile-ui.tall #stage .cell.formula-cell .stepper.formula {
  display:grid !important;
  height:100% !important;
  min-height:0 !important;
  --fit-step:var(--card-step,var(--sk-btn,34px));
  grid-template-columns:var(--fit-step) minmax(0,1fr) var(--fit-step) !important;
  grid-template-rows:var(--fit-step) var(--fit-step) !important;
  grid-template-areas:"impUp num gearUp" "impDn num gearDn" !important;
  gap:2px 4px !important;
}
body.mobile-ui.tall #stage .cell.formula-cell .stepper.formula .fcol {
  display:contents !important;
}
body.mobile-ui.tall #stage .cell.formula-cell .stepper.formula button {
  width:var(--fit-step) !important;
  min-width:var(--fit-step) !important;
  max-width:var(--fit-step) !important;
  height:var(--fit-step) !important;
  min-height:var(--fit-step) !important;
  max-height:var(--fit-step) !important;
}
body.mobile-ui.tall #stage .cell.extra-cell .stepper.extra {
  height:100% !important;
  min-height:0 !important;
  --fit-step:var(--card-step,var(--sk-btn,34px));
  grid-template-columns:var(--fit-step) minmax(0,1fr) var(--fit-step) !important;
}
body.mobile-ui.tall #stage .cell.extra-cell .stepper.extra button {
  width:var(--fit-step) !important;
  min-width:var(--fit-step) !important;
  max-width:var(--fit-step) !important;
  height:var(--fit-step) !important;
  min-height:var(--fit-step) !important;
  max-height:var(--fit-step) !important;
}

/* Keep every calculation component and its own controls in one colour family. */
body.mobile-ui #stage {
  --calc-base:#C8D6B0;
  --calc-improve:#E8C86A;
  --calc-gear:#8EC8E8;
  --calc-success:#E07A5F;
  --calc-total:#FFF2D7;
}
body.mobile-ui #stage .formula-cell .tag .tag-base,
body.mobile-ui #stage .n.form .a,
body.mobile-ui #stage .n.extra2 .ea { color:var(--calc-base) !important; }
body.mobile-ui #stage .n.form .b,
body.mobile-ui #stage .n.extra2 .eb { color:var(--calc-improve) !important; }
body.mobile-ui #stage .formula-cell .tag .tag-gear,
body.mobile-ui #stage .n.form .c { color:var(--calc-gear) !important; }
body.mobile-ui #stage .n.form .d,
body.mobile-ui #stage .n.extra2 .ec { color:var(--calc-success) !important; }
body.mobile-ui #stage .n.form .tot,
body.mobile-ui #stage .n.extra2 .big { color:var(--calc-total) !important; }
body.mobile-ui #stage .stepper.formula .fcol.imp button.imp,
body.mobile-ui #stage .cell.extra-cell button[data-act="minus"],
body.mobile-ui #stage .cell.extra-cell button[data-act="plus"] {
  color:var(--calc-improve) !important;
  border-color:var(--calc-improve) !important;
  background:#E8C86A24 !important;
}
body.mobile-ui #stage .stepper.formula .fcol.gear button.gear {
  color:var(--calc-gear) !important;
  border-color:var(--calc-gear) !important;
  background:#8EC8E824 !important;
}
body.mobile-ui #stage .flag[data-flag="success"] .ft {
  color:var(--calc-success) !important;
  border-color:var(--calc-success) !important;
  background:#E07A5F18 !important;
}
body.mobile-ui #stage .flag[data-flag="success"].en .ft {
  background:#E07A5F38 !important;
}

/* Blessed parchment needs darker inks and clearer tinted controls. */
body.round-blessed.mobile-ui #stage {
  --calc-base:#405528;
  --calc-improve:#7C4F00;
  --calc-gear:#185B78;
  --calc-success:#963E32;
  --calc-total:#2F2924;
}
body.round-blessed.mobile-ui #stage .formula-cell .tag,
body.round-blessed.mobile-ui #stage .formula-cell .tag span,
body.round-blessed.mobile-ui #stage .n.form .a,
body.round-blessed.mobile-ui #stage .n.form .b,
body.round-blessed.mobile-ui #stage .n.form .c,
body.round-blessed.mobile-ui #stage .n.form .d,
body.round-blessed.mobile-ui #stage .n.extra2 .small,
body.round-blessed.mobile-ui #stage .n.extra2 .small span {
  opacity:1 !important;
  font-weight:800 !important;
  text-shadow:0 1px 0 #fff8e2;
}
body.round-blessed.mobile-ui.tall #stage .n.form .a,
body.round-blessed.mobile-ui.tall #stage .n.form .b,
body.round-blessed.mobile-ui.tall #stage .n.form .c,
body.round-blessed.mobile-ui.tall #stage .n.form .d {
  font-size:11px !important;
  line-height:1.15 !important;
}
body.round-blessed.mobile-ui.tall #stage .n.extra2 .small,
body.round-blessed.mobile-ui.tall #stage .n.extra2 .small span {
  font-size:10px !important;
  line-height:1.1 !important;
}
body.round-blessed.mobile-ui #stage .stepper.formula .fcol.imp button.imp,
body.round-blessed.mobile-ui #stage .cell.extra-cell button[data-act="minus"],
body.round-blessed.mobile-ui #stage .cell.extra-cell button[data-act="plus"] {
  color:#694300 !important;
  border-color:#805200 !important;
  background:#F1D89E !important;
  box-shadow:inset 0 0 0 1px #FFF3CF80;
  opacity:1 !important;
}
body.round-blessed.mobile-ui #stage .stepper.formula .fcol.gear button.gear {
  color:#124A63 !important;
  border-color:#1B607D !important;
  background:#C9E3EB !important;
  box-shadow:inset 0 0 0 1px #F4FCFF;
  opacity:1 !important;
}
body.round-blessed.mobile-ui #stage .flag[data-flag="success"] .ft {
  color:#84362D !important;
  border-color:#9A4438 !important;
  background:#F0C9BF !important;
}
body.round-blessed.mobile-ui #stage .flag[data-flag="success"].en .ft {
  background:#E9AEA1 !important;
  box-shadow:inset 0 0 0 1px #FFF0E9;
}

/* Skill actions live in the otherwise unused title strip on every skill. */
body.mobile-ui.tall #stage .skill,
body.mobile-ui.tall #stage .skill.cols2,
body.mobile-ui.tall #stage .skill:not(.cols2) {
  grid-template-rows:22px minmax(0,1fr) !important;
  grid-template-areas:"head head" "gen extra" !important;
}
body.mobile-ui.tall #stage .skill.cols2 {
  grid-template-areas:"head head" "gen gen" !important;
}
body.mobile-ui.tall #stage .skill-head {
  grid-area:head;
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
  height:22px;
}
body.mobile-ui.tall #stage .skill-head .skname {
  position:static !important;
  flex:0 0 auto;
  align-self:center;
  height:20px !important;
  line-height:20px !important;
}
body.mobile-ui.tall #stage .skill-head .flags {
  position:static !important;
  display:flex !important;
  flex:1 1 auto;
  flex-wrap:nowrap !important;
  align-items:center !important;
  gap:4px !important;
  width:auto !important;
  min-width:0 !important;
  height:22px !important;
  max-height:22px !important;
  overflow:visible !important;
}
body.mobile-ui.tall #stage .skill-head .flag-items {
  display:flex;
  flex:1 1 auto;
  align-items:center;
  gap:3px;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
}
body.mobile-ui.tall #stage .skill-head .flag-items::-webkit-scrollbar { display:none; }
body.mobile-ui.tall #stage .skill-head .flag .ft,
body.mobile-ui.tall #stage .skill-head .flag.en .ft,
body.mobile-ui.tall #stage .skill-head .flag.simple .ft {
  height:20px !important;
  min-height:20px !important;
  max-height:20px !important;
  padding:0 6px !important;
  font-size:9px !important;
  line-height:20px !important;
  white-space:nowrap;
}
body.mobile-ui.tall #stage .skill-head .ringmark {
  flex:0 0 auto;
  height:20px;
  line-height:20px;
  white-space:nowrap;
}
body.mobile-ui.tall #stage .skill-head .skgear {
  position:static !important;
  flex:0 0 24px !important;
  width:24px !important;
  min-width:24px !important;
  height:22px !important;
  margin:0 !important;
  padding:0 !important;
  font-size:12px !important;
}

/* High-contrast blessed controls: each action keeps a distinct readable hue. */
body.round-blessed.mobile-ui #stage .skill-head .flag .ft,
body.round-blessed.mobile-ui #stage .round-extra .flag .ft {
  opacity:1 !important;
  font-weight:850 !important;
  text-shadow:none !important;
  box-shadow:inset 0 0 0 1px #FFFFFF90;
}
body.round-blessed.mobile-ui #stage .flag[data-flag="reroll"] .ft,
body.round-blessed.mobile-ui #stage .flag[data-flag="rr"] .ft {
  color:#214E60 !important; border-color:#5C8795 !important; background:#D5E8ED !important;
}
body.round-blessed.mobile-ui #stage .flag[data-flag="arr"] .ft {
  color:#5A3D68 !important; border-color:#92729D !important; background:#E5D9EA !important;
}
body.round-blessed.mobile-ui #stage .flag[data-flag="plus1"] .ft,
body.round-blessed.mobile-ui #stage .flag[data-flag="p1"] .ft {
  color:#704900 !important; border-color:#A67822 !important; background:#F2DEAA !important;
}
body.round-blessed.mobile-ui #stage .flag[data-flag="success"] .ft {
  color:#84362D !important; border-color:#A75648 !important; background:#F0C9BF !important;
}
body.round-blessed.mobile-ui #stage .flag[data-flag="ring"] .ft {
  color:#40531F !important; border-color:#738348 !important; background:#E0E7C9 !important;
}
/* Saved context-only bonuses are status labels in the skill header. */
#stage .aggregate-flag .ft {
  font-weight:850 !important;
  border-radius:999px !important;
  box-shadow:inset 0 0 0 1px #ffffff12 !important;
}
#stage .aggregate-flag[data-flag="reroll"] .ft,
#stage .aggregate-flag[data-flag="rr"] .ft { color:#ccecf5 !important; border-color:#58899a !important; background:#203b45 !important; }
#stage .aggregate-flag[data-flag="arr"] .ft { color:#ead9f4 !important; border-color:#8a68a0 !important; background:#382947 !important; }
#stage .aggregate-flag[data-flag="plus1"] .ft,
#stage .aggregate-flag[data-flag="p1"] .ft { color:#ffe6a4 !important; border-color:#a77e2d !important; background:#483613 !important; }
#stage .aggregate-flag[data-flag="success"] .ft { color:#ffd6cd !important; border-color:#a45c4f !important; background:#482724 !important; }
#stage .aggregate-flag[data-flag="ring"] .ft { color:#dce9b9 !important; border-color:#778d48 !important; background:#303d1d !important; }
#stage .aggregate-flag.permanent-flag { cursor:default; }
#stage .aggregate-flag.permanent-flag .ft { opacity:1 !important; filter:none !important; }
#stage .aggregate-flag.used .ft { filter:saturate(.35); opacity:.56 !important; }
#stage .skill-head .condition-flag { pointer-events:none; }
#stage .skill-head .condition-flag .ft {
  color:#f2e8ce !important;
  border-color:#8c7650 !important;
  background:#33291d !important;
  box-shadow:inset 0 0 0 1px #ffffff12 !important;
}
#stage .skill-head .condition-flag.scope-magic .ft { color:#e2d0ff !important; border-color:#8065aa !important; background:#35274b !important; }
#stage .skill-head .condition-flag.scope-combat .ft { color:#ffd4cd !important; border-color:#a65b50 !important; background:#4a2624 !important; }
#stage .skill-head .condition-flag.scope-asset .ft { color:#ffe8a8 !important; border-color:#a88130 !important; background:#493916 !important; }
#stage .skill-head .condition-flag.scope-research .ft { color:#cdebd7 !important; border-color:#4f8d68 !important; background:#203c2b !important; }
#stage .skill-head .condition-flag.scope-gate .ft { color:#d8dcff !important; border-color:#6674a9 !important; background:#29304d !important; }
body.round-blessed.mobile-ui #stage .skill-head .condition-flag.scope-magic .ft { color:#573b74 !important; border-color:#9d83b5 !important; background:#eee5f4 !important; }
body.round-blessed.mobile-ui #stage .skill-head .condition-flag.scope-combat .ft { color:#7c332b !important; border-color:#b77b70 !important; background:#f3ddd7 !important; }
body.round-blessed.mobile-ui #stage .skill-head .condition-flag.scope-asset .ft { color:#6b4b06 !important; border-color:#b89446 !important; background:#f5e7bd !important; }
body.round-blessed.mobile-ui #stage .skill-head .condition-flag.scope-research .ft { color:#24583c !important; border-color:#7aa58a !important; background:#dfede3 !important; }
body.round-blessed.mobile-ui #stage .skill-head .condition-flag.scope-gate .ft { color:#394d79 !important; border-color:#8493bc !important; background:#e3e7f3 !important; }
body.round-blessed.mobile-ui #stage .flag.used .ft {
  color:#FFFFFF !important;
  background:#40515B !important;
  border-color:#26343C !important;
  box-shadow:inset 0 0 0 1px #FFFFFF55 !important;
}
body.round-blessed.mobile-ui #stage .round-mode {
  color:#513864 !important; border-color:#86699A !important; background:#E7DDEF !important;
}
body.round-blessed.mobile-ui #stage #roundGear {
  color:#314652 !important; border-color:#7A909A !important; background:#E2ECEF !important;
}

/* Blessed round settings use a light parchment panel with explicit states. */
body.round-blessed #rqPop { background:rgba(55,43,39,.58) !important; backdrop-filter:blur(3px); }
body.round-blessed #rqPop .box {
  background:linear-gradient(155deg,#FFF9EA,#F1DFC1) !important;
  border:2px solid #8D694B !important;
  color:#302822 !important;
  box-shadow:0 18px 55px #3C292D66, inset 0 0 0 1px #FFFFFFA8;
}
body.round-blessed #rqPop h4 { color:#3A2D25 !important; font-size:18px; }
body.round-blessed #rqPop .row {
  padding:7px 8px;
  border:1px solid #C8AF8A;
  border-radius:9px;
  background:#FFF8E7B8;
  color:#3A3028;
}
body.round-blessed #rqPop .row span { font-weight:800; color:#49372B; }
body.round-blessed #rqPop .row b { color:#1E566B; font-weight:900; }
body.round-blessed #rqPop .row button {
  width:38px; height:38px;
  border:1px solid #8C673E;
  border-radius:8px;
  background:#EFD59E;
  color:#513712;
  font-size:22px;
  font-weight:900;
}
body.round-blessed #rqPop .setchk {
  padding:9px 10px;
  border:1px solid #C7AD87;
  border-radius:9px;
  background:#FFF8E7A8;
  color:#3C3028 !important;
  font-weight:750;
}
body.round-blessed #rqPop .setchk input { width:18px; height:18px; accent-color:#416A78; vertical-align:-4px; }
body.round-blessed #rqPop .round-condition span { color:#43372E; border-color:#BCA581; background:#F5E8CE; }
body.round-blessed #rqPop .round-condition input[value="blessed"] + span { color:#254E5D; border-color:#82A5AE; background:#E1EEF1; }
body.round-blessed #rqPop .round-condition input[value="cursed"] + span { color:#703648; border-color:#B78391; background:#F0DCE1; }
body.round-blessed #rqPop .round-condition input:checked + span {
  border-width:3px !important;
  border-color:#315C6B !important;
  box-shadow:inset 0 -3px 0 #79A3AF,0 0 0 2px #FFFFFF !important;
}
body.round-blessed #rqPop #rqOk {
  min-height:44px;
  border:1px solid #1E4653;
  border-radius:9px;
  background:#315D6A;
  color:#FFFFFF;
  font-size:15px;
  font-weight:900;
}

/* A six counts twice with the round bonus, so mark it more strongly than success. */
.dice-face.six-bonus {
  color:#604400 !important;
  border-color:#F0C93D !important;
  background:radial-gradient(circle at 30% 24%,#FFFFF1,#E4FFD0 58%,#B9E99D) !important;
  box-shadow:inset 0 0 0 3px #62B96E,0 0 0 2px #FFF3A2,0 0 22px #FFD84DAA !important;
}
.dice-face.six-bonus::after {
  content:"×2";
  position:absolute;
  top:4px;
  right:4px;
  padding:2px 4px;
  border-radius:999px;
  color:#3D2A00;
  background:#FFD95A;
  font:900 10px/1 system-ui,sans-serif;
  box-shadow:0 1px 4px #6B4A0066;
}
.bd-face.six-bonus {
  color:#604400 !important;
  border-color:#FFD84D !important;
  background:radial-gradient(circle at 30% 24%,#FFFFF3,#DCFFC5 58%,#AEDA91) !important;
  box-shadow:inset 0 0 0 5px #57B96A,0 0 0 3px #FFF1A0,0 0 34px #FFD84DCC !important;
}
.bd-face.six-bonus::after {
  content:"×2";
  position:absolute;
  top:6%;
  right:6%;
  min-width:1.55em;
  padding:.18em .28em;
  border-radius:999px;
  color:#3D2A00;
  background:#FFD95A;
  font:900 calc(var(--bd-size)*.15)/1 system-ui,sans-serif;
  box-shadow:0 .06em .18em #6B4A0070;
}
.dice-result.victory .dice-victory .success-count {
  display:inline;
  margin-left:.2em;
  color:inherit;
  font-size:.48em;
  letter-spacing:0;
  white-space:nowrap;
}
.board-dice .bd-result.victory .bd-success-count {
  display:inline;
  margin-left:.18em;
  color:inherit;
  font-size:.46em;
  letter-spacing:0;
  white-space:nowrap;
}

/* During a grand success, ×2 dice share the celebration palette instead of
   reverting to the ordinary lime success colour. */
.dice-grid.celebrating .dice-face.six-bonus {
  color:#304550 !important;
  border-color:#E9D889 !important;
  background:radial-gradient(circle at 32% 25%,#FFFFFF,#D8E5E9 58%,#91A6AF) !important;
  box-shadow:inset 0 0 0 3px #F1FAFC,0 0 0 2px #E9D889,0 0 var(--victory-face-glow) #C8E7EDCC !important;
}
.board-dice.celebrating .bd-face.six-bonus {
  color:#304550 !important;
  border-color:#F0DD8B !important;
  background:radial-gradient(circle at 32% 25%,#FFFFFF,#D6E3E7 58%,#879DA7) !important;
  box-shadow:inset 0 0 0 5px #F1FAFC,0 0 0 3px #F0DD8B,0 0 34px #CBE9EFDD !important;
}
.dice-grid.celebrating .dice-face.six-bonus::after,
.board-dice.celebrating .bd-face.six-bonus::after {
  color:#344851;
  border:1px solid #D4BF65;
  background:#F5F3DF;
  box-shadow:0 0 9px #FFF4ACAA;
}
body.round-cursed .dice-grid.celebrating .dice-face.six-bonus,
.board-dice.cursed.celebrating .bd-face.six-bonus {
  color:#311143 !important;
  border-color:#E0B4F2 !important;
  background:radial-gradient(circle at 32% 25%,#FAEAFF,#C98BE5 58%,#682E83) !important;
  box-shadow:inset 0 0 0 3px #F6E0FF,0 0 0 2px #D7A0ED,0 0 28px #C77BF0DD !important;
}
body.round-cursed .dice-grid.celebrating .dice-face.six-bonus::after,
.board-dice.cursed.celebrating .bd-face.six-bonus::after {
  color:#40204E;
  border-color:#B97BD2;
  background:#EEDAF6;
  box-shadow:0 0 9px #D795EEAA;
}

/* Conditional asset bonuses stay compact in skill settings and are activated
   by the current test context in the dice window. */
.condition-editor { margin-top:12px; padding-top:10px; border-top:1px solid var(--line); }
.rqpop .box { max-height:min(90dvh,720px); overflow:auto; }
.condition-editor h5 { margin:0 0 3px; color:var(--gold2); font-size:14px; }
.condition-editor > p { margin:0 0 8px; color:var(--muted); font-size:11px; line-height:1.35; }
.condition-add { display:grid; grid-template-columns:1fr 1fr auto; gap:5px; }
.condition-add select,.condition-add button { min-width:0; height:38px; padding:0 7px; border:1px solid var(--line); border-radius:7px; color:var(--cream); background:var(--btn); font-weight:800; }
.condition-list { display:grid; gap:5px; margin-top:7px; }
.condition-empty { margin:4px 0 0 !important; padding:8px; border:1px dashed var(--line); border-radius:7px; text-align:center; }
.condition-row { display:grid; grid-template-columns:minmax(0,1fr) 32px 22px 32px 32px; align-items:center; gap:4px; padding:5px; border:1px solid var(--line); border-radius:8px; background:color-mix(in srgb,var(--card) 82%,#000); }
.condition-row span { min-width:0; display:flex; flex-direction:column; }
.condition-row b { color:var(--cream); font-size:12px; }
.condition-row small { color:var(--muted); font-size:10px; }
.condition-row button { width:32px; height:32px; padding:0; border:1px solid var(--gold); border-radius:6px; color:var(--gold2); background:var(--btn); font-size:18px; font-weight:900; }
.condition-row strong { color:var(--gold2); text-align:center; }
.condition-row .condition-remove { color:#ffcdc4; border-color:#9b544b; background:#522a28; }
.dice-context { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:5px; margin:5px 0 8px; }
.dice-context > span { width:100%; color:var(--muted); font-size:11px; font-weight:800; text-align:center; }
.dice-context button { min-height:34px; padding:5px 9px; border:1px solid var(--line); border-radius:999px; color:var(--cream); background:var(--btn); font-size:11px; font-weight:900; }
.dice-context button.on { color:#211607; border-color:var(--gold2); background:var(--gold2); box-shadow:0 0 10px color-mix(in srgb,var(--gold2) 55%,transparent); }
body.round-blessed .condition-add select,
body.round-blessed .condition-add button,
body.round-blessed .condition-row,
body.round-blessed .condition-row button { color:#233740; border-color:#91a8ae; background:#edf5f4; }
body.round-blessed .condition-row small,
body.round-blessed .condition-editor > p,
body.round-blessed .dice-context > span { color:#536a70; }
body.round-blessed .dice-context button { color:#30464d; border-color:#9eb1b5; background:#e8f0ef; }
body.round-blessed .dice-context button.on { color:#27383d; border-color:#c5a94b; background:#f4e8a8; }
@media (max-width:420px){
  .dice-context { gap:4px; }
  .dice-context button { padding:5px 7px; font-size:10px; }
  .condition-add { grid-template-columns:1fr 1fr; }
  .condition-add button { grid-column:1 / -1; }
}
