/* Hearth UI polish (design: Jenny, ui-polish SPEC v1). Design tokens + components + app shell.
   Every accent reads a theme variable; the palettes themselves live in the app's theme CSS.
   Component classes are prefixed u- so they never meet the app's older .card/.btn/.tab rules. */
/* Hearth heading font everywhere (Tom, 30 Oct 2026). Most serif text in the app asks for Georgia first, and phones have
   no Georgia, so bold headings ("Map library", "Live game", the Forge tabs, the sheet's name) fell back to Noto Serif or
   Times. Here "Georgia" itself is the Hearth heading font for bold text: Gelasio Bold (it shares Georgia's metrics, so
   nothing reflows where Georgia exists). Regular and italic text keep the device's own Georgia; phones without it (Android)
   get Gelasio Regular and Italic, so body serif text no longer drops to Noto Serif or Times either. */
@font-face { font-family: Georgia; font-style: normal; font-weight: 600 900; font-display: swap; src: url("../../fonts/gelasio-700-normal-latin.woff2") format("woff2"); }
@font-face { font-family: Georgia; font-style: normal; font-weight: 100 500; font-display: swap; src: local("Georgia"), local("Georgia Regular"), local("Gelasio"), local("Gelasio Regular"), url("../../fonts/gelasio-400-normal-latin.woff2") format("woff2"); }
@font-face { font-family: Georgia; font-style: italic; font-weight: 100 500; font-display: swap; src: local("Georgia Italic"), local("Georgia-Italic"), local("Gelasio Italic"), url("../../fonts/gelasio-400-italic-latin.woff2") format("woff2"); }
@font-face { font-family: Georgia; font-style: italic; font-weight: 600 900; src: local("Georgia Bold Italic"), local("Georgia-BoldItalic"), local("Gelasio Bold Italic"); }
@font-face { font-family: Gelasio; font-style: normal; font-weight: 600 900; font-display: swap; src: url("../../fonts/gelasio-700-normal-latin.woff2") format("woff2"); }
@font-face { font-family: Gelasio; font-style: normal; font-weight: 100 500; font-display: swap; src: url("../../fonts/gelasio-400-normal-latin.woff2") format("woff2"); }
@font-face { font-family: Gelasio; font-style: italic; font-weight: 100 500; font-display: swap; src: url("../../fonts/gelasio-400-italic-latin.woff2") format("woff2"); }
html {
  /* palette bridge: the app's palettes already set --gold, --gold-deep, --page, --page-deep, --card-surface, --ink*, --moss, --oxblood, --indigo, --turn */
  --on-gold: var(--rs-btn-ink, var(--page));
  --ember-ui: var(--gold);
  --crimson-ink: var(--crimson, var(--oxblood));
  --tex: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.12));
  --tex-page: linear-gradient(180deg, var(--page-grad-top, var(--page)), var(--page-grad-bottom, var(--page-deep)));
  --tex-parch: linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.08));
  --parch: color-mix(in srgb, var(--card-surface) 70%, var(--ink) 8%);
  --parch-ink: var(--ink);
  /* map-overlay semantics: fixed on purpose (they sit on the map, not on themed surfaces) */
  --hostile: #b34a32; --bloodied: #b3261e; --map-ink: #f4e6cc; --ally: #6f9a4e;
}
/* the signature Hearth palette: leather, charcoal and parchment textures */
html[data-palette="hearth"] {
  --ember-ui: var(--hx-ember);
  --tex: var(--hx-leather) 0 0/256px;
  --tex-page: var(--hx-charcoal) 0 0/256px;
  --tex-parch: var(--hx-parch) 0 0/256px;
  --parch: var(--card-surface); --parch-ink: var(--hx-ink-on-parch); /* the parchment texture is opaque */
}
:root {
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px;
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 22px; --r-pill: 999px;
  --serif: Georgia, "Gelasio", "Noto Serif", serif; --sans: Roboto, "Segoe UI", system-ui, sans-serif;
  --brass-grad: linear-gradient(180deg, color-mix(in srgb, var(--gold) 62%, #fff) 0%, var(--gold) 46%, var(--gold-deep) 100%);
  --rim: color-mix(in srgb, var(--gold-deep) 42%, transparent); --rim-strong: color-mix(in srgb, var(--gold-deep) 75%, transparent);
  --hair: color-mix(in srgb, var(--gold-deep) 22%, transparent); --ember: var(--ember-ui);
  --well: color-mix(in srgb, var(--page) 70%, transparent);
  --sh1: 0 1px 2px rgba(0,0,0,.4), 0 3px 10px rgba(0,0,0,.25); --sh2: 0 2px 4px rgba(0,0,0,.4), 0 12px 28px rgba(0,0,0,.4); --sh3: 0 6px 14px rgba(0,0,0,.5), 0 28px 70px rgba(0,0,0,.6);
  --glow: 0 0 0 2px var(--gold), 0 0 16px color-mix(in srgb, var(--ember) 45%, transparent);
  --u-surface: var(--card-surface);
}
/* One button scale. Mouse desk stays compact; phones and a coarse pointer (Fold, touch laptop) use 44px. */
.u2 {
  --u-btn-h: 40px;
  --u-btn-h-sm: 32px;
  --u-btn-h-lg: 48px;
  --u-btn-icon: 44px;
  --u-btn-pad: var(--s4);
  --u-btn-pad-sm: var(--s3);
  --u-btn-pad-lg: var(--s5);
  --u-btn-fs: 14px;
  --u-btn-fs-sm: 13px;
  --u-btn-fs-lg: 15px;
  --u-btn-radius: var(--r-sm);
  --u-btn-radius-lg: 10px;
  --u-seg-h: 34px;
  --u-chip-h: 34px;
}
.u2.u-phone {
  --u-btn-h: 44px;
  --u-btn-h-sm: 44px;
  --u-btn-h-lg: 52px;
  --u-btn-icon: 44px;
  --u-seg-h: 44px;
  --u-chip-h: 44px;
}
.u2 svg.u-i { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.u2 svg.u-i.u-sm { width: 16px; height: 16px; } .u2 svg.u-i.u-lg { width: 24px; height: 24px; } .u2 svg.u-i.u-xl { width: 40px; height: 40px; stroke-width: 1.4; }
/* ---- components (ported from ui-polish/html/ui.css) ---- */
.u2 svg.u-i{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.u2 svg.u-i.u-sm{width:16px;height:16px}
.u2 svg.u-i.u-lg{width:24px;height:24px}
.u2 svg.u-i.u-xl{width:40px;height:40px;stroke-width:1.4}
.u2 .u-t-display{font:600 32px/1.15 var(--serif);letter-spacing:.2px;color:var(--ink)}
.u2 .u-t-h1{font:600 26px/1.2 var(--serif);color:var(--ink)}
.u2 .u-t-h2{font:600 20px/1.25 var(--serif);color:var(--ink)}
.u2 .u-t-h3{font:600 16px/1.3 var(--serif);color:var(--ink)}
.u2 .u-t-body{font-size:14px;color:var(--ink-soft)}
.u2 .u-t-meta{font-size:12.5px;color:var(--ink-faded)}
.u2 .u-t-label{font:700 11px/1 var(--sans);letter-spacing:1.4px;text-transform:uppercase;color:var(--ink-faded)}
.u2 .u-t-num{font:700 28px/1 var(--serif);color:var(--ink)}
.u2 .u-gold{color:var(--gold)}
.u2 .u-faded{color:var(--ink-faded)}
.u2 .u-danger-t{color:var(--crimson-ink)}
.u2 .u-moss{color:var(--moss)}
.u2 .u-brass-text{background:var(--brass-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.u2 .u-card{position:relative;background:var(--tex),var(--u-surface);border:1px solid var(--rim);border-radius:var(--r-md);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--gold) 14%,transparent),var(--sh1)}
.u2 .u-card.u-pad{padding:var(--s4)}
.u2 .u-card.u-pad-l{padding:var(--s5)}
.u2 .u-card.u-raised{box-shadow:inset 0 1px 0 color-mix(in srgb,var(--gold) 16%,transparent),inset 0 0 0 3px rgba(0,0,0,.18),inset 0 0 0 4px var(--hair),var(--sh2)}
.u2 .u-card.u-sunk{background:var(--well);box-shadow:inset 0 1px 3px rgba(0,0,0,.5);border-color:var(--hair)}
.u2 .u-card.u-parch{background:var(--tex-parch) var(--parch);color:var(--parch-ink);border-color:color-mix(in srgb,var(--gold-deep) 50%,transparent)}
.u2 .u-card.u-parch .u-t-label{color:color-mix(in srgb,var(--parch-ink) 60%,transparent)}
.u2 .u-card.u-parch .u-t-meta{color:color-mix(in srgb,var(--parch-ink) 68%,transparent)}
.u2 .u-card.u-parch .u-t-h3{color:var(--parch-ink)}
.u2 .u-card.u-parch .u-t-body,.u2 .u-card.u-parch .u-t-h2,.u2 .u-card.u-parch b{color:var(--parch-ink)}
.u2 .u-card.u-active{box-shadow:var(--glow),var(--sh2)}
.u2 .u-rivets:before,.u2 .u-rivets:after{content:"";position:absolute;top:8px;width:5px;height:5px;border-radius:50%;background:var(--brass-grad);box-shadow:0 1px 1px rgba(0,0,0,.6)}
.u2 .u-rivets:before{left:8px}
.u2 .u-rivets:after{right:8px}
.u2 .u-rule{height:1px;background:linear-gradient(90deg,transparent,var(--rim-strong) 15%,var(--rim-strong) 85%,transparent)}
.u2 .u-sec-h{display:flex;align-items:center;gap:var(--s3);margin:0 0 var(--s3)}
.u2 .u-sec-h .u-t-label{white-space:nowrap}
.u2 .u-sec-h:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--rim),transparent)}
.u2 .u-sec-h a{order:3;font:600 13px var(--sans);color:var(--gold);text-decoration:none;white-space:nowrap}
.u2 .u-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);height:var(--u-btn-h);padding:0 var(--u-btn-pad);font:600 var(--u-btn-fs)/1 var(--sans);color:var(--ink);white-space:nowrap; background:var(--tex),var(--u-surface);border:1px solid var(--rim-strong);border-radius:var(--u-btn-radius);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--gold) 18%,transparent),0 2px 4px rgba(0,0,0,.45);cursor:pointer}
.u2 .u-btn.u-primary{background:var(--brass-grad);color:var(--on-gold);border-color:var(--gold-deep);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -2px 0 rgba(0,0,0,.18),0 2px 6px rgba(0,0,0,.5)}
.u2 .u-btn.u-ghost{background:transparent;border-color:transparent;box-shadow:none;color:var(--gold)}
.u2 .u-btn.u-quiet{background:var(--well);box-shadow:none;border-color:var(--hair)}
.u2 .u-btn.u-danger{color:var(--crimson-ink);border-color:color-mix(in srgb,var(--oxblood) 55%,transparent)}
.u2 .u-btn.u-heal{color:var(--moss);border-color:color-mix(in srgb,var(--moss) 50%,transparent)}
.u2 .u-btn.u-lg{height:var(--u-btn-h-lg);padding:0 var(--u-btn-pad-lg);font-size:var(--u-btn-fs-lg);border-radius:var(--u-btn-radius-lg)}
.u2 .u-btn.u-sm{height:var(--u-btn-h-sm);padding:0 var(--u-btn-pad-sm);font-size:var(--u-btn-fs-sm)}
.u2 .u-btn.u-block{display:flex;width:100%}
.u2 .u-btn:active:not(:disabled){transform:translateY(1px)}
.u2 .u-ibtn{display:inline-flex;align-items:center;justify-content:center;width:var(--u-btn-icon);height:var(--u-btn-icon);border-radius:50%;color:var(--ink-soft);background:var(--well);border:1px solid var(--hair);flex:none}
.u2 .u-ibtn.u-plain{background:transparent;border-color:transparent}
.u2 .u-ibtn:active{transform:scale(.96)}
.u2 .u-field{display:flex;align-items:center;gap:var(--s2);height:44px;padding:0 var(--s3);border-radius:10px;background:var(--well);border:1px solid var(--rim);box-shadow:inset 0 1px 3px rgba(0,0,0,.55);color:var(--ink-faded);font-size:14px}
.u2 .u-field span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.u2 .u-field kbd{font:600 11px var(--sans);padding:2px 6px;border-radius:5px;border:1px solid var(--hair);color:var(--ink-faded)}
.u2 .u-field.u-focus{border-color:var(--gold);box-shadow:inset 0 1px 3px rgba(0,0,0,.55),0 0 0 3px color-mix(in srgb,var(--gold) 22%,transparent);color:var(--ink)}
.u2 .u-flabel{display:block;margin-bottom:6px}
.u2 .u-select{justify-content:space-between}
.u2 .u-chips{display:flex;gap:var(--s2);flex-wrap:nowrap;min-width:0;max-width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.u2 .u-chips::-webkit-scrollbar{display:none}
.u2 .u-chip{display:inline-flex;align-items:center;gap:6px;height:var(--u-chip-h);padding:0 14px;border-radius:var(--r-pill);font:600 13px/1 var(--sans);color:var(--ink-soft);background:var(--well);border:1px solid var(--hair);white-space:nowrap;flex:none}
.u2 .u-chip b{font-weight:600;color:var(--ink-faded);font-size:12px}
.u2 .u-chip.u-on{background:var(--brass-grad);color:var(--on-gold);border-color:var(--gold-deep)}
.u2 .u-chip.u-on b{color:var(--on-gold);opacity:.75}
/* the count on a picked chip ("All 0", "Weapons 38") is the chip's dark ink, not faded cream on gold (1.3:1), 30 Oct */
.u2 .u-chip.u-on .u-faded{color:var(--u-on-brass, var(--on-gold));opacity:.75}
.u2 .u-seg{display:flex;padding:4px;gap:4px;border-radius:var(--r-pill);background:var(--well);border:1px solid var(--hair)}
.u2 .u-seg>*{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:var(--u-seg-h);border-radius:var(--r-pill);font:600 13px var(--sans);color:var(--ink-faded);white-space:nowrap}
.u2 .u-seg .u-on{background:var(--tex),var(--u-surface);color:var(--gold);box-shadow:inset 0 0 0 1px var(--rim-strong),0 2px 4px rgba(0,0,0,.4)}
.u2 .u-tabs{display:flex;gap:var(--s5);border-bottom:1px solid var(--hair)}
.u2 .u-tabs>*{padding:0 0 12px;font:600 14px var(--sans);color:var(--ink-faded);position:relative;white-space:nowrap}
.u2 .u-tabs .u-on{color:var(--gold)}
.u2 .u-tabs .u-on:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:2px;background:var(--brass-grad);box-shadow:0 0 8px var(--ember)}
.u2 .u-list{display:flex;flex-direction:column}
.u2 .u-row{display:flex;align-items:center;gap:var(--s3);min-height:56px;padding:var(--s2) var(--s4)}
.u2 .u-list .u-row+.u-row{border-top:1px solid var(--hair)}
.u2 .u-row .u-grow{flex:1;min-width:0}
.u2 .u-row .u-t-h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.u2 .u-row .u-chev{color:var(--ink-faded)}
.u2 .u-lead{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--gold);background:var(--well);border:1px solid var(--hair);flex:none}
.u2 .u-lead.u-round{border-radius:50%}
.u2 .u-av{border-radius:50%;object-fit:cover;border:2px solid var(--gold-deep);box-shadow:0 2px 6px rgba(0,0,0,.6);flex:none;background:var(--page-deep)}
.u2 .u-tag{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:var(--r-pill);font:700 11px/1 var(--sans);letter-spacing:.3px;color:var(--ink-soft);border:1px solid var(--hair);background:var(--well);white-space:nowrap}
.u2 .u-tag.u-gold{color:var(--on-gold);background:var(--brass-grad);border-color:var(--gold-deep)}
.u2 .u-tag.u-ember{color:var(--on-gold);background:var(--ember);border-color:transparent}
.u2 .u-tag.u-moss{color:var(--moss);border-color:color-mix(in srgb,var(--moss) 45%,transparent)}
.u2 .u-tag.u-crim{color:var(--crimson-ink);border-color:color-mix(in srgb,var(--oxblood) 45%,transparent)}
.u2 .u-hpbar{height:6px;border-radius:3px;background:rgba(0,0,0,.5);overflow:hidden}
.u2 .u-hpbar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,var(--moss),color-mix(in srgb,var(--moss) 55%,#fff))}
.u2 .u-hpbar i.u-low{background:linear-gradient(90deg,var(--oxblood),#ffb347)}
.u2 .u-pips{display:inline-flex;gap:5px}
.u2 .u-pips i{width:14px;height:14px;border-radius:4px;background:var(--brass-grad);border:1px solid var(--gold-deep);box-shadow:0 0 5px color-mix(in srgb,var(--gold) 45%,transparent)}
.u2 .u-pips i.u-u{background:var(--well);box-shadow:none;border-color:var(--rim)}
.u2 .u-pips.u-round i{border-radius:50%}
.u2 .u-toggle{width:44px;height:26px;border-radius:13px;background:var(--well);border:1px solid var(--rim);position:relative;flex:none}
.u2 .u-toggle:after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:color-mix(in srgb,var(--ink-faded) 60%,var(--page))}
.u2 .u-toggle.u-on{background:color-mix(in srgb,var(--gold) 30%,var(--page));border-color:var(--gold)}
.u2 .u-toggle.u-on:after{left:21px;background:var(--brass-grad)}
.u2 .u-dot{width:8px;height:8px;border-radius:50%;background:var(--moss);box-shadow:0 0 6px var(--moss);flex:none}
.u2 .u-scrim{position:absolute;inset:0;background:rgba(0,0,0,.62);backdrop-filter:blur(2px);z-index:40}
.u2 .u-sheet{position:absolute;left:0;right:0;bottom:0;z-index:50;border-radius:var(--r-xl) var(--r-xl) 0 0;background:var(--tex),var(--u-surface);border:1px solid var(--gold-deep);border-bottom:0; box-shadow:inset 0 0 0 4px rgba(0,0,0,.2),inset 0 0 0 5px var(--hair),0 -12px 40px rgba(0,0,0,.7);padding:28px var(--s4) 34px}
.u2 .u-sheet:before{content:"";position:absolute;left:50%;top:10px;width:40px;height:5px;margin-left:-20px;border-radius:3px;background:var(--rim-strong)}
.u2 .u-dialog{position:absolute;z-index:50;border-radius:var(--r-lg);background:var(--tex),var(--u-surface);border:1px solid var(--gold-deep);box-shadow:inset 0 0 0 4px rgba(0,0,0,.2),inset 0 0 0 5px var(--hair),var(--sh3);padding:var(--s5)}
.u2 .u-dlg-h{display:flex;align-items:flex-start;gap:var(--s3);margin-bottom:var(--s4)}
.u2 .u-dlg-h .u-grow{flex:1}
.u2 .u-toast{position:absolute;z-index:60;display:flex;align-items:center;gap:var(--s3);padding:12px 14px 12px 16px;border-radius:var(--r-md);background:color-mix(in srgb,var(--page) 92%,transparent);border:1px solid var(--rim-strong);box-shadow:var(--sh3);font-size:14px}
.u2 .u-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--s3);padding:var(--s6) var(--s5)}
.u2 .u-emblem{width:88px;height:88px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gold); background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--gold) 16%,transparent),transparent 70%),var(--well);border:1px solid var(--rim-strong);box-shadow:inset 0 0 0 5px rgba(0,0,0,.25),inset 0 0 0 6px var(--hair),0 0 30px color-mix(in srgb,var(--ember) 18%,transparent)}
.u2 .u-emblem.u-err{color:var(--crimson-ink)}
.u2 .u-dk{width:1920px;height:1080px;display:grid;grid-template-columns:272px 1fr;position:relative;overflow:hidden}
.u2 .u-side{display:flex;flex-direction:column;gap:var(--s2);padding:var(--s5) var(--s4);background:var(--tex),var(--u-surface);border-right:1px solid var(--gold-deep);box-shadow:inset -1px 0 0 rgba(0,0,0,.4),6px 0 24px rgba(0,0,0,.45);position:relative;z-index:5}
.u2 .u-side:after{content:"";position:absolute;right:5px;top:0;bottom:0;border-right:1px dashed color-mix(in srgb,var(--gold-deep) 35%,transparent)}
.u2 .u-brand{display:flex;align-items:center;gap:var(--s3);padding:0 var(--s2) var(--s4)}
.u2 .u-brand img{width:48px;height:48px;border-radius:12px;border:1px solid var(--gold-deep);box-shadow:0 0 0 3px rgba(0,0,0,.35),0 0 16px color-mix(in srgb,var(--ember) 30%,transparent)}
.u2 .u-brand b{display:block;font:600 26px/1 var(--serif);background:var(--brass-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.u2 .u-brand b sup{font-size:13px;margin-left:3px;vertical-align:10px}
.u2 .u-brand small{display:block;margin-top:6px;font:700 8.6px/1 var(--sans);letter-spacing:1.1px;white-space:nowrap;color:var(--ink-faded)}
.u2 .u-nav{display:flex;flex-direction:column;gap:2px}
.u2 .u-nav-l{padding:var(--s4) var(--s3) var(--s2)}
.u2 .u-nav a{display:flex;align-items:center;gap:var(--s3);height:44px;padding:0 var(--s3);border-radius:10px;font:600 15px var(--sans);color:var(--ink-soft);text-decoration:none;position:relative}
.u2 .u-nav a svg{color:var(--ink-faded)}
.u2 .u-nav a.u-on{color:var(--gold);background:linear-gradient(90deg,color-mix(in srgb,var(--gold) 16%,transparent),transparent 85%);box-shadow:inset 0 0 0 1px var(--rim)}
.u2 .u-nav a.u-on svg{color:var(--gold)}
.u2 .u-nav a.u-on:before{content:"";position:absolute;left:-16px;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--brass-grad);box-shadow:0 0 10px var(--ember)}
.u2 .u-nav a .u-tag{margin-left:auto}
.u2 .u-side-foot{margin-top:auto;display:flex;flex-direction:column;gap:var(--s3)}
.u2 .u-mechar{display:flex;align-items:center;gap:var(--s3);padding:var(--s3);border-radius:var(--r-md);background:var(--well);border:1px solid var(--hair)}
.u2 .u-mechar .u-grow{flex:1;min-width:0}
.u2 .u-mechar .u-hpbar{margin-top:6px}
.u2 .u-legal{font-size:11px;color:var(--ink-faded);line-height:1.5;padding:0 var(--s2)}
.u2 .u-main{position:relative;display:flex;flex-direction:column;min-width:0;overflow:hidden}
.u2 .u-top{display:flex;align-items:center;gap:var(--s4);height:88px;padding:0 var(--s6) 0 var(--s7);border-bottom:1px solid var(--hair);flex:none;background:linear-gradient(180deg,rgba(0,0,0,.25),transparent)}
.u2 .u-top .u-ttl{flex:1;min-width:0}
.u2 .u-top .u-t-meta{margin-top:4px}
.u2 .u-top .u-field{width:380px;height:42px}
.u2 .u-content{flex:1;min-height:0;padding:var(--s6) var(--s6) var(--s6) var(--s7);overflow:hidden}
.u2 .u-wrap{max-width:1480px}
.u2 .u-g{display:grid;gap:var(--s5)}
.u2 .u-ph{width:412px;height:892px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.u2 .u-sbar{height:28px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 22px;font:600 13px var(--sans);color:var(--ink)}
.u2 .u-sbar span:last-child{display:flex;gap:6px;align-items:center}
.u2 .u-abar{height:56px;flex:none;display:flex;align-items:center;gap:var(--s2);padding:0 var(--s2) 0 var(--s4)}
.u2 .u-abar img.u-logo{width:34px;height:34px;border-radius:9px;border:1px solid var(--gold-deep)}
.u2 .u-abar .u-ttl{flex:1;min-width:0;font:600 21px/1.1 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.u2 .u-abar .u-ttl small{display:block;font:500 12px var(--sans);color:var(--ink-faded);margin-top:2px}
.u2 .u-pbody{flex:1;min-height:0;overflow:hidden;padding:var(--s2) var(--s4) var(--s4);display:flex;flex-direction:column;gap:var(--s4)}
.u2 .u-tabbar{flex:none;height:84px;display:flex;align-items:flex-start;padding:8px 6px 0;background:var(--tex),var(--u-surface);border-top:1px solid var(--gold-deep);box-shadow:0 -8px 24px rgba(0,0,0,.55);position:relative;z-index:6}
.u2 .u-tabbar:before{content:"";position:absolute;left:0;right:0;top:4px;border-top:1px dashed color-mix(in srgb,var(--gold-deep) 35%,transparent)}
.u2 .u-tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding-top:8px;height:56px;font:600 11.5px var(--sans);color:var(--ink-faded);text-decoration:none;position:relative}
.u2 .u-tabbar a.u-on{color:var(--gold)}
.u2 .u-tabbar a.u-on svg{filter:drop-shadow(0 0 6px color-mix(in srgb,var(--ember) 70%,transparent))}
.u2 .u-tabbar a.u-on:after{content:"";position:absolute;bottom:-2px;width:22px;height:3px;border-radius:2px;background:var(--brass-grad);box-shadow:0 0 8px var(--ember)}
.u2 .u-homebar{position:absolute;left:50%;bottom:8px;width:134px;height:5px;margin-left:-67px;border-radius:3px;background:color-mix(in srgb,var(--ink) 75%,transparent);z-index:70}
.u2 .u-stack{display:flex;flex-direction:column}
.u2 .u-hstack{display:flex;align-items:center}
.u2 .u-gap1{gap:var(--s1)}
.u2 .u-gap2{gap:var(--s2)}
.u2 .u-gap3{gap:var(--s3)}
.u2 .u-gap4{gap:var(--s4)}
.u2 .u-gap5{gap:var(--s5)}
.u2 .u-f1{flex:1;min-width:0}
.u2 .u-mla{margin-left:auto}
.u2 .u-tc{text-align:center}
.u2 .u-ell{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Sidebar name: two lines, then ellipsis. A single line clipped "Grukka Ironhide…" at 1180 and on the 272px rail. */
.u2 .u-mechar .u-t-h3{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* the sidebar hero's class line wraps rather than "Barbarian 5 · A…" (30 Oct overflow sweep) */
.u2 .u-mechar .u-t-meta{white-space:normal;overflow:visible;text-overflow:clip;text-wrap:balance}
.u2 .u-fill{height:100%}
/* (31 Oct overflow sweep) button rows that ran off the right edge on phones: the Settings panes' "Export or import /
   Back up everything" row (10-56 px past the edge at 390 and under) and Home's "Unfinished character found" bar
   (16-32 px past the edge at 360 / 344). They wrap; the buttons drop under the text when the text needs the width. */
.u2 .u-setpane .u-hstack{flex-wrap:wrap}
.u2 .u-draftbar{flex-wrap:wrap}
.u2 .u-draftbar .u-f1{min-width:min(100%,220px)}
.u2 .u-ded b{white-space:nowrap}
.u2 .u-scroll{overflow:hidden;-webkit-mask-image:linear-gradient(#000 calc(100% - 56px),transparent);mask-image:linear-gradient(#000 calc(100% - 56px),transparent)}

/* ================= app shell ================= */
body.u2 { font: 400 14px/1.45 var(--sans); color: var(--ink); background: var(--tex-page), var(--page) !important; -webkit-font-smoothing: antialiased; }
.u2 .app { max-width: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; }
.u2 .app > header.header, .u2 .app > .header, .u2 #legalNote { display: none !important; }
.u2 button.u-nav-a, .u2 .u-tabbar button, .u2 .u-mechar-open, .u2 .u-sec-link, .u2 .u-legal-link { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; text-align: left; box-shadow: none; min-height: 0; width: auto; text-transform: none; letter-spacing: normal; }
.u2 button.u-btn, .u2 button.u-chip { margin: 0; font-family: var(--sans); text-transform: none; letter-spacing: normal; min-height: 0; width: auto; line-height: 1; }
.u2 button.u-ibtn { margin: 0; font-family: var(--sans); text-transform: none; letter-spacing: normal; min-height: 0; line-height: 1; }
.u2 .u-btn:focus-visible, .u2 .u-ibtn:focus-visible, .u2 .u-nav-a:focus-visible, .u2 .u-tabbar button:focus-visible, .u2 .u-chip:focus-visible, .u2 .u-row:focus-visible, .u2 [data-u-card]:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.u2 .u-btn:hover { filter: brightness(1.08); }
.u2 .u-av { display: block; border-radius: 50%; object-fit: cover; }
.u2 .u-avi { display: inline-flex; align-items: center; justify-content: center; font: 600 18px/1 var(--serif); color: var(--gold); background: var(--well); }
.u2 .u-sec-link { order: 3; font: 600 13px var(--sans); color: var(--gold); white-space: nowrap; min-height: 32px; display: inline-flex; align-items: center; }
.u2.u-phone .u-sec-link { min-height: var(--u-btn-h); min-width: var(--u-btn-icon); padding: 0 8px; justify-content: center; }
.u2 .u-tag { align-self: flex-start; justify-self: start; }
.u2 .u-hstack .u-tag { align-self: center; }
.u2 .u-ded { font: italic 14px var(--serif); color: var(--ink-faded); text-align: center; }
.u2 .u-ded b { font-style: normal; color: var(--gold); white-space: nowrap; }
.u2 .u-brand-ic.home-brand-icon, .u2 .u-logo.home-brand-icon { display: block; flex: none; margin: 0; }

/* desktop: 272px sidebar + main column with an 88px top bar; the document scrolls */
.u2.u-desk { --u-side-w: 272px; }
/* Home tiles follow the main column, not the viewport. The desk sidebar is 272px and #content padding is 80px, so a 1280 window is ~930px of tile grid. */
.u2.u-desk #content { container-type: inline-size; container-name: hearth; }
.u2.u-desk .u-shell { display: grid; grid-template-columns: var(--u-side-w) minmax(0, 1fr); min-height: 100vh; }
.u2.u-desk .u-side { position: sticky; top: 0; height: 100vh; overflow-y: auto; display: flex; flex-direction: column; gap: var(--s2); padding: var(--s5) var(--s4); background: var(--tex), var(--card-surface); border-right: 1px solid var(--gold-deep); box-shadow: inset -1px 0 0 rgba(0,0,0,.4), 6px 0 24px rgba(0,0,0,.45); z-index: 30; scrollbar-width: none; }
.u2.u-desk .u-side::after { content: ""; position: absolute; right: 5px; top: 0; bottom: 0; border-right: 1px dashed color-mix(in srgb, var(--gold-deep) 35%, transparent); pointer-events: none; }
.u2 .u-brand { display: flex; align-items: center; gap: var(--s3); padding: 0 var(--s2) var(--s4); }
.u2 .u-brand .u-brand-ic { width: 48px; height: 48px; border-radius: 12px; border: 1px solid var(--gold-deep); box-shadow: 0 0 0 3px rgba(0,0,0,.35), 0 0 16px color-mix(in srgb, var(--ember) 30%, transparent); }
.u2 .u-brand b { display: block; font: 600 26px/1 var(--serif); background: var(--brass-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.u2 .u-brand b sup { font-size: 13px; margin-left: 3px; vertical-align: 10px; }
.u2 .u-brand small { display: block; margin-top: 6px; font: 700 8.6px/1 var(--sans); letter-spacing: 1.1px; white-space: nowrap; color: var(--ink-faded); }
.u2 .u-nav { display: flex; flex-direction: column; gap: 2px; }
.u2 .u-nav-l { padding: var(--s4) var(--s3) var(--s2); }
.u2 .u-nav .u-nav-a { display: flex; align-items: center; gap: var(--s3); height: 44px; padding: 0 var(--s3); border-radius: 10px; font: 600 15px var(--sans); color: var(--ink-soft); position: relative; width: 100%; }
.u2 .u-nav-a{white-space:nowrap}
.u2 .u-nav .u-nav-a svg { color: var(--ink-faded); }
.u2 .u-nav .u-nav-a:hover { background: color-mix(in srgb, var(--gold) 7%, transparent); }
.u2 .u-nav .u-nav-a.u-on { color: var(--gold); background: linear-gradient(90deg, color-mix(in srgb, var(--gold) 16%, transparent), transparent 85%); box-shadow: inset 0 0 0 1px var(--rim); }
.u2 .u-nav .u-nav-a.u-on svg { color: var(--gold); }
.u2 .u-nav .u-nav-a.u-on::before { content: ""; position: absolute; left: -16px; top: 10px; bottom: 10px; width: 3px; border-radius: 0 3px 3px 0; background: var(--brass-grad); box-shadow: 0 0 10px var(--ember); }
.u2 .u-nav .u-nav-a .u-tag { margin-left: auto; align-self: center; }
.u2 .u-side-foot { margin-top: auto; display: flex; flex-direction: column; gap: var(--s3); }
.u2 .u-mechar { display: flex; align-items: center; gap: var(--s2); padding: var(--s3); border-radius: var(--r-md); background: var(--well); border: 1px solid var(--hair); }
.u2 .u-mechar-open { flex: 1; min-width: 0; display: flex; align-items: center; gap: var(--s3); }
.u2 .u-mechar .u-grow { flex: 1; min-width: 0; } .u2 .u-mechar .u-hpbar { margin-top: 6px; }
.u2 .u-legal { font-size: 11px; color: var(--ink-faded); line-height: 1.5; padding: 0 var(--s2); }
.u2 .u-legal-link { color: var(--ink-faded); text-decoration: underline; font-size: 11px; }
.u2 button.legal-link, button.legal-link {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px !important; min-height: 44px !important;
  padding: 8px 12px; box-sizing: border-box;
}
.u2.u-desk .u-main { position: relative; display: flex; flex-direction: column; min-width: 0; }
.u2.u-desk .u-top { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: var(--s4); height: 88px; padding: 0 var(--s6) 0 var(--s7); border-bottom: 1px solid var(--hair); flex: none; background: linear-gradient(180deg, rgba(0,0,0,.25), transparent), var(--tex-page), var(--page); }
.u2 .u-top .u-ttl { flex: 1; min-width: 0; } .u2 .u-top .u-ttl .u-t-h1 { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .u2 .u-top .u-t-meta { margin-top: 4px; }
.u2 .u-top .u-field { width: 380px; height: 42px; }
.u2 .u-field input { flex: 1; min-width: 0; background: none; border: 0; outline: 0; color: var(--ink); font: 14px var(--sans); padding: 0; margin: 0; box-shadow: none; height: auto; min-height: 0; }
.u2 .u-field input::placeholder { color: var(--ink-faded); opacity: 1; }
.u2 .u-field:focus-within { border-color: var(--gold); box-shadow: inset 0 1px 3px rgba(0,0,0,.55), 0 0 0 3px color-mix(in srgb, var(--gold) 22%, transparent); }
.u2.u-desk #content { padding: var(--s6) var(--s6) var(--s6) var(--s7); min-height: calc(100vh - 88px); margin: 0; max-width: none; width: auto; }
.u2.u-desk #content.u-legacy { max-width: 980px; }
.u2.u-desk .u-abar, .u2.u-desk .u-tabbar { display: none; }

/* phone (and anything under 1280): 56px app bar + 84px bottom tab bar */
.u2.u-phone .u-side, .u2.u-phone .u-top { display: none; }
.u2.u-phone .u-abar { position: sticky; top: 0; z-index: 20; height: 56px; display: flex; align-items: center; gap: var(--s2); padding: 0 var(--s2) 0 var(--s4); background: linear-gradient(180deg, var(--page) 70%, color-mix(in srgb, var(--page) 0%, transparent)); }
.u2 .u-abar .u-logo { width: 34px; height: 34px; border-radius: 9px; border: 1px solid var(--gold-deep); }
.u2 .u-abar .u-ttl { flex: 1; min-width: 0; font: 600 21px/1.1 var(--serif); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink); }
.u2 .u-abar .u-ttl small { display: block; font: 500 12px var(--sans); color: var(--ink-faded); margin-top: 2px; }
.u2 .u-ibtn { cursor: pointer; padding: 0; }
.u2.u-phone #content { padding: var(--s2) var(--s4) calc(84px + var(--s4)); margin: 0; max-width: none; width: auto; }
.u2.u-phone .u-tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; height: calc(76px + env(safe-area-inset-bottom, 8px)); min-height: 84px; display: flex; align-items: flex-start; padding: 8px 6px 0; background: var(--tex), var(--card-surface); border-top: 1px solid var(--gold-deep); box-shadow: 0 -8px 24px rgba(0,0,0,.55); }
.u2 .u-tabbar::before { content: ""; position: absolute; left: 0; right: 0; top: 4px; border-top: 1px dashed color-mix(in srgb, var(--gold-deep) 35%, transparent); pointer-events: none; }
.u2 .u-tabbar button { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; padding-top: 8px; height: 56px; font: 600 11.5px var(--sans); color: var(--ink-faded); position: relative; text-align: center; }
.u2 .u-tabbar button.u-on { color: var(--gold); }
.u2 .u-tabbar button.u-on svg { filter: drop-shadow(0 0 6px color-mix(in srgb, var(--ember) 70%, transparent)); }
.u2 .u-tabbar button.u-on::after { content: ""; position: absolute; bottom: -2px; width: 22px; height: 3px; border-radius: 2px; background: var(--brass-grad); box-shadow: 0 0 8px var(--ember); }
.u2.u-notabs .u-tabbar { display: none; }
.u2.u-notabs.u-phone #content { padding-bottom: var(--s4); }
.u2.u-noshell .u-side, .u2.u-noshell .u-top, .u2.u-noshell .u-abar, .u2.u-noshell .u-tabbar { display: none; }
.u2.u-noshell.u-desk .u-shell { grid-template-columns: 1fr; }
/* the C2 battle map is position:fixed over everything; keep the shell out of its way */
.u2[data-u-route="map"] .u-tabbar { display: none; }
/* toasts: bottom centre of the main column on desktop, above the tab bar on phone */
.u2 .hearth-toast { display: flex !important; align-items: center; gap: var(--s3); padding: 12px 16px !important; border-radius: var(--r-md) !important; background: color-mix(in srgb, var(--page) 92%, transparent) !important; color: var(--ink) !important; border: 1px solid var(--rim-strong) !important; box-shadow: var(--sh3) !important; font: 14px/1.4 var(--sans) !important; max-width: min(560px, calc(100vw - 32px)); }
.u2.u-desk .hearth-toast { left: calc(50% + var(--u-side-w) / 2) !important; transform: translateX(-50%); bottom: 32px !important; }
.u2.u-phone .hearth-toast { bottom: calc(84px + 12px) !important; }
.u2.u-notabs.u-phone .hearth-toast { bottom: 16px !important; }
/* Map builder (30 Oct): toasts sit low in the middle, above the builder's "Tap a piece" hint, clear of the live game's
   Connected pill (top right) and of the builder's top bar and tool rows. Home's and GM mode's top-of-screen toast
   positions stay as they are everywhere else. */
html:root body:has(#mb):has(#mb .mb-top) .hearth-toast { top: auto !important; bottom: calc(60px + var(--hearth-safe-bottom, 0px)) !important; left: 50% !important; transform: translateX(-50%) !important; z-index: 9001 !important; width: max-content; max-width: min(440px, calc(100vw - 32px)); }
/* ...and the Connected pill itself moves off the builder's top bar (it covered Redo, Save and Use in game) to the map's
   top-left corner, under the tool rows. */
html:root body:has(#mb):has(#mb .mb-top) #hearthLinkHealth { top: calc(124px + var(--hearth-safe-top, 0px)) !important; right: auto !important; left: calc(8px + var(--hearth-safe-left, 0px)) !important; }
/* the one-time "Hearth has a new look" note goes away when the map builder opens (it covered the Tools row) */
html:root body:has(#mb):has(#mb .mb-top) .hearth-toast[data-newlook] { display: none !important; }
.u2 .hearth-toast .toast-icon { display: inline-flex; color: var(--gold); font-size: 0 !important; }
.u2 .hearth-toast .toast-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
/* resets: the app styles bare buttons and inputs; the design system draws its own */
.u2 .u-ibtn { flex: none; }
.u2 .u-seg > button { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 12px !important; margin: 0 !important; min-height: 0 !important; height: var(--u-seg-h) !important; font: 600 13px var(--sans) !important; color: var(--ink-faded) !important; cursor: pointer; text-transform: none !important; letter-spacing: normal !important; width: auto; flex: 1; border-radius: var(--r-pill) !important; }
.u2 .u-seg > button.u-on { background: var(--tex), var(--u-surface) !important; color: var(--gold) !important; box-shadow: inset 0 0 0 1px var(--rim-strong), 0 2px 4px rgba(0,0,0,.4) !important; }
.u2 .u-seg > button:active { filter: brightness(1.08); }
.u2 .u-top .u-seg { width: 260px; flex: none; }
.u2 .u-field input, .u2 .u-field select { flex: 1; min-width: 0; background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; color: var(--ink) !important; font: 14px var(--sans) !important; padding: 0 !important; margin: 0 !important; height: 100% !important; min-height: 0 !important; border-radius: 0 !important; width: auto !important; }
.u2 .u-field input::-webkit-search-cancel-button { filter: grayscale(1); }
html:root body.u2.u2.u2 .u-field.u-field input:is([type], :not([type])), html:root body.u2.u2.u2 .u-field.u-field select:is([id], :not([id])) { background: transparent !important; background-image: none !important; border: 0 !important; box-shadow: none !important; outline: 0 !important; padding: 0 !important; margin: 0 !important; min-height: 0 !important; height: 100% !important; border-radius: 0 !important; color: var(--ink) !important; }
/* overlays (HearthUI.modal) */
.u2 .u-layer { position: fixed; inset: 0; z-index: 400; }
.u2 .u-layer > .u-scrim { position: absolute; inset: 0; z-index: 0; }
.u2 .u-layer > .u-scrim.u-light { background: rgba(0,0,0,.42); backdrop-filter: none; }
.u2.u-desk .u-layer > .u-dialog { position: absolute; z-index: 1; left: calc(var(--u-side-w) + (100% - var(--u-side-w)) / 2); top: 50%; transform: translate(-50%, -50%); max-height: calc(100vh - 64px); overflow: auto; width: 560px; max-width: calc(100vw - var(--u-side-w) - 32px); }
.u2.u-phone .u-layer > .u-sheet { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; max-height: calc(100vh - 24px); overflow: auto; padding-top: 28px; transition: transform .18s ease; }
.u2.u-phone .u-layer > .u-sheet:before { display: none; }
.u2 .u-layer .u-grab { position: absolute; left: 50%; top: 10px; width: 40px; height: 5px; margin-left: -20px; border-radius: 3px; background: var(--rim-strong); }
.u2 .u-layer :focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
body.u2.u-modal-open { overflow: hidden; }
.u2 .u-emo { display: inline-flex; vertical-align: -0.15em; width: 1.05em; height: 1.05em; margin-right: .3em; }
.u2 .u-emo svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.u2 .u-emo.u-emo-gold { color: var(--gold); }
.u2 .u-emo.u-emo-dot { margin-right: 0; }
.u2 .u-emo.u-emo-dot svg { stroke: none; fill: currentColor; }
.u2 .u-emo-hostile { color: var(--hostile); } .u2 .u-emo-ally { color: var(--ally); } .u2 .u-emo-neutral { color: var(--ink-faded); }
/* DM map: template buttons draw SVG icons (aoeShapeSVG) - the circle under each one takes the tap */
.dm-aoe-svgico { fill: none; stroke: var(--gold, #d8b25a); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; overflow: visible; }
.dm-aoe-btn.on + .dm-aoe-svgico { stroke: var(--on-gold, #1a1208); }
/* the palette layer styles any [aria-pressed=true] / .selected control with its own glow; selected chips keep Jenny's brass */
html:root body.u2.u2.u2 .u-chip.u-chip:is(.u-on, [aria-pressed="true"]) { background: var(--brass-grad) !important; color: var(--on-gold) !important; border-color: transparent !important; box-shadow: none !important; }
html:root body.u2.u2.u2 .u-rrow.u-rrow[aria-pressed] { background: transparent !important; box-shadow: none !important; }
html:root body.u2.u2.u2 .u-rrow.u-rrow.u-on[aria-pressed] { background: color-mix(in srgb, var(--gold) 9%, transparent) !important; }
/* v1.7.1 — edge-to-edge safe areas (Chrome on Android 15 with viewport-fit=cover, and the Android app, which
   is always edge-to-edge and writes --hearth-native-*). The shell keeps its bars clear of the status bar,
   the gesture/3-button nav bar, the Fold's taskbar and side cutouts. In a desktop browser every inset is 0. */
.u2.u-phone .u-abar { top: 0; height: calc(56px + var(--hearth-safe-top)); padding-top: var(--hearth-safe-top); padding-left: calc(var(--s4) + var(--hearth-safe-left)); padding-right: calc(var(--s2) + var(--hearth-safe-right)); }
.u2.u-phone .u-tabbar { height: max(84px, calc(76px + var(--hearth-safe-bottom))); min-height: 84px; padding-bottom: var(--hearth-safe-bottom); padding-left: calc(6px + var(--hearth-safe-left)); padding-right: calc(6px + var(--hearth-safe-right)); }
.u2.u-phone #content { padding-bottom: calc(84px + var(--s4) + var(--hearth-safe-bottom)); padding-left: calc(var(--s4) + var(--hearth-safe-left)); padding-right: calc(var(--s4) + var(--hearth-safe-right)); }
.u2.u-notabs.u-phone #content { padding-bottom: calc(var(--s4) + var(--hearth-safe-bottom)); }
.u2.u-desk .u-top { top: 0; height: calc(88px + var(--hearth-safe-top)); padding-top: var(--hearth-safe-top); padding-right: calc(var(--s6) + var(--hearth-safe-right)); }
.u2.u-desk .u-side { padding: calc(var(--s5) + var(--hearth-safe-top)) var(--s4) calc(var(--s5) + var(--hearth-safe-bottom)) calc(var(--s4) + var(--hearth-safe-left)); }
.u2.u-desk #content { padding-bottom: calc(var(--s6) + var(--hearth-safe-bottom)); padding-right: calc(var(--s6) + var(--hearth-safe-right)); }
.u2.u-phone .u-layer > .u-sheet{padding-bottom:calc(var(--s4) + var(--hearth-safe-bottom));max-height:calc(100vh - 24px - var(--hearth-safe-top))}

/* v1.7.3 — the laptop layout fits narrower screens (Tom: unfolded Galaxy Fold gets the laptop layout).
   1024–1279: slimmer sidebar. Under 1024 (Fold portrait ~773): an icon rail; labels show as tooltips. */
@media (max-width: 1279px) {
  .u2.u-desk { --u-side-w: 220px; }
  .u2.u-desk .u-top { padding-left: var(--s5); gap: var(--s3); }
  .u2.u-desk .u-top .u-field { width: auto; flex: 0 1 300px; min-width: 160px; }
  .u2.u-desk #content { padding-left: var(--s5); padding-right: var(--s5); }
  .u2.u-desk .u-brand b { font-size: 22px; }
  .u2.u-desk .u-side .u-brand small { display: none; }
  .u2.u-desk .u-top .u-field { flex: 1 1 260px; min-width: 220px; max-width: 360px; }
}
@media (max-width: 1023px) {
  .u2.u-desk { --u-side-w: 76px; }
  .u2.u-desk .u-side { padding-left: 8px; padding-right: 8px; align-items: center; }
  .u2.u-desk .u-side::after { right: 3px; }
  .u2.u-desk .u-brand { padding: 0 0 var(--s3); justify-content: center; }
  .u2.u-desk .u-brand > div, .u2.u-desk .u-side .u-nav-l, .u2.u-desk .u-side .u-legal, .u2.u-desk .u-side .u-mechar .u-grow,
  .u2.u-desk .u-side .u-nav .u-nav-a > span, .u2.u-desk .u-side .u-nav .u-nav-a .u-tag { display: none; }
  .u2.u-desk .u-brand .u-brand-ic { width: 44px; height: 44px; }
  .u2.u-desk .u-side .u-nav { width: 100%; }
  .u2.u-desk .u-side .u-nav .u-nav-a { justify-content: center; padding: 0; height: 48px; }
  .u2.u-desk .u-side .u-nav .u-nav-a.u-on::before { left: -8px; }
  .u2.u-desk .u-side-foot { width: 100%; align-items: center; }
  .u2.u-desk .u-mechar { padding: 6px; justify-content: center; background: none; border: 0; }
  .u2.u-desk .u-mechar > :not(.u-mechar-open) { display: none; }
  .u2.u-desk .u-top { height: auto; min-height: 64px; padding: var(--s3) var(--s4); flex-wrap: wrap; }
  .u2.u-desk .u-top .u-t-h1 { font-size: 26px; }
  .u2.u-desk #content { padding: var(--s4); min-height: calc(100vh - 64px); }
}
/* Laptop top bar: never crush the title. When the title, filters, search and actions don't fit on one line
   (Characters at 1024 and 1366), they wrap to a second row instead of squeezing the title to "C…". */
.u2.u-desk .u-top { flex-wrap: wrap; height: auto; min-height: calc(88px + var(--hearth-safe-top)); row-gap: var(--s3); padding-top: calc(var(--s3) + var(--hearth-safe-top)); padding-bottom: var(--s3); }
.u2.u-desk .u-top .u-ttl { flex: 1 1 170px; min-width: 160px; }
.u2.u-desk .u-top .u-ttl .u-t-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.u2.u-desk .u-top .u-field { width: auto; flex: 1 1 200px; min-width: 180px; max-width: 380px; }
.u2.u-desk .u-top > .u-btn, .u2.u-desk .u-top > .u-seg { flex: none; }
@media (max-width: 1279px) { .u2.u-desk .u-top .u-field { flex: 1 1 200px; min-width: 160px; max-width: 360px; } .u2.u-desk .u-top .u-seg { width: 200px; } }
@media (max-width: 1023px) { .u2.u-desk .u-top { min-height: 64px; } }
/* phones: never wider than the screen, whatever the width (360–430 px) */
.u2.u-phone, .u2.u-phone .u-shell, .u2.u-phone #content { max-width: 100vw; overflow-x: clip; }
/* Disabled buttons look disabled: no gold, faded, not-allowed cursor (builder Next before a choice is made). */
.u2 .u-btn:disabled, .u2 .u-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; background: var(--well) !important; color: var(--ink-faded) !important; border-color: var(--hair) !important; box-shadow: none !important; text-shadow: none !important; transform: none !important; filter: grayscale(.4); }
.u2 .u-btn:disabled svg { opacity: .7; }
/* Text size setting (S/M/L/XL) on the new screens: they are drawn in px, so the content area and the
   contents of dialogs are scaled as a whole (text, spacing and targets together); the layout reflows to
   the narrower effective width, so nothing spills sideways. Sidebar, top bar and tab bar keep their size. */
body.u2 { --u-text-scale: 1; }
body.u2.text-s { --u-text-scale: .93; }
body.u2.text-l { --u-text-scale: 1.1; }
body.u2.text-xl { --u-text-scale: 1.2; }
.u2 #content.u-screen, .u2 #content.u-legacy, .u2 .u-layer > .u-sheet > *, .u2 .u-layer > .u-dialog > * { zoom: var(--u-text-scale); }
/* Small text (zoom under 1) used to shrink that box from the left edge, so on a phone the
   right margin was about three times the left and the cards sat off-centre. A floor of the
   column width keeps both margins equal at every text size. Large text still reflows inside
   the same column, so it does not spill sideways. The sheet's grab handle keeps its own width. */
.u2 #content.u-screen, .u2 #content.u-legacy,
.u2 .u-layer > .u-sheet > :not(.u-grab),
.u2 .u-layer > .u-dialog > * { min-width: 100%; }
/* Laptop layout on a touch screen (Galaxy Fold on its side, touch laptops): every control is at least 36 px
   to tap. Mouse and trackpad layouts are untouched. */
@media (pointer: coarse) {
  .u2.u-desk {
    --u-btn-h: 44px;
    --u-btn-h-sm: 44px;
    --u-btn-h-lg: 52px;
    --u-btn-icon: 44px;
    --u-seg-h: 44px;
    --u-chip-h: 44px;
  }
  .u2.u-desk #content :is(button, [role=button], select, input:not([type=checkbox]):not([type=radio]):not([type=range])):not(.u-cs-main):not(.u-row):not([hidden]):not(.c2-btn):not(.c2-more-btn):not(.slot-pip):not(.mi-hdl),
  .u2.u-desk .u-layer :is(button, [role=button], select, input:not([type=checkbox]):not([type=radio]):not([type=range])):not([hidden]):not(.slot-pip) {
    min-height: var(--u-btn-h) !important; min-width: var(--u-btn-icon) !important;
  }
  .u2.u-desk #content :is(.u-chip, .u-seg > button, .u-btn.u-sm, .u-sec-link) { min-height: var(--u-btn-h); }
  .u2.u-desk .u-top .u-field { height: var(--u-btn-h); min-height: var(--u-btn-h); }
  /* (the battle map header buttons are left out: they set their own 44 px touch size) */
  .u2.u-desk #content .u-sec-link { padding-left: 8px; padding-right: 8px; display: inline-flex; align-items: center; justify-content: center; }
  /* spell slot pips: small diamonds, a 36 px invisible hit area each */
  .u2.u-desk #content .u-cs-pips .slot-pip { position: relative; margin: 6px 9px !important; }
  .u2.u-desk #content .u-cs-pips .slot-pip::after { content: ''; position: absolute; inset: -11px; }
}
/* Desk dialogs clear the sidebar. Phone sheets from 700px sit in a 680px column (the character sheet's full-bleed rule is overridden at the same width). */
.u2.u-desk .dialog-backdrop{padding-left:calc(var(--u-side-w) + 24px)!important}
@media (min-width:700px){
  .u2.u-phone #content{max-width:680px;width:100%;margin-inline:auto}
  .u2.u-phone #content.u-csm{max-width:680px!important;width:100%!important;margin-inline:auto}
  .u2.u-phone .u-abar{max-width:680px;width:100%;margin-inline:auto}
}
/* Phone type floor. These were still under 11px after the first pass. */
.u2.u-phone :is(.dm-level-pick, .spell-source-tag, .feature-spell-tag, .dm-tile-init-lbl, .roll-log .small-note, .roll-log-detail){font-size:11px!important}


/* ==== F3 contrast fixes (Jenny, 2026-10-21) — generated by contrast-f3/gen.js, verified by scan.js ====
   New component tokens; each falls back to the value used before, so themes without an entry are unchanged.
   Selectors start with html:root so the block wins regardless of where it is loaded. */
:root {
  --u-brass-btn: linear-gradient(180deg, var(--u-brass-top, color-mix(in srgb, var(--gold) 62%, #fff)) 0%, var(--u-brass-mid, var(--gold)) 46%, var(--u-brass-end, var(--gold-deep)) 100%);
}
/* (a) primary brass buttons + gold tag/chip: own ink + own gradient, decorative --brass-grad (brand text, rivets, tab underline) untouched */
html:root .u2 :is(.u-btn.u-primary, .u-tag.u-gold, .u-chip.u-on) { background: var(--u-brass-btn); color: var(--u-on-brass, var(--on-gold)); }
html:root .u2 .u-chip.u-on b { color: var(--u-on-brass, var(--on-gold)); }
/* (b) DM XP "Easy" chip */
html:root .dm-xp-diff.diff-easy { background: var(--u-diff-easy-bg, #4a7c59); }
/* (c) DM tile remove ✕ (white glyph; plate darkened instead of touching the shared --crimson) */
html:root body .dm-tile-remove-x { background: var(--u-remove-bg, var(--crimson)) !important; }
/* (d) gold used as text: active nav (tab bar + sidebar), section links, DM game name, dedication */
html:root .u2 :is(.u-tabbar a.u-on, .u-tabbar button.u-on, .u-nav a.u-on, .u-nav .u-nav-a.u-on, .u-sec-link, .u-ded b) { color: var(--u-gold-ink, var(--gold)); }
html:root .dm-game-name { color: var(--u-gold-ink, var(--gold)); }
/* extra (found at desktop width / settings): meta text, empty-initiative "+" */
html:root .u2 .u-t-meta { color: var(--u-meta-ink, var(--ink-faded)); }
html:root[data-theme="light"] .dm-tile-init.dm-tile-init-empty .dm-tile-init-num { color: var(--u-init-empty-ink, var(--gold-deep, var(--gold))); }
html:root[data-theme="dark"] .dm-tile-init.dm-tile-init-empty .dm-tile-init-num { color: var(--u-init-empty-ink, var(--gold)); }
html:root .dm-xp-diff.diff-hard { background: var(--u-diff-hard-bg, #c2722e); color: var(--u-diff-hard-ink, #1f1409); }
html:root .dm-xp-diff.diff-medium { background: var(--u-diff-medium-bg, var(--gold)); color: var(--u-diff-medium-ink, var(--parchment)); }
/* v2: DM random-encounter "Deadly" picker on Scott's Ultramarine (4.61 -> 4.89) */
html:root[data-palette="scott-ultramarine"] .dm-diff-btn.deadly { color: #e58f7f; }
/* per-theme values */
html[data-palette="hearth"] { --u-diff-easy-bg: #598c68; }
html[data-theme="light"]:not([data-palette]) { --u-on-brass: #fdedca; --u-brass-top: #7d643c; --u-brass-mid: #8a6016; --u-diff-easy-bg: #2e5f3f; --u-gold-ink: #674402; --u-init-empty-ink: #745222; --u-meta-ink: #573e20; --u-diff-medium-ink: #1f1409; }
html[data-theme="dark"]:not([data-palette]) { --u-on-brass: #2d2410; --u-diff-easy-bg: #60936e; --u-remove-bg: #ac4435; --u-gold-ink: #dea955; }
html[data-palette="contrast"] { --u-diff-easy-bg: #528461; --u-remove-bg: #b8353c; }
html[data-palette="tavern"] { --u-on-brass: #3f3620; --u-diff-easy-bg: #5c8e6a; --u-remove-bg: #aa4532; }
html[data-palette="forest"] { --u-on-brass: #f5f9eb; --u-brass-top: #646d44; --u-diff-easy-bg: #3b6d4c; --u-meta-ink: #44563f; }
html[data-palette="forge"] { --u-on-brass: #2d251c; --u-diff-easy-bg: #5e916d; --u-remove-bg: #af4133; --u-gold-ink: #ff9c60; }
html[data-palette="arcane"] { --u-on-brass: #524521; --u-diff-easy-bg: #5d906c; --u-remove-bg: #b3384d; }
html[data-palette="frost"] { --u-diff-easy-bg: #3e704f; --u-meta-ink: #3d566f; --u-brass-top: #78673d; }
html[data-palette="infernal"] { --u-on-brass: #2c2217; --u-diff-easy-bg: #578a66; --u-remove-bg: #bd3026; }
html[data-palette="oldmap"] { --u-on-brass: #f8eed6; --u-brass-top: #7b6446; --u-diff-easy-bg: #386a49; --u-meta-ink: #59462d; }
html[data-palette="hoard"] { --u-diff-easy-bg: #5c8f6b; --u-remove-bg: #b6382d; }
html[data-palette="dawn"] { --u-on-brass: #000000; --u-brass-mid: #9a732b; --u-diff-easy-bg: #437552; --u-init-empty-ink: #87691c; --u-meta-ink: #5a564b; --u-brass-end: #95752c; }
html[data-palette="shade"] { --u-on-brass: #2c4214; --u-diff-easy-bg: #568965; --u-remove-bg: #b53a35; }
html[data-palette="wildwood"] { --u-on-brass: #2a2716; --u-diff-easy-bg: #5d906c; --u-remove-bg: #ad4145; --u-gold-ink: #ff9673; --u-meta-ink: #aeae99; }
html[data-palette="moonsilver"] { --u-on-brass: #254a41; --u-diff-easy-bg: #5f926e; --u-remove-bg: #ad4051; --u-meta-ink: #a4a9af; }
html[data-palette="pact"] { --u-on-brass: #3a2747; --u-diff-easy-bg: #568864; --u-remove-bg: #b23b50; }
html[data-palette="surge"] { --u-on-brass: #3f1e34; --u-diff-easy-bg: #5a8d68; --u-remove-bg: #ae4136; --u-meta-ink: #b8a8b9; }
html[data-palette="encore"] { --u-diff-easy-bg: #5c8e6a; --u-remove-bg: #ac4246; }
html[data-palette="warpaint"] { --u-brass-top: #975945; --u-diff-easy-bg: #396a49; --u-init-empty-ink: #a14829; --u-meta-ink: #504d4a; --u-brass-end: #a94f30; }
html[data-palette="mountain"] { --u-brass-top: #8e5e34; --u-brass-end: #9e560f; --u-diff-easy-bg: #3d6e4d; --u-init-empty-ink: #9c540d; --u-meta-ink: #52524d; --u-gold-ink: #944202; }
html[data-palette="banner"] { --u-diff-easy-bg: #2f6040; --u-init-empty-ink: #6e5704; --u-meta-ink: #43464a; --u-brass-top: #76673a; --u-brass-end: #7f671a; }
html[data-palette="clockwork"] { --u-on-brass: #43240c; --u-diff-easy-bg: #649671; --u-remove-bg: #ae413c; --u-gold-ink: #fca973; }
html[data-palette="scales"] { --u-on-brass: #300d03; --u-diff-easy-bg: #5d906b; --u-remove-bg: #ac4054; --u-gold-ink: #ff916f; }
html[data-palette="hollow"] { --u-brass-top: #856237; --u-diff-easy-bg: #356645; --u-init-empty-ink: #885304; --u-meta-ink: #574927; --u-brass-end: #955d0b; --u-gold-ink: #7e4402; }
html[data-palette="scott-ultramarine"] { --u-diff-easy-bg: #60936e; --u-remove-bg: #a44855; }
html[data-palette="scott-marine"] { --u-diff-easy-bg: #5d8f6a; --u-remove-bg: #b93537; }

/* ==== F5 onboarding scroll hint: short phones (Galaxy Fold cover 280x653), phone onboarding step ====
   Soft fade at the bottom of the scrolling step + a small "More below" pill; both show only while there is
   more to scroll (screens-onboarding.js toggles .u-more) and hide once the end is reached. */
.u2 .u-obpw { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; }
.u2 .u-obpw > .u-obp { flex: 1; min-height: 0; }
.u2 .u-obpw::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 64px; pointer-events: none; background: linear-gradient(to bottom, color-mix(in srgb, var(--page) 0%, transparent), var(--page) 85%); opacity: 0; transition: opacity .2s ease; }
.u2 .u-obpw.u-more::after { opacity: 1; }
.u2 .u-obmore { position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%); z-index: 2; display: inline-flex; align-items: center; gap: 4px; height: 44px; min-height: 44px; width: auto; margin: 0; padding: 0 12px; border-radius: 999px; border: 1px solid var(--hair); background: var(--well); color: var(--ink); font: 600 12px/1 var(--sans); text-transform: none; letter-spacing: normal; box-shadow: none; opacity: 0; pointer-events: none; transition: opacity .2s ease; cursor: pointer; }
.u2 .u-obpw.u-more .u-obmore { opacity: 1; pointer-events: auto; }
.u2 .u-obmore svg { width: 14px; height: 14px; }
@keyframes u-obbob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(2px); } }
@media (prefers-reduced-motion: no-preference) { html:not([data-motion="reduced"]) .u2 .u-obpw.u-more .u-obmore svg { animation: u-obbob 1.6s ease-in-out infinite; } }
@media (prefers-reduced-motion: reduce) { .u2 .u-obpw::after, .u2 .u-obmore { transition: none; } }
html[data-motion="reduced"] .u2 .u-obpw::after, html[data-motion="reduced"] .u2 .u-obmore { transition: none; }

/* ===== Black oak and brass (Jenny's look from PR #66, built in, Oct 2026) =====
   The character sheet's floor and the leather and brass of everything you press, in every pop-up.
   The sheet's own parts are styled in screens-sheet3.js; these are the shared pieces. */
:root {
  --hearth-oak: url("data:image/webp;base64,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");
  --hearth-oak-dlg: url("data:image/webp;base64,UklGRjAFAABXRUJQVlA4ICQFAACQIQCdASoAAQABPp1CnU2lo6MmIjD6yMATiWlsYvdtQPeojnVViXVVEYBq5jhsWd1MfP9++j7380Ee0prmP/YA876fsAoo08UBqUSoMmJFWJPizM6TKypvZlH//VqM7GIiP92hw6zQwAwkEk3dVdKistWpikLeqaVjNBVBneg5Mz5mAXS5kc1ymeDpAWYDMqIG6lm9n6h0YG8iUGOpKzpf9Ksb9chghCiIdkX+gOY+qAjAVSL2bhZpdL+7MunAKY+l+BcZ4bbI8HDbjfgfQIXLRhFyLwDC4+eVcMQCfaeoXVQP9Ax4sah8BsU3ecyY1iT24SZkaV9snj6tVq1ExRi3G1Jh/4rVeRX86m7tHOCtAVMS6q0AAP7wnNQc9733r+D+BLQU/Ps5rEZl1QYAwRA1p3kvQ7NDyyGqfzTeXjvu+WeARJmvDFKWfYRn44NPwEQyjESHE+LoSrz3nooK5B+jI0WN3OLWzNWWAnKaY5K3JLqXj7FkgtQtJjFAYhmN73Taw0Ntsdq7X1sornqedW/nxR6q/lCnhM3OCSRqo1WbrL0ObuiPRXAW9+qAZeidEs8cElXWtdjDwPJnm7qZqm8dfIJ7VQT8HU3ujY3fRiMbpHpzDn+5zcAT0Ohd5THLeV6xtanX54uKHhbvxdFM09g8UyWOlDaYMDG4bAFM7iV1sVmA4GY9A6Cwp/nJfcUH0+q5l+n+QGpjrsFYi5nCUfkPJnLacnRs4Fzcd8M/XR4OrU4nPlJWx+FVeqa+/KX+LZ9jHJlXanmQNvI4tQJR2do11k3ioDic3j/K3ZrtTUeka5ZzY5XfHnxki1AFh0uJbN9Zz0+foypSmLoo7QoivQhfDLX0vUp7z5lCSQN05hfmC0acDOUdKGGbf+0/kYclfgq0No2zr9zFI36TQKNItkGUqxgx17a62HA4mpQ8y0VA3Px/eVJXzSiap5CWOjQtNSgZQI2zLp2aRpcT53nItkiSnnYU8eeqIk99Pi6kZzWbTnRLpdJJIZqXTbKtcsvncusIr/KRty95SHw5ld3b/OJAJIHwmca0Fsd4uZxGd+UIxe1PK9zIJ8AT6IhKA4YB1PYFFK8LJ3oklzjboceKjk7gHF63fEsMmDS1LOhPru/9sCHsgtx3TojSA3f4aWfX49vPCOxb8yMONImYZs8pGQCGb8xaJVKNWRAkiKznC2RJ/uoeKnkp/gAaUNGHLrRtGJtEfuz2ib4D+UIUvDGiL6ORbfmdeV//xKZ20nwLqxmnc2qg8V7ZcmJxCWrmGBPJYgzD0roBlvDFaR286iF7f1RJZqaT3PmqBUF0T8coqcIGnZksfm5U+fFKtiHtbsarMSUuGorDmTnTM0lHUpxsOokzWYoA2YtUapayfWJAtuxboCH6oamChuV5UFlY96jmrYWI2siimbdayALEYP6CneZXKQa9/JfRHosOujGAT/2mjg2LrtXYMTyFL/P/aUECsQVsAw6RH2acIlPYO7M8BGM+HZ5IdAoX6c9jyt/ePfQXcteazebhUjyxTUr0FfSkkNoSk9vgcvxU9CWtOumQQl+4+L+fnLwHDhratPnJxoMvyqfvKetPsgpCO5KP6QjC4La6Endg4vqZDkpNsQB8AaxGUuq9nQFLd/UvCNqcTh1gMNSZBWAH7zNcMS/a/ADJrwEfYBYaR5QLW91cYVZnzRGNMZN+Jvm3E7k/UC4S32PvfyuPflq60rwGcU2qCRjhF4i2OoILnuUwpUrVKC+lXgpwIF2QAA==");
  --oak-ink: #f3e6cf; --oak-soft: #cdbb9c; --oak-faded: #b3a48a; /* was #a8957a, read as brown (31 Oct colour sweep) */
  --oak-brass: #d9a94e; --oak-brass-deep: rgba(201,153,63,.7); --oak-brass-hi: #f0cf86;
  --oak-card: linear-gradient(#111113f0, #070708f2);
  --oak-leather: linear-gradient(170deg, #333339 0%, #202025 55%, #17171a 100%);
  --oak-leather-on: linear-gradient(170deg, #3c3c43 0%, #2e2e33 60%, #1f1f22 100%);
  --oak-btn: linear-gradient(#3a3a42, #252529);
  --oak-brass-grad: linear-gradient(#f0cf86, #c9953f 60%, #a8772c);
  --oak-press: inset 0 1px 0 #ffffff14, inset 0 0 0 2px #0c0c0e80, 0 3px 8px #000b;
}
/* first paint: every boot, including Home, is the dark Hearth colour before the app has drawn.
   A saved sheet (u2-boot-sheet) still gets the oak floor. The inline rule in index.html covers the gap before this file. */
html.u2-booting, html.u2-booting body { background: #0e0e10 !important; color-scheme: dark; }
html.u2-boot-sheet, html.u2-boot-sheet body { background: var(--hearth-oak) 0 0/500px 500px repeat, #050404 !important; }
/* the sheet: black oak floor (both columns on a laptop), a dark oak tab bar, and room under the last row */
body[data-u-route="sheet"], body[data-u-route="sheet"] #content.u-csm,
body.u-cs3split[data-u-route="sheet"] .u-cs3-l, body.u-cs3split[data-u-route="sheet"] .u-cs3-r { background: var(--hearth-oak) 0 0/500px 500px repeat, #050404 !important; }
body[data-u-route="sheet"] .u-tabbar { background: linear-gradient(#0c0c0ef5, #050404fa), var(--hearth-oak) 0 0/500px 500px !important; border-top: 1px solid var(--oak-brass-deep) !important; box-shadow: 0 -10px 24px #000c !important; }
body[data-u-route="sheet"]:not(.u-cs3split) #content.u-csm { padding-bottom: calc(var(--u-tabbar-h, 84px) + 24px + env(safe-area-inset-bottom, 0px)) !important; }
/* laptop: no side rail on the sheet, two columns edge to edge; Home and Characters are in the sheet's menu */
body[data-u-route="sheet"].u-cs3split .u-side { display: none !important; }
body[data-u-route="sheet"].u-cs3split .u-shell { grid-template-columns: minmax(0, 1fr) !important; }
body[data-u-route="sheet"].u-cs3split #content.u-csm { padding-left: 20px !important; padding-right: 20px !important; }
.weapon-custom-tag { display: inline-block; vertical-align: middle; margin-left: 6px; padding: 1px 7px; border-radius: 999px; border: 1px solid #7fbf7a; color: #cfe8cb; font: 600 11px/1.5 var(--sans); letter-spacing: .04em; text-transform: uppercase; }

/* ----- every pop-up: leather buttons edged in brass, the call to action in brass (Jenny 48a) -----
   (The welcome tour keeps its own buttons: its steps are laid out to hold still.)
   One class per selector here, so the brass rule after it (two classes) always wins for what you pick. */
:is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.dialog-option, .roll-line-btn, .stat-edit-adj, .stat-edit-roll-btn, .stat-edit-skill-row, .gear-edit-btn, .gear-card-btn, .gear-add-btn, .shield-toggle, .weapon-magic-btn, .link-acct-link, .xp-action, .dialog-close, .char-popup-close, .browse-action-btn, .dialog-btn, .item-delete, .item-qty-btn, .layered-add-btn, .secondary-btn, .hp-quick-btn, .hp-apply-btn, .hf142-lvl-btn),
:is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop) .btn:not(.primary):not(.danger),
.u-layer .u-btn:not(.u-primary):not(.u-danger):not(.u-heal):not([class*="u-cs3-"]):not(#hearthTour *),
html:root[data-palette][data-palette][data-palette] body :is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.dialog-option, .roll-line-btn, .stat-edit-adj, .stat-edit-roll-btn, .stat-edit-skill-row, .gear-edit-btn, .gear-card-btn, .gear-add-btn, .shield-toggle, .weapon-magic-btn, .link-acct-link, .xp-action, .dialog-close, .char-popup-close, .browse-action-btn, .dialog-btn, .item-delete, .item-qty-btn, .layered-add-btn, .secondary-btn, .hp-quick-btn, .hp-apply-btn, .hf142-lvl-btn),
html:root[data-palette][data-palette][data-palette] body :is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop) .btn:not(.primary):not(.danger),
html:root[data-palette][data-palette][data-palette] body .u-layer .u-btn:not(.u-primary):not(.u-danger):not(.u-heal):not([class*="u-cs3-"]):not(#hearthTour *) {
  border-radius: 12px !important; border: 1px solid var(--oak-brass-deep) !important; background: var(--oak-btn) !important; color: #fff3da !important;
  box-shadow: inset 0 1px 0 #ffffff1a, 0 1px 0 #000 !important; min-height: 44px !important; text-shadow: none !important; background-clip: padding-box !important;
}
:is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.dialog-option, .roll-line-btn, .stat-edit-adj, .stat-edit-roll-btn, .gear-edit-btn, .gear-card-btn, .gear-add-btn, .browse-action-btn, .dialog-btn, .layered-add-btn, .secondary-btn, .hp-apply-btn, .hf142-lvl-btn),
html:root[data-palette][data-palette][data-palette] body :is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.dialog-option, .roll-line-btn, .stat-edit-adj, .stat-edit-roll-btn, .gear-edit-btn, .gear-card-btn, .gear-add-btn, .browse-action-btn, .dialog-btn, .layered-add-btn, .secondary-btn, .hp-apply-btn, .hf142-lvl-btn) { font-size: 13px !important; }
:is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.weapon-magic-btn, .stat-edit-adj, .char-popup-close, .item-delete, .item-qty-btn, .hp-quick-btn),
html:root[data-palette][data-palette][data-palette] body :is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.weapon-magic-btn, .stat-edit-adj, .char-popup-close, .item-delete, .item-qty-btn, .hp-quick-btn) { min-width: 44px !important; padding: 0 !important; display: inline-grid !important; place-items: center !important; font-size: 18px !important; }
:is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.roll-line-btn.primary, .roll-line-btn:first-of-type, .browse-action-btn.learn, .xp-action.levelup, .dialog-btn.primary, .dialog-option.selected, .hp-quick-btn.active),
html:root[data-palette][data-palette][data-palette] body :is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.roll-line-btn.primary, .roll-line-btn:first-of-type, .browse-action-btn.learn, .xp-action.levelup, .dialog-btn.primary, .dialog-option.selected, .hp-quick-btn.active) {
  background: linear-gradient(#f0cf86, #c9953f) !important; border-color: #f6dc9c !important; color: #2a1708 !important; font-weight: 700 !important;
}
:is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.dialog-option, .roll-line-btn, .stat-edit-roll-btn, .stat-edit-skill-row, .gear-card-btn, .gear-add-btn, .browse-action-btn, .hp-apply-btn, .hf142-lvl-btn):is(:hover, :focus-visible),
html:root[data-palette][data-palette][data-palette] body :is(.dialog-backdrop, .skills-dialog-backdrop, .gear-popup-backdrop, .u-layer) :is(.dialog-option, .roll-line-btn, .stat-edit-roll-btn, .stat-edit-skill-row, .gear-card-btn, .gear-add-btn, .browse-action-btn, .hp-apply-btn, .hf142-lvl-btn):is(:hover, :focus-visible) { border-color: #e9bd62 !important; outline: none !important; box-shadow: 0 0 0 1px #e9bd62, 0 0 10px #e9bd6233 !important; }
.dialog-backdrop .dialog-option,
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop .dialog-option { padding: 10px 14px !important; margin: 0 0 8px !important; }
.dialog-backdrop .dialog-option *,
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop .dialog-option * { color: inherit; }
.dialog-backdrop .dialog-option:not(.selected) :is(small, .muted, .dialog-option-meta, span:last-child),
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop .dialog-option:not(.selected) :is(small, .muted, .dialog-option-meta, span:last-child) { color: #e6d3ae !important; }
.dialog-backdrop :is(select, input:not([type=checkbox]):not([type=radio]), textarea),
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop :is(select, input:not([type=checkbox]):not([type=radio]), textarea) { border-radius: 12px !important; border: 1px solid var(--oak-brass-deep) !important; background: #0000004d !important; color: #fff3da !important; min-height: 44px; font-size: 14px !important; }
/* scroll lists clip inside the rounded frame, so nothing slides over the top edge */
:is(.dialog, .skills-dialog, .gear-popup, .u-sheet),
html:root[data-palette][data-palette][data-palette] body :is(.dialog, .skills-dialog, .gear-popup, .u-sheet) { overflow: hidden auto !important; overscroll-behavior: contain; background-clip: padding-box !important; }
:is(.browse-body, .gear-popup-body, .link-char-list, .dialog-scroll, .u-sheet-body),
html:root[data-palette][data-palette][data-palette] body :is(.browse-body, .gear-popup-body, .link-char-list, .dialog-scroll, .u-sheet-body) { border-radius: 14px !important; overflow: hidden auto !important; overscroll-behavior: contain; padding: 12px 6px !important; clip-path: inset(0 round 14px);
  -webkit-mask-image: linear-gradient(transparent, #000 12px, #000 calc(100% - 12px), transparent); mask-image: linear-gradient(transparent, #000 12px, #000 calc(100% - 12px), transparent); }
:is(.browse-body, .link-char-list, .gear-popup-body) > *,
html:root[data-palette][data-palette][data-palette] body :is(.browse-body, .link-char-list, .gear-popup-body) > * { border-radius: 12px !important; }
/* browse lists: section headers scroll with the list, on a solid bar (Jenny 48b) */
.browse-body .browse-section-head,
html:root[data-palette][data-palette][data-palette] body .browse-body .browse-section-head { position: static !important; margin: 0 0 6px !important; padding: 8px 12px !important; border-radius: 10px !important; background: linear-gradient(#1c1c20, #131315) !important; border: 1px solid rgba(201,153,63,.28) !important; color: var(--oak-brass-hi) !important; font-size: 13px !important; box-shadow: 0 6px 8px -4px #000c; }
.browse-body .browse-row,
html:root[data-palette][data-palette][data-palette] body .browse-body .browse-row { border-radius: 12px !important; overflow: hidden; }
/* skill edit: the whole row is the tap target (48c); each dot keeps a 44 px hit area */
.skills-dialog .skills-edit-row,
html:root[data-palette][data-palette][data-palette] body .skills-dialog .skills-edit-row { min-height: 44px; cursor: pointer; border-radius: 10px; }
.skills-dialog .skills-edit-row:hover,
html:root[data-palette][data-palette][data-palette] body .skills-dialog .skills-edit-row:hover { background: #ffffff0d; }
.skills-dialog .skills-edit-name,
html:root[data-palette][data-palette][data-palette] body .skills-dialog .skills-edit-name { min-height: 44px; }
.skills-dialog .skills-edit-dot,
html:root[data-palette][data-palette][data-palette] body .skills-dialog .skills-edit-dot { position: relative !important; width: 22px !important; height: 22px !important; border-radius: 50% !important; border: 1.5px solid #e9bd62 !important; background: #0006 !important; }
.skills-dialog .skills-edit-dot.active,
html:root[data-palette][data-palette][data-palette] body .skills-dialog .skills-edit-dot.active { background: radial-gradient(circle, #f0cf86 0 45%, #0006 50%) !important; }
.skills-dialog .skills-edit-dot::after,
html:root[data-palette][data-palette][data-palette] body .skills-dialog .skills-edit-dot::after { content: ""; position: absolute; inset: -11px; }

/* ----- the level-up flow in oak (48e): dark cards on the dialog, leather choices, brass for what you pick ----- */
.levelup-backdrop .dialog,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .dialog { color: var(--oak-ink) !important; }
.levelup-backdrop .dialog-title,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .dialog-title { color: var(--oak-brass-hi) !important; font-family: var(--serif) !important; text-shadow: 0 2px 0 #000; }
.levelup-backdrop :is(.dialog-helper, .small-note),
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop :is(.dialog-helper, .small-note) { color: var(--oak-soft) !important; font-size: 13px !important; font-style: normal !important; }
.levelup-backdrop :is(.hp-control-label, .gear-section-label),
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop :is(.hp-control-label, .gear-section-label) { color: var(--oak-brass-hi) !important; letter-spacing: .08em; font-size: 13px !important; }
.levelup-backdrop :is(.levelup-stats, .levelup-callout, .levelup-list, .feature, .gear-section),
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop :is(.levelup-stats, .levelup-callout, .levelup-list, .feature, .gear-section) { background: var(--oak-card) !important; border: 1px solid var(--oak-brass-deep) !important; border-radius: 12px !important; box-shadow: inset 0 1px 0 #ffffff0d, 0 4px 10px #000b !important; color: var(--oak-ink) !important; }
.levelup-backdrop .levelup-stat,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .levelup-stat { background: none !important; border: 0 !important; }
.levelup-backdrop .levelup-stat-label,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .levelup-stat-label { color: var(--oak-soft) !important; }
.levelup-backdrop .levelup-stat-val,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .levelup-stat-val { color: #fff3da !important; font-family: var(--serif) !important; }
.levelup-backdrop .levelup-stat-delta,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .levelup-stat-delta { color: var(--oak-brass-hi) !important; }
.levelup-backdrop .levelup-list-item + .levelup-list-item,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .levelup-list-item + .levelup-list-item { border-color: #ffffff14 !important; }
/* Level Up footer on a phone: the HP hint takes its own line above the buttons, so "Save & close" stays on one line
   instead of wrapping to three beside it (QA 1 Nov) */
.levelup-backdrop .dialog-actions,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .dialog-actions { flex-wrap: wrap !important; }
.levelup-backdrop .dialog-actions .lu-hp-hint,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .dialog-actions .lu-hp-hint { flex: 1 0 100% !important; order: -1; margin: 0 0 2px !important; }
.levelup-backdrop #cancelLevelUp,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop #cancelLevelUp { white-space: nowrap !important; flex: none !important; }
.levelup-backdrop .feature-name,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .feature-name { color: #f7ecd6 !important; font-family: var(--serif) !important; }
.levelup-backdrop .feature-lvl,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .feature-lvl { color: var(--oak-brass-hi) !important; }
.levelup-backdrop .feature-desc,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .feature-desc { background: none !important; box-shadow: none !important; color: #eadcc0 !important; font-size: 13px !important; }
.levelup-backdrop .feature-desc :is(p, li, span, div, em),
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .feature-desc :is(p, li, span, div, em) { color: inherit !important; }
.levelup-backdrop .feature-desc strong,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .feature-desc strong { color: var(--oak-brass-hi) !important; }
.levelup-backdrop .btn.primary.muted,
html:root[data-palette][data-palette][data-palette] body .levelup-backdrop .btn.primary.muted { opacity: .55; }

/* the beast's old stat-block dialog, if it opens (Stat block): dark green oak, no parchment */
.dialog-backdrop:has(#endWildShapeBtn) .dialog,
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop:has(#endWildShapeBtn) .dialog { background: linear-gradient(180deg, #1d3220f2, #0d160ef7), var(--hearth-oak) center/500px !important; border: 1.5px solid #7fbf7a !important; border-radius: 18px !important; color: #e9f2e4 !important; box-shadow: 0 0 0 1px #000, 0 12px 40px #000c !important; }
.dialog-backdrop:has(#endWildShapeBtn) .dialog-title,
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop:has(#endWildShapeBtn) .dialog-title { color: #f0cf86 !important; }
.dialog-backdrop:has(#endWildShapeBtn) :is(.dialog-helper, .small-note, .hp-control-label),
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop:has(#endWildShapeBtn) :is(.dialog-helper, .small-note, .hp-control-label) { color: #cfe3c9 !important; font-style: normal !important; font-size: 13px !important; }
.dialog-backdrop:has(#endWildShapeBtn) :is(.feature, .levelup-stat),
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop:has(#endWildShapeBtn) :is(.feature, .levelup-stat) { background: #0b130cd9 !important; border: 1.5px solid #6fae6a !important; border-radius: 12px !important; color: #e9f2e4 !important; }
.dialog-backdrop:has(#endWildShapeBtn) .feature-desc,
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop:has(#endWildShapeBtn) .feature-desc { background: none !important; box-shadow: none !important; color: #dfe9da !important; font-size: 13px !important; }
.dialog-backdrop:has(#endWildShapeBtn) :is(#endWildShapeBtn, #dialogClose),
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop:has(#endWildShapeBtn) :is(#endWildShapeBtn, #dialogClose) { min-height: 44px; border-radius: 12px !important; color: #e9f7e4 !important; background: linear-gradient(#21402a, #132a19) !important; border: 1.5px solid #8fd08a !important; }

/* the sheet's spell page dropdowns and search match the oak (48d) */
.u-cs3 .u-cs3-combat :is(select, input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color])),
html:root[data-palette][data-palette][data-palette] body .u-cs3 .u-cs3-combat :is(select, input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color])) { min-height: 44px !important; border-radius: 12px !important; border: 1px solid var(--oak-brass-deep) !important; background: #0000004d !important; color: #fff3da !important; font-size: 14px !important; }
/* the sheet's small pop-ups (features, passives, rest) are centred cards on a phone too, like Jenny's */
.u-layer .u-sheet.u-cs3-pop { top: 50% !important; bottom: auto !important; left: 50% !important; right: auto !important; transform: translate(-50%, -50%) !important; width: min(360px, calc(100% - 32px)) !important; max-height: 88vh; border-radius: 20px !important; }
.u-layer .u-cs3-pop > .u-grab { display: none !important; }
/* browse lists (spells, Wild Shape forms): rows hold their buttons inside their own rounded edge (Jenny 49a) */
.browse-body * { box-sizing: border-box; }
.browse-body .browse-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin: 0 0 8px; min-width: 0; }
.browse-body .browse-info { flex: 1 1 auto; min-width: 0; }
.browse-body .browse-action-btn { flex: 0 0 auto; margin: 0; max-width: 42%; }
/* gear weapon cards on a phone: the controls wrap under the name instead of spilling out of the card (Jenny 49b) */
.gear-card { flex-wrap: wrap; gap: 10px; }
.gear-card .gear-card-main { flex: 1 1 220px; min-width: 0; }
.gear-card .weapon-controls { flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.gear-card .weapon-magic-row { flex-wrap: wrap; }
/* Wild Shape form picker: Jenny's beast art beside the forms that have it (FIX-LIST 45) */
.browse-body .browse-row .browse-beast-art { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; object-fit: cover; border: 2px solid #7fbf7a; box-shadow: 0 0 0 1px #000, 0 2px 6px #0009; background: radial-gradient(#2b4a2e, #0c140d); }
/* Death saves in the sheet's top block (audit-5e, 44 px rule): in a column under 440 px the 1-20 grid takes the board's
   full width, with the passed and failed tallies on a row above it, so every number stays a 44 px target (it was 42 px at
   390 and 23 px at 773). The 0 HP pop-up has the room already and keeps its own layout. */
@container (max-width: 440px) {
  .death-saves-strip .death-save-board { grid-template-columns: 1fr 1fr; gap: 8px; }
  .death-saves-strip .death-save-center { grid-column: 1 / -1; }
  .death-saves-strip .death-save-side { min-height: 0; flex-direction: row; justify-content: space-between; align-items: center; padding: 10px 12px; }
  .death-saves-strip .death-save-side-title { writing-mode: horizontal-tb; transform: none; }
  .death-saves-strip .death-save-pips-vertical { flex-direction: row; }
  .death-saves-strip .death-save-number-grid { grid-template-columns: repeat(5, minmax(44px, 1fr)); }
  .death-saves-strip .death-save-num-btn, .death-saves-strip .death-save-roll-btn { min-height: 44px; }
}
/* The strip's title used the old parchment ink, dark on the oak sheet's dark red: light ember, green when stable, grey when dead */
.u2 .death-saves-strip .death-saves-title,
html:root[data-palette][data-palette][data-palette] body.u2 .death-saves-strip .death-saves-title { color: #f2a48c; }
.u2 .death-saves-strip.stable .death-saves-title,
html:root[data-palette][data-palette][data-palette] body.u2 .death-saves-strip.stable .death-saves-title { color: #a9d08a; }
.u2 .death-saves-strip.dead .death-saves-title,
html:root[data-palette][data-palette][data-palette] body.u2 .death-saves-strip.dead .death-saves-title { color: #cfc6b8; }
/* Jenny QA 28 Oct: phone app-bar titles must not truncate ("New char…" in the builder) */
@media (max-width: 430px) { .u-abar .u-ttl, .u2 .u-abar .u-ttl, body .u2 .u-abar .u-ttl { font-size: 17px; white-space: normal; text-overflow: clip; overflow-wrap: normal; word-break: normal; } }

/* ===== More-tile pop-ups in the card's dark colours (Jenny's sheet-colours spec, Tom 29 Oct 2026) =====
   Features, Companions, Rest, Effects, Conditions, Notes, Hit dice, Dice & rolls (and the other More tiles).
   Colours only: no leather texture; layout and words are unchanged. Sheets opened from a More tile carry
   u-hx-sh (the sheet's own pop-ups) or hx-sh (the older dialogs, on the backdrop).
   Unbrown (1 Nov, Tom): the warm brown-blacks are now the neutral charcoal of app/ui/dark.css (#19191c -> #121214
   sheet, #111113 rows, #26262a -> #17171a buttons, #34343a divider, rgba(5,5,7,.74) scrim, #b9ad97 muted); gold and
   cream unchanged. */
:root {
  --sh-scrim: rgba(5,5,7,.74);
  --sh-bg: linear-gradient(180deg,#19191c,#121214); --sh-bg-solid: #121214;
  --sh-edge: rgba(201,153,63,.3); --sh-hair: rgba(201,153,63,.34); --sh-grab: rgba(201,153,63,.7);
  --sh-title: #f4e6cc; --sh-title-accent: #e9bd62; --sh-icon: #e9bd62;
  --sh-text: #e2cba3; --sh-muted: #b9ad97;
  --sh-row: #111113; --sh-row-line: #26262a;
  --sh-btn: linear-gradient(#26262a,#17171a); --sh-btn-line: rgba(201,153,63,.38); --sh-btn-ink: #e2cba3;
  --sh-pri: linear-gradient(#e9c06a,#b4863a); --sh-pri-ink: #2a1d0e; --sh-pri-line: #c9993f;
  --sh-div: #34343a;
}
html:root[data-palette][data-palette][data-palette] body .u-layer:has(> .u-hx-sh) > .u-scrim,
html:root[data-palette][data-palette][data-palette] body .dialog-backdrop.hx-sh,
html:root[data-palette][data-palette][data-palette] body .cv-layer > .cv-scrim,
.u-layer:has(> .u-hx-sh) > .u-scrim, .dialog-backdrop.hx-sh, .cv-layer > .cv-scrim { background: var(--sh-scrim) !important; }
html:root[data-palette][data-palette][data-palette] body :is(.u-layer > .u-sheet.u-hx-sh, .u-layer > .u-dialog.u-hx-sh, .dialog-backdrop.hx-sh .dialog, .dialog-backdrop.hx-sh .modal, .cv-layer .cv-sheet),
:is(.u-layer > .u-sheet.u-hx-sh, .u-layer > .u-dialog.u-hx-sh, .dialog-backdrop.hx-sh .dialog, .dialog-backdrop.hx-sh .modal, .cv-layer .cv-sheet) {
  background-color: var(--sh-bg-solid) !important; background-image: var(--sh-bg) !important;
  border-color: var(--sh-edge) !important; border-top: 1px solid var(--sh-edge) !important;
  box-shadow: inset 0 1px 0 var(--sh-hair), 0 -8px 30px #000a !important; color: var(--sh-text) !important;
}
html:root[data-palette][data-palette][data-palette] body :is(.u-hx-sh, .hx-sh, .cv-layer) :is(.u-grab, .u-sheet-grab, .sheet-grab, .dialog-grab) { background: var(--sh-grab) !important; }
html:root[data-palette][data-palette][data-palette] body :is(.u-hx-sh, .hx-sh, .cv-layer) :is(h1, h2, h3, .dialog-title, .u-sheet-title, .u-cs3-poph, .u-cs3-gnm) { color: var(--sh-title) !important; }
html:root[data-palette][data-palette][data-palette] body .u-hx-sh.u-cs3-pop .u-cs3-poph { color: var(--sh-title-accent) !important; }
html:root[data-palette][data-palette][data-palette] body :is(.u-hx-sh, .hx-sh, .cv-layer) svg.i { color: var(--sh-icon); }
html:root[data-palette][data-palette][data-palette] body :is(.u-hx-sh, .hx-sh, .cv-layer) :is(.dialog-helper, .small-note, .t-meta, .muted, .u-cs3-popd, small) { color: var(--sh-muted) !important; }
html:root[data-palette][data-palette][data-palette] body :is(.u-hx-sh, .hx-sh, .cv-layer) :is(textarea, input:not([type=checkbox]):not([type=radio]), select, .browse-row, .feature, .u-row, .u-cs3-restb, .roll-log-row, .rolllog-row, .u-card, .rest-status) {
  background: var(--sh-row) !important; border-color: var(--sh-row-line) !important; color: var(--sh-text) !important; }
html:root[data-palette][data-palette][data-palette] body :is(.u-hx-sh, .hx-sh, .cv-layer) :is(hr, .u-div, .dialog-divider) { border-color: var(--sh-div) !important; background: var(--sh-div) !important; }
html:root[data-palette][data-palette][data-palette] body .u-layer > .u-hx-sh .u-btn:not(.u-primary):not(.u-danger):not(.u-heal):not(#hearthTour *),
html:root[data-palette][data-palette][data-palette] body .hx-sh :is(.btn:not(.primary):not(.danger), .dialog-btn:not(.primary), .roll-line-btn:not(.primary), .dialog-option:not(.selected), .secondary) {
  background: var(--sh-btn) !important; border: 1px solid var(--sh-btn-line) !important; color: var(--sh-btn-ink) !important; }
html:root[data-palette][data-palette][data-palette] body .u-layer > .u-hx-sh .u-btn.u-primary:not(#hearthTour *),
html:root[data-palette][data-palette][data-palette] body .hx-sh :is(.btn.primary, .dialog-btn.primary, .roll-line-btn.primary, .dialog-option.selected) {
  background: var(--sh-pri) !important; border: 1px solid var(--sh-pri-line) !important; color: var(--sh-pri-ink) !important; }
html:root[data-palette][data-palette][data-palette] body :is(.u-hx-sh, .hx-sh, .cv-layer) :is(.u-chip, .chip, .pill):not(.bl):not(.u-bl) { background: #1b1b1e !important; border-color: rgba(201,153,63,.34) !important; color: #e2cba3 !important; }
html:root[data-palette][data-palette][data-palette] body :is(.u-hx-sh, .hx-sh, .cv-layer) :is(.u-chip, .chip, .pill):is(.bl, .u-bl) { background: #16243a !important; border-color: #3a5a8a !important; color: #d8e4f4 !important; }

/* Tom 29 Oct 2026: EVERY sheet and dialog gets the dark card colours (ui.js auto-tags them). Desk pop-ups are
   u-dialog, not u-sheet, so Lay on Hands etc. kept the leather texture until this. */
html:root[data-palette][data-palette][data-palette] body .cv-layer .cv-sheet :is(.cv-rowbtn:not(.gold), .cv-spendrow, .cv-loh) { background: var(--sh-row) !important; border-color: var(--sh-row-line) !important; color: var(--sh-text) !important; }
html:root[data-palette][data-palette][data-palette] body .cv-layer .cv-sheet :is(.cv-rowbtn.gold, .cv-done, .cv-hit.gold) { background: var(--sh-pri) !important; border-color: var(--sh-pri-line) !important; color: var(--sh-pri-ink) !important; }
html:root[data-palette][data-palette][data-palette] body .cv-layer .cv-grab { background: var(--sh-grab) !important; }
:is(.u-hx-sh,.hx-sh,.cv-layer) .roll-line-btn{background:linear-gradient(#f0cf86,#c9993f)!important;color:#2a1d0e!important;border-color:#c9993f!important}
html:root[data-palette][data-palette][data-palette] body :is(.dialog-backdrop,.u-layer,.u-hx-sh,.hx-sh,.cv-layer) :is(.roll-line-btn:not(:disabled),#rollDialogDone){background:linear-gradient(#f0cf86,#c9993f)!important;color:#2a1d0e!important;border-color:#c9993f!important;-webkit-text-fill-color:#2a1d0e}

/* The on-screen keyboard is open (ui.js kbFit, sync fixes 31 Oct): sheets, dialogs and the GM's drawers sit above it. */
html.u-kb-open body.u2.u-phone .u-layer > .u-sheet { bottom: var(--u-kb, 0px); max-height: calc(100vh - 24px - var(--hearth-safe-top, 0px) - var(--u-kb, 0px)); padding-bottom: var(--s4); }
html.u-kb-open body.u2.u-desk .u-layer > .u-dialog { top: calc((100% - var(--u-kb, 0px)) / 2); max-height: calc(100vh - 32px - var(--u-kb, 0px)); }
html.u-kb-open .dialog-backdrop { padding-bottom: var(--u-kb, 0px) !important; }
html.u-kb-open .dialog-backdrop .dialog { max-height: calc(100vh - 24px - var(--u-kb, 0px)); }
html.u-kb-open .gm2 .gm2-side.open { bottom: var(--u-kb, 0px); }
@media (max-width: 999px) and (orientation: portrait), (max-width: 759px), (max-width: 999px) and (max-height: 479px) {
  html.u-kb-open .gm2 .gm2-side.open { max-height: calc(78vh - var(--u-kb, 0px)); }
  html.u-kb-open .gm2 .gm2-side.open.tall { max-height: none; }
}
/* (6 Nov) Home has no sidebar (u-notabs), so its pop-ups and toasts centre on the whole window, not on the main column */
.u2.u-desk.u-notabs .u-layer > .u-dialog { left: 50%; }
.u2.u-desk.u-notabs .hearth-toast { left: 50% !important; }
.u2.u-desk.u-notabs .dialog-backdrop { padding-left: 24px !important; }