:root { color-scheme: light; }
html[data-shop-theme="dark"] { color-scheme: dark; }
body { margin: 0; }
body:has(.commerce-header) { padding-top: 72px; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--ui-primary); outline-offset: 3px; }
.brand { gap: 10px; }
.brand-mark { display: block; width: 34px; height: 34px; flex: none; object-fit: contain; }
.brand-mark--auth { height: 42px; }
.brand-text { white-space: nowrap; }
.commerce-header .brand-text { font-size: 17.3px; letter-spacing: .008em; }
.brand:hover { text-decoration: none; }
.brand-auth { justify-content: center; margin-bottom: 20px; }
.brand-auth .brand-text { font-size: 25px; }
.commerce-actions { display: flex; align-items: center; gap: 6px; }
.auth-entry { display: flex; gap: 8px; align-items: center; }
.auth-link { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 0 14px; border: 1px solid var(--ui-border); border-radius: 9px; font-size: 12px; font-weight: 750; }
.auth-link.primary { border-color: var(--ui-action-primary); background: var(--ui-action-primary); color: white; }
.language-select { height: 42px; appearance: none; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-2); color: var(--ui-text); font-size: 12px; font-weight: 700; padding: 0 25px 0 8px; }
.language-switcher { position: relative; display: block; flex: none; }
.language-menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 200; display: grid; min-width: 140px; padding: 6px; border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-surface-1); box-shadow: var(--ui-shadow-lg); }
.language-option { padding: 10px 12px; border: 0; border-radius: 7px; background: transparent; color: var(--ui-text); font-size: 13px; font-weight: 650; text-align: left; }
.language-option:hover { background: var(--ui-primary-soft); color: var(--ui-primary); }
.language-trigger img { display: block; width: 24px; height: 18px; border-radius: 2px; }
.language-chevron { position: absolute; right: 7px; pointer-events: none; color: var(--ui-text-muted); }
.notification-trigger, .theme-switcher { border: 0; background: var(--ui-surface-1); color: #152039; width: 42px; height: 42px; display: grid; grid-template-columns: 40px; place-items: center; padding: 0; }
.notification-trigger svg, .theme-switcher svg { width: 22px; height: 22px; }
.cart-shortcut { position: relative; display: grid; place-items: center; width: 42px; height: 42px; color: var(--ui-text); }
.cart-shortcut>span { position: absolute; right: -2px; top: 1px; min-width: 16px; height: 16px; border-radius: 10px; background: #bb3548; color: white; font-size: 10px; text-align: center; }
.account-menu { position: relative; }
.account-dropdown { display: grid; gap: 0; }
.account-dropdown p { overflow: hidden; text-overflow: ellipsis; }
.account-dropdown button { cursor: pointer; }
.wallet-summary { color: var(--ui-text); }
body .page-shell { width: 86% !important; max-width: 1440px; margin: 0 auto; padding: 24px 0 30px; }
body .app-page-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: flex-start; gap: 16px; min-height: 0; padding: 8px 0 16px; border-bottom: 1px solid var(--ui-border); }
.app-page-heading { display: flex; min-width: 0; align-items: center; gap: 12px; }
.app-page-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.app-page-title-row h1 { margin: 0; color: var(--ui-text-strong); font: 800 24px/1.3 var(--ui-font-display); }
.app-page-title-row h1>svg { vertical-align: -4px; margin-right: 9px; color: var(--ui-primary); }
.page-banner-announcement { display: flex; min-width: 0; align-items: center; justify-content: center; height: auto; padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; font-size: inherit; line-height: inherit; }
.page-banner-announcement strong { font-weight: 800; }
.tone-red { color: #d92d20; } .tone-blue { color: #175cd3; }
body .region-switcher { margin: 0 0 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
body .region-button { min-height: 88px; padding: 16px; }
body .region-button-heading { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 32px; }
body .region-button small { display: block; margin-top: 0; font-size: 12px; font-weight: 400; }
body .market-filter-grid { margin-top: 0; padding: 16px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-md); background: var(--ui-surface-1); }
.searchable-select-control { position: relative; }
.searchable-select-control select { appearance: none; width: 100%; height: 42px; padding: 0 28px 0 12px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-1); color: var(--ui-text); font-size: 13px; font-weight: 650; }
.searchable-select-chevron { position: absolute; pointer-events: none; right: 10px; top: 13px; color: var(--ui-text-muted); }
.bank-options { position: absolute; top: calc(100% + 6px); left: 0; z-index: 200; display: grid; width: 360px; max-width: calc(100vw - 48px); max-height: 300px; overflow: auto; padding: 6px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-1); box-shadow: var(--ui-shadow-lg); }
.bank-options button { padding: 10px; border: 0; border-radius: 6px; background: transparent; color: var(--ui-text); font-size: 12px; text-align: left; cursor: pointer; }
.bank-options button:hover { background: var(--ui-primary-soft); color: var(--ui-primary); }
.app-field-inset-control { position: relative; height: 100%; min-height: 190px; }
.app-field-inset-control textarea { width: 100%; height: 100%; min-height: 190px; resize: none; padding: 12px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-1); color: var(--ui-text); font-size: 13px; line-height: 1.65; }
.app-field-inset-hint { position: absolute; left: 12px; bottom: 10px; color: var(--ui-text-muted); }
.market-price-inputs { display: flex; align-items: center; gap: 6px; height: 42px; margin-top: 7px; }
.market-price-inputs input { width: 70px; height: 40px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-1); color: var(--ui-text); padding: 0 9px; }
.market-price-filter-head { justify-content: space-between; }
.market-price-range { accent-color: var(--ui-primary); width: 100%; margin-top: 8px; }
.market-other-filter-button[aria-pressed="true"] { border-color: var(--ui-primary); background: var(--ui-primary-soft); color: var(--ui-primary); }
.market-other-filter-button { cursor: pointer; }
.inventory-catalog { margin-top: 16px; }
.inventory-catalog.is-loading .market-table-wrap { opacity: .58; }
.market-table-wrap { overflow-x: auto; }
.market-inventory-table { width: 100%; border-collapse: collapse; }
.market-inventory-table th { background: var(--bb-color-table-header-bg); color: var(--ui-table-header-text); font-size: 12px; font-weight: 850; white-space: nowrap; border-bottom: 1px solid var(--ui-border); }
.market-inventory-table td { border-bottom: 1px solid var(--ui-border); height: auto; font-size: 12px; vertical-align: middle; }
.market-inventory-table tbody tr:hover { background: var(--ui-surface-2); }
.bin-expiry-preview, .type-brand-preview, .country-preview { display: grid; justify-items: center; gap: 5px; }
.bin-expiry-preview strong, .type-brand-preview strong, .country-preview strong { color: var(--ui-text-strong); font-weight: 800; }
.bin-expiry-preview span { color: var(--ui-text-muted); }
.card-brand-name { color: #1a56a7; font-size: 12px; font-weight: 900; border: 1px solid var(--ui-border); border-radius: 4px; padding: 2px 4px; }
.country-flag { display: grid; align-items: center; justify-content: center; overflow: hidden; box-sizing: content-box; padding: 2px; border: 1px solid var(--ui-border); border-radius: 6px; background: var(--ui-surface-2); }
.country-flag img { display: block; width: 32px; height: 24px; object-fit: contain; }
.card-brand-mark { display: grid; width: 38px; height: 24px; place-items: center; overflow: hidden; }
.card-brand-logo { display: block; width: auto; height: auto; max-width: 100%; max-height: 24px; }
.card-brand-visa .card-brand-logo { width: 36px; height: 12px; }
.card-brand-mastercard .card-brand-logo { width: 30px; height: 22px; }
.card-brand-discover .card-brand-logo { width: 38px; height: 22px; object-fit: contain; }
.card-brand-amex .card-brand-logo { width: 23px; height: 23px; }
.card-brand-jcb .card-brand-logo { width: 31px; height: 24px; }
.inventory-preview-list { display: grid; gap: 5px; font-size: 12px; line-height: 17.4px; }
.basic-preview { gap: 5px 8px; }
.inventory-preview-list span { display: flex; gap: 3px; justify-content: center; }
.inventory-preview-list b { color: var(--ui-text-muted); font-weight: 750; }
.inventory-preview-list em { font-style: normal; }
.basic-preview em.basic-present { display: inline-flex; align-items: center; color: var(--ui-success); }
.basic-preview em.basic-present svg { display: block; width: 15px; height: 15px; }
.presence-preview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.presence-preview { gap: 6px 10px !important; }
.presence-preview > span { display: inline-grid; grid-template-columns: 15px minmax(0, 1fr); align-items: center; justify-content: initial; gap: 4px; color: var(--ui-text-muted); }
.presence-preview > span svg { width: 15px; height: 15px; font-size: 15px; }
.presence-preview > span.available svg { color: var(--ui-success); }
.presence-preview > span.missing svg { color: var(--ui-danger); }
.available { color: var(--ui-success); } .missing { color: var(--ui-danger); }
.merchant-identity-badge { border-radius: 4px; background: #f5f3ff; color: #7c3aed; padding: 2px 5px; font-size: 10px; }
.market-refund-policy { color: var(--ui-success); font-size: 11px; }
.price-display-current { white-space: nowrap; color: var(--ui-text-strong); font-weight: 800; }
.cursor-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cursor-controls nav { display: flex; align-items: center; gap: 10px; }
.cursor-controls nav button { display: flex; align-items: center; height: 36px; gap: 4px; border: 1px solid var(--ui-border); border-radius: 8px; padding: 0 11px; background: var(--ui-surface-1); color: var(--ui-text); font-weight: 700; }
.cursor-controls nav button:disabled { opacity: .45; cursor: default; }
.cursor-page-size { display: flex; align-items: center; gap: 8px; color: var(--ui-text-muted); font-size: 12px; font-weight: 750; line-height: 1; }
.cursor-page-size select { height: 38px; border: 1px solid var(--ui-border); border-radius: 7px; background: var(--ui-surface-1); color: var(--ui-text); padding: 0 27px 0 10px; font-size: 12px; font-weight: 800; text-align: center; }
.market-bulk-cart { border: 0; }
.empty-state { padding: 44px 20px; text-align: center; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-1); }
.empty-state h2 { margin: 0 0 8px; }
.empty-state p { color: var(--ui-text-muted); }
.app-button { display: inline-flex; min-height: var(--ui-control-height); align-items: center; justify-content: center; gap: 8px; padding: 8px 16px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-sm); background: var(--ui-surface-1); color: var(--ui-text); font: 750 var(--ui-text-sm)/1.3 var(--ui-font-body); text-decoration: none; cursor: pointer; }
.app-button--primary { border-color: var(--ui-action-primary); background: var(--ui-action-primary); color: var(--ui-on-action-primary); }
.app-button--danger { border-color: var(--ui-danger); background: var(--ui-danger-soft); color: var(--ui-danger); }
.app-button--secondary { border-color: var(--ui-border); background: var(--ui-surface-1); color: var(--ui-text); }
.app-button--primary:hover:not(:disabled) { border-color: var(--ui-action-primary-hover); background: var(--ui-action-primary-hover); color: var(--ui-on-action-primary); }
.app-button:disabled { cursor: wait; opacity: .6; }
.error-message { color: var(--ui-danger); font-size: 13px; line-height: 1.5; margin: 8px 0; }
.success-message { color: var(--ui-success); font-size: 13px; line-height: 1.5; margin: 8px 0; }
.notice-panel { padding: 16px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-1); }
.notice-panel strong { display: block; font-size: 20px; margin-bottom: 8px; }
.notice-panel p { color: var(--ui-text-muted); line-height: 1.6; }
.notice-panel .app-button { margin-top: 10px; }
.cart-summary { display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 20px; margin-top: 20px; padding: 22px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-1); }
.cart-summary span { display: block; font-size: 12px; color: var(--ui-text-muted); margin-bottom: 4px; }
.cart-summary strong { font-size: 22px; }
.cart-actions { display: flex; gap: 10px; justify-content: flex-end; }
.recharge-amounts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 22px 0; }
.recharge-amount-card { min-height: 122px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-1); color: var(--ui-text-strong); cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.recharge-amount-card strong { display: block; font-size: 30px; font-weight: 800; }
.recharge-amount-card span { display: block; margin-top: 8px; font-size: 12px; color: var(--ui-text-muted); }
.recharge-amount-card.selected { border: 2px solid var(--ui-primary); box-shadow: 0 0 0 3px var(--ui-focus-ring); }
.recharge-limits { display: flex; gap: 28px; padding: 16px 20px; border-radius: 10px; background: var(--ui-warning-soft); color: var(--ui-text); font-size: 13px; line-height: 1.6; }
.custom-amount { display: flex; gap: 12px; align-items: end; margin: 16px 0 20px; }
.custom-amount label { display: grid; gap: 8px; font-size: 12px; font-weight: 700; }
.custom-amount input { width: 180px; height: 42px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-1); color: var(--ui-text); padding: 0 12px; }
.network-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 20px 0; }
.network-tabs button { display: flex; align-items: center; gap: 12px; padding: 14px; min-height: 68px; border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-surface-1); color: var(--ui-text); text-align: left; }
.network-tabs button.active { border-color: var(--ui-primary); background: var(--ui-primary-soft); }
.network-tabs strong, .network-tabs small { display: block; }
.network-tabs small { color: var(--ui-text-muted); margin-top: 3px; }
.recharge-workspace { display: grid; grid-template-columns: 224px minmax(0, 1fr) 248px; grid-template-areas: "qr transfer steps"; align-items: stretch; gap: 24px; padding: 24px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-2); }
.recharge-qr-panel { grid-area: qr; }
.recharge-transfer-panel { grid-area: transfer; }
.recharge-steps { grid-area: steps; }
.recharge-qr-panel { display: grid; align-content: center; justify-items: center; gap: 12px; padding: 14px; border: 1px solid var(--ui-border); border-radius: 10px; background: white; }
.recharge-qr-panel img { width: 100%; height: 100%; object-fit: contain; }
@container recharge-page (max-width:1400px) {
  .recharge-workspace { grid-template-columns: minmax(176px,224px) minmax(0,1fr); grid-template-areas: "steps steps" "qr transfer"; gap: 16px; padding: 16px; }
  .recharge-steps ol { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
.recharge-transfer-panel { padding: 20px; border: 1px solid var(--ui-border); border-radius: 10px; background: var(--ui-surface-1); }
.recharge-address-box { display: flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-surface-2); }
.recharge-address-box { min-height: 76px; padding: 16px 18px; }
.recharge-address-box code { flex: 1; overflow-wrap: anywhere; font-size: 18px; font-weight: 700; line-height: 1.7; }
.recharge-address-box button { min-height: 42px; font-size: 14px; font-weight: 700; }
.recharge-address-box button { flex: none; border: 0; background: transparent; color: var(--ui-primary); cursor: pointer; }
.crypto-amount { display: flex; align-items: baseline; gap: 9px; margin: 16px 0; }
.crypto-amount strong { color: var(--ui-primary); font-size: 27px; }
.crypto-amount span { color: var(--ui-text-muted); }
.hash-form { display: grid; gap: 8px; margin-top: 18px; }
.hash-form label { font-size: 12px; font-weight: 700; }
.hash-form input { min-width: 0; height: 42px; padding: 0 12px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-surface-1); color: var(--ui-text); }
.status-pill { display: inline-flex; padding: 4px 9px; border-radius: 20px; background: var(--ui-primary-soft); color: var(--ui-primary); font-size: 12px; font-weight: 750; }
.status-pill.CREDITED, .status-pill.COMPLETED { background: var(--ui-success-soft); color: var(--ui-success); }
.data-panel { margin-top: 20px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-1); overflow: hidden; }
.data-panel>header { padding: 16px 20px; border-bottom: 1px solid var(--ui-border); }
.data-panel h2 { margin: 0; font-size: 17px; }
.data-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.data-table th, .data-table td { padding: 13px 16px; border-bottom: 1px solid var(--ui-border); text-align: left; }
.data-table th { color: var(--ui-text-muted); background: var(--ui-surface-2); font-size: 12px; }
.table-scroll { overflow-x: auto; }
.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 32px 16px; background: var(--ui-page); }
.auth-card { width: min(100%, 440px); padding: 34px; border: 1px solid var(--ui-border); border-radius: 16px; background: var(--ui-surface-1); box-shadow: var(--ui-shadow-md); }
.auth-card h1 { margin: 0 0 7px; font-size: 25px; color: var(--ui-text-strong); }
.auth-subtitle { margin: 0 0 25px; color: var(--ui-text-muted); font-size: 13px; line-height: 1.6; }
.auth-form { display: grid; gap: 17px; }
.auth-form label { display: grid; gap: 7px; color: var(--ui-text); font-size: 13px; font-weight: 650; }
.auth-form input { width: 100%; height: 46px; padding: 0 13px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-1); color: var(--ui-text); }
.auth-submit { width: 100%; min-height: 46px; margin-top: 4px; }
.auth-footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 22px; color: var(--ui-text-muted); font-size: 13px; }
.auth-footer a { color: var(--ui-primary); font-weight: 700; }
.auth-top { display: flex; justify-content: flex-end; margin-bottom: 14px; }
.bb-auth-page .user-auth-brand { display: inline-flex; align-items: center; gap: 10px; }
.bb-auth-page .user-auth-brand .brand-mark { width: auto; height: 42px; }
.bb-auth-page .user-auth-brand .brand-text { font-size: 24px; }
.bb-auth-page .auth-switch a { color: var(--ui-primary); font-weight: 750; }
.modal-backdrop { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 20px; background: rgba(12, 22, 42, .58); }
.modal-card { width: min(100%, 440px); padding: 28px; border-radius: 16px; border: 1px solid var(--ui-border); background: var(--ui-surface-1); box-shadow: var(--ui-shadow-lg); }
.modal-card h2 { margin: 0 0 10px; color: var(--ui-text-strong); }
.modal-card p { color: var(--ui-text-muted); line-height: 1.65; }
.modal-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 20px; }
.toast { position: fixed; left: 50%; bottom: 28px; z-index: 1200; transform: translateX(-50%); padding: 12px 18px; border-radius: 9px; background: var(--ui-text-strong); color: var(--ui-surface-1); font-size: 13px; box-shadow: var(--ui-shadow-lg); }
@media (max-width: 1100px) {
  .brand-text { font-size: 17px; }
  .commerce-header .brand-text { font-size: 20px; }
}
@media (max-width: 780px) {
  body:has(.commerce-header) { padding-top: 112px; }
  .commerce-actions { margin-left: auto; }
  .wallet-summary-copy, .account-trigger-copy { display: none; }
  .notification-trigger, .theme-switcher, .cart-shortcut { width: 40px; height: 40px; min-width: 40px; min-height: 40px; }
  .account-trigger { padding: 2px !important; }
  .wallet-summary { padding: 2px !important; }
  .auth-entry .auth-link:first-child { display: none; }
  .auth-link { padding: 0 10px; font-size: 11px; }
  .region-switcher { grid-template-columns: 1fr !important; }
  .cart-summary { grid-template-columns: 1fr 1fr; }
  .cart-summary>div:last-child { grid-column: 1 / -1; }
  .cart-actions { justify-content: stretch; flex-wrap: wrap; }
  .cart-actions .app-button { flex: 1; }
  .recharge-amounts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .recharge-workspace { grid-template-columns: 1fr; grid-template-areas: "steps" "qr" "transfer"; padding: 14px; }
  .recharge-limits { flex-direction: column; gap: 4px; }
  .cursor-pagination, .cursor-controls { width: 100%; }
  .cursor-controls { align-items: stretch; }
  .cursor-page-size { align-self: stretch; justify-content: space-between; }
  .cursor-pagination nav button { min-height: 44px; }
  .basic-preview { gap: 4px 6px; }
  .presence-preview { gap: 5px !important; }
  .data-table { min-width: 680px; }
}

.admin-dashboard { display: grid; gap: 18px; }
.admin-tabs { display: flex; flex-wrap: wrap; gap: 4px; padding: 5px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-1); }
.admin-tabs a { flex: 1; min-width: 105px; padding: 10px 14px; border-radius: 8px; color: var(--ui-text-muted); font-size: 13px; font-weight: 700; text-align: center; }
.admin-tabs a.active { background: var(--ui-primary-soft); color: var(--ui-primary); }
.admin-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.admin-metric { display: grid; gap: 8px; padding: 18px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-1); }
.admin-metric span { color: var(--ui-text-muted); font-size: 12px; font-weight: 650; }
.admin-metric strong { color: var(--ui-text-strong); font-size: 23px; }
.admin-filters { display: flex; flex-wrap: wrap; gap: 10px; padding: 14px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-1); }
.admin-filters input { flex: 1; min-width: 220px; height: 42px; padding: 0 12px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-surface-1); color: var(--ui-text); }
.admin-filters select { height: 42px; padding: 0 10px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-surface-1); color: var(--ui-text); }
.admin-table th, .admin-table td { vertical-align: middle; }
.admin-table .app-button { min-height: 32px; padding: 5px 9px; font-size: 11px; }
.admin-subline { display: block; max-width: 240px; margin-top: 4px; color: var(--ui-text-muted); font-size: 10px; }
.hash-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--ui-font-mono); }
.audit-detail { display: block; max-width: 380px; overflow-wrap: anywhere; font-size: 11px; white-space: normal; }
.admin-pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; color: var(--ui-text-muted); font-size: 12px; }
.admin-pagination > div { display: flex; gap: 8px; }
.admin-reason { display: grid; gap: 8px; margin-top: 16px; color: var(--ui-text); font-size: 13px; font-weight: 700; }
.admin-reason textarea { width: 100%; resize: vertical; padding: 10px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-surface-1); color: var(--ui-text); }
.admin-mode-note { margin: 0; padding: 10px 14px; border-radius: 9px; background: var(--ui-warning-soft); color: var(--ui-text); font-size: 12px; }
.cart-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 16px; padding: 12px 16px; border: 1px solid var(--ui-border); border-radius: 12px; background: var(--ui-surface-1); }
.cart-toolbar label { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; }
.cart-toolbar > span { flex: 1; color: var(--ui-text-muted); font-size: 12px; }
.cart-toolbar input, .cart-group-table input { width: 17px; height: 17px; accent-color: var(--ui-primary); }
.cart-status-banner { margin-bottom: 16px; }
@media (max-width: 1100px) { .admin-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 780px) { .admin-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .admin-tabs a { min-width: 82px; padding: 9px 6px; } .admin-filters input { min-width: 160px; } }