:root {
      color-scheme: dark;
      --ah-black: #050607;
      --ah-ink: #0f1216;
      --ah-charcoal: #1f232b;
      --ah-charcoal-soft: #232a32;
      --ah-panel: #181c23;
      --ah-panel-2: #1c2128;
      --ah-white: #e6eaef;
      --ah-cream: #1a1f25;
      --ah-cream-soft: #20262d;
      --ah-honey: #f2a900;
      --ah-honey-deep: #aa7203;
      --ah-honey-soft: #ffd86f;
      --ah-yellow: #ffbf1f;
      --ah-text: #e6eaef;
      --ah-text-soft: #c9cdd2;
      --ah-text-muted: #8a949f;
      --ah-text-dark: #ffffff;
      --ah-border: rgba(255, 255, 255, 0.10);
      --ah-border-soft: rgba(255, 255, 255, 0.06);
      --ah-status-success: #83d39f;
      --ah-status-danger: #ffb29d;
      --ah-status-info: #f2a900;
      --ah-shadow-md: 0 16px 38px rgba(0, 0, 0, 0.38);
      --ah-shadow-card: 0 18px 42px rgba(0, 0, 0, 0.34);
      --ah-gold-gradient: linear-gradient(135deg, var(--ah-honey) 0%, var(--ah-yellow) 52%, var(--ah-honey-deep) 100%);
      --ah-page-background:
        radial-gradient(circle at top center, rgba(255, 255, 255, 0.08), transparent 30%),
        linear-gradient(180deg, #0a0c0f 0%, #14181d 40%, #0f1216 100%);
      --ah-page-overlay:
        linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(150deg, transparent 44%, rgba(255, 255, 255, 0.02) 45%, rgba(255, 255, 255, 0.02) 55%, transparent 56%),
        linear-gradient(30deg, transparent 44%, rgba(255, 255, 255, 0.02) 45%, rgba(255, 255, 255, 0.02) 55%, transparent 56%);
      --ah-header-background:
        linear-gradient(180deg, #242932 0%, #3a414c 50%, #242932 100%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), transparent 65%);
      --ah-header-text: #f0f3f7;
      --ah-header-text-hover: #ffffff;
      --ah-header-border-color: rgba(255, 255, 255, 0.14);
      --ah-header-shadow: 0 10px 24px rgba(0, 0, 0, 0.32);
      --ah-card-background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, transparent 40%),
        linear-gradient(145deg, #1f232b 0%, #181c23 60%, #14181d 100%);
      --ah-secondary-background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, transparent 42%),
        linear-gradient(145deg, #232a32 0%, #1c2128 55%, #151821 100%);
      --ah-frame-background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, transparent 42%),
        linear-gradient(145deg, #1f232b 0%, #181c23 60%, #14181d 100%);
      --room-panel: rgba(24, 28, 35, 0.94);
      --room-panel-strong: #181c23;
      --room-ink: var(--ah-text-dark);
      --room-ink-soft: var(--ah-text-soft);
      --room-muted: var(--ah-text-muted);
      --room-line: var(--ah-border);
      --room-line-strong: rgba(242, 169, 0, 0.18);
      --room-gold: var(--ah-honey);
      --room-gold-strong: var(--ah-honey-deep);
      --room-gold-soft: var(--ah-honey-soft);
      --room-dark: var(--ah-black);
      --room-blue: var(--ah-status-info);
      --room-red: var(--ah-status-danger);
      --room-green: var(--ah-status-success);
      --room-shadow: var(--ah-shadow-card);
      --queue-readable-layer: rgba(255, 255, 255, 0.68);
      --queue-readable-ink: #232a32;
      --room-radius: 22px;
      --room-radius-sm: 14px;
      --room-max: 1600px;
      --desktop-rail: 360px;
      --right-rail: 340px;
      --mobile-action-h: 112px;
      --live-mobile-header-height: 68px;
      --live-mobile-sticky-top: 0px;
      --live-mobile-sticky-gap: 8px;
      --safe-top: env(safe-area-inset-top, 0px);
      --safe-right: env(safe-area-inset-right, 0px);
      --safe-bottom: env(safe-area-inset-bottom, 0px);
      --safe-left: env(safe-area-inset-left, 0px);
      --z-live-sticky: 80;
      --z-live-header: 120;
      --z-live-nav-menu: 130;
      --z-live-account-menu: 130;
    }

    .theme-overlay-enabled {
      --queue-readable-layer: rgba(5, 6, 7, 0.64);
      --queue-readable-ink: #ffffff;
    }

    * {
      box-sizing: border-box;
    }

    html,
    body {
      height: 100%;
    }

    body {
      margin: 0;
      min-width: 320px;
      overflow: hidden;
      color: var(--room-ink);
      background: var(--ah-page-background);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      line-height: 1.45;
    }

    body::before {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      opacity: 0.07;
      background-image: var(--ah-page-overlay);
      background-size: 56px 56px, 112px 64px, 112px 64px;
      background-position: center top, center top, center top;
    }

    button,
    input,
    select {
      font: inherit;
    }

    button {
      -webkit-tap-highlight-color: transparent;
    }

    img {
      max-width: 100%;
    }

    .app-shell {
      height: 100dvh;
      padding-top: max(8px, var(--safe-top));
      padding-right: max(10px, var(--safe-right));
      padding-bottom: max(10px, var(--safe-bottom));
      padding-left: max(10px, var(--safe-left));
      overflow: hidden;
    }

    .live-room {
      width: min(var(--room-max), 100%);
      height: 100%;
      margin: 0 auto;
      display: grid;
      grid-template-rows: auto auto minmax(0, 1fr);
      gap: 8px;
      min-height: 0;
    }

    .panel,
    .live-focus-panel,
    .bid-panel {
      min-width: 0;
      min-height: 0;
      border: 1px solid var(--room-line);
      background: var(--room-panel);
      border-radius: var(--room-radius);
      box-shadow: var(--room-shadow);
      overflow: hidden;
    }

    .bid-panel,
    .action-wrap,
    .mobile-actionbar,
    .mobile-bid-module,
    .mobile-bid-row,
    .proxy-bid-control,
    .mobile-proxy-bid-control,
    .custom-select {
      overflow: visible;
    }

    .topbar {
      position: relative;
      z-index: var(--z-live-header);
      min-height: 68px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px;
      padding: 9px 14px;
      border: 1px solid var(--room-line);
      border-radius: 24px;
      background:
        var(--ah-header-background),
        var(--room-panel-strong);
      box-shadow: var(--ah-header-shadow);
      backdrop-filter: blur(10px);
      overflow: visible;
      isolation: isolate;
    }

    .icon-btn,
    .header-account-trigger,
    .nav-toggle,
    .tab,
    .thumb,
    .secondary-btn,
    .mobile-bid-btn,
    .live-primary-button {
      cursor: pointer;
    }

    .icon-btn,
    .header-account-trigger,
    .nav-toggle {
      width: 44px;
      height: 44px;
      border: 1px solid var(--room-line);
      border-radius: 14px;
      background: var(--ah-secondary-background);
      color: var(--room-ink);
      display: grid;
      place-items: center;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    }

    .topbar-title {
      display: grid;
      gap: 4px;
      min-width: 0;
      overflow: visible;
    }

    .topbar-eyebrow {
      color: var(--room-muted);
      letter-spacing: 0.04em;
      text-transform: none;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .topbar-heading {
      margin: 0;
      min-width: 0;
      color: var(--room-ink);
      font-size: clamp(22px, 3.1vw, 36px);
      font-weight: 900;
      line-height: 1.08;
      text-wrap: balance;
      overflow-wrap: break-word;
    }

    .eyebrow,
    .section-kicker,
    .queue-label,
    .stat-label,
    .focus-label,
    .meta-label,
    .detail-section h5,
    .paddle-card h4,
    .price-board .label {
      margin: 0;
      color: var(--room-muted);
      font-size: 12px;
      font-weight: 850;
      letter-spacing: 0.13em;
      line-height: 1.15;
      text-transform: uppercase;
    }

    .title-row {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }

    .title-row h1 {
      flex: 1 1 auto;
      margin: 0;
      min-width: 0;
      overflow: hidden;
      color: var(--room-ink);
      font-size: clamp(22px, 3.1vw, 36px);
      line-height: 1.05;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .status-pill,
    .mini-status {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      flex: 0 0 auto;
      border: 1px solid rgba(17, 122, 168, 0.18);
      border-radius: 999px;
      background: rgba(121, 196, 230, 0.11);
      color: var(--room-blue);
      font-size: 13px;
      font-weight: 850;
      line-height: 1;
    }

    .status-pill {
      padding: 8px 12px;
    }

    .mini-status {
      padding: 10px 12px;
      border-color: rgba(47, 143, 91, 0.2);
      background: rgba(131, 211, 159, 0.12);
      color: var(--room-green);
      align-self: center;
      min-height: 54px;
      white-space: nowrap;
    }

    .connection-copy {
      display: grid;
      gap: 2px;
      line-height: 1.05;
    }

    .connection-label {
      color: inherit;
      font-size: 11px;
      font-weight: 800;
      opacity: 0.86;
    }

    .connection-paddle {
      color: inherit;
      font-size: 14px;
      font-weight: 950;
    }

    .status-pill .dot,
    .mini-status .dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: currentColor;
      box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.48);
    }

    .topbar-actions {
      position: relative;
      display: flex;
      align-items: center;
      gap: 8px;
      overflow: visible;
    }

    .site-logo-link,
    .site-nav-links {
      display: none;
    }

    .ah-logo {
      display: none;
    }

    .header-account-shell {
      position: relative;
      z-index: calc(var(--z-live-header) + 1);
      display: flex;
      align-items: center;
      gap: 8px;
      overflow: visible;
    }

    .header-account-trigger-desktop {
      width: auto;
      min-width: 44px;
      padding: 0 14px;
      grid-auto-flow: column;
      gap: 8px;
      font-size: 12px;
      font-weight: 850;
      letter-spacing: 0.09em;
      text-transform: uppercase;
    }

    .header-account-trigger-mobile {
      display: none;
    }

    .header-account-icon {
      width: 14px;
      height: 14px;
      border: 2px solid currentColor;
      border-radius: 999px;
      position: relative;
    }

    .header-account-icon::after {
      content: "";
      position: absolute;
      left: 50%;
      bottom: -8px;
      width: 16px;
      height: 8px;
      border: 2px solid currentColor;
      border-bottom: 0;
      border-radius: 999px 999px 0 0;
      transform: translateX(-50%);
    }

    .header-account-indicator {
      position: absolute;
      top: 8px;
      right: 9px;
      width: 8px;
      height: 8px;
      border-radius: 999px;
      background: var(--room-gold);
      box-shadow: 0 0 0 4px rgba(200, 139, 18, 0.14);
    }

    .header-account-dropdown {
      position: absolute;
      top: calc(100% + 10px);
      right: 0;
      z-index: var(--z-live-account-menu);
      width: min(320px, calc(100vw - 24px));
      padding: 7px;
      border: 1px solid var(--room-line);
      border-radius: 18px;
      background: var(--room-panel-strong);
      box-shadow: var(--room-shadow);
    }

    .header-account-dropdown[hidden] {
      display: none;
    }

    .header-account-menu-list {
      display: grid;
      gap: 3px;
    }

    .header-account-menu-item {
      width: 100%;
      padding: 11px 12px;
      border: 1px solid transparent;
      border-radius: 12px;
      background: transparent;
      color: var(--room-ink);
      text-align: left;
      text-decoration: none;
      font-size: 13px;
      font-weight: 800;
      letter-spacing: 0.05em;
      text-transform: uppercase;
    }

    .header-account-menu-item:hover,
    .header-account-menu-item:focus-visible {
      border-color: var(--room-line);
      background: rgba(242, 169, 0, 0.12);
      outline: none;
    }

    .header-account-menu-item.is-placeholder,
    .header-account-menu-item[disabled] {
      color: var(--room-muted);
      cursor: not-allowed;
      opacity: 0.78;
    }

    .nav-toggle {
      display: grid;
      width: 58px;
      border-color: rgba(255, 255, 255, 0.12);
    }

    .nav-toggle[aria-expanded="true"] {
      border-color: rgba(242, 169, 0, 0.48);
      background: rgba(242, 169, 0, 0.14);
      color: var(--room-gold-soft);
    }

    .nav-toggle-bar,
    .nav-toggle-bar::before,
    .nav-toggle-bar::after {
      display: block;
      width: 20px;
      height: 2px;
      border-radius: 999px;
      background: currentColor;
    }

    .nav-toggle-bar {
      position: relative;
    }

    .nav-toggle-bar::before,
    .nav-toggle-bar::after {
      content: "";
      position: absolute;
      left: 0;
    }

    .nav-toggle-bar::before {
      top: -7px;
    }

    .nav-toggle-bar::after {
      top: 7px;
    }

    .site-nav.nav-open .site-nav-links {
      position: absolute;
      top: calc(100% + 18px);
      right: 0;
      z-index: var(--z-live-nav-menu);
      width: min(300px, calc(100vw - 20px));
      padding: 10px;
      border: 1px solid rgba(242, 169, 0, 0.18);
      border-radius: 22px;
      background:
        radial-gradient(circle at top right, rgba(242, 169, 0, 0.16), transparent 36%),
        var(--room-panel);
      box-shadow: 0 24px 54px rgba(0, 0, 0, 0.46);
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
    }

    .site-nav-links a,
    .site-nav-context-current,
    .identity-nav-placeholder {
      display: block;
      width: 100%;
      padding: 16px 18px;
      border: 1px solid transparent;
      border-radius: 18px;
      background: transparent;
      color: var(--room-ink);
      text-align: center;
      text-decoration: none;
      font-size: 13px;
      font-weight: 800;
      letter-spacing: 0.16em;
      text-transform: uppercase;
    }

    .site-nav-context-current {
      border-color: rgba(242, 169, 0, 0.86);
      background: rgba(242, 169, 0, 0.14);
      color: var(--room-gold-soft);
    }

    .site-nav-links a:hover {
      background: rgba(242, 169, 0, 0.10);
      color: var(--room-gold-soft);
    }

    .identity-nav-placeholder {
      opacity: 0.7;
    }

    .queue-status-row {
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 10px;
      align-items: stretch;
    }

    .queue {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 12px;
      align-items: center;
      min-height: 78px;
      padding: 8px 12px;
    }

    .queue-track {
      position: relative;
      min-width: 0;
      max-width: 100%;
      height: 88px;
      min-height: 88px;
      display: flex;
      align-items: stretch;
      gap: 10px;
      overflow-x: auto;
      overflow-y: hidden;
      scrollbar-width: none;
      scroll-behavior: smooth;
      overscroll-behavior-x: contain;
      scroll-snap-type: x proximity;
      scroll-padding-inline: 12px;
      padding: 4px 2px 6px;
    }

    .queue-track::-webkit-scrollbar {
      display: none;
    }

    .queue-card {
      flex: 0 0 132px;
      min-width: 132px;
      padding: 9px;
      border: 1px solid var(--room-line);
      border-radius: 18px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.03)),
        rgba(255, 255, 255, 0.05);
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 8px;
      align-items: center;
      color: var(--room-ink);
      position: relative;
      min-height: 70px;
      overflow: hidden;
      scroll-snap-align: start;
      transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
    }

    .queue-card:not(.active) {
      cursor: pointer;
    }

    .queue-card:not(.active):hover {
      transform: translateY(-1px);
      border-color: rgba(242, 169, 0, 0.22);
      box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18);
    }

    .queue-card.active {
      flex: 0 0 238px;
      min-width: 238px;
      grid-template-columns: 184px minmax(0, 1fr);
      border-color: rgba(242, 169, 0, 0.34);
      background:
        radial-gradient(circle at top right, rgba(255, 216, 111, 0.26), transparent 48%),
        linear-gradient(135deg, #d89b12 0%, #8c5b06 54%, #4a2f03 100%);
      color: #fff;
    }

    .queue-card.active.in-strip {
      position: sticky;
      z-index: 8;
      isolation: isolate;
      border-color: rgba(242, 169, 0, 0.42);
      box-shadow:
        0 0 0 1px rgba(242, 169, 0, 0.14),
        0 20px 34px rgba(242, 169, 0, 0.18),
        0 14px 32px rgba(0, 0, 0, 0.34);
    }

    .queue-card.active.in-strip::before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      width: 14px;
      pointer-events: none;
      z-index: 3;
      opacity: 0;
      transition: opacity 160ms ease;
    }

    .queue-card.active.in-strip.is-sticky-left {
      left: 0;
      right: auto;
    }

    .queue-card.active.in-strip.is-sticky-right {
      left: auto;
      right: 0;
    }

    .queue-card.active.in-strip.is-sticky-left::before {
      right: -14px;
      background: linear-gradient(90deg, rgba(5, 6, 7, 0.32), transparent);
      opacity: 1;
    }

    .queue-card.active.in-strip.is-sticky-right::before {
      left: -14px;
      background: linear-gradient(270deg, rgba(5, 6, 7, 0.32), transparent);
      opacity: 1;
    }

    .queue-card.active.in-strip .live-lot-badge {
      position: absolute;
      top: 8px;
      right: 8px;
      z-index: 4;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 24px;
      padding: 0 10px;
      border-radius: 999px;
      border: 1px solid rgba(242, 169, 0, 0.34);
      background: rgba(5, 6, 7, 0.56);
      color: #fff;
      font-size: 11px;
      font-weight: 900;
      letter-spacing: 0.08em;
      line-height: 1;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .queue-card:not(.active)::after,
    .queue-card.active.in-strip::after {
      content: "";
      position: absolute;
      inset: 0;
      background: var(--queue-readable-layer);
      z-index: 1;
      opacity: 1;
      transition: opacity 160ms ease;
    }

    .queue-card:not(.active).is-revealed::after {
      opacity: 0;
    }

    .queue-thumb {
      width: 42px;
      height: 42px;
      overflow: hidden;
      border-radius: 10px;
      background: #e8dcc1;
      position: relative;
      z-index: 0;
    }

    .queue-card:not(.active) .queue-thumb,
    .queue-card.active.in-strip .queue-thumb {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      border-radius: inherit;
    }

    .queue-card.active:not(.in-strip) .queue-thumb {
      width: 64px;
      height: 48px;
      z-index: 2;
    }

    .queue-thumb img,
    .thumb img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .queue-meta {
      min-width: 0;
      position: relative;
      z-index: 2;
    }

    .queue-card.active.in-strip .queue-meta {
      color: var(--queue-readable-ink);
      opacity: 1;
      transition: opacity 160ms ease;
      align-self: end;
      padding: 8px 10px 10px;
      border-radius: 14px;
      background: linear-gradient(180deg, rgba(5, 6, 7, 0.14), rgba(5, 6, 7, 0.42));
    }

    .queue-card.active.in-strip .queue-lot {
      font-size: clamp(25px, 2.4vw, 30px);
      line-height: 1;
      font-weight: 900;
      letter-spacing: 0;
    }

    .queue-card.active.in-strip .queue-name {
      margin-top: 4px;
      font-size: 14px;
      line-height: 1.35;
      -webkit-line-clamp: 2;
    }

    .queue-card.active.in-strip .queue-marker {
      display: block;
      width: 100%;
      white-space: normal;
      overflow: visible;
      text-overflow: clip;
    }

    .queue-card:not(.active) .queue-meta {
      color: var(--queue-readable-ink);
      opacity: 1;
      transition: opacity 160ms ease;
      padding-right: 18px;
    }

    .queue-card:not(.active).is-revealed .queue-meta {
      opacity: 0;
      pointer-events: none;
    }

    .queue-card:not(.active):focus-visible {
      outline: 2px solid var(--room-gold-soft);
      outline-offset: 2px;
    }

    .queue-lot {
      font-size: 12px;
      font-weight: 900;
      line-height: 1.05;
    }

    .queue-name {
      margin-top: 2px;
      overflow: hidden;
      display: -webkit-box;
      color: inherit;
      font-size: 12px;
      line-height: 1.12;
      opacity: 0.9;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    .queue-marker {
      display: block;
      margin-top: 4px;
      color: inherit;
      font-size: 10px;
      font-weight: 900;
      line-height: 1;
      opacity: 0.72;
      text-transform: uppercase;
    }

    .queue-status {
      white-space: nowrap;
      text-align: right;
    }

    .room-body,
    .live-main-grid {
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(300px, var(--desktop-rail));
      grid-template-rows: auto;
      align-items: start;
      gap: 14px;
      overflow: auto;
      padding-right: 2px;
    }

    .live-content-column {
      grid-column: 1;
      grid-row: 1;
      min-width: 0;
      min-height: 0;
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      grid-template-rows: auto auto;
      align-content: start;
      gap: 12px;
    }

    .left-rail {
      grid-column: 2;
      grid-row: 1;
      align-self: start;
      min-height: 0;
      max-height: calc(100dvh - 170px);
      position: sticky;
      top: 4px;
      display: grid;
      grid-template-rows: auto auto auto auto auto;
      background:
        radial-gradient(circle at top center, rgba(255, 216, 111, 0.08), transparent 34%),
        var(--room-panel);
    }

    .lot-chip {
      padding: 18px 18px 16px;
      border-bottom: 1px solid var(--room-line);
      background:
        radial-gradient(circle at top right, rgba(242, 169, 0, 0.14), transparent 42%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02));
    }

    .lot-chip-top {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 12px;
    }

    .lot-chip h2 {
      margin: 4px 0 6px;
      color: var(--room-ink);
      font-size: clamp(25px, 2.4vw, 30px);
      line-height: 1;
    }

    .lot-chip p {
      margin: 0;
      color: var(--room-ink-soft);
      font-size: 14px;
      line-height: 1.35;
    }

    .lot-tag,
    .state-chip {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 30px;
      padding: 6px 10px;
      border-radius: 12px;
      background: rgba(210, 91, 77, 0.12);
      color: var(--room-red);
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 0.09em;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .price-board {
      padding: 21px 18px;
      text-align: center;
      background:
        radial-gradient(circle at top center, rgba(255, 255, 255, 0.14), transparent 40%),
        linear-gradient(180deg, #c48508 0%, #7a4f04 58%, #452a03 100%);
      color: #fff;
      transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease, color 180ms ease;
    }

    .price-board .label {
      color: rgba(255, 255, 255, 0.88);
    }

    .price-main {
      margin: 8px 0 6px;
      font-size: clamp(46px, 5.5vw, 64px);
      font-weight: 300;
      letter-spacing: -0.02em;
      line-height: 0.96;
    }

    .price-sub {
      color: rgba(255, 255, 255, 0.9);
      font-size: 15px;
      line-height: 1.35;
    }

    .price-board .auction-state-sub {
      margin-top: 10px;
      color: rgba(255, 255, 255, 0.9);
      text-align: center;
    }

    .price-board.price-board--winning {
      background:
        radial-gradient(circle at top center, rgba(255, 255, 255, 0.18), transparent 42%),
        linear-gradient(180deg, #1f9d55 0%, #177544 58%, #0d4f2c 100%);
      box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.35), 0 16px 40px rgba(34, 197, 94, 0.16);
    }

    .price-board.price-board--winning .label,
    .price-board.price-board--winning .price-sub,
    .price-board.price-board--winning .auction-state-sub {
      color: rgba(240, 253, 244, 0.94);
    }

    .price-board.price-board--winning .price-main {
      color: #f0fdf4;
    }

    .price-board.price-board--outbid {
      background:
        radial-gradient(circle at top center, rgba(255, 255, 255, 0.16), transparent 42%),
        linear-gradient(180deg, #d94242 0%, #a32222 58%, #681111 100%);
      box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.35), 0 16px 40px rgba(239, 68, 68, 0.16);
    }

    .price-board.price-board--outbid .label,
    .price-board.price-board--outbid .price-sub,
    .price-board.price-board--outbid .auction-state-sub {
      color: rgba(254, 242, 242, 0.94);
    }

    .price-board.price-board--outbid .price-main {
      color: #fff1f2;
    }

    .action-wrap {
      display: grid;
      gap: 12px;
      padding: 16px 18px;
      border-bottom: 1px solid var(--room-line);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)),
        rgba(121, 196, 230, 0.05);
      justify-items: stretch;
    }

    .action-wrap .status-pill {
      justify-self: center;
      width: fit-content;
      max-width: 100%;
    }

    .live-primary-button,
    .mobile-bid-btn {
      width: 100%;
      min-height: 56px;
      border: 0;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 24px;
      background: var(--ah-gold-gradient);
      color: var(--ah-black);
      font-size: clamp(18px, 1.45vw, 22px);
      font-weight: 950;
      letter-spacing: 0.01em;
      box-shadow: var(--ah-primary-shadow, 0 14px 26px rgba(242, 169, 0, 0.24));
      transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
    }

    #live_bid_button,
    #mobile_bid_button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-align: center;
    }

    #live_bid_button[data-mode="direct"],
    #mobile_bid_button[data-mode="direct"] {
      font-size: 22px;
      line-height: 1;
      flex-direction: row;
    }

    #live_bid_button[data-mode="proxy_pending"],
    #live_bid_button[data-mode="proxy_locked"],
    #mobile_bid_button[data-mode="proxy_pending"],
    #mobile_bid_button[data-mode="proxy_locked"] {
      flex-direction: column;
      gap: 2px;
      line-height: 1.05;
    }

    .bid-cta-label {
      display: block;
      font-size: 14px;
      font-weight: 800;
      line-height: 1;
    }

    .bid-cta-value {
      display: block;
      font-size: 18px;
      font-weight: 950;
      line-height: 1.05;
    }

    .live-primary-button:hover,
    .live-primary-button:focus-visible,
    .mobile-bid-btn:hover,
    .mobile-bid-btn:focus-visible {
      outline: none;
      transform: translateY(-1px);
      filter: saturate(1.04);
      box-shadow: var(--ah-primary-shadow-hover, 0 18px 34px rgba(242, 169, 0, 0.32));
    }

    .mobile-bid-btn {
      white-space: nowrap;
    }

    .live-primary-button:disabled,
    .mobile-bid-btn:disabled {
      cursor: not-allowed;
      opacity: 0.58;
      box-shadow: none;
    }

    .sub-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }

    .proxy-bid-control {
      display: grid;
      gap: 6px;
    }

    .secondary-btn,
    .live-refresh-button {
      min-height: 44px;
      border: 1px solid var(--room-line);
      border-radius: 14px;
      background: var(--ah-secondary-background);
      color: var(--room-ink);
      font-weight: 850;
    }

    .auction-state-sub {
      color: var(--room-ink-soft);
      font-size: 12px;
      font-weight: 800;
      line-height: 1.25;
    }

    .bid-form-layout {
      position: absolute;
      width: 1px;
      height: 1px;
      overflow: hidden;
      clip: rect(0 0 0 0);
      clip-path: inset(50%);
      white-space: nowrap;
    }

    .field label {
      display: block;
      margin: 0 0 6px;
      color: var(--room-muted);
      font-size: 11px;
      font-weight: 850;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .field input,
    .field select,
    .proxy-bid-select {
      width: 100%;
      min-height: 42px;
      padding: 9px 11px;
      border: 1px solid var(--room-line);
      border-radius: 12px;
      background: var(--ah-secondary-background);
      color: var(--room-ink);
      font-weight: 750;
    }

    .custom-select {
      position: relative;
      width: 100%;
      min-width: 0;
    }

    .custom-select-trigger {
      width: 100%;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px;
      text-align: left;
      cursor: pointer;
    }

    .custom-select-trigger .custom-select-value {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .custom-select-chevron {
      width: 10px;
      height: 10px;
      border-right: 2px solid currentColor;
      border-bottom: 2px solid currentColor;
      transform: rotate(45deg) translateY(-1px);
      opacity: 0.9;
      transition: transform 160ms ease;
    }

    .custom-select.is-open .custom-select-chevron {
      transform: rotate(-135deg) translateY(-1px);
    }

    .custom-select-menu {
      position: absolute;
      top: auto;
      bottom: calc(100% + 8px);
      left: 0;
      right: 0;
      z-index: 120;
      max-height: min(42dvh, 360px);
      overflow-y: auto;
      overflow-x: hidden;
      padding: 6px;
      border: 1px solid var(--room-line);
      border-radius: 16px;
      background:
        radial-gradient(circle at top right, rgba(242, 169, 0, 0.12), transparent 40%),
        var(--room-panel-strong);
      box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
    }

    .custom-select-menu[hidden] {
      display: none;
    }

    .custom-select-option {
      width: 100%;
      min-height: 40px;
      padding: 10px 12px;
      border: 1px solid transparent;
      border-radius: 12px;
      background: transparent;
      color: var(--room-ink);
      text-align: left;
      font-size: 14px;
      font-weight: 750;
      cursor: pointer;
    }

    .custom-select-option:hover,
    .custom-select-option:focus-visible,
    .custom-select-option[aria-selected="true"] {
      outline: none;
      border-color: var(--room-line);
      background: rgba(242, 169, 0, 0.12);
      color: var(--room-gold-soft);
    }

    .live-helper {
      margin: 0;
      color: var(--room-ink-soft);
      font-size: 13px;
    }

    .live-helper[data-tone="success"] {
      color: var(--room-green);
    }

    .live-helper[data-tone="error"] {
      color: var(--room-red);
    }

    .rail-feedback {
      min-width: 0;
      padding: 12px 18px;
      border-bottom: 1px solid var(--room-line);
      background: rgba(255, 255, 255, 0.03);
    }

    .rail-history {
      min-height: 0;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr);
      gap: 12px;
      padding: 16px 18px 18px;
    }

    .history-list {
      min-height: 0;
      overflow: auto;
      display: grid;
      align-content: start;
      gap: 10px;
      padding-right: 2px;
    }

    .history-item {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
      padding: 12px 14px;
      border: 1px solid var(--room-line);
      border-radius: 16px;
      background: rgba(255, 255, 255, 0.05);
    }

    .history-time {
      color: var(--room-ink);
      font-size: 14px;
      font-variant-numeric: tabular-nums;
    }

    .history-copy {
      min-width: 0;
      color: var(--room-ink);
      line-height: 1.2;
    }

    .history-copy small {
      display: block;
      margin-top: 3px;
      color: var(--room-muted);
      font-size: 12px;
    }

    .history-price {
      color: var(--room-ink);
      font-size: 18px;
      font-weight: 950;
      white-space: nowrap;
    }

    .stage {
      grid-column: 1;
      grid-row: 1;
      align-self: start;
      position: relative;
      height: auto;
      min-height: 0;
      overflow: hidden;
      display: grid;
      grid-template-rows: auto auto;
      gap: 14px;
      padding: 18px;
      background:
        radial-gradient(circle at top right, rgba(255, 216, 111, 0.08), transparent 28%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 32%),
        var(--room-panel);
    }

    .stage-top {
      min-width: 0;
      display: grid;
      gap: 12px;
    }

    .stage-heading {
      min-width: 0;
    }

    .stage-heading h2 {
      margin: 4px 0 4px;
      color: var(--room-ink);
      width: 100%;
      max-width: none;
      font-size: clamp(24px, 2.2vw, 34px);
      line-height: 1.08;
      overflow-wrap: normal;
      text-wrap: balance;
      word-break: normal;
    }

    .stage-heading .lot-number-heading {
      margin: 5px 0 2px;
      font-size: clamp(20px, 1.85vw, 28px);
      line-height: 1.06;
    }

    .stage-heading #lot_title_stage {
      margin-top: 3px;
    }

    .stage-heading p {
      margin: 0;
      color: var(--room-ink-soft);
      font-size: 15px;
    }

    .stage-title-block {
      display: grid;
      gap: 6px;
      padding: 16px 18px;
      border: 1px solid var(--room-line);
      border-radius: 18px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)),
        rgba(5, 6, 7, 0.10);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    }

    .gallery {
      min-height: 0;
      width: 100%;
      justify-self: stretch;
      overflow: hidden;
      display: grid;
      grid-template-columns: 56px minmax(0, 1fr);
      grid-template-rows: auto;
      gap: 10px;
    }

    .hero {
      grid-column: 2;
      grid-row: 1;
      position: relative;
      min-width: 0;
      min-height: 0;
      width: 100%;
      max-width: 100%;
      height: clamp(420px, 42vw, 680px);
      display: grid;
      place-items: center;
      border: 1px solid var(--room-line-strong);
      border-radius: 24px;
      background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.07), transparent 28%),
        linear-gradient(180deg, rgba(5, 6, 7, 0.08), rgba(5, 6, 7, 0.24)),
        var(--ah-frame-background);
      overflow: hidden;
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
    }

    .hero::before {
      content: "";
      position: absolute;
      inset: 14px;
      z-index: 0;
      border: 1px solid rgba(255, 255, 255, 0.07);
      border-radius: 18px;
      background: rgba(5, 6, 7, 0.08);
      box-shadow: inset 0 0 0 1px rgba(242, 169, 0, 0.04);
      pointer-events: none;
    }

    #heroImage {
      position: relative;
      z-index: 1;
      display: block;
      min-width: 0;
      min-height: 0;
      width: 100%;
      height: 100%;
      max-width: 100%;
      max-height: 100%;
      object-fit: contain;
      object-position: center center;
    }

    .gallery-thumbs {
      grid-column: 1;
      grid-row: 1;
      min-height: 0;
      overflow: auto;
      display: grid;
      gap: 10px;
      align-content: start;
      scrollbar-width: thin;
    }

    .thumb {
      height: 56px;
      padding: 0;
      overflow: hidden;
      border: 1px solid var(--room-line);
      border-radius: 14px;
      background: rgba(255, 255, 255, 0.05);
      transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
    }

    .thumb:hover {
      transform: translateY(-1px);
      border-color: rgba(242, 169, 0, 0.24);
    }

    .thumb.active,
    .thumb.is-active {
      outline: 2px solid rgba(200, 139, 18, 0.48);
      outline-offset: 0;
      border-color: rgba(242, 169, 0, 0.34);
      box-shadow: 0 12px 18px rgba(0, 0, 0, 0.18);
    }

    .right-panel,
    .live-side-stack {
      grid-column: 1;
      grid-row: 2;
      align-self: start;
      position: relative;
      min-height: 0;
      overflow: hidden;
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      grid-template-rows: auto auto;
    }

    .live-side-stack>.tabs {
      grid-column: 1;
      grid-row: 1;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 6px;
      padding: 10px;
      border-bottom: 1px solid var(--room-line);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)),
        rgba(255, 255, 255, 0.04);
    }

    .tab {
      min-height: 46px;
      border: 1px solid transparent;
      border-radius: 14px;
      background: transparent;
      color: var(--room-muted);
      font-weight: 850;
      transition: border-color 160ms ease, background 160ms ease, color 160ms ease;
    }

    .tab:hover,
    .tab:focus-visible {
      outline: none;
      border-color: rgba(255, 255, 255, 0.08);
      color: var(--room-ink);
    }

    .tab.active {
      background: rgba(242, 169, 0, 0.14);
      color: var(--room-ink);
      border-color: rgba(242, 169, 0, 0.18);
    }

    .paddle-card {
      grid-column: 1;
      grid-row: 1 / 3;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px;
      margin: 14px;
      padding: 16px;
      border-radius: 22px;
      background:
        radial-gradient(circle at top right, rgba(255, 216, 111, 0.18), transparent 44%),
        linear-gradient(180deg, #2c2419 0%, #15110d 100%);
      color: #fff;
      box-shadow: 0 16px 32px rgba(15, 10, 6, 0.18);
    }

    .paddle-card h4 {
      margin: 0;
      color: rgba(255, 255, 255, 0.82);
    }

    .paddle-card-main {
      min-width: 0;
      display: grid;
      gap: 4px;
    }

    .paddle-card .mini-status {
      min-height: 50px;
      padding: 12px 18px;
      justify-self: end;
    }

    .paddle-number {
      font-size: 34px;
      font-weight: 950;
      line-height: 1;
    }

    .paddle-status {
      margin: 0;
      font-size: 15px;
    }

    .paddle-copy {
      margin: 0;
      color: rgba(255, 255, 255, 0.85);
      font-size: 14px;
      line-height: 1.45;
    }

    .live-side-stack>.side-scroll {
      grid-column: 1;
      grid-row: 2;
      min-height: 0;
      overflow: visible;
      padding: 0 14px 14px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.02), transparent 22%),
        transparent;
    }

    .detail-panel {
      display: none;
    }

    .detail-panel.active {
      display: block;
    }

    .detail-section {
      padding: 16px 4px 18px;
      border-bottom: 1px solid var(--room-line);
    }

    .detail-section:last-child {
      border-bottom: 0;
    }

    .detail-section p {
      margin: 0;
      color: var(--room-ink-soft);
      font-size: 15px;
      line-height: 1.5;
    }

    pre {
      max-height: 170px;
      margin: 10px 0 0;
      padding: 10px;
      overflow: auto;
      border: 1px solid var(--room-line);
      border-radius: 12px;
      background: rgba(29, 26, 22, 0.9);
      color: #f5eddc;
      font-size: 12px;
      white-space: pre-wrap;
      word-break: break-word;
    }

    .mobile-actionbar {
      display: none;
    }

    .mobile-status-pill,
    .mobile-connection-status,
    .mobile-auction-state-sub {
      display: none;
    }

    .sr-field {
      position: absolute;
      width: 1px;
      height: 1px;
      overflow: hidden;
      clip: rect(0 0 0 0);
      clip-path: inset(50%);
      white-space: nowrap;
    }

    .room-state-loading .state-chip,
    .room-state-idle .state-chip,
    .room-state-paused .state-chip {
      background: rgba(122, 111, 97, 0.14);
      color: var(--room-muted);
    }

    .room-state-open .state-chip {
      background: rgba(47, 143, 91, 0.12);
      color: var(--room-green);
    }

    .room-state-fair-warning .state-chip,
    .room-state-last-call .state-chip {
      background: rgba(210, 91, 77, 0.12);
      color: var(--room-red);
    }

    .room-state-sold .state-chip,
    .room-state-passed .state-chip {
      background: rgba(33, 29, 23, 0.12);
      color: var(--room-ink);
    }

    .room-state-disconnected .state-chip,
    .room-state-error .state-chip {
      background: rgba(210, 91, 77, 0.18);
      color: var(--room-red);
    }

    @media (max-width: 1180px) {

      .room-body,
      .live-main-grid {
        grid-template-columns: minmax(0, 1fr) minmax(300px, 330px);
      }

      .right-panel,
      .live-side-stack {
        grid-template-columns: minmax(0, 1fr);
      }

      .left-rail {
        max-height: calc(100dvh - 160px);
      }

    }

    @media (min-width: 821px) and (max-width: 1180px) {
      .queue {
        grid-template-columns: auto minmax(0, 1fr);
      }

      #queue_status_text {
        display: none;
      }
    }

    @media (max-width: 820px) {

      :root {
        --mobile-action-h: 232px;
        --live-mobile-sticky-top: max(6px, var(--safe-top));
      }

      html,
      body {
        height: auto;
        min-height: 100%;
      }

      body {
        overflow: auto;
      }

      .app-shell {
        height: auto;
        min-height: 100dvh;
        padding-top: max(6px, var(--safe-top));
        padding-right: max(8px, var(--safe-right));
        padding-bottom: max(8px, var(--safe-bottom));
        padding-left: max(8px, var(--safe-left));
        overflow: visible;
      }

      .live-room {
        height: auto;
        min-height: 0;
        grid-template-rows: auto auto auto;
        gap: 8px;
        padding-bottom: calc(var(--mobile-action-h) + max(20px, var(--safe-bottom)));
      }

      .topbar {
        position: sticky;
        top: var(--live-mobile-sticky-top);
        z-index: var(--z-live-header);
        grid-template-columns: minmax(0, 1fr) auto;
        min-height: 68px;
        padding: 8px 10px;
        border-radius: 18px;
      }

      .topbar-title {
        width: auto;
        min-width: 0;
        overflow: visible;
      }

      .topbar-eyebrow {
        display: none;
      }

      .topbar-heading {
        font-size: clamp(18px, 4.8vw, 24px);
        line-height: 1.12;
      }

      .title-row .status-pill {
        display: none;
      }

      .header-account-trigger-desktop {
        display: none;
      }

      .header-account-trigger-mobile,
      .nav-toggle {
        display: grid;
      }

      .queue {
        grid-template-columns: minmax(0, 1fr);
        min-height: 78px;
        padding: 8px;
        border-radius: 18px;
      }

      .queue-status-row {
        position: sticky;
        top: calc(var(--live-mobile-sticky-top) + var(--live-mobile-header-height) + var(--live-mobile-sticky-gap));
        z-index: calc(var(--z-live-header) - 1);
        grid-template-columns: 1fr;
        gap: 8px;
        align-self: start;
      }

      .queue>.queue-label:first-child,
      .queue-status {
        display: none;
      }

      .queue-card {
        flex-basis: 112px;
        min-width: 112px;
        grid-template-columns: minmax(0, 1fr);
      }

      .queue-card.active {
        flex-basis: 180px;
        min-width: 180px;
        grid-template-columns: 160px minmax(0, 1fr);
      }

      .queue-card.active.in-strip.is-sticky-left {
        left: 0;
      }

      .queue-card.active.in-strip.is-sticky-right {
        right: 0;
      }

      .queue-thumb {
        width: 38px;
        height: 38px;
      }

      .queue-card.active:not(.in-strip) .queue-thumb {
        width: 64px;
        height: 48px;
      }

      .room-body,
      .live-main-grid {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        align-content: start;
        overflow: visible;
        padding-bottom: 4px;
      }

      .left-rail {
        display: none;
      }

      .right-panel,
      .live-side-stack {
        display: grid;
        grid-column: 1;
        grid-row: auto;
      }

      .stage {
        grid-column: 1;
        grid-row: auto;
        height: auto;
        min-height: 0;
        grid-template-rows: auto minmax(0, 1fr);
        padding: 12px;
        border-radius: 20px;
        overflow: hidden;
      }

      .live-side-stack>.side-scroll {
        overflow: visible;
      }

      .stage-top {
        grid-template-columns: 1fr;
        gap: 10px;
      }

      .stage-heading {
        display: grid;
        gap: 10px;
      }

      .stage-status-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(124px, auto);
        gap: 10px;
        align-items: center;
      }

      .stage-heading-main,
      .stage-title-block {
        min-width: 0;
      }

      .mobile-connection-status {
        display: inline-flex;
        min-height: 50px;
        padding: 12px 18px;
        justify-self: end;
      }

      .stage-heading h2 {
        max-width: none;
        font-size: clamp(24px, 8vw, 34px);
      }

      .gallery {
        width: 100%;
        justify-self: stretch;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
      }

      .hero {
        grid-column: 1;
        grid-row: 1;
        width: 100%;
        height: auto;
        min-height: 240px;
        aspect-ratio: 4 / 3;
        border-radius: 18px;
      }

      .hero::before {
        inset: 10px;
        border-radius: 14px;
      }

      .gallery-thumbs {
        grid-column: 1;
        grid-row: 2;
        display: flex;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 8px;
        overflow-x: auto;
        overflow-y: hidden;
        max-width: 100%;
        padding-bottom: 4px;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
      }

      .thumb {
        flex: 0 0 auto;
        height: 58px;
        width: 58px;
        scroll-snap-align: start;
      }

      .mobile-actionbar {
        display: block;
        position: fixed;
        left: max(8px, var(--safe-left));
        right: max(8px, var(--safe-right));
        bottom: max(8px, var(--safe-bottom));
        z-index: var(--z-live-sticky);
        min-height: auto;
        padding: 0;
        padding-bottom: max(0px, var(--safe-bottom));
        overflow: hidden;
        backdrop-filter: blur(16px);
        box-shadow: 0 20px 42px rgba(0, 0, 0, 0.30);
      }

      .mobile-bid-module {
        display: grid;
        grid-template-columns: minmax(0, 1.04fr) minmax(0, 0.96fr);
        align-items: stretch;
      }

      .mobile-status-row,
      .mobile-bid-row {
        min-width: 0;
      }

      .mobile-status-row {
        display: grid;
        align-content: center;
        padding: 18px 18px 16px;
        text-align: center;
        border-right: 1px solid var(--room-line);
        background:
          radial-gradient(circle at top center, rgba(255, 255, 255, 0.08), transparent 42%),
          linear-gradient(180deg, #aa7203 0%, #5e3f03 100%);
        color: #fff;
      }

      .mobile-bid-row {
        display: grid;
        align-content: start;
        gap: 12px;
        padding: 16px 16px 16px 14px;
        background:
          linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)),
          rgba(121, 196, 230, 0.05);
      }

      .mobile-lot-meta {
        display: grid;
        gap: 10px;
      }

      .mobile-price-meta,
      .mobile-action-meta {
        min-width: 0;
      }

      .mobile-action-meta {
        display: grid;
        justify-items: center;
      }

      .mobile-auction-state-sub {
        display: block;
        margin: 4px 0 0;
        text-align: center;
        line-height: 1.2;
        color: rgba(255, 255, 255, 0.92);
        font-size: 11px;
      }

      .mobile-current_bid {
        text-align: center;
      }

      .mobile-status-pill {
        display: inline-flex;
        justify-self: center;
        align-self: center;
        max-width: 100%;
        min-height: 36px;
        padding: 8px 12px;
        font-size: 12px;
        white-space: nowrap;
      }

      .mobile-actionbar .top {
        color: rgba(255, 255, 255, 0.88);
        font-size: 12px;
        font-weight: 850;
        letter-spacing: 0.12em;
        line-height: 1.15;
        text-transform: uppercase;
      }

      .mobile-actionbar .price {
        margin: 0;
        color: #fff;
        font-size: clamp(44px, 10.5vw, 58px);
        font-weight: 300;
        line-height: 0.96;
        letter-spacing: -0.02em;
      }

      .mobile-actionbar .state {
        color: rgba(255, 255, 255, 0.88);
        font-size: 14px;
        font-weight: 800;
        line-height: 1.3;
        text-align: center;
      }

      .mobile-bid-btn {
        width: 100%;
        min-height: 68px;
        align-self: center;
        padding: 0 24px;
        border-radius: 999px;
        font-size: clamp(17px, 4.6vw, 20px);
        line-height: 1;
        box-shadow: 0 16px 30px rgba(242, 169, 0, 0.20);
      }

      .mobile-secondary-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
      }

      .mobile-secondary-actions > * {
        min-width: 0;
      }

      .mobile-proxy-bid-control {
        min-width: 0;
      }

      .mobile-proxy-bid-control .proxy-bid-select,
      .mobile-secondary-actions .secondary-btn {
        min-height: 48px;
        width: 100%;
        min-width: 0;
        border-radius: 18px;
        padding: 0 12px;
        font-size: clamp(12px, 3.1vw, 14px);
        line-height: 1.1;
      }

      .mobile-proxy-bid-control .proxy-bid-select {
        text-overflow: ellipsis;
      }

    }

    @media (max-width: 420px) {

      :root {
        --mobile-action-h: 216px;
      }

      .app-shell {
        padding-left: max(6px, var(--safe-left));
        padding-right: max(6px, var(--safe-right));
      }

      .topbar {
        gap: 7px;
        padding: 7px 8px;
      }

      .icon-btn,
      .header-account-trigger,
      .nav-toggle {
        width: 42px;
        height: 42px;
      }

      .queue-card:not(.active) {
        flex-basis: 110px;
        min-width: 110px;
      }

      .stage {
        padding: 10px;
      }

      .stage-heading h2 {
        font-size: 23px;
      }

      .hero {
        min-height: 220px;
      }

      .mobile-actionbar {
        min-height: 104px;
        gap: 0;
      }

      .mobile-actionbar .price {
        font-size: clamp(40px, 10vw, 50px);
      }

      .mobile-status-pill {
        padding: 7px 9px;
        font-size: 11px;
      }

      .mobile-bid-btn {
        min-height: 60px;
        padding: 0 14px;
      }

      .mobile-bid-module {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.96fr);
      }

      .mobile-status-row {
        padding: 16px 14px 14px;
      }

      .mobile-bid-row {
        padding: 14px 14px 14px 12px;
        gap: 10px;
      }

      .mobile-secondary-actions {
        gap: 8px;
      }

      .mobile-proxy-bid-control .proxy-bid-select,
      .mobile-secondary-actions .secondary-btn {
        padding: 0 10px;
        font-size: clamp(11px, 3vw, 13px);
      }

      .stage-status-row {
        grid-template-columns: minmax(0, 1fr) auto;
      }
    }

    .first-auction-modal[hidden] {
      display: none;
    }

    .first-auction-modal {
      position: fixed;
      inset: 0;
      z-index: 9999;
      display: grid;
      place-items: center;
      padding: 20px;
    }

    .first-auction-modal__backdrop {
      position: absolute;
      inset: 0;
      background: rgba(15, 23, 42, 0.64);
      backdrop-filter: blur(6px);
    }

    .first-auction-modal__card {
      position: relative;
      z-index: 1;
      width: min(520px, 100%);
      padding: 28px;
      border: 1px solid rgba(242, 169, 0, 0.35);
      border-radius: 24px;
      background:
        radial-gradient(circle at top right, rgba(242, 169, 0, 0.16), transparent 40%),
        #fff7ed;
      color: #1f2933;
      box-shadow: 0 24px 80px rgba(0, 0, 0, 0.32);
    }

    .first-auction-modal__close {
      position: absolute;
      top: 14px;
      right: 16px;
      border: 0;
      background: transparent;
      color: #92400e;
      font-size: 28px;
      line-height: 1;
      cursor: pointer;
    }

    .first-auction-modal__eyebrow {
      margin: 0 0 8px;
      color: #c2410c;
      font-size: 0.78rem;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .first-auction-modal__card h2 {
      margin: 0 0 12px;
      color: #111827;
      font-size: clamp(1.45rem, 4vw, 2rem);
      line-height: 1.15;
    }

    .first-auction-modal__card p {
      margin: 0 0 22px;
      color: #374151;
      line-height: 1.55;
    }

    .first-auction-modal__actions {
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
    }

    .first-auction-modal__button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 44px;
      padding: 10px 16px;
      border-radius: 999px;
      font-weight: 700;
      text-align: center;
      text-decoration: none;
      transition: transform 140ms ease, box-shadow 140ms ease, background 140ms ease;
    }

    .first-auction-modal__button:hover,
    .first-auction-modal__button:focus-visible,
    .first-auction-modal__close:hover,
    .first-auction-modal__close:focus-visible {
      outline: none;
    }

    .first-auction-modal__button--primary {
      background: #f97316;
      color: #111827;
      box-shadow: 0 10px 26px rgba(249, 115, 22, 0.28);
    }

    .first-auction-modal__button--secondary {
      background: rgba(17, 24, 39, 0.08);
      color: #111827;
    }

    .first-auction-modal__button--primary:hover,
    .first-auction-modal__button--primary:focus-visible,
    .first-auction-modal__button--secondary:hover,
    .first-auction-modal__button--secondary:focus-visible {
      transform: translateY(-1px);
    }

    body.first-auction-modal-open {
      overflow: hidden;
    }

    @media (max-width: 520px) {
      .first-auction-modal__card {
        padding: 24px 20px;
      }

      .first-auction-modal__actions {
        flex-direction: column;
      }

      .first-auction-modal__button {
        width: 100%;
      }
    }