/* Hello TCG brand theme for the customer pages (catalog + store info).
   Palette is sampled from the store logo: midnight indigo ground, molten gold, ember orange,
   maroon outline and the cream of the "Hello" script. Single committed dark look. */
body.pub{
  --night:#120C33;--night-2:#0C0826;--dusk:#1C1547;--dusk-2:#251C59;--rim:#382B72;
  --gold-1:#FFC93C;--gold-2:#FFB21A;--ember:#F08A1C;--maroon:#5A1A1E;--cream:#FFF3D6;
  --bg:var(--night);--surface:var(--dusk);--sunk:var(--dusk-2);--ink:#EFEAF9;--muted:#A79FCB;--line:var(--rim);
  --accent:var(--gold-1);--accent-ink:var(--maroon);--accent-soft:#3A2A3A;
  --gold:var(--gold-1);--gold-soft:#3B2E1A;
  --good:#5CD39B;--good-soft:#173A33;--bad:#FF8A7E;--bad-soft:#43202C;--warn:#FFC266;--warn-soft:#3E2C1E;
  --g-pkm:#8C7533;--g-op:#8E4C3C;--g-rb:#3F5791;--g-ball:#3E7A55;--g-etc:#4C5468;
  --shadow:0 1px 0 rgba(255,255,255,.04) inset,0 10px 24px rgba(4,2,16,.45);
  color-scheme:dark;background:var(--bg);color:var(--ink);
}
body.pub::before{background:var(--night-2)}
body.pub :focus-visible{outline:2px solid var(--gold-1);outline-offset:2px}
body.pub ::selection{background:var(--gold-1);color:var(--maroon)}

/* ---------- brand bar: the one loud moment ---------- */
body.pub .sitenav{position:relative;overflow:hidden;color:var(--cream);border-bottom:1px solid var(--rim);
  background:radial-gradient(ellipse 420px 190px at 110px 60%,rgba(240,138,28,.20),rgba(240,138,28,.06) 45%,transparent 72%),linear-gradient(180deg,var(--night-2),#140D38)}
body.pub .sitenav::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--ember) 18%,var(--gold-1) 50%,var(--ember) 82%,transparent);opacity:.55}
body.pub .sitenav .in{padding-top:8px;padding-bottom:8px;gap:8px 12px;justify-content:space-between;flex-wrap:nowrap;font:600 14px var(--f-body)}
body.pub .sitenav .logo{display:block;padding:0;border-radius:12px;opacity:1;line-height:0;flex:none}
body.pub .sitenav .logo img{height:84px;width:auto;filter:drop-shadow(0 0 14px rgba(255,170,40,.28))}
body.pub .sitenav .links{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;min-width:0}
body.pub .sitenav .links a{color:var(--cream);opacity:.8;padding:8px 14px;border-radius:999px;border:1px solid transparent}
body.pub .sitenav .links a:hover{opacity:1;border-color:var(--rim)}
body.pub .sitenav .links a[aria-current]{opacity:1;background:var(--gold-1);color:var(--maroon);border-color:var(--gold-1)}
@media (max-width:560px){body.pub .sitenav .logo img{height:52px}body.pub .sitenav .links{gap:4px}body.pub .sitenav .links a{padding:7px 10px;font-size:13px;white-space:nowrap}}
@media (max-width:370px){body.pub .sitenav .logo img{height:44px}body.pub .sitenav .links a{padding:6px 8px;font-size:12px}}
@media (prefers-reduced-motion:no-preference){
  body.pub .sitenav .logo img{animation:ht-ignite 1.4s ease-out both}
  @keyframes ht-ignite{0%{opacity:0;transform:scale(.94);filter:drop-shadow(0 0 0 rgba(255,170,40,0))}60%{opacity:1;filter:drop-shadow(0 0 26px rgba(255,170,40,.6))}100%{transform:none;filter:drop-shadow(0 0 14px rgba(255,170,40,.28))}}
}

/* ---------- catalog ---------- */
body.pub .top{background:linear-gradient(180deg,#140D38,var(--night));border-bottom:1px solid var(--rim)}
body.pub .brand h1{color:var(--cream)}
body.pub .contact{color:var(--cream)}
body.pub .contact button{background:transparent;border-color:var(--rim);color:var(--cream)}
body.pub .contact button:hover{border-color:var(--gold-1);color:var(--gold-1)}
body.pub .rail{background:color-mix(in srgb,var(--night) 88%,transparent);border-bottom-color:var(--rim)}
body.pub .search input,body.pub .sel{background:var(--dusk);border-color:var(--rim);color:var(--ink)}
body.pub .search input::placeholder{color:var(--muted)}
body.pub .chip{background:transparent;border-color:var(--rim);color:var(--ink)}
body.pub .chip:hover{border-color:var(--gold-2)}
body.pub .chip[aria-pressed="true"]{background:var(--gold-1);border-color:var(--gold-1);color:var(--maroon)}
body.pub .tile{background:var(--dusk);border-color:var(--rim)}
body.pub .tile:hover{border-color:var(--gold-2)}
body.pub .sleeve{background:var(--dusk-2)}
body.pub .info .nm{color:var(--cream)}
body.pub .price{color:var(--gold-1);font-family:var(--f-display);font-weight:800;letter-spacing:.01em}
body.pub .bd{background:rgba(12,8,38,.86);color:var(--cream);box-shadow:none;border:1px solid rgba(255,255,255,.08)}
body.pub .bd.qty{background:var(--gold-1);color:var(--maroon);border-color:var(--gold-1)}
body.pub .bd.lim{background:var(--ember);color:#2A0E05;border-color:var(--ember)}
body.pub .bd.grade{background:var(--maroon);color:var(--gold-1);border-color:#7A2A2E}
body.pub .btn{background:var(--dusk);border-color:var(--rim);color:var(--ink)}
body.pub .btn:hover{background:var(--dusk-2);border-color:var(--gold-2)}
body.pub .btn.primary{background:var(--gold-1);border-color:var(--gold-1);color:var(--maroon)}
body.pub .btn.primary:hover{background:var(--gold-2);border-color:var(--gold-2);filter:none}
body.pub .empty b{color:var(--cream)}

/* detail sheet + cart */
body.pub .ov{background:rgba(6,3,20,.72)}
body.pub .modal{background:var(--dusk);border:1px solid var(--rim)}
body.pub .mh{background:var(--dusk);border-bottom-color:var(--rim)}
body.pub .mh h2{color:var(--cream)}
body.pub .x{background:var(--dusk-2);color:var(--cream)}
body.pub .bigprice{color:var(--gold-1)}
body.pub dl.kv dd{color:var(--cream)}
body.pub .step button{background:var(--dusk-2);border-color:var(--rim);color:var(--cream)}
body.pub .step input,body.pub .f input,body.pub .f textarea,body.pub .f select{background:var(--night);border-color:var(--rim);color:var(--ink)}
body.pub .f label{text-transform:none;letter-spacing:0;font-size:13px}
body.pub .lnk{color:var(--gold-1)}
body.pub .crow{border-bottom-color:var(--rim)}
body.pub .ctot b{color:var(--gold-1)}
body.pub .cartbar{background:var(--gold-1);color:var(--maroon);box-shadow:0 -8px 24px rgba(4,2,16,.5)}
body.pub .cartbar .btn{background:var(--maroon);border-color:var(--maroon);color:var(--cream)}
body.pub .cartbar .btn:hover{background:#6E2228}
body.pub .toast{background:var(--cream);color:var(--night)}

/* ---------- store info page ---------- */
body.pub .hero{background:linear-gradient(180deg,#140D38,var(--night));border-bottom-color:var(--rim)}
body.pub .about h1,body.pub .sec-head h2,body.pub .ev h3{color:var(--cream)}
body.pub .fact{border-top-color:var(--rim)}
body.pub .fact .k{text-transform:none;letter-spacing:0;font-size:13px;color:var(--gold-1)}
body.pub .fact a.v{color:var(--gold-1)!important}
body.pub .thumbs button[aria-current="true"]{border-color:var(--gold-1)}
body.pub .gal .main{box-shadow:0 0 0 1px var(--rim),0 18px 40px rgba(4,2,16,.5)}
body.pub .ev{background:var(--dusk);border-color:var(--rim)}
body.pub .ev .poster.none span{color:var(--cream)}
body.pub .datebadge{background:var(--gold-1);color:var(--maroon);box-shadow:0 4px 14px rgba(4,2,16,.5)}
body.pub .datebadge small{color:var(--maroon);opacity:.8}
body.pub .kv dt{color:var(--muted)}
body.pub .ev .price{font-size:inherit}
body.pub .empty{border-color:var(--rim)}
body.pub footer{border-top-color:var(--rim);color:var(--muted)}

/* ---------- app install ---------- */
body.pub .sitenav .install{display:inline-flex;align-items:center;gap:6px;font:600 14px var(--f-body);color:var(--gold-1);background:transparent;border:1px solid rgba(255,201,60,.45);border-radius:999px;padding:7px 13px;cursor:pointer}
body.pub .sitenav .install:hover{background:rgba(255,201,60,.1);border-color:var(--gold-1)}
body.pub .sitenav .in:has(.install:not([hidden])) .links{margin-left:auto}
@media (max-width:560px){
  body.pub .sitenav .in:has(.install:not([hidden])){flex-wrap:wrap}
  body.pub .sitenav .in:has(.install:not([hidden])) .install{order:2;margin-left:auto}
  body.pub .sitenav .in:has(.install:not([hidden])) .links{order:3;flex-basis:100%;justify-content:flex-start;margin-left:0}
}
.ht-sheet-ov{position:fixed;inset:0;z-index:80;background:rgba(6,3,20,.72);display:flex;align-items:flex-end;justify-content:center;padding:0 0 env(safe-area-inset-bottom,0px)}
@media (min-width:720px){.ht-sheet-ov{align-items:center}}
.ht-sheet{width:100%;max-width:420px;background:#1C1547;color:#EFEAF9;border:1px solid #382B72;border-radius:20px 20px 0 0;padding:24px max(20px,env(safe-area-inset-right,0px)) 20px max(20px,env(safe-area-inset-left,0px));display:grid;gap:12px;font-family:var(--f-body)}
@media (min-width:720px){.ht-sheet{border-radius:20px}}
.ht-sheet img{border-radius:14px;box-shadow:0 0 0 1px #382B72}
.ht-sheet h2{margin:0;font:800 20px var(--f-display);color:#FFF3D6}
.ht-sheet ol{margin:0;padding-left:20px;display:grid;gap:10px;line-height:1.5}
.ht-sheet svg{vertical-align:-3px;color:#FFC93C}
.ht-sheet p{margin:0;line-height:1.5}
.ht-sheet-close{justify-self:stretch;margin-top:6px;border:0;border-radius:12px;background:#FFC93C;color:#5A1A1E;font:700 15px var(--f-body);padding:12px;cursor:pointer}