/* =====================================================================
   LIGHT SKIN — site-wide (2026-08-31). Linked AFTER cover.v12 so it wins.
   Most of cover.v12 is written against the --cv-* tokens, so redefining the
   palette to light flips the bulk of the UI automatically; the rest of this
   file re-lights the hard-coded dark chrome (masthead, topbar, footer) and the
   inventory toolbar/hero that carried literal dark values.
   (Home page keeps its own body.home block in index.html, loaded after this.)
   ===================================================================== */
:root{
  --cv-bg:#ffffff; --cv-bg2:#f6f2e9; --cv-panel:#faf7f0; --cv-panel2:#f2ece0;
  --cv-line:#e6dfd0; --cv-line2:#d9d2c3;
  --cv-text:#3c3930; --cv-head:#14181f; --cv-muted:#857f70;
  --cv-accent:#c0392f; --cv-accent2:#a8161b;
  /* cover.v12 repoints the wired tokens dark too — flip them back to light so
     wired's own var()-based components (e.g. the .tldr "Quick version" note) stay readable */
  --wr-paper:#ffffff; --wr-paper2:#f6f2e9; --wr-line:#e6dfd0;
  --wr-body:#3c3930; --wr-muted:#857f70;
  --wr-accent:#c0392f; --wr-accent2:#a8161b; --wr-red:#c0392f;
}
html,body{ background:#ffffff !important; color:#3c3930 !important; }

/* ---- topbar + masthead ---- */
.wr-topbar,.dk-strip{ background:#f6f2e9 !important; color:#6a6357 !important; border-bottom:1px solid #e6dfd0 !important; }
.wr-topbar b,.dk-strip b{ color:#c0392f !important; }
header.wr-mast{ background:#ffffff !important; border-bottom:1px solid #e6dfd0 !important; box-shadow:0 2px 12px rgba(20,24,31,.06) !important; }
header .wr-logo .name{ color:#14181f !important; -webkit-text-fill-color:#14181f !important; }
header .wr-navlinks a,header .wr-actions a,header .wr-icon,header .drop-toggle{ color:#14181f !important; }
header .wr-navlinks a:hover,header .drop-toggle:hover{ color:#c0392f !important; }
header .wr-navlink{ background:#c0392f !important; color:#fff !important; border-radius:7px !important; padding:9px 16px !important; }
header .wr-navlink:hover{ background:#a8161b !important; color:#fff !important; }
header .theme-toggle{ border-color:#e6dfd0 !important; color:#14181f !important; }
header .dropdown .drop-menu{ background:#ffffff !important; border:1px solid #e6dfd0 !important; box-shadow:0 12px 30px rgba(20,24,31,.12) !important; }
header .dropdown .drop-menu a{ color:#14181f !important; }
header .dropdown .drop-menu a:hover{ background:#f6f2e9 !important; color:#c0392f !important; }

/* ---- footer -> light ---- */
footer{ background:#f6f2e9 !important; color:#5a5348 !important; border-top:2px solid #c0392f !important; }
footer h4,footer .brandmark,footer .brandmark *{ color:#14181f !important; -webkit-text-fill-color:#14181f !important; }
footer p,footer .foot-bottom{ color:#5a5348 !important; }
footer a{ color:#5a5348 !important; }
footer a:hover{ color:#c0392f !important; }

/* ---- dark contact bands (.wr-news / #contact / .nlw-subscribe) -> light ---- */
.wr-news,#contact,.nlw-subscribe{ background:#f6f2e9 !important; background-image:none !important; border-top:1px solid #e6dfd0 !important; }
.wr-news h2,.nlw-subscribe h2{ color:#14181f !important; -webkit-text-fill-color:#14181f !important; }
.wr-news p,.wr-news .alt,.nlw-subscribe p{ color:#5a5348 !important; }
.wr-news .fld,.wr-news label{ color:#6a6357 !important; }
.wr-news input,.wr-news textarea{ background:#ffffff !important; color:#14181f !important; border:1px solid #d8d2c4 !important; }
.wr-news input::placeholder,.wr-news textarea::placeholder{ color:#8a8474 !important; }
.wr-news button{ background:#c0392f !important; color:#fff !important; border:0 !important; }
.wr-news a{ color:#a8161b !important; }

/* ---- images that sat on dark photo cards: give a light matte ---- */
.hero-figure{ background:#ffffff !important; border:1px solid #e6dfd0 !important; box-shadow:0 12px 30px rgba(20,24,31,.10) !important; }

/* =====================================================================
   Inventory page — the toolbar + hero rail carried literal dark values.
   ===================================================================== */
body.deskpage .grid-controls{ background:#ffffff !important; border-bottom:1px solid #e6dfd0 !important; box-shadow:none !important; }
body.deskpage .grid-controls .gc-filters{ background:#f2ece0 !important; border:1px solid #e6dfd0 !important; box-shadow:inset 0 1px 2px rgba(20,24,31,.05) !important; }
body.deskpage .stk-btn{ background:transparent !important; color:#6a6357 !important; }
body.deskpage .stk-btn:hover{ background:rgba(20,24,31,.06) !important; color:#14181f !important; }
body.deskpage .stk-btn.active{ background:#c0392f !important; color:#fff !important; box-shadow:0 1px 3px rgba(20,24,31,.2) !important; }
body.deskpage .stk-btn[data-mode="sthunt"].active{ background:#c08a12 !important; color:#fff !important; }
/* toolbar shell -> clean white bar so the filled controls read as controls */
body.deskpage .grid-controls .gc-tools{ background:#ffffff !important; border:1px solid #e6dfd0 !important; border-radius:14px !important; box-shadow:0 6px 18px rgba(20,24,31,.06) !important; padding:11px 13px !important; }
/* search + dropdowns -> filled paper pills, no outline */
body.deskpage .grid-controls .gc-search,
body.deskpage .grid-controls .gc-series,
body.deskpage .grid-controls .gc-sort{ background:#f2ece0 !important; color:#14181f !important; border:0 !important; border-radius:10px !important; box-shadow:inset 0 1px 2px rgba(20,24,31,.05) !important; }
body.deskpage .grid-controls .gc-search::placeholder{ color:#8a8474 !important; }
body.deskpage .grid-controls .gc-series:hover,
body.deskpage .grid-controls .gc-sort:hover{ background:#ece4d4 !important; }
body.deskpage .grid-controls .gc-search:focus,
body.deskpage .grid-controls .gc-series:focus,
body.deskpage .grid-controls .gc-sort:focus{ background:#ffffff !important; box-shadow:0 0 0 2px rgba(192,57,47,.35) !important; }
body.deskpage .grid-controls .gc-searchwrap svg{ color:#c0392f !important; }
body.deskpage .grid-controls .gc-count{ color:#857f70 !important; }
/* inventory hero rail filter menu -> same filled paper pills as the toolbar */
body.deskpage .inv-lead .wr-rail .gc-filters{ background:transparent !important; }
body.deskpage .inv-lead .wr-rail .gc-filters .stk-btn{ background:#f2ece0 !important; color:#14181f !important; border:0 !important; border-radius:10px !important; box-shadow:inset 0 1px 2px rgba(20,24,31,.05) !important; }
body.deskpage .inv-lead .wr-rail .gc-filters .stk-btn:hover{ background:#ece4d4 !important; color:#14181f !important; }
body.deskpage .inv-lead .wr-rail .gc-filters .stk-btn.active{ background:#c0392f !important; color:#fff !important; box-shadow:0 1px 3px rgba(20,24,31,.2) !important; }
body.deskpage .inv-lead .wr-rail .gc-filters .stk-btn[data-mode="sthunt"].active{ background:#c08a12 !important; color:#fff !important; }
body.deskpage .inv-lead .wr-rail .railhead{ border-bottom-color:#14181f !important; color:#14181f !important; }
body.deskpage .inv-lead .inv-stats .st b{ color:#14181f !important; }
body.deskpage .inv-lead .inv-stats .st span{ color:#857f70 !important; }

/* ---- thumbnail-less story cards (.mag-card.no-thumb) must not inherit the
       black .no-thumb placeholder fill -> keep the light card panel ---- */
.mag-card.no-thumb{ background:var(--cv-panel) !important; }

/* ---- table headers keep their dark navy band -> force white labels ---- */
.sg-table thead th,table.hw25 thead th,table.vg-table thead th,.hw25-tablewrap thead th{
  background:linear-gradient(180deg,#14181f,#0b0e13) !important; color:#ffffff !important; }
.sg-table thead th .arw,table.vg-table thead th .arw{ color:#ffffff !important; }
/* =====================================================================
   REUSABLE RETRO-POSTER HERO TREATMENT
   Drop any photo (.ph-photo) or flat illustration into .poster-hero and it gets
   a warm duotone wash, halftone, film grain, an inset frame, and a condensed
   kicker/title plate — one consistent "travel-poster" look, whether the source
   is a real casting photo or a flat illustration.
   ===================================================================== */
.poster-hero{ position:relative !important; display:block; overflow:hidden; background:#1a130b !important; }
.poster-hero .ph-photo{ position:absolute !important; inset:0; width:100% !important; height:100% !important; object-fit:cover !important; filter:sepia(.26) saturate(1.08) contrast(1.05) !important; }
.poster-hero .ph-wash{ position:absolute; inset:0; background:linear-gradient(150deg, rgba(192,57,47,.30), rgba(21,36,27,.08) 46%, rgba(20,24,31,.46)); mix-blend-mode:soft-light; pointer-events:none; }
.poster-hero .ph-halftone{ position:absolute; inset:0; background-image:radial-gradient(circle, rgba(20,24,31,.55) 0 21%, transparent 23%); background-size:4px 4px; mix-blend-mode:multiply; opacity:.12; pointer-events:none; }
.poster-hero .ph-grain{ position:absolute; inset:0; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size:150px 150px; mix-blend-mode:overlay; opacity:.32; pointer-events:none; }
.poster-hero .ph-frame{ position:absolute; inset:9px; border:1.5px solid rgba(246,242,233,.55); border-radius:2px; pointer-events:none; z-index:2; }
.poster-hero .ph-plate{ position:absolute; left:15px; bottom:13px; display:flex; flex-direction:column; align-items:flex-start; gap:5px; z-index:3; }
.poster-hero .ph-kicker{ font-family:'Oswald','Space Grotesk',sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.16em; font-size:.6rem; color:#fff; background:#c0392f; padding:3px 9px; }
.poster-hero .ph-title{ font-family:'Anton','Oswald',sans-serif; text-transform:uppercase; letter-spacing:.015em; font-size:1.55rem; line-height:.95; color:#f6f2e9; text-shadow:0 2px 7px rgba(0,0,0,.55); }
/* illustration variant: flat art already uses the palette, so skip the photo
   sepia and soften the wash — keep grain + halftone + frame for consistency */
.poster-hero.illus .ph-photo{ filter:none !important; object-fit:cover !important; }
.poster-hero.illus .ph-wash{ opacity:.35; }
.poster-hero.illus .ph-halftone{ opacity:.08; }
.poster-hero.illus .ph-grain{ opacity:.20; }

/* lightbox image -> a real photo print mounted on an aged album page,
   held by translucent corner pockets. Layers, back to front:
   soft top-light sheen · scattered foxing spots · paper fibre · edge vignette · warm stock */
.lb .lb-img{
  background:
    radial-gradient(80% 55% at 32% 8%, rgba(255,253,247,.55), rgba(255,253,247,0) 60%),
    radial-gradient(9px 7px at 24% 30%, rgba(150,110,60,.14), rgba(150,110,60,0) 70%),
    radial-gradient(7px 6px at 78% 22%, rgba(150,110,60,.11), rgba(150,110,60,0) 70%),
    radial-gradient(11px 8px at 68% 82%, rgba(150,110,60,.12), rgba(150,110,60,0) 70%),
    radial-gradient(6px 6px at 14% 74%, rgba(150,110,60,.10), rgba(150,110,60,0) 70%),
    radial-gradient(8px 7px at 88% 60%, rgba(150,110,60,.10), rgba(150,110,60,0) 70%),
    repeating-linear-gradient(90deg, rgba(120,96,54,.035) 0 1px, rgba(120,96,54,0) 1px 3px),
    repeating-linear-gradient(0deg, rgba(120,96,54,.05) 0 2px, rgba(120,96,54,0) 2px 5px),
    radial-gradient(135% 120% at 50% 42%, rgba(233,223,202,0) 55%, rgba(150,120,72,.28) 100%),
    radial-gradient(130% 100% at 50% -12%, #fbf4e6 0%, #eadfc8 52%, #d8caa8 100%),
    #e6dcc4 !important;
  padding:60px 54px !important;
  overflow:visible !important;
  border-bottom:2px solid #cdbf9f !important;
  box-shadow: inset 0 0 90px rgba(120,96,54,.24) !important;
  display:grid !important; place-items:center !important;
}
.lb .lb-img::before,.lb .lb-img::after{ display:none !important; content:none !important; }
/* the white photo print: a cream border, heavier along the bottom, tilted, with a
   directional contact shadow onto the page (light from top-left) */
.lb .lb-img .album-mount{
  position:relative; display:inline-block; line-height:0; max-width:84%;
  transform:rotate(-1.3deg);
  padding:10px 10px 26px !important;
  background:linear-gradient(158deg,#fffdf8 0%,#f7f1e6 100%) !important;
  border-radius:2px !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.8) inset,
    0 18px 30px -10px rgba(54,38,16,.5),
    0 3px 7px rgba(54,38,16,.28) !important;
}
.lb .lb-img .album-mount img{
  display:block !important; max-width:100% !important; max-height:60vh !important; object-fit:contain !important;
  border:0 !important; border-radius:1px !important;
  box-shadow:0 0 0 1px rgba(60,45,20,.10) inset, 0 1px 3px rgba(60,45,20,.22) !important;
  filter:saturate(.97) contrast(1.02) !important; background:transparent !important;
}
/* translucent amber corner pockets: a triangular fold with a light hypotenuse edge and a shadow */
.lb .lb-img .pcorner{ position:absolute; width:38px; height:38px; z-index:3; pointer-events:none;
  background:linear-gradient(135deg, rgba(48,34,16,.74) 0 44%, rgba(120,92,44,.5) 46%, rgba(120,92,44,0) 48%);
  filter:drop-shadow(1px 1px 1.5px rgba(30,20,8,.45)); }
.lb .lb-img .pcorner::before{ content:""; position:absolute; inset:0;
  background:linear-gradient(135deg, rgba(255,240,205,.5) 0 3%, rgba(255,240,205,0) 4% 42%, rgba(255,245,220,.45) 43%, rgba(255,245,220,0) 46%); }
.lb .lb-img .pcorner.tl{ top:-6px; left:-6px; }
.lb .lb-img .pcorner.tr{ top:-6px; right:-6px; transform:rotate(90deg); }
.lb .lb-img .pcorner.br{ bottom:-6px; right:-6px; transform:rotate(180deg); }
.lb .lb-img .pcorner.bl{ bottom:-6px; left:-6px; transform:rotate(270deg); }

/* lightbox spec VALUES — cover.v12 forces .lb-spec b to white for the dark tile,
   but the spec boxes are light here, so the value was white-on-white (invisible) */
.lb-inner .lb-spec b,.lb-specs .lb-spec b,.lb-info .lb-spec b,.lb-inner .lb-spec strong{ color:#14181f !important; -webkit-text-fill-color:#14181f !important; }
.lb-inner .lb-spec,.lb-specs .lb-spec{ background:#f6f2e9 !important; border-color:#e6dfd0 !important; }

/* HW series tier badges (.hws-badge) — cover.v12 tints were built for a dark
   card, so their light text was unreadable on the light panel; use dark ink on a
   soft color tint instead */
body.deskpage .hws-badge.prem{ background:rgba(168,22,27,.12) !important; color:#a8161b !important; }
body.deskpage .hws-badge.mid{ background:rgba(181,130,26,.16) !important; color:#8a6410 !important; }
body.deskpage .hws-badge.main{ background:#f2ece0 !important; color:#3c3930 !important; }
/* HW reference result count (was near-white for the dark theme) */
body.deskpage .hw25-count{ color:#857f70 !important; background:#f6f2e9 !important; border:1px solid #e6dfd0 !important; }

/* article hero overlay tag (.ph-art .art-tag) sits ON TOP of the hero photo —
   cover.v12's transparent orange-outline pill is unreadable there, so give it a
   solid dark pill with white text (readable over any image) */
.ph-art .art-tag,.ph-art .art-top .art-tag{ background:#14181f !important; color:#ffffff !important; border:0 !important; box-shadow:0 2px 8px rgba(0,0,0,.4) !important; padding:5px 12px !important; }

/* newsletter subscribe box (.frs) -> light card */
.frs{ background:#faf7f0 !important; border:1px solid #e6dfd0 !important; box-shadow:0 8px 20px rgba(20,24,31,.06) !important; }
.frs-h{ color:#14181f !important; }
.frs p{ color:#5a5348 !important; }
.frs-cta{ color:#c0392f !important; }

/* ============================================================
   Article hero photo — match the HOME lead figure (.hero-figure):
   a clean light mount with a hairline border, soft shadow, and a
   cleanly-rounded photo. Drops the dark scrim and the burned-on
   tag/caption (the rubric + date already show in the copy column),
   so the subpage hero reads with the same editorial polish as home.
   ============================================================ */
.hero.page-hero .ph-art{
  background:#ffffff !important;
  border:1px solid #e6dfd0 !important;
  border-radius:12px !important;
  box-shadow:0 12px 30px rgba(20,24,31,.10) !important;
  min-height:0 !important;
  padding:10px !important;
  display:block !important;
  overflow:hidden !important;
}
.hero.page-hero .ph-art .art-img{
  position:relative !important;
  inset:auto !important;
  width:100% !important;
  height:auto !important;
  aspect-ratio:16 / 10 !important;
  object-fit:cover !important;
  opacity:1 !important;
  border-radius:8px !important;
  display:block !important;
}
.hero.page-hero .ph-art::after{ display:none !important; }
.hero.page-hero .ph-art .art-top,
.hero.page-hero .ph-art .art-btm{ display:none !important; }