/* HUD skin (2026-10-15). Pavel: the HUD looked "like parts of a different game stitched together" - each piece
   had its own frame, radius, font and metal (grey-blue minimap buttons, a brown tracker, square brass guide
   card, square menu tiles). The windows already follow Soot & Brass (gdtheme.css, docs/UI-SOOT-AND-BRASS.md);
   this file carries that same material into the in-play layer, loaded LAST, and only under html.gdUI
   (?gdui=0 keeps the old look). The prefix also outranks the <style> tags minimap.js / hudpolish.js inject.

     glass   soot body, a little lighter at the top                 --hs-glass / --hs-glass-solid
     hair    1 px brass hairline, fading at the ends                --hs-hair (border-box gradient)
     ring    brass ring on round buttons: lit top-left, dark bend   --hs-ring / --hs-orb
     shape   pills for buttons and chips, --hs-r corners for cards
     type    labels Cinzel 600, wide tracking, brass; reading text keeps the game's serif
   Every colour is a Soot & Brass one (--gd-line #a8946a, --gd-line-hi #d8c592, --gd-text, --gd-slate).
   New HUD pieces: use these tokens (with a fallback) instead of a fresh palette. touch.js builds its
   controls from them. */
:root{
  --hs-glass:linear-gradient(180deg,rgba(30,27,23,.78),rgba(11,10,9,.86));
  --hs-glass-solid:linear-gradient(180deg,rgba(28,25,21,.95),rgba(11,10,9,.97));
  --hs-hair:linear-gradient(90deg,rgba(168,148,106,.14),rgba(216,197,146,.55),rgba(168,148,106,.14));
  --hs-ring:linear-gradient(160deg,#e6d9b6,#a8946a 42%,#3a3224 62%,#a8946a);
  --hs-orb:radial-gradient(circle at 50% 28%,rgba(46,42,36,.92),rgba(11,10,9,.94) 72%);
  --hs-shadow:0 6px 16px rgba(0,0,0,.45);
  --hs-r:12px;
  --hs-gold:#d8c592;
  --hs-ink:#e6d9b6;
  --hs-dim:rgba(211,204,187,.72);
}

/* ---- round minimap buttons: the brass ring of the touch buttons, not grey-blue steel */
html.gdUI #mmHud div.mmB{border:1px solid transparent;background:var(--hs-orb) padding-box,var(--hs-ring) border-box;
  color:var(--hs-gold);font-family:Cinzel,Georgia,serif;box-shadow:0 3px 8px rgba(0,0,0,.6),inset 0 -6px 10px rgba(0,0,0,.4)}
html.gdUI #mmHud div.mmB:hover{color:#fff}
html.gdUI #mmHud .mmLegendBtn{border:1px solid transparent;border-radius:999px;background:var(--hs-glass-solid) padding-box,var(--hs-hair) border-box;
  color:var(--hs-gold);font-family:Cinzel,Georgia,serif;font-weight:600;letter-spacing:.16em;box-shadow:0 3px 8px rgba(0,0,0,.6)}

/* ---- cards: tracker + guide share one frame (glass, hairline, rounded, brass caps head) */
html.gdUI #huntBtn,html.gdUI #qoCoach{border:1px solid transparent;border-radius:var(--hs-r);
  background:var(--hs-glass) padding-box,linear-gradient(180deg,rgba(216,197,146,.5),rgba(168,148,106,.12)) border-box;
  box-shadow:var(--hs-shadow),inset 0 1px 0 rgba(255,240,205,.06);color:var(--gd-text,#d3ccbb)}
html.gdUI #huntBtn:hover{box-shadow:0 0 14px rgba(216,197,146,.3)}
html.gdUI #huntBtn b,html.gdUI #qoCoach b{font-family:Cinzel,Georgia,serif;font-weight:600;letter-spacing:.2em;color:var(--hs-gold)}
html.gdUI #huntBtn span{color:var(--hs-dim)}
html.gdUI #qoCoach button{color:var(--gd-dim,#8e8571)}
html.gdUI #qoCoach.done{background:var(--hs-glass) padding-box,linear-gradient(180deg,rgba(143,227,154,.6),rgba(95,160,96,.15)) border-box}

/* ---- chips: the skill-point call and the objective line read as the same pill */
html.gdUI #ptsBadge{border:1px solid transparent !important;border-radius:999px !important;
  background:var(--hs-glass-solid) padding-box,var(--hs-hair) border-box !important;
  color:var(--hs-ink) !important;font-family:Cinzel,Georgia,serif !important;font-weight:600;letter-spacing:.12em;box-shadow:var(--hs-shadow) !important}
html.gdUI #navObj{font-family:Cinzel,Georgia,serif;letter-spacing:.16em;color:var(--hs-ink)}

/* ---- wrapping: no lone last words, even line lengths (Pavel 2026-10-15: "make sure text wrapping is thoughtful") */
html.gdUI #log div,html.gdUI #qoCoach span,html.gdUI #dlgText{text-wrap:pretty}
html.gdUI #navObj,html.gdUI #qoCoach,html.gdUI #areaBanner div{text-wrap:balance}
html.gdUI #huntBtn b,html.gdUI #huntBtn span,html.gdUI #huntBtn em,html.gdUI #ptsBadge{white-space:nowrap}

/* ---- the top-left card rail (2026-10-15, js/hudpolish.js railTick): the Hunt, the guide and the merc orders stack in one
   column at one width, one frame and one gap, so a taller Hunt card pushes the others down instead of covering them.
   Each card: a Cinzel brass head line, then reading text. Desktop only (touch keeps its own spots). */
html.gdUI:not(.qoTouch) #qoRail{position:fixed;left:14px;top:38px;width:272px;display:flex;flex-direction:column;gap:8px;z-index:20;pointer-events:none}
html.gdUI:not(.qoTouch) #qoRail>*{position:relative !important;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;
  transform:none !important;width:100% !important;max-width:none !important;box-sizing:border-box;margin:0 !important;pointer-events:auto;z-index:auto !important;
  border:1px solid transparent !important;border-radius:var(--hs-r) !important;
  background:var(--hs-glass) padding-box,linear-gradient(180deg,rgba(216,197,146,.5),rgba(168,148,106,.12)) border-box !important;
  box-shadow:var(--hs-shadow),inset 0 1px 0 rgba(255,240,205,.06) !important;padding:9px 14px 10px !important;text-align:left;
  font:max(13px,var(--qo-small,12px))/1.45 Georgia,serif !important;letter-spacing:.02em !important;color:var(--gd-text,#d3ccbb) !important}
/* one head style for all three: "THE HUNT", "GUIDE 5 / 6", the merc's name */
html.gdUI:not(.qoTouch) #qoRail :is(#huntBtn>b,#qoCoach>b,#mercBadge>span:first-child){display:block;margin:0 0 5px;font:600 12px/1.1 Cinzel,Georgia,serif !important;
  letter-spacing:.2em !important;color:var(--hs-gold) !important;opacity:1 !important;text-transform:uppercase}
/* the Hunt: head and count on one line, the trail / mark / Tithe lines under it */
html.gdUI:not(.qoTouch) #qoRail #huntBtn{display:grid;grid-template-columns:1fr auto;column-gap:10px;row-gap:2px;align-items:baseline}
html.gdUI:not(.qoTouch) #qoRail #huntBtn>b{grid-column:1;margin:0 0 3px}
html.gdUI:not(.qoTouch) #qoRail #huntBtn>span{grid-column:2;color:var(--hs-ink) !important;font-variant-numeric:tabular-nums}
html.gdUI:not(.qoTouch) #qoRail #huntBtn>:is(em,i){grid-column:1/-1;font-style:normal;white-space:normal !important}
html.gdUI:not(.qoTouch) #qoRail #qoCoach{padding-right:32px !important}
html.gdUI:not(.qoTouch) #qoRail #qoCoach>button{top:4px;right:4px}
html.gdUI:not(.qoTouch) #qoRail #mercBadge{white-space:normal !important;cursor:pointer}
html.gdUI:not(.qoTouch) #qoRail #mercBadge:hover,html.gdUI:not(.qoTouch) #qoRail #huntBtn:hover{box-shadow:0 0 14px rgba(216,197,146,.3) !important}