/* ============================================================
   SALESROOM THEME — a heritage salesroom on sale day.
   Same class surface as editorial/theme.css, so shared header,
   footer, drawer and component classes stay styled.

   Built from the room and its printed catalogue: cream catalogue
   paper with deckled edges, ink-black letterpress with double rules,
   lot numbers and estimates in small capitals; a damask wall (heritage
   green, or oxblood from the admin page) hung with carved gilt frames
   under brass picture lamps; the mahogany rostrum, the gavel and its
   sound block; numbered bidding paddles, manila reserve tags and the
   red "Sold" stamp. Ink and cream by day with oxblood and gilt; after
   dark the evening sale, lamplit, the wall deep and the gilt catching
   the light.

   The theme sets the --theme-* accent ramp itself (oxblood by day,
   lamplit gilt by night), so the admin's accent colour setting does
   not apply while it is active.
   ============================================================ */

:root {
  --font-display: 'Brygada 1918', 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, 'Songti SC', 'Noto Serif CJK SC', serif;
  --font-ui:      'Brygada 1918', 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, 'Noto Serif', system-ui, serif;
  --font-label:   'Alegreya Sans SC', 'Brygada 1918', 'Gill Sans', 'Trebuchet MS', system-ui, sans-serif;

  --paper:        #f4ecda;
  --paper-2:      #fbf6ea;
  --paper-3:      #ebe0c6;
  --ink:          #1c1712;
  --ink-2:        #3b3329;
  --ink-soft:     #6c6150;
  --rule:         rgba(28, 23, 18, 0.17);
  --rule-soft:    rgba(28, 23, 18, 0.08);
  --radius:       4px;
  --radius-sm:    2px;
  --shadow:       0 1px 1px rgba(28, 23, 18, .08), 0 6px 14px -8px rgba(28, 23, 18, .32);
  --shadow-md:    0 2px 3px rgba(28, 23, 18, .08), 0 18px 32px -16px rgba(28, 23, 18, .45);

  /* Oxblood */
  --theme-50:  #f8eceb;
  --theme-100: #efd3d1;
  --theme-200: #dfa9a6;
  --theme-300: #c97a77;
  --theme-400: #a84e4d;
  --theme-500: #8c3236;
  --theme-600: #74242a;
  --theme-700: #5e1c22;
  --theme-800: #48151a;
  --theme-900: #320e12;
  --theme-500-rgb: 140, 50, 54;
  --theme-600-rgb: 116, 36, 42;
  --theme-600-ink: #ffffff;

  /* The room's materials, by name */
  --oxblood: #74242a; --oxblood-hi: #9a3a3c; --oxblood-lo: #4a1418;
  --gilt: #b48a3c; --gilt-hi: #f0d896; --gilt-mid: #c9a24e; --gilt-lo: #6e4f1c;
  --gilt-grad: linear-gradient(135deg, #6e4f1c 0%, #c9a24e 20%, #f3dd9c 36%, #b48a3c 54%, #e8cb82 72%, #7a5a20 100%);
  --gilt-edge: linear-gradient(180deg, #f3dd9c, #c9a24e 40%, #7a5a20);
  --mahog: #5a2a1c; --mahog-hi: #7c3c26; --mahog-lo: #331610;
  --stamp: #b0272c;
  --manila: #ead6a6; --manila-lo: #c9ae73;
  --lamp: rgba(255, 228, 170, .0);

  /* The salesroom wall (srm_wall_css() re-points these for oxblood) */
  --wall: #1d4a3a; --wall-hi: #2c624d; --wall-lo: #10302a; --wall-damask: #2a5c48;
  --wall-glow: rgba(255, 226, 170, .16);

  /* The evening sale: footer, winners, splash and login in both modes */
  --night:   #16110c;
  --night-2: #1f1912;
  --night-3: #2a2219;
  --on-night: #f3e9d3;
  --on-night-soft: rgba(243, 233, 211, .76);

  /* Names other themes' shared markup reaches for */
  --gold:       #b48a3c;
  --gold-2:     #c9a24e;
  --gold-soft:  rgba(140, 50, 54, 0.07);
  --gold-ink:   #1c1712;
  --felt:       #16110c;
  --felt-2:     #1f1912;
  --on-felt:    #f3e9d3;
  --on-felt-soft: rgba(243, 233, 211, 0.78);
  --peacock:    #1d4a3a;
  --peacock-soft: rgba(29, 74, 58, 0.1);
  --red:        #b0272c;
  --red-soft:   rgba(176, 39, 44, 0.08);
  --rose:       #8c3236;
  --rose-soft:  rgba(140, 50, 54, 0.08);

  --notify-accent: var(--theme-500);
  --nav-accent:    var(--theme-600);
  --hdr-strip-bg:  #1c1712;
  --hdr-strip-rule: transparent;
  --text-primary:  var(--ink);

  /* Buttons: ink-black, lettered in cream small capitals, with a gilt
     hairline; after dark polished gilt under the lamps */
  --btn-bg:       #1c1712;
  --btn-bg-hover: #30271d;
  --btn-ink:      #f7efdc;
  --btn-shadow:   inset 0 0 0 1px rgba(201, 162, 78, .5), 0 2px 0 #9c7630, 0 10px 18px -12px rgba(28, 23, 18, .7);
  --btn-shadow-hover: inset 0 0 0 1px rgba(240, 216, 150, .75), 0 3px 0 #9c7630, 0 14px 22px -12px rgba(28, 23, 18, .7);

  /* Letterpress: a thick and a thin rule, the catalogue's divider */
  --rule-double: linear-gradient(180deg, var(--ink) 0 2px, transparent 2px 4px, var(--ink) 4px 5px);
  --rule-double-gilt: linear-gradient(180deg, #c9a24e 0 2px, transparent 2px 4px, #c9a24e 4px 5px);

  /* Deckled paper: the catalogue sheet's torn top and foot, as a mask */
  --deckle-img: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='6' viewBox='0 0 40 6'><path d='M0 6V2.6L2.4 3.4L4.6 1.8L7.2 3L9 1.2L11.8 2.8L14 1.6L16.4 3.2L18.8 1L21.4 2.4L23.6 1.4L26.2 3.4L28.6 1.6L31 2.8L33.2 1.2L35.8 3L38 1.8L40 2.6V6Z'/></svg>");
  --deckle-mask:
    var(--deckle-img) left top / 40px 6px repeat-x,
    linear-gradient(#000, #000) left 5px / 100% calc(100% - 10px) no-repeat,
    var(--deckle-img) left bottom / 40px 6px repeat-x;

  /* Damask, tone on tone, for the wall and the night panels */
  --damask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='72' height='108' viewBox='0 0 72 108'><g fill='%23ffffff' fill-opacity='.075'><path d='M36 6C40 16 50 18 50 30C50 40 42 44 40 52C46 50 54 54 54 62C54 72 44 76 36 90C28 76 18 72 18 62C18 54 26 50 32 52C30 44 22 40 22 30C22 18 32 16 36 6Z'/><path d='M36 30C33 34 30 36 30 40C30 44 33 46 36 48C39 46 42 44 42 40C42 36 39 34 36 30Z' fill-opacity='.1'/><path d='M0 0C4 6 10 8 10 14C10 18 6 20 0 20ZM72 0C68 6 62 8 62 14C62 18 66 20 72 20ZM0 108C4 102 10 100 10 94C10 90 6 88 0 88ZM72 108C68 102 62 100 62 94C62 90 66 88 72 88Z'/><circle cx='0' cy='54' r='5'/><circle cx='72' cy='54' r='5'/><circle cx='36' cy='100' r='2.4'/></g></svg>");

  /* Catalogue paper's faint laid lines and a few flecks */
  --paper-grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240'><g fill='%231c1712' fill-opacity='.05'><circle cx='30' cy='44' r='.9'/><circle cx='190' cy='22' r='.7'/><circle cx='120' cy='150' r='.8'/><circle cx='214' cy='196' r='.9'/><circle cx='62' cy='208' r='.7'/></g><g stroke='%231c1712' stroke-opacity='.025' stroke-width='1'><path d='M0 30H240M0 90H240M0 150H240M0 210H240'/></g></svg>");

  /* The evening sale behind the footer, winners, splash and login: the
     wall in shadow with pools of lamplight */
  --night-bg:
    radial-gradient(520px 260px at 50% -40px, rgba(255, 214, 150, .22), transparent 70%),
    radial-gradient(420px 260px at 92% 110%, rgba(140, 50, 54, .22), transparent 70%),
    linear-gradient(180deg, #10291f 0%, #0c1f18 60%, #0a1712 100%);

  --page-bg: var(--paper-grain) repeat, var(--paper);
}

html.dark {
  --paper:        #15110d;
  --paper-2:      #1e1913;
  --paper-3:      #29221a;
  --ink:          #f2e8d3;
  --ink-2:        #ddd0b6;
  --ink-soft:     #a99c84;
  --rule:         rgba(242, 232, 211, 0.15);
  --rule-soft:    rgba(242, 232, 211, 0.07);
  --shadow:       0 1px 2px rgba(0, 0, 0, .45), 0 6px 18px -8px rgba(0, 0, 0, .75);
  --shadow-md:    0 2px 4px rgba(0, 0, 0, .45), 0 18px 36px -14px rgba(0, 0, 0, .9);

  /* Gilt, lamplit */
  --theme-50:  #231c13;
  --theme-100: #30261a;
  --theme-200: #5a4626;
  --theme-300: #ecd49c;
  --theme-400: #e6c886;
  --theme-500: #d9b56a;
  --theme-600: #e3c27e;
  --theme-700: #eed6a2;
  --theme-800: #f5e5c0;
  --theme-900: #fbf2dc;
  --theme-500-rgb: 217, 181, 106;
  --theme-600-rgb: 227, 194, 126;
  --theme-600-ink: #1c1712;

  --oxblood: #c4575a; --oxblood-hi: #e07c7a; --oxblood-lo: #7a2a2e;
  --gilt: #d9b56a; --gilt-hi: #fbe7b0; --gilt-mid: #e3c27e; --gilt-lo: #8a6526;
  --stamp: #e0605a;
  --manila: #d9c290; --manila-lo: #a78c55;
  --lamp: rgba(255, 220, 150, .22);

  --wall: #11302a; --wall-hi: #1a4436; --wall-lo: #071a15; --wall-damask: #1f4a3b;
  --wall-glow: rgba(255, 210, 140, .3);

  --gold:       #d9b56a;
  --gold-2:     #eed6a2;
  --gold-soft:  rgba(217, 181, 106, 0.1);
  --felt:       #0c0a07;
  --felt-2:     #1e1913;
  --peacock:    #8cc7ad;
  --peacock-soft: rgba(140, 199, 173, 0.12);
  --red:        #e0605a;
  --red-soft:   rgba(224, 96, 90, 0.13);
  --rose:       #e07c7a;
  --rose-soft:  rgba(217, 181, 106, 0.1);

  --nav-accent:    var(--theme-500);
  --hdr-strip-bg:  #0c0a07;

  --btn-bg:       #d9b56a;
  --btn-bg-hover: #e8c886;
  --btn-ink:      #1c1712;
  --btn-shadow:   inset 0 0 0 1px rgba(255, 240, 200, .45), 0 2px 0 #8a6526, 0 10px 26px -10px rgba(240, 200, 120, .45);
  --btn-shadow-hover: inset 0 0 0 1px rgba(255, 240, 200, .7), 0 3px 0 #8a6526, 0 14px 30px -10px rgba(240, 200, 120, .6);

  --rule-double: linear-gradient(180deg, #d9b56a 0 2px, transparent 2px 4px, #d9b56a 4px 5px);
  --paper-grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240'><g fill='%23f2e8d3' fill-opacity='.04'><circle cx='30' cy='44' r='.9'/><circle cx='190' cy='22' r='.7'/><circle cx='120' cy='150' r='.8'/><circle cx='214' cy='196' r='.9'/></g></svg>");
  --page-bg:
    radial-gradient(900px 420px at 78% -160px, rgba(255, 214, 150, 0.08), transparent 70%) no-repeat,
    radial-gradient(800px 380px at 6% -140px, rgba(29, 74, 58, 0.18), transparent 70%) no-repeat,
    var(--paper-grain) repeat,
    var(--paper);
}

/* ── Base ──
   Tailwind's compiled sheet loads after the theme, so selectors that must
   beat its single-class utilities carry an extra html qualifier. */
html body {
  background: var(--page-bg);
  color: var(--ink);
  font-family: var(--font-ui);
  font-variant-numeric: lining-nums;
}
html .font-sans { font-family: var(--font-ui); }

html .font-display, h1.display, h2.display, h3.display {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: -.005em;
}
.display-italic { font-style: italic; }
/* Figures in tabular columns: lining and even, in the catalogue face */
html .font-display.tabular-nums, html .font-display[class*="tabular"] { font-family: var(--font-ui); font-weight: 600; letter-spacing: 0; font-variant-numeric: lining-nums tabular-nums; }
html .font-mono { font-family: var(--font-label); letter-spacing: .03em; }

::selection { background: #e8cfa0; color: #1c1712; }

.text-gradient-theme { background: none; -webkit-background-clip: initial; background-clip: initial; color: var(--theme-500); }

/* Small capitals: the catalogue's lot numbers, estimates and labels. The
   face draws lowercase as small caps, so text keeps its own case. */
.srm-sc, .ed-eyebrow, html .section-eyebrow, .drawer-section-label, .ed-section-cap, .ed-subnav-eyebrow {
  font-family: var(--font-label);
  font-weight: 700;
  text-transform: none;
  letter-spacing: .05em;
}
.ed-eyebrow { font-size: 13px; color: var(--theme-600); }
.ed-eyebrow-tight { font-size: 10px !important; letter-spacing: 0 !important; white-space: nowrap !important; }

/* The gavel at rest on its block: section eyebrows wear it */
html .section-eyebrow::before, .srm-gavel-ico {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 16'><rect x='2' y='12' width='14' height='3.4' rx='1.2' fill='%237c3c26'/><rect x='3.4' y='11' width='11.2' height='1.6' rx='.6' fill='%23c9a24e'/><g transform='rotate(-24 13 6)'><rect x='3' y='3' width='9' height='6' rx='1.4' fill='%235a2a1c'/><rect x='5.4' y='3' width='1.2' height='6' fill='%23c9a24e'/><rect x='8.4' y='3' width='1.2' height='6' fill='%23c9a24e'/><rect x='12' y='5.2' width='13' height='1.6' rx='.8' fill='%235a2a1c'/></g></svg>") center / contain no-repeat;
}
html.dark .section-eyebrow::before, html.dark .srm-gavel-ico {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 16'><rect x='2' y='12' width='14' height='3.4' rx='1.2' fill='%23a0583a'/><rect x='3.4' y='11' width='11.2' height='1.6' rx='.6' fill='%23f0d896'/><g transform='rotate(-24 13 6)'><rect x='3' y='3' width='9' height='6' rx='1.4' fill='%23a0583a'/><rect x='5.4' y='3' width='1.2' height='6' fill='%23f0d896'/><rect x='8.4' y='3' width='1.2' height='6' fill='%23f0d896'/><rect x='12' y='5.2' width='13' height='1.6' rx='.8' fill='%23a0583a'/></g></svg>");
}
.srm-gavel-ico { display: inline-block; flex-shrink: 0; width: 22px; height: 14px; }
[dir="rtl"] .srm-gavel-ico, [dir="rtl"] .section-eyebrow::before { transform: scaleX(-1); }

/* A bidding paddle, small: the kicker and the strip chip */
.srm-paddle-ico {
  display: inline-block; flex-shrink: 0; width: 12px; height: 18px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 18'><rect x='5' y='9' width='2' height='9' rx='.8' fill='%237c3c26'/><circle cx='6' cy='6' r='5.6' fill='%23f6efdf' stroke='%23c9a24e' stroke-width='.9'/><path d='M6 2.7L6.8 4.9L9.1 5L7.3 6.4L7.9 8.7L6 7.4L4.1 8.7L4.7 6.4L2.9 5L5.2 4.9Z' fill='%231c1712'/></svg>") center / contain no-repeat;
}

html .section-eyebrow {
  display: inline-flex; align-items: center; gap: 0.6rem;
  font-size: 14px;
  color: var(--theme-600);
  margin-bottom: 0.6rem;
}
html .section-eyebrow::before { content: ''; flex-shrink: 0; width: 24px; height: 15px; }

.btn-view-all {
  display: inline-flex; align-items: center; gap: 0.45rem;
  font-family: var(--font-label);
  font-size: 1rem; font-weight: 700; letter-spacing: .04em;
  white-space: nowrap; flex-shrink: 0;
  color: var(--ink);
  padding: .3rem .1rem 6px;
  background: var(--rule-double) left bottom / 100% 5px no-repeat;
  text-decoration: none;
  transition: gap 0.18s ease, color .18s ease;
}
.btn-view-all:hover, .btn-view-all:focus-visible { gap: 0.75rem; color: var(--theme-600); }
[dir="rtl"] .btn-view-all svg { transform: scaleX(-1); }

.ed-rule { background-color: var(--rule); }
.ed-rule-soft { background-color: var(--rule-soft); }
.ed-grain::before { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: var(--paper-grain); }

.ed-folio { font-family: var(--font-display); color: var(--theme-600); }
[dir="rtl"] .srm-flip-rtl { transform: scaleX(-1); }

/* ── Header ── */
#desktopHeader .hdr-search {
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: 2px;
  box-shadow: inset 0 1px 2px rgba(28, 23, 18, .06);
}
#desktopHeader .hdr-search:focus-within { border-color: var(--theme-500); box-shadow: 0 0 0 3px rgba(var(--theme-500-rgb), .14); }
.ed-search { background: transparent; border: none; }

.hdr-strip, .hdr-strip .ed-status { color: rgba(243, 233, 211, 0.86); }
.hdr-strip .ed-status { font-family: var(--font-label); font-weight: 700; }
.hdr-strip a:hover, .hdr-strip button:hover { color: #f0d896; }

/* The picture rail: a gilt-edged mahogany moulding under the header and
   wherever a section needs an edge */
.srm-band { height: 9px; background: linear-gradient(180deg, #f3dd9c 0 1px, #c9a24e 1px 3px, #6e4f1c 3px 3.5px, #5a2a1c 3.5px 7px, #331610 7px 8px, rgba(28, 23, 18, .15) 8px 9px); }
.srm-band--thin { height: 6px; background: linear-gradient(180deg, #c9a24e 0 2px, #5a2a1c 2px 5px, rgba(28, 23, 18, .15) 5px 6px); }
html.dark .srm-band, html.dark .srm-band--thin { filter: brightness(1.08); }

/* The sale chip in the status strip */
.srm-strip-chip { display: inline-flex; align-items: center; gap: .45rem; color: #f0d896; }
.srm-strip-chip .srm-paddle-ico { width: 10px; height: 15px; }

.ed-subnav { align-items: center; background: var(--paper-2); border-bottom: 1px solid var(--rule); }
.ed-subnav-inner { display: flex; align-items: center; gap: 1.25rem; width: 100%; padding: 0.6rem 2rem; }
@media (min-width: 1280px) { .ed-subnav-inner { padding-left: 2.5rem; padding-right: 2.5rem; } }
.ed-subnav-eyebrow {
  flex-shrink: 0; font-size: 13px;
  color: var(--theme-600); white-space: nowrap;
  padding-right: 1.25rem; border-right: 1px solid var(--rule);
}
[dir="rtl"] .ed-subnav-eyebrow { padding-right: 0; padding-left: 1.25rem; border-right: 0; border-left: 1px solid var(--rule); }
.ed-subnav-items { display: flex; align-items: center; gap: 0.3rem; flex-wrap: wrap; }
.ed-subnav-item {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.42rem 0.85rem; border-radius: 2px;
  font-family: var(--font-label); font-size: 1rem; font-weight: 700; letter-spacing: .03em;
  color: var(--ink-2); text-decoration: none;
  box-shadow: inset 0 -2px 0 transparent;
  transition: box-shadow .18s ease, color .18s ease, background .18s ease;
}
.ed-subnav-item svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; flex-shrink: 0; }
.ed-subnav-item:hover { color: var(--ink); box-shadow: inset 0 -2px 0 var(--gilt-mid); }
.ed-subnav-item.active { background: var(--btn-bg); color: var(--btn-ink); box-shadow: inset 0 0 0 1px rgba(201, 162, 78, .5); }
.ed-subnav-item:focus-visible { outline: 2px solid var(--theme-500); outline-offset: 2px; }

/* ── Links and buttons ── */
.ed-link-arrow {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-family: var(--font-label); font-size: 1.02rem; font-weight: 700; letter-spacing: .03em;
  color: var(--ink); text-decoration: none;
  padding-bottom: 5px; background: var(--rule-double) left bottom / 100% 5px no-repeat;
  transition: gap 0.18s ease;
}
.ed-link-arrow:hover, .ed-link-arrow:focus-visible { gap: 0.7rem; }

/* The main button: ink-black, lettered in small capitals with a gilt
   hairline inside; pressed, it sinks like type into paper */
html .ed-btn-primary, html .ed-plan-cta, html .drawer-login {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.55rem;
  padding: 0.78rem 1.6rem;
  white-space: nowrap;
  font-family: var(--font-label); font-size: 1.08rem; font-weight: 800; letter-spacing: .05em;
  color: var(--btn-ink);
  background: var(--btn-bg);
  border: 0;
  border-radius: 2px;
  box-shadow: var(--btn-shadow);
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
html .ed-btn-primary:hover, html .ed-plan-cta:hover, html .drawer-login:hover,
html .ed-btn-primary:focus-visible, html .ed-plan-cta:focus-visible {
  background: var(--btn-bg-hover); color: var(--btn-ink);
  transform: translateY(-1px); box-shadow: var(--btn-shadow-hover);
}
html .ed-btn-primary:active, html .ed-plan-cta:active, html .drawer-login:active {
  transform: translateY(1px);
  box-shadow: inset 0 0 0 1px rgba(201, 162, 78, .5), inset 0 2px 5px rgba(0, 0, 0, .45), 0 0 0 #9c7630;
}
html.dark .ed-btn-primary, html.dark .ed-btn-primary:hover,
html.dark .ed-plan-cta, html.dark .ed-plan-cta:hover, html.dark button.ed-plan-cta { color: var(--btn-ink); }
html body .ed-plan-featured .ed-plan-cta, html.dark body .ed-plan-featured .ed-plan-cta,
html body .ed-plan-cta, html.dark body .ed-plan-cta {
  background: var(--btn-bg); color: var(--btn-ink); border: 0; box-shadow: var(--btn-shadow);
}
html body .ed-plan-featured .ed-plan-cta, html.dark body .ed-plan-featured .ed-plan-cta { background: #d9b56a; color: #1c1712; box-shadow: 0 2px 0 #8a6526; }
.ed-btn-primary:focus-visible, .ed-btn-secondary:focus-visible, .ed-plan-cta:focus-visible { outline: 2px solid var(--theme-500); outline-offset: 3px; }

/* The second button: an unlined catalogue label, its rule thickening on
   hover the way ink spreads */
.ed-btn-secondary {
  display: inline-flex; align-items: center; gap: 0.55rem;
  padding: 0.74rem 1.35rem;
  font-family: var(--font-label); font-size: 1.06rem; font-weight: 700; letter-spacing: .04em;
  color: var(--ink); background: var(--paper-2);
  border: 1px solid var(--ink); border-radius: 2px;
  box-shadow: inset 0 0 0 0 var(--ink);
  transition: box-shadow 0.18s ease, background .18s ease, transform .15s ease;
}
.ed-btn-secondary:hover, .ed-btn-secondary:focus-visible { box-shadow: inset 0 0 0 2px var(--ink); background: var(--paper); }
.ed-btn-secondary:active { transform: translateY(1px); }
html.dark .ed-btn-secondary { color: var(--ink); border-color: rgba(242, 232, 211, .6); }
:is([data-bnr-layout="cover"], [data-bnr-layout="product"]) .ed-btn-primary { color: var(--btn-ink); }

/* ── Cards: catalogue entries on the sheet, a fine rule round them; on
   hover or focus the picture lamp above comes on ── */
html .ed-plan, html .shop-card {
  position: relative;
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color .2s ease;
}
html .ed-plan:hover, html .shop-card:hover, html .shop-card:focus-within {
  transform: translateY(-3px);
  box-shadow: 0 -14px 26px -18px rgba(255, 210, 130, .9), var(--shadow-md);
}
html .ed-plan-featured {
  position: relative;
  background: var(--damask) repeat left top / 72px 108px, var(--night-bg); color: #f3e9d3;
  border: 0; border-radius: var(--radius);
  box-shadow: inset 0 0 0 3px #c9a24e, inset 0 0 0 4px #6e4f1c, var(--shadow-md);
  overflow: hidden;
}
.ed-plan-hairline { border-color: var(--rule); }
.ed-plan-featured .ed-plan-hairline { border-color: rgba(243, 233, 211, .2); }

/* ── Status text ── */
.ed-status { font-family: var(--font-label); font-size: 13px; font-weight: 700; letter-spacing: 0.04em; color: var(--ink-soft); }
.ed-topnav-link { color: rgba(243, 233, 211, 0.86); text-decoration: none; transition: color 0.16s ease; }
.ed-topnav-link:hover, .ed-topnav-link.active { color: #f0d896; }

/* ── Drawer ── */
.drawer-section-label {
  display: flex; align-items: center; gap: 0.6rem;
  font-size: 13px;
  color: var(--theme-600); padding: 1.1rem 1.5rem 0.4rem;
}
.drawer-section-label::after { content: ''; flex: 1; height: 5px; background: var(--rule-double); opacity: .4; }
.drawer-nav-row {
  display: flex; align-items: center; gap: 0.85rem;
  padding: 0.65rem 1.5rem;
  font-family: var(--font-ui); font-size: 1.02rem; font-weight: 500;
  color: var(--ink-2); text-decoration: none;
}
.drawer-nav-row:hover { background: var(--paper-3); color: var(--ink); }
.drawer-logout, .drawer-login { margin: 1rem 1.5rem 1.25rem; padding: 0.85rem 1rem; }
.drawer-logout {
  display: flex; align-items: center; justify-content: center; gap: 0.5rem;
  border-radius: 2px; font-family: var(--font-label); font-size: 1.02rem; font-weight: 700;
  color: var(--oxblood); border: 1px solid var(--oxblood); text-decoration: none;
}
.drawer-logout:hover { background: var(--red-soft); }

.mobile-glass-header {
  background: rgba(244, 236, 218, 0.96);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--rule);
}
html.dark .mobile-glass-header { background: rgba(21, 17, 13, 0.96); }

.ed-avatar-ring { box-shadow: 0 0 0 2px var(--paper), 0 0 0 4px var(--gilt-mid); }

[x-cloak] { display: none !important; }

.ed-dropdown {
  background: var(--paper-2);
  border: 1px solid var(--rule); border-radius: 3px;
  box-shadow: var(--shadow-md);
  overflow: hidden;
}
.ed-dropdown-item {
  display: flex; align-items: center; gap: 0.85rem;
  padding: 0.68rem 1rem;
  font-family: var(--font-ui); font-size: 1rem; font-weight: 500;
  color: var(--ink-2); text-decoration: none;
}
.ed-dropdown-item:hover { background: var(--paper-3); color: var(--ink); }
.ed-section-cap { font-size: 13px; color: var(--theme-600); padding: 0.9rem 1rem 0.4rem; }

.ed-mobile-link.active { color: var(--nav-accent); }

/* ── Dark/light toggle: going once, going twice, sold ──
   assets/js/salesroom.js registers it. Three catalogue sheets are slapped
   down across the screen in time with three taps of the gavel, the first
   marked "going once", the second "going twice"; the third is stamped
   "sold" in red ink, the mode flips under the stack and the sheets are
   swept off the rostrum. The paper keeps its colours both ways. */
.px-fx--srm-hammer { position: fixed; inset: 0; z-index: 2147483000; pointer-events: none; overflow: hidden; }
.px-fx--srm-hammer .srm-fx-veil { position: absolute; inset: 0; background: #efe5cf; opacity: 0; transition: opacity .14s ease; }
.px-fx--srm-hammer.is-covered .srm-fx-veil { opacity: 1; }
.px-fx--srm-hammer .srm-fx-sheet {
  position: absolute; top: -4%; height: 108%;
  left: calc(var(--i) * 33.3333% - 1.5%); width: 36.5%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.4vmin;
  background:
    linear-gradient(90deg, rgba(28, 23, 18, .1), transparent 7%, transparent 93%, rgba(28, 23, 18, .12)),
    radial-gradient(120% 70% at 50% 30%, #fbf6ea, #efe5cf 70%, #e3d6b8);
  box-shadow: 0 0 0 1px rgba(28, 23, 18, .12), 0 18px 40px -10px rgba(28, 23, 18, .55);
  transform: translate3d(0, -118%, 0) rotate(calc(var(--r) * -3));
  opacity: 0;
  transition: transform .2s cubic-bezier(.55, 0, .9, .4), opacity .05s linear;
}
.px-fx--srm-hammer .srm-fx-sheet::before {
  content: ''; position: absolute; inset: 3.4vmin 2.6vmin;
  border: 2px solid #1c1712; outline: 1px solid #1c1712; outline-offset: 4px;
}
.px-fx--srm-hammer .srm-fx-sheet.is-down { transform: translate3d(0, 0, 0) rotate(var(--r)); opacity: 1; }
.px-fx--srm-hammer.is-rows .srm-fx-sheet {
  left: -4%; width: 108%; top: calc(var(--i) * 33.3333% - 1.5%); height: 36.5%;
}
.px-fx--srm-hammer .srm-fx-lot {
  position: relative; margin: 0;
  font-family: 'Alegreya Sans SC', 'Brygada 1918', Georgia, serif; font-weight: 800;
  font-size: clamp(14px, 2.4vmin, 22px); letter-spacing: .12em; color: #74242a;
}
.px-fx--srm-hammer .srm-fx-num {
  position: relative; margin: 0;
  font-family: 'Brygada 1918', Georgia, serif; font-style: italic; font-weight: 600;
  font-size: clamp(64px, 17vmin, 180px); line-height: .9; color: #1c1712;
}
.px-fx--srm-hammer .srm-fx-call {
  position: relative; margin: 0; padding: 0 1rem; text-align: center;
  font-family: 'Brygada 1918', Georgia, serif; font-style: italic;
  font-size: clamp(16px, 3vmin, 28px); color: #3b3329;
}
/* The stamp on the last sheet, in the empty slot under its numeral
   (beside it when the sheets lie in rows): red ink in a double ring */
.px-fx--srm-hammer .srm-fx-stamp {
  position: absolute; left: 83.4%; top: 65.5%; z-index: 2;
  padding: .3em .7em .28em;
  font-family: 'Alegreya Sans SC', 'Brygada 1918', Georgia, serif; font-weight: 800;
  font-size: clamp(34px, 8vmin, 84px); letter-spacing: .08em; line-height: 1; white-space: nowrap;
  color: #b0272c; border: .09em solid #b0272c; border-radius: .14em;
  box-shadow: inset 0 0 0 .05em #efe5cf, inset 0 0 0 .09em #b0272c;
  transform: translate(-50%, -50%) rotate(-14deg) scale(2.4); opacity: 0;
  transition: transform .14s cubic-bezier(.6, 0, .9, .5), opacity .1s linear;
  mix-blend-mode: multiply;
}
.px-fx--srm-hammer.is-rows .srm-fx-stamp { left: 25%; top: 83.4%; font-size: clamp(28px, 8vmin, 60px); }
.px-fx--srm-hammer.is-sold .srm-fx-stamp { transform: translate(-50%, -50%) rotate(-14deg) scale(1); opacity: .92; }
/* The gavel, striking from the foot of the screen on each sheet */
.px-fx--srm-hammer .srm-fx-gavel {
  position: absolute; z-index: 3; inset-inline-end: 4vmin; bottom: 3vmin;
  width: min(34vmin, 260px); height: min(34vmin, 260px);
  filter: drop-shadow(0 14px 18px rgba(28, 23, 18, .45));
  opacity: 0; transition: opacity .12s ease;
}
[dir="rtl"] .px-fx--srm-hammer .srm-fx-gavel { transform: scaleX(-1); }
.px-fx--srm-hammer.is-on .srm-fx-gavel { opacity: 1; }
.px-fx--srm-hammer .srm-fx-gavel svg { width: 100%; height: 100%; overflow: visible; }
.px-fx--srm-hammer .srm-fx-head { transform-origin: 178px 139px; transform: rotate(24deg); }
.px-fx--srm-hammer .srm-fx-gavel.is-tap .srm-fx-head { animation: srm-fx-strike .2s cubic-bezier(.5, 0, .6, 1); }
@keyframes srm-fx-strike { 0% { transform: rotate(24deg); } 50% { transform: rotate(0deg); } 100% { transform: rotate(24deg); } }
.px-fx--srm-hammer.is-away .srm-fx-sheet {
  transform: translate3d(calc(var(--r) * 40vw), 120%, 0) rotate(calc(var(--r) * 9));
  transition: transform .52s cubic-bezier(.5, 0, .8, .3); transition-delay: calc(var(--i) * .06s);
}
.px-fx--srm-hammer.is-away .srm-fx-stamp { opacity: 0; transition: opacity .2s ease; }
.px-fx--srm-hammer.is-away .srm-fx-veil { opacity: 0; transition: opacity .42s ease .12s; }
.px-fx--srm-hammer.is-away .srm-fx-gavel { opacity: 0; transition: opacity .25s ease; }

/* ── Footer: the room's wainscot. A carved dado rail with the gavel at
   rest on its block, and below it mahogany panelling in gilt beading. ── */
.srm-footer {
  --paper:     #2a140d;
  --paper-2:   #351a11;
  --paper-3:   #42231a;
  --ink:       #f3e9d3;
  --ink-2:     #e4d6ba;
  --ink-soft:  #bfae90;
  --rule:      rgba(243, 233, 211, 0.16);
  --rule-soft: rgba(243, 233, 211, 0.08);
  --theme-500: #e3c27e; --theme-600: #e3c27e; --theme-700: #f0d896;
  --theme-500-rgb: 227, 194, 126;
  position: relative;
}
html.dark .srm-footer { --paper: #1b0d08; --paper-2: #26130c; --paper-3: #331a11; }
html body #desktopFooter.srm-footer {
  background:
    radial-gradient(900px 260px at 50% 0%, rgba(255, 210, 140, .12), transparent 70%),
    repeating-linear-gradient(90deg, transparent 0 236px, rgba(0, 0, 0, .22) 236px 238px, rgba(201, 162, 78, .22) 238px 239px, transparent 239px 240px),
    repeating-linear-gradient(178deg, rgba(255, 255, 255, .018) 0 3px, rgba(0, 0, 0, .025) 3px 7px),
    var(--paper) !important;
}
.srm-footer-top { position: relative; height: 64px; margin-bottom: -1px; pointer-events: none; }
/* The dado rail: a moulded profile in mahogany with a gilt bead */
.srm-footer-rail {
  position: absolute; left: 0; right: 0; bottom: 0; height: 26px;
  background: linear-gradient(180deg,
    #7c3c26 0 3px, #9a5634 3px 5px, #5a2a1c 5px 9px,
    #f3dd9c 9px 10px, #c9a24e 10px 13px, #6e4f1c 13px 14px,
    #4a2216 14px 20px, #331610 20px 24px, #2a140d 24px);
  box-shadow: 0 -6px 12px -6px rgba(28, 23, 18, .4);
}
html.dark .srm-footer-rail { filter: brightness(.85); }
/* The gavel resting on its sound block on the rail, in the end corner */
.srm-footer-gavel {
  position: absolute; inset-inline-end: 7%; bottom: 20px; z-index: 2;
  width: 132px; height: 62px;
  background: var(--srm-gavel-rest) center bottom / contain no-repeat;
}
[dir="rtl"] .srm-footer-gavel { transform: scaleX(-1); }
.srm-footer a:hover { color: #f0d896; }
html .srm-footer .ed-footer-heading { font-family: var(--font-label); font-weight: 800; font-size: 1.12rem; letter-spacing: .05em; text-transform: none; color: #f0d896; }
html.dark #desktopFooter li { color: var(--ink-2) !important; }
/* header.css greys every footer h4 after dark with an ID rule */
html.dark #desktopFooter .ed-footer-heading { color: #f0d896 !important; }
html.dark #desktopFooter .ed-newsletter h4 { color: #1c1712 !important; }

html .ed-floating-nav {
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: 3px;
  box-shadow: inset 0 0 0 3px var(--paper-2), inset 0 0 0 4px rgba(201, 162, 78, .55), var(--shadow-md);
}
html .ed-floating-nav .ed-floating-link { font-family: var(--font-label); font-size: 1.02rem; font-weight: 700; letter-spacing: .03em; color: var(--ink-2); border-radius: 2px; }
html .ed-floating-nav .ed-floating-link:hover { background: var(--paper-3); color: var(--ink); }
html body .ed-floating-nav a.ed-floating-link.active { background: var(--btn-bg); color: var(--btn-ink) !important; }
html body .ed-floating-nav a.ed-floating-link.active > span { color: var(--btn-ink) !important; }

/* The newsletter as the catalogue's subscription slip: deckled cream
   paper in a double rule, a bidding paddle at its corner */
html body .srm-footer .ed-newsletter {
  position: relative;
  background: var(--paper-grain), linear-gradient(180deg, #fbf6ea, #f1e7d1);
  color: #1c1712;
  border: 0; border-radius: 0;
  box-shadow: none;
  filter: drop-shadow(0 16px 22px rgba(0, 0, 0, .45));
  -webkit-mask: var(--deckle-mask); mask: var(--deckle-mask);
  padding-top: 2.6rem; padding-bottom: 2.4rem;
}
html body .srm-footer .ed-newsletter::before {
  content: ''; position: absolute; inset: 14px; pointer-events: none;
  border: 2px solid #1c1712; outline: 1px solid #1c1712; outline-offset: 3px;
  width: auto; height: auto; border-radius: 0; opacity: 1; background: none; filter: none; transform: none;
}
html body .srm-footer .ed-newsletter::after { content: none; }
html body .srm-footer .ed-newsletter, html body .srm-footer .ed-newsletter * { --ink: #1c1712; --ink-2: #3b3329; }
html body .srm-footer .ed-newsletter h4, html.dark body .srm-footer .ed-newsletter h4 { color: #1c1712 !important; font-family: var(--font-display); font-weight: 500; position: relative; }
html body .srm-footer .ed-newsletter > div { padding-inline-end: 3.4rem; }
html.dark body .srm-footer .ed-newsletter p:not(#newsletter-msg) { color: #3b3329 !important; }
html body .srm-footer .ed-newsletter-input, html.dark body .srm-footer .ed-newsletter input[type="email"].ed-newsletter-input:not(.no-dark):not([type="checkbox"]) { background: #fffdf6 !important; color: #1c1712 !important; border: 1px solid rgba(28, 23, 18, .35) !important; border-radius: 2px; font-family: var(--font-ui); }
html body .srm-footer .ed-newsletter-input::placeholder { color: #6c6150; }
html body .srm-footer .ed-newsletter-input:focus { border-color: #74242a !important; box-shadow: 0 0 0 3px rgba(116, 36, 42, .16); }
html body .srm-footer .ed-newsletter-btn {
  background: #1c1712; color: #f7efdc; border: 0; border-radius: 2px;
  font-family: var(--font-label); font-weight: 800; letter-spacing: .05em; box-shadow: inset 0 0 0 1px rgba(201, 162, 78, .5), 0 2px 0 #9c7630;
}
html body .srm-footer .ed-newsletter-age { color: #3b3329; }

/* Logo plate: the light-mode logo on a cream card in a carved gilt
   frame, wherever it sits on mahogany or the evening wall (footer, app
   splash) */
.srm-plaque {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 1rem 1.6rem;
  background: #fbf6ea;
  border-radius: 1px;
  box-shadow: 0 0 0 2px #6e4f1c, 0 0 0 7px #c9a24e, 0 0 0 8px #f3dd9c, 0 0 0 10px #7a5a20, 0 16px 28px -10px rgba(0, 0, 0, .65);
}
.srm-plaque::before {
  content: ''; position: absolute; inset: 5px; pointer-events: none;
  border: 1px solid rgba(28, 23, 18, .3);
}

/* Long titles and descriptions show in full; a card grows instead of
   clipping them. */
html [class*="line-clamp-"] { -webkit-line-clamp: unset; }
html body .truncate { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
/* .text-fit (assets/css/header.css) shrinks a title to one line with JS,
   measured before the display face loads; under this theme it wraps. */
html body .text-fit { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
/* On phones a heading never splits mid-word; only a word wider than the
   whole column may still break. */
@media (max-width: 639px) {
  html body :is(.text-fit, :is(h1, h2, h3).truncate) { overflow-wrap: break-word; word-break: normal; hyphens: manual; }
  /* the auction page's "similar auctions" link ("Andere Auktionen durchstöbern") drops under its heading */
  html body div.flex.justify-between:has(> a.ed-link-arrow.whitespace-nowrap) { flex-wrap: wrap; row-gap: .75rem; }
}

/* ── Dark-mode greys from assets/css/header.css ──
   header.css forces a neutral near-black palette onto Tailwind's light
   utilities with !important; these follow the theme's own surfaces. */
html.dark body { background-color: var(--paper) !important; }
html.dark .mobile-glass-header { background: rgba(21, 17, 13, 0.96) !important; border-bottom-color: var(--rule) !important; }
html.dark .floating-nav-shell,
html.dark .safe-area-bottom > div.mobile-bottom-nav { background: rgba(30, 25, 19, 0.97) !important; }
html.dark .premium-side-menu { background: var(--paper) !important; }
html.dark #langSheet { background: var(--paper-2) !important; border-top-color: var(--rule) !important; }
html.dark .premium-profile-header { background: var(--paper-2) !important; }
html.dark .premium-dropdown,
html.dark #mobileExploreSheet .bg-white,
html.dark #logoutModal .bg-white,
html.dark .bg-white,
html.dark [x-data] .bg-white,
html.dark .bg-white.shadow-xl,
html.dark .bg-slate-50,
html.dark .bg-slate-100,
html.dark .odd\:bg-white:nth-child(odd) { background-color: var(--paper-2) !important; }
html.dark .bg-gray-50,
html.dark .even\:bg-gray-50:nth-child(even) { background-color: var(--paper) !important; }
html.dark .bg-gray-100,
html.dark #mobileExploreSheet .bg-gray-100,
html.dark thead { background-color: var(--paper-3) !important; }
html.dark .from-white, html.dark .from-gray-50 { --tw-gradient-from: var(--paper) !important; }
html.dark .to-white, html.dark .to-gray-50 { --tw-gradient-to: var(--paper) !important; }
html.dark .via-white, html.dark .via-gray-50 { --tw-gradient-via: var(--paper-2) !important; }
html.dark .from-gray-100 { --tw-gradient-from: var(--paper-2) !important; }
html.dark .to-gray-100 { --tw-gradient-to: var(--paper-2) !important; }
html.dark .search-input,
html.dark select:not(.no-dark) { background-color: var(--paper-2) !important; }
html.dark .gradient-bg { background: linear-gradient(-45deg, #29221a, #15110d, #1e1913, #0c0a07) !important; }
html.dark [class*="dark:bg-[#121218]"], html.dark [class*="dark:bg-[#0"] { background-color: var(--paper-2) !important; }

/* header.css fills every dark-mode field with a navy #0d1117; here fields
   take the evening sale's own dark. Same selector shape so it outranks it. */
html.dark input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not(.no-dark),
html.dark textarea:not(.no-dark),
html.dark select:not(.no-dark) {
  background-color: #0e0b08 !important;
  border-color: rgba(242, 232, 211, .2) !important;
  color: #f2e8d3 !important;
}

/* Inverted panels: shared markup paints some panels with background
   var(--ink) and letters them in var(--paper), which only works while ink
   is dark. After dark those panels take the deepest night. */
html.dark [style*="background: var(--ink)"],
html.dark [style*="background:var(--ink)"],
html.dark [style*="background-color: var(--ink)"],
html.dark [style*="background-color:var(--ink)"] {
  --ink: #0c0a07;
  --paper: #f2e8d3;
  border-color: rgba(217, 181, 106, .3);
}

html header.safe-top-header[style] { background: rgba(244, 236, 218, .96) !important; }
html.dark header.safe-top-header[style] { background: rgba(21, 17, 13, .96) !important; }
/* The winners page's tab bar, near-black in assets/css/pages/winners.css */
html.dark .wn-tab-bar { background: rgba(21, 17, 13, .96); }

/* ── Login / register / forgot-password brand panel: the wall at the
   evening sale, a picture rail along its top and a pair of paddles in
   its corner ── */
:root, html.dark {
  --brand-gradient: var(--night-bg);
  --brand-glow-1: rgba(255, 214, 150, 0.22);
  --brand-glow-2: rgba(140, 50, 54, 0.24);
}
.brand-panel { background: var(--damask) repeat left top / 72px 108px, var(--night-bg) !important; }
/* assets/css/pages/login.css loads after the theme and draws ::after as a
   round glow; here it is a pair of bidding paddles. */
html .brand-panel::after {
  content: ''; position: absolute;
  top: 70px !important; right: 8% !important; left: auto !important; bottom: auto !important;
  width: 120px !important; height: 150px !important;
  border-radius: 0 !important; opacity: 1 !important; filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .45)) !important; transform: rotate(4deg) !important;
  background: var(--srm-paddles) center / contain no-repeat !important;
  box-shadow: none !important;
}
[dir="rtl"] .brand-panel::after { right: auto !important; left: 8% !important; }
/* login.css's other glow becomes the picture rail along the top */
html .brand-panel::before {
  top: 0 !important; left: 0 !important; right: 0 !important; width: auto !important; height: 9px !important;
  border-radius: 0 !important; opacity: 1 !important; filter: none !important; transform: none !important;
  background: linear-gradient(180deg, #f3dd9c 0 1px, #c9a24e 1px 3px, #6e4f1c 3px 3.5px, #5a2a1c 3.5px 7px, #331610 7px 8px, rgba(0, 0, 0, .3) 8px 9px) !important;
}
.brand-panel .text-purple-200,
.brand-panel [class*="text-purple-200"] { color: rgba(243, 233, 211, 0.84) !important; }
.brand-panel h2 { font-family: var(--font-display); font-weight: 500 !important; }

/* ── Wallet: the bidder registration card (components/wallet/
   hero-balance.php). Heavy cream card stock in a gilt double rule, the
   bidder's own paddle standing at its end. ── */
html body .wallet-hero {
  position: relative;
  background: var(--paper-grain), linear-gradient(170deg, #fdf9ef, #f1e6cd);
  border: 0;
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgba(28, 23, 18, .14), 0 22px 40px -22px rgba(28, 23, 18, .6);
  color: #1c1712;
  overflow: hidden;
}
html.dark body .wallet-hero {
  background: var(--damask) repeat left top / 72px 108px, radial-gradient(70% 90% at 85% 0%, rgba(255, 214, 150, .14), transparent 70%), linear-gradient(170deg, #1f4436, #10291f);
  color: #f3e9d3;
  box-shadow: 0 0 0 1px rgba(217, 181, 106, .4), 0 0 46px -16px rgba(255, 214, 150, .3);
}
html body .wallet-hero::before {
  content: ''; position: absolute; inset: 12px; pointer-events: none;
  border: 2px solid var(--gilt-mid); outline: 1px solid var(--gilt-mid); outline-offset: 3px;
  width: auto; height: auto; border-radius: 0; transform: none; opacity: 1; background: none;
}
html body .wallet-hero::after { content: none; }
html body .wallet-hero > * { position: relative; z-index: 1; }
html body .wallet-balance-num {
  font-family: var(--font-display); font-variation-settings: normal; font-weight: 600; letter-spacing: -.01em;
  color: inherit; overflow-wrap: normal; font-variant-numeric: lining-nums tabular-nums;
}
html body .wallet-hero-btn-primary {
  background: var(--btn-bg); color: var(--btn-ink); border: 0; border-radius: 2px;
  font-family: var(--font-label); font-weight: 800; letter-spacing: .05em; box-shadow: var(--btn-shadow);
}
html body .wallet-hero-btn-primary:hover { background: var(--btn-bg-hover); color: var(--btn-ink); }
html body .wallet-hero-btn-secondary { font-family: var(--font-label); font-weight: 700; letter-spacing: .04em; color: inherit; border: 1px solid currentColor; border-radius: 2px; background: transparent; }
html body .wallet-hero-btn-primary, html body .wallet-hero-btn-secondary { white-space: nowrap; }
@media (max-width: 420px) {
  html body .wallet-hero-btn-primary, html body .wallet-hero-btn-secondary { padding: .55rem .95rem; font-size: .9rem; gap: .375rem; }
}

/* ── Sealed-lot card (styled by assets/css/pages/home.css): a sealed
   lot, the picture rail across its top ── */
html .ed-card-mystery {
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  overflow: hidden;
}
html .ed-card-mystery:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
html .ed-card-mystery::before {
  top: 0; left: 0; right: 0; bottom: auto; width: auto; height: 6px; border-radius: 0;
  background: linear-gradient(180deg, #c9a24e 0 2px, #5a2a1c 2px 5px, rgba(28, 23, 18, .15) 5px 6px); opacity: 1; z-index: 2;
}
html .ed-card-mystery img { position: relative; z-index: 1; }

/* ── Product page buy box: the lot's catalogue entry, a double rule
   along its top ── */
html body .pd-buybox {
  position: relative;
  background: var(--paper-2);
  border: 1px solid var(--rule);
  border-radius: 4px;
  box-shadow: var(--shadow-md);
  overflow: hidden;
}
html body .pd-buybox::before {
  content: ''; position: absolute; left: 18px; right: 18px; top: 12px; height: 5px;
  background: var(--rule-double);
}
html body .pd-buybox .font-display.text-4xl { font-family: var(--font-display); font-weight: 600; color: var(--theme-600); overflow-wrap: normal; font-variant-numeric: lining-nums; }
.pd-title { font-weight: 500 !important; }

/* The sealed-lot card's own button is ink on paper and dynamic-theme's
   ".dark button" turns its label the colour of its fill; readable here on
   plugin releases without their own fix. */
html.dark button.spin-btn:not(:disabled) { color: var(--btn-ink); }

/* Shared markup's stock purple, indigo and blue accents (coupon buttons,
   tier chips, focus rings) take the theme's oxblood. */
html .bg-purple-600, html .bg-indigo-600, html .bg-violet-600 { background-color: var(--theme-500); }
html .hover\:bg-purple-700:hover, html .hover\:bg-indigo-700:hover, html .hover\:bg-violet-700:hover { background-color: var(--theme-600); }
html .text-purple-500, html .text-purple-600, html .text-indigo-500, html .text-indigo-600, html .text-violet-600 { color: var(--theme-600); }
/* Solid purple action buttons (coupon Apply and the like) sit beside a
   field and take the colour of the main buttons. */
html .bg-purple-600.text-white, html .bg-indigo-600.text-white, html .bg-violet-600.text-white {
  background-color: var(--btn-bg) !important; color: var(--btn-ink) !important; border-radius: 2px;
}
html .bg-purple-50, html .bg-indigo-50, html .bg-violet-50, html .bg-purple-100 { background-color: var(--gold-soft); }
html.dark .bg-purple-50, html.dark .bg-indigo-50, html.dark .bg-violet-50 { background-color: var(--gold-soft) !important; }
html .border-purple-200, html .border-indigo-200, html .border-violet-200 { border-color: rgba(140, 50, 54, .3); }
html.dark .border-violet-200 { border-color: rgba(217, 181, 106, .35) !important; }
html .focus\:ring-purple-400:focus { --tw-ring-color: rgba(140, 50, 54, .35); }
html .focus\:border-purple-400:focus { border-color: var(--theme-500); }

/* Shared buttons drawn in the accent with white lettering (Place Order,
   Buy Now bars) are the theme's main buttons. */
html .bg-theme-600.text-white, html .bg-theme-500.text-white,
html .bg-blue-600.text-white, html .bg-blue-500.text-white {
  background: var(--btn-bg) !important;
  color: var(--btn-ink) !important;
  box-shadow: var(--btn-shadow) !important;
}
html .bg-theme-600.text-white:hover, html .bg-theme-500.text-white:hover { background: var(--btn-bg-hover) !important; }
html .bg-theme-600.text-white [class*="border-white"] { border-color: rgba(255, 255, 255, .3); border-top-color: var(--btn-ink); }

/* The game arena's Play button letters itself in white on the accent;
   after dark the accent is gilt, so it takes the button ink. */
html.dark .arena-play { color: var(--btn-ink); text-shadow: none; }
html.dark .arena-play .pic { background: rgba(21, 17, 13, .12); }
html.dark .arena-play .cost { border-left-color: rgba(21, 17, 13, .3); }

/* ── Winners page cards ── */
html .wnc { border-radius: var(--radius); background: var(--paper-2); border: 1px solid var(--rule); box-shadow: var(--shadow); }
html .wnc:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }

/* ── Cart and checkout: the order total on a cream sheet ruled like a
   saleroom invoice. Picked out by what the panels contain, so no copies
   of their markup (or their Alpine hooks) live in the theme. ── */
html [id^="cart-row-"] { background: var(--paper-2) !important; border: 1px solid var(--rule) !important; border-radius: 4px !important; }
html .rounded-2xl:has(> div > div > #summary-total),
html section.rounded-2xl:has([x-text="totalDisplay()"]) {
  position: relative;
  background: var(--paper-grain), var(--paper-2) !important;
  border: 1px solid var(--rule) !important;
  border-radius: 4px !important;
  box-shadow: var(--shadow-md) !important;
  overflow: hidden;
  padding-top: 1.8rem !important;
}
html .rounded-2xl:has(> div > div > #summary-total)::before,
html section.rounded-2xl:has([x-text="totalDisplay()"])::before {
  content: ''; position: absolute; left: 18px; right: 18px; top: 12px; height: 5px;
  background: var(--rule-double);
}
html .rounded-2xl:has(> div > div > #summary-total) > div,
html section.rounded-2xl:has([x-text="totalDisplay()"]) > div { border-style: dashed !important; }
html #summary-total,
html section.rounded-2xl [x-text="totalDisplay()"] {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.75rem;
  color: var(--theme-600);
  overflow-wrap: normal;
}

/* The status strip holds one line, never wrapping inside its 32px. */
.hdr-strip .ed-status, .hdr-strip .ed-status * { white-space: nowrap; }
.hdr-strip .ed-status { font-size: 13px; letter-spacing: .04em; }
@media (max-width: 1023px) { .hdr-strip .srm-strip-chip { font-size: 12px; gap: .35rem; } }
/* Small phones: the dark-mode switch and the App chip in the header drop
   their words and keep their icons. */
@media (max-width: 419px) {
  html .hdr-strip .dark-mode-toggle span { display: none; }
  html .mobile-glass-header .pwa-chip__label { display: none; }
  html .mobile-glass-header .pwa-chip { padding: 0 .6rem; }
}

/* The hero's scene is drawn by components/home/hero.css, which arrives
   after this sheet; until it does, the bare SVGs would paint at their
   natural size, so the scene waits out of sight. */
.srm-hero__scene { visibility: hidden; max-height: 0; overflow: hidden; }

/* ── The room's materials ──
   Every surface beyond the hero and footer is built from these, so a
   panel anywhere in the shop reads as the salesroom at a glance:
   - catalogue paper (--paper-grain, --deckle-mask) with letterpress
     double rules (--rule-double) and small-capital labels (.srm-sc);
   - carved gilt frames (--frame-gilt) round pictures and the chosen
     option, with a thin gilt slip (--frame-slip) for small ones;
   - the damask wall (--damask on --wall) behind night panels;
   - bidding paddles (--srm-paddle, --srm-paddles) for bids and
     registration, the gavel at rest (--srm-gavel-rest) for confirmations;
   - the manila reserve tag (--srm-tag-art, --srm-tag-shape) for badges
     and chips; the red "Sold" stamp (.srm-stamp) for anything closed;
   - the room's five colours (--srm-c1 heritage green, --srm-c2 oxblood,
     --srm-c3 gilt, --srm-c4 prussian blue, --srm-c5 aubergine) for icon
     plates and rotating accents, each with an ink and a soft wash. */
:root {
  --srm-c1: #1d4a3a; --srm-c2: #8c3236; --srm-c3: #a7802f; --srm-c4: #1f3f5c; --srm-c5: #5a2f4a;
  --srm-green-ink: #173d30; --srm-oxblood-ink: #6e2228; --srm-gilt-ink: #6e4f1c; --srm-prussian-ink: #1b3550; --srm-aubergine-ink: #4a2440;
  --srm-green-soft: rgba(29, 74, 58, .09); --srm-oxblood-soft: rgba(140, 50, 54, .08); --srm-gilt-soft: rgba(180, 138, 60, .13); --srm-prussian-soft: rgba(31, 63, 92, .09); --srm-aubergine-soft: rgba(90, 47, 74, .09);

  /* A carved gilt frame as layered rings, and its inner shadow */
  --frame-gilt: 0 0 0 1px #4a3412, 0 0 0 3px #8a6526, 0 0 0 6px #d4ae5c, 0 0 0 7px #f3dd9c, 0 0 0 9px #b48a3c, 0 0 0 10px #5c4216, 0 14px 22px -8px rgba(28, 23, 18, .55);
  --frame-inner: inset 0 0 0 1px rgba(255, 240, 200, .55), inset 0 2px 8px rgba(28, 23, 18, .35);
  --frame-slip: 0 0 0 1px #8a6526, 0 0 0 3px #d4ae5c, 0 0 0 4px #7a5a20;

  /* The reserve tag's outline as a clip-path (an eyelet on its narrow end) */
  --srm-tag-shape: polygon(9px 0, 100% 0, 100% 100%, 9px 100%, 0 70%, 0 30%);
  --srm-tag-shape-rtl: polygon(0 0, calc(100% - 9px) 0, 100% 30%, 100% 70%, calc(100% - 9px) 100%, 0 100%);
  --srm-tag-art: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 46 34'><path d='M3 2C6 6 8 9 11 14' fill='none' stroke='%237a5a20' stroke-width='1.2'/><path d='M8 13L16 5H43V31H16Z' fill='%23ead6a6' stroke='%23a98a4e' stroke-width='1.2' stroke-linejoin='round'/><circle cx='14.6' cy='17' r='2.6' fill='%23fbf6ea' stroke='%23b48a3c' stroke-width='1.4'/><path d='M21 12H38M21 17H34' stroke='%231c1712' stroke-opacity='.45' stroke-width='1.3' stroke-linecap='round'/><path d='M21 24H30' stroke='%2374242a' stroke-width='3' stroke-linecap='round'/></svg>");
  /* A bidding paddle with a star on its head, 54×82 */
  --srm-paddle: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54 82'><rect x='23' y='44' width='8' height='37' rx='3' fill='%235a2a1c'/><rect x='24.5' y='46' width='2' height='33' rx='1' fill='%237c3c26'/><rect x='21' y='44' width='12' height='5' rx='1.6' fill='%23c9a24e'/><circle cx='27' cy='25' r='24' fill='%23fbf6ea' stroke='%23c9a24e' stroke-width='2.4'/><circle cx='27' cy='25' r='19.5' fill='none' stroke='%231c1712' stroke-width='1'/><path d='M27 14.5L29.6 21.4L37 21.8L31.2 26.4L33.2 33.5L27 29.4L20.8 33.5L22.8 26.4L17 21.8L24.4 21.4Z' fill='%231c1712'/></svg>");
  /* Old name, still read by the Auction plugin bid toast. */
  --srm-paddle-27: var(--srm-paddle);
  /* Two paddles raised together */
  --srm-paddles: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 150'><g transform='rotate(-12 40 120)'><rect x='35' y='62' width='10' height='84' rx='4' fill='%235a2a1c'/><rect x='32' y='62' width='16' height='6' rx='2' fill='%23c9a24e'/><circle cx='40' cy='36' r='30' fill='%23fbf6ea' stroke='%23c9a24e' stroke-width='3'/><circle cx='40' cy='36' r='24.5' fill='none' stroke='%231c1712' stroke-width='1.2'/><path d='M40 23L43.2 31.6L52.4 32L45.1 37.7L47.6 46.5L40 41.4L32.4 46.5L34.9 37.7L27.6 32L36.8 31.6Z' fill='%231c1712'/></g><g transform='rotate(10 84 128)'><rect x='79' y='70' width='10' height='78' rx='4' fill='%237c3c26'/><rect x='76' y='70' width='16' height='6' rx='2' fill='%23c9a24e'/><circle cx='84' cy='44' r='30' fill='%2374242a' stroke='%23c9a24e' stroke-width='3'/><circle cx='84' cy='44' r='24.5' fill='none' stroke='%23f3dd9c' stroke-width='1.2'/><path d='M84 31L87.2 39.6L96.4 40L89.1 45.7L91.6 54.5L84 49.4L76.4 54.5L78.9 45.7L71.6 40L80.8 39.6Z' fill='%23fbf6ea'/></g></svg>");
  /* The gavel lying on its sound block, 132×62 */
  --srm-gavel-rest: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 132 62'><ellipse cx='54' cy='58' rx='50' ry='4' fill='%23000' fill-opacity='.28'/><path d='M14 44H94L90 56H18Z' fill='%23331610'/><rect x='12' y='38' width='84' height='8' rx='3' fill='%237c3c26'/><rect x='16' y='40' width='76' height='1.6' rx='.8' fill='%23c9a24e'/><g transform='rotate(-8 60 26)'><rect x='56' y='25' width='74' height='6' rx='3' fill='%235a2a1c'/><rect x='58' y='26' width='70' height='1.4' rx='.7' fill='%239a5634'/><rect x='28' y='12' width='34' height='26' rx='5' fill='%235a2a1c'/><rect x='30' y='13' width='30' height='4' rx='2' fill='%239a5634'/><rect x='35' y='12' width='4' height='26' fill='%23c9a24e'/><rect x='51' y='12' width='4' height='26' fill='%23c9a24e'/></g></svg>");
  /* A tick written on a little manila tag */
  --srm-tick: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 3H22V21H7L2 15V9Z' fill='%23ead6a6' stroke='%23a98a4e' stroke-width='1.2' stroke-linejoin='round'/><circle cx='6.6' cy='12' r='1.5' fill='%23fbf6ea' stroke='%23b48a3c'/><path d='M10.5 12.4L13.2 15L18.5 8.8' fill='none' stroke='%2374242a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / contain no-repeat;
  /* A lot-number marker as a mask (a paddle head), for list bullets */
  --paddle-mask-img: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 22'><circle cx='8' cy='7' r='7'/><rect x='6.6' y='12' width='2.8' height='10' rx='1.2'/></svg>");
  --paddle-mask: var(--paddle-mask-img) center / contain no-repeat;
  /* Brass picture lamp, for the top of a card or panel */
  --srm-lamp-art: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 30'><rect x='56' y='0' width='8' height='6' rx='1.5' fill='%237a5a20'/><path d='M60 6V12' stroke='%23b48a3c' stroke-width='3'/><path d='M10 12H110L102 22H18Z' fill='%23c9a24e'/><path d='M14 13H106' stroke='%23f3dd9c' stroke-width='2'/><path d='M18 22H102' stroke='%236e4f1c' stroke-width='2'/></svg>");
}
html.dark {
  --srm-c1: #8cc7ad; --srm-c2: #e07c7a; --srm-c3: #e3c27e; --srm-c4: #9cc0e0; --srm-c5: #d5a3c4;
  --srm-green-ink: #9fd6bd; --srm-oxblood-ink: #f0928f; --srm-gilt-ink: #f0d896; --srm-prussian-ink: #b4d2ee; --srm-aubergine-ink: #e3b8d4;
  --srm-green-soft: rgba(140, 199, 173, .1); --srm-oxblood-soft: rgba(224, 124, 122, .12); --srm-gilt-soft: rgba(217, 181, 106, .12); --srm-prussian-soft: rgba(156, 192, 224, .1); --srm-aubergine-soft: rgba(213, 163, 196, .1);
  --frame-gilt: 0 0 0 1px #4a3412, 0 0 0 3px #a07a32, 0 0 0 6px #e2bd6c, 0 0 0 7px #fbe7b0, 0 0 0 9px #c9a24e, 0 0 0 10px #5c4216, 0 0 30px -4px rgba(255, 210, 140, .3);
  --frame-slip: 0 0 0 1px #a07a32, 0 0 0 3px #e2bd6c, 0 0 0 4px #8a6526;
}

/* A lot number in small capitals over a double rule: "Lot 12" */
.srm-lotno {
  display: inline-block;
  font-family: var(--font-label); font-weight: 800; letter-spacing: .06em; font-size: 13px; line-height: 1.2;
  color: var(--theme-600);
  padding-bottom: 5px; background: var(--rule-double) left bottom / 100% 5px no-repeat;
}
/* The red "Sold" stamp: ink in a double ring, struck at an angle */
.srm-stamp {
  display: inline-block;
  padding: .2em .55em .16em;
  font-family: var(--font-label); font-weight: 800; font-size: 1rem; letter-spacing: .08em; line-height: 1; white-space: nowrap;
  color: var(--stamp); border: 2px solid var(--stamp); border-radius: 4px;
  box-shadow: inset 0 0 0 2px var(--paper-2), inset 0 0 0 3px var(--stamp);
  transform: rotate(-10deg);
  opacity: .9;
}
/* The reserve tag as a chip: manila, its eyelet punched at the narrow end */
.srm-tagchip {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .2rem .65rem .2rem 1.05rem;
  font-family: var(--font-label); font-weight: 700; font-size: 13px; letter-spacing: .04em; line-height: 1.2;
  color: #1c1712;
  background: radial-gradient(circle at 6px 50%, var(--paper-2) 0 2.2px, #a98a4e 2.6px 3.2px, transparent 3.6px), var(--manila);
  clip-path: var(--srm-tag-shape);
}
[dir="rtl"] .srm-tagchip { padding: .2rem 1.05rem .2rem .65rem; background: radial-gradient(circle at calc(100% - 6px) 50%, var(--paper-2) 0 2.2px, #a98a4e 2.6px 3.2px, transparent 3.6px), var(--manila); clip-path: var(--srm-tag-shape-rtl); }

/* ── Game palette (the earn-games arena posts these into each game) ──
   By day a cream catalogue board in a green-baize well, its pieces
   rising from cream through manila and gilt to oxblood and the wall's
   green; after dark the evening sale, the pieces lit warm. */
:root {
  --game-bg: #f4ecda;
  --game-surface: #e4dcc4;
  --game-surface-2: #fbf6ea;
  --game-ink: #1c1712;
  --game-muted: #6c6150;
  --game-accent: #74242a;
  --game-accent-ink: #ffffff;
  --game-good: #1d4a3a;
  --game-bad: #b0272c;
  --game-tile-1: #fbf6ea;
  --game-tile-2: #ead6a6;
  --game-tile-3: #d9b56a;
  --game-tile-4: #b48a3c;
  --game-tile-5: #c97a77;
  --game-tile-6: #8c3236;
  --game-tile-7: #2c624d;
  --game-tile-8: #1d4a3a;
  --game-radius: 3px;
  --game-font: 'Brygada 1918', Georgia, serif;
  --game-font-css: "/assets/themes/salesroom/assets/fonts/fonts.css";
  --game-pattern: var(--paper-grain);
  --game-arena-screen: #f4ecda;
  --game-arena-coins: #6e4f1c;
  --game-arena-win: #1d4a3a;
  --game-arena-danger: #b0272c;
}
html.dark {
  --game-bg: #15110d;
  --game-surface: #1e1913;
  --game-surface-2: #29221a;
  --game-ink: #f2e8d3;
  --game-muted: #a99c84;
  --game-accent: #d9b56a;
  --game-accent-ink: #1c1712;
  --game-good: #8cc7ad;
  --game-bad: #e0605a;
  --game-tile-1: #2e261c;
  --game-tile-2: #4a3c24;
  --game-tile-3: #7a5f2c;
  --game-tile-4: #b48a3c;
  --game-tile-5: #7a2a2e;
  --game-tile-6: #a8403f;
  --game-tile-7: #1f4a3b;
  --game-tile-8: #d9b56a;
  --game-arena-screen: #15110d;
  --game-arena-coins: #d9b56a;
  --game-arena-win: #8cc7ad;
  --game-arena-danger: #e0605a;
}

/* The gavel tap on a confirming button (salesroom.js): a small gavel on
   the button's corner strikes once; the button sinks under it */
.srm-tap { position: fixed; z-index: 2147482000; width: 46px; height: 46px; pointer-events: none; filter: drop-shadow(0 3px 3px rgba(0, 0, 0, .35)); }
.srm-tap svg { width: 100%; height: 100%; overflow: visible; }
.srm-tap--rtl { transform: scaleX(-1); }
.srm-tap .srm-fx-head { transform-origin: 178px 139px; animation: srm-tap-strike .42s cubic-bezier(.5, 0, .5, 1) both; }
@keyframes srm-tap-strike { 0% { transform: rotate(40deg); opacity: 0; } 20% { opacity: 1; } 55% { transform: rotate(0deg); } 80% { transform: rotate(16deg); opacity: 1; } 100% { transform: rotate(22deg); opacity: 0; } }
.srm-tapped { transform: translateY(1px) !important; }
@media (prefers-reduced-motion: reduce) { .srm-tap { display: none; } }

/* The phone menu button as a small catalogue tab rather than the
   kernel's tinted pill (the oxblood ramp's 50/100 read as pink) */
html body .menu-btn, html.dark body .menu-btn {
  background: var(--paper-2) !important;
  border: 1px solid var(--rule) !important;
  border-radius: 3px;
  box-shadow: inset 0 -2px 0 rgba(var(--theme-500-rgb), .35);
}
html body .menu-btn:hover, html.dark body .menu-btn:hover { background: var(--paper) !important; transform: none; box-shadow: inset 0 -2px 0 var(--theme-500); }

/* Status tones (kernel 1.1.166): this theme's own green, amber, red and info hues
   for the shared .px-tone-* chips and notes, each set so its chip and text
   read at 4.5:1 or better on this theme's paper in light and dark. */
html:root { --px-good: #1d4939; --px-warn: #b45309; --px-crit: #af272c; --px-info: #2a75bb; }
html.dark:root { --px-good: #8ac6ac; --px-warn: #fbbf23; --px-crit: #eda4a1; --px-info: #8ab9e5; }
/* The cart's urgent "Complete Payment" prints white on the crit tone; the
   night crit is light, so its label takes the dark paper instead. */
html.dark body a[style*="background:var(--px-crit)"] { color: var(--paper) !important; }
/* Seller Centre keeps its own tone names; point them at the same hues. */
html body :is(.sc-page, .sc-panel) { --sc-good: var(--px-good); --sc-warn: var(--px-warn); --sc-crit: var(--px-crit); --sc-info: var(--px-info); }

/* Changing language, the scene (salesroom.js): a lot card under the
   spotlight with the old language's name, a paddle bidding the new one and
   the gavel raised; on the new page the gavel comes down and the card turns
   over to the new name under a seal. The lot is the same on both pages, so
   the reload never shows. */
.srm-lang-stage { background: color-mix(in srgb, var(--night, #16110c) 62%, transparent); }
.srm-lang-room {
  position: relative; display: grid; justify-items: center; width: min(560px, 100%); box-sizing: border-box;
  padding-top: 70px; font-family: var(--font-ui);
}
.srm-lang-spot {
  position: absolute; left: 0; right: 0; top: 0; bottom: 20%; pointer-events: none;
  background: radial-gradient(ellipse 50% 80% at 50% 0%, rgba(255, 228, 170, .5), rgba(255, 228, 170, 0) 72%);
}
.srm-lang-lot { position: relative; display: grid; width: min(420px, 100%); perspective: 900px; }
.srm-lang-face {
  grid-area: 1 / 1; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  min-width: 0; padding: 28px 22px 24px; box-sizing: border-box; text-align: center;
  color: var(--ink, #1c1712); background: var(--paper-2, #fbf6ea); border: 1px solid var(--gilt, #b48a3c); border-radius: var(--radius, 4px);
  box-shadow: inset 0 0 0 4px var(--paper-2, #fbf6ea), inset 0 0 0 5px var(--gilt-mid, #c9a24e), 0 34px 70px -28px rgba(0, 0, 0, .65);
  -webkit-backface-visibility: hidden; backface-visibility: hidden;
}
.srm-lang-orn { font-size: 12px; line-height: 1; color: var(--gilt, #b48a3c); }
.srm-lang-face img { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; }
.srm-lang-old {
  max-width: 100%; font: 600 clamp(28px, 8vw, 42px)/1.1 var(--font-display); overflow-wrap: anywhere;
  opacity: .42; transform: scale(.82);
}
.srm-lang-bid { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; color: var(--theme-600, #74242a); }
.srm-lang-bid b { min-width: 0; font: 700 clamp(26px, 7.6vw, 40px)/1.1 var(--font-display); overflow-wrap: anywhere; }
.srm-lang-paddle {
  position: relative; flex: 0 0 auto; width: 18px; height: 30px;
  background: radial-gradient(circle at 50% 9px, currentColor 0 8px, transparent 8.5px), linear-gradient(currentColor, currentColor) 50% 100% / 3px 14px no-repeat;
}
.srm-lang-back { transform: rotateY(-180deg); }
.srm-lang-back b { max-width: 100%; font: 700 clamp(30px, 9vw, 48px)/1.1 var(--font-display); overflow-wrap: anywhere; }
.srm-lang-back small { font: 600 12px/1 var(--font-label, var(--font-ui)); letter-spacing: .24em; color: var(--ink-soft, #6c6150); }
.srm-lang-seal {
  position: absolute; right: 14px; bottom: 12px; display: grid; place-items: center; width: 54px; height: 54px; box-sizing: border-box;
  border-radius: 50%; border: 3px solid var(--stamp, #b0272c); color: var(--stamp, #b0272c); font-size: 26px; line-height: 1;
  opacity: 0; transform: rotate(-12deg) scale(2.2);
}
.srm-lang-ring {
  position: absolute; right: 81px; top: -28px; width: 64px; height: 64px; box-sizing: border-box; border-radius: 50%;
  border: 3px solid var(--gilt-mid, #c9a24e); opacity: 0; transform: scale(.3); pointer-events: none;
}
.srm-lang-gavel {
  position: absolute; right: 6px; top: -26px; width: 130px; height: 30px; transform-origin: 100% 50%; transform: rotate(34deg);
  filter: drop-shadow(0 6px 6px rgba(0, 0, 0, .3));
}
.srm-lang-head {
  position: absolute; left: 0; top: 0; width: 46px; height: 100%; border-radius: 5px;
  background: linear-gradient(90deg, var(--mahog-lo, #331610) 0 6px, var(--gilt-mid, #c9a24e) 6px 9px, var(--mahog-hi, #7c3c26) 9px 37px, var(--gilt-mid, #c9a24e) 37px 40px, var(--mahog-lo, #331610) 40px);
}
.srm-lang-handle {
  position: absolute; left: 40px; right: 0; top: calc(50% - 4px); height: 8px; border-radius: 4px;
  background: linear-gradient(var(--mahog-hi, #7c3c26), var(--mahog, #5a2a1c));
}
/* Out: the spotlight comes up on the lot, the paddle bids the new language
   and the gavel is raised. */
.px-lang-stage-out .srm-lang-room { animation: srm-lang-rise .3s cubic-bezier(.2, .8, .3, 1.1) both; }
.px-lang-stage-out .srm-lang-spot { animation: srm-lang-light .4s ease-out .05s both; }
.px-lang-stage-out .srm-lang-old { animation: srm-lang-old .3s ease-out .6s both; }
.px-lang-stage-out .srm-lang-bid { animation: srm-lang-bid .32s cubic-bezier(.2, .9, .3, 1.3) .66s both; }
.px-lang-stage-out .srm-lang-gavel { animation: srm-lang-raise .85s ease-in-out .15s both; }
/* In: from that frame the gavel strikes and the card turns over. */
.px-lang-stage-in .srm-lang-gavel { animation: srm-lang-strike .32s .08s both; }
.px-lang-stage-in .srm-lang-ring { animation: srm-lang-shock .4s ease-out .26s both; }
.px-lang-stage-in .srm-lang-lot { animation: srm-lang-jolt .18s ease-out .26s both; }
.px-lang-stage-in .srm-lang-front { animation: srm-lang-turn-a .4s cubic-bezier(.5, 0, .3, 1) .38s both; }
.px-lang-stage-in .srm-lang-back { animation: srm-lang-turn-b .4s cubic-bezier(.5, 0, .3, 1) .38s both; }
.px-lang-stage-in .srm-lang-seal { animation: srm-lang-seal .3s cubic-bezier(.2, .9, .3, 1.35) .72s both; }
.px-lang-stage-in .srm-lang-room { animation: srm-lang-off .28s ease-in 1s both; }
@keyframes srm-lang-rise { from { transform: translateY(30px); opacity: 0; } }
@keyframes srm-lang-light { from { opacity: 0; } }
@keyframes srm-lang-old { from { opacity: 1; transform: none; } }
@keyframes srm-lang-bid { from { opacity: 0; transform: translateY(16px); } }
@keyframes srm-lang-raise {
  0%   { transform: rotate(0deg); opacity: 0; }
  25%  { transform: rotate(-2deg); opacity: 1; }
}
@keyframes srm-lang-strike {
  0%   { transform: rotate(34deg); animation-timing-function: cubic-bezier(.6, 0, .9, .5); }
  55%  { transform: rotate(-3deg); animation-timing-function: ease-out; }
  75%  { transform: rotate(5deg); }
  100% { transform: rotate(0deg); }
}
@keyframes srm-lang-shock {
  0%   { opacity: 0; transform: scale(.3); }
  10%  { opacity: 1; }
  100% { opacity: 0; transform: scale(1.7); }
}
@keyframes srm-lang-jolt { 40% { transform: translateY(3px); } }
@keyframes srm-lang-turn-a { to { transform: rotateY(180deg); } }
@keyframes srm-lang-turn-b { to { transform: rotateY(0deg); } }
@keyframes srm-lang-seal { to { opacity: .95; transform: rotate(-12deg); } }
@keyframes srm-lang-off { to { transform: translateY(24px); opacity: 0; } }
@media (max-width: 460px) {
  .srm-lang-room { padding-top: 58px; }
  .srm-lang-face { padding: 26px 16px 22px; }
  .srm-lang-gavel { width: 100px; height: 26px; top: -22px; }
  .srm-lang-head { width: 38px; background: linear-gradient(90deg, var(--mahog-lo, #331610) 0 5px, var(--gilt-mid, #c9a24e) 5px 8px, var(--mahog-hi, #7c3c26) 8px 30px, var(--gilt-mid, #c9a24e) 30px 33px, var(--mahog-lo, #331610) 33px); }
  .srm-lang-handle { left: 32px; }
  .srm-lang-ring { right: 55px; }
  .srm-lang-seal { width: 46px; height: 46px; font-size: 22px; right: 10px; bottom: 10px; }
}

/* Phones: the hero's two buttons stay side by side, each as wide as its
   label needs, their text and padding shrinking with the screen; a label
   still too long takes two even lines inside its button. A home section's title and its "View all" link
   share one row too: the title keeps a little under half of it, breaking
   between words if it must, and only a very long link label takes two
   lines. */
@media (max-width: 639px) {
  html body :is(div, p):has(> .ed-btn-primary):has(> .ed-btn-secondary) { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: stretch; gap: .5rem; }
  html body :is(div, p):has(> .ed-btn-primary):has(> .ed-btn-secondary) > :is(.ed-btn-primary, .ed-btn-secondary) {
    flex: 1 1 auto; min-width: min-content; width: auto; margin: 0; justify-content: center; text-align: center; white-space: normal; text-wrap: balance;
    padding-inline: clamp(.5rem, 2.6vw, 1.25rem); font-size: clamp(.75rem, 3.5vw, .9375rem); line-height: 1.15;
  }
  html body :is(div, p):has(> .ed-btn-primary):has(> .ed-btn-secondary) > :is(.ed-btn-primary, .ed-btn-secondary) > :is(svg, i, img) { flex: none; }
  html body div.flex.justify-between:has(> div h2.text-fit):has(> a) { flex-direction: row; flex-wrap: nowrap; align-items: flex-end; column-gap: .75rem; }
  html body div.flex.justify-between:has(> div h2.text-fit):has(> a) > div { flex: 1 1 0; min-width: 45%; }
  html body div.flex.justify-between:has(> div h2.text-fit):has(> a) > a { flex: 0 1 auto; max-width: 55%; margin: 0; white-space: normal; text-wrap: balance; text-align: center; font-size: .8125rem; line-height: 1.2; letter-spacing: .02em; gap: .375rem; }
  html body div.flex.justify-between:has(> div h2.text-fit):has(> a) h2.text-fit { font-size: clamp(1.25rem, 6.4vw, 1.75rem); overflow-wrap: break-word; }
}

/* Recent winners strip. It also stops while one of its cards has focus,
   slides towards the reading side on right-to-left pages (the shared loop
   only runs leftwards, which empties the row there), and holds still with
   each winner shown once when there are too few of them to fill the row
   (data-wt-still, set by assets/js/components/home/winner-ticker.js). */
html body .wt-wrap:focus-within .wt-track { animation-play-state: paused; }
@keyframes wt-scroll-rtl { from { transform: translateX(0); } to { transform: translateX(50%); } }
@media (prefers-reduced-motion: no-preference) {
  html[dir="rtl"] body .wt-track { animation-name: wt-scroll-rtl; }
}
html body .wt-wrap[data-wt-still] .wt-track { animation: none; transform: none; margin-inline: auto; }
html body .wt-wrap[data-wt-still] .wt-card[data-wt-repeat] { display: none; }
/* rev 868fe5109c9f2a2b */