/* AUTO-GENERATED FILE. DO NOT EDIT DIRECTLY. */
/* Source script: scripts/build-css-bundles.mjs */

/* ===== Source: bidcenter-dashboard-foundation.css ===== */
    :root,
    [data-theme="light"] {
      --bc-bg: #f6f2ea;
      --bc-text: #231b14;
      --bc-muted: #6f6256;
      --bc-primary: #7c3aed;
      --bc-primary-2: #a855f7;
      --bc-success: #7c3aed;
      --bc-warn: #d06ef4;
      --bc-card: #fefbff;
      --bc-line: rgba(50, 33, 70, 0.1);
      --bc-soft: #f1e8fb;
      --bc-soft-2: #faf5ff;
      --bc-field-bg: #fcf9ff;
      --bc-field-border: rgba(56, 43, 28, 0.12);
      --bc-field-text: #20162b;
      --bg-primary: #f6f1fb;
      --bg-secondary: #fefbff;
      --bg-card: #fefbff;
      --bg-card-hover: #f0e7fb;
      --text-primary: #20162b;
      --text-secondary: #685a79;
      --text-muted: #9384a5;
      --border: rgba(50, 33, 70, 0.1);
      --accent-copper: #a855f7;
      --accent-copper-light: #d8b4fe;
      --accent-gradient: linear-gradient(120deg, #7c3aed, #c084fc);
      --bc-radius: 16px;
      --bc-shadow: 0 12px 30px rgba(43, 33, 23, 0.08);
    }

    [data-theme="dark"] {
      --bc-bg: #0c0911;
      --bc-text: #f6f2ff;
      --bc-muted: #b6a9ca;
      --bc-primary: #a855f7;
      --bc-primary-2: #7c3aed;
      --bc-success: #c084fc;
      --bc-warn: #d38cff;
      --bc-card: rgba(21, 16, 28, 0.96);
      --bc-line: rgba(246, 239, 255, 0.08);
      --bc-soft: #191321;
      --bc-soft-2: #120e18;
      --bc-field-bg: #15101d;
      --bc-field-border: rgba(245, 239, 230, 0.08);
      --bc-field-text: #f6f2ff;
      --bg-primary: #0c0911;
      --bg-secondary: #141019;
      --bg-card: rgba(21, 16, 28, 0.96);
      --bg-card-hover: #1b1524;
      --text-primary: #f6f2ff;
      --text-secondary: #b6a9ca;
      --text-muted: #887b9d;
      --border: rgba(246, 239, 255, 0.08);
      --accent-copper: #a855f7;
      --accent-copper-light: #d8b4fe;
      --accent-gradient: linear-gradient(120deg, #7c3aed, #c084fc);
      --bc-radius: 16px;
      --bc-shadow: 0 20px 48px rgba(0, 0, 0, 0.34);
    }

    * { box-sizing: border-box; }
    html, body { height: 100%; }

    body {
      margin: 0;
      font-family: "Manrope", "Segoe UI", sans-serif;
      color: var(--bc-text);
      background:
        radial-gradient(1200px 500px at -10% -10%, color-mix(in oklab, var(--bc-primary-2) 16%, #ffffff 84%) 0%, transparent 40%),
        radial-gradient(1200px 500px at 120% -10%, color-mix(in oklab, #c084fc 14%, #ffffff 86%) 0%, transparent 35%),
        var(--bc-bg);
      line-height: 1.45;
    }

    .wrap {
      width: min(1480px, 100%);
      margin: 18px auto 34px;
      padding: 0 14px;
    }

    .hero {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 18px;
      background: linear-gradient(135deg, #160d21, #2d1844 56%, #5b21b6);
      color: #f6fbff;
      border-radius: 22px;
      padding: 22px 24px;
      box-shadow: 0 20px 45px rgba(31, 16, 53, 0.3);
      margin-bottom: 14px;
      position: relative;
      overflow: hidden;
    }

    .hero::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 16% 8%, rgba(255, 255, 255, 0.24), transparent 33%),
        radial-gradient(circle at 92% 24%, rgba(255, 255, 255, 0.2), transparent 34%);
      pointer-events: none;
    }

    .hero h1 {
      margin: 0 0 2px;
      font-size: clamp(34px, 3.8vw, 48px);
      letter-spacing: 0.2px;
      font-weight: 800;
      position: relative;
      z-index: 1;
    }

    .hero h1.brand-home {
      cursor: pointer;
      user-select: none;
    }

    .hero h1.brand-home:hover {
      opacity: 0.9;
      transform: translateY(-1px);
    }

    .hero p {
      margin: 0;
      max-width: 920px;
      font-size: 14px;
      opacity: 0.92;
      position: relative;
      z-index: 1;
    }

    .phase-pill {
      align-self: center;
      border-radius: 999px;
      padding: 8px 12px;
      font-size: 12px;
      font-weight: 700;
      color: #f8fcff;
      border: 1px solid rgba(255, 255, 255, 0.36);
      background: rgba(255, 255, 255, 0.16);
      backdrop-filter: blur(5px);
      position: relative;
      z-index: 1;
      white-space: nowrap;
    }

    .panel-nav {
      position: sticky;
      top: 10px;
      z-index: 10;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      background: rgba(255, 255, 255, 0.86);
      border: 1px solid #d6e5f8;
      border-radius: 14px;
      padding: 8px;
      box-shadow: 0 12px 26px rgba(14, 43, 92, 0.12);
      backdrop-filter: blur(8px);
      margin-bottom: 14px;
    }

    .panel-btn {
      border: 1px solid #c3d7f0;
      border-radius: 10px;
      background: #eef5ff;
      color: #21466f;
      font-weight: 700;
      min-height: 40px;
      padding: 0 14px;
      transition: all 0.18s ease;
    }

    .panel-btn:hover {
      transform: translateY(-1px);
      background: #e3eeff;
    }

    .panel-btn.active {
      border-color: #1f7df2;
      color: #ffffff;
      background: linear-gradient(130deg, var(--bc-primary), var(--bc-primary-2));
      box-shadow: 0 10px 20px rgba(37, 99, 235, 0.3);
    }

    .app-panel { display: none; }
    .app-panel.active {
      display: block;
      animation: fadeInUp 180ms ease;
    }

    body.onboarding-open {
      overflow: hidden;
    }

    .onboarding-modal {
      position: fixed;
      inset: 0;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 24px;
      background: rgba(6, 18, 38, 0.64);
      backdrop-filter: blur(10px);
      z-index: 1200;
    }

    .onboarding-modal.open {
      display: flex;
      animation: fadeInUp 180ms ease;
    }

    .onboarding-card {
      width: min(920px, 100%);
      max-height: calc(100dvh - 48px);
      overflow: auto;
      border-radius: 24px;
      border: 1px solid var(--bc-line);
      background:
        radial-gradient(circle at top right, rgba(255,255,255,0.08), transparent 22%),
        linear-gradient(180deg, color-mix(in oklab, var(--bc-card) 88%, #ffffff 12%), var(--bc-card));
      box-shadow: 0 28px 70px rgba(4, 15, 34, 0.34);
      padding: 24px;
      color: var(--bc-text);
    }

    .billing-delete-card {
      width: min(560px, 100%);
      display: grid;
      gap: 18px;
    }

    .billing-delete-head h2 {
      margin: 0 0 6px;
      font-size: 28px;
      line-height: 1.05;
    }

    .billing-delete-head p {
      margin: 0;
      font-size: 14px;
      line-height: 1.6;
      color: var(--bc-muted);
    }

    .billing-delete-summary {
      display: grid;
      gap: 8px;
      padding: 14px 16px;
      border-radius: 18px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 76%, transparent);
      background: rgba(7, 17, 34, 0.22);
      color: var(--bc-text);
    }

    .billing-order-delete-warning label {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      line-height: 1.5;
      color: var(--bc-muted);
      font-size: 13px;
      cursor: pointer;
    }

    .billing-order-delete-warning input[type="checkbox"] {
      margin-top: 2px;
      accent-color: var(--bc-primary);
    }

    .onboarding-head {
      display: flex;
      align-items: flex-start;
      gap: 16px;
      margin-bottom: 16px;
    }

    .onboarding-logo {
      width: 76px;
      height: 76px;
      object-fit: contain;
      filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.18));
    }

    .onboarding-head h2 {
      margin: 0 0 6px;
      font-size: clamp(26px, 2.6vw, 34px);
      line-height: 1.08;
    }

    .onboarding-head p {
      margin: 0;
      color: var(--bc-muted);
      font-size: 14px;
      line-height: 1.6;
    }

    .onboarding-section-label {
      margin: 16px 0 10px;
      color: color-mix(in oklab, var(--bc-primary) 84%, #ffffff 16%);
      font-size: 12px;
      font-weight: 900;
      letter-spacing: 0.12em;
      text-transform: uppercase;
    }

    .onboarding-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
      margin: 0 0 14px;
    }

    .onboarding-step {
      border: 1px solid var(--bc-line);
      border-radius: 18px;
      padding: 14px 15px;
      background: color-mix(in oklab, var(--bc-soft) 62%, transparent);
    }

    .onboarding-step strong {
      display: block;
      margin-bottom: 6px;
      font-size: 15px;
      color: color-mix(in oklab, var(--bc-text) 90%, #ffffff 10%);
    }

    .onboarding-step p {
      margin: 0;
      color: var(--bc-muted);
      font-size: 13px;
      line-height: 1.5;
    }

    .onboarding-note {
      border: 1px solid color-mix(in oklab, var(--bc-primary) 30%, transparent);
      border-radius: 18px;
      padding: 14px 16px;
      background: color-mix(in oklab, var(--bc-primary) 10%, transparent);
      color: var(--bc-text);
      margin-bottom: 14px;
      line-height: 1.6;
    }

    .onboarding-note strong {
      display: block;
      margin-bottom: 6px;
    }

    .onboarding-actions {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      align-items: center;
      flex-wrap: wrap;
      margin-top: 16px;
      padding-top: 14px;
      border-top: 1px solid color-mix(in oklab, var(--bc-line) 70%, transparent);
      position: sticky;
      bottom: -24px;
      background: linear-gradient(180deg, rgba(0,0,0,0), color-mix(in oklab, var(--bc-card) 94%, #000 6%) 18%, color-mix(in oklab, var(--bc-card) 98%, #000 2%) 100%);
    }

    .onboarding-agree {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      color: var(--bc-muted);
      font-size: 13px;
      max-width: 430px;
    }

    .onboarding-action-buttons {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
    }

    @media (max-width: 860px) {
      .onboarding-grid {
        grid-template-columns: 1fr;
      }
      .onboarding-card {
        padding: 22px;
      }
      .onboarding-head {
        align-items: flex-start;
      }
      .onboarding-actions {
        position: static;
        background: transparent;
        border-top: 0;
        padding-top: 0;
      }
    }

    @media (max-width: 640px) {
      .onboarding-modal {
        padding: 12px;
        align-items: flex-start;
      }

      .onboarding-card {
        width: calc(100vw - 24px);
        max-height: calc(100dvh - 24px);
        overflow: auto;
        border-radius: 20px;
        padding: 16px;
      }

      .onboarding-head {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
        margin-bottom: 14px;
      }

      .onboarding-logo {
        width: 58px;
        height: 58px;
      }

      .onboarding-head h2 {
        font-size: clamp(22px, 7vw, 28px);
      }

      .onboarding-head p,
      .onboarding-step p,
      .onboarding-note,
      .onboarding-agree {
        font-size: 12px;
        line-height: 1.45;
      }

      .onboarding-step {
        padding: 13px 14px;
      }

      .onboarding-actions,
      .onboarding-action-buttons {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
      }

      .onboarding-action-buttons button {
        width: 100%;
      }
    }

    .faq-stack {
      display: grid;
      gap: 10px;
    }

    .payment-flow-surface {
      border: 1px solid color-mix(in oklab, var(--bc-line) 88%, transparent);
      border-radius: 20px;
      background: linear-gradient(180deg, #203a64 0%, #182f52 100%);
      padding: 16px;
      display: grid;
      gap: 14px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
    }

    .payment-flow-actions {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
    }

    .faq-stack details {
      border: 1px solid color-mix(in oklab, var(--bc-line) 84%, transparent);
      border-radius: 16px;
      background: color-mix(in oklab, var(--bc-soft) 64%, transparent);
      padding: 12px 14px;
    }

    .faq-stack summary {
      cursor: pointer;
      font-weight: 700;
      color: var(--bc-text);
    }

    .faq-stack p {
      margin: 10px 0 0;
      color: var(--bc-muted);
      font-size: 13px;
      line-height: 1.55;
    }

    .mini-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .billing-shell {
      display: grid;
      gap: 14px;
    }

    .billing-summary-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
    }

    .billing-summary-card {
      border: 1px solid color-mix(in oklab, var(--bc-line) 84%, transparent);
      border-radius: 18px;
      background: linear-gradient(180deg, #223f6c 0%, #1b345a 100%);
      padding: 16px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
    }

    .billing-summary-card .label {
      display: block;
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: var(--bc-muted);
      margin-bottom: 8px;
    }

    .billing-summary-card .value {
      font-size: 28px;
      line-height: 1;
      font-weight: 800;
      color: var(--bc-text);
    }

    .row {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      align-items: center;
    }

    input,
    select,
    textarea {
      width: 100%;
    }

    input[type="checkbox"] {
      width: 17px;
      height: 17px;
      min-height: 17px;
      margin: 2px 0 0;
      padding: 0;
    }

    .inline-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      margin-top: 6px;
    }

    .inline-grid .full {
      grid-column: 1 / -1;
    }

    .company-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .company-grid .span-2 {
      grid-column: span 2;
    }

    .company-section-title {
      margin: 8px 0 2px;
      font-size: 21px;
      font-weight: 800;
      color: #153a66;
      letter-spacing: 0.15px;
    }

    .segments-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 10px 16px;
      padding: 4px 0 2px;
    }

    .segments-grid label {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      margin: 0;
      font-size: 13px;
      color: #234d7b;
      font-weight: 700;
    }

    .substitute-list {
      list-style: none;
      margin: 10px 0 0;
      padding: 0;
      border: 1px solid color-mix(in oklab, var(--bc-line) 92%, transparent);
      border-radius: 10px;
      background: color-mix(in oklab, var(--bc-card) 96%, transparent);
      min-height: 44px;
      max-height: 132px;
      overflow: auto;
    }

    .substitute-item {
      display: grid;
      grid-template-columns: minmax(52px, 84px) 1fr auto;
      gap: 8px;
      align-items: center;
      padding: 6px 9px;
      border-bottom: 1px solid color-mix(in oklab, var(--bc-line) 72%, transparent);
      color: color-mix(in oklab, var(--bc-text) 84%, transparent);
      font-size: 13px;
    }

    .substitute-item:last-child {
      border-bottom: 0;
    }

    .substitute-item .uf {
      font-weight: 800;
      letter-spacing: 0.4px;
    }

    .logo-preview-wrap {
      border: 1px dashed color-mix(in oklab, var(--bc-line) 92%, transparent);
      border-radius: 12px;
      padding: 8px;
      background: color-mix(in oklab, var(--bc-soft-2) 88%, transparent);
      min-height: 78px;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 8px;
    }

    .logo-preview-wrap img {
      max-width: 140px;
      max-height: 76px;
      width: auto;
      height: auto;
      object-fit: contain;
      border-radius: 8px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 82%, transparent);
      background: color-mix(in oklab, var(--bc-card) 96%, transparent);
    }

    .org-inline-row {
      align-items: center;
      gap: 8px;
    }

    .org-inline-row > * {
      width: auto;
      max-width: 100%;
      padding-left: 0;
      padding-right: 0;
    }

    .org-inline-row input:not([type="checkbox"]) {
      flex: 1 1 220px;
      min-width: 0;
    }

    .logo-preview-empty {
      color: #6f89ac;
      font-size: 13px;
      font-weight: 600;
      text-align: center;
    }

    .inline-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 8px;
    }

    .billing-layout {
      display: grid;
      grid-template-columns: minmax(340px, 0.9fr) minmax(0, 1.5fr);
      gap: 14px;
      align-items: start;
    }

    .billing-stack {
      display: grid;
      gap: 14px;
    }

    .billing-section-card {
      border: 1px solid color-mix(in oklab, var(--bc-line) 86%, transparent);
      border-radius: 20px;
      background: linear-gradient(180deg, #203a64 0%, #182f52 100%);
      padding: 16px;
      display: grid;
      gap: 12px;
      overflow: visible;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
    }

    .billing-section-head {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
      padding-bottom: 12px;
      border-bottom: 1px solid color-mix(in oklab, var(--bc-line) 80%, transparent);
    }

    .billing-head-main {
      display: grid;
      gap: 4px;
      min-width: 0;
    }

    .billing-toolbar {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 10px 12px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 78%, transparent);
      border-radius: 16px;
      background: linear-gradient(180deg, #23416f 0%, #1b3459 100%);
    }

    .billing-toolbar-copy {
      display: grid;
      gap: 2px;
      min-width: 0;
    }

    .billing-toolbar-copy strong {
      font-size: 13px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-toolbar-copy span {
      font-size: 12px;
      color: var(--bc-muted);
    }

    .billing-toolbar-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .billing-toolbar-actions .filter-input {
      min-width: 220px;
    }

    .billing-section-head h3 {
      margin: 0;
      font-size: 20px;
      font-weight: 800;
      color: color-mix(in oklab, var(--bc-text) 90%, #1f7df2 10%);
    }

    .billing-section-head p {
      margin: 0;
      font-size: 13px;
      color: var(--bc-muted);
    }

    .billing-inline-note {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 7px 10px;
      border-radius: 999px;
      border: 1px solid color-mix(in oklab, var(--bc-primary) 35%, transparent);
      background: color-mix(in oklab, var(--bc-primary) 10%, transparent);
      color: color-mix(in oklab, var(--bc-text) 92%, #1f7df2 8%);
      font-size: 12px;
      font-weight: 700;
    }

    .billing-subsection {
      display: grid;
      gap: 10px;
      padding: 14px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 80%, transparent);
      border-radius: 16px;
      background: linear-gradient(180deg, #23416f 0%, #1a3458 100%);
    }

    .billing-subsection-title {
      margin: 0;
      font-size: 13px;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: var(--bc-muted);
      font-weight: 800;
    }

    .billing-recent-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

    .billing-actions-row {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
    }

    .billing-customer-layout {
      display: grid;
      grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.8fr);
      gap: 16px;
      align-items: start;
    }

    .billing-customer-main,
    .billing-customer-aside {
      display: grid;
      gap: 14px;
      align-content: start;
    }

    .billing-field-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
    }

    .billing-field-grid .span-2 {
      grid-column: span 2;
    }

    .billing-field-grid .span-3 {
      grid-column: 1 / -1;
    }

    .billing-aside-note {
      display: grid;
      gap: 12px;
    }

    .billing-aside-note strong {
      font-size: 15px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-aside-note p {
      margin: 0;
      color: var(--bc-muted);
      font-size: 13px;
      line-height: 1.6;
    }

    .billing-keypoints {
      display: grid;
      gap: 8px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .billing-keypoints li {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 10px 12px;
      border-radius: 12px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 75%, transparent);
      background: color-mix(in oklab, var(--bg-secondary) 84%, #235b91 16%);
    }

    .billing-keypoints li span {
      color: var(--bc-muted);
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      font-weight: 700;
    }

    .billing-keypoints li strong {
      font-size: 13px;
      color: var(--bc-text);
      font-weight: 800;
    }

    .billing-aside-actions {
      display: grid;
      gap: 8px;
    }

    .billing-table {
      border: 1px solid color-mix(in oklab, var(--bc-line) 78%, transparent);
      border-radius: 18px;
      overflow: hidden;
      background: linear-gradient(180deg, #203a64 0%, #182f52 100%);
    }

    .billing-table-head,
    .billing-table-row {
      display: grid;
      gap: 12px;
      align-items: center;
      padding: 12px 14px;
    }

    .billing-table-head {
      background: linear-gradient(180deg, #284975 0%, #223d65 100%);
      border-bottom: 1px solid color-mix(in oklab, var(--bc-line) 72%, transparent);
      font-size: 11px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--bc-muted);
    }

    .billing-customer-page {
      display: grid;
      gap: 18px;
    }

    .billing-stats-row {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
    }

    .billing-stats-row.premium {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .billing-stat-chip {
      display: grid;
      gap: 4px;
      padding: 14px 16px;
      border-radius: 18px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 82%, transparent);
      background: linear-gradient(180deg, #244371 0%, #1c365d 100%);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
    }

    .billing-stat-chip span {
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: var(--bc-muted);
      font-weight: 800;
    }

    .billing-stat-chip strong {
      font-size: 15px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-module-hero {
      display: grid;
      gap: 16px;
      padding: 20px;
      border-radius: 24px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 84%, transparent);
      background: linear-gradient(180deg, #254576 0%, #1f3a63 100%);
      box-shadow: 0 16px 40px rgba(4, 14, 34, 0.2), inset 0 1px 0 rgba(255,255,255,0.05);
    }

    .billing-module-hero-head {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 16px;
      align-items: start;
    }

    .billing-page-toolbar {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 14px;
      align-items: center;
      padding: 16px 18px;
      border-radius: 20px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 78%, transparent);
      background: linear-gradient(180deg, #244271 0%, #1b355a 100%);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
    }

    .billing-page-toolbar-copy {
      display: grid;
      gap: 5px;
      min-width: 0;
    }

    .billing-page-toolbar-copy strong {
      font-size: 19px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-page-toolbar-copy span {
      font-size: 13px;
      line-height: 1.55;
      color: var(--bc-muted);
    }

    .billing-page-toolbar-actions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
    }

    .billing-page-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 18px;
      align-items: start;
    }

    .billing-page-main,
    .billing-page-side {
      display: grid;
      gap: 16px;
      align-content: start;
    }

    .billing-page-section {
      display: grid;
      gap: 14px;
      padding: 18px;
      border-radius: 20px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 80%, transparent);
      background: linear-gradient(180deg, #223f6c 0%, #1a3359 100%);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
    }

    .billing-page-section-head {
      display: grid;
      gap: 4px;
      padding-bottom: 12px;
      border-bottom: 1px solid color-mix(in oklab, var(--bc-line) 72%, transparent);
    }

    .billing-page-section-head h3 {
      margin: 0;
      font-size: 18px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-page-section-head p {
      margin: 0;
      font-size: 13px;
      color: var(--bc-muted);
      line-height: 1.55;
    }

    .billing-form-shell {
      display: grid;
      gap: 18px;
    }

    .billing-form-topbar {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 16px;
      align-items: center;
      padding: 18px 20px;
      border-radius: 22px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 84%, transparent);
      background: linear-gradient(180deg, #254474 0%, #1d375d 100%);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
    }

    .billing-form-copy {
      display: grid;
      gap: 6px;
      min-width: 0;
    }

    .billing-form-copy strong {
      font-size: 24px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-form-copy span {
      font-size: 13px;
      line-height: 1.6;
      color: var(--bc-muted);
      max-width: 760px;
    }

    .billing-form-actions {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
    }

    .billing-form-note {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      width: fit-content;
      padding: 10px 14px;
      border-radius: 999px;
      border: 1px solid color-mix(in oklab, var(--bc-primary) 30%, transparent);
      background: color-mix(in oklab, var(--bc-primary) 10%, transparent);
      color: color-mix(in oklab, var(--bc-text) 92%, #4fb3ff 8%);
      font-size: 12px;
      font-weight: 700;
    }

    .billing-form-shell .billing-field-grid {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 14px;
    }

    .billing-form-shell .billing-field-grid .span-4 {
      grid-column: 1 / -1;
    }

    .billing-form-shell .billing-page-section {
      padding: 22px;
      border-radius: 22px;
    }

    .billing-form-shell .billing-page-section-head h3 {
      font-size: 20px;
    }

    .billing-page-side .billing-page-section {
      padding: 16px;
    }

    .billing-customer-shell {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 18px;
      align-items: start;
    }

    .billing-customer-mainlist {
      display: grid;
      gap: 16px;
      align-content: start;
    }

    .billing-customer-sidebar {
      display: grid;
      gap: 14px;
      align-content: start;
    }

    #billing-pane-vendas .billing-customer-sidebar {
      display: grid;
    }

    .billing-payment-request-list {
      display: grid;
      gap: 12px;
    }

    .billing-payment-request-card {
      border: 1px solid color-mix(in oklab, var(--bc-line) 78%, transparent);
      border-radius: 18px;
      padding: 14px;
      background: color-mix(in oklab, var(--bg-secondary) 86%, #235b91 14%);
      display: grid;
      gap: 12px;
    }

    .billing-payment-request-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
    }

    .billing-payment-request-head strong {
      font-size: 15px;
      color: var(--bc-text);
    }

    .billing-payment-request-meta {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 6px 12px;
      color: var(--bc-muted);
      font-size: 13px;
      line-height: 1.5;
    }

    .billing-payment-request-meta span {
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .billing-payment-request-proof-summary {
      display: grid;
      gap: 2px;
      padding: 10px 12px;
      border-radius: 12px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 75%, transparent);
      background: color-mix(in oklab, var(--bc-soft) 60%, transparent);
    }

    .billing-payment-request-proof-summary strong {
      font-size: 13px;
      color: var(--bc-text);
    }

    .billing-payment-request-proof-summary span {
      font-size: 12px;
      color: var(--bc-muted);
      overflow-wrap: anywhere;
    }

    .billing-payment-request-prooflist {
      display: grid;
      gap: 8px;
    }

    .billing-payment-request-proof {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 10px 12px;
      border-radius: 12px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 75%, transparent);
      background: color-mix(in oklab, var(--bc-soft) 60%, transparent);
    }

    .billing-payment-request-proof-copy {
      display: grid;
      gap: 2px;
      min-width: 0;
    }

    .billing-payment-request-proof-copy strong,
    .billing-payment-request-proof-copy span {
      overflow-wrap: anywhere;
    }

    .billing-payment-request-proof-copy strong {
      font-size: 13px;
      color: var(--bc-text);
    }

    .billing-payment-request-proof-copy span {
      font-size: 12px;
      color: var(--bc-muted);
    }

    .billing-payment-request-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      justify-content: flex-end;
    }

    .billing-payment-request-actions button {
      width: auto;
    }

    .billing-payment-request-detail-card {
      width: min(760px, 100%);
      display: grid;
      gap: 16px;
    }

    .auction-sheet-picker-card {
      width: min(1080px, calc(100vw - 24px));
      max-width: calc(100vw - 24px);
      max-height: calc(100dvh - 24px);
      display: flex;
      flex-direction: column;
      gap: 14px;
      overflow: hidden;
    }

    .auction-sheet-link-card {
      width: min(560px, 100%);
      display: grid;
      gap: 16px;
    }

    .auction-sheet-link-form {
      display: grid;
      gap: 10px;
    }

    .auction-sheet-picker-source {
      gap: 6px;
    }

    .auction-sheet-picker-source span {
      display: block;
      overflow-wrap: anywhere;
    }

    .auction-sheet-picker-list {
      flex: 1 1 auto;
      min-height: 0;
      display: grid;
      gap: 10px;
      overflow-y: auto;
      overflow-x: hidden;
      padding-right: 6px;
      padding-bottom: 6px;
    }

    .auction-sheet-picker-option {
      width: 100%;
      min-height: 72px;
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr);
      gap: 12px;
      align-items: center;
      justify-content: flex-start;
      padding: 14px 16px;
      text-align: left;
      border-radius: 18px;
    }

    .auction-sheet-picker-option-mapping {
      grid-template-columns: minmax(0, 1fr) minmax(280px, 44%);
      align-items: center;
      gap: 14px;
    }

    .auction-sheet-picker-column-meta {
      min-height: 56px;
      align-content: center;
    }

    .auction-sheet-picker-column-meta strong,
    .auction-sheet-picker-column-meta small {
      white-space: normal;
      overflow: visible;
      text-overflow: initial;
      overflow-wrap: anywhere;
    }

    .auction-sheet-picker-controls {
      min-width: 0;
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
      justify-items: stretch;
      align-items: start;
    }

    .auction-sheet-picker-toggle {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-size: 13px;
      color: var(--bc-muted);
      font-weight: 700;
      cursor: pointer;
      user-select: none;
      order: 2;
      margin-top: 2px;
    }

    .auction-sheet-picker-toggle input[type="checkbox"] {
      width: 16px;
      height: 16px;
      margin: 0;
      accent-color: var(--brand-primary);
    }

    .auction-sheet-picker-toggle-label {
      color: var(--bc-text);
    }

    .auction-sheet-picker-controls select {
      width: 100%;
      min-width: 0;
      max-width: 100%;
      order: 1;
    }

    .auction-sheet-picker-index {
      width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      border-radius: 14px;
      background: color-mix(in oklab, var(--brand-primary) 16%, transparent);
      color: var(--brand-primary);
      font-weight: 900;
    }

    .auction-sheet-picker-meta {
      display: grid;
      gap: 4px;
      min-width: 0;
    }

    .auction-sheet-picker-meta strong,
    .auction-sheet-picker-meta small {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .auction-sheet-picker-meta small {
      color: var(--bc-muted);
    }

    #auctionSheetColumnPickerModal .auction-sheet-picker-card {
      width: min(1320px, calc(100vw - 16px));
      max-width: calc(100vw - 16px);
      max-height: calc(100dvh - 16px);
    }

    #auctionSheetColumnPickerModal .auction-sheet-picker-list {
      max-height: none;
      overscroll-behavior: contain;
      padding-bottom: 8px;
      overflow-x: hidden;
    }

    #auctionSheetColumnPickerModal .onboarding-action-buttons {
      margin-top: 4px;
      padding-top: 10px;
      border-top: 1px solid color-mix(in oklab, var(--bc-line) 72%, transparent);
      background: color-mix(in oklab, var(--bc-surface) 92%, transparent);
      justify-content: flex-end;
      position: sticky;
      bottom: 0;
      z-index: 2;
    }

    .manual-bulk-options-card {
      width: min(560px, 100%);
    }

    .manual-bulk-options-card .inline-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .manual-bulk-options-card label {
      display: block;
      margin-bottom: 6px;
      font-size: 13px;
      font-weight: 700;
      color: var(--bc-muted);
    }

    .manual-bulk-options-card .quick-caption {
      margin-top: -4px;
      font-size: 12px;
      color: var(--bc-muted);
      line-height: 1.45;
    }

    @media (max-width: 1200px) {
      .auction-sheet-picker-option-mapping {
        grid-template-columns: 1fr;
        align-items: start;
      }

      .auction-sheet-picker-controls {
        justify-items: start;
      }

      .auction-sheet-picker-toggle {
        width: 100%;
        justify-content: flex-start;
      }

      .auction-sheet-picker-controls select {
        min-width: 0;
        width: 100%;
      }
    }

    @media (max-width: 860px) {
      .auction-sheet-picker-card {
        width: min(98vw, 760px);
        max-width: calc(100vw - 8px);
        max-height: calc(100dvh - 8px);
      }

      #auctionSheetColumnPickerModal .onboarding-action-buttons {
        justify-content: stretch;
      }
    }

    @media (max-width: 640px) {
      .manual-bulk-options-card .inline-grid {
        grid-template-columns: 1fr;
      }
    }

    .billing-payment-request-detail-summary {
      display: grid;
      gap: 10px;
    }

    .billing-payment-request-detail-prooflist {
      max-height: min(360px, 46vh);
      overflow: auto;
      padding-right: 4px;
    }

    .billing-payment-request-detail-note {
      margin: 0;
    }

    @media (max-width: 860px) {
      .billing-payment-request-meta {
        grid-template-columns: 1fr;
      }

      .billing-payment-request-actions {
        justify-content: flex-start;
      }
    }

    .billing-faq-copy details p {
      margin: 8px 0 0;
    }

    .billing-list-toolbar {
      display: grid;
      gap: 12px;
      padding: 16px 18px;
      border-radius: 20px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 78%, transparent);
      background: linear-gradient(180deg, #244271 0%, #1b355a 100%);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
    }

    .billing-list-toolbar-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      flex-wrap: wrap;
    }

    .billing-list-toolbar-head strong {
      font-size: 18px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-customers-toolbar {
      padding: 18px;
    }

    .billing-list-toolbar-head span {
      color: var(--bc-muted);
      font-size: 13px;
      line-height: 1.55;
    }

    .billing-list-toolbar-actions {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }

    .billing-list-toolbar-filters {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
    }

    .billing-list-toolbar-filters.premium {
      grid-template-columns: auto minmax(280px, 1fr) auto;
      max-width: 100%;
    }

    .billing-search-shell {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px;
      min-height: 48px;
      padding: 0 14px;
      border-radius: 16px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 84%, transparent);
      background: rgba(9, 19, 38, 0.28);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
    }

    .billing-search-shell i {
      color: color-mix(in oklab, var(--bc-muted) 82%, white 18%);
      font-size: 14px;
    }

    .billing-search-shell .filter-input {
      min-height: 46px;
      padding: 0;
      border: none;
      background: transparent;
      box-shadow: none;
    }

    .billing-search-clear {
      width: 28px;
      height: 28px;
      padding: 0;
      border: 1px solid color-mix(in oklab, var(--bc-line) 82%, transparent);
      border-radius: 999px;
      background: rgba(255,255,255,0.04);
      color: var(--bc-muted);
      display: inline-grid;
      place-items: center;
      line-height: 1;
      cursor: pointer;
      transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
    }

    .billing-search-clear i {
      margin: 0;
      font-size: 13px;
      line-height: 1;
    }

    .billing-search-clear:hover {
      background: rgba(255,255,255,0.08);
      border-color: color-mix(in oklab, var(--bc-line) 96%, white 4%);
      color: var(--bc-text);
    }

    .billing-sort-select {
      min-height: 48px;
      border-radius: 14px;
    }

    .billing-import-summary {
      display: grid;
      gap: 8px;
      padding: 14px 16px;
      border-radius: 18px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 78%, transparent);
      background: rgba(7, 17, 34, 0.2);
    }

    .billing-import-summary strong {
      font-size: 14px;
      color: var(--bc-text);
    }

    .billing-import-summary span {
      font-size: 13px;
      line-height: 1.55;
      color: var(--bc-muted);
    }

    .billing-import-summary.is-ok {
      border-color: color-mix(in oklab, var(--ok) 54%, transparent);
      background: color-mix(in oklab, var(--ok) 12%, rgba(7, 17, 34, 0.2));
    }

    .billing-import-summary.is-warn {
      border-color: color-mix(in oklab, var(--warn) 54%, transparent);
      background: color-mix(in oklab, var(--warn) 12%, rgba(7, 17, 34, 0.2));
    }

    .billing-filters-panel {
      display: grid;
      gap: 14px;
      padding: 16px;
      border-radius: 18px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 76%, transparent);
      background: rgba(7, 17, 34, 0.22);
    }

    .billing-filter-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
    }

    .billing-filter-actions {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }

    .billing-icon-btn {
      width: 42px;
      min-width: 42px;
      height: 42px;
      padding: 0 !important;
      display: inline-grid !important;
      place-items: center;
      border-radius: 12px !important;
    }

    .billing-composer {
      display: none;
      gap: 18px;
      padding: 18px;
      border-radius: 20px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 82%, transparent);
      background: linear-gradient(180deg, #223f6c 0%, #1a3359 100%);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
    }

    .billing-composer.open {
      display: grid;
    }

    .billing-composer-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
      padding-bottom: 12px;
      border-bottom: 1px solid color-mix(in oklab, var(--bc-line) 72%, transparent);
    }

    .billing-composer-head strong {
      font-size: 18px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-composer-head span {
      display: block;
      color: var(--bc-muted);
      font-size: 13px;
      line-height: 1.55;
      margin-top: 4px;
    }

    .billing-composer-actions {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }

    .billing-table-row {
      border-bottom: 1px solid color-mix(in oklab, var(--bc-line) 70%, transparent);
      transition: background 0.16s ease, transform 0.16s ease;
      min-height: 66px;
    }

    .billing-table-row:last-child {
      border-bottom: 0;
    }

    .billing-table-row:hover {
      background: color-mix(in oklab, var(--bg-card-hover) 88%, transparent);
    }

    .billing-table.customers .billing-table-head,
    .billing-table.customers .billing-table-row {
      grid-template-columns: 42px minmax(240px, 1.7fr) 180px 68px;
    }

    .billing-table.items .billing-table-head,
    .billing-table.items .billing-table-row {
      grid-template-columns: minmax(240px, 1.35fr) 90px 90px 110px 120px 90px 120px 100px;
    }

    .billing-table.orders .billing-table-head,
    .billing-table.orders .billing-table-row {
      grid-template-columns: 120px minmax(220px, 1.25fr) 120px minmax(140px, 0.95fr) 120px 120px 120px;
    }

    .billing-table.finance .billing-table-head,
    .billing-table.finance .billing-table-row {
      grid-template-columns: 120px minmax(220px, 1.2fr) 120px 120px 120px 120px 140px;
    }

    .billing-cell-title {
      display: grid;
      gap: 4px;
      min-width: 0;
    }

    .billing-cell-title strong {
      font-size: 13px;
      font-weight: 800;
      color: var(--bc-text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .billing-cell-title span,
    .billing-cell-muted {
      font-size: 12px;
      color: var(--bc-muted);
    }

    .billing-customer-identity {
      display: grid;
      grid-template-columns: 36px minmax(0, 1fr);
      gap: 12px;
      align-items: center;
      min-width: 0;
    }

    .billing-customer-avatar {
      width: 36px;
      height: 36px;
      border-radius: 12px;
      background: linear-gradient(180deg, #33588e 0%, #294872 100%);
      border: 1px solid color-mix(in oklab, var(--bc-line) 82%, transparent);
      display: inline-grid;
      place-items: center;
      font-size: 13px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-inline-badges {
      display: flex;
      gap: 6px;
      flex-wrap: wrap;
      margin-top: 4px;
    }

    .billing-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      min-height: 24px;
      padding: 0 10px;
      border-radius: 999px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 78%, transparent);
      background: rgba(255,255,255,0.05);
      font-size: 11px;
      font-weight: 700;
      color: var(--bc-text);
    }

    .billing-badge.is-source {
      background: color-mix(in oklab, #4fb3ff 16%, transparent);
      border-color: color-mix(in oklab, #4fb3ff 45%, transparent);
    }

    .billing-badge.is-alert {
      background: color-mix(in oklab, var(--warn) 16%, transparent);
      border-color: color-mix(in oklab, var(--warn) 45%, transparent);
    }

    .billing-badge.is-type {
      background: color-mix(in oklab, var(--ok) 14%, transparent);
      border-color: color-mix(in oklab, var(--ok) 38%, transparent);
    }

    .billing-status-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 28px;
      width: fit-content;
      padding: 0 10px;
      border-radius: 999px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 76%, transparent);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.03em;
      color: var(--bc-text);
      background: rgba(255,255,255,0.05);
    }

    .billing-status-badge.is-ok {
      background: color-mix(in oklab, var(--ok) 16%, transparent);
      border-color: color-mix(in oklab, var(--ok) 42%, transparent);
    }

    .billing-status-badge.is-warn {
      background: color-mix(in oklab, var(--warn) 16%, transparent);
      border-color: color-mix(in oklab, var(--warn) 42%, transparent);
    }

    .billing-status-badge.is-neutral {
      background: color-mix(in oklab, #7d8ba6 16%, transparent);
      border-color: color-mix(in oklab, #7d8ba6 42%, transparent);
    }

    .billing-status-badge.is-danger {
      background: color-mix(in oklab, var(--danger) 16%, transparent);
      border-color: color-mix(in oklab, var(--danger) 42%, transparent);
    }

    .billing-cell-money {
      font-size: 13px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-cell-actions {
      display: flex;
      justify-content: flex-end;
      gap: 6px;
      flex-wrap: nowrap;
      position: relative;
    }

    .billing-cell-actions button,
    .billing-row-menu-summary {
      width: 34px;
      min-width: 34px;
      height: 34px;
      min-height: 34px !important;
      padding: 0 !important;
      font-size: 13px !important;
      border-radius: 12px !important;
      display: inline-grid;
      place-items: center;
    }

    .billing-cell-actions button.is-danger {
      color: #f6b1b1;
      border-color: color-mix(in oklab, var(--danger) 40%, transparent) !important;
      background: color-mix(in oklab, var(--danger) 14%, transparent) !important;
    }

    .billing-cell-actions button:disabled {
      opacity: 0.45;
      cursor: not-allowed;
    }

    .billing-table.customers .billing-table-row {
      cursor: pointer;
    }

    .billing-table.customers .billing-table-row:hover .billing-cell-title strong {
      color: color-mix(in oklab, white 88%, var(--bc-primary) 12%);
    }

    .billing-table {
      overflow-x: auto;
    }

    .billing-table.orders,
    .billing-table.finance,
    .billing-page-section:has(.billing-table.orders),
    .billing-page-section:has(.billing-table.finance) {
      overflow: visible;
    }

    .billing-select-cell {
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .billing-select-checkbox {
      width: 18px;
      height: 18px;
      accent-color: #4fc46f;
      cursor: pointer;
    }

    .billing-list-head-actions {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
    }

    .billing-list-head-actions .billing-list-meta {
      white-space: normal;
      text-align: right;
    }

    .billing-bulk-delete-btn {
      min-height: 36px !important;
      padding: 0 14px !important;
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }

    .billing-row-menu-summary {
      cursor: pointer;
    }

    .billing-floating-menu {
      position: fixed;
      top: 0;
      left: 0;
      width: 232px;
      padding: 8px;
      border-radius: 14px;
      border: 1px solid rgba(255,255,255,0.08);
      background: linear-gradient(180deg, #19222f 0%, #141b27 100%);
      box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38);
      display: grid;
      gap: 4px;
      z-index: 1200;
    }

    .billing-floating-menu button {
      width: 100%;
      min-width: 0;
      height: auto;
      min-height: 38px !important;
      padding: 0 12px !important;
      border-radius: 10px !important;
      display: inline-flex;
      align-items: center;
      justify-content: flex-start;
      gap: 10px;
      font-size: 12px !important;
      border-color: transparent !important;
      background: transparent !important;
      color: #eef3ff !important;
      box-shadow: none !important;
      font-weight: 700;
    }

    .billing-floating-menu button i {
      font-size: 13px;
      width: 14px;
      text-align: center;
      color: color-mix(in oklab, var(--bc-muted) 82%, white 18%);
    }

    .billing-floating-menu button:hover {
      background: rgba(255,255,255,0.06) !important;
      border-color: rgba(255,255,255,0.06) !important;
      color: #ffffff !important;
    }

    .billing-floating-menu button:hover i {
      color: #ffffff;
    }

    .billing-floating-menu button.is-danger {
      color: color-mix(in oklab, var(--danger) 78%, #ffffff 22%) !important;
    }

    .billing-floating-menu button.is-danger:hover {
      background: color-mix(in oklab, var(--danger) 14%, transparent) !important;
      border-color: color-mix(in oklab, var(--danger) 32%, transparent) !important;
      color: #ffffff !important;
    }

    .billing-floating-menu-label {
      padding: 8px 10px 4px;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #8da3c5;
    }

    .billing-floating-menu-separator {
      height: 1px;
      margin: 6px 2px;
      background: rgba(255,255,255,0.08);
    }

    .billing-section-head.compact {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 16px;
      flex-wrap: wrap;
    }

    .billing-list-meta {
      font-size: 12px;
      font-weight: 700;
      color: var(--bc-muted);
      white-space: nowrap;
    }

    .billing-pagination {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
      padding-top: 14px;
    }

    .billing-pagination-info {
      font-size: 12px;
      color: var(--bc-muted);
      font-weight: 700;
    }

    .billing-pagination-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }

    .billing-pagination-actions button {
      min-height: 36px !important;
      padding: 0 12px !important;
    }

    .billing-side-panel {
      display: grid;
      gap: 14px;
    }

    .billing-side-panel-head {
      display: grid;
      gap: 4px;
    }

    .billing-side-panel-head h3 {
      margin: 0;
      font-size: 16px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .billing-side-panel-head span {
      font-size: 12px;
      color: var(--bc-muted);
    }

    .dashboard-mini-list.compact li {
      padding: 12px 0;
    }

    .tag-list {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 8px;
    }

    .tag {
      border-radius: 999px;
      border: 1px solid #c8ddf6;
      background: #eef5ff;
      color: #1f4f7e;
      padding: 6px 10px;
      font-size: 12px;
      font-weight: 700;
    }

    .wide-text {
      width: 100%;
      min-height: 110px;
    }

    .schedule-list {
      list-style: none;
      margin: 10px 0 0;
      padding: 0;
      border: 1px solid #d5e4f6;
      border-radius: 10px;
      background: #ffffff;
      max-height: 360px;
      overflow: auto;
    }

    .schedule-item {
      padding: 10px;
      border-bottom: 1px solid #e2edf9;
      transition: background-color 0.15s ease;
    }

    .schedule-item:hover { background: #f3f8ff; }
    .schedule-item:last-child { border-bottom: 0; }

    .schedule-title {
      font-weight: 800;
      color: #194878;
      margin-bottom: 2px;
    }

    .schedule-meta {
      color: #5e7ea5;
      font-size: 12px;
      line-height: 1.34;
      margin-bottom: 8px;
    }

    .schedule-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    .manual-image-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      min-height: 120px;
    }

    .manual-image-card {
      border: 1px solid #d5e4f6;
      border-radius: 12px;
      background: #ffffff;
      padding: 8px;
    }

    .manual-image-card img {
      width: 100%;
      aspect-ratio: 3 / 4;
      object-fit: cover;
      border-radius: 8px;
      border: 1px solid #dbe8f7;
      display: block;
    }

    .manual-image-label {
      margin-top: 6px;
      font-size: 12px;
      color: #4d6b90;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.4px;
    }

    .manual-image-empty {
      grid-column: 1 / -1;
      border: 1px dashed #c4d8f2;
      border-radius: 10px;
      background: #f8fbff;
      padding: 16px;
      color: #6b86a8;
      font-size: 13px;
      text-align: center;
    }

    .manual-group-list {
      list-style: none;
      margin: 8px 0 0;
      padding: 0;
      border: 1px solid #d6e4f5;
      border-radius: 10px;
      background: #ffffff;
      max-height: 240px;
      overflow: auto;
    }

    .manual-group-item {
      display: flex;
      gap: 10px;
      align-items: flex-start;
      padding: 8px 10px;
      border-bottom: 1px solid #e3edf9;
    }

    .manual-group-item:last-child { border-bottom: 0; }

    .manual-inbox-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      max-height: 420px;
      overflow: auto;
      padding-right: 4px;
    }

    .manual-inbox-card {
      border: 1px solid #d6e5f7;
      border-radius: 12px;
      background: #ffffff;
      padding: 8px;
      display: grid;
      gap: 8px;
    }

    .manual-inbox-card img {
      width: 100%;
      aspect-ratio: 3 / 4;
      object-fit: cover;
      border-radius: 8px;
      border: 1px solid #dbe8f7;
      display: block;
    }

    .manual-inbox-meta {
      font-size: 12px;
      color: #4f6d92;
      line-height: 1.35;
    }

    .manual-inbox-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    .manual-pair-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
      margin-top: 10px;
    }

    .manual-pair-card {
      border: 1px solid #d3e3f7;
      border-radius: 12px;
      background: #ffffff;
      padding: 10px;
      display: grid;
      gap: 8px;
    }

    .manual-pair-photos {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .manual-pair-photo {
      border: 1px solid #dbe8f7;
      border-radius: 8px;
      background: #f8fbff;
      overflow: hidden;
    }

    .manual-pair-photo img {
      width: 100%;
      aspect-ratio: 3 / 4;
      object-fit: cover;
      display: block;
    }

    .manual-pair-photo .manual-image-label {
      margin: 0;
      padding: 6px;
      font-size: 11px;
    }

    .manual-option-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 8px;
      align-items: center;
    }

    .template-preview-wrap {
      border: 1px solid #d6e4f6;
      background: #f8fbff;
      border-radius: 10px;
      min-height: 120px;
      padding: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .template-preview-wrap img {
      width: 100%;
      max-height: 520px;
      object-fit: contain;
      border-radius: 8px;
      border: 1px solid #d6e4f6;
      display: block;
      background: #fff;
    }

    .batch-item-title {
      font-weight: 800;
      color: #15457a;
      margin-bottom: 3px;
    }

    .batch-item-meta {
      font-size: 12px;
      color: #5f7ea4;
      margin-bottom: 8px;
      line-height: 1.35;
    }

    /* Auction panel style */
    #panel-auction {
      background: transparent;
      border: 0;
      border-radius: 0;
      padding: 0;
    }

    #panel-auction .stack {
      gap: 12px;
      max-width: var(--bc-page-max);
      margin: 0 auto;
    }

    #panel-auction .card {
      background: var(--bg-card);
      border: 1px solid var(--border);
      border-radius: 12px;
      box-shadow: 0 10px 24px var(--shadow);
      padding: 12px;
    }

    #panel-auction h2,
    #panel-auction .section-title {
      color: var(--text-primary);
      font-size: clamp(19px, 1.45vw, 25px);
    }

    #panel-auction .subhead,
    #panel-auction .muted,
    #panel-auction label,
    #panel-auction .group-jid {
      color: var(--text-secondary);
    }

    #panel-auction input,
    #panel-auction select,
    #panel-auction textarea {
      min-height: 38px;
      padding: 7px 10px;
      border: 1px solid var(--border);
      background: var(--bg-secondary);
      color: var(--text-primary);
    }

    #panel-auction input::placeholder,
    #panel-auction textarea::placeholder {
      color: var(--text-muted);
    }

    #panel-auction input:focus,
    #panel-auction select:focus,
    #panel-auction textarea:focus {
      border-color: var(--accent-copper);
      box-shadow: 0 0 0 3px rgba(184, 115, 51, 0.16);
      background: var(--bg-card-hover);
    }

    #panel-auction textarea.wide-text {
      min-height: 115px;
    }

    #panel-auction button {
      background: var(--accent-gradient);
      color: #1a1a1a;
      border: 1px solid transparent;
      font-weight: 700;
    }

    #panel-auction button.secondary {
      background: var(--bg-secondary);
      border-color: var(--border);
      color: var(--text-primary);
    }

    #panel-auction .status {
      background: rgba(255, 255, 255, 0.03);
      border-color: var(--border);
      color: var(--text-secondary);
    }

    #panel-auction .status.ok {
      background: rgba(107, 142, 107, 0.14);
      border-color: rgba(107, 142, 107, 0.35);
      color: #8ec38e;
    }

    #panel-auction .status.warn {
      background: rgba(194, 120, 120, 0.16);
      border-color: rgba(194, 120, 120, 0.4);
      color: #e0a6a6;
    }

    #panel-auction .quick-caption {
      background: rgba(255, 255, 255, 0.02);
      border-left-color: var(--accent-copper);
      color: var(--text-secondary);
    }

    #panel-auction .manual-pair-grid {
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
      gap: 10px;
    }

    #panel-auction .manual-pair-card {
      background: var(--bg-secondary);
      border-color: var(--border);
      padding: 8px;
      gap: 6px;
    }

    #panel-auction .manual-pair-photo {
      background: var(--bg-card);
      border-color: var(--border);
    }

    #panel-auction .manual-pair-photo img {
      max-height: 260px;
      object-fit: cover;
    }

    #panel-auction .template-preview-wrap {
      min-height: 90px;
      background: var(--bg-secondary);
      border-color: var(--border);
    }

    #panel-auction .template-preview-wrap img {
      max-height: 210px;
      border-color: var(--border);
    }

    .auction-fold > summary {
      list-style: none;
      cursor: pointer;
      color: var(--text-primary);
      font-size: clamp(17px, 1.3vw, 23px);
      font-weight: 800;
      margin-bottom: 8px;
      user-select: none;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .auction-fold > summary::-webkit-details-marker {
      display: none;
    }

    .auction-fold > summary::before {
      content: "▸";
      font-size: 14px;
      color: var(--accent-copper-light);
      transform: translateY(1px);
      transition: transform 0.15s ease;
    }

    .auction-fold[open] > summary::before {
      transform: rotate(90deg);
    }

    .options-nav {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 8px;
    }

    .options-btn {
      border: 1px solid #bfd3ef;
      border-radius: 10px;
      background: #edf4ff;
      color: #1f4773;
      min-height: 38px;
      font-weight: 700;
      padding: 0 12px;
    }

    .options-btn.active {
      border-color: #1f7df2;
      color: #ffffff;
      background: linear-gradient(120deg, var(--bc-primary), var(--bc-primary-2));
      box-shadow: 0 8px 15px rgba(31, 125, 242, 0.24);
    }

    .options-pane {
      display: none;
      margin-top: 12px;
    }

    .options-pane.active {
      display: block;
      animation: fadeInUp 180ms ease;
    }

    .command-catalog {
      margin: 0;
      padding-left: 18px;
      color: #19406b;
      line-height: 1.45;
    }

    .command-catalog li {
      margin-bottom: 6px;
    }

    body:not(.authenticated) .requires-auth {
      display: none !important;
    }

    body:not(.authenticated) .wrap {
      width: min(560px, 100%);
      margin-top: 12vh;
    }

    body:not(.authenticated) #panel-core {
      display: block !important;
    }

    body:not(.authenticated) #panel-core > .layout,
    body:not(.authenticated) #panel-core > .stack {
      grid-template-columns: 1fr;
    }

    body:not(.authenticated) #panel-core .stack[aria-label="Dashboard principal"] > article:not(.auth-card) {
      display: none;
    }

    body.authenticated .auth-login-only {
      display: none !important;
    }

    body:not(.authenticated) .auth-after-login {
      display: none !important;
    }

    @media (max-width: 1200px) {
      .layout { grid-template-columns: 1fr; }
      .mini-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 920px) {
      .hero { flex-direction: column; }
      .phase-pill { align-self: flex-start; }
      .groups-grid { grid-template-columns: 1fr; }
      .wa-qr-card { grid-template-columns: 1fr; }
      .wa-qr-image { justify-self: start; }
      .inline-grid { grid-template-columns: 1fr; }
      .manual-image-grid { grid-template-columns: 1fr; }
      .manual-pair-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 640px) {
      .wrap { padding: 0 10px; }
      .hero { padding: 16px; border-radius: 16px; }
      .card { padding: 12px; border-radius: 12px; }
      .panel-btn { flex: 1 1 calc(50% - 8px); }
      .panel-nav { top: 6px; }
    }

/* ===== Source: bidcenter-dashboard-app.css ===== */
    :root {
      --bc-panel-radius: 16px;
      --bc-field-height: 42px;
      --bc-page-max: 1168px;
      --bc-shell-gap: 14px;
      --bc-card-padding: 14px;
      --bc-header-height: 80px;
      --bc-gap-1: 8px;
      --bc-gap-2: 12px;
      --bc-gap-3: 16px;
      --bc-gap-4: 20px;
      --bc-ring: 0 0 0 3px rgba(212, 148, 90, 0.22);
      --bc-surface-shadow: 0 14px 34px var(--shadow);
    }

    body {
      font-family: "Manrope", "Segoe UI", sans-serif;
      background:
        radial-gradient(1200px 420px at -12% -8%, rgba(212, 148, 90, 0.12), transparent 45%),
        radial-gradient(1000px 360px at 108% 0%, rgba(201, 132, 90, 0.1), transparent 42%),
        var(--bg-primary);
      color: var(--text-primary);
    }

    h1, h2, h3, h4, .logo-text, .section-title, .nav-label, .dashboard-plan strong, .phase-pill {
      font-family: "Sora", "Manrope", "Segoe UI", sans-serif;
      letter-spacing: 0.1px;
    }

    .dashboard {
      grid-template-columns: minmax(0, 1fr);
      min-height: 100vh;
    }

    .sidebar,
    .sidebar-overlay,
    .mobile-menu-toggle {
      display: none !important;
    }

    .workspace-nav {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
      min-width: 0;
      overflow: visible;
    }

    .workspace-menu {
      position: relative;
    }

    .workspace-trigger {
      min-height: 36px !important;
      border-radius: 10px !important;
      padding: 0 14px !important;
      display: inline-flex !important;
      align-items: center;
      gap: 7px;
      font-size: 14px !important;
      letter-spacing: 0.1px;
      font-weight: 800 !important;
      border: 1px solid transparent !important;
      background: transparent !important;
      color: var(--text-secondary) !important;
      box-shadow: none;
    }

    .workspace-trigger:not(.active) {
      border-color: transparent !important;
      background: transparent !important;
      color: var(--text-secondary) !important;
      box-shadow: none !important;
    }

    .workspace-trigger::after {
      content: "▾";
      font-size: 11px;
      opacity: 0.72;
    }

    .workspace-trigger:hover,
    .workspace-trigger.active {
      background: color-mix(in oklab, var(--success) 16%, transparent) !important;
      color: var(--success) !important;
      border-color: color-mix(in oklab, var(--success) 32%, transparent) !important;
      box-shadow: none;
    }

    .workspace-menu-panel {
      position: absolute;
      top: calc(100% + 10px);
      left: -14px;
      min-width: 520px;
      padding: 22px 24px;
      border-radius: 0 0 22px 22px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 82%, rgba(255,255,255,0.05));
      border-top: 0;
      background:
        linear-gradient(180deg, color-mix(in oklab, var(--bg-card) 96%, rgba(255,255,255,0.02) 4%), color-mix(in oklab, var(--bg-card) 98%, #101317 2%));
      box-shadow: 0 24px 48px rgba(6, 9, 16, 0.34);
      backdrop-filter: blur(16px);
      display: none;
      grid-template-columns: repeat(2, minmax(200px, 1fr));
      gap: 22px;
    }

    .workspace-menu.open .workspace-menu-panel {
      display: grid;
      animation: fadeInUp 160ms ease;
    }

    .workspace-col {
      display: grid;
      gap: 8px;
      align-content: start;
    }

    .workspace-title {
      margin: 0 0 4px;
      font-size: 13px;
      font-weight: 800;
      color: var(--bc-text);
    }

    .workspace-link {
      border: 0;
      background: transparent;
      color: var(--bc-muted);
      text-align: left;
      font-size: 14px;
      font-weight: 700;
      padding: 6px 0;
      cursor: pointer;
    }

    .workspace-link:hover,
    .workspace-link.active {
      color: var(--success);
    }

    .sidebar {
      padding: 24px 18px;
      border-right: 1px solid var(--border);
      background: linear-gradient(180deg, var(--bg-secondary), color-mix(in oklab, var(--bg-secondary) 82%, #000 18%));
      display: flex;
      flex-direction: column;
    }

    .sidebar .logo {
      margin-bottom: 28px;
      padding: 12px 14px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: color-mix(in oklab, var(--bg-card) 88%, transparent);
      display: flex;
      align-items: center;
      gap: 10px;
      cursor: pointer;
      transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
    }

    .sidebar .logo:hover {
      transform: translateY(-1px);
      border-color: color-mix(in oklab, var(--accent-copper) 45%, var(--border));
      background: var(--bg-card-hover);
    }

    .brand-logo-img {
      display: block;
      max-width: 100%;
      height: auto;
    }

    .sidebar-brand-logo {
      width: min(190px, 100%);
    }

    .sidebar .nav-label {
      color: var(--text-muted);
      text-transform: uppercase;
      letter-spacing: 0.45px;
      font-size: 11px;
      font-weight: 800;
      margin: 0 0 6px 10px;
    }

    .sidebar .nav-item.panel-btn {
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-card);
      color: var(--text-secondary);
      min-height: 40px;
      font-size: 13px;
      padding: 0 12px;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 6px;
      transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
    }

    .sidebar .nav-item.panel-btn:hover {
      transform: translateY(-1px);
      border-color: color-mix(in oklab, var(--accent-copper) 45%, var(--border));
      color: var(--text-primary);
      background: var(--bg-card-hover);
    }

    .sidebar .nav-item.panel-btn.active {
      border-color: color-mix(in oklab, var(--accent-copper) 50%, #ffffff 8%);
      background: var(--accent-gradient);
      color: #191919;
      box-shadow: 0 10px 20px rgba(184, 115, 51, 0.25);
    }

    .sidebar .nav-section {
      flex: 1 1 auto;
    }

    .main-content {
      position: relative;
      padding: 20px 24px 36px;
      overflow: auto;
      background:
        radial-gradient(900px 380px at 12% -8%, rgba(43, 122, 255, 0.12), transparent 48%),
        radial-gradient(760px 320px at 92% -6%, rgba(71, 214, 122, 0.09), transparent 42%),
        linear-gradient(180deg, color-mix(in oklab, var(--bg-primary) 92%, #08152d 8%), var(--bg-primary));
    }

    .main-content::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        linear-gradient(180deg, rgba(255,255,255,0.04), transparent 18%),
        radial-gradient(circle at top left, rgba(255,255,255,0.035), transparent 28%);
      opacity: 0.9;
    }

    .header {
      position: sticky;
      top: 8px;
      z-index: 30;
      max-width: var(--bc-page-max);
      margin-left: auto;
      margin-right: auto;
      margin-bottom: 14px;
      min-height: 72px;
      padding: 10px 16px;
      border: 1px solid color-mix(in oklab, var(--border) 74%, rgba(255,255,255,0.06));
      border-radius: 0 0 24px 24px;
      background:
        linear-gradient(180deg, color-mix(in oklab, var(--bg-card) 94%, rgba(255,255,255,0.03) 6%), color-mix(in oklab, var(--bg-card) 98%, #0b0f15 2%));
      backdrop-filter: blur(14px);
      box-shadow: 0 18px 42px rgba(5, 16, 34, 0.22);
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      grid-template-areas:
        "brand . actions"
        "nav nav nav";
      align-items: center;
      gap: 12px 16px;
    }

    .header-left {
      grid-area: brand;
      display: inline-flex;
      align-items: center;
      gap: 12px;
      min-width: 0;
    }

    .header-brand {
      border: 0;
      background: transparent;
      padding: 0;
      display: inline-flex;
      align-items: center;
      cursor: pointer;
    }

    .header-brand-logo {
      width: min(156px, 18vw);
    }

    .header-subtitle {
      display: none;
    }

    .header-business {
      min-height: 38px;
      padding: 0 14px;
      border-radius: 12px;
      border: 1px solid color-mix(in oklab, var(--border) 84%, transparent);
      background: color-mix(in oklab, var(--bg-secondary) 90%, transparent);
      color: var(--text-primary);
      font-size: 14px;
      font-weight: 800;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      pointer-events: none;
    }

    .header-business::after {
      content: "▾";
      font-size: 11px;
      opacity: 0.74;
    }

    .header-center {
      grid-area: nav;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      min-width: 0;
      padding-top: 6px;
      border-top: 1px solid color-mix(in oklab, var(--border) 74%, transparent);
    }

    .header-right {
      grid-area: actions;
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 12px;
      min-width: 0;
    }

    .header-search {
      width: 100%;
      min-height: 40px;
      border-radius: 12px;
      border: 1px solid color-mix(in oklab, var(--border) 84%, transparent);
      background: color-mix(in oklab, var(--bg-secondary) 92%, transparent);
      color: var(--text-primary);
      padding: 0 14px 0 38px;
      font-size: 14px;
      outline: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2391a1bb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 4 4'/%3E%3C/svg%3E");
      background-repeat: no-repeat;
      background-position: 14px center;
    }

    .header-utility-row {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      flex: 0 0 auto;
    }

    .header-utility-btn {
      width: 34px;
      height: 34px;
      border-radius: 10px;
      border: 1px solid transparent;
      background: transparent;
      color: var(--text-secondary);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 15px;
    }

    .header-utility-btn:hover {
      border-color: color-mix(in oklab, var(--border) 84%, transparent);
      background: color-mix(in oklab, var(--bg-secondary) 88%, transparent);
      color: var(--text-primary);
    }

    .content-wrapper {
      position: relative;
      z-index: 1;
      max-width: var(--bc-page-max);
      width: 100%;
      margin: 0 auto;
      display: grid;
      gap: 18px;
      align-content: start;
    }

    /* Base contract for current and future tabs/subtabs:
       Any new panel should use .app-panel + .card + .inline-grid to inherit this UI rhythm */
    .app-panel {
      max-width: 100%;
      margin: 0;
      display: none;
    }

    .app-panel.active {
      display: block;
      animation: fadeInUp 180ms ease;
    }

    .app-panel > main {
      width: 100%;
    }

    .app-panel > main.layout,
    .app-panel > main.stack {
      margin: 0;
      width: 100%;
      display: grid;
      gap: 18px;
      align-content: start;
    }

    .app-panel .stack {
      gap: 18px;
    }

    .app-panel .card,
    .options-pane .card {
      border-radius: var(--bc-panel-radius);
      padding: var(--bc-card-padding);
    }

    .app-panel .inline-grid {
      gap: var(--bc-gap-2);
    }

    .app-panel .row {
      gap: var(--bc-gap-1);
    }

    .app-panel .options-pane {
      max-width: 100%;
      margin: 0;
    }

    .options-pane {
      margin-top: 0;
    }

    .options-pane.active {
      display: grid;
      gap: var(--bc-shell-gap);
      animation: fadeInUp 180ms ease;
    }

    .bidcenter-content { display: block !important; }

    .phase-pill {
      border: 1px solid var(--border);
      background: var(--accent-gradient);
      color: #1a1a1a;
      border-radius: 999px;
      min-height: 34px;
      padding: 0 12px;
      font-size: 11px;
      font-weight: 700;
      display: inline-flex;
      align-items: center;
      line-height: 1;
      white-space: nowrap;
    }

    .panel-btn { cursor: pointer; }
    .panel-btn i.nav-icon {
      width: 18px;
      min-width: 18px;
      text-align: center;
    }

    .theme-switch {
      position: relative;
      width: 48px;
      height: 26px;
      border-radius: 999px;
      border: 1px solid var(--border);
      background: var(--bg-card-hover);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
      cursor: pointer;
      transition: border-color 0.16s ease, background 0.16s ease;
      outline: none;
    }

    .theme-switch::after {
      content: "";
      position: absolute;
      top: 2px;
      left: 2px;
      width: 20px;
      height: 20px;
      border-radius: 999px;
      background: #ffffff;
      transition: transform 0.2s ease, background 0.2s ease;
    }

    .theme-switch:focus-visible {
      box-shadow: var(--bc-ring);
    }

    .theme-switch.active {
      background: var(--accent-gradient);
      border-color: color-mix(in oklab, var(--accent-copper) 60%, var(--border));
    }

    .theme-switch.active::after {
      transform: translateX(22px);
      background: #1d1d1f;
    }

    html[data-theme="light"] .theme-switch {
      background: var(--bg-card-hover);
    }

    html[data-theme="light"] .theme-switch::after {
      transform: translateX(0);
      background: #ffffff;
    }

    html[data-theme="light"] .theme-switch.active::after {
      transform: translateX(22px);
      background: #ffffff;
    }

    .user-menu {
      position: relative;
      display: flex;
      align-items: center;
      gap: 11px;
      cursor: pointer;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--bg-card);
      padding: 7px 10px 7px 8px;
      box-shadow: 0 8px 20px var(--shadow);
      transition: border-color 0.16s ease, transform 0.16s ease, background 0.16s ease;
      min-height: 48px;
    }

    .user-avatar {
      width: 34px;
      height: 34px;
      border-radius: 10px;
      display: inline-grid;
      place-items: center;
      font-size: 14px;
      font-weight: 800;
      color: #1a1a1a;
      background: var(--accent-gradient);
      flex: 0 0 auto;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      overflow: hidden;
    }

    .user-avatar.has-logo {
      color: transparent;
      text-indent: -999px;
      background-size: contain;
      background-color: rgba(255,255,255,0.96);
      background-origin: content-box;
      padding: 4px;
    }

    .dashboard-home {
      display: block;
      padding: 6px 0 0;
    }

    .dashboard-shell {
      display: grid;
      grid-template-columns: minmax(320px, 360px) minmax(0, 1fr);
      gap: 18px;
      align-items: start;
    }

    .dashboard-sidebar {
      display: grid;
      gap: 16px;
      position: sticky;
      top: 112px;
      align-content: start;
    }

    .dashboard-surface {
      position: relative;
      overflow: hidden;
      border: 1px solid rgba(157, 181, 216, 0.14);
      border-radius: 22px;
      background:
        linear-gradient(180deg, rgba(22, 48, 88, 0.98), rgba(14, 35, 68, 0.98));
      box-shadow:
        0 18px 42px rgba(5, 18, 37, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
    }

    .dashboard-surface::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(circle at top right, rgba(255,255,255,0.05), transparent 24%),
        linear-gradient(180deg, rgba(255,255,255,0.02), transparent 30%);
    }

    .admin-panel-card {
      padding: 18px;
      display: grid;
      gap: 18px;
    }

    .admin-panel-head {
      display: flex;
      align-items: center;
      gap: 14px;
      min-width: 0;
    }

    .dashboard-avatar {
      width: 58px;
      height: 58px;
      border-radius: 18px;
      display: grid;
      place-items: center;
      font-size: 22px;
      font-weight: 800;
      background: var(--accent-gradient);
      color: #1b1b1f;
      flex: 0 0 auto;
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      overflow: hidden;
      box-shadow: 0 12px 24px rgba(212, 148, 90, 0.16);
    }

    .dashboard-avatar.has-logo {
      color: transparent;
      text-indent: -999px;
      background-size: contain;
      background-color: rgba(255,255,255,0.96);
      background-origin: content-box;
      padding: 6px;
    }

    .admin-panel-title {
      min-width: 0;
      display: grid;
      gap: 2px;
    }

    .admin-panel-title h3 {
      margin: 0;
      font-size: 24px;
      line-height: 1.05;
      color: var(--text-primary);
      font-weight: 800;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .admin-panel-title p {
      margin: 0;
      font-size: 13px;
      color: var(--text-secondary);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .admin-panel-phase {
      border: 1px solid rgba(157, 181, 216, 0.16);
      border-radius: 18px;
      background: rgba(19, 48, 91, 0.62);
      padding: 14px 15px;
      display: grid;
      gap: 4px;
    }

    .admin-panel-phase span {
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #8bb2f1;
    }

    .admin-panel-phase strong {
      font-size: 20px;
      font-weight: 800;
      line-height: 1.1;
      color: #f4f8ff;
    }

    .admin-panel-phase p {
      margin: 0;
      font-size: 13px;
      color: var(--text-secondary);
      line-height: 1.45;
    }

    .dashboard-action-stack {
      display: grid;
      gap: 10px;
    }

    .dashboard-action-btn {
      min-height: 48px !important;
      border-radius: 14px !important;
      padding: 0 14px !important;
      display: inline-flex !important;
      align-items: center;
      justify-content: center;
      gap: 10px;
      font-size: 14px !important;
      font-weight: 800 !important;
      letter-spacing: 0.01em;
    }

    .dashboard-action-btn i {
      font-size: 15px;
    }

    .dashboard-action-btn.primary {
      background: linear-gradient(120deg, #d4945a, #efbf83) !important;
      color: #1d1409 !important;
      border: 1px solid transparent !important;
      box-shadow: 0 16px 28px rgba(212, 148, 90, 0.22);
    }

    .dashboard-action-btn.primary:hover {
      box-shadow: 0 18px 30px rgba(212, 148, 90, 0.28);
    }

    .dashboard-action-btn.secondary {
      background: rgba(19, 48, 91, 0.54) !important;
      color: var(--text-primary) !important;
      border: 1px solid rgba(157, 181, 216, 0.16) !important;
    }

    .dashboard-note-card {
      padding: 14px 16px;
      display: grid;
      gap: 8px;
      color: var(--text-secondary);
      font-size: 13px;
      line-height: 1.5;
    }

    .dashboard-note-card strong {
      color: var(--text-primary);
      font-size: 15px;
    }

    .dashboard-main-grid {
      display: grid;
      gap: 18px;
      align-content: start;
    }

    .dashboard-hero {
      padding: 20px 22px 22px;
      display: grid;
      gap: 18px;
    }

    .dashboard-hero-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 16px;
      flex-wrap: wrap;
    }

    .dashboard-hero-copy {
      display: grid;
      gap: 6px;
      max-width: 720px;
    }

    .dashboard-hero-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 11px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: #8eb3ef;
    }

    .dashboard-hero-copy h2 {
      margin: 0;
      font-size: clamp(26px, 2.4vw, 34px);
      line-height: 1.02;
      color: #f7fbff;
      font-weight: 800;
    }

    .dashboard-hero-copy p {
      margin: 0;
      font-size: 14px;
      color: var(--text-secondary);
      line-height: 1.55;
    }

    .dashboard-hero-badges {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      justify-content: flex-end;
    }

    .dashboard-chip,
    .status-badge {
      border-radius: 999px;
      padding: 6px 10px;
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .dashboard-chip {
      border: 1px solid rgba(157, 181, 216, 0.16);
      background: rgba(19, 48, 91, 0.52);
      color: #f2f6ff;
    }

    .dashboard-chip i {
      font-size: 10px;
    }

    .status-badge.neutral {
      color: #dce9fb;
      background: rgba(157, 181, 216, 0.14);
      border: 1px solid rgba(157, 181, 216, 0.14);
    }

    .status-badge.success {
      color: #c8f7da;
      background: rgba(46, 189, 115, 0.16);
      border: 1px solid rgba(46, 189, 115, 0.18);
    }

    .status-badge.warn {
      color: #ffd7a8;
      background: rgba(212, 148, 90, 0.16);
      border: 1px solid rgba(212, 148, 90, 0.2);
    }

    .status-badge.danger {
      color: #ffc5ba;
      background: rgba(239, 143, 115, 0.16);
      border: 1px solid rgba(239, 143, 115, 0.18);
    }

    .status-badge.info {
      color: #cae7ff;
      background: rgba(61, 142, 255, 0.16);
      border: 1px solid rgba(61, 142, 255, 0.18);
    }

    .hero-status-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
    }

    .status-mini-card {
      border: 1px solid rgba(157, 181, 216, 0.14);
      border-radius: 18px;
      padding: 15px;
      background: rgba(20, 47, 88, 0.6);
      display: grid;
      gap: 8px;
      min-height: 110px;
    }

    .status-mini-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }

    .status-mini-icon {
      width: 34px;
      height: 34px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      background: rgba(255,255,255,0.06);
      color: #ecf4ff;
      font-size: 15px;
    }

    .status-mini-label {
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #8eb3ef;
    }

    .status-mini-value {
      font-size: 20px;
      line-height: 1.1;
      color: #f6f9ff;
      font-weight: 800;
    }

    .status-mini-meta {
      font-size: 12px;
      color: var(--text-secondary);
    }

    .hero-secondary-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .hero-secondary-card {
      border: 1px solid rgba(157, 181, 216, 0.14);
      border-radius: 16px;
      padding: 14px 15px;
      background: rgba(17, 40, 77, 0.48);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
    }

    .hero-secondary-card span {
      font-size: 12px;
      color: #8eb3ef;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }

    .hero-secondary-card strong {
      font-size: 14px;
      color: #edf5ff;
    }

    .dashboard-content-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
      gap: 18px;
      align-items: start;
    }

    .dashboard-column {
      display: grid;
      gap: 18px;
      align-content: start;
    }

    .dashboard-card {
      padding: 18px;
      display: grid;
      gap: 14px;
    }

    .dashboard-card-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
    }

    .dashboard-card-head h3 {
      margin: 0;
      font-size: 20px;
      line-height: 1.08;
      font-weight: 800;
      color: #f7fbff;
    }

    .dashboard-card-subtitle {
      margin: 4px 0 0;
      font-size: 13px;
      color: var(--text-secondary);
      line-height: 1.55;
      max-width: 620px;
    }

    .dashboard-link-btn {
      min-height: 38px !important;
      padding: 0 14px !important;
      border-radius: 12px !important;
      background: rgba(19, 48, 91, 0.58) !important;
      border: 1px solid rgba(157, 181, 216, 0.16) !important;
      color: #eff5ff !important;
      display: inline-flex !important;
      align-items: center;
      gap: 8px;
    }

    .dashboard-empty {
      border: 1px dashed rgba(157, 181, 216, 0.2);
      border-radius: 18px;
      padding: 18px;
      background: rgba(19, 48, 91, 0.34);
      display: grid;
      gap: 10px;
    }

    .dashboard-empty strong {
      font-size: 18px;
      color: #f2f7ff;
    }

    .dashboard-empty p {
      margin: 0;
      font-size: 13px;
      color: var(--text-secondary);
      line-height: 1.55;
    }

    .auction-metric-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
    }

    .auction-metric {
      border: 1px solid rgba(157, 181, 216, 0.14);
      border-radius: 16px;
      padding: 14px;
      background: rgba(18, 44, 82, 0.5);
      display: grid;
      gap: 6px;
    }

    .auction-metric span {
      font-size: 11px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: #8eb3ef;
    }

    .auction-metric strong {
      font-size: 22px;
      color: #f7fbff;
      line-height: 1;
    }

    .auction-metric small {
      color: var(--text-secondary);
      font-size: 12px;
    }

    .metric-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .metric-card {
      border: 1px solid rgba(157, 181, 216, 0.14);
      border-radius: 16px;
      padding: 15px;
      background: rgba(18, 44, 82, 0.56);
      display: grid;
      gap: 8px;
    }

    .metric-card-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }

    .metric-card label {
      margin: 0;
      font-size: 11px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: #8eb3ef;
    }

    .metric-card strong {
      font-size: 18px;
      color: #f4f8ff;
      line-height: 1.15;
    }

    .metric-card p {
      margin: 0;
      font-size: 12px;
      color: var(--text-secondary);
      line-height: 1.5;
    }

    .metric-pill {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      border: 1px solid rgba(157, 181, 216, 0.14);
      border-radius: 16px;
      padding: 12px 14px;
      background: rgba(18, 44, 82, 0.52);
      font-size: 13px;
      color: #edf5ff;
      font-weight: 700;
    }

    .metric-pill i {
      color: #8eb3ef;
    }

    .checklist {
      list-style: none;
      margin: 0;
      padding: 0;
      display: grid;
      gap: 10px;
    }

    .checklist-item {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      align-items: center;
      gap: 12px;
      border: 1px solid rgba(157, 181, 216, 0.14);
      border-radius: 16px;
      padding: 14px 15px;
      background: rgba(18, 44, 82, 0.52);
    }

    .checklist-indicator {
      width: 34px;
      height: 34px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      font-size: 15px;
      background: rgba(255,255,255,0.05);
    }

    .checklist-item.success .checklist-indicator {
      color: #7fe0a6;
      background: rgba(46, 189, 115, 0.16);
    }

    .checklist-item.warn .checklist-indicator {
      color: #ffcb8f;
      background: rgba(212, 148, 90, 0.16);
    }

    .checklist-item.neutral .checklist-indicator {
      color: #9db5d8;
      background: rgba(157, 181, 216, 0.12);
    }

    .checklist-copy strong {
      display: block;
      font-size: 15px;
      color: #f4f8ff;
      line-height: 1.15;
      margin-bottom: 4px;
    }

    .checklist-copy p {
      margin: 0;
      font-size: 12px;
      color: var(--text-secondary);
      line-height: 1.45;
    }

    .checklist-action {
      border: 0;
      background: transparent;
      color: #9fc1f2;
      font-weight: 700;
      padding: 0;
      min-height: 0;
    }

    .activity-feed {
      list-style: none;
      margin: 0;
      padding: 0;
      display: grid;
      gap: 10px;
    }

    .activity-item {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      gap: 12px;
      align-items: start;
      padding: 14px 15px;
      border-radius: 16px;
      border: 1px solid rgba(157, 181, 216, 0.14);
      background: rgba(18, 44, 82, 0.5);
    }

    .activity-bullet {
      width: 12px;
      height: 12px;
      border-radius: 999px;
      margin-top: 5px;
      background: #3d8cff;
      box-shadow: 0 0 0 4px rgba(61, 142, 255, 0.14);
    }

    .activity-item.success .activity-bullet {
      background: #2ebd73;
      box-shadow: 0 0 0 4px rgba(46, 189, 115, 0.14);
    }

    .activity-item.warn .activity-bullet {
      background: #d4945a;
      box-shadow: 0 0 0 4px rgba(212, 148, 90, 0.14);
    }

    .activity-copy strong {
      display: block;
      margin-bottom: 4px;
      color: #f4f8ff;
      font-size: 14px;
    }

    .activity-copy p {
      margin: 0;
      color: var(--text-secondary);
      font-size: 12px;
      line-height: 1.5;
    }

    .activity-time {
      color: #8eb3ef;
      font-size: 11px;
      font-weight: 700;
      white-space: nowrap;
      padding-top: 2px;
    }

    .dashboard-section-grid {
      display: grid;
      gap: 18px;
    }

    .dashboard-status-row {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }

    @media (max-width: 1380px) {
      .hero-status-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .auction-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 1180px) {
      .dashboard-shell,
      .dashboard-content-grid {
        grid-template-columns: 1fr;
      }

      .dashboard-sidebar {
        position: static;
      }
    }

    @media (max-width: 780px) {
      .hero-status-grid,
      .hero-secondary-grid,
      .metric-grid,
      .auction-metric-grid {
        grid-template-columns: 1fr;
      }

      .dashboard-hero,
      .dashboard-card,
      .admin-panel-card {
        padding: 16px;
      }
    }


    .user-info {
      min-width: 0;
      display: grid;
      gap: 1px;
    }

    .user-name {
      font-size: 13px;
      line-height: 1.15;
      font-weight: 700;
      color: var(--text-primary);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .user-role {
      font-size: 11px;
      color: var(--text-muted);
      line-height: 1.15;
    }

    .user-menu:hover {
      border-color: color-mix(in oklab, var(--accent-copper) 45%, var(--border));
      transform: translateY(-1px);
      background: var(--bg-card-hover);
    }

    .user-dropdown {
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      width: 320px;
      max-width: min(92vw, 360px);
      border: 1px solid var(--border);
      border-radius: 14px;
      background: color-mix(in oklab, var(--bg-card) 92%, transparent);
      box-shadow: 0 18px 40px rgba(0, 0, 0, 0.34);
      backdrop-filter: blur(12px);
      padding: 10px;
      display: none;
      z-index: 90;
      cursor: default;
    }

    .user-menu.open .user-dropdown {
      display: grid;
      gap: 8px;
    }

    .user-dropdown-header {
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-secondary);
      padding: 10px;
      display: grid;
      gap: 2px;
    }

    .user-dropdown-name {
      font-size: 14px;
      font-weight: 700;
      color: var(--text-primary);
      line-height: 1.25;
      word-break: break-word;
    }

    .user-dropdown-role {
      font-size: 12px;
      color: var(--text-secondary);
    }

    .user-dropdown-item {
      width: 100%;
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-secondary);
      color: var(--text-primary);
      text-align: left;
      min-height: 38px;
      padding: 0 12px;
      display: flex;
      align-items: center;
      gap: 8px;
      font-weight: 700;
      cursor: pointer;
      transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
    }

    .user-dropdown-item:hover {
      background: var(--bg-card-hover);
      border-color: color-mix(in oklab, var(--accent-copper) 45%, var(--border));
      transform: translateY(-1px);
    }

    .user-dropdown-menu {
      display: grid;
      gap: 4px;
      padding-bottom: 2px;
      border-bottom: 1px solid var(--border);
    }

    .user-dropdown-plan {
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-secondary);
      padding: 8px 10px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }

    .user-plan-name {
      color: var(--text-primary);
      font-size: 13px;
      font-weight: 700;
    }

    .user-plan-btn {
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-secondary);
      color: var(--text-primary);
      font-size: 12px;
      min-height: 36px;
      padding: 0 12px;
      font-weight: 700;
      cursor: pointer;
      white-space: nowrap;
      transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
    }

    .user-plan-btn:hover {
      background: var(--bg-card-hover);
      border-color: color-mix(in oklab, var(--accent-copper) 45%, var(--border));
      transform: translateY(-1px);
    }

    .user-theme-row {
      justify-content: space-between;
      gap: 10px;
    }

    .profile-theme-switch {
      width: 44px;
      height: 24px;
      border-radius: 999px;
      border: 1px solid var(--border);
      background: #4b4d52;
      position: relative;
      flex: 0 0 auto;
    }

    .profile-theme-switch::after {
      content: "";
      position: absolute;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      top: 2px;
      left: 2px;
      background: #fff;
      transition: transform 0.2s ease;
    }

    html[data-theme="light"] .profile-theme-switch {
      background: #d0d6e3;
    }

    html[data-theme="dark"] .profile-theme-switch {
      background: #33c283;
    }

    html[data-theme="dark"] .profile-theme-switch::after {
      transform: translateX(20px);
    }

    .content-wrapper .card {
      position: relative;
      background:
        radial-gradient(circle at top right, rgba(255,255,255,0.035), transparent 22%),
        linear-gradient(180deg, color-mix(in oklab, var(--bg-card) 88%, rgba(255,255,255,0.02) 12%), color-mix(in oklab, var(--bg-card) 98%, #091221 2%));
      border: 1px solid color-mix(in oklab, var(--border) 82%, rgba(255,255,255,0.05));
      color: var(--text-primary);
      border-radius: 22px;
      padding: 18px;
      box-shadow: 0 18px 42px rgba(5, 16, 34, 0.18);
      margin-bottom: 0;
      overflow: hidden;
    }

    .content-wrapper .card::before {
      content: "";
      position: absolute;
      inset: 0 auto auto 0;
      width: 100%;
      height: 1px;
      background: linear-gradient(90deg, rgba(255,255,255,0.12), transparent 65%);
      pointer-events: none;
    }

    .content-wrapper .card h2 {
      margin: 0 0 8px;
      font-size: clamp(19px, 1.45vw, 24px);
      line-height: 1.08;
      font-weight: 800;
      color: var(--text-primary);
      letter-spacing: 0.08px;
    }

    .content-wrapper #panel-auction .card h2,
    .content-wrapper #panel-auction .section-title,
    .content-wrapper #panel-auction .auction-fold > summary {
      font-size: clamp(16px, 1.1vw, 21px);
      line-height: 1.16;
    }

    .content-wrapper .card h3 {
      margin: 0 0 6px;
      font-size: 14px;
      font-weight: 800;
      color: var(--text-primary);
      letter-spacing: 0.08px;
    }

    .content-wrapper .section-title,
    .content-wrapper .company-section-title {
      font-size: 13px;
      font-weight: 800;
      color: var(--text-primary);
      letter-spacing: 0.12px;
      text-transform: uppercase;
    }

    .content-wrapper .muted,
    .content-wrapper .subhead,
    .content-wrapper .quick-caption {
      font-size: 12px;
      line-height: 1.5;
    }

    .content-wrapper label,
    .content-wrapper .muted,
    .content-wrapper .subhead,
    .content-wrapper .quick-caption {
      color: var(--text-secondary) !important;
    }

    .content-wrapper input,
    .content-wrapper select,
    .content-wrapper textarea {
      background: var(--bg-secondary);
      border: 1px solid var(--border);
      color: var(--text-primary);
      border-radius: 10px;
      min-height: var(--bc-field-height);
      padding: 0 12px;
      transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
    }

    .content-wrapper input::placeholder,
    .content-wrapper textarea::placeholder {
      color: var(--text-muted);
    }

    .content-wrapper input:focus,
    .content-wrapper select:focus,
    .content-wrapper textarea:focus {
      outline: none;
      border-color: color-mix(in oklab, var(--accent-copper) 55%, var(--border));
      box-shadow: var(--bc-ring);
      background: color-mix(in oklab, var(--bg-secondary) 88%, #ffffff 12%);
    }

    .content-wrapper textarea {
      min-height: 118px;
      padding: 10px 12px;
      resize: vertical;
    }

    .content-wrapper button {
      border: 1px solid transparent;
      background: var(--accent-gradient);
      color: #1a1a1a;
      font-weight: 700;
      min-height: var(--bc-field-height);
      border-radius: 10px;
      padding: 0 14px;
      transition: transform 0.16s ease, filter 0.16s ease, border-color 0.16s ease, background 0.16s ease;
    }

    .content-wrapper button.secondary,
    .content-wrapper button.options-btn,
    .content-wrapper button.ghost,
    .content-wrapper button.danger {
      background: var(--bg-secondary);
      border-color: var(--border);
      color: var(--text-primary);
    }

    .content-wrapper button:hover {
      filter: brightness(1.04);
      transform: translateY(-1px);
    }

    .content-wrapper button:active {
      transform: translateY(0);
    }

    .content-wrapper input[type="file"] {
      min-height: var(--bc-field-height);
      padding: 0 8px 0 0;
      line-height: calc(var(--bc-field-height) - 2px);
    }

    .content-wrapper input[type="file"]::file-selector-button {
      height: calc(var(--bc-field-height) - 8px);
      margin: 3px 8px 3px 3px;
      border: 1px solid var(--border);
      border-radius: 8px;
      background: var(--bg-secondary);
      color: var(--text-primary);
      font-family: inherit;
      font-size: 12px;
      font-weight: 700;
      padding: 0 11px;
      cursor: pointer;
      transition: background 0.16s ease, border-color 0.16s ease;
    }

    .content-wrapper input[type="file"]::file-selector-button:hover {
      background: var(--bg-card-hover);
      border-color: color-mix(in oklab, var(--accent-copper) 45%, var(--border));
    }

    .content-wrapper .group-panel,
    .content-wrapper .group-list,
    .content-wrapper .manual-group-list,
    .content-wrapper .manual-image-card,
    .content-wrapper .manual-inbox-card,
    .content-wrapper .manual-pair-card,
    .content-wrapper .manual-pair-photo,
    .content-wrapper .manual-option-row,
    .content-wrapper .schedule-list,
    .content-wrapper .substitute-list,
    .content-wrapper .logo-preview-wrap,
    .content-wrapper .template-preview-wrap,
    .content-wrapper pre {
      background: linear-gradient(180deg, color-mix(in oklab, var(--bg-secondary) 72%, #225a92 28%), color-mix(in oklab, var(--bg-card) 90%, #14345a 10%));
      border-color: color-mix(in oklab, var(--border) 82%, rgba(255,255,255,0.04));
      color: var(--text-primary);
      border-radius: 16px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.02);
    }

    .content-wrapper .group-item:hover,
    .content-wrapper .schedule-item:hover,
    .content-wrapper .manual-group-item:hover {
      background: color-mix(in oklab, var(--bg-card-hover) 88%, rgba(255,255,255,0.03) 12%);
      transform: translateY(-1px);
    }

    .content-wrapper .manual-pair-card {
      position: relative;
      transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        border-color 180ms ease,
        opacity 180ms ease,
        background-color 180ms ease;
      transform-origin: center center;
    }

    .content-wrapper .manual-pair-card::after {
      content: "";
      position: absolute;
      inset: -2px;
      border-radius: 18px;
      border: 2px dashed transparent;
      pointer-events: none;
      opacity: 0;
      transition: border-color 180ms ease, opacity 180ms ease;
    }

    .content-wrapper .manual-pair-card.dragging {
      opacity: 0.42;
      transform: scale(0.985) rotate(-1deg);
      box-shadow: 0 22px 42px rgba(0, 0, 0, 0.34);
    }

    .content-wrapper .manual-pair-card.drag-over {
      transform: translateY(-6px) scale(1.012);
      border-color: color-mix(in oklab, var(--accent) 78%, white 22%);
      box-shadow:
        0 18px 38px rgba(0, 0, 0, 0.26),
        0 0 0 1px color-mix(in oklab, var(--accent) 64%, white 36%);
      background:
        linear-gradient(
          180deg,
          color-mix(in oklab, var(--bg-secondary) 78%, var(--accent) 22%),
          color-mix(in oklab, var(--bg-card) 88%, var(--accent-soft) 12%)
        );
    }

    .content-wrapper .manual-pair-card.drag-over::after {
      opacity: 1;
      border-color: color-mix(in oklab, var(--accent-soft) 78%, white 22%);
    }

    .content-wrapper .substitute-item {
      border-bottom-color: var(--border);
      color: var(--text-primary);
    }

    .content-wrapper .group-main,
    .content-wrapper .schedule-title,
    .content-wrapper .batch-item-title {
      color: var(--text-primary);
    }

    .content-wrapper .group-jid,
    .content-wrapper .schedule-meta,
    .content-wrapper .batch-item-meta,
    .content-wrapper .manual-image-label,
    .content-wrapper .debug-card details summary,
    .content-wrapper .manual-inbox-meta {
      color: var(--text-secondary);
    }

    .row-end {
      align-items: end;
    }

    .mt-8 {
      margin-top: 8px;
    }

    .mt-10 {
      margin-top: 10px;
    }

    .mt-12 {
      margin-top: 12px;
    }

    .mb-8 {
      margin-bottom: 8px;
    }

    .summary-compact {
      cursor: pointer;
      font-weight: 700;
    }

    .checkline {
      margin: 0;
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }

    .label-tight {
      margin-bottom: 8px;
    }

    .maxw-90 {
      max-width: 90px;
    }

    .is-hidden {
      display: none !important;
    }

    .schedule-item.is-selected {
      border-left: 4px solid var(--accent-copper);
      background: color-mix(in oklab, var(--accent-copper) 18%, var(--bg-secondary));
      padding-left: 7px;
    }

    .schedule-form-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      width: 100%;
    }

    .schedule-form-actions button {
      width: 100%;
    }

    #panel-auction > main.stack {
      width: min(var(--bc-page-max), 100%);
      margin: 0 auto;
    }

    .auction-subnav-card {
      padding-bottom: 10px;
    }

    .auction-subnav {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 8px;
    }

    .auction-subbtn {
      min-height: 34px !important;
      border-radius: 10px !important;
      background: var(--bg-secondary) !important;
      border: 1px solid var(--border) !important;
      color: var(--text-primary) !important;
      font-size: 12px !important;
      font-weight: 700 !important;
      padding: 0 12px !important;
    }

    .auction-subbtn.active {
      background: var(--accent-gradient) !important;
      color: #1a1a1a !important;
      border-color: transparent !important;
      box-shadow: 0 8px 18px rgba(184, 115, 51, 0.22);
    }

    .auction-pane {
      display: none;
      gap: var(--bc-shell-gap);
      align-content: start;
    }

    .auction-pane.active {
      display: grid;
      animation: fadeInUp 170ms ease;
    }

    .billing-workspace-nav {
      display: grid;
      gap: 14px;
      margin-top: 8px;
    }

    .billing-module-row {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
    }

    .billing-subbtn,
    .billing-module-btn {
      min-height: 38px !important;
      border-radius: 14px !important;
      background: var(--bg-secondary) !important;
      border: 1px solid var(--border) !important;
      color: var(--text-primary) !important;
      font-size: 13px !important;
      font-weight: 800 !important;
      padding: 0 16px !important;
      display: inline-flex !important;
      align-items: center;
      gap: 8px;
    }

    .billing-subbtn.active,
    .billing-module-btn.active {
      background: var(--accent-gradient) !important;
      color: #1a1a1a !important;
      border-color: transparent !important;
      box-shadow: 0 8px 18px rgba(184, 115, 51, 0.22);
    }

    .billing-contextbar {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      padding: 10px;
      border-radius: 16px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 82%, transparent);
      background: color-mix(in oklab, var(--bg-card) 94%, #0d1b37 6%);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
    }

    .billing-context-link {
      border: 1px solid transparent;
      background: transparent;
      color: var(--bc-muted);
      text-align: left;
      font-size: 13px;
      font-weight: 700;
      padding: 10px 12px;
      border-radius: 12px;
      min-width: 180px;
      cursor: pointer;
      transition: 140ms ease;
    }

    .billing-context-link strong {
      display: block;
      font-size: 13px;
      color: inherit;
    }

    .billing-context-link small {
      display: block;
      font-size: 11px;
      opacity: 0.72;
      margin-top: 3px;
      font-weight: 500;
    }

    .billing-context-link:hover {
      border-color: color-mix(in oklab, var(--bc-line) 82%, transparent);
      background: color-mix(in oklab, var(--bg-secondary) 86%, transparent);
      color: var(--bc-text);
    }

    .billing-context-link.active {
      border-color: color-mix(in oklab, var(--success) 38%, var(--bc-line) 62%);
      background: color-mix(in oklab, var(--success) 12%, transparent);
      color: var(--success);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    }

    .billing-pane-shell {
      display: grid;
      gap: 18px;
    }

    .billing-hero-grid {
      display: grid;
      gap: 16px;
      grid-template-columns: 1.45fr 1fr;
    }

    .billing-hero-card {
      border-radius: 22px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 82%, transparent);
      background: linear-gradient(180deg, color-mix(in oklab, var(--bg-card) 96%, #102447 4%) 0%, color-mix(in oklab, var(--bg-secondary) 96%, #0a1327 4%) 100%);
      padding: 22px;
      display: grid;
      gap: 12px;
      min-height: 190px;
    }

    .billing-hero-card h3 {
      margin: 0;
      font-size: 24px;
      letter-spacing: -0.02em;
    }

    .billing-hero-card p {
      margin: 0;
      color: var(--bc-muted);
      line-height: 1.65;
    }

    .billing-hero-chiprow {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }

    .billing-hero-chip {
      padding: 8px 12px;
      border-radius: 999px;
      font-size: 12px;
      font-weight: 700;
      color: var(--bc-text);
      background: color-mix(in oklab, var(--bg-secondary) 82%, transparent);
      border: 1px solid color-mix(in oklab, var(--bc-line) 84%, transparent);
    }

    .billing-kpi-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .billing-kpi-card {
      padding: 16px;
      border-radius: 16px;
      border: 1px solid color-mix(in oklab, var(--bc-line) 84%, transparent);
      background: color-mix(in oklab, var(--bg-secondary) 90%, transparent);
      display: grid;
      gap: 6px;
    }

    .billing-kpi-card span {
      font-size: 11px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--bc-muted);
    }

    .billing-kpi-card strong {
      font-size: 24px;
      line-height: 1;
      color: var(--bc-text);
    }

    .billing-pane-grid {
      display: grid;
      gap: 18px;
      grid-template-columns: 1.3fr 1fr;
      align-items: start;
    }

    .billing-pane-grid.is-financeiro {
      grid-template-columns: 1.15fr 1fr;
    }

    @media (max-width: 1120px) {
      .billing-hero-grid,
      .billing-pane-grid,
      .billing-pane-grid.is-financeiro {
        grid-template-columns: 1fr;
      }

      .billing-customer-layout {
        grid-template-columns: 1fr;
      }

      .billing-page-grid,
      .billing-page-toolbar,
      .billing-customer-shell {
        grid-template-columns: 1fr;
      }

      .billing-context-link {
        min-width: 0;
        flex: 1 1 220px;
      }

      .billing-form-topbar {
        grid-template-columns: 1fr;
      }

      .billing-module-hero-head {
        grid-template-columns: 1fr;
      }

      .billing-stats-row {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 920px) {
      .billing-field-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .billing-form-shell .billing-field-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .billing-list-toolbar-filters.premium {
        grid-template-columns: 1fr;
      }

      .billing-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 640px) {
      .billing-list-toolbar-filters {
        grid-template-columns: 1fr;
      }

      .billing-field-grid {
        grid-template-columns: 1fr;
      }

      .billing-field-grid .span-2,
      .billing-field-grid .span-3 {
        grid-column: auto;
      }

      .billing-form-shell .billing-field-grid .span-2,
      .billing-form-shell .billing-field-grid .span-3,
      .billing-form-shell .billing-field-grid .span-4 {
        grid-column: auto;
      }

      .billing-filter-grid {
        grid-template-columns: 1fr;
      }
    }

    .billing-pane {
      display: none;
      gap: var(--bc-shell-gap);
      align-content: start;
    }

    .billing-pane.active {
      display: grid;
      animation: fadeInUp 170ms ease;
    }

    .billing-empty-state {
      border: 1px dashed color-mix(in oklab, var(--bc-line) 88%, transparent);
      border-radius: 16px;
      padding: 18px;
      background: color-mix(in oklab, var(--bg-card) 95%, transparent);
      color: var(--bc-muted);
    }

    .billing-empty-state strong {
      display: block;
      margin-bottom: 6px;
      color: var(--bc-text);
      font-size: 16px;
    }

    .billing-empty-state p {
      margin: 0;
      line-height: 1.6;
    }

    .target-summary {
      min-height: 26px;
      display: flex;
      align-items: center;
    }

    .manual-group-actions {
      justify-content: flex-start;
      align-items: center;
      gap: 8px;
      margin-top: 4px;
    }

    #panel-auction .manual-group-actions button {
      width: auto;
      min-height: 34px;
      padding: 0 12px;
      font-size: 12px;
      flex: 0 0 auto;
    }

    .dynamic-render .dynamic-item {
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-secondary);
      color: var(--text-primary);
    }

    .dynamic-render .dynamic-title {
      color: var(--text-primary);
      font-weight: 700;
    }

    .dynamic-render .dynamic-meta {
      color: var(--text-secondary);
      font-size: 12px;
      line-height: 1.35;
    }

    .status {
      border: 1px solid var(--border);
      background: color-mix(in oklab, var(--bg-secondary) 84%, transparent);
      color: var(--text-secondary);
      border-radius: 10px;
      min-height: 40px;
      display: flex;
      align-items: center;
    }
    .status.ok {
      background: rgba(107, 142, 107, 0.14);
      color: #8ec38e;
      border-color: rgba(107, 142, 107, 0.35);
    }
    .status.warn {
      background: rgba(194, 120, 120, 0.16);
      color: #e0a6a6;
      border-color: rgba(194, 120, 120, 0.4);
    }

    .options-nav,
    .tag-list {
      gap: 8px;
    }

    .options-nav {
      padding: 8px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: color-mix(in oklab, var(--bg-secondary) 86%, transparent);
      margin-bottom: 2px;
    }

    .options-nav .options-btn {
      min-height: 36px;
      padding: 0 11px;
      border-radius: 9px;
      font-size: 12px;
      font-weight: 700;
    }

    body:not(.authenticated) .requires-auth {
      display: none !important;
    }

    body:not(.authenticated) {
      background:
        radial-gradient(980px 540px at 0% 0%, rgba(50, 196, 111, 0.16), transparent 54%),
        radial-gradient(820px 420px at 100% 10%, rgba(69, 146, 240, 0.14), transparent 48%),
        radial-gradient(760px 360px at 50% 100%, rgba(14, 92, 190, 0.16), transparent 56%),
        linear-gradient(180deg, #eef9f1 0%, #f7fbff 58%, #f2f7fd 100%);
    }

    html[data-theme="dark"] body:not(.authenticated) {
      background:
        radial-gradient(980px 540px at 0% 0%, rgba(50, 196, 111, 0.13), transparent 54%),
        radial-gradient(820px 420px at 100% 10%, rgba(69, 146, 240, 0.12), transparent 48%),
        radial-gradient(760px 360px at 50% 100%, rgba(14, 92, 190, 0.14), transparent 56%),
        linear-gradient(180deg, #081b37 0%, #0b2347 58%, #091f3e 100%);
    }

    body:not(.authenticated) .dashboard {
      grid-template-columns: 1fr;
      min-height: 100vh;
    }

    body:not(.authenticated) .wrap {
      width: min(1320px, 100%);
      margin: 0 auto;
      padding: 0 20px;
    }

    body:not(.authenticated) .main-content {
      overflow: visible;
      display: grid;
      place-items: center;
      padding: clamp(36px, 7vh, 72px) 22px;
      min-height: 100dvh;
      background: transparent;
    }

    body:not(.authenticated) .content-wrapper {
      width: min(1280px, 100%);
      max-width: 1280px;
      gap: 0;
      align-self: center;
    }

    body:not(.authenticated) .header,
    body:not(.authenticated) .mobile-menu-toggle {
      display: none !important;
    }

    body:not(.authenticated) #panel-core {
      display: block !important;
      width: 100%;
      max-width: 1160px;
      margin: 0 auto;
    }

    body:not(.authenticated) #panel-core > .layout,
    body:not(.authenticated) #panel-core > .stack {
      grid-template-columns: 1fr;
      gap: 0;
    }

    body:not(.authenticated) #panel-core .stack[aria-label="Dashboard principal"] > :not(.auth-shell) {
      display: none !important;
    }

    body:not(.authenticated) .auth-shell {
      display: grid;
      grid-template-columns: minmax(360px, 1.02fr) minmax(460px, 0.98fr);
      gap: 48px;
      align-items: center;
      min-height: min(860px, calc(100dvh - 70px));
    }

    body:not(.authenticated) .auth-showcase {
      display: grid;
      gap: 24px;
      align-content: center;
      padding: clamp(20px, 2.4vw, 28px);
    }

    body:not(.authenticated) .auth-brand {
      display: grid;
      gap: 14px;
      justify-items: start;
      text-align: left;
    }

    body:not(.authenticated) .auth-brand-logo {
      width: min(410px, 76vw);
      filter: drop-shadow(0 24px 44px rgba(7, 26, 59, 0.2));
    }

    body:not(.authenticated) .auth-brand-subtitle {
      margin: 0;
      max-width: 520px;
      color: rgba(28, 56, 94, 0.74);
      font-size: 15px;
      line-height: 1.72;
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-brand-subtitle {
      color: rgba(226, 236, 250, 0.78);
    }

    body:not(.authenticated) .auth-showcase-copy {
      display: grid;
      gap: 12px;
      max-width: 560px;
    }

    body:not(.authenticated) .auth-showcase-kicker {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      width: fit-content;
      padding: 7px 12px;
      border-radius: 999px;
      background: rgba(47, 190, 103, 0.12);
      border: 1px solid rgba(47, 190, 103, 0.2);
      color: #219a4d;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-showcase-kicker {
      background: rgba(47, 190, 103, 0.12);
      border: 1px solid rgba(47, 190, 103, 0.18);
      color: #84f0af;
    }

    body:not(.authenticated) .auth-showcase h1 {
      margin: 0;
      font-family: "Sora", "Manrope", sans-serif;
      font-size: clamp(38px, 5vw, 60px);
      line-height: 1.02;
      letter-spacing: -0.05em;
      color: #16365f;
      max-width: 620px;
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-showcase h1 {
      color: #f2f7ff;
    }

    body:not(.authenticated) .auth-showcase p {
      margin: 0;
      color: rgba(31, 58, 93, 0.78);
      font-size: 16px;
      line-height: 1.75;
      max-width: 560px;
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-showcase p {
      color: rgba(219, 230, 248, 0.84);
    }

    body:not(.authenticated) .auth-benefits {
      display: grid;
      gap: 12px;
      margin: 0;
      padding: 0;
      list-style: none;
      max-width: 540px;
    }

    body:not(.authenticated) .auth-benefits li {
      display: grid;
      grid-template-columns: 44px minmax(0, 1fr);
      gap: 14px;
      align-items: start;
      padding: 16px 18px;
      border-radius: 22px;
      background: rgba(255, 255, 255, 0.78);
      border: 1px solid rgba(25, 59, 100, 0.08);
      box-shadow: 0 14px 32px rgba(18, 56, 107, 0.08);
      backdrop-filter: blur(12px);
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-benefits li {
      background: rgba(255, 255, 255, 0.06);
      border: 1px solid rgba(255, 255, 255, 0.08);
      box-shadow: none;
    }

    body:not(.authenticated) .auth-benefit-icon {
      display: grid;
      place-items: center;
      width: 44px;
      height: 44px;
      border-radius: 14px;
      background: rgba(47, 190, 103, 0.15);
      color: #23a553;
      font-size: 18px;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18);
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-benefit-icon {
      color: #6de49b;
    }

    body:not(.authenticated) .auth-benefit-copy strong {
      display: block;
      margin-bottom: 3px;
      color: #173761;
      font-size: 15px;
      font-weight: 800;
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-benefit-copy strong {
      color: #f4f8ff;
    }

    body:not(.authenticated) .auth-benefit-copy span {
      color: rgba(31, 58, 93, 0.68);
      font-size: 13px;
      line-height: 1.55;
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-benefit-copy span {
      color: rgba(219, 230, 248, 0.75);
    }

    body:not(.authenticated) .auth-showcase-footer {
      color: rgba(24, 52, 88, 0.6);
      font-size: 13px;
      letter-spacing: 0.01em;
      max-width: 520px;
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-showcase-footer {
      color: rgba(202, 219, 245, 0.72);
    }

    body:not(.authenticated) .auth-card {
      padding: 34px 34px 24px;
      border-color: rgba(20, 55, 91, 0.08);
      background: rgba(255, 255, 255, 0.96);
      box-shadow:
        0 28px 72px rgba(10, 31, 67, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.7);
      max-width: 520px;
      width: 100%;
      margin-left: auto;
      border-radius: 26px;
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-card {
      background:
        linear-gradient(180deg, rgba(12, 29, 56, 0.96) 0%, rgba(11, 27, 52, 0.98) 100%);
      border-color: rgba(157, 181, 216, 0.12);
      box-shadow:
        0 30px 84px rgba(1, 10, 25, 0.52),
        inset 0 1px 0 rgba(255, 255, 255, 0.03);
    }

    body:not(.authenticated) .auth-portal-head {
      display: grid;
      gap: 10px;
      margin-bottom: 22px;
      text-align: center;
    }

    body:not(.authenticated) .auth-portal-logo {
      width: min(280px, 72%);
      margin: 0 auto 2px;
      filter: drop-shadow(0 18px 32px rgba(0, 0, 0, 0.12));
    }

    body:not(.authenticated) .auth-portal-kicker {
      display: inline-flex;
      justify-content: center;
      align-items: center;
      gap: 8px;
      width: fit-content;
      margin: 0 auto;
      padding: 7px 13px;
      border-radius: 999px;
      background: rgba(47, 190, 103, 0.1);
      color: #249a52;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      border: 1px solid rgba(47, 190, 103, 0.14);
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-portal-kicker {
      color: #7ee7ab;
      background: rgba(47, 190, 103, 0.12);
    }

    body:not(.authenticated) .auth-card h2 {
      margin: 0;
      text-align: center;
      font-size: clamp(28px, 4.2vw, 38px);
      font-family: "Sora", "Manrope", sans-serif;
      font-weight: 800;
      letter-spacing: -0.045em;
      color: color-mix(in oklab, var(--bc-text) 92%, #ffffff 8%);
    }

    body:not(.authenticated) .auth-card .subhead {
      margin: 0;
      text-align: center;
      color: color-mix(in oklab, var(--bc-muted) 90%, #ffffff 10%);
      font-size: 14px;
      line-height: 1.65;
    }

    body:not(.authenticated) .auth-view {
      display: none;
      gap: 14px;
    }

    body:not(.authenticated) .auth-view.is-active {
      display: grid;
    }

    body:not(.authenticated) .auth-inline-grid {
      display: grid;
      gap: 12px;
      grid-template-columns: 1fr 1fr;
    }

    body:not(.authenticated) .auth-inline-grid .full {
      grid-column: 1 / -1;
    }

    body:not(.authenticated) .auth-card label {
      font-size: 13px;
      font-weight: 700;
      color: color-mix(in oklab, var(--bc-muted) 84%, var(--bc-text) 16%);
      margin-bottom: 6px;
      display: inline-block;
    }

    body:not(.authenticated) .auth-card input,
    body:not(.authenticated) .auth-card select,
    body:not(.authenticated) .auth-card textarea {
      min-height: 52px;
      border-radius: 14px;
      background: color-mix(in oklab, var(--bc-field-bg) 96%, #ffffff 4%);
      border: 1px solid color-mix(in oklab, var(--bc-field-border) 96%, transparent);
      color: var(--bc-field-text);
      font-size: 15px;
      padding: 12px 15px;
      box-shadow: none;
    }

    body:not(.authenticated) .auth-card input:focus,
    body:not(.authenticated) .auth-card select:focus,
    body:not(.authenticated) .auth-card textarea:focus {
      outline: none;
      border-color: rgba(47, 190, 103, 0.7);
      box-shadow: 0 0 0 4px rgba(47, 190, 103, 0.12);
    }

    body:not(.authenticated) .auth-primary-btn {
      min-height: 52px;
      border-radius: 16px;
      border: 0;
      background: linear-gradient(135deg, #2fbe67, #249a52);
      color: #f7fffb;
      font-size: 16px;
      font-weight: 800;
      box-shadow: 0 18px 30px rgba(36, 154, 82, 0.28);
    }

    body:not(.authenticated) .auth-primary-btn:hover {
      transform: translateY(-1px);
      filter: brightness(1.02);
    }

    body:not(.authenticated) .auth-secondary-btn {
      min-height: 50px;
      border-radius: 15px;
      border: 1px solid color-mix(in oklab, var(--border) 78%, transparent);
      background: rgba(255, 255, 255, 0.72);
      color: var(--bc-text);
      font-weight: 700;
    }

    html[data-theme="dark"] body:not(.authenticated) .auth-secondary-btn {
      background: rgba(255, 255, 255, 0.04);
    }

    body:not(.authenticated) .auth-switch-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
      margin-top: -4px;
    }

    body:not(.authenticated) .auth-link-btn {
      border: 0;
      background: transparent;
      color: #35c26e;
      padding: 0;
      font-weight: 800;
      font-size: 14px;
      text-align: left;
    }

    body:not(.authenticated) .auth-link-btn:hover {
      color: #50da87;
      text-decoration: underline;
    }

    body:not(.authenticated) .auth-divider {
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      gap: 12px;
      align-items: center;
      color: color-mix(in oklab, var(--bc-muted) 90%, transparent);
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      font-weight: 700;
      margin: 2px 0;
    }

    body:not(.authenticated) .auth-divider::before,
    body:not(.authenticated) .auth-divider::after {
      content: "";
      height: 1px;
      background: color-mix(in oklab, var(--border) 82%, transparent);
    }

    body:not(.authenticated) #googleAuthMount,
    body:not(.authenticated) #googleAuthMountRegister {
      display: flex;
      justify-content: center;
      min-height: 46px;
    }

    body:not(.authenticated) .auth-social-box {
      display: grid;
      gap: 10px;
    }

    body:not(.authenticated) .auth-social-note {
      font-size: 12px;
      text-align: center;
      color: color-mix(in oklab, var(--bc-muted) 90%, transparent);
    }

    body:not(.authenticated) .auth-reset-box {
      display: none;
      margin-top: 2px;
      padding-top: 4px;
    }

    body:not(.authenticated).reset-mode .auth-reset-box {
      display: grid;
    }

    body:not(.authenticated) .auth-footer-cta {
      text-align: center;
      font-size: 14px;
      color: color-mix(in oklab, var(--bc-muted) 86%, transparent);
    }

    body:not(.authenticated) .auth-footer-links {
      display: flex;
      justify-content: center;
      gap: 14px;
      flex-wrap: wrap;
      margin-top: 14px;
      font-size: 12px;
      color: color-mix(in oklab, var(--bc-muted) 86%, transparent);
    }

    body:not(.authenticated) .auth-footer-links a {
      color: inherit;
      text-decoration: none;
    }

    body:not(.authenticated) .auth-footer-links button {
      border: 0;
      background: transparent;
      color: inherit;
      text-decoration: none;
      padding: 0;
      min-height: 0;
      font: inherit;
      cursor: pointer;
    }

    body:not(.authenticated) .auth-footer-links a:hover {
      color: #33b761;
      text-decoration: underline;
    }

    body:not(.authenticated) .auth-footer-links button:hover {
      color: #33b761;
      text-decoration: underline;
    }

    body:not(.authenticated) .auth-status-wrap {
      margin-top: 14px;
    }

    .auth-faq-card {
      width: min(760px, 100%);
      display: grid;
      gap: 18px;
    }

    .auth-faq-head {
      display: grid;
      gap: 8px;
    }

    .auth-faq-head h2 {
      margin: 0;
      font-size: clamp(28px, 4vw, 38px);
      line-height: 1.02;
      font-weight: 800;
      color: var(--bc-text);
    }

    .auth-faq-head p {
      margin: 0;
      font-size: 14px;
      line-height: 1.6;
      color: var(--bc-muted);
    }

    .auth-faq-actions {
      display: flex;
      justify-content: flex-end;
      gap: 10px;
      flex-wrap: wrap;
    }

    body:not(.authenticated) #authStatus.is-empty {
      display: none;
    }

    body:not(.authenticated)[data-auth-view="register"] .auth-shell {
      grid-template-columns: minmax(360px, 0.92fr) minmax(520px, 1.08fr);
    }

    body:not(.authenticated)[data-auth-view="register"] .auth-card {
      max-width: 640px;
    }

    body.authenticated .auth-login-only { display: none !important; }
    body.authenticated #panel-core .auth-shell { display: none !important; }
    body:not(.authenticated) .auth-after-login { display: none !important; }

    @media (max-width: 980px) {
      body:not(.authenticated) .auth-shell {
        grid-template-columns: 1fr;
        gap: 18px;
        min-height: auto;
      }

      body:not(.authenticated) .auth-showcase {
        justify-items: center;
        text-align: center;
        padding: 0 0 8px;
      }

      body:not(.authenticated) .auth-brand,
      body:not(.authenticated) .auth-showcase-copy {
        justify-items: center;
        text-align: center;
      }

      body:not(.authenticated) .auth-card {
        margin: 0 auto;
      }
    }

    @media (max-width: 640px) {
      body:not(.authenticated) .main-content {
        padding: 24px 14px;
      }

      body:not(.authenticated) .auth-card {
        padding: 24px 18px 18px;
      }

      body:not(.authenticated) .auth-inline-grid {
        grid-template-columns: 1fr;
      }

      body:not(.authenticated) .auth-brand-logo,
      body:not(.authenticated) .auth-portal-logo {
        width: min(260px, 82vw);
      }
    }

    @media (max-width: 1024px) {
      .main-content { padding: 20px 16px; }
      .header-right { gap: 8px; }
      .phase-pill { display: none; }
      .header {
        min-height: auto;
        top: 4px;
        grid-template-columns: 1fr;
        grid-template-areas:
          "brand"
          "actions"
          "nav";
      }
      .header-center {
        padding-top: 12px;
      }
      .workspace-nav {
        flex-wrap: wrap;
      }
      .header-right {
        justify-content: space-between;
        flex-wrap: wrap;
      }
      .header-left {
        flex-wrap: wrap;
      }
    }
    @media (max-width: 920px) {
      .schedule-form-actions {
        grid-template-columns: 1fr;
      }
    }
/* Operational dashboard refresh */
[data-theme="dark"] body {
  background:
    radial-gradient(1100px 420px at 50% -12%, rgba(69, 219, 131, 0.06), transparent 48%),
    radial-gradient(980px 360px at 100% -10%, rgba(57, 92, 255, 0.08), transparent 42%),
    linear-gradient(180deg, #0b0f14 0%, #0f141b 100%);
}

.main-content {
  background:
    radial-gradient(920px 320px at 12% -8%, rgba(168, 85, 247, 0.06), transparent 46%),
    radial-gradient(740px 260px at 92% -6%, rgba(216, 180, 254, 0.05), transparent 42%),
    linear-gradient(180deg, #0e0a13 0%, #120e18 100%);
  padding-top: 18px;
}

.main-content::before {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.025), transparent 18%),
    radial-gradient(circle at top left, rgba(255,255,255,0.018), transparent 26%);
  opacity: 0.58;
}

.header {
  max-width: 1320px;
  min-height: 74px;
  padding: 10px 18px 14px;
  border-color: rgba(255,255,255,0.08);
  background: linear-gradient(180deg, rgba(20, 24, 31, 0.94), rgba(15, 19, 26, 0.98));
  box-shadow: 0 20px 44px rgba(0, 0, 0, 0.28);
}

.header-center {
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.06);
}

.header-business,
.header-search,
.header-utility-btn,
.user-menu {
  background: rgba(255,255,255,0.035);
  border-color: rgba(255,255,255,0.08);
}

.header-search {
  color: #f1f5f9;
}

.header-search::placeholder {
  color: #7f8ba0;
}

.workspace-nav {
  gap: 18px;
}

.workspace-trigger {
  min-height: 34px !important;
  padding: 0 2px 10px !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #96a2b6 !important;
  font-size: 15px !important;
}

.workspace-trigger::after {
  display: none;
}

.workspace-trigger:hover,
.workspace-trigger.active {
  background: transparent !important;
  color: #55d98c !important;
  border-bottom-color: #55d98c !important;
}

.workspace-menu-panel {
  top: calc(100% + 14px);
  left: 0;
  min-width: 460px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.08);
  background: linear-gradient(180deg, rgba(21, 26, 34, 0.98), rgba(15, 19, 26, 0.98));
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.34);
}

.dashboard-home {
  padding-top: 10px;
}

.dashboard-shell.dashboard-shell-overview {
  grid-template-columns: 1fr;
  gap: 22px;
}

.dashboard-surface {
  border-color: rgba(255,255,255,0.08);
  background: linear-gradient(180deg, rgba(22, 26, 34, 0.97), rgba(17, 21, 29, 0.98));
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

.dashboard-surface::after {
  background:
    radial-gradient(circle at top right, rgba(255,255,255,0.035), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,0.015), transparent 28%);
}

.dashboard-summary-surface {
  padding: 24px;
  display: grid;
  gap: 20px;
}

.dashboard-section-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.dashboard-section-kicker,
.dashboard-panel-label,
.dashboard-phase-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #5fdd91;
}

.dashboard-section-header h2,
.dashboard-board-header h3 {
  margin: 0;
  letter-spacing: -0.04em;
}

.dashboard-section-header h2 {
  font-size: clamp(30px, 3vw, 38px);
  line-height: 1.02;
  color: #f8fafc;
}

.dashboard-section-header p,
.dashboard-board-header p {
  margin: 6px 0 0;
  color: #94a1b5;
  font-size: 14px;
  line-height: 1.6;
  max-width: 780px;
}

.dashboard-summary-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.dashboard-summary-grid {
  display: grid;
  grid-template-columns: minmax(280px, 338px) minmax(0, 1.14fr) minmax(280px, 320px);
  gap: 16px;
}

.dashboard-summary-card,
.dashboard-panel {
  min-width: 0;
}

.dashboard-summary-card {
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.015));
  padding: 18px;
  display: grid;
  gap: 14px;
}

.dashboard-identity-head {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.dashboard-avatar {
  width: 64px;
  height: 64px;
  border-radius: 18px;
  background: linear-gradient(135deg, #55db8d, #2ea86a);
  color: #09110d;
  box-shadow: none;
}

.dashboard-identity-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.dashboard-identity-copy h3 {
  margin: 0;
  font-size: 28px;
  line-height: 1;
  color: #f8fafc;
}

.dashboard-identity-copy p {
  margin: 0;
  font-size: 13px;
  color: #94a1b5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-panel-phase-compact {
  border-radius: 18px;
  border-color: rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.025);
  padding: 15px 16px;
}

.admin-panel-phase-compact span {
  color: #63dc93;
}

.admin-panel-phase-compact strong {
  font-size: 18px;
  color: #f7f9fc;
}

.admin-panel-phase-compact p {
  color: #94a1b5;
}

.dashboard-action-stack-inline {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-action-btn.primary {
  background: linear-gradient(180deg, #a855f7, #7c3aed) !important;
  color: #09110d !important;
  box-shadow: none !important;
}

.dashboard-action-btn.secondary {
  background: rgba(255,255,255,0.03) !important;
  color: #eef2f7 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: none !important;
}

.dashboard-action-btn.secondary:hover {
  background: rgba(255,255,255,0.05) !important;
}

.dashboard-card-head-simple {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.dashboard-card-head-simple h3 {
  margin: 0;
  font-size: 20px;
  line-height: 1.08;
  color: #f8fafc;
}

.dashboard-inline-metrics {
  display: grid;
  gap: 10px;
}

.dashboard-inline-metric,
.status-mini-card,
.auction-metric,
.metric-card,
.metric-pill,
.checklist-item,
.activity-item {
  background: #11161f;
  border: 1px solid rgba(255,255,255,0.07);
  box-shadow: none;
}

.dashboard-inline-metric {
  border-radius: 16px;
  padding: 13px 14px;
  display: grid;
  gap: 6px;
}

.dashboard-inline-metric span,
.metric-card label,
.status-mini-label,
.auction-metric span,
.activity-time {
  color: #8994a7;
}

.dashboard-inline-metric strong,
.status-mini-value,
.metric-card strong,
.auction-metric strong,
.checklist-copy strong,
.activity-copy strong {
  color: #f8fafc;
}

.dashboard-inline-metric strong {
  font-size: 14px;
}

.dashboard-note-card-inline {
  padding: 15px 16px;
  border: 1px solid rgba(168, 85, 247, 0.2);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(168, 85, 247, 0.11), rgba(168, 85, 247, 0.05));
}

.dashboard-note-card-inline strong {
  color: #f6f8fb;
}

.dashboard-note-card-inline span {
  color: #d4dce8;
}

.hero-status-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.status-mini-card {
  min-height: 0;
  padding: 16px;
}

.status-mini-icon,
.checklist-indicator {
  background: rgba(255,255,255,0.04);
}

.status-mini-value {
  font-size: 18px;
}

.status-mini-meta,
.dashboard-card-subtitle,
.metric-card p,
.auction-metric small,
.checklist-copy p,
.activity-copy p {
  color: #96a4b8;
}

.dashboard-board-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.dashboard-board-header h3 {
  font-size: 28px;
  line-height: 1.04;
  color: #f8fafc;
}

.dashboard-board-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.dashboard-panel {
  padding: 20px;
  display: grid;
  gap: 16px;
}

.dashboard-card-head h3 {
  font-size: 22px;
  letter-spacing: -0.03em;
  color: #f8fafc;
}

.dashboard-card-subtitle {
  max-width: none;
}

.dashboard-link-btn {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  color: #eef2f7 !important;
}

.dashboard-link-btn:hover {
  background: rgba(255,255,255,0.05) !important;
}

.dashboard-empty {
  background: linear-gradient(180deg, rgba(255,255,255,0.025), rgba(255,255,255,0.01));
  border-color: rgba(255,255,255,0.08);
  padding: 20px;
}

.dashboard-empty strong {
  font-size: 20px;
}

.auction-metric-grid,
.metric-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.auction-metric,
.metric-card,
.metric-pill,
.checklist-item,
.activity-item {
  border-radius: 16px;
}

.auction-metric,
.metric-card {
  padding: 16px;
}

.metric-pill {
  min-height: 56px;
  padding: 14px 15px;
}

.metric-pill i,
.checklist-action {
  color: #c084fc;
}

.checklist-item.success .checklist-indicator {
  color: #c084fc;
  background: rgba(192, 132, 252, 0.14);
}

.checklist-item.warn .checklist-indicator {
  color: #f8bb72;
  background: rgba(248, 187, 114, 0.12);
}

.checklist-item.neutral .checklist-indicator {
  color: #9cadc3;
  background: rgba(156, 173, 195, 0.12);
}

.activity-bullet {
  background: #8b5cf6;
  box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.16);
}

.activity-item.success .activity-bullet {
  background: #c084fc;
  box-shadow: 0 0 0 4px rgba(192, 132, 252, 0.16);
}

.activity-item.warn .activity-bullet {
  background: #f8bb72;
  box-shadow: 0 0 0 4px rgba(248, 187, 114, 0.14);
}

.dashboard-chip,
.status-badge {
  padding: 7px 10px;
  font-size: 10px;
  letter-spacing: 0.1em;
}

.dashboard-chip {
  border-color: rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  color: #eef2f7;
}

.status-badge.neutral {
  background: rgba(255,255,255,0.045);
  border-color: rgba(255,255,255,0.08);
  color: #dbe4f0;
}

.status-badge.success {
  background: rgba(88, 217, 141, 0.14);
  border-color: rgba(88, 217, 141, 0.2);
  color: #86e7aa;
}

.status-badge.warn {
  background: rgba(248, 187, 114, 0.14);
  border-color: rgba(248, 187, 114, 0.2);
  color: #f9cb92;
}

.status-badge.danger {
  background: rgba(244, 99, 99, 0.14);
  border-color: rgba(244, 99, 99, 0.2);
  color: #ffb1b1;
}

.status-badge.info {
  background: rgba(86, 143, 255, 0.16);
  border-color: rgba(86, 143, 255, 0.22);
  color: #c9daff;
}

@media (max-width: 1320px) {
  .dashboard-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-control-card {
    grid-column: 1 / -1;
  }
}

@media (max-width: 1080px) {
  .dashboard-board-grid,
  .dashboard-summary-grid,
  .dashboard-action-stack-inline {
    grid-template-columns: 1fr;
  }

  .dashboard-control-card {
    grid-column: auto;
  }
}

@media (max-width: 860px) {
  .hero-status-grid,
  .auction-metric-grid,
  .metric-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-summary-surface,
  .dashboard-panel {
    padding: 18px;
  }

  .dashboard-board-header {
    align-items: flex-start;
  }
}
/* Internal surfaces and auth refresh */
body:not(.authenticated) {
  background:
    radial-gradient(1180px 560px at 0% 0%, rgba(168, 85, 247, 0.12), transparent 54%),
    radial-gradient(920px 420px at 100% 10%, rgba(216, 180, 254, 0.1), transparent 46%),
    linear-gradient(180deg, #09070d 0%, #0d0912 52%, #110d18 100%);
}

html[data-theme="dark"] body:not(.authenticated) {
  background:
    radial-gradient(1180px 560px at 0% 0%, rgba(168, 85, 247, 0.12), transparent 54%),
    radial-gradient(920px 420px at 100% 10%, rgba(216, 180, 254, 0.1), transparent 46%),
    linear-gradient(180deg, #09070d 0%, #0d0912 52%, #110d18 100%);
}

body:not(.authenticated) .auth-shell {
  grid-template-columns: minmax(360px, 1.06fr) minmax(460px, 0.94fr);
  gap: clamp(36px, 5vw, 72px);
  min-height: min(900px, calc(100dvh - 56px));
}

body:not(.authenticated) .auth-showcase {
  padding: 0;
  gap: 28px;
}

body:not(.authenticated) .auth-brand-logo {
  filter: none;
}

body:not(.authenticated) .auth-brand-subtitle,
body:not(.authenticated) .auth-showcase p,
html[data-theme="dark"] body:not(.authenticated) .auth-showcase p,
html[data-theme="dark"] body:not(.authenticated) .auth-brand-subtitle {
  color: #9aa5b8;
}

body:not(.authenticated) .auth-showcase-kicker,
body:not(.authenticated) .auth-portal-kicker {
  background: rgba(168, 85, 247, 0.12);
  border-color: rgba(168, 85, 247, 0.2);
  color: #d8b4fe;
}

body:not(.authenticated) .auth-showcase h1,
html[data-theme="dark"] body:not(.authenticated) .auth-showcase h1 {
  color: #f8fafc;
  max-width: 680px;
}

body:not(.authenticated) .auth-benefits li,
html[data-theme="dark"] body:not(.authenticated) .auth-benefits li {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: none;
  backdrop-filter: blur(10px);
}

body:not(.authenticated) .auth-benefit-icon {
  background: rgba(168, 85, 247, 0.14);
  color: #d8b4fe;
  box-shadow: none;
}

body:not(.authenticated) .auth-benefit-copy strong,
html[data-theme="dark"] body:not(.authenticated) .auth-benefit-copy strong {
  color: #f4f7fb;
}

body:not(.authenticated) .auth-benefit-copy span,
html[data-theme="dark"] body:not(.authenticated) .auth-benefit-copy span,
body:not(.authenticated) .auth-showcase-footer,
html[data-theme="dark"] body:not(.authenticated) .auth-showcase-footer {
  color: #8f9aad;
}

body:not(.authenticated) .auth-card,
html[data-theme="dark"] body:not(.authenticated) .auth-card {
  background: linear-gradient(180deg, rgba(18, 24, 33, 0.98) 0%, rgba(14, 19, 27, 0.98) 100%);
  border-color: rgba(255,255,255,0.08);
  box-shadow: 0 24px 56px rgba(0,0,0,0.28);
  border-radius: 28px;
}

body:not(.authenticated) .auth-card h2,
html[data-theme="dark"] body:not(.authenticated) .auth-card h2 {
  color: #f8fafc;
}

body:not(.authenticated) .auth-card .subhead,
body:not(.authenticated) .auth-card label,
body:not(.authenticated) .auth-footer-cta,
body:not(.authenticated) .auth-social-note,
body:not(.authenticated) .auth-footer-links,
body:not(.authenticated) .auth-footer-links a,
body:not(.authenticated) .auth-footer-links button {
  color: #98a5b9;
}

body:not(.authenticated) .auth-card input,
body:not(.authenticated) .auth-card select,
body:not(.authenticated) .auth-card textarea {
  background: #141b24;
  border-color: rgba(255,255,255,0.08);
  color: #f5f7fb;
}

body:not(.authenticated) .auth-card input::placeholder,
body:not(.authenticated) .auth-card textarea::placeholder {
  color: #748094;
}

body:not(.authenticated) .auth-card input:focus,
body:not(.authenticated) .auth-card select:focus,
body:not(.authenticated) .auth-card textarea:focus {
  border-color: rgba(168, 85, 247, 0.58);
  box-shadow: 0 0 0 4px rgba(168, 85, 247, 0.12);
}

body:not(.authenticated) .auth-primary-btn {
  background: linear-gradient(180deg, #a855f7, #7c3aed);
  color: #0b120e;
  box-shadow: none;
}

body:not(.authenticated) .auth-secondary-btn,
html[data-theme="dark"] body:not(.authenticated) .auth-secondary-btn {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.08);
  color: #eef2f7;
}

body:not(.authenticated) .auth-link-btn,
body:not(.authenticated) .auth-footer-links a:hover,
body:not(.authenticated) .auth-footer-links button:hover {
  color: #d8b4fe;
}

.auth-faq-card {
  background: linear-gradient(180deg, rgba(19, 25, 35, 0.98), rgba(14, 18, 27, 0.98));
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 24px;
  box-shadow: 0 24px 56px rgba(0,0,0,0.3);
  padding: 28px;
}

.auth-faq-head h2,
.auth-faq-head p {
  color: #f8fafc;
}

.auth-faq-head p {
  color: #98a5b9;
}

.app-panel > main.stack,
#panel-auction > main.stack,
#panel-billing > main.stack {
  width: 100%;
  max-width: none;
  margin: 0;
  gap: 18px;
}

.content-wrapper .card {
  background: linear-gradient(180deg, rgba(19, 24, 33, 0.98), rgba(15, 20, 28, 0.98));
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 22px;
  box-shadow: 0 18px 40px rgba(0,0,0,0.22);
}

.content-wrapper .card::before {
  background: linear-gradient(90deg, rgba(255,255,255,0.08), transparent 65%);
}

.content-wrapper .card h2 {
  font-size: clamp(21px, 1.5vw, 26px);
  letter-spacing: -0.03em;
  color: #f8fafc;
}

.content-wrapper .card h3,
.content-wrapper .section-title,
.content-wrapper .company-section-title {
  color: #f1f5f9;
}

.content-wrapper .subhead,
.content-wrapper .muted,
.content-wrapper .quick-caption,
.content-wrapper label {
  color: #95a3b7 !important;
}

.content-wrapper input,
.content-wrapper select,
.content-wrapper textarea,
.content-wrapper .filter-input {
  background: #141a23;
  border-color: rgba(255,255,255,0.08);
  color: #f5f7fb;
  border-radius: 14px;
  min-height: 46px;
}

.content-wrapper input::placeholder,
.content-wrapper textarea::placeholder,
.content-wrapper .filter-input::placeholder {
  color: #728093;
}

.content-wrapper input:focus,
.content-wrapper select:focus,
.content-wrapper textarea:focus,
.content-wrapper .filter-input:focus {
  border-color: rgba(168, 85, 247, 0.48);
  box-shadow: 0 0 0 4px rgba(168, 85, 247, 0.12);
  background: #1a1423;
}

.content-wrapper button,
.content-wrapper .panel-btn,
.content-wrapper .auction-subbtn,
.content-wrapper .options-btn,
.content-wrapper .billing-subbtn,
.content-wrapper .billing-module-btn {
  border-radius: 14px;
}

.content-wrapper button {
  background: linear-gradient(180deg, #a855f7, #7c3aed);
  color: #fbf7ff;
  box-shadow: none;
}

.content-wrapper button.secondary,
.content-wrapper button.options-btn,
.content-wrapper button.ghost,
.content-wrapper button.danger,
.content-wrapper .auction-subbtn,
.content-wrapper .billing-subbtn,
.content-wrapper .billing-module-btn {
  background: rgba(255,255,255,0.035) !important;
  border-color: rgba(255,255,255,0.08) !important;
  color: #eef2f7 !important;
}

.content-wrapper button.secondary:hover,
.content-wrapper .auction-subbtn:hover,
.content-wrapper .billing-subbtn:hover,
.content-wrapper .billing-module-btn:hover,
.content-wrapper .options-btn:hover {
  background: rgba(255,255,255,0.05) !important;
}

.content-wrapper .auction-subbtn.active,
.content-wrapper .billing-subbtn.active,
.content-wrapper .billing-module-btn.active,
.content-wrapper .options-nav .options-btn.active {
  background: linear-gradient(180deg, #a855f7, #7c3aed) !important;
  border-color: transparent !important;
  color: #09110d !important;
  box-shadow: none !important;
}

.auction-subnav-card,
.billing-page-toolbar,
#panel-options > .card:first-child {
  padding: 18px 20px;
}

.auction-subnav,
.options-nav,
.billing-module-row,
.billing-contextbar {
  padding: 10px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
}

.options-nav {
  margin-top: 8px;
}

.billing-page-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
}

.billing-page-toolbar-copy strong {
  color: #f8fafc;
  font-size: 20px;
  letter-spacing: -0.02em;
}

.billing-page-toolbar-copy span {
  display: block;
  margin-top: 4px;
  color: #95a3b7;
  font-size: 14px;
  line-height: 1.55;
}

.billing-pane-shell,
.billing-customer-shell,
.billing-customer-mainlist,
.billing-customer-sidebar,
.billing-page-section,
.billing-section-card,
.billing-list-toolbar,
.billing-composer,
.company-groups-card,
.payment-flow-surface,
.group-panel,
.logo-preview-wrap,
.template-preview-wrap,
.billing-hero-card,
.billing-kpi-card,
.billing-empty-state,
.billing-payment-card,
.billing-proof-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.015));
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 18px;
  box-shadow: none;
}

.billing-pane-shell {
  gap: 20px;
}

.billing-list-toolbar,
.billing-composer,
.billing-page-section,
.billing-section-card,
.group-panel,
.company-groups-card,
.payment-flow-surface {
  padding: 18px;
}

.billing-list-toolbar-head,
.billing-section-head,
.billing-page-section-head,
.billing-composer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.billing-page-section-head h3,
.billing-section-head h3,
.billing-composer-head strong,
.group-panel h3,
.company-groups-card h3 {
  margin: 0;
  font-size: 18px;
  color: #f8fafc;
  letter-spacing: -0.02em;
}

.billing-page-section-head p,
.billing-section-head p,
.billing-composer-head span,
.billing-inline-note,
.billing-empty-state p,
.payment-flow-surface .muted,
.company-groups-card .muted {
  color: #95a3b7;
}

.billing-list-toolbar-actions,
.billing-composer-actions,
.inline-actions,
.billing-actions-row,
.payment-flow-actions,
.org-inline-row,
.manual-group-actions,
.billing-form-actions,
.row {
  gap: 10px;
}

.billing-list-toolbar-filters,
.billing-list-toolbar-filters.premium,
.billing-filter-grid,
.billing-field-grid,
.billing-page-grid,
.billing-recent-grid,
.billing-hero-grid,
.billing-kpi-grid,
.billing-pane-grid,
.billing-customer-shell,
.groups-grid,
.mini-grid,
.template-preview-wrap,
.inline-grid,
.company-grid {
  gap: 16px 18px;
}

.groups-grid,
.mini-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.billing-customer-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.42fr) minmax(320px, 0.88fr);
  align-items: start;
}

.billing-customer-sidebar {
  display: grid;
  gap: 18px;
}

.billing-hero-card,
.billing-kpi-card,
.billing-contextbar,
.billing-context-link,
.billing-hero-chip,
.billing-payment-request-list .billing-payment-card,
.billing-payment-request-list .billing-proof-card,
.dashboard-mini-list li,
.org-list li,
.group-list li,
.manual-group-list li,
.schedule-list li,
.command-catalog li,
.user-list li,
.substitute-item {
  background: #11161f;
  border-color: rgba(255,255,255,0.07);
  color: #eef2f7;
}

.billing-context-link,
.billing-hero-chip {
  color: #dbe3ee;
}

.billing-context-link.active {
  background: rgba(168, 85, 247, 0.12);
  border-color: rgba(192, 132, 252, 0.24);
  color: #e9d5ff;
}

.billing-kpi-card strong,
.dashboard-mini-list strong,
.billing-keypoints strong {
  color: #f8fafc;
}

.billing-kpi-card span,
.dashboard-mini-list span,
.billing-keypoints span {
  color: #95a3b7;
}

.billing-keypoints,
.dashboard-mini-list,
.command-catalog,
.org-list,
.user-list,
.group-list,
.manual-group-list,
.schedule-list,
.substitute-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.billing-keypoints li,
.dashboard-mini-list li,
.command-catalog li,
.org-list li,
.user-list li,
.group-list li,
.manual-group-list li,
.schedule-list li,
.substitute-item {
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 14px;
  padding: 12px 14px;
}

.command-catalog li code,
.payment-flow-surface code,
.faq-stack code,
.quick-caption code,
.subhead code {
  color: #83eab0;
}

.faq-stack details {
  background: #11161f;
  border-color: rgba(255,255,255,0.08);
}

.faq-stack summary {
  color: #f2f6fb;
}

.faq-stack details p {
  color: #97a4b7;
}

.logo-preview-wrap,
.template-preview-wrap,
.logo-preview-empty,
.billing-table,
.billing-payment-request-list,
#billingOrderItems,
#billingOrderList,
#billingCustomerList {
  background: #11161f;
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 18px;
}

.logo-preview-wrap,
.template-preview-wrap {
  padding: 18px;
}

.status {
  background: rgba(255,255,255,0.03);
  border-color: rgba(255,255,255,0.08);
  color: #cad5e3;
  border-radius: 14px;
  min-height: 44px;
  padding: 10px 14px;
}

.status.ok {
  background: rgba(168, 85, 247, 0.12);
  border-color: rgba(192, 132, 252, 0.24);
  color: #e9d5ff;
}

.status.warn {
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(245, 158, 11, 0.2);
  color: #f7c37a;
}

@media (max-width: 1180px) {
  .billing-page-toolbar,
  .billing-customer-shell,
  .billing-pane-grid,
  .billing-hero-grid,
  .groups-grid,
  .mini-grid,
  .company-grid,
  .inline-grid {
    grid-template-columns: 1fr;
  }

  .billing-page-toolbar {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .auth-faq-card,
  .billing-list-toolbar,
  .billing-composer,
  .billing-page-section,
  .billing-section-card,
  .group-panel,
  .company-groups-card,
  .payment-flow-surface,
  .auction-subnav-card,
  #panel-options > .card:first-child {
    padding: 16px;
  }

  .auction-subnav,
  .options-nav,
  .billing-module-row,
  .billing-contextbar {
    padding: 8px;
  }
}
/* Theme-aware shell tokens */
:root,
[data-theme="light"] {
  --bc-app-shell-body-bg:
    radial-gradient(1180px 560px at 0% 0%, rgba(34, 197, 94, 0.12), transparent 54%),
    radial-gradient(920px 420px at 100% 10%, rgba(37, 99, 235, 0.12), transparent 46%),
    linear-gradient(180deg, #eef4fb 0%, #f6f9fc 52%, #edf2f8 100%);
  --bc-app-main-bg:
    radial-gradient(980px 340px at 12% -8%, rgba(59, 130, 246, 0.08), transparent 46%),
    radial-gradient(740px 260px at 92% -6%, rgba(34, 197, 94, 0.08), transparent 42%),
    linear-gradient(180deg, #edf3f9 0%, #eef4fb 100%);
  --bc-app-header-bg: linear-gradient(180deg, rgba(255,255,255,0.94), rgba(248,250,252,0.98));
  --bc-app-header-border: rgba(15, 23, 42, 0.08);
  --bc-app-header-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
  --bc-app-panel-bg: #ffffff;
  --bc-app-panel-bg-soft: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(246,248,251,0.98));
  --bc-app-panel-border: rgba(15, 23, 42, 0.08);
  --bc-app-panel-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
  --bc-app-card-bg: linear-gradient(180deg, rgba(255,255,255,0.92), rgba(244,247,251,0.98));
  --bc-app-card-border: rgba(15, 23, 42, 0.08);
  --bc-app-surface-text: #0f172a;
  --bc-app-muted-text: #5f6f85;
  --bc-app-soft-text: #73839a;
  --bc-app-secondary-bg: rgba(15, 23, 42, 0.03);
  --bc-app-secondary-bg-hover: rgba(15, 23, 42, 0.06);
  --bc-app-field-bg: #f8fafc;
  --bc-app-field-border: rgba(15, 23, 42, 0.1);
  --bc-app-field-text: #0f172a;
  --bc-app-primary-gradient: linear-gradient(180deg, #a855f7, #7c3aed);
  --bc-app-primary-text: #fbf7ff;
  --bc-app-accent: #7c3aed;
  --bc-app-accent-soft: rgba(168, 85, 247, 0.12);
  --bc-app-info-soft: rgba(168, 85, 247, 0.14);
  --bc-app-warn-soft: rgba(245, 158, 11, 0.14);
  --bc-app-danger-soft: rgba(239, 68, 68, 0.14);
}

[data-theme="dark"] {
  --bc-app-shell-body-bg:
    radial-gradient(1180px 560px at 0% 0%, rgba(168, 85, 247, 0.12), transparent 54%),
    radial-gradient(920px 420px at 100% 10%, rgba(216, 180, 254, 0.1), transparent 46%),
    linear-gradient(180deg, #09070d 0%, #0d0912 52%, #110d18 100%);
  --bc-app-main-bg:
    radial-gradient(920px 320px at 12% -8%, rgba(168, 85, 247, 0.06), transparent 46%),
    radial-gradient(740px 260px at 92% -6%, rgba(216, 180, 254, 0.05), transparent 42%),
    linear-gradient(180deg, #0e0a13 0%, #120e18 100%);
  --bc-app-header-bg: linear-gradient(180deg, rgba(19, 14, 25, 0.94), rgba(15, 10, 21, 0.98));
  --bc-app-header-border: rgba(255,255,255,0.08);
  --bc-app-header-shadow: 0 20px 44px rgba(0, 0, 0, 0.28);
  --bc-app-panel-bg: #15111c;
  --bc-app-panel-bg-soft: linear-gradient(180deg, rgba(24, 18, 31, 0.97), rgba(18, 14, 24, 0.98));
  --bc-app-panel-border: rgba(255,255,255,0.08);
  --bc-app-panel-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
  --bc-app-card-bg: linear-gradient(180deg, rgba(22, 17, 29, 0.98), rgba(18, 14, 24, 0.98));
  --bc-app-card-border: rgba(255,255,255,0.08);
  --bc-app-surface-text: #f8fafc;
  --bc-app-muted-text: #95a3b7;
  --bc-app-soft-text: #8f81a4;
  --bc-app-secondary-bg: rgba(255,255,255,0.035);
  --bc-app-secondary-bg-hover: rgba(255,255,255,0.05);
  --bc-app-field-bg: #171220;
  --bc-app-field-border: rgba(255,255,255,0.08);
  --bc-app-field-text: #f5f7fb;
  --bc-app-primary-gradient: linear-gradient(180deg, #a855f7, #7c3aed);
  --bc-app-primary-text: #fbf7ff;
  --bc-app-accent: #c084fc;
  --bc-app-accent-soft: rgba(192, 132, 252, 0.14);
  --bc-app-info-soft: rgba(168, 85, 247, 0.16);
  --bc-app-warn-soft: rgba(245, 158, 11, 0.12);
  --bc-app-danger-soft: rgba(239, 68, 68, 0.14);
}

body,
[data-theme] body,
body:not(.authenticated),
html[data-theme="dark"] body:not(.authenticated) {
  background: var(--bc-app-shell-body-bg);
}

.main-content {
  background: var(--bc-app-main-bg);
}

.header {
  border-color: var(--bc-app-header-border);
  background: var(--bc-app-header-bg);
  box-shadow: var(--bc-app-header-shadow);
}

.header-center {
  border-top-color: var(--bc-app-header-border);
}

.header-business,
.header-search,
.header-utility-btn,
.user-menu,
.workspace-menu-panel,
.auction-subnav,
.options-nav,
.billing-module-row,
.billing-contextbar {
  background: var(--bc-app-secondary-bg);
  border-color: var(--bc-app-panel-border);
}

.header-search,
.content-wrapper input,
.content-wrapper select,
.content-wrapper textarea,
.content-wrapper .filter-input,
body:not(.authenticated) .auth-card input,
body:not(.authenticated) .auth-card select,
body:not(.authenticated) .auth-card textarea {
  background: var(--bc-app-field-bg);
  border-color: var(--bc-app-field-border);
  color: var(--bc-app-field-text);
}

.header-search::placeholder,
.content-wrapper input::placeholder,
.content-wrapper textarea::placeholder,
.content-wrapper .filter-input::placeholder,
body:not(.authenticated) .auth-card input::placeholder,
body:not(.authenticated) .auth-card textarea::placeholder {
  color: var(--bc-app-soft-text);
}

.workspace-trigger,
.content-wrapper .subhead,
.content-wrapper .muted,
.content-wrapper .quick-caption,
.content-wrapper label,
body:not(.authenticated) .auth-card .subhead,
body:not(.authenticated) .auth-card label,
body:not(.authenticated) .auth-footer-cta,
body:not(.authenticated) .auth-social-note,
body:not(.authenticated) .auth-footer-links,
body:not(.authenticated) .auth-footer-links a,
body:not(.authenticated) .auth-footer-links button,
body:not(.authenticated) .auth-brand-subtitle,
body:not(.authenticated) .auth-showcase p,
body:not(.authenticated) .auth-benefit-copy span,
body:not(.authenticated) .auth-showcase-footer {
  color: var(--bc-app-muted-text) !important;
}

.workspace-trigger:hover,
.workspace-trigger.active,
body:not(.authenticated) .auth-link-btn,
body:not(.authenticated) .auth-footer-links a:hover,
body:not(.authenticated) .auth-footer-links button:hover,
.metric-pill i,
.checklist-action {
  color: var(--bc-app-accent) !important;
  border-bottom-color: var(--bc-app-accent) !important;
}

.dashboard-surface,
.content-wrapper .card,
body:not(.authenticated) .auth-card,
.auth-faq-card {
  background: var(--bc-app-card-bg);
  border-color: var(--bc-app-card-border);
  box-shadow: var(--bc-app-panel-shadow);
}

.dashboard-summary-card,
.billing-pane-shell,
.billing-customer-shell,
.billing-customer-mainlist,
.billing-customer-sidebar,
.billing-page-section,
.billing-section-card,
.billing-list-toolbar,
.billing-composer,
.company-groups-card,
.payment-flow-surface,
.group-panel,
.logo-preview-wrap,
.template-preview-wrap,
.billing-hero-card,
.billing-kpi-card,
.billing-empty-state,
.billing-payment-card,
.billing-proof-card,
body:not(.authenticated) .auth-benefits li {
  background: var(--bc-app-panel-bg);
  border-color: var(--bc-app-panel-border);
  box-shadow: none;
}

.dashboard-summary-surface,
.dashboard-panel,
.billing-list-toolbar,
.billing-composer,
.billing-page-section,
.billing-section-card,
.group-panel,
.company-groups-card,
.payment-flow-surface,
.auction-subnav-card,
#panel-options > .card:first-child,
.auth-faq-card {
  color: var(--bc-app-surface-text);
}

.dashboard-section-header h2,
.dashboard-board-header h3,
.dashboard-identity-copy h3,
.dashboard-card-head h3,
.dashboard-card-head-simple h3,
.content-wrapper .card h2,
.content-wrapper .card h3,
.content-wrapper .section-title,
.content-wrapper .company-section-title,
.billing-page-toolbar-copy strong,
.billing-page-section-head h3,
.billing-section-head h3,
.billing-composer-head strong,
.group-panel h3,
.company-groups-card h3,
body:not(.authenticated) .auth-showcase h1,
body:not(.authenticated) .auth-card h2,
body:not(.authenticated) .auth-benefit-copy strong,
.auth-faq-head h2 {
  color: var(--bc-app-surface-text) !important;
}

.dashboard-section-header p,
.dashboard-board-header p,
.dashboard-identity-copy p,
.admin-panel-phase-compact p,
.dashboard-card-subtitle,
.status-mini-meta,
.metric-card p,
.auction-metric small,
.checklist-copy p,
.activity-copy p,
.billing-page-toolbar-copy span,
.billing-page-section-head p,
.billing-section-head p,
.billing-composer-head span,
.billing-inline-note,
.billing-empty-state p,
.payment-flow-surface .muted,
.company-groups-card .muted,
.auth-faq-head p {
  color: var(--bc-app-muted-text) !important;
}

.dashboard-chip,
.status-badge,
.billing-hero-chip,
.header-business,
.metric-pill,
.dashboard-inline-metric,
.status-mini-card,
.auction-metric,
.metric-card,
.checklist-item,
.activity-item,
.billing-context-link,
.billing-kpi-card,
.dashboard-mini-list li,
.billing-keypoints li,
.command-catalog li,
.org-list li,
.user-list li,
.group-list li,
.manual-group-list li,
.schedule-list li,
.substitute-item,
.logo-preview-wrap,
.template-preview-wrap,
.billing-table,
.billing-payment-request-list,
#billingOrderItems,
#billingOrderList,
#billingCustomerList,
.faq-stack details,
.status {
  background: var(--bc-app-panel-bg);
  border-color: var(--bc-app-panel-border);
  color: var(--bc-app-surface-text);
}

.dashboard-note-card-inline {
  background: var(--bc-app-accent-soft);
  border-color: color-mix(in oklab, var(--bc-app-accent) 28%, var(--bc-app-panel-border));
}

.dashboard-note-card-inline span,
.dashboard-note-card-inline strong,
.command-catalog li code,
.payment-flow-surface code,
.faq-stack code,
.quick-caption code,
.subhead code {
  color: var(--bc-app-surface-text);
}

.command-catalog li code,
.payment-flow-surface code,
.faq-stack code,
.quick-caption code,
.subhead code {
  color: var(--bc-app-accent);
}

.status.ok,
.checklist-item.success .checklist-indicator,
.activity-item.success .activity-bullet {
  background: var(--bc-app-accent-soft);
  border-color: color-mix(in oklab, var(--bc-app-accent) 28%, var(--bc-app-panel-border));
  color: var(--bc-app-accent);
}

.status.warn,
.checklist-item.warn .checklist-indicator,
.activity-item.warn .activity-bullet {
  background: var(--bc-app-warn-soft);
  border-color: color-mix(in oklab, #f59e0b 30%, var(--bc-app-panel-border));
  color: #f59e0b;
}

.status-badge.info {
  background: var(--bc-app-info-soft);
  border-color: color-mix(in oklab, var(--bc-app-accent) 30%, var(--bc-app-panel-border));
  color: color-mix(in oklab, var(--bc-app-accent) 82%, var(--bc-app-surface-text));
}

.status-badge.success {
  background: var(--bc-app-accent-soft);
  border-color: color-mix(in oklab, var(--bc-app-accent) 28%, var(--bc-app-panel-border));
  color: var(--bc-app-accent);
}

.status-badge.warn {
  background: var(--bc-app-warn-soft);
  border-color: color-mix(in oklab, #f59e0b 30%, var(--bc-app-panel-border));
  color: #f59e0b;
}

.status-badge.danger {
  background: var(--bc-app-danger-soft);
  border-color: color-mix(in oklab, #ef4444 30%, var(--bc-app-panel-border));
  color: #ef4444;
}

.status-badge.neutral,
.dashboard-chip,
.checklist-item.neutral .checklist-indicator,
.activity-bullet,
.status-mini-icon,
.checklist-indicator {
  background: var(--bc-app-secondary-bg);
  border-color: var(--bc-app-panel-border);
  color: var(--bc-app-muted-text);
}

.dashboard-action-btn.primary,
.content-wrapper button,
body:not(.authenticated) .auth-primary-btn,
.content-wrapper .auction-subbtn.active,
.content-wrapper .billing-subbtn.active,
.content-wrapper .billing-module-btn.active,
.content-wrapper .options-nav .options-btn.active {
  background: var(--bc-app-primary-gradient) !important;
  color: var(--bc-app-primary-text) !important;
  border-color: transparent !important;
}

.dashboard-action-btn.secondary,
.content-wrapper button.secondary,
.content-wrapper button.options-btn,
.content-wrapper button.ghost,
.content-wrapper button.danger,
.content-wrapper .auction-subbtn,
.content-wrapper .billing-subbtn,
.content-wrapper .billing-module-btn,
body:not(.authenticated) .auth-secondary-btn {
  background: var(--bc-app-secondary-bg) !important;
  border-color: var(--bc-app-panel-border) !important;
  color: var(--bc-app-surface-text) !important;
}

.dashboard-action-btn.secondary:hover,
.content-wrapper button.secondary:hover,
.content-wrapper .auction-subbtn:hover,
.content-wrapper .billing-subbtn:hover,
.content-wrapper .billing-module-btn:hover,
.content-wrapper .options-btn:hover,
body:not(.authenticated) .auth-secondary-btn:hover {
  background: var(--bc-app-secondary-bg-hover) !important;
}

body:not(.authenticated) .auth-showcase-kicker,
body:not(.authenticated) .auth-portal-kicker,
body:not(.authenticated) .auth-benefit-icon {
  background: var(--bc-app-accent-soft);
  color: var(--bc-app-accent);
  border-color: color-mix(in oklab, var(--bc-app-accent) 24%, var(--bc-app-panel-border));
}

body:not(.authenticated) .auth-benefits li,
body:not(.authenticated) .auth-card,
.auth-faq-card {
  backdrop-filter: blur(10px);
}

@media (max-width: 1180px) {
  body:not(.authenticated) .auth-shell,
  .billing-page-toolbar,
  .billing-customer-shell,
  .billing-pane-grid,
  .billing-hero-grid,
  .groups-grid,
  .mini-grid,
  .company-grid,
  .inline-grid {
    grid-template-columns: 1fr;
  }

  .billing-page-toolbar {
    grid-template-columns: 1fr;
  }
}

/* ===== Source: bidcenter-dashboard-overrides.css ===== */
:root {
  --bc-page-max: 1680px;
  --bc-shell-gap: 18px;
  --bc-panel-radius: 20px;
  --bc-card-padding: 18px;
  --bc-input-height: 50px;
}

html {
  scroll-behavior: smooth;
}

body {
  background:
    radial-gradient(1200px 520px at -12% -10%, rgba(168, 85, 247, 0.12), transparent 48%),
    radial-gradient(1080px 420px at 108% -8%, rgba(216, 180, 254, 0.16), transparent 44%),
    linear-gradient(180deg, color-mix(in oklab, var(--bg-primary) 94%, #020817 6%) 0%, var(--bg-primary) 100%);
}

.wrap,
.workspace-shell,
.content-wrapper {
  width: min(var(--bc-page-max), 100%);
}

.content-wrapper {
  gap: clamp(16px, 2vw, 24px);
}

.manual-studio-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.manual-studio-toolbar-main {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.manual-studio-toolbar-more {
  flex: 0 0 auto;
  margin-left: auto;
}

.manual-studio-statusbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.manual-studio-statusbar .status.compact {
  flex: 0 1 auto;
  min-height: 36px;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 12px;
  line-height: 1.3;
  box-shadow: none;
}

.manual-live-actions {
  display: grid;
  gap: 10px;
}

.manual-live-action-card {
  border: 1px solid color-mix(in oklab, var(--line) 70%, transparent);
  border-radius: 14px;
  padding: 12px 14px;
  background: color-mix(in oklab, var(--panel) 86%, transparent);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.manual-live-action-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.manual-live-action-title {
  font-weight: 600;
  font-size: 14px;
}

.manual-live-action-meta {
  font-size: 12px;
  color: color-mix(in oklab, var(--text) 70%, transparent);
}

.manual-live-action-btn {
  min-width: 140px;
}

.manual-live-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}

.manual-live-kpi-card {
  border: 1px solid color-mix(in oklab, var(--line) 72%, transparent);
  border-radius: 14px;
  background: color-mix(in oklab, var(--panel) 86%, transparent);
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 84px;
}

.manual-live-kpi-label {
  font-size: 12px;
  color: color-mix(in oklab, var(--text) 75%, transparent);
}

.manual-live-kpi-card strong {
  font-size: 28px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: color-mix(in oklab, var(--text) 96%, transparent);
}

.manual-live-chart {
  display: grid;
  gap: 10px;
}

.manual-live-chart-card {
  border: 1px solid color-mix(in oklab, var(--line) 70%, transparent);
  border-radius: 14px;
  padding: 12px 14px;
  background: color-mix(in oklab, var(--panel) 84%, transparent);
}

.manual-live-chart-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.manual-live-chart-head strong {
  font-size: 14px;
}

.manual-live-chart-head span {
  font-size: 12px;
  color: color-mix(in oklab, var(--text) 74%, transparent);
}

.manual-live-chart-track {
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in oklab, var(--bg) 75%, transparent);
  display: flex;
}

.manual-live-chart-segment {
  height: 100%;
  display: block;
}

.manual-live-chart-segment.with-votes {
  background: linear-gradient(90deg, #22c55e, #16a34a);
}

.manual-live-chart-segment.no-votes {
  background: linear-gradient(90deg, #f59e0b, #f97316);
}

.manual-live-chart-segment.open-value {
  background: linear-gradient(90deg, #38bdf8, #0ea5e9);
}

.manual-live-chart-segment.closed-value {
  background: linear-gradient(90deg, #a78bfa, #8b5cf6);
}

.manual-live-chart-legend {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  font-size: 12px;
  color: color-mix(in oklab, var(--text) 80%, transparent);
}

.manual-live-chart-legend .dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 6px;
  transform: translateY(1px);
}

.manual-live-chart-legend .dot.with-votes { background: #22c55e; }
.manual-live-chart-legend .dot.no-votes { background: #f97316; }
.manual-live-chart-legend .dot.open-value { background: #0ea5e9; }
.manual-live-chart-legend .dot.closed-value { background: #8b5cf6; }

.manual-live-chart-empty {
  border: 1px dashed color-mix(in oklab, var(--line) 65%, transparent);
  border-radius: 12px;
  padding: 14px;
  font-size: 13px;
  color: color-mix(in oklab, var(--text) 76%, transparent);
}

.manual-live-poll-list {
  margin-top: 10px;
  max-height: min(64vh, 920px);
  overflow: auto;
  padding-right: 6px;
}

.manual-live-poll-card {
  border: 1px solid color-mix(in oklab, var(--line) 72%, transparent);
  border-radius: 14px;
  background: color-mix(in oklab, var(--panel) 86%, transparent);
  padding: 12px 14px;
}

.manual-live-poll-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.manual-live-current-value {
  margin-top: 8px;
  font-size: 13px;
  font-weight: 700;
  color: color-mix(in oklab, var(--text) 94%, transparent);
}

.manual-live-options {
  margin-top: 8px;
  display: grid;
  gap: 6px;
}

.manual-live-option-row {
  display: grid;
  gap: 4px;
}

.manual-live-option-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
}

.manual-live-option-label span {
  color: color-mix(in oklab, var(--text) 88%, transparent);
}

.manual-live-option-label b {
  color: color-mix(in oklab, var(--text) 72%, transparent);
  font-weight: 600;
}

.manual-live-option-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--bg) 76%, transparent);
  overflow: hidden;
}

.manual-live-option-bar span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #7c3aed, #3b82f6);
}

.manual-live-option-empty {
  font-size: 12px;
  color: color-mix(in oklab, var(--text) 70%, transparent);
  font-style: italic;
}

.card,
.dashboard-surface,
.group-panel,
.status,
.company-groups-card,
.auth-faq-card,
.payment-summary-card {
  border-radius: var(--bc-panel-radius);
  box-shadow: 0 18px 36px rgba(3, 10, 26, 0.18);
}

.card {
  padding: clamp(16px, 2vw, 22px);
}

.section-title,
.company-section-title,
.billing-subsection-title {
  letter-spacing: -0.02em;
}

.inline-grid,
.company-grid {
  display: grid;
  gap: 16px 18px;
  align-items: start;
}

.inline-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.company-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.inline-grid > *,
.company-grid > * {
  min-width: 0;
}

.inline-grid .full,
.company-grid .full {
  grid-column: 1 / -1;
}

.company-grid .span-2 {
  grid-column: span 2;
}

.segments-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.segments-grid label,
.checkline {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 14px;
  border-radius: 14px;
  border: 1px solid var(--bc-line);
  background: color-mix(in oklab, var(--bc-soft) 78%, transparent);
}

label {
  font-weight: 700;
}

input,
select,
textarea,
button {
  font: inherit;
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  width: 100%;
  min-width: 0;
  min-height: var(--bc-input-height);
  border-radius: 14px;
}

textarea {
  min-height: 112px;
  resize: vertical;
}

button,
.panel-btn,
.secondary,
.auth-primary-btn,
.auth-secondary-btn,
.user-plan-btn,
.user-dropdown-item {
  min-height: 46px;
  border-radius: 14px;
  transition: transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease, background 120ms ease;
}

button:hover,
.panel-btn:hover,
.secondary:hover,
.auth-primary-btn:hover,
.auth-secondary-btn:hover,
.user-plan-btn:hover,
.user-dropdown-item:hover {
  transform: translateY(-1px);
}

.faq-stack {
  display: grid;
  gap: 12px;
}

.faq-stack details {
  border: 1px solid var(--bc-line);
  border-radius: 16px;
  background: color-mix(in oklab, var(--bc-card) 88%, var(--bc-soft) 12%);
  padding: 14px 16px;
}

.faq-stack summary {
  cursor: pointer;
  font-weight: 800;
  list-style: none;
}

.faq-stack summary::-webkit-details-marker {
  display: none;
}

.faq-stack details p {
  margin: 10px 0 0;
}

.dashboard-shell {
  display: grid;
  grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.dashboard-sidebar,
.dashboard-main,
.dashboard-home-grid,
.dashboard-focus-grid,
.dashboard-actions,
.dashboard-quick-grid {
  display: grid;
  gap: 16px;
}

.dashboard-avatar,
.user-avatar {
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.dashboard-avatar {
  width: 72px;
  height: 72px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  font-size: 24px;
  font-weight: 800;
}

body:not(.authenticated) .auth-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(380px, 480px);
  gap: clamp(28px, 4vw, 56px);
  align-items: stretch;
}

body:not(.authenticated) .auth-showcase,
body:not(.authenticated) .auth-card {
  min-height: 100%;
}

body:not(.authenticated) .auth-showcase {
  padding: clamp(12px, 1vw, 18px) 0;
}

body:not(.authenticated) .auth-showcase-copy {
  max-width: 640px;
}

body:not(.authenticated) .auth-card {
  width: 100%;
  max-width: 480px;
  justify-self: end;
  padding: clamp(22px, 2.4vw, 32px);
}

body:not(.authenticated) .auth-inline-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

body:not(.authenticated) .auth-inline-grid .full {
  grid-column: 1 / -1;
}

body:not(.authenticated) .auth-card input,
body:not(.authenticated) .auth-card select,
body:not(.authenticated) .auth-card textarea {
  width: 100%;
  min-height: 52px;
}

body:not(.authenticated) .auth-primary-btn,
body:not(.authenticated) .auth-secondary-btn {
  width: 100%;
  justify-content: center;
}

body:not(.authenticated) .auth-switch-row,
body:not(.authenticated) .auth-footer-links,
body:not(.authenticated) .auth-footer-cta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

body:not(.authenticated) .auth-footer-links {
  justify-content: center;
  row-gap: 8px;
}

body:not(.authenticated) .auth-footer-links a,
body:not(.authenticated) .auth-footer-links button {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body:not(.authenticated) .auth-status-wrap .status {
  min-height: 42px;
  display: flex;
  align-items: center;
}

.company-groups-card,
.billing-payment-card,
.billing-proof-card {
  padding: 16px 18px;
  border: 1px solid var(--bc-line);
  background: color-mix(in oklab, var(--bc-card) 92%, var(--bc-soft) 8%);
}

.company-section-title {
  margin: 10px 0 2px;
}

.row,
.inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.row > *,
.inline-actions > * {
  min-width: 0;
}

@media (max-width: 1180px) {
  .dashboard-shell {
    grid-template-columns: 1fr;
  }

  body:not(.authenticated) .auth-shell {
    grid-template-columns: 1fr;
  }

  body:not(.authenticated) .auth-card {
    max-width: 100%;
    justify-self: stretch;
  }

  .company-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .segments-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .inline-grid,
  .company-grid,
  body:not(.authenticated) .auth-inline-grid,
  .segments-grid {
    grid-template-columns: 1fr;
  }

  .company-grid .span-2 {
    grid-column: auto;
  }

  body:not(.authenticated) .auth-card,
  .card {
    padding: 16px;
  }

  body:not(.authenticated) .auth-footer-links {
    justify-content: flex-start;
  }
}

/* Unified shell/theme refresh */

:root,
[data-theme="light"] {
  --bc-ui-shell-bg:
    radial-gradient(1040px 420px at 4% -8%, rgba(168, 85, 247, 0.1), transparent 44%),
    radial-gradient(920px 340px at 100% -12%, rgba(216, 180, 254, 0.14), transparent 42%),
    linear-gradient(180deg, #f5f0fb 0%, #faf7fe 52%, #f1ebf8 100%);
  --bc-ui-header-bg: rgba(255, 251, 255, 0.9);
  --bc-ui-panel-bg: rgba(254, 250, 255, 0.95);
  --bc-ui-panel-muted: rgba(246, 237, 255, 0.94);
  --bc-ui-panel-border: rgba(62, 41, 92, 0.1);
  --bc-ui-text: #20162b;
  --bc-ui-muted: #67587a;
  --bc-ui-soft: #9485aa;
  --bc-ui-field-bg: #fcf9ff;
  --bc-ui-field-border: rgba(62, 41, 92, 0.12);
  --bc-ui-field-text: #20162b;
  --bc-ui-shadow: 0 18px 42px rgba(35, 22, 53, 0.09);
  --bc-ui-accent: #a855f7;
  --bc-ui-accent-strong: #7c3aed;
  --bc-ui-accent-soft: rgba(168, 85, 247, 0.12);
  --bc-ui-danger-soft: rgba(219, 39, 119, 0.12);
  --bc-ui-warn-soft: rgba(192, 132, 252, 0.18);
}

[data-theme="dark"] {
  --bc-ui-shell-bg:
    radial-gradient(1120px 460px at 0% -10%, rgba(168, 85, 247, 0.09), transparent 46%),
    radial-gradient(980px 380px at 100% -12%, rgba(216, 180, 254, 0.08), transparent 44%),
    linear-gradient(180deg, #0b0910 0%, #100c16 52%, #140f1b 100%);
  --bc-ui-header-bg: rgba(18, 13, 24, 0.92);
  --bc-ui-panel-bg: rgba(22, 17, 29, 0.95);
  --bc-ui-panel-muted: rgba(28, 21, 37, 0.96);
  --bc-ui-panel-border: rgba(246, 239, 255, 0.08);
  --bc-ui-text: #f6f2ff;
  --bc-ui-muted: #b8abcc;
  --bc-ui-soft: #8d7fa2;
  --bc-ui-field-bg: #171120;
  --bc-ui-field-border: rgba(245, 239, 230, 0.08);
  --bc-ui-field-text: #f6f2ff;
  --bc-ui-shadow: 0 18px 42px rgba(0, 0, 0, 0.24);
  --bc-ui-accent: #c084fc;
  --bc-ui-accent-strong: #8b5cf6;
  --bc-ui-accent-soft: rgba(192, 132, 252, 0.14);
  --bc-ui-danger-soft: rgba(219, 39, 119, 0.14);
  --bc-ui-warn-soft: rgba(168, 85, 247, 0.18);
}

body,
[data-theme] body {
  background: var(--bc-ui-shell-bg) !important;
  color: var(--bc-ui-text);
}

.main-content,
.dashboard {
  background: transparent;
}

.sidebar,
.header,
.card,
.dashboard-surface,
.group-panel,
.company-groups-card,
.auth-faq-card,
.payment-summary-card,
.billing-page-section,
.billing-section-card,
.billing-composer,
.billing-list-toolbar,
.billing-empty-state,
.billing-payment-card,
.billing-proof-card,
.billing-pane-shell,
.billing-kpi-card,
.billing-hero-card,
.workspace-menu-panel,
.auction-subnav-card,
.dashboard-summary-card,
.dashboard-panel,
.billing-customer-mainlist,
.billing-customer-sidebar,
.payment-flow-surface,
.logo-preview-wrap,
.template-preview-wrap,
.billing-table,
.billing-payment-request-list,
#billingOrderItems,
#billingOrderList,
#billingCustomerList {
  background: var(--bc-ui-panel-bg) !important;
  border-color: var(--bc-ui-panel-border) !important;
  box-shadow: var(--bc-ui-shadow) !important;
}

.header {
  background: var(--bc-ui-header-bg) !important;
  border-color: var(--bc-ui-panel-border) !important;
  backdrop-filter: blur(18px);
}

.header-center {
  border-top-color: var(--bc-ui-panel-border) !important;
}

.header-business,
.header-search,
.header-utility-btn,
.user-menu,
.workspace-trigger,
.workspace-menu-link,
.workspace-menu-note,
.dashboard-chip,
.metric-pill,
.status-badge,
.dashboard-inline-metric,
.status-mini-card,
.auction-metric,
.metric-card,
.checklist-item,
.activity-item,
.billing-context-link,
.billing-hero-chip,
.command-catalog li,
.org-list li,
.group-list li,
.manual-group-list li,
.schedule-list li,
.substitute-item,
.faq-stack details,
.status,
.segments-grid label,
.checkline,
.dashboard-mini-list li,
.billing-keypoints li,
.payment-proof-item {
  background: var(--bc-ui-panel-muted) !important;
  border-color: var(--bc-ui-panel-border) !important;
  color: var(--bc-ui-text) !important;
}

.workspace-trigger,
.header-search,
.content-wrapper input,
.content-wrapper select,
.content-wrapper textarea,
.content-wrapper .filter-input,
body:not(.authenticated) .auth-card input,
body:not(.authenticated) .auth-card select,
body:not(.authenticated) .auth-card textarea {
  background: var(--bc-ui-field-bg) !important;
  border-color: var(--bc-ui-field-border) !important;
  color: var(--bc-ui-field-text) !important;
}

.header-search::placeholder,
.content-wrapper input::placeholder,
.content-wrapper textarea::placeholder,
.content-wrapper .filter-input::placeholder,
body:not(.authenticated) .auth-card input::placeholder,
body:not(.authenticated) .auth-card textarea::placeholder {
  color: var(--bc-ui-soft) !important;
}

.content-wrapper h2,
.content-wrapper h3,
.content-wrapper .section-title,
.content-wrapper .company-section-title,
.dashboard-section-header h2,
.dashboard-board-header h3,
.dashboard-card-head h3,
.dashboard-card-head-simple h3,
.dashboard-identity-copy h3,
body:not(.authenticated) .auth-showcase h1,
body:not(.authenticated) .auth-card h2,
.auth-faq-head h2 {
  color: var(--bc-ui-text) !important;
}

.content-wrapper label,
.content-wrapper .muted,
.content-wrapper .subhead,
.content-wrapper .quick-caption,
.dashboard-section-header p,
.dashboard-board-header p,
.dashboard-identity-copy p,
.admin-panel-phase-compact p,
.dashboard-card-subtitle,
.status-mini-meta,
.metric-card p,
.auction-metric small,
.checklist-copy p,
.activity-copy p,
.billing-page-toolbar-copy span,
.billing-page-section-head p,
.billing-section-head p,
.billing-composer-head span,
.billing-inline-note,
.billing-empty-state p,
.payment-flow-surface .muted,
.company-groups-card .muted,
body:not(.authenticated) .auth-card .subhead,
body:not(.authenticated) .auth-brand-subtitle,
body:not(.authenticated) .auth-showcase p,
body:not(.authenticated) .auth-benefit-copy span,
body:not(.authenticated) .auth-showcase-footer,
body:not(.authenticated) .auth-footer-cta,
body:not(.authenticated) .auth-social-note,
body:not(.authenticated) .auth-footer-links,
body:not(.authenticated) .auth-footer-links a,
body:not(.authenticated) .auth-footer-links button,
.auth-faq-head p,
.faq-stack details p {
  color: var(--bc-ui-muted) !important;
}

.dashboard-note-card-inline,
.status.ok,
.status-badge.success,
.billing-context-link.active {
  background: var(--bc-ui-accent-soft) !important;
  border-color: color-mix(in oklab, var(--bc-ui-accent) 28%, var(--bc-ui-panel-border)) !important;
  color: var(--bc-ui-accent-strong) !important;
}

.status.warn,
.status-badge.warn {
  background: var(--bc-ui-warn-soft) !important;
  border-color: color-mix(in oklab, #f59e0b 28%, var(--bc-ui-panel-border)) !important;
}

.status-badge.danger {
  background: var(--bc-ui-danger-soft) !important;
  border-color: color-mix(in oklab, #ef4444 28%, var(--bc-ui-panel-border)) !important;
}

.content-wrapper button,
.dashboard-action-btn.primary,
body:not(.authenticated) .auth-primary-btn,
.content-wrapper .auction-subbtn.active,
.content-wrapper .billing-subbtn.active,
.content-wrapper .billing-module-btn.active,
.content-wrapper .options-nav .options-btn.active {
  background: linear-gradient(180deg, var(--bc-ui-accent), var(--bc-ui-accent-strong)) !important;
  color: #07130b !important;
  border-color: transparent !important;
  box-shadow: 0 12px 24px color-mix(in oklab, var(--bc-ui-accent) 24%, transparent);
}

.content-wrapper button.secondary,
.content-wrapper button.options-btn,
.content-wrapper button.ghost,
.content-wrapper button.danger,
.content-wrapper .auction-subbtn,
.content-wrapper .billing-subbtn,
.content-wrapper .billing-module-btn,
body:not(.authenticated) .auth-secondary-btn {
  background: var(--bc-ui-panel-muted) !important;
  color: var(--bc-ui-text) !important;
  border-color: var(--bc-ui-panel-border) !important;
  box-shadow: none !important;
}

body:not(.authenticated) .auth-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(420px, 520px);
  gap: clamp(32px, 4vw, 64px);
  align-items: stretch;
}

body:not(.authenticated) .auth-showcase,
body:not(.authenticated) .auth-card {
  min-height: 100%;
}

body:not(.authenticated) .auth-showcase {
  display: grid;
  gap: 24px;
  align-content: center;
  padding: clamp(20px, 2.2vw, 32px) 0;
}

body:not(.authenticated) .auth-showcase-copy {
  max-width: 640px;
}

body:not(.authenticated) .auth-benefits {
  gap: 14px;
  max-width: 560px;
}

body:not(.authenticated) .auth-benefits li {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  padding: 18px 20px;
}

body:not(.authenticated) .auth-benefit-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
}

body:not(.authenticated) .auth-card {
  width: 100%;
  max-width: 520px;
  justify-self: end;
  padding: clamp(26px, 2.4vw, 34px) !important;
  border-radius: 28px;
}

body:not(.authenticated) .auth-inline-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

body:not(.authenticated) .auth-inline-grid > * {
  min-width: 0;
}

body:not(.authenticated) .auth-inline-grid .full {
  grid-column: 1 / -1;
}

body:not(.authenticated) .auth-card input,
body:not(.authenticated) .auth-card select,
body:not(.authenticated) .auth-card textarea {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 54px !important;
  padding: 14px 16px !important;
  border-radius: 16px !important;
}

body:not(.authenticated) .auth-primary-btn,
body:not(.authenticated) .auth-secondary-btn {
  width: 100%;
  justify-content: center;
}

body:not(.authenticated) .auth-switch-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

body:not(.authenticated) .auth-footer-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

body:not(.authenticated) .auth-footer-links a,
body:not(.authenticated) .auth-footer-links button,
body:not(.authenticated) .auth-link-btn {
  color: var(--bc-ui-accent-strong) !important;
}

#options-orgs .card,
#panel-billing .card,
#panel-auction .card {
  border-radius: 24px;
}

#options-orgs .company-grid {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 16px 18px;
  align-items: start;
}

#options-orgs .company-grid > * {
  grid-column: span 4;
  min-width: 0;
}

#options-orgs .company-grid .span-2 {
  grid-column: span 8;
}

#options-orgs .company-grid .full {
  grid-column: 1 / -1;
}

#options-orgs .company-grid input,
#options-orgs .company-grid select,
#options-orgs .company-grid textarea {
  width: 100%;
}

#options-orgs .segments-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

#options-orgs .segments-grid label,
#options-orgs .checkline {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  min-height: 50px;
  padding: 0 14px;
  margin: 0;
}

#options-orgs input[type="checkbox"],
#panel-billing input[type="checkbox"],
#panel-auction input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-height: 18px;
  margin: 0;
  accent-color: var(--bc-ui-accent-strong);
}

#options-orgs .company-section-title {
  margin: 8px 0 0;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#panel-billing .billing-page-toolbar,
#panel-billing .billing-pane-grid,
#panel-billing .billing-customer-shell,
#panel-billing .billing-hero-grid,
#panel-billing .billing-kpi-grid,
#panel-auction .groups-grid,
#panel-auction .mini-grid {
  gap: 18px;
}

#panel-billing .billing-payment-card,
#panel-billing .billing-proof-card {
  display: grid;
  gap: 14px;
  padding: 18px 20px;
}

#panel-billing .billing-payment-card-header,
#panel-billing .billing-proof-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

#panel-billing .billing-proof-list {
  display: grid;
  gap: 10px;
}

#panel-billing .billing-proof-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--bc-ui-panel-border);
  border-radius: 14px;
}

@media (max-width: 1180px) {
  body:not(.authenticated) .auth-shell,
  #panel-billing .billing-page-toolbar,
  #panel-billing .billing-customer-shell,
  #panel-billing .billing-pane-grid,
  #panel-billing .billing-hero-grid,
  #panel-auction .groups-grid,
  #panel-auction .mini-grid {
    grid-template-columns: 1fr;
  }

  body:not(.authenticated) .auth-card {
    max-width: 100%;
    justify-self: stretch;
  }

  #options-orgs .company-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #options-orgs .company-grid > *,
  #options-orgs .company-grid .span-2 {
    grid-column: auto;
  }

  #options-orgs .segments-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  body:not(.authenticated) .auth-shell,
  body:not(.authenticated) .auth-inline-grid,
  #options-orgs .company-grid,
  #options-orgs .segments-grid,
  .inline-grid,
  .company-grid {
    grid-template-columns: 1fr !important;
  }

  body:not(.authenticated) .auth-card,
  .card,
  .dashboard-surface {
    padding: 18px !important;
  }

  body:not(.authenticated) .auth-footer-links {
    justify-content: flex-start;
  }
}

/* Stretch content and internal page balance */

.content-wrapper,
.content-wrapper.bidcenter-content {
  width: min(var(--bc-page-max), 100%);
  max-width: var(--bc-page-max);
}

#billing-pane-cadastros .billing-customer-shell {
  grid-template-columns: 1fr !important;
}

#billing-pane-cadastros .billing-customer-mainlist {
  min-width: 0;
  width: 100%;
}

/* Cleaner auth */

body:not(.authenticated) .auth-shell {
  grid-template-columns: minmax(0, 1.12fr) minmax(430px, 500px);
  gap: clamp(40px, 4.2vw, 72px);
}

body:not(.authenticated) .auth-showcase {
  max-width: 760px;
}

body:not(.authenticated) .auth-showcase h1 {
  font-size: clamp(44px, 5.6vw, 78px);
  line-height: 0.98;
  max-width: 720px;
}

body:not(.authenticated) .auth-card {
  max-width: 500px;
  padding: clamp(28px, 2.6vw, 38px) !important;
}

body:not(.authenticated) .auth-primary-btn {
  min-height: 56px !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 22px color-mix(in oklab, var(--bc-ui-accent) 20%, transparent) !important;
}

body:not(.authenticated) .auth-link-btn,
body:not(.authenticated) .auth-footer-links button,
body:not(.authenticated) .auth-footer-links a {
  display: inline-flex !important;
  align-items: center;
  width: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-decoration: none;
}

body:not(.authenticated) .auth-link-btn:hover,
body:not(.authenticated) .auth-footer-links button:hover,
body:not(.authenticated) .auth-footer-links a:hover {
  background: transparent !important;
}

body:not(.authenticated) .auth-switch-row {
  align-items: center;
}

body:not(.authenticated) .auth-switch-row .auth-social-note {
  margin-left: auto;
}

body:not(.authenticated) .auth-footer-cta {
  justify-content: center;
}

/* Dashboard commerce */

.dashboard-panel-span-2 {
  grid-column: 1 / -1;
}

.dashboard-commerce-panel {
  display: grid;
  gap: 22px;
}

.dashboard-commerce-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.dashboard-commerce-kpi-card,
.dashboard-commerce-chart-card {
  display: grid;
  gap: 10px;
  padding: 18px 20px;
  border-radius: 20px;
  border: 1px solid var(--bc-ui-panel-border);
  background: var(--bc-ui-panel-muted);
}

.dashboard-commerce-kpi-card strong {
  font-size: clamp(24px, 2vw, 34px);
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--bc-ui-text);
}

.dashboard-commerce-kpi-card p {
  margin: 0;
  color: var(--bc-ui-muted);
  font-size: 13px;
  line-height: 1.55;
}

.dashboard-commerce-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.88fr) minmax(360px, 1.12fr);
  gap: 18px;
}

.dashboard-pie-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
}

.dashboard-pie-shell {
  display: grid;
  place-items: center;
}

.dashboard-pie-chart {
  width: 220px;
  aspect-ratio: 1;
  border-radius: 50%;
  position: relative;
  background: conic-gradient(rgba(148, 163, 184, 0.24) 0 100%);
  box-shadow: inset 0 0 0 1px var(--bc-ui-panel-border);
}

.dashboard-pie-chart::after {
  content: "";
  position: absolute;
  inset: 24px;
  border-radius: 50%;
  background: var(--bc-ui-panel-bg);
  box-shadow: inset 0 0 0 1px var(--bc-ui-panel-border);
}

.dashboard-pie-chart.is-empty {
  opacity: 0.8;
}

.dashboard-pie-center {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  place-items: center;
  text-align: center;
  gap: 2px;
}

.dashboard-pie-center strong {
  font-size: 32px;
  line-height: 1;
  letter-spacing: -0.05em;
  color: var(--bc-ui-text);
}

.dashboard-pie-center span {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bc-ui-muted);
}

.dashboard-pie-legend {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.dashboard-pie-legend li {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.dashboard-pie-legend strong {
  display: block;
  font-size: 16px;
  color: var(--bc-ui-text);
}

.dashboard-pie-legend small {
  color: var(--bc-ui-muted);
  font-size: 12px;
}

.dashboard-pie-swatch {
  width: 12px;
  height: 12px;
  border-radius: 999px;
}

.dashboard-pie-swatch.pending { background: #d8b4fe; }
.dashboard-pie-swatch.paid { background: #a855f7; }
.dashboard-pie-swatch.delivery { background: #8b5cf6; }
.dashboard-pie-swatch.delivered { background: #ec4899; }

.dashboard-ranking-list {
  display: grid;
  gap: 12px;
}

.dashboard-ranking-item {
  display: grid;
  gap: 10px;
  padding: 14px 0 0;
  border-top: 1px solid var(--bc-ui-panel-border);
}

.dashboard-ranking-item:first-child {
  border-top: 0;
  padding-top: 0;
}

.dashboard-ranking-copy {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.dashboard-ranking-index {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: var(--bc-ui-accent-soft);
  color: var(--bc-ui-accent-strong);
  font-weight: 800;
}

.dashboard-ranking-copy strong {
  display: block;
  color: var(--bc-ui-text);
}

.dashboard-ranking-copy small {
  color: var(--bc-ui-muted);
}

.dashboard-ranking-bar {
  height: 9px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--bc-ui-panel-border) 60%, transparent);
  overflow: hidden;
}

.dashboard-ranking-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--bc-ui-accent), color-mix(in oklab, var(--bc-ui-accent) 62%, #d8b4fe 38%));
}

.dashboard-empty-compact {
  min-height: 180px;
  align-content: center;
}

@media (max-width: 1180px) {
  .dashboard-commerce-kpi-grid,
  .dashboard-commerce-grid {
    grid-template-columns: 1fr 1fr;
  }

  .dashboard-pie-layout {
    grid-template-columns: 1fr;
    justify-items: center;
  }
}

@media (max-width: 860px) {
  .dashboard-commerce-kpi-grid,
  .dashboard-commerce-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-pie-chart {
    width: 190px;
  }
}

/* Final polish: softer copy, lilac shell, vendas filters and dropdown cleanup */

:root {
  --bc-page-max: 1680px;
}

:root,
[data-theme="light"] {
  --bc-ui-shell-bg:
    radial-gradient(1240px 540px at -8% -10%, rgba(168, 85, 247, 0.22), transparent 48%),
    radial-gradient(1080px 420px at 108% -6%, rgba(216, 180, 254, 0.28), transparent 42%),
    linear-gradient(180deg, #f2e8ff 0%, #faf5ff 52%, #f3ebff 100%);
}

[data-theme="dark"] {
  --bc-ui-shell-bg:
    radial-gradient(1240px 540px at -8% -10%, rgba(168, 85, 247, 0.22), transparent 48%),
    radial-gradient(1080px 420px at 108% -6%, rgba(216, 180, 254, 0.26), transparent 42%),
    linear-gradient(180deg, #eadbff 0%, #f7f0ff 52%, #efe3ff 100%);
}

body,
[data-theme] body {
  background: var(--bc-ui-shell-bg) !important;
}

.content-wrapper,
.content-wrapper.bidcenter-content {
  width: min(var(--bc-page-max), 100%);
  max-width: var(--bc-page-max);
}

body:not(.authenticated) .auth-showcase {
  color: #2a1738;
}

body:not(.authenticated) .auth-brand-subtitle,
body:not(.authenticated) .auth-showcase p,
body:not(.authenticated) .auth-benefit-copy span,
body:not(.authenticated) .auth-showcase-footer {
  color: #65527a !important;
}

body:not(.authenticated) .auth-showcase h1,
body:not(.authenticated) .auth-benefit-copy strong {
  color: #241433 !important;
}

body:not(.authenticated) .auth-showcase-kicker,
body:not(.authenticated) .auth-portal-kicker,
body:not(.authenticated) .auth-benefit-icon {
  background: rgba(255, 255, 255, 0.54) !important;
  color: #7c3aed !important;
  border-color: rgba(124, 58, 237, 0.18) !important;
}

body:not(.authenticated) .auth-benefits li {
  background: rgba(255, 255, 255, 0.46) !important;
  border-color: rgba(124, 58, 237, 0.12) !important;
  box-shadow: 0 18px 34px rgba(75, 35, 118, 0.08) !important;
}

body:not(.authenticated) .auth-card {
  background: rgba(22, 17, 29, 0.94) !important;
}

body:not(.authenticated) .auth-primary-btn,
.content-wrapper button,
.dashboard-action-btn.primary,
.content-wrapper .auction-subbtn.active,
.content-wrapper .billing-subbtn.active,
.content-wrapper .billing-module-btn.active,
.content-wrapper .options-nav .options-btn.active {
  color: #faf5ff !important;
}

.user-dropdown {
  background: rgba(20, 15, 28, 0.96) !important;
  border-color: rgba(192, 132, 252, 0.18) !important;
  box-shadow: 0 24px 44px rgba(18, 10, 32, 0.32) !important;
}

.user-dropdown-header,
.user-dropdown-plan,
.user-dropdown-item,
.user-plan-btn {
  background: rgba(38, 28, 50, 0.86) !important;
  border-color: rgba(192, 132, 252, 0.14) !important;
  color: #f6f2ff !important;
}

.user-dropdown-role,
.user-plan-name {
  color: #c7b8dc !important;
}

.user-dropdown-item:hover,
.user-plan-btn:hover {
  background: rgba(71, 46, 96, 0.86) !important;
  border-color: rgba(216, 180, 254, 0.22) !important;
}

.user-dropdown-menu {
  border-bottom-color: rgba(192, 132, 252, 0.1) !important;
}

.billing-table-head {
  background: linear-gradient(180deg, rgba(92, 52, 138, 0.94), rgba(71, 39, 112, 0.96)) !important;
  color: #efe7fb !important;
}

.billing-stat-chip,
.billing-module-hero,
.billing-page-toolbar,
.billing-page-section,
.billing-payment-request-card,
.billing-payment-request-proof-summary,
.billing-proof-item {
  background: linear-gradient(180deg, rgba(34, 24, 46, 0.96), rgba(24, 18, 33, 0.98)) !important;
  border-color: rgba(192, 132, 252, 0.12) !important;
}

.billing-payment-request-card {
  display: grid;
  gap: 14px;
  padding: 18px 20px;
  border-radius: 20px;
}

.billing-payment-request-head,
.billing-payment-request-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.billing-payment-request-meta {
  display: grid;
  gap: 8px;
  color: var(--bc-ui-muted);
}

.billing-payment-request-meta strong,
.billing-payment-request-proof-summary strong {
  color: var(--bc-ui-text);
}

.checklist-item {
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
}

.checklist-copy {
  min-width: 0;
}

.checklist-action {
  justify-self: end;
  min-width: 116px;
}

#billing-pane-cadastros .billing-customer-shell,
#billing-pane-cadastros .billing-customer-mainlist,
#billing-pane-cadastros .billing-section-card {
  width: 100%;
  max-width: none;
}

#billing-pane-vendas .billing-customer-shell {
  grid-template-columns: minmax(0, 1.92fr) minmax(300px, 0.58fr) !important;
  align-items: start;
}

#billing-pane-vendas .billing-customer-sidebar {
  width: min(100%, 360px);
  justify-self: end;
}

#billing-pane-vendas .billing-list-toolbar-filters-orders {
  display: grid;
  grid-template-columns: auto minmax(260px, 1.35fr) 190px 160px 160px auto auto;
  gap: 12px;
  align-items: center;
}

#billing-pane-vendas .billing-list-toolbar-filters-orders .filter-input {
  min-width: 0;
}

#billing-pane-vendas .billing-table.orders .billing-table-head,
#billing-pane-vendas .billing-table.orders .billing-table-row {
  grid-template-columns: 140px minmax(220px, 1.35fr) 120px minmax(150px, 1fr) 110px 164px 118px;
}

#billing-pane-vendas .billing-list-head-actions {
  align-items: stretch;
  justify-content: flex-end;
  gap: 12px;
}

#billing-pane-vendas .billing-order-info-panel {
  min-width: 248px;
  max-width: 280px;
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid color-mix(in oklab, var(--bc-ui-border) 72%, transparent);
  background: color-mix(in oklab, var(--bc-ui-panel-strong) 88%, transparent);
}

#billing-pane-vendas .billing-order-info-panel h4 {
  margin: 0;
  color: var(--bc-ui-heading);
  font-size: 17px;
  font-weight: 800;
}

#billing-pane-vendas .billing-order-info-metric {
  display: grid;
  gap: 2px;
}

#billing-pane-vendas .billing-order-info-metric span {
  font-size: 13px;
  color: var(--bc-ui-copy);
}

#billing-pane-vendas .billing-order-info-metric strong {
  font-size: 28px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #16a34a;
}

#billing-pane-vendas .billing-order-info-panel small {
  font-size: 12px;
  line-height: 1.35;
  color: color-mix(in oklab, var(--bc-ui-copy) 85%, #4b5563 15%);
}

.billing-order-composer-card {
  width: min(1180px, calc(100vw - 32px)) !important;
  max-height: calc(100dvh - 32px) !important;
}

.billing-order-composer-card #billingOrderComposer {
  margin: 0;
  border: 0;
  box-shadow: none;
  background: transparent;
  padding: 0;
}

.billing-order-composer-card #billingOrderComposer .billing-page-section {
  background: color-mix(in oklab, var(--bc-ui-panel) 92%, transparent) !important;
}

.dashboard-commerce-kpi-card,
.dashboard-commerce-chart-card {
  background: rgba(31, 23, 42, 0.92) !important;
  border-color: rgba(192, 132, 252, 0.12) !important;
}

.dashboard-home .dashboard-shell-overview > .dashboard-board-header {
  padding: 6px 10px 0;
}

.dashboard-home .dashboard-shell-overview > .dashboard-board-header .dashboard-section-kicker {
  color: #8b5cf6 !important;
}

.dashboard-home .dashboard-shell-overview > .dashboard-board-header h3 {
  color: #251239 !important;
}

.dashboard-home .dashboard-shell-overview > .dashboard-board-header p {
  color: #6f5e86 !important;
}

.dashboard-ranking-index {
  background: rgba(192, 132, 252, 0.16) !important;
}

@media (max-width: 1460px) {
  #billing-pane-vendas .billing-customer-shell {
    grid-template-columns: minmax(0, 1fr) 330px !important;
  }

  #billing-pane-vendas .billing-list-toolbar-filters-orders {
    grid-template-columns: auto minmax(220px, 1fr) 180px 1fr 1fr auto auto;
  }

  #billing-pane-vendas .billing-order-info-panel {
    min-width: 220px;
  }
}

@media (max-width: 1180px) {
  .checklist-item {
    grid-template-columns: 46px minmax(0, 1fr);
  }

  .checklist-action {
    grid-column: 2;
    justify-self: start;
  }

  #billing-pane-vendas .billing-customer-shell,
  #billing-pane-vendas .billing-list-toolbar-filters-orders {
    grid-template-columns: 1fr !important;
  }

  #billing-pane-vendas .billing-customer-sidebar {
    width: 100%;
    justify-self: stretch;
  }

  #billing-pane-vendas .billing-list-head-actions {
    width: 100%;
    justify-content: stretch;
  }

  #billing-pane-vendas .billing-order-info-panel {
    width: 100%;
    max-width: none;
  }
}

/* Final layer 2026-03-18: purple shell, sales drawer, editorial customers, login cleanup */

:root {
  --bc-page-max: 1780px;
  --bc-rail-width: 364px;
}

[data-theme="light"] {
  --bc-ui-shell-bg:
    radial-gradient(1300px 560px at -10% -12%, rgba(168, 85, 247, 0.22), transparent 48%),
    radial-gradient(1180px 480px at 108% -8%, rgba(216, 180, 254, 0.24), transparent 44%),
    linear-gradient(180deg, #f4eafe 0%, #fbf7ff 54%, #f3e9ff 100%);
  --bc-ui-surface: rgba(255, 255, 255, 0.72);
  --bc-ui-panel: rgba(255, 255, 255, 0.78);
  --bc-ui-panel-strong: rgba(255, 255, 255, 0.9);
  --bc-ui-border: rgba(124, 58, 237, 0.12);
  --bc-ui-heading: #26153b;
  --bc-ui-copy: #6f5d88;
  --bc-ui-muted-copy: #88759f;
  --bc-ui-accent: #8b5cf6;
  --bc-ui-accent-strong: #6d28d9;
  --bc-ui-accent-soft: rgba(139, 92, 246, 0.12);
  --bc-ui-shadow: 0 22px 56px rgba(89, 49, 145, 0.12);
}

[data-theme="dark"] {
  --bc-ui-shell-bg:
    radial-gradient(1280px 520px at -14% -14%, rgba(168, 85, 247, 0.16), transparent 48%),
    radial-gradient(980px 420px at 112% -8%, rgba(192, 132, 252, 0.12), transparent 42%),
    linear-gradient(180deg, #0f0a16 0%, #15101f 52%, #1b1326 100%);
  --bc-ui-surface: rgba(29, 21, 39, 0.9);
  --bc-ui-panel: rgba(22, 17, 31, 0.94);
  --bc-ui-panel-strong: rgba(18, 14, 26, 0.98);
  --bc-ui-border: rgba(216, 180, 254, 0.12);
  --bc-ui-heading: #f6f0ff;
  --bc-ui-copy: #b9aed0;
  --bc-ui-muted-copy: #988db1;
  --bc-ui-accent: #a855f7;
  --bc-ui-accent-strong: #c084fc;
  --bc-ui-accent-soft: rgba(168, 85, 247, 0.18);
  --bc-ui-shadow: 0 26px 64px rgba(0, 0, 0, 0.36);
}

body,
[data-theme] body {
  background: var(--bc-ui-shell-bg) !important;
  color: var(--bc-ui-heading) !important;
}

.content-wrapper,
.content-wrapper.bidcenter-content {
  width: min(var(--bc-page-max), calc(100% - 8px));
  max-width: var(--bc-page-max);
}

.header {
  width: min(var(--bc-page-max), calc(100% - 8px)) !important;
  max-width: var(--bc-page-max) !important;
}

#panel-billing > main.stack,
#panel-auction > main.stack,
#panel-options > main.stack,
#panel-core > main.stack {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

#panel-billing .billing-shell,
#panel-billing .billing-page-toolbar,
#panel-billing .billing-section-card,
#panel-billing .billing-page-section,
#panel-billing .billing-pane-shell,
#panel-billing .billing-pane-grid,
#panel-billing .billing-finance-shell {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.main-content,
.dashboard,
.content-wrapper.bidcenter-content,
.stack,
.billing-shell {
  min-width: 0;
}

.sidebar,
.header,
.workspace-menu-panel,
.user-menu,
.user-dropdown,
.dashboard-surface,
.dashboard-summary-card,
.dashboard-panel,
.card,
.billing-page-toolbar,
.billing-section-card,
.billing-page-section,
.billing-composer,
.billing-form-shell .billing-page-section,
.billing-payment-request-card,
.billing-payment-request-proof-summary,
.billing-payment-request-proof,
.billing-proof-item,
.billing-list-toolbar,
.group-panel,
.modal-card,
.sheet-card {
  background: var(--bc-ui-panel) !important;
  border-color: var(--bc-ui-border) !important;
  box-shadow: var(--bc-ui-shadow) !important;
}

.header,
.sidebar {
  background: color-mix(in oklab, var(--bc-ui-panel-strong) 92%, transparent) !important;
  backdrop-filter: blur(16px);
}

.header-business,
.workspace-title,
.dashboard-card-subtitle,
.dashboard-panel p,
.subhead,
.billing-page-toolbar-copy span,
.billing-page-section-head p,
.billing-list-toolbar-head span,
.billing-list-meta,
.user-role,
.user-dropdown-role,
.auth-social-note,
.auth-showcase-footer,
.auth-brand-subtitle {
  color: var(--bc-ui-copy) !important;
}

.dashboard-section-kicker,
.dashboard-panel-label,
.dashboard-phase-label,
.status-mini-label,
.metric-card label,
.billing-page-toolbar-copy strong,
.billing-section-head h3,
.billing-sales-rail-head strong,
.auth-showcase-kicker,
.auth-portal-kicker {
  color: var(--bc-ui-accent-strong) !important;
}

.header,
.sidebar,
.workspace-menu-panel,
.user-menu,
.user-dropdown,
.dashboard-summary-card,
.dashboard-panel,
.billing-section-card,
.billing-page-section,
.billing-list-toolbar,
.billing-composer,
.billing-payment-request-card,
.billing-payment-request-proof-summary,
.billing-payment-request-proof {
  border-width: 1px !important;
  border-style: solid !important;
}

.header-search,
.header-utility-btn,
.workspace-trigger,
.workspace-link,
.user-menu,
.user-dropdown-item,
.user-plan-btn,
.filter-input,
.content-wrapper input,
.content-wrapper select,
.content-wrapper textarea,
.billing-search-shell,
.billing-icon-btn,
.dashboard-link-btn.secondary,
.dashboard-action-btn.secondary,
.content-wrapper .secondary,
.checklist-action {
  border-color: var(--bc-ui-border) !important;
}

.header-search,
.header-utility-btn,
.workspace-trigger,
.workspace-link,
.user-menu,
.user-dropdown-item,
.user-plan-btn,
.filter-input,
.content-wrapper input,
.content-wrapper select,
.content-wrapper textarea,
.billing-search-shell,
.billing-icon-btn,
.dashboard-link-btn.secondary,
.dashboard-action-btn.secondary,
.content-wrapper .secondary,
.checklist-action {
  background: color-mix(in oklab, var(--bc-ui-panel-strong) 92%, transparent) !important;
  color: var(--bc-ui-heading) !important;
}

.workspace-trigger.active,
.workspace-link.active,
.nav-item.active,
.panel-btn.active {
  background: transparent !important;
  color: var(--bc-ui-heading) !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.sidebar .nav-item.panel-btn.active,
.workspace-menu > .panel-btn.workspace-trigger.active {
  background: transparent !important;
  color: var(--bc-ui-heading) !important;
  border: none !important;
  border-bottom: 2px solid var(--bc-ui-accent) !important;
  border-bottom-color: var(--bc-ui-accent) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.dashboard-action-btn.primary,
.content-wrapper .auction-subbtn.active,
.content-wrapper .billing-subbtn.active,
.content-wrapper .billing-module-btn.active,
.content-wrapper .options-nav .options-btn.active,
.auth-primary-btn,
.billing-page-toolbar button:not(.secondary),
.billing-composer-actions button:not(.secondary),
.billing-actions-row button:not(.secondary),
.billing-filter-actions button:not(.secondary),
.billing-list-toolbar-actions button:not(.secondary),
.checklist-action,
#btnBillingNewOrder,
#btnBillingOpenCustomerComposer,
#btnBillingSaveOrder,
#btnBillingSaveCustomer,
#btnLogin,
#btnRegister,
#btnForgotPassword,
#btnResetPassword,
#btnDashboardAuctionCta,
#btnGoAuction {
  background: linear-gradient(135deg, var(--bc-ui-accent), var(--bc-ui-accent-strong)) !important;
  color: #faf5ff !important;
  border-color: transparent !important;
  box-shadow: 0 18px 36px rgba(124, 58, 237, 0.22) !important;
}

.workspace-trigger:hover,
.workspace-link:hover,
.nav-item:hover,
.header-utility-btn:hover,
.user-menu:hover,
.user-dropdown-item:hover,
.user-plan-btn:hover,
.dashboard-action-btn.secondary:hover,
.dashboard-link-btn.secondary:hover,
.content-wrapper .secondary:hover,
.billing-icon-btn:hover {
  background: color-mix(in oklab, var(--bc-ui-panel) 72%, var(--bc-ui-accent-soft) 28%) !important;
  border-color: color-mix(in oklab, var(--bc-ui-border) 60%, var(--bc-ui-accent) 40%) !important;
}

.user-menu {
  min-width: 190px;
  gap: 12px;
}

.user-avatar,
.dashboard-avatar {
  background: color-mix(in oklab, var(--bc-ui-panel-strong) 92%, transparent) !important;
  color: var(--bc-ui-heading) !important;
  border: 1px solid color-mix(in oklab, var(--bc-ui-border) 64%, var(--bc-ui-accent) 36%) !important;
  box-shadow: none !important;
}

.avatar-logo-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  border-radius: 16px;
  background: #fff;
}

.user-avatar:not(.has-logo),
.dashboard-avatar:not(.has-logo) {
  text-indent: 0 !important;
  color: var(--bc-ui-heading) !important;
  background-image: none !important;
}

.user-dropdown {
  background: color-mix(in oklab, var(--bc-ui-panel-strong) 96%, transparent) !important;
  border-color: color-mix(in oklab, var(--bc-ui-border) 76%, var(--bc-ui-accent) 24%) !important;
  box-shadow: 0 28px 60px rgba(17, 10, 28, 0.32) !important;
}

.user-dropdown-header,
.user-dropdown-plan,
.user-dropdown-item,
.user-plan-btn {
  background: color-mix(in oklab, var(--bc-ui-panel) 94%, transparent) !important;
  color: var(--bc-ui-heading) !important;
}

.billing-table-head,
.billing-table.orders .billing-table-head,
.billing-table.customers .billing-table-head {
  background: linear-gradient(180deg, rgba(89, 54, 136, 0.94), rgba(60, 37, 96, 0.98)) !important;
  color: #f6efff !important;
}

.billing-table-row,
.billing-order-item-row,
.billing-proof-item,
.dashboard-empty,
.status-mini-card,
.metric-card,
.auction-metric,
.billing-keypoints li,
.billing-payment-request-proof-summary,
.billing-payment-request-proof,
.billing-order-list-card,
.billing-order-summary-card {
  background: color-mix(in oklab, var(--bc-ui-panel) 96%, transparent) !important;
  border-color: var(--bc-ui-border) !important;
}

.dashboard-summary-meta,
.dashboard-inline-metrics,
.dashboard-note-card,
.dashboard-pie-shell,
.dashboard-ranking-item,
.dashboard-commerce-kpi-card,
.dashboard-commerce-chart-card {
  background: color-mix(in oklab, var(--bc-ui-panel) 96%, transparent) !important;
  border-color: var(--bc-ui-border) !important;
}

.dashboard-shell-overview,
.dashboard-board-grid,
.dashboard-commerce-grid,
.dashboard-summary-grid {
  min-width: 0;
}

.dashboard-summary-grid {
  grid-template-columns: minmax(340px, 0.92fr) minmax(520px, 1.08fr);
  gap: 20px;
}

.dashboard-control-card {
  grid-column: 1 / -1;
}

.dashboard-identity-card,
.dashboard-state-card {
  align-content: start;
}

.dashboard-identity-card {
  grid-template-rows: auto auto 1fr;
}

.dashboard-control-card .checklist-compact {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.dashboard-board-grid {
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
  gap: 22px;
}

.dashboard-commerce-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.dashboard-commerce-grid {
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 18px;
}

.dashboard-commerce-chart-card-wide {
  grid-column: 1 / -1;
}

.dashboard-timeline-wrap {
  display: grid;
  gap: 16px;
}

.dashboard-timeline-legend {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  color: var(--bc-ui-copy);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.dashboard-timeline-legend i:first-child {
  color: var(--bc-ui-accent);
}

.dashboard-timeline-legend span:last-child i {
  color: #d8b4fe;
}

.dashboard-timeline-chart {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(82px, 1fr));
  gap: 14px;
  align-items: end;
  min-height: 236px;
}

.dashboard-timeline-group {
  display: grid;
  gap: 10px;
}

.dashboard-timeline-bars {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  align-items: end;
  gap: 8px;
  min-height: 170px;
  padding: 16px 12px 14px;
  border-radius: 20px;
  border: 1px solid var(--bc-ui-border);
  background: color-mix(in oklab, var(--bc-ui-panel-strong) 92%, transparent);
}

.dashboard-timeline-bar {
  display: block;
  width: 100%;
  min-height: 10px;
  border-radius: 999px 999px 10px 10px;
}

.dashboard-timeline-bar.orders {
  background: linear-gradient(180deg, var(--bc-ui-accent), color-mix(in oklab, var(--bc-ui-accent) 64%, #ffffff 36%));
}

.dashboard-timeline-bar.revenue {
  background: linear-gradient(180deg, #d8b4fe, #8b5cf6);
}

.dashboard-timeline-meta {
  display: grid;
  gap: 4px;
  text-align: center;
}

.dashboard-timeline-meta strong {
  color: var(--bc-ui-heading);
  font-size: 13px;
}

.dashboard-timeline-meta span {
  color: var(--bc-ui-copy);
  font-size: 12px;
}

.checklist-item {
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  background: color-mix(in oklab, var(--bc-ui-panel) 96%, transparent) !important;
  border: 1px solid var(--bc-ui-border) !important;
}

.checklist-copy {
  text-align: left;
}

.checklist-indicator {
  background: color-mix(in oklab, var(--bc-ui-panel-strong) 88%, var(--bc-ui-accent-soft) 12%) !important;
}

.checklist-action {
  min-width: 124px;
  justify-self: end;
}

.dashboard-control-card .checklist-item {
  min-height: 100%;
}

.dashboard-control-card .checklist-action {
  min-width: 112px;
}

#billing-pane-cadastros .billing-customer-shell,
#billing-pane-cadastros .billing-customer-mainlist,
#billing-pane-cadastros .billing-section-card,
#billing-pane-vendas .billing-customer-shell,
#billing-pane-vendas .billing-customer-mainlist,
#panel-billing .billing-pane-shell,
#panel-billing .billing-section-card,
#panel-billing .billing-page-section,
#panel-billing .billing-pane-grid,
#panel-billing .billing-finance-shell {
  width: 100%;
  max-width: none;
}

#billing-pane-cadastros .billing-customer-shell,
#billing-pane-vendas .billing-customer-shell {
  grid-template-columns: minmax(0, 1fr) !important;
}

#billing-pane-vendas .billing-customer-mainlist {
  min-width: 0;
}

.billing-finance-shell {
  display: grid;
  gap: 18px;
}

.billing-finance-subnav {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
}

.billing-finance-summary-grid {
  margin-top: 14px;
}

.billing-expense-list {
  display: grid;
  gap: 12px;
}

.billing-expense-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid var(--bc-ui-border);
  background: color-mix(in oklab, var(--bc-ui-panel) 96%, transparent);
}

.billing-expense-row-copy {
  display: grid;
  gap: 6px;
}

.billing-expense-row-copy strong {
  color: var(--bc-ui-heading);
  font-size: 15px;
}

.billing-expense-row-copy span,
.billing-expense-row-copy small {
  color: var(--bc-ui-copy);
}

.billing-expense-row-value {
  display: grid;
  gap: 4px;
  justify-items: end;
  min-width: 96px;
}

.billing-expense-row-value strong {
  color: var(--bc-ui-heading);
  font-size: 18px;
  line-height: 1;
}

.billing-expense-row-value span {
  color: var(--bc-ui-copy);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.billing-expense-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.billing-date-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.billing-date-field .filter-input[type="date"] {
  min-width: 0;
  padding-right: 14px;
}

.billing-payment-request-list-compact {
  display: grid;
  gap: 12px;
}

.billing-payment-request-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid var(--bc-ui-border);
  background: color-mix(in oklab, var(--bc-ui-panel) 96%, transparent);
  cursor: pointer;
}

.billing-payment-request-row-copy {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.billing-payment-request-row-head,
.billing-payment-request-row-meta {
  display: flex;
  align-items: center;
  gap: 10px 14px;
  flex-wrap: wrap;
  min-width: 0;
}

.billing-payment-request-row-head strong {
  color: var(--bc-ui-heading);
  font-size: 15px;
}

.billing-payment-request-row-meta span {
  color: var(--bc-ui-copy);
  font-size: 13px;
}

.billing-payment-request-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.billing-payment-request-row-value {
  display: grid;
  gap: 4px;
  justify-items: end;
  min-width: 92px;
}

.billing-payment-request-row-value strong {
  color: var(--bc-ui-heading);
  font-size: 18px;
  line-height: 1;
}

.billing-payment-request-row-value span {
  color: var(--bc-ui-copy);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.billing-finance-keypoints {
  margin-bottom: 8px;
}

#billing-pane-vendas .billing-list-toolbar-filters-orders {
  display: grid;
  grid-template-columns: auto minmax(280px, 1.45fr) 220px 164px 164px auto auto;
  gap: 12px;
  align-items: center;
}

#billing-pane-vendas .billing-table.orders .billing-table-head,
#billing-pane-vendas .billing-table.orders .billing-table-row {
  grid-template-columns: 140px minmax(240px, 1.45fr) 126px minmax(170px, 1fr) 108px 170px 110px;
}

.billing-customer-card-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 0 6px;
  margin-bottom: 14px;
  color: var(--bc-ui-copy);
  font-size: 13px;
}

.billing-customer-row-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 16px;
  padding: 18px 20px;
  border-radius: 22px;
  border: 1px solid var(--bc-ui-border);
  background: color-mix(in oklab, var(--bc-ui-panel) 96%, transparent);
  box-shadow: 0 14px 34px rgba(22, 12, 40, 0.12);
}

.billing-customer-card-select {
  display: flex;
  align-items: flex-start;
  padding-top: 8px;
}

.billing-customer-card-body {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.billing-customer-card-headline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.billing-customer-card-title {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.billing-customer-card-title strong {
  display: block;
  color: var(--bc-ui-heading);
  font-size: 17px;
  line-height: 1.2;
}

.billing-customer-card-title span,
.billing-customer-card-grid span,
.billing-customer-card-grid small {
  color: var(--bc-ui-copy);
}

.billing-customer-card-tags {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.billing-inline-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid var(--bc-ui-border);
  background: color-mix(in oklab, var(--bc-ui-panel-strong) 94%, transparent);
  color: var(--bc-ui-heading);
  font-size: 12px;
  font-weight: 700;
}

.billing-inline-chip.subtle {
  color: var(--bc-ui-copy);
}

.billing-inline-chip.success {
  background: color-mix(in oklab, var(--bc-ui-accent-soft) 74%, transparent);
  color: var(--bc-ui-accent-strong);
}

.billing-inline-chip.warn {
  background: rgba(251, 191, 36, 0.14);
  color: #d97706;
}

.billing-inline-chip.muted {
  background: color-mix(in oklab, var(--bc-ui-panel) 96%, transparent);
  color: var(--bc-ui-copy);
}

.team-user-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 12px;
  margin-top: 12px;
}

.team-user-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid var(--bc-ui-border);
  background: color-mix(in oklab, var(--bc-ui-panel-strong) 93%, transparent);
  box-shadow: 0 10px 24px rgba(10, 8, 20, 0.18);
}

.team-user-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.team-user-head h4 {
  margin: 0;
  color: var(--bc-ui-heading);
  font-size: 16px;
  line-height: 1.25;
}

.team-user-head p {
  margin: 4px 0 0;
  color: var(--bc-ui-copy);
  font-size: 13px;
  line-height: 1.35;
}

.team-user-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
  color: var(--bc-ui-copy);
  font-size: 12px;
}

.team-user-meta span {
  display: block;
  min-width: 0;
}

.team-user-meta code {
  color: var(--bc-ui-heading);
  font-size: 11px;
  word-break: break-all;
}

.team-user-permissions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.team-user-permission-editor {
  display: grid;
  gap: 8px;
}

.team-user-permission-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--bc-ui-copy);
}

.team-permissions-grid-inline {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
}

.team-permissions-grid-inline label {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.team-user-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

@media (max-width: 760px) {
  .team-user-meta {
    grid-template-columns: 1fr;
  }

  .team-permissions-grid-inline {
    grid-template-columns: 1fr;
  }
}

.team-user-actions button {
  min-height: 36px;
}

.billing-customer-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 16px;
}

.billing-customer-card-grid > div {
  display: grid;
  gap: 4px;
}

.billing-customer-card-actions {
  display: flex;
  align-items: flex-start;
}

.dashboard-home .dashboard-board-header {
  padding: 6px 6px 0;
}

.dashboard-home .dashboard-board-header .dashboard-section-kicker {
  color: var(--bc-ui-accent-strong) !important;
}

[data-theme="light"] .dashboard-home .dashboard-board-header h3,
[data-theme="light"] .dashboard-home .dashboard-board-header p,
[data-theme="light"] .dashboard-home .dashboard-surface h2,
[data-theme="light"] .dashboard-home .dashboard-surface h3,
[data-theme="light"] .dashboard-home .dashboard-summary-card h3,
[data-theme="light"] .dashboard-home .status-mini-value,
[data-theme="light"] .dashboard-home .metric-card strong,
[data-theme="light"] .dashboard-home .dashboard-inline-metric strong,
[data-theme="light"] .dashboard-home .dashboard-note-card strong,
[data-theme="light"] .dashboard-home .dashboard-empty strong,
[data-theme="light"] .dashboard-home .auction-metric strong {
  color: var(--bc-ui-heading) !important;
}

[data-theme="light"] .dashboard-home .dashboard-board-header p,
[data-theme="light"] .dashboard-home .dashboard-card-subtitle,
[data-theme="light"] .dashboard-home .dashboard-empty p,
[data-theme="light"] .dashboard-home .dashboard-note-card span,
[data-theme="light"] .dashboard-home .status-mini-meta,
[data-theme="light"] .dashboard-home .metric-card p,
[data-theme="light"] .dashboard-home .auction-metric small {
  color: var(--bc-ui-copy) !important;
}

body:not(.authenticated) .auth-shell {
  grid-template-columns: minmax(420px, 1.04fr) minmax(360px, 0.86fr);
  gap: 44px;
  align-items: center;
}

@media (max-width: 860px) {
  .team-user-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .team-user-meta {
    grid-template-columns: minmax(0, 1fr);
  }
}

body:not(.authenticated) .auth-showcase {
  color: var(--bc-ui-heading);
}

body:not(.authenticated) .auth-showcase h1,
body:not(.authenticated) .auth-benefit-copy strong,
body:not(.authenticated) .auth-card h2 {
  color: #faf5ff !important;
}

body:not(.authenticated) .auth-brand-subtitle,
body:not(.authenticated) .auth-showcase p,
body:not(.authenticated) .auth-benefit-copy span,
body:not(.authenticated) .auth-showcase-footer {
  color: #cbbce3 !important;
}

body:not(.authenticated) .auth-benefits li {
  background: rgba(30, 22, 40, 0.76) !important;
  border: 1px solid rgba(216, 180, 254, 0.1) !important;
  box-shadow: 0 18px 34px rgba(12, 9, 18, 0.22) !important;
}

body:not(.authenticated) .auth-benefit-icon,
body:not(.authenticated) .auth-showcase-kicker,
body:not(.authenticated) .auth-portal-kicker {
  background: rgba(168, 85, 247, 0.16) !important;
  border-color: rgba(216, 180, 254, 0.18) !important;
  color: #d8b4fe !important;
}

body:not(.authenticated) .auth-card {
  background: rgba(18, 14, 26, 0.94) !important;
  border: 1px solid rgba(216, 180, 254, 0.12) !important;
  border-radius: 32px !important;
  padding: 40px 40px 28px !important;
}

body:not(.authenticated) .auth-card label,
body:not(.authenticated) .auth-card .subhead,
body:not(.authenticated) .auth-social-note {
  color: #bcaed2 !important;
}

body:not(.authenticated) .auth-card input,
body:not(.authenticated) .auth-card select,
body:not(.authenticated) .auth-card textarea {
  width: 100%;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(216, 180, 254, 0.12) !important;
  color: #faf5ff !important;
  min-height: 54px;
}

body:not(.authenticated) .auth-card input::placeholder,
body:not(.authenticated) .auth-card textarea::placeholder {
  color: rgba(240, 230, 255, 0.38) !important;
}

body:not(.authenticated) .auth-card input:focus,
body:not(.authenticated) .auth-card select:focus,
body:not(.authenticated) .auth-card textarea:focus {
  border-color: rgba(192, 132, 252, 0.34) !important;
  box-shadow: 0 0 0 4px rgba(168, 85, 247, 0.12) !important;
}

body:not(.authenticated) .auth-primary-btn {
  width: 100%;
  min-height: 54px;
}

body:not(.authenticated) .auth-link-btn,
body:not(.authenticated) .auth-footer-links button,
body:not(.authenticated) .auth-footer-links a {
  width: auto !important;
  min-height: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #d8b4fe !important;
}

body:not(.authenticated) .auth-link-btn:hover,
body:not(.authenticated) .auth-footer-links button:hover,
body:not(.authenticated) .auth-footer-links a:hover {
  color: #f5d0fe !important;
  text-decoration: underline;
}

body:not(.authenticated) .auth-secondary-btn {
  background: color-mix(in oklab, var(--bc-ui-panel) 90%, rgba(168, 85, 247, 0.12) 10%) !important;
  color: #f6efff !important;
  border-color: rgba(216, 180, 254, 0.12) !important;
}

body:not(.authenticated) .auth-divider {
  color: #a696c0 !important;
}

body:not(.authenticated) .auth-status-wrap .status {
  background: rgba(255, 255, 255, 0.03) !important;
  border-color: rgba(216, 180, 254, 0.1) !important;
  color: #d2c6e6 !important;
}

body:not(.authenticated) .auth-password-hint {
  margin-top: 8px;
  color: #b8aacd;
  font-size: 12px;
  line-height: 1.5;
}

@media (max-width: 1580px) {
  .dashboard-summary-grid {
    grid-template-columns: minmax(320px, 0.94fr) minmax(420px, 1.06fr);
  }

  #billing-pane-vendas .billing-list-toolbar-filters-orders {
    grid-template-columns: auto minmax(220px, 1fr) 200px 1fr 1fr auto auto;
  }
}

@media (max-width: 1360px) {
  .dashboard-summary-grid,
  .dashboard-board-grid,
  .dashboard-commerce-kpi-grid,
  .dashboard-commerce-grid,
  .billing-customer-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-control-card {
    grid-column: 1 / -1;
  }

  .dashboard-control-card .checklist-compact {
    grid-template-columns: minmax(0, 1fr);
  }

  .dashboard-commerce-chart-card-wide {
    grid-column: auto;
  }

  body:not(.authenticated) .auth-shell {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1180px) {
  .dashboard-summary-grid,
  .dashboard-board-grid,
  .dashboard-commerce-kpi-grid,
  .dashboard-commerce-grid,
  .billing-customer-card-grid {
    grid-template-columns: 1fr;
  }

  #billing-pane-vendas .billing-list-toolbar-filters-orders {
    grid-template-columns: 1fr !important;
  }

  .checklist-item {
    grid-template-columns: 46px minmax(0, 1fr) !important;
  }

  .checklist-action {
    grid-column: 2;
    justify-self: start;
  }
}

@media (max-width: 860px) {
  .content-wrapper,
  .content-wrapper.bidcenter-content {
    width: min(var(--bc-page-max), calc(100% - 18px));
  }

  .billing-customer-row-card {
    grid-template-columns: 1fr;
  }

  .billing-customer-card-actions,
  .billing-customer-card-select {
    justify-content: flex-start;
    padding-top: 0;
  }

  #billing-pane-vendas .billing-sales-rail {
    top: 86px;
    right: 12px;
    width: calc(100vw - 24px);
    max-height: calc(100vh - 100px);
  }
}

@media (max-width: 640px) {
  .header {
    width: calc(100% - 16px) !important;
  }

  .content-wrapper,
  .content-wrapper.bidcenter-content {
    width: calc(100% - 16px);
    max-width: none;
  }

  body:not(.authenticated) .main-content {
    padding: 16px 10px;
  }

  body:not(.authenticated) .content-wrapper {
    width: 100%;
    max-width: none;
  }

  body:not(.authenticated) .auth-shell {
    gap: 14px;
    min-height: auto;
    align-items: stretch;
  }

  body:not(.authenticated) .auth-showcase {
    padding: 0;
    gap: 16px;
  }

  body:not(.authenticated) .auth-showcase h1 {
    font-size: clamp(30px, 11vw, 42px);
    line-height: 1.04;
    max-width: none;
  }

  body:not(.authenticated) .auth-showcase p,
  body:not(.authenticated) .auth-brand-subtitle,
  body:not(.authenticated) .auth-benefit-copy span,
  body:not(.authenticated) .auth-showcase-footer {
    font-size: 14px;
    line-height: 1.55;
    max-width: none;
  }

  body:not(.authenticated) .auth-card {
    padding: 22px 16px 18px !important;
    border-radius: 24px !important;
  }

  .onboarding-modal {
    padding: 8px !important;
    align-items: flex-start !important;
  }

  .onboarding-card,
  .auth-faq-card,
  .billing-delete-card,
  .billing-payment-request-detail-card {
    width: 100% !important;
    max-width: none !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 18px !important;
    padding: 16px !important;
    overflow: auto !important;
  }

  .onboarding-grid,
  .onboarding-action-buttons,
  .auth-inline-grid,
  .auth-form-grid {
    grid-template-columns: 1fr !important;
  }

  .onboarding-head {
    grid-template-columns: 1fr !important;
    align-items: flex-start !important;
  }

  .onboarding-head h2 {
    font-size: clamp(22px, 7vw, 28px) !important;
    line-height: 1.08 !important;
  }

  .onboarding-head p,
  .onboarding-note,
  .faq-stack details p {
    font-size: 14px !important;
    line-height: 1.55 !important;
  }

  body:not(.authenticated) .auth-benefits li {
    padding: 14px;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 12px;
  }

  body:not(.authenticated) .auth-benefit-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
  }

  body:not(.authenticated) .auth-brand-logo,
  body:not(.authenticated) .auth-portal-logo {
    width: min(260px, 72vw);
  }

  body:not(.authenticated) .auth-inline-grid,
  body:not(.authenticated) .auth-form-grid {
    grid-template-columns: 1fr !important;
  }
}

/* 2026-03-23: FAQ panel + vendas bulk selection + mobile polish */

#panel-faq .card {
  width: 100%;
}

#panel-faq .row {
  flex-wrap: wrap;
}

#panel-faq .faq-stack {
  display: grid;
  gap: 12px;
}

.billing-select-cell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
}

.billing-select-cell-head {
  justify-content: flex-start;
}

#billing-pane-vendas .billing-table.orders .billing-table-head,
#billing-pane-vendas .billing-table.orders .billing-table-row {
  grid-template-columns: 42px 140px minmax(220px, 1.35fr) 120px minmax(150px, 1fr) 110px 164px 118px !important;
}

#billing-pane-vendas .billing-table.orders .billing-table-head > div,
#billing-pane-vendas .billing-table.orders .billing-table-row > div {
  min-width: 0;
}

#billing-pane-vendas .billing-table.orders {
  overflow: auto;
}

@media (max-width: 1180px) {
  .header {
    width: calc(100% - 16px) !important;
  }

  .header-subtitle {
    display: none;
  }

  .workspace-nav {
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
  }

  .workspace-menu {
    flex: 0 0 auto;
  }

  .workspace-menu > .panel-btn.workspace-trigger {
    white-space: nowrap;
  }

  #billing-pane-vendas .billing-list-toolbar-head {
    flex-direction: column;
    align-items: stretch;
  }

  #billing-pane-vendas .billing-list-toolbar-actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  #billing-pane-vendas .billing-list-head-actions {
    width: 100%;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: wrap;
  }

  #billing-pane-vendas .billing-order-info-panel {
    width: 100%;
    max-width: none;
  }
}

@media (max-width: 980px) {
  #billing-pane-vendas .billing-list-toolbar-filters-orders {
    grid-template-columns: 1fr !important;
  }

  #billing-pane-vendas .billing-date-field {
    width: 100%;
  }

  #billing-pane-vendas .billing-table.orders .billing-table-head,
  #billing-pane-vendas .billing-table.orders .billing-table-row {
    min-width: 1010px;
  }

  #panel-faq .card {
    padding: 16px;
  }

  .billing-layout,
  .billing-customer-layout,
  .billing-recent-grid,
  .billing-stats-row,
  .billing-stats-row.premium,
  .billing-field-grid,
  .billing-payment-request-meta {
    grid-template-columns: 1fr;
  }

  .billing-field-grid .span-2,
  .billing-field-grid .span-3 {
    grid-column: auto;
  }

  .billing-table,
  .billing-table.orders,
  .billing-table.finance,
  .billing-page-section:has(.billing-table.orders),
  .billing-page-section:has(.billing-table.finance) {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 760px) {
  .main-content {
    padding: 16px 8px 20px;
    overflow-x: hidden;
  }

  .header {
    padding: 12px;
    border-radius: 16px;
  }

  .header-right {
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .header-search {
    width: 100%;
    min-width: 0;
    order: 1;
  }

  .header-utility-row {
    order: 2;
  }

  .user-menu {
    order: 3;
    width: 100%;
  }

  #billing-pane-vendas .billing-list-toolbar-actions {
    grid-template-columns: 1fr;
  }

  #billing-pane-vendas .billing-table.orders .billing-table-head,
  #billing-pane-vendas .billing-table.orders .billing-table-row {
    min-width: 0;
  }

  .billing-table.orders .billing-table-head,
  .billing-table.finance .billing-table-head,
  .billing-table.items .billing-table-head {
    display: none;
  }

  .billing-table.orders .billing-table-row,
  .billing-table.finance .billing-table-row,
  .billing-table.items .billing-table-row {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 12px;
    min-height: auto;
  }

  .billing-table.orders .billing-table-row > div,
  .billing-table.finance .billing-table-row > div,
  .billing-table.items .billing-table-row > div {
    display: grid;
    grid-template-columns: minmax(110px, 0.38fr) minmax(0, 1fr);
    align-items: center;
    gap: 10px;
  }

  .billing-table.orders .billing-table-row > div::before,
  .billing-table.finance .billing-table-row > div::before,
  .billing-table.items .billing-table-row > div::before {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
    color: var(--bc-ui-soft);
  }

  .billing-table.orders .billing-table-row > .billing-cell-title,
  .billing-table.finance .billing-table-row > .billing-cell-title,
  .billing-table.items .billing-table-row > .billing-cell-title {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .billing-table.orders .billing-table-row > .billing-cell-title::before,
  .billing-table.finance .billing-table-row > .billing-cell-title::before,
  .billing-table.items .billing-table-row > .billing-cell-title::before {
    margin-bottom: 2px;
  }

  .billing-table.orders .billing-table-row > .billing-cell-actions,
  .billing-table.finance .billing-table-row > .billing-cell-actions,
  .billing-table.items .billing-table-row > .billing-cell-actions {
    justify-items: end;
  }

  .billing-table.orders .billing-table-row > .billing-cell-money,
  .billing-table.finance .billing-table-row > .billing-cell-money,
  .billing-table.items .billing-table-row > .billing-cell-money {
    justify-items: end;
    text-align: right;
  }

  .billing-table.orders .billing-table-row > div:nth-child(1)::before { content: "Selecionar"; }
  .billing-table.orders .billing-table-row > div:nth-child(2)::before { content: "Pedido"; }
  .billing-table.orders .billing-table-row > div:nth-child(3)::before { content: "Cliente"; }
  .billing-table.orders .billing-table-row > div:nth-child(4)::before { content: "Data"; }
  .billing-table.orders .billing-table-row > div:nth-child(5)::before { content: "Categoria"; }
  .billing-table.orders .billing-table-row > div:nth-child(6)::before { content: "Total"; }
  .billing-table.orders .billing-table-row > div:nth-child(7)::before { content: "Situação"; }
  .billing-table.orders .billing-table-row > div:nth-child(8)::before { content: "Ações"; }

  .billing-table.finance .billing-table-row > div:nth-child(1)::before { content: "Pedido"; }
  .billing-table.finance .billing-table-row > div:nth-child(2)::before { content: "Cliente"; }
  .billing-table.finance .billing-table-row > div:nth-child(3)::before { content: "Emissão"; }
  .billing-table.finance .billing-table-row > div:nth-child(4)::before { content: "Vencimento"; }
  .billing-table.finance .billing-table-row > div:nth-child(5)::before { content: "Valor"; }
  .billing-table.finance .billing-table-row > div:nth-child(6)::before { content: "Situação"; }
  .billing-table.finance .billing-table-row > div:nth-child(7)::before { content: "Ações"; }

  .billing-table.items .billing-table-row > div:nth-child(1)::before { content: "Item"; }
  .billing-table.items .billing-table-row > div:nth-child(2)::before { content: "Código"; }
  .billing-table.items .billing-table-row > div:nth-child(3)::before { content: "Un."; }
  .billing-table.items .billing-table-row > div:nth-child(4)::before { content: "Qtd"; }
  .billing-table.items .billing-table-row > div:nth-child(5)::before { content: "Preço lista"; }
  .billing-table.items .billing-table-row > div:nth-child(6)::before { content: "Desc %"; }
  .billing-table.items .billing-table-row > div:nth-child(7)::before { content: "Preço un."; }
  .billing-table.items .billing-table-row > div:nth-child(8)::before { content: "Ações"; }
}

@media (max-width: 520px) {
  .main-content {
    padding: 14px 6px 18px;
  }

  .billing-table.orders .billing-table-row,
  .billing-table.finance .billing-table-row,
  .billing-table.items .billing-table-row {
    padding: 10px;
  }

  .billing-table.orders .billing-table-row > div,
  .billing-table.finance .billing-table-row > div,
  .billing-table.items .billing-table-row > div {
    grid-template-columns: minmax(92px, 0.4fr) minmax(0, 1fr);
  }
}

/* Responsive viewport guardrails */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

img,
svg,
video,
canvas {
  max-width: 100%;
  height: auto;
}

@media (max-width: 760px) {
  .workspace-menu-panel {
    width: min(520px, 92vw);
    min-width: 0;
  }
}

/* Auction sheet column mapping: compact grid on wide screens */
#auctionSheetColumnPickerModal .auction-sheet-picker-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

#auctionSheetColumnPickerModal .auction-sheet-picker-option {
  height: 100%;
}

#auctionSheetColumnPickerModal .auction-sheet-picker-option-mapping {
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.9fr);
  align-items: start;
}

#auctionSheetColumnPickerModal .auction-sheet-picker-controls {
  align-content: start;
}

@media (max-width: 1200px) {
  #auctionSheetColumnPickerModal .auction-sheet-picker-list {
    grid-template-columns: 1fr;
  }

  #auctionSheetColumnPickerModal .auction-sheet-picker-option-mapping {
    grid-template-columns: 1fr;
  }
}

/* ===== Source: bidcenter-dashboard-pro.css ===== */
/* BidCenter UI Pro Layer (2026-03-23)
   Final visual layer to normalize design tokens, components and page rhythm. */

:root,
html[data-theme="light"] {
  --bc-ui-bg: #f6f1ff;
  --bc-ui-surface: #ffffff;
  --bc-ui-surface-soft: #f3e9ff;
  --bc-ui-surface-muted: #eee4fa;
  --bc-ui-line: rgba(74, 32, 132, 0.14);
  --bc-ui-line-strong: rgba(74, 32, 132, 0.24);
  --bc-ui-text: #221631;
  --bc-ui-text-soft: #6a597d;
  --bc-ui-text-muted: #8b7aa0;
  --bc-ui-primary: #8b5cf6;
  --bc-ui-primary-strong: #7c3aed;
  --bc-ui-success: #10b981;
  --bc-ui-danger: #ef4444;
  --bc-ui-shadow: 0 14px 34px rgba(33, 22, 49, 0.1);
  --bc-ui-shadow-soft: 0 8px 20px rgba(33, 22, 49, 0.08);
  --bc-ui-radius: 18px;
  --bc-ui-radius-sm: 12px;
  --bc-layout-max: 1520px;
}

html[data-theme="dark"] {
  --bc-ui-bg: #0f0a1a;
  --bc-ui-surface: #181126;
  --bc-ui-surface-soft: #211634;
  --bc-ui-surface-muted: #281d3f;
  --bc-ui-line: rgba(236, 223, 255, 0.1);
  --bc-ui-line-strong: rgba(236, 223, 255, 0.22);
  --bc-ui-text: #f3ebff;
  --bc-ui-text-soft: #c1aed9;
  --bc-ui-text-muted: #9b87b5;
  --bc-ui-primary: #a855f7;
  --bc-ui-primary-strong: #8b5cf6;
  --bc-ui-success: #34d399;
  --bc-ui-danger: #f87171;
  --bc-ui-shadow: 0 22px 54px rgba(2, 1, 7, 0.42);
  --bc-ui-shadow-soft: 0 14px 30px rgba(2, 1, 7, 0.3);
}

html {
  background: var(--bc-ui-bg);
}

body {
  color: var(--bc-ui-text) !important;
  background:
    radial-gradient(1200px 460px at -8% -8%, color-mix(in oklab, var(--bc-ui-primary) 22%, transparent), transparent 58%),
    radial-gradient(1040px 420px at 108% -10%, color-mix(in oklab, var(--bc-ui-primary) 18%, transparent), transparent 56%),
    var(--bc-ui-bg) !important;
}

/* Layout shell */
.main-content {
  padding: 16px clamp(14px, 2vw, 30px) 30px !important;
}

.main-content > .header,
.main-content > .content-wrapper.bidcenter-content,
.main-content > .content-wrapper {
  width: min(var(--bc-layout-max), 100%) !important;
  margin-inline: auto !important;
}

.header {
  border-radius: 20px !important;
  border: 1px solid var(--bc-ui-line) !important;
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--bc-ui-surface) 95%, transparent), color-mix(in oklab, var(--bc-ui-surface-soft) 78%, transparent)) !important;
  box-shadow: var(--bc-ui-shadow-soft) !important;
  padding: 14px clamp(14px, 2.2vw, 22px) !important;
  margin-bottom: 16px !important;
  display: grid !important;
  grid-template-columns: minmax(240px, auto) minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
}

.header-left {
  min-width: 0;
}

.header-brand {
  width: clamp(148px, 16vw, 198px) !important;
  min-height: 44px !important;
  border-radius: 12px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  padding: 4px 0 !important;
}

.header-brand-logo {
  display: block;
  width: 100%;
  max-height: 40px;
  object-fit: contain;
}

.header-business {
  margin-top: 8px !important;
  min-height: 36px !important;
  border: 1px solid var(--bc-ui-line) !important;
  background: color-mix(in oklab, var(--bc-ui-surface-soft) 82%, transparent) !important;
  color: var(--bc-ui-text-soft) !important;
  border-radius: 12px !important;
}

.header-subtitle {
  margin: 8px 0 0 !important;
  color: var(--bc-ui-text-muted) !important;
}

.header-center {
  min-width: 0;
}

.workspace-nav {
  display: flex !important;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex-wrap: nowrap;
}

.workspace-menu {
  position: relative;
}

.panel-btn.workspace-trigger {
  min-height: 38px !important;
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--bc-ui-text-soft) !important;
  padding: 0 12px !important;
  font-weight: 700 !important;
}

.panel-btn.workspace-trigger:hover,
.workspace-menu > .panel-btn.workspace-trigger.active {
  border-color: color-mix(in oklab, var(--bc-ui-primary) 36%, transparent) !important;
  background: color-mix(in oklab, var(--bc-ui-primary) 16%, transparent) !important;
  color: var(--bc-ui-text) !important;
}

.workspace-menu-panel {
  min-width: 320px !important;
  max-width: min(420px, calc(100vw - 40px)) !important;
  border-radius: 16px !important;
  border: 1px solid var(--bc-ui-line-strong) !important;
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--bc-ui-surface) 97%, transparent), color-mix(in oklab, var(--bc-ui-surface-soft) 86%, transparent)) !important;
  box-shadow: var(--bc-ui-shadow) !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

.workspace-title {
  color: var(--bc-ui-text-muted) !important;
}

.workspace-link {
  color: var(--bc-ui-text-soft) !important;
}

.workspace-menu-panel .workspace-link {
  display: flex;
  align-items: center;
  width: 100% !important;
  min-height: 36px !important;
  padding: 8px 10px !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--bc-ui-copy) !important;
}

.workspace-link:hover,
.workspace-link.active {
  color: var(--bc-ui-text) !important;
}

.workspace-menu-panel .workspace-link:hover,
.workspace-menu-panel .workspace-link.active {
  color: var(--bc-ui-heading) !important;
  background: color-mix(in oklab, var(--bc-ui-panel) 72%, var(--bc-ui-accent-soft) 28%) !important;
  border-color: color-mix(in oklab, var(--bc-ui-border) 60%, var(--bc-ui-accent) 40%) !important;
}

.header-right {
  gap: 8px !important;
}

.header-search {
  min-height: 40px !important;
  border-radius: 12px !important;
  border: 1px solid var(--bc-ui-line) !important;
  background: color-mix(in oklab, var(--bc-ui-surface-soft) 84%, transparent) !important;
  color: var(--bc-ui-text) !important;
}

.header-search::placeholder {
  color: var(--bc-ui-text-muted) !important;
}

.header-utility-btn {
  min-height: 40px !important;
  min-width: 40px !important;
  border-radius: 12px !important;
  border: 1px solid var(--bc-ui-line) !important;
  background: color-mix(in oklab, var(--bc-ui-surface-soft) 78%, transparent) !important;
  color: var(--bc-ui-text-soft) !important;
}

.header-utility-btn:hover {
  border-color: var(--bc-ui-line-strong) !important;
  background: color-mix(in oklab, var(--bc-ui-primary) 20%, transparent) !important;
  color: var(--bc-ui-text) !important;
}

/* Core components */
.content-wrapper .card,
.onboarding-card {
  border-radius: var(--bc-ui-radius) !important;
  border: 1px solid var(--bc-ui-line) !important;
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--bc-ui-surface) 96%, transparent), color-mix(in oklab, var(--bc-ui-surface-soft) 84%, transparent)) !important;
  box-shadow: var(--bc-ui-shadow-soft) !important;
}

.content-wrapper .card {
  padding: clamp(14px, 1.8vw, 22px) !important;
}

.content-wrapper .card::before {
  display: none !important;
}

.content-wrapper h2,
.content-wrapper h3,
.content-wrapper .section-title,
.content-wrapper .company-section-title {
  color: var(--bc-ui-text) !important;
  letter-spacing: -0.01em !important;
}

.content-wrapper .subhead,
.content-wrapper .muted,
.content-wrapper .quick-caption,
.content-wrapper label {
  color: var(--bc-ui-text-soft) !important;
}

.content-wrapper input,
.content-wrapper select,
.content-wrapper textarea,
.content-wrapper .filter-input,
body:not(.authenticated) .auth-card input,
body:not(.authenticated) .auth-card select,
body:not(.authenticated) .auth-card textarea {
  min-height: 46px !important;
  border-radius: 12px !important;
  border: 1px solid var(--bc-ui-line) !important;
  background: color-mix(in oklab, var(--bc-ui-surface-soft) 78%, transparent) !important;
  color: var(--bc-ui-text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.content-wrapper textarea,
body:not(.authenticated) .auth-card textarea {
  min-height: 110px !important;
}

.content-wrapper input::placeholder,
.content-wrapper textarea::placeholder,
.content-wrapper .filter-input::placeholder,
body:not(.authenticated) .auth-card input::placeholder,
body:not(.authenticated) .auth-card textarea::placeholder {
  color: var(--bc-ui-text-muted) !important;
}

.content-wrapper input:focus,
.content-wrapper select:focus,
.content-wrapper textarea:focus,
.content-wrapper .filter-input:focus,
body:not(.authenticated) .auth-card input:focus,
body:not(.authenticated) .auth-card select:focus,
body:not(.authenticated) .auth-card textarea:focus {
  outline: none !important;
  border-color: color-mix(in oklab, var(--bc-ui-primary) 70%, transparent) !important;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--bc-ui-primary) 24%, transparent) !important;
}

.content-wrapper button,
.content-wrapper .panel-btn,
.content-wrapper .auction-subbtn,
.content-wrapper .billing-subbtn,
.content-wrapper .billing-module-btn,
.content-wrapper .options-nav .options-btn,
.auth-primary-btn,
.auth-secondary-btn,
.user-dropdown-item,
.user-plan-btn {
  min-height: 44px !important;
  border-radius: 12px !important;
  border: 1px solid color-mix(in oklab, var(--bc-ui-primary) 26%, var(--bc-ui-line)) !important;
  background: color-mix(in oklab, var(--bc-ui-primary) 20%, transparent) !important;
  color: var(--bc-ui-text) !important;
  font-weight: 700 !important;
  transition: transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease, background 120ms ease !important;
}

.content-wrapper button:hover,
.content-wrapper .panel-btn:hover,
.content-wrapper .auction-subbtn:hover,
.content-wrapper .billing-subbtn:hover,
.content-wrapper .billing-module-btn:hover,
.content-wrapper .options-nav .options-btn:hover,
.auth-primary-btn:hover,
.auth-secondary-btn:hover,
.user-dropdown-item:hover,
.user-plan-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px color-mix(in oklab, var(--bc-ui-primary) 26%, transparent) !important;
}

.content-wrapper button.secondary,
.content-wrapper button.ghost,
.content-wrapper button.danger,
.content-wrapper .auction-subbtn,
.content-wrapper .billing-subbtn,
.content-wrapper .billing-module-btn,
.content-wrapper .options-nav .options-btn,
.auth-secondary-btn {
  background: color-mix(in oklab, var(--bc-ui-surface-soft) 84%, transparent) !important;
  border-color: var(--bc-ui-line) !important;
  color: var(--bc-ui-text-soft) !important;
  box-shadow: none !important;
}

.content-wrapper .auction-subbtn.active,
.content-wrapper .billing-subbtn.active,
.content-wrapper .billing-module-btn.active,
.content-wrapper .options-nav .options-btn.active,
.content-wrapper button:not(.secondary):not(.ghost):not(.danger):not(.billing-module-btn):not(.billing-subbtn):not(.auction-subbtn):not(.options-btn).active,
.auth-primary-btn {
  background: linear-gradient(135deg, var(--bc-ui-primary), var(--bc-ui-primary-strong)) !important;
  border-color: color-mix(in oklab, var(--bc-ui-primary) 72%, transparent) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px color-mix(in oklab, var(--bc-ui-primary) 28%, transparent) !important;
}

.content-wrapper .danger,
.content-wrapper .billing-bulk-delete-btn {
  border-color: color-mix(in oklab, var(--bc-ui-danger) 50%, transparent) !important;
}

.content-wrapper .danger:hover,
.content-wrapper .billing-bulk-delete-btn:hover {
  background: color-mix(in oklab, var(--bc-ui-danger) 18%, transparent) !important;
}

.team-search-block {
  grid-template-columns: minmax(260px, 1fr) auto !important;
  align-items: end;
}

.team-search-block .inline-actions {
  margin-top: 0 !important;
}

.manual-command-banner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  margin-top: 8px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid color-mix(in oklab, var(--bc-ui-primary) 46%, var(--bc-ui-line));
  background: color-mix(in oklab, var(--bc-ui-primary) 12%, var(--bc-ui-surface-soft));
}

.manual-command-copy {
  display: grid;
  gap: 2px;
}

.manual-command-copy strong {
  color: var(--bc-ui-text);
  font-weight: 800;
  font-size: 0.95rem;
}

.manual-command-copy span {
  color: var(--bc-ui-text-soft);
  font-size: 0.84rem;
}

.manual-command-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.manual-command-inline code {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px dashed color-mix(in oklab, var(--bc-ui-primary) 60%, transparent);
  background: color-mix(in oklab, var(--bc-ui-surface) 84%, transparent);
  color: var(--bc-ui-primary);
  font-size: 0.96rem;
  font-weight: 800;
}

/* Data blocks */
.group-panel,
.dashboard-summary-card,
.status-mini-card,
.billing-kpi-card,
.dashboard-commerce-kpi-card,
.billing-payment-request-card,
.billing-expense-item {
  border-radius: 14px !important;
  border: 1px solid var(--bc-ui-line) !important;
  background: color-mix(in oklab, var(--bc-ui-surface-soft) 80%, transparent) !important;
}

.status {
  border-radius: 999px !important;
  border: 1px solid var(--bc-ui-line-strong) !important;
  background: color-mix(in oklab, var(--bc-ui-surface-soft) 82%, transparent) !important;
  color: var(--bc-ui-text-soft) !important;
}

/* Tables + pagination */
.billing-table {
  border-radius: 14px !important;
  border: 1px solid var(--bc-ui-line) !important;
  overflow: hidden;
  background: color-mix(in oklab, var(--bc-ui-surface) 95%, transparent) !important;
}

.billing-table-head {
  background: linear-gradient(135deg, color-mix(in oklab, var(--bc-ui-primary) 44%, transparent), color-mix(in oklab, var(--bc-ui-primary-strong) 48%, transparent)) !important;
  color: #f9f4ff !important;
  border-bottom: 1px solid color-mix(in oklab, var(--bc-ui-primary) 50%, transparent) !important;
}

.billing-table-row {
  border-bottom: 1px solid var(--bc-ui-line) !important;
  background: color-mix(in oklab, var(--bc-ui-surface-soft) 56%, transparent) !important;
}

.billing-table-row:hover {
  background: color-mix(in oklab, var(--bc-ui-primary) 12%, transparent) !important;
}

.billing-pagination {
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.billing-pagination button {
  min-height: 38px !important;
  min-width: 38px;
  padding: 0 12px !important;
  border-radius: 10px !important;
}

/* Dashboard composition */
.dashboard-shell.dashboard-shell-overview {
  display: block !important;
}

.dashboard-home-grid,
.dashboard-focus-grid,
.dashboard-quick-grid,
.dashboard-actions {
  gap: 14px !important;
}

.dashboard-avatar,
.user-avatar {
  border-radius: 16px !important;
  border: 1px solid var(--bc-ui-line-strong) !important;
  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

/* Login page */
body:not(.authenticated) .main-content > .header {
  display: none !important;
}

body:not(.authenticated) .main-content {
  padding-top: 20px !important;
}

body:not(.authenticated) .content-wrapper.bidcenter-content {
  width: min(1240px, 100%) !important;
}

body:not(.authenticated) .auth-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 470px) !important;
  gap: clamp(20px, 3vw, 40px) !important;
  align-items: stretch !important;
}

body:not(.authenticated) .auth-showcase,
body:not(.authenticated) .auth-card {
  min-height: 100%;
}

body:not(.authenticated) .auth-showcase {
  padding: 4px 2px !important;
}

body:not(.authenticated) .auth-showcase h1,
body:not(.authenticated) .auth-card h2 {
  color: var(--bc-ui-text) !important;
  letter-spacing: -0.02em !important;
}

body:not(.authenticated) .auth-showcase p,
body:not(.authenticated) .auth-showcase-footer,
body:not(.authenticated) .auth-card .subhead,
body:not(.authenticated) .auth-card label {
  color: var(--bc-ui-text-soft) !important;
}

body:not(.authenticated) .auth-card {
  padding: clamp(16px, 2vw, 24px) !important;
}

/* Options + FAQ */
#panel-options > .card:first-child,
#panel-faq > .stack > .card:first-child {
  position: sticky;
  top: 12px;
  z-index: 7;
  backdrop-filter: blur(10px);
}

.options-nav {
  gap: 8px !important;
  flex-wrap: wrap !important;
}

#panel-faq .faq-stack details {
  border-radius: 14px !important;
  border: 1px solid var(--bc-ui-line) !important;
  background: color-mix(in oklab, var(--bc-ui-surface-soft) 78%, transparent) !important;
}

/* Mobile / tablet */
@media (max-width: 1360px) {
  :root,
  html[data-theme="light"],
  html[data-theme="dark"] {
    --bc-layout-max: 1320px;
  }

  .header {
    grid-template-columns: minmax(220px, auto) minmax(0, 1fr) auto !important;
  }

  .dashboard-shell.dashboard-shell-overview {
    display: block !important;
  }
}

@media (max-width: 1080px) {
  .header {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .header-center,
  .header-right {
    width: 100%;
  }

  .workspace-nav {
    overflow-x: auto;
    padding-bottom: 2px;
  }

  .workspace-nav::-webkit-scrollbar {
    height: 6px;
  }

  .workspace-nav::-webkit-scrollbar-thumb {
    background: var(--bc-ui-line-strong);
    border-radius: 99px;
  }

  .header-subtitle {
    display: none !important;
  }

  .dashboard-shell.dashboard-shell-overview {
    display: block !important;
  }
}

@media (max-width: 860px) {
  .main-content {
    padding: 12px 10px 20px !important;
  }

  .main-content > .header,
  .main-content > .content-wrapper.bidcenter-content,
  .main-content > .content-wrapper {
    width: 100% !important;
  }

  body:not(.authenticated) .auth-shell {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  body:not(.authenticated) .auth-showcase {
    order: 2;
  }

  body:not(.authenticated) .auth-card {
    order: 1;
  }

  .workspace-menu-panel {
    left: 0 !important;
    right: auto !important;
    min-width: min(94vw, 520px) !important;
    padding: 16px !important;
    gap: 14px !important;
  }

  .team-search-block {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 640px) {
  .header {
    padding: 12px !important;
    border-radius: 16px !important;
  }

  .header-brand {
    width: 156px !important;
  }

  .header-right {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px !important;
  }

  .header-utility-row {
    justify-content: flex-end;
  }

  .content-wrapper .card,
  .onboarding-card {
    border-radius: 14px !important;
    padding: 12px !important;
  }

  .content-wrapper input,
  .content-wrapper select,
  .content-wrapper textarea,
  .content-wrapper .filter-input,
  body:not(.authenticated) .auth-card input,
  body:not(.authenticated) .auth-card select,
  body:not(.authenticated) .auth-card textarea {
    min-height: 42px !important;
  }

  .content-wrapper .row,
  .content-wrapper .inline-grid,
  .content-wrapper .company-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .onboarding-modal {
    padding: 10px !important;
  }

  .onboarding-card {
    width: min(100%, 100%) !important;
    max-height: calc(100dvh - 20px) !important;
  }
}

/* ===== Source: bidcenter-dashboard-legacy-tune.css ===== */
/* Legacy layout tune-up (2026-03-25)
   Mantem o layout/classic flow e melhora legibilidade, foco e ritmo visual. */

:root,
html[data-theme="light"],
html[data-theme="dark"] {
  --bc-legacy-focus-shadow: 0 14px 34px rgba(10, 15, 30, 0.2);
}

.main-content > .header {
  position: sticky;
  top: 10px;
  z-index: 12;
}

#panel-auction .auction-subnav-card {
  position: sticky;
  top: 84px;
  z-index: 8;
}

#panel-auction .auction-pane > .card {
  border-radius: 18px;
}

#panel-auction .auction-subnav {
  gap: 10px;
}

#panel-auction .auction-subbtn {
  min-height: 42px;
  border-radius: 12px;
  font-weight: 700;
}

#auction-pane-studio .manual-command-banner {
  border-radius: 14px;
  border: 1px solid color-mix(in oklab, var(--bc-ui-primary, #8b5cf6) 34%, transparent);
  background: color-mix(in oklab, var(--bc-ui-primary, #8b5cf6) 12%, transparent);
}

#auction-pane-studio .manual-command-inline code {
  border-radius: 10px;
  border: 1px solid color-mix(in oklab, var(--bc-ui-primary, #8b5cf6) 30%, transparent);
  background: color-mix(in oklab, var(--bc-ui-panel-bg, #fff) 82%, var(--bc-ui-primary, #8b5cf6) 18%);
}

#auction-pane-studio .manual-studio-toolbar {
  position: sticky;
  top: 146px;
  z-index: 6;
  padding: 8px 10px;
  border-radius: 14px;
  border: 1px solid var(--bc-ui-panel-border, rgba(80, 80, 120, 0.2));
  background: color-mix(in oklab, var(--bc-ui-panel-bg, #fff) 92%, transparent);
  box-shadow: var(--bc-legacy-focus-shadow);
}

#auction-pane-studio .manual-studio-statusbar .status.compact {
  border-width: 1px;
  font-weight: 600;
}

#auction-pane-studio #manualPairGrid,
#auction-pane-studio #manualBatchList {
  margin-top: 10px;
}

#auction-pane-schedule .schedule-item {
  border: 1px solid var(--bc-ui-panel-border, rgba(80, 80, 120, 0.2));
  border-radius: 14px;
  padding: 12px;
  margin-bottom: 10px;
  background: color-mix(in oklab, var(--bc-ui-panel-bg, #fff) 90%, transparent);
}

#auction-pane-schedule .schedule-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

#auction-pane-schedule .schedule-actions .secondary {
  min-height: 36px;
  border-radius: 999px;
  padding: 0 12px;
}

#auction-pane-schedule .schedule-actions .secondary.danger {
  border-color: color-mix(in oklab, #ef4444 42%, transparent);
  color: color-mix(in oklab, #ef4444 84%, var(--bc-ui-text, #fff));
  background: color-mix(in oklab, #ef4444 12%, transparent);
}

#auction-pane-schedule .schedule-actions .secondary.danger:hover {
  border-color: color-mix(in oklab, #ef4444 58%, transparent);
  background: color-mix(in oklab, #ef4444 18%, transparent);
}

@media (max-width: 1080px) {
  #panel-auction .auction-subnav-card,
  #auction-pane-studio .manual-studio-toolbar {
    position: static;
  }
}

/* Auth health panel */
.global-incident-banner {
  margin: 10px 20px 0;
  border: 1px solid var(--bc-ui-panel-border, rgba(80, 80, 120, 0.2));
  border-radius: 14px;
  padding: 10px 12px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  background: color-mix(in oklab, var(--bc-ui-panel-bg, #fff) 93%, transparent);
}

.global-incident-banner.is-hidden {
  display: none;
}

.global-incident-banner.is-warn {
  border-color: color-mix(in oklab, #f59e0b 42%, transparent);
}

.global-incident-banner.is-critical {
  border-color: color-mix(in oklab, #ef4444 45%, transparent);
  box-shadow: 0 0 0 1px color-mix(in oklab, #ef4444 24%, transparent) inset;
}

.global-incident-copy {
  display: grid;
  gap: 4px;
}

.global-incident-copy strong {
  font-size: 0.95rem;
}

.global-incident-copy p {
  margin: 0;
  color: var(--bc-ui-text-muted, #9ca3af);
  font-size: 0.84rem;
}

.global-incident-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.audit-toolbar {
  align-items: end;
}

.audit-toolbar-actions {
  display: flex;
  align-items: end;
}

.audit-toolbar-actions button {
  min-height: 40px;
}

.audit-event-list {
  display: grid;
  gap: 8px;
}

.audit-event-item {
  border: 1px solid var(--bc-ui-panel-border, rgba(80, 80, 120, 0.2));
  border-radius: 12px;
  padding: 10px;
  background: color-mix(in oklab, var(--bc-ui-panel-bg, #fff) 94%, transparent);
}

.audit-event-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.audit-event-meta {
  margin-top: 6px;
  font-size: 0.8rem;
  color: var(--bc-ui-text-muted, #9ca3af);
}

.audit-event-item p {
  margin: 6px 0 0;
  font-size: 0.86rem;
}

.auth-health-toolbar {
  align-items: end;
}

.auth-health-toolbar-actions {
  display: flex;
  align-items: end;
}

.auth-health-toolbar-actions button {
  min-height: 40px;
  white-space: nowrap;
}

.auth-health-incident-card {
  border: 1px solid var(--bc-ui-panel-border, rgba(80, 80, 120, 0.2));
  border-radius: 14px;
  padding: 12px;
  background: color-mix(in oklab, var(--bc-ui-panel-bg, #fff) 95%, transparent);
}

.auth-health-incident-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.auth-health-incident-head h3 {
  margin: 0;
  font-size: 1rem;
}

.auth-health-incident-meta {
  margin-top: 6px;
  color: var(--bc-ui-text-muted, #9ca3af);
  font-size: 0.82rem;
}

.auth-health-incident-actions {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.auth-health-incident-actions button {
  min-height: 38px;
}

.auth-health-kpi-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.auth-health-funnel-kpi-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.auth-health-funnel-steps {
  display: grid;
  gap: 10px;
}

.auth-health-funnel-step {
  border: 1px solid var(--bc-ui-panel-border, rgba(80, 80, 120, 0.2));
  border-radius: 12px;
  padding: 10px 12px;
  background: color-mix(in oklab, var(--bc-ui-panel-bg, #fff) 94%, transparent);
}

.auth-health-funnel-step-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}

.auth-health-funnel-step-rate {
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.auth-health-funnel-step-rate.base {
  color: var(--bc-ui-text-muted, #9ca3af);
  background: color-mix(in oklab, var(--bc-ui-text-muted, #9ca3af) 14%, transparent);
}

.auth-health-funnel-step-rate.ok {
  color: #10b981;
  background: color-mix(in oklab, #10b981 16%, transparent);
}

.auth-health-funnel-step-rate.warn {
  color: #f59e0b;
  background: color-mix(in oklab, #f59e0b 16%, transparent);
}

.auth-health-funnel-step-rate.danger {
  color: #ef4444;
  background: color-mix(in oklab, #ef4444 16%, transparent);
}

.auth-health-funnel-step-meta {
  margin-top: 5px;
  font-size: 0.82rem;
  color: var(--bc-ui-text-muted, #9ca3af);
}

.auth-health-funnel-step-track {
  margin-top: 8px;
  height: 6px;
  border-radius: 999px;
  background: color-mix(in oklab, var(--bc-ui-text-muted, #9ca3af) 18%, transparent);
  overflow: hidden;
}

.auth-health-funnel-step-track span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #10b981 0%, #38bdf8 100%);
}

.auth-health-funnel-empty {
  border: 1px dashed var(--bc-ui-panel-border, rgba(80, 80, 120, 0.24));
  border-radius: 12px;
  padding: 10px 12px;
  color: var(--bc-ui-text-muted, #9ca3af);
  font-size: 0.86rem;
}

.auth-health-hourly-list {
  display: grid;
  gap: 8px;
}

.auth-health-hour-row {
  border: 1px solid var(--bc-ui-panel-border, rgba(80, 80, 120, 0.2));
  border-radius: 12px;
  padding: 8px 10px;
  background: color-mix(in oklab, var(--bc-ui-panel-bg, #fff) 92%, transparent);
}

.auth-health-hour-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
  font-size: 0.84rem;
  color: var(--bc-ui-text-muted, #9ca3af);
}

.auth-health-hour-track {
  margin-top: 8px;
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in oklab, var(--bc-ui-text-muted, #9ca3af) 20%, transparent);
  display: flex;
}

.auth-health-hour-track span {
  display: block;
  height: 100%;
}

.auth-health-hour-track span.ok {
  background: #10b981;
}

.auth-health-hour-track span.warn {
  background: #f59e0b;
}

.auth-health-hour-track span.danger {
  background: #ef4444;
}

.auth-health-two-col {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px;
}

.auth-health-issues {
  display: grid;
  gap: 8px;
}

.auth-health-issue-item {
  border: 1px solid var(--bc-ui-panel-border, rgba(80, 80, 120, 0.2));
  border-radius: 10px;
  padding: 8px 10px;
  background: color-mix(in oklab, var(--bc-ui-panel-bg, #fff) 94%, transparent);
}

.auth-health-issue-head {
  font-size: 0.76rem;
  color: var(--bc-ui-text-muted, #9ca3af);
  margin-bottom: 4px;
}

.auth-health-issue-item p {
  margin: 0;
  font-size: 0.88rem;
}

@media (max-width: 980px) {
  .global-incident-banner {
    margin: 10px 12px 0;
    flex-direction: column;
    align-items: stretch;
  }

  .global-incident-actions {
    justify-content: flex-start;
  }

  .auth-health-two-col {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ===== Source: bidcenter-dashboard-auth.css ===== */
/* Auth layout consolidation (2026-03-25)
   Source of truth for login/register/forgot responsiveness. */

body:not(.authenticated) .content-wrapper.bidcenter-content,
body:not(.authenticated) #panel-core,
body:not(.authenticated) .auth-shell,
body:not(.authenticated) .auth-card,
body:not(.authenticated) .auth-showcase {
  min-width: 0 !important;
}

body:not(.authenticated) .auth-shell {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 470px) !important;
  gap: clamp(16px, 2.6vw, 34px) !important;
  align-items: stretch !important;
}

body:not(.authenticated) .auth-showcase {
  width: 100% !important;
}

body:not(.authenticated) .auth-card {
  width: 100% !important;
  max-width: 470px !important;
  justify-self: end !important;
}

@media (max-width: 1100px) {
  body:not(.authenticated) .auth-shell {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 430px) !important;
    gap: 20px !important;
  }
}

@media (max-width: 980px) {
  body:not(.authenticated) .auth-shell {
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: auto !important;
    gap: 14px !important;
  }

  body:not(.authenticated) .auth-card {
    max-width: min(560px, 100%) !important;
    justify-self: stretch !important;
    margin: 0 auto !important;
    order: 1 !important;
  }

  body:not(.authenticated) .auth-showcase {
    order: 2 !important;
  }

  body:not(.authenticated) .auth-brand,
  body:not(.authenticated) .auth-showcase-copy {
    justify-items: center !important;
    text-align: center !important;
    margin-inline: auto !important;
  }
}

@media (max-width: 760px) {
  body:not(.authenticated) .auth-showcase {
    display: none !important;
  }

  body:not(.authenticated) .auth-shell {
    gap: 0 !important;
  }
}

@media (max-width: 520px) {
  body:not(.authenticated) .main-content {
    padding: 12px 10px 18px !important;
  }

  body:not(.authenticated) .auth-card {
    padding: 16px 14px 14px !important;
    border-radius: 16px !important;
  }

  body:not(.authenticated) .auth-inline-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  body:not(.authenticated) .auth-switch-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 6px !important;
  }

  body:not(.authenticated) .auth-footer-links {
    justify-content: flex-start !important;
    gap: 10px !important;
  }
}

@media (max-width: 380px) {
  body:not(.authenticated) .auth-card {
    padding: 14px 12px 12px !important;
  }

  body:not(.authenticated) .auth-primary-btn,
  body:not(.authenticated) .auth-secondary-btn {
    min-height: 42px !important;
    font-size: 0.95rem !important;
  }
}

/* ===== Source: bidcenter-dashboard-maturity.css ===== */
/* BidCenter SaaS maturity layer (2026-03-25)
   No layout structure changes. Visual consistency + responsive polish. */

:root,
html[data-theme="light"] {
  --bc-m-font-ui: "Manrope", "Segoe UI", sans-serif;
  --bc-m-font-heading: "Sora", "Manrope", "Segoe UI", sans-serif;
  --bc-m-space-1: 8px;
  --bc-m-space-2: 12px;
  --bc-m-space-3: 16px;
  --bc-m-space-4: 20px;
  --bc-m-space-5: 28px;
  --bc-m-radius-sm: 12px;
  --bc-m-radius-md: 16px;
  --bc-m-radius-lg: 20px;
  --bc-m-line: rgba(64, 40, 98, 0.16);
  --bc-m-line-strong: rgba(64, 40, 98, 0.28);
  --bc-m-text: #241737;
  --bc-m-text-soft: #66577c;
  --bc-m-text-muted: #84749a;
  --bc-m-primary: #7c3aed;
  --bc-m-primary-2: #8b5cf6;
  --bc-m-surface: #ffffff;
  --bc-m-surface-soft: #f4ecff;
  --bc-m-focus: 0 0 0 3px rgba(124, 58, 237, 0.2);
  --bc-m-shadow: 0 16px 34px rgba(24, 14, 36, 0.12);
  --bc-m-shadow-soft: 0 10px 22px rgba(24, 14, 36, 0.08);
}

html[data-theme="dark"] {
  --bc-m-line: rgba(233, 221, 255, 0.14);
  --bc-m-line-strong: rgba(233, 221, 255, 0.26);
  --bc-m-text: #f3ebff;
  --bc-m-text-soft: #c3b2da;
  --bc-m-text-muted: #9d8bb7;
  --bc-m-primary: #a855f7;
  --bc-m-primary-2: #9333ea;
  --bc-m-surface: #181126;
  --bc-m-surface-soft: #211735;
  --bc-m-focus: 0 0 0 3px rgba(168, 85, 247, 0.24);
  --bc-m-shadow: 0 24px 52px rgba(1, 1, 8, 0.42);
  --bc-m-shadow-soft: 0 14px 30px rgba(1, 1, 8, 0.3);
}

html,
body {
  text-rendering: geometricPrecision;
}

body,
input,
select,
textarea,
button {
  font-family: var(--bc-m-font-ui);
}

h1,
h2,
h3,
h4,
.section-title,
.dashboard-section-kicker,
.dashboard-panel-label,
.nav-label,
.workspace-title {
  font-family: var(--bc-m-font-heading) !important;
}

.content-wrapper h2,
.content-wrapper h3,
body:not(.authenticated) .auth-card h2 {
  letter-spacing: -0.02em !important;
  line-height: 1.14 !important;
}

.content-wrapper .subhead,
.content-wrapper p,
body:not(.authenticated) .auth-card .subhead,
body:not(.authenticated) .auth-card label {
  color: var(--bc-m-text-soft) !important;
}

.main-content > .header {
  border-radius: 0 0 var(--bc-m-radius-lg) var(--bc-m-radius-lg) !important;
  border-color: var(--bc-m-line) !important;
  box-shadow: var(--bc-m-shadow-soft) !important;
}

.header-business,
.header-search,
.header-utility-btn,
.user-menu {
  border-color: var(--bc-m-line) !important;
}

.header-search,
.header-utility-btn {
  background: color-mix(in oklab, var(--bc-m-surface-soft) 82%, transparent) !important;
}

.workspace-trigger {
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  transition: border-color 120ms ease, background 120ms ease, color 120ms ease;
}

.workspace-trigger:hover,
.workspace-trigger.active {
  border-color: color-mix(in oklab, var(--bc-m-primary) 42%, transparent) !important;
  background: color-mix(in oklab, var(--bc-m-primary) 16%, transparent) !important;
  color: var(--bc-m-text) !important;
}

.workspace-menu-panel {
  border-radius: var(--bc-m-radius-md) !important;
  border-color: var(--bc-m-line-strong) !important;
  box-shadow: var(--bc-m-shadow) !important;
}

/* Sidebar workspace nav (no global layout changes). */
.sidebar-workspace {
  margin-top: 12px;
  padding-top: 12px;
  padding-bottom: 8px;
  border-top: 1px solid var(--bc-m-line);
}

.sidebar .workspace-nav.workspace-nav-sidebar {
  display: grid !important;
  gap: 8px;
  width: 100%;
  overflow: visible;
}

.sidebar .workspace-menu {
  width: 100%;
}

.sidebar .nav-section {
  flex: 0 0 auto;
  display: grid;
  gap: 8px;
  align-content: start;
}

.sidebar .nav-section .nav-label {
  margin: 0 0 2px 2px;
}

.sidebar .nav-item.panel-btn {
  width: 100%;
  margin-bottom: 0;
  justify-content: flex-start;
  display: inline-flex;
}

.sidebar .workspace-menu > .panel-btn.workspace-trigger {
  width: 100%;
  justify-content: space-between;
  text-align: left;
  padding-inline: 12px !important;
}

.sidebar .workspace-menu-panel {
  position: static !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  pointer-events: auto !important;
  margin-top: 8px;
  padding: 10px !important;
  border: 1px solid var(--bc-m-line) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  background: color-mix(in oklab, var(--bc-m-surface-soft) 84%, transparent) !important;
  left: auto !important;
  top: auto !important;
  min-width: 0 !important;
  width: 100%;
  grid-template-columns: minmax(0, 1fr) !important;
  display: none;
}

.sidebar .workspace-menu.open .workspace-menu-panel {
  display: grid;
}

.sidebar .workspace-col {
  gap: 6px;
}

.sidebar .workspace-link {
  min-height: 34px;
  width: 100%;
  display: block;
  white-space: normal;
}

/* Keep the legacy dashboard, but expose workspace options in the left sidebar. */
body.authenticated .dashboard {
  display: grid;
  grid-template-columns: 288px minmax(0, 1fr);
  gap: 0;
}

body.authenticated .sidebar {
  display: flex !important;
  position: sticky;
  top: 0;
  height: 100dvh;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 14px 12px 18px !important;
  border-right: 1px solid var(--bc-m-line) !important;
  background: color-mix(in oklab, var(--bc-m-surface) 94%, transparent) !important;
}

body.authenticated .main-content {
  min-width: 0;
  padding: 14px 18px 22px !important;
}

body.authenticated .header {
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-areas: "brand actions" !important;
  gap: 12px !important;
  align-items: start;
}

body.authenticated .header-left {
  display: grid;
  gap: 8px;
  align-items: start;
}

body.authenticated .header-brand {
  display: none !important;
}

body.authenticated .header-subtitle {
  display: none !important;
}

.header-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--bc-m-line);
  border-radius: 14px;
  padding: 10px 12px;
  background: color-mix(in oklab, var(--bc-m-surface-soft) 86%, transparent);
}

.header-context-copy {
  display: grid;
  gap: 2px;
}

.header-context-path {
  color: var(--bc-m-text-muted);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
}

.header-context-copy strong {
  color: var(--bc-m-text);
  font-size: 0.95rem;
  font-weight: 800;
}

.header-context-cta {
  min-height: 34px !important;
  border-radius: 10px !important;
  padding: 8px 11px !important;
  border: 1px solid var(--bc-m-line-strong) !important;
  background: color-mix(in oklab, var(--bc-m-primary) 18%, transparent) !important;
  color: var(--bc-m-text) !important;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
}

.content-wrapper .card,
.dashboard-surface,
.dashboard-panel,
.dashboard-summary-card,
.auth-card,
.onboarding-card,
.global-incident-banner {
  border-radius: var(--bc-m-radius-md) !important;
  border-color: var(--bc-m-line) !important;
  box-shadow: var(--bc-m-shadow-soft) !important;
}

/* Keep auth-health incident visible, but avoid the huge centered stripe. */
.global-incident-banner {
  position: fixed !important;
  top: 94px;
  right: 18px;
  left: auto !important;
  width: min(480px, calc(100vw - 24px));
  margin: 0 !important;
  z-index: 2250;
  background: color-mix(in oklab, var(--bc-m-surface) 92%, transparent) !important;
  backdrop-filter: blur(10px);
}

.global-incident-copy {
  min-width: 0;
}

.global-incident-copy strong {
  line-height: 1.2;
}

.global-incident-copy p {
  overflow-wrap: anywhere;
}

@media (max-width: 980px) {
  .global-incident-banner {
    position: static !important;
    width: auto;
    margin: 8px 12px 0 !important;
  }
}

.dashboard-shell,
.dashboard-shell.dashboard-shell-overview,
.stack {
  gap: var(--bc-m-space-4) !important;
}

.dashboard-summary-grid,
.dashboard-board-grid,
.dashboard-action-stack-inline {
  gap: var(--bc-m-space-3) !important;
}

.status-mini-card,
.checklist-item,
.dashboard-commerce-kpi-card,
.dashboard-commerce-chart-card,
.audit-event-item,
.auth-health-incident-card {
  border: 1px solid var(--bc-m-line) !important;
  border-radius: var(--bc-m-radius-sm) !important;
}

.dashboard-section-header h2,
.dashboard-board-header h3 {
  font-weight: 800 !important;
}

.dashboard-section-header p,
.dashboard-board-header p {
  max-width: 78ch;
}

.dashboard-empty,
.status.is-empty {
  border: 1px dashed color-mix(in oklab, var(--bc-m-primary) 42%, transparent) !important;
  background: color-mix(in oklab, var(--bc-m-surface-soft) 82%, transparent) !important;
  border-radius: var(--bc-m-radius-sm) !important;
}

.dashboard-empty strong {
  font-size: 1rem !important;
  color: var(--bc-m-text) !important;
}

.dashboard-empty p,
.status.is-empty {
  color: var(--bc-m-text-soft) !important;
}

.status,
.status.ok,
.status.warn,
.status.error,
.status.danger {
  border-radius: 10px !important;
}

.status-badge {
  border-radius: 999px !important;
  border: 1px solid var(--bc-m-line) !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em;
}

.content-wrapper button,
.content-wrapper .panel-btn,
.content-wrapper .dashboard-action-btn,
.content-wrapper .checklist-action,
.content-wrapper .secondary,
.auth-primary-btn,
.auth-secondary-btn,
.user-dropdown-item,
.user-plan-btn {
  min-height: 44px !important;
  border-radius: 12px !important;
  transition: transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease, background 120ms ease !important;
}

.dashboard-action-btn.primary,
.auth-primary-btn,
.content-wrapper button.primary,
.content-wrapper .panel-btn.active {
  background: linear-gradient(135deg, var(--bc-m-primary), var(--bc-m-primary-2)) !important;
  border-color: color-mix(in oklab, var(--bc-m-primary) 66%, transparent) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 24px color-mix(in oklab, var(--bc-m-primary) 30%, transparent) !important;
}

.dashboard-action-btn.secondary,
.checklist-action,
.auth-secondary-btn,
.content-wrapper .secondary,
.content-wrapper .ghost {
  background: color-mix(in oklab, var(--bc-m-surface-soft) 85%, transparent) !important;
  color: var(--bc-m-text-soft) !important;
  border-color: var(--bc-m-line) !important;
}

.dashboard-action-btn.secondary:hover,
.checklist-action:hover,
.auth-secondary-btn:hover,
.content-wrapper .secondary:hover,
.content-wrapper .ghost:hover {
  background: color-mix(in oklab, var(--bc-m-surface-soft) 72%, var(--bc-m-primary) 28%) !important;
  color: var(--bc-m-text) !important;
  border-color: color-mix(in oklab, var(--bc-m-primary) 44%, transparent) !important;
}

button:hover,
.panel-btn:hover,
.dashboard-action-btn:hover,
.checklist-action:hover,
.auth-primary-btn:hover,
.auth-secondary-btn:hover,
.user-dropdown-item:hover,
.user-plan-btn:hover {
  transform: translateY(-1px);
}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled {
  opacity: 0.58;
  cursor: not-allowed !important;
  box-shadow: none !important;
}

.content-wrapper input,
.content-wrapper select,
.content-wrapper textarea,
.header-search,
body:not(.authenticated) .auth-card input,
body:not(.authenticated) .auth-card select,
body:not(.authenticated) .auth-card textarea {
  border-radius: 12px !important;
  border-color: var(--bc-m-line) !important;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.panel-btn:focus-visible,
.workspace-link:focus-visible,
.user-dropdown-item:focus-visible {
  outline: none !important;
  box-shadow: var(--bc-m-focus) !important;
}

.dashboard-next-action {
  margin: 10px 0 0 !important;
  color: var(--bc-m-text) !important;
  font-weight: 700;
}

#dashboardSkeleton.hidden {
  display: none !important;
}

.dashboard-skeleton-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--bc-m-space-3);
}

.dashboard-skeleton-card {
  border: 1px solid var(--bc-m-line);
  border-radius: var(--bc-m-radius-sm);
  background: color-mix(in oklab, var(--bc-m-surface-soft) 88%, transparent);
  padding: 16px;
  display: grid;
  gap: 10px;
}

.dashboard-skeleton-line,
.dashboard-skeleton-chip,
.dashboard-skeleton-metric {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  background: color-mix(in oklab, var(--bc-m-line) 90%, transparent);
}

.dashboard-skeleton-line {
  height: 10px;
}

.dashboard-skeleton-line.w-30 { width: 30%; }
.dashboard-skeleton-line.w-35 { width: 35%; }
.dashboard-skeleton-line.w-40 { width: 40%; }
.dashboard-skeleton-line.w-70 { width: 70%; }
.dashboard-skeleton-line.w-78 { width: 78%; }
.dashboard-skeleton-line.w-80 { width: 80%; }
.dashboard-skeleton-line.w-90 { width: 90%; }
.dashboard-skeleton-line.w-92 { width: 92%; }
.dashboard-skeleton-line.w-96 { width: 96%; }

.dashboard-skeleton-chip-row {
  display: flex;
  gap: 8px;
}

.dashboard-skeleton-chip {
  width: 88px;
  height: 24px;
  border-radius: 999px;
}

.dashboard-skeleton-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.dashboard-skeleton-metric {
  height: 76px;
}

.dashboard-skeleton-line::after,
.dashboard-skeleton-chip::after,
.dashboard-skeleton-metric::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.25), transparent);
  animation: dashboardSkeletonShimmer 1.2s linear infinite;
}

@keyframes dashboardSkeletonShimmer {
  100% {
    transform: translateX(100%);
  }
}

body.dashboard-loading .dashboard-home .dashboard-shell {
  display: none !important;
}

body.dashboard-loading .dashboard-home #dashboardSkeleton {
  display: grid !important;
}

.subscription-gate {
  display: none;
}

body.subscription-blocked .dashboard-home .dashboard-shell {
  display: none !important;
}

body.subscription-blocked:not(.dashboard-loading) .dashboard-home .subscription-gate {
  display: block;
}

.subscription-gate-card {
  border: 1px solid color-mix(in oklab, var(--bc-m-primary) 36%, var(--bc-m-line));
  border-radius: var(--bc-m-radius-md);
  background: linear-gradient(180deg, color-mix(in oklab, var(--bc-m-surface) 92%, #1a1130 8%), color-mix(in oklab, var(--bc-m-surface-soft) 90%, #120b21 10%));
  padding: 18px;
  display: grid;
  gap: 12px;
  box-shadow: var(--bc-m-shadow-soft);
}

.subscription-gate-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.subscription-gate-head h3 {
  margin: 0;
  font-size: 1.16rem;
  color: var(--bc-m-text);
}

.subscription-gate-card p {
  margin: 0;
  color: var(--bc-m-text-soft);
}

.subscription-gate-meta {
  color: var(--bc-m-text-muted);
  font-size: 0.86rem;
}

.subscription-gate-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.subscription-modal-card {
  width: min(980px, 100%);
  max-height: calc(100dvh - 96px);
  overflow: auto;
  display: grid;
  gap: 14px;
}

.onboarding-modal#subscriptionModal.open {
  align-items: flex-start;
  padding-top: 68px;
  padding-bottom: 14px;
}

.subscription-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.subscription-modal-head h2 {
  margin: 0 0 6px;
}

.subscription-modal-head p {
  margin: 0;
  color: var(--bc-m-text-soft);
}

.subscription-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.subscription-plan-card {
  border: 1px solid var(--bc-m-line);
  border-radius: var(--bc-m-radius-sm);
  background: color-mix(in oklab, var(--bc-m-surface-soft) 90%, transparent);
  padding: 12px;
  display: grid;
  gap: 10px;
}

.subscription-plan-card.is-current {
  border-color: color-mix(in oklab, var(--bc-m-primary) 56%, var(--bc-m-line));
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--bc-m-primary) 28%, transparent);
}

.subscription-plan-card.is-recommended {
  border-color: color-mix(in oklab, var(--bc-m-primary) 56%, var(--bc-m-line));
}

.subscription-plan-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.subscription-plan-head strong {
  font-size: 1rem;
  color: var(--bc-m-text);
}

.subscription-plan-price {
  font-size: 1.2rem;
  font-weight: 800;
  color: var(--bc-m-text);
}

.subscription-plan-description {
  margin: 0;
  color: var(--bc-m-text-soft);
  font-size: 0.92rem;
}

.subscription-plan-features {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 5px;
  color: var(--bc-m-text-soft);
  font-size: 0.88rem;
}

.subscription-plan-card button {
  width: 100%;
}

.subscription-plan-card button:disabled {
  cursor: not-allowed !important;
  opacity: 0.65;
}

.subscription-modal-actions {
  position: sticky;
  bottom: 0;
  margin-top: 2px;
  padding-top: 10px;
  border-top: 1px solid color-mix(in oklab, var(--bc-m-line) 88%, transparent);
  background: linear-gradient(
    180deg,
    color-mix(in oklab, var(--bc-m-surface) 0%, transparent),
    color-mix(in oklab, var(--bc-m-surface) 96%, transparent) 36%
  );
  justify-content: flex-end;
}

@media (max-width: 980px) {
  .subscription-plan-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .onboarding-modal#subscriptionModal.open {
    align-items: stretch;
    padding-top: 10px;
    padding-inline: 10px;
    padding-bottom: 10px;
  }

  .subscription-modal-card {
    max-height: calc(100dvh - 20px);
  }

  .subscription-gate-card {
    padding: 14px;
  }

  .subscription-gate-actions,
  .subscription-modal-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .subscription-gate-actions button,
  .subscription-modal-actions button {
    width: 100%;
  }

  .subscription-modal-head {
    display: grid;
    grid-template-columns: 1fr;
  }

  .subscription-plan-grid {
    grid-template-columns: 1fr;
  }
}

.global-toast-stack {
  position: fixed;
  top: 86px;
  right: 20px;
  z-index: 2400;
  width: min(360px, calc(100vw - 24px));
  display: grid;
  gap: 10px;
  pointer-events: none;
}

.global-toast {
  pointer-events: auto;
  border-radius: 12px;
  border: 1px solid var(--bc-m-line-strong);
  box-shadow: var(--bc-m-shadow-soft);
  padding: 12px 12px 12px 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  animation: dashboardToastIn 140ms ease-out;
}

.global-toast-copy {
  display: grid;
  gap: 4px;
}

.global-toast-copy strong {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.global-toast-copy span {
  color: var(--bc-m-text);
  font-size: 0.92rem;
}

.global-toast-success {
  background: color-mix(in oklab, #16a34a 14%, var(--bc-m-surface) 86%);
}

.global-toast-info {
  background: color-mix(in oklab, #4c1d95 10%, var(--bc-m-surface) 90%);
}

.global-toast-warn {
  background: color-mix(in oklab, #b45309 14%, var(--bc-m-surface) 86%);
}

.global-toast-close {
  min-height: 28px !important;
  width: 28px;
  border-radius: 8px !important;
  border: 1px solid var(--bc-m-line) !important;
  background: transparent !important;
  color: var(--bc-m-text-soft) !important;
  padding: 0 !important;
}

.global-toast.closing {
  opacity: 0;
  transform: translateY(-6px);
}

@keyframes dashboardToastIn {
  from {
    opacity: 0;
    transform: translateY(-8px) scale(0.99);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.dashboard-empty-cta {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  border-radius: 10px;
  border: 1px solid var(--bc-m-line);
  background: color-mix(in oklab, var(--bc-m-surface-soft) 74%, transparent);
  color: var(--bc-m-text);
  padding: 8px 12px;
  font-weight: 700;
  cursor: pointer;
}

.dashboard-empty-cta:hover {
  border-color: color-mix(in oklab, var(--bc-m-primary) 44%, transparent);
  background: color-mix(in oklab, var(--bc-m-surface-soft) 56%, var(--bc-m-primary) 22%);
}

body.density-compact .dashboard-shell,
body.density-compact .dashboard-shell.dashboard-shell-overview,
body.density-compact .stack {
  gap: var(--bc-m-space-2) !important;
}

body.density-compact .dashboard-summary-grid,
body.density-compact .dashboard-board-grid,
body.density-compact .dashboard-action-stack-inline {
  gap: 10px !important;
}

body.density-compact .content-wrapper .card,
body.density-compact .dashboard-panel,
body.density-compact .dashboard-summary-card,
body.density-compact .auth-card,
body.density-compact .dashboard-surface {
  padding: 14px !important;
}

body.density-compact .content-wrapper button,
body.density-compact .content-wrapper .panel-btn,
body.density-compact .content-wrapper .dashboard-action-btn,
body.density-compact .content-wrapper .checklist-action,
body.density-compact .content-wrapper .secondary,
body.density-compact .auth-primary-btn,
body.density-compact .auth-secondary-btn,
body.density-compact .user-dropdown-item {
  min-height: 38px !important;
}

body.density-compact .dashboard-section-header p,
body.density-compact .dashboard-board-header p,
body.density-compact .dashboard-panel p,
body.density-compact .dashboard-empty p {
  font-size: 0.9rem !important;
}

body.density-compact .dashboard-chip,
body.density-compact .status-badge {
  font-size: 0.74rem !important;
}

.header-utility-btn.is-active {
  border-color: color-mix(in oklab, var(--bc-m-primary) 52%, transparent) !important;
  background: color-mix(in oklab, var(--bc-m-primary) 22%, transparent) !important;
}

.profile-theme-switch {
  width: 36px;
  height: 20px;
  border-radius: 999px;
  border: 1px solid var(--bc-m-line);
  background: color-mix(in oklab, var(--bc-m-surface-soft) 84%, transparent);
  position: relative;
  display: inline-block;
}

.profile-theme-switch::after {
  content: "";
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: var(--bc-m-text-soft);
  position: absolute;
  top: 2px;
  left: 3px;
  transition: transform 120ms ease, background 120ms ease;
}

.profile-theme-switch[aria-checked="true"] {
  background: color-mix(in oklab, var(--bc-m-primary) 36%, transparent);
  border-color: color-mix(in oklab, var(--bc-m-primary) 56%, transparent);
}

.profile-theme-switch[aria-checked="true"]::after {
  transform: translateX(15px);
  background: #ffffff;
}

.status.warn,
.status.error,
.status.danger {
  font-weight: 700;
}

html[data-theme="dark"] .status.warn,
html[data-theme="dark"] .status.error,
html[data-theme="dark"] .status.danger {
  color: #ffd7ad !important;
}

@media (max-width: 1180px) {
  body.authenticated .dashboard {
    grid-template-columns: minmax(0, 1fr);
  }

  body.authenticated .sidebar {
    display: none !important;
  }

  body.authenticated .header-brand {
    display: inline-flex !important;
  }

  body.authenticated .header-subtitle {
    display: block !important;
  }

  .main-content > .header {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas: "brand actions" !important;
    row-gap: 10px !important;
  }

  .header-right {
    justify-self: end;
  }

  .header-context {
    flex-wrap: wrap;
  }

  .header-context-cta {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 920px) {
  .dashboard-skeleton-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .main-content {
    padding-inline: 10px !important;
  }

  .main-content > .header,
  .main-content > .content-wrapper.bidcenter-content,
  .main-content > .content-wrapper {
    width: 100% !important;
  }

  .header {
    padding: 12px !important;
  }

  .header-right {
    width: 100%;
    justify-content: space-between;
    gap: 8px !important;
  }

  .header-search {
    flex: 1 1 auto;
    min-width: 0;
  }

  .dashboard-summary-grid,
  .dashboard-board-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 760px) {
  .global-toast-stack {
    top: 72px;
    right: 10px;
    width: min(100vw - 16px, 340px);
  }

  .header {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
  }

  .header-left,
  .header-right,
  .header-center {
    width: 100% !important;
    position: static !important;
  }

  .header-left {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    order: 1;
  }

  .header-brand {
    align-self: flex-start;
  }

  .header-business {
    width: 100%;
    justify-content: space-between;
  }

  .header-context {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .header-context-copy {
    width: 100%;
  }

  .header-context-cta {
    width: 100%;
    justify-content: center;
  }

  .header-right {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px !important;
    order: 2;
  }

  .header-search {
    width: 100%;
  }

  .header-utility-row {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px;
  }

  .user-menu {
    width: 100%;
  }

  body.authenticated .header-subtitle {
    display: none !important;
  }

  .content-wrapper .card,
  .dashboard-panel,
  .dashboard-summary-card,
  .auth-card {
    padding: 14px !important;
  }

  .dashboard-action-stack-inline {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .dashboard-action-btn,
  .checklist-action {
    width: 100%;
  }
}

@media (max-width: 520px) {
  body:not(.authenticated) .main-content {
    padding: 10px 8px 16px !important;
  }

  body:not(.authenticated) .auth-card {
    border-radius: 14px !important;
    padding: 14px 12px !important;
  }

  body:not(.authenticated) .auth-inline-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  body:not(.authenticated) .auth-primary-btn,
  body:not(.authenticated) .auth-secondary-btn {
    min-height: 44px !important;
    font-size: 0.96rem !important;
  }
}

