/* ============================================================
   sheet.css — the playable D&D 5e character sheet layout.
   Companion to sheet.js. Inherits crescent.css variables.
   ============================================================ */
.play-body{ padding-bottom: 190px; } /* room for the fixed roll tray */

/* ---- top bar ------------------------------------------------ */
.play-bar{
  position:sticky; top:0; z-index:40;
  display:flex; align-items:center; gap:1.2rem;
  padding:0.65rem clamp(1rem,4vw,2.4rem);
  background:linear-gradient(180deg, rgba(247,240,223,0.97), rgba(241,232,211,0.9));
  border-bottom:1px solid var(--gold-hair); backdrop-filter:blur(3px);
  font-family:var(--caps); font-size:0.7rem; letter-spacing:0.14em; text-transform:uppercase;
}
.play-bar .brand{ color:var(--rust); font-weight:700; letter-spacing:0.2em; }
.play-bar a{ color:var(--ink-soft); text-decoration:none; }
.play-bar a:hover{ color:var(--rust); }
.play-bar .spacer{ flex:1; }

#sheet{ max-width:1120px; margin:0 auto; padding:0 clamp(1rem,4vw,2.4rem); }

/* ---- header ------------------------------------------------- */
.sheet-head{ display:flex; gap:1.6rem; align-items:flex-end; padding:2rem 0 1.4rem; flex-wrap:wrap; }
.sh-portrait{ width:120px; height:120px; flex:0 0 auto; border:1px solid var(--gold); padding:6px; background:var(--tan); box-shadow:var(--shadow); position:relative; }
.sh-portrait img{ width:100%; height:100%; object-fit:cover; filter:sepia(0.14) saturate(0.92) contrast(1.03); }
.sh-id{ flex:1; min-width:220px; }
.sh-eyebrow{ font-family:var(--caps); text-transform:uppercase; letter-spacing:0.16em; font-size:0.68rem; color:var(--teal-deep); }
.sh-id h1{ font-family:var(--disp); font-weight:700; color:var(--slate); font-size:clamp(2.2rem,6vw,3.4rem); margin:0.15rem 0 0.1rem; line-height:1; }
.sh-player{ font-family:var(--fell); font-style:italic; color:var(--ink-soft); }
.sheet-head .tagrow{ margin:0.6rem 0 0; display:flex; flex-wrap:wrap; align-items:center; gap:0.4rem; }
/* ruleset edition toggle */
.ed-toggle{ display:inline-flex; align-items:center; gap:0.25rem; margin-left:auto; }
.ed-toggle .ed-lbl{ font-family:var(--caps); text-transform:uppercase; letter-spacing:0.12em; font-size:0.55rem; color:var(--ink-faint); }
.ed-btn{ font-family:var(--caps); text-transform:uppercase; letter-spacing:0.06em; font-size:0.6rem; cursor:pointer;
  border:1px solid var(--edge); background:transparent; color:var(--ink-faint); border-radius:4px; padding:0.2rem 0.5rem; transition:.15s; }
.ed-btn:hover{ border-color:var(--teal); color:var(--teal-deep); }
.ed-btn.active{ border-color:var(--rust); background:rgba(155,58,42,0.1); color:var(--rust-deep); font-weight:700; }

/* ---- vitals row --------------------------------------------- */
.vitals{ display:flex; flex-wrap:wrap; gap:0.8rem; margin:0 0 1.6rem; }
.vstat{
  flex:1 1 auto; min-width:104px; text-align:center;
  background:linear-gradient(180deg, rgba(251,246,234,0.9), rgba(227,213,180,0.5));
  border:1px solid var(--edge); border-radius:3px; padding:0.6rem 0.7rem; position:relative;
}
.vstat.wide{ flex-basis:100%; }
.vstat b{ display:block; font-family:var(--caps); text-transform:uppercase; letter-spacing:0.12em; font-size:0.56rem; color:var(--teal-deep); margin-bottom:0.25rem; }
.vstat .v{ font-family:var(--disp); font-weight:700; font-size:1.7rem; color:var(--slate); }
.vstat.rollable{ cursor:pointer; transition:.15s; }
.vstat.rollable:hover{ border-color:var(--rust); background:rgba(168,67,42,0.07); }

.hp-block .hp-controls{ display:flex; align-items:center; justify-content:center; gap:0.35rem; }
.hp-block .hp-cur{ font-family:var(--disp); font-weight:700; font-size:1.8rem; color:var(--rust-deep); }
.hp-block .hp-max{ font-family:var(--disp); font-size:1.2rem; color:var(--ink-soft); }
.hp-block .hp-sep{ color:var(--ink-faint); }
.hp-block.bloodied .hp-cur{ color:var(--rust); }
.hp-block.down .hp-cur{ color:#8a1f14; text-shadow:0 0 8px rgba(168,67,42,0.5); }
.hp-block button, .hd-roll, .tmp-up, .tmp-dn{
  font-family:var(--caps); font-weight:700; cursor:pointer;
  border:1px solid var(--gold); background:var(--vellum); color:var(--ink-2);
  border-radius:4px; width:1.5rem; height:1.5rem; line-height:1; padding:0; transition:.15s;
}
.hp-block button:hover{ border-color:var(--rust); color:var(--rust); }
.hp-heal:hover{ border-color:var(--teal); color:var(--teal-deep); }
.hp-temp{ font-family:var(--caps); font-size:0.56rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); margin-top:0.35rem; }
.hp-temp button{ width:1.15rem; height:1.15rem; font-size:0.7rem; }
.hp-temp .tmp-val{ color:var(--teal-deep); font-weight:700; }

.hd-block .hd-rows{ display:flex; flex-direction:column; gap:0.2rem; align-items:center; }
.hd-row{ font-family:var(--caps); font-size:0.72rem; color:var(--ink-2); }
.hd-roll{ width:auto; padding:0 0.4rem; height:1.4rem; }
.hd-roll:hover{ border-color:var(--teal); color:var(--teal-deep); }
.hd-avail{ font-weight:700; color:var(--slate); margin-left:0.2rem; }
.hd-slash{ color:var(--ink-faint); }

.rest-block{ display:flex; flex-direction:column; gap:0.35rem; justify-content:center; }
.btn-short, .btn-rest, .btn-reset, .btn-io{
  font-family:var(--caps); text-transform:uppercase; letter-spacing:0.1em; font-size:0.6rem;
  cursor:pointer; border-radius:4px; padding:0.4rem 0.5rem; transition:.15s;
}
.btn-io{ border:1px solid var(--edge); background:transparent; color:var(--ink-faint); }
.btn-io:hover{ border-color:var(--teal); color:var(--teal-deep); }
.btn-short{ border:1px solid var(--gold); background:rgba(196,154,69,0.12); color:var(--rust-deep); }
.btn-short:hover{ background:var(--gold); color:var(--vellum-lit); }
.btn-rest{ border:1px solid var(--teal); background:rgba(31,122,134,0.1); color:var(--teal-deep); }
.btn-rest:hover{ background:var(--teal); color:var(--vellum-lit); }
.btn-reset{ border:1px solid var(--edge); background:transparent; color:var(--ink-faint); }
.btn-reset:hover{ border-color:var(--rust); color:var(--rust); }

/* ---- two-column body ---------------------------------------- */
.sheet-body{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); gap:1.4rem; align-items:start; }
@media (max-width:820px){ .sheet-body{ grid-template-columns:1fr; } }
.sheet-col{ display:flex; flex-direction:column; gap:1.4rem; }

.sheet-card{
  background:linear-gradient(180deg, rgba(251,246,234,0.9), rgba(235,224,198,0.7));
  border:1px solid var(--edge); border-radius:3px; padding:1.1rem 1.2rem 1.2rem;
  box-shadow:var(--shadow); position:relative;
}
.sheet-card > h2{
  font-family:var(--disp); font-weight:700; color:var(--rust-deep); font-size:1.35rem;
  margin:0 0 0.7rem; padding-bottom:0.35rem; border-bottom:1px solid var(--gold-hair);
}

/* ---- abilities --------------------------------------------- */
.abil-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0.7rem; }
.abil{ text-align:center; border:1px solid var(--edge-soft); border-radius:4px; padding:0.5rem 0.3rem; background:var(--vellum); }
.abil-name{ font-family:var(--caps); letter-spacing:0.1em; font-size:0.58rem; color:var(--teal-deep); }
.abil-mod{
  display:block; width:100%; font-family:var(--disp); font-weight:700; font-size:1.9rem; color:var(--slate);
  background:none; border:0; cursor:pointer; line-height:1.1; border-radius:4px; transition:.15s;
}
.abil-mod:hover{ background:rgba(168,67,42,0.08); color:var(--rust-deep); }
.abil-score{ font-family:var(--caps); font-size:0.72rem; color:var(--ink-soft); }
.save-row{
  display:flex; align-items:center; justify-content:center; gap:0.3rem; width:100%; margin-top:0.35rem;
  font-family:var(--caps); font-size:0.56rem; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--ink-soft); background:none; border:0; cursor:pointer; border-radius:4px; padding:0.2rem; transition:.15s;
}
.save-row b{ color:var(--slate); }
.save-row:hover{ background:rgba(31,122,134,0.08); }
.save-row .dot{ width:7px; height:7px; border-radius:50%; border:1px solid var(--gold); }
.save-row.prof .dot{ background:var(--teal); border-color:var(--teal-deep); }

/* ---- skills ------------------------------------------------- */
.skill-list{ display:flex; flex-direction:column; }
.skill{
  display:flex; align-items:center; gap:0.5rem; width:100%; text-align:left;
  padding:0.32rem 0.3rem; background:none; border:0; border-bottom:1px solid var(--edge-soft);
  cursor:pointer; font-family:var(--serif); font-size:0.9rem; color:var(--ink-2); transition:.15s;
}
.skill:hover{ background:rgba(168,67,42,0.06); color:var(--rust-deep); }
.skill .dot{ width:8px; height:8px; border-radius:50%; border:1px solid var(--gold); flex:0 0 auto; }
.skill.prof .dot{ background:var(--teal); border-color:var(--teal-deep); }
.skill.expert .dot{ background:var(--rust); border-color:var(--rust-deep); box-shadow:0 0 0 2px rgba(168,67,42,0.2); }
.skill .sk-name{ flex:1; }
.skill .sk-ab{ font-family:var(--caps); font-size:0.52rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-faint); }
.skill .sk-mod{ font-family:var(--disp); font-weight:700; font-size:1.05rem; color:var(--slate); min-width:2.2ch; text-align:right; }
.passive{ font-family:var(--caps); font-size:0.66rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); margin-top:0.7rem; text-align:right; }
.passive b{ color:var(--slate); font-size:0.9rem; }

/* ---- attacks ------------------------------------------------ */
.attack{ display:grid; grid-template-columns:1fr auto; gap:0.2rem 0.7rem; align-items:baseline; padding:0.5rem 0; border-bottom:1px solid var(--edge-soft); }
.atk-name{ font-family:var(--disp); font-weight:700; font-size:1.12rem; color:var(--slate); background:none; border:0; text-align:left; cursor:pointer; padding:0; transition:.15s; }
.atk-name:hover{ color:var(--rust-deep); }
.atk-bonus{ font-family:var(--caps); font-size:0.62rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); grid-column:1; }
.atk-dmg{ grid-row:1 / span 2; grid-column:2; align-self:center; font-family:var(--caps); font-size:0.72rem; letter-spacing:0.04em;
  color:var(--rust-deep); background:rgba(168,67,42,0.08); border:1px solid var(--gold-soft); border-radius:4px; padding:0.25rem 0.55rem; cursor:pointer; transition:.15s; }
.atk-dmg:hover{ background:var(--rust); color:var(--vellum-lit); }
.atk-meta{ font-family:var(--caps); font-size:0.56rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-faint); grid-column:1; }
.atk-notes{ grid-column:1 / -1; font-size:0.84rem; color:var(--ink-soft); }

/* ---- spellcasting ------------------------------------------- */
.spell-head{ font-family:var(--serif); font-size:0.92rem; color:var(--ink-2); margin-bottom:0.7rem; }
.spell-head b{ color:var(--slate); }
.spell-head .ssep{ color:var(--gold); margin:0 0.5em; }
.spell-atk{ background:none; border:0; cursor:pointer; color:var(--slate); border-bottom:1px dashed var(--gold-soft); }
.spell-atk:hover{ color:var(--rust-deep); }
.slots{ display:flex; flex-direction:column; gap:0.3rem; margin:0.4rem 0 0.8rem; }
.slot-row{ display:flex; align-items:center; gap:0.6rem; }
.slot-lv{ font-family:var(--caps); font-size:0.58rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--teal-deep); min-width:3.4rem; }
.pips{ display:flex; gap:0.28rem; flex-wrap:wrap; }
.pip{ width:15px; height:15px; border-radius:50%; border:1px solid var(--teal-deep); background:var(--teal); cursor:pointer; padding:0; transition:.12s; }
.pip.spent{ background:transparent; border-color:var(--edge); }
.pip:hover{ transform:scale(1.15); }
.spell-atk-row{ border-top:1px dashed var(--edge-soft); margin-top:0.4rem; padding-top:0.5rem; }
/* ---- spell tabs / list / cast ---- */
.spell-tabs{ display:flex; flex-wrap:wrap; gap:0.3rem; margin:0.5rem 0; border-bottom:1px solid var(--edge-soft); padding-bottom:0.45rem; }
.spell-tab{ font-family:var(--caps); font-size:0.58rem; letter-spacing:0.09em; text-transform:uppercase; color:var(--ink-faint); border:1px solid var(--edge); background:transparent; border-radius:4px; padding:0.22rem 0.55rem; cursor:pointer; transition:.12s; }
.spell-tab:hover{ color:var(--rust-deep); border-color:var(--rust); }
.spell-tab.active{ color:var(--rust-deep); border-color:var(--rust-deep); background:rgba(155,58,42,0.08); font-weight:700; }
.spell-list{ display:none; flex-direction:column; }
.spell-list.active{ display:flex; }
.spell{ display:block; padding:0.22rem 0; border-bottom:1px solid var(--edge-soft); }
.sp-row{ display:flex; align-items:center; gap:0.5rem; }
.spell .sp-name{ font-family:var(--fell); font-size:1.02rem; color:var(--ink); background:none; border:0; padding:0; cursor:pointer; text-align:left; flex:1 1 auto; }
.spell .sp-name:hover{ color:var(--teal-deep); text-decoration:underline dotted; }
.spell.unprepared .sp-name{ color:var(--ink-faint); font-style:italic; }
.spell .sp-notes{ font-size:0.78rem; color:var(--ink-soft); margin:0.1rem 0; }
.sp-badge{ font-family:var(--caps); font-size:0.5rem; font-weight:700; color:var(--gold); border:1px solid var(--gold); border-radius:3px; padding:0 0.28rem; }
.sp-save{ font-family:var(--caps); font-size:0.55rem; letter-spacing:0.05em; color:var(--slate); }
.sp-cast{ font-family:var(--caps); font-size:0.56rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--teal-deep); border:1px solid var(--teal); background:rgba(31,122,134,0.08); border-radius:4px; padding:0.18rem 0.5rem; cursor:pointer; opacity:0; transition:.12s; }
.spell:hover .sp-cast, .spell:focus-within .sp-cast{ opacity:1; }
.sp-cast:hover{ background:var(--teal); color:var(--vellum-lit); }
.sp-cast.atkspell{ border-color:var(--rust); color:var(--rust-deep); background:rgba(155,58,42,0.07); }
.sp-cast.atkspell:hover{ background:var(--rust); color:var(--vellum-lit); }
.spell:hover .sp-cast[disabled], .spell:focus-within .sp-cast[disabled]{ opacity:0.4; cursor:not-allowed; border-style:dashed; }
@media (hover:none){ .sp-cast{ opacity:1; } }
/* upcast slot-level stepper (auto-lowest + bump) */
.sp-lv{ display:inline-flex; align-items:center; gap:0.12rem; }
.sp-lv .lvnum{ font-family:var(--caps); font-size:0.56rem; letter-spacing:0.04em; color:var(--slate); min-width:1.35rem; text-align:center; }
.sp-lv.bumped .lvnum{ color:var(--gold); font-weight:700; }
.sp-lv .lvstep{ font-size:0.6rem; line-height:1; color:var(--teal-deep); border:1px solid var(--edge); background:transparent; border-radius:3px; padding:0.05rem 0.22rem; cursor:pointer; opacity:0; transition:.12s; }
.spell:hover .sp-lv .lvstep, .spell:focus-within .sp-lv .lvstep{ opacity:1; }
.sp-lv .lvstep:hover{ border-color:var(--teal); background:rgba(31,122,134,0.1); }
.sp-lv .lvstep[disabled]{ opacity:0.25; cursor:not-allowed; }
.spell:hover .sp-lv .lvstep[disabled], .spell:focus-within .sp-lv .lvstep[disabled]{ opacity:0.25; }
@media (hover:none){ .sp-lv .lvstep{ opacity:1; } }
.sp-lv + .sp-cast{ margin-left:0.4rem; }
.sp-body{ display:none; font-size:0.88rem; color:var(--ink-2); margin:0.3rem 0 0.1rem; padding:0.2rem 0 0.2rem 0.6rem; border-left:2px solid var(--edge); }
.sp-body.open{ display:block; }
.sp-nodesc{ color:var(--ink-faint); }
.sp-actions{ margin-top:0.4rem; }
.sp-dmg{ font-family:var(--caps); font-size:0.55rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--rust-deep); border:1px solid var(--rust); background:transparent; border-radius:4px; padding:0.15rem 0.5rem; cursor:pointer; }
.sp-dmg:hover{ background:var(--rust); color:var(--vellum-lit); }
.rebound{ margin-top:0.8rem; font-size:0.84rem; color:var(--ink-soft); border-top:1px solid var(--edge-soft); padding-top:0.6rem; }

/* ---- features / feats --------------------------------------- */
.feature{ padding:0.6rem 0; border-bottom:1px solid var(--edge-soft); }
.feat-h{ display:flex; align-items:center; gap:0.6rem; flex-wrap:wrap; }
.feat-name{ font-family:var(--disp); font-weight:700; font-size:1.1rem; color:var(--olive-deep); background:none; border:0; padding:0; text-align:left; cursor:pointer; flex:1 1 auto; transition:.12s; }
.feat-name:hover{ color:var(--rust-deep); text-decoration:underline dotted; }
.feat-trigger{ font-family:var(--caps); font-size:0.56rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--olive-deep); border:1px solid var(--olive-deep); background:rgba(196,154,69,0.10); border-radius:4px; padding:0.18rem 0.5rem; cursor:pointer; opacity:0; transition:.12s; }
.feature:hover .feat-trigger, .feature:focus-within .feat-trigger{ opacity:1; }
.feat-trigger:hover{ background:var(--olive-deep); color:var(--vellum-lit); }
.feature:hover .feat-trigger[disabled], .feature:focus-within .feat-trigger[disabled]{ opacity:0.4; cursor:not-allowed; border-style:dashed; }
@media (hover:none){ .feat-trigger{ opacity:1; } }
.feat-body{ display:none; font-size:0.9rem; color:var(--ink-2); margin-top:0.3rem; padding:0.15rem 0 0.2rem 0.6rem; border-left:2px solid var(--edge); }
.feat-body.open{ display:block; }
.feat-src{ font-family:var(--caps); font-size:0.52rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-faint); border:1px solid var(--edge); border-radius:3px; padding:0.05rem 0.4rem; }
.use-pips{ display:flex; gap:0.25rem; margin-left:auto; }
.use-pips .pip{ background:var(--gold); border-color:var(--gold); }
.use-pips .pip.spent{ background:transparent; }
.feat-text{ font-size:0.9rem; color:var(--ink-2); margin-top:0.3rem; }
.feat-tabs{ display:flex; flex-wrap:wrap; gap:0.3rem; margin:0.2rem 0 0.5rem; border-bottom:1px solid var(--edge-soft); padding-bottom:0.45rem; }
.feat-tab{ font-family:var(--caps); font-size:0.58rem; letter-spacing:0.09em; text-transform:uppercase; color:var(--ink-faint); border:1px solid var(--edge); background:transparent; border-radius:4px; padding:0.22rem 0.55rem; cursor:pointer; transition:.12s; }
.feat-tab:hover{ color:var(--olive-deep); border-color:var(--olive-deep); }
.feat-tab.active{ color:var(--olive-deep); border-color:var(--olive-deep); background:rgba(196,154,69,0.10); font-weight:700; }
.feat-list{ display:none; }
.feat-list.active{ display:block; }

/* ---- turn tracker (action economy) ---- */
.econ-panel{ display:none; }
.econ-panel.open{ display:flex; align-items:center; gap:0.7rem; flex-wrap:wrap; border:1px dashed var(--teal); background:rgba(31,122,134,0.05); }
.econ-panel > b{ margin-bottom:0 !important; }
.econ-btns{ display:flex; gap:0.4rem; flex-wrap:wrap; }
.econ-b, .econ-roll{ font-family:var(--caps); font-size:0.6rem; letter-spacing:0.07em; text-transform:uppercase; border:1px solid var(--teal); background:rgba(31,122,134,0.08); color:var(--teal-deep); border-radius:5px; padding:0.32rem 0.7rem; cursor:pointer; transition:.12s; }
.econ-b:hover, .econ-roll:hover{ background:var(--teal); color:var(--vellum-lit); }
.econ-b.take{ border-color:var(--olive-deep); color:var(--olive-deep); background:rgba(196,154,69,0.12); }
.econ-b.take:hover{ background:var(--olive-deep); color:var(--vellum-lit); }
.econ-b.end{ border-color:var(--edge); color:var(--ink-faint); background:transparent; }
.econ-b.spent{ opacity:0.45; text-decoration:line-through; }
.econ-roll{ border-color:var(--rust); color:var(--rust-deep); background:transparent; }
.econ-roll:hover{ background:var(--rust); color:var(--vellum-lit); }
/* an ability whose action-economy cost has been spent this turn */
.econ-spent{ opacity:0.38; pointer-events:none; filter:grayscale(0.6); }

/* ---- Attacks & Actions tabs ---- */
.atk-card .atk-tabs{ display:flex; flex-wrap:wrap; gap:0.3rem; margin:0 0 0.6rem; border-bottom:1px solid var(--edge-soft); padding-bottom:0.45rem; }
.atk-tab{ font-family:var(--caps); font-size:0.58rem; letter-spacing:0.09em; text-transform:uppercase; color:var(--ink-faint); border:1px solid var(--edge); background:transparent; border-radius:4px; padding:0.22rem 0.55rem; cursor:pointer; transition:.12s; }
.atk-tab:hover{ color:var(--teal-deep); border-color:var(--teal); }
.atk-tab.active{ color:var(--teal-deep); border-color:var(--teal-deep); background:rgba(31,122,134,0.09); font-weight:700; }
.atk-list{ display:none; }
.atk-list.active{ display:block; }
/* action tabs: uniform name typography, colour-coded by type */
.atk-card .atk-name, .atk-card .sp-name, .atk-card .feat-name{ font-family:var(--fell); font-size:0.98rem; font-weight:600; font-style:normal; }
.atk-card .atk-name{ color:var(--oxblood); }
.atk-card .sp-name{ color:var(--teal-deep); }
.atk-card .feature[data-cat="Class"] .feat-name{ color:var(--slate); }
.atk-card .feature[data-cat="Racial"] .feat-name{ color:var(--olive-deep); }
.atk-card .feature[data-cat="General"] .feat-name{ color:var(--ink-2); }
.atk-card .feature[data-cat="Profession"] .feat-name{ color:var(--moon); }
.atk-card .atk-name:hover, .atk-card .sp-name:hover, .atk-card .feat-name:hover{ text-decoration:underline dotted; filter:brightness(0.85); }

/* ---- proficiencies / gear / notes --------------------------- */
.prof-row{ font-size:0.9rem; color:var(--ink-2); padding:0.25rem 0; }
.prof-row b{ font-family:var(--caps); font-size:0.6rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--teal-deep); margin-right:0.5rem; }
.currency{ display:flex; flex-wrap:wrap; gap:0.5rem; margin-bottom:0.7rem; }
.coin{ font-family:var(--caps); font-size:0.66rem; letter-spacing:0.06em; text-transform:uppercase; border:1px solid var(--gold-soft); border-radius:3px; padding:0.15rem 0.5rem; color:var(--ink-2); }
.coin.gp{ color:var(--gold); border-color:var(--gold); }
.gear{ padding:0.3rem 0; border-bottom:1px solid var(--edge-soft); }
.g-name{ font-size:0.94rem; color:var(--ink); }
.g-qty{ color:var(--ink-faint); font-size:0.8rem; }
.g-notes{ font-size:0.82rem; color:var(--ink-soft); }
.notes-text{ font-family:var(--fell); font-size:1.02rem; color:var(--ink-2); }

/* ---- roll tray (fixed) -------------------------------------- */
.roll-tray{
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  background:linear-gradient(0deg, rgba(241,232,211,0.98), rgba(247,240,223,0.92));
  border-top:1px solid var(--gold); box-shadow:0 -8px 30px rgba(60,44,20,0.18);
  backdrop-filter:blur(4px);
}
.tray-inner{ max-width:1120px; margin:0 auto; padding:0.7rem clamp(1rem,4vw,2.4rem);
  display:flex; align-items:center; gap:1rem 1.4rem; flex-wrap:wrap; min-height:96px; }
.adv-toggle{ display:flex; border:1px solid var(--gold); border-radius:6px; overflow:hidden; }
.adv-toggle button{
  font-family:var(--caps); font-size:0.6rem; letter-spacing:0.08em; text-transform:uppercase;
  padding:0.4rem 0.6rem; background:var(--vellum); color:var(--ink-soft); border:0; cursor:pointer; transition:.15s;
}
.adv-toggle button + button{ border-left:1px solid var(--gold-hair); }
.adv-toggle button.on{ background:var(--teal); color:var(--vellum-lit); }
.adv-toggle button[data-adv="-1"].on{ background:var(--rust); }
.tray-dice{ min-width:60px; }
.tray-msg{ display:flex; flex-direction:column; gap:0.1rem; min-width:150px; }
.tm-title{ font-family:var(--caps); font-size:0.62rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--teal-deep); }
.tm-formula{ font-family:var(--serif); font-size:0.82rem; color:var(--ink-soft); }
.tm-total{ font-family:var(--disp); font-weight:700; font-size:2.4rem; line-height:1; color:var(--rust-deep); }
.tray-log{ margin-left:auto; font-family:var(--caps); font-size:0.6rem; letter-spacing:0.04em; color:var(--ink-faint); text-align:right; max-width:280px; }
.log-line{ padding:0.05rem 0; border-bottom:1px dotted var(--edge-soft); }
.log-line:first-child{ color:var(--ink-2); }
@media (max-width:620px){ .tray-log{ display:none; } .tray-inner{ min-height:80px; } }