/* Crisp, rounded controls and a brighter visual language for interactive icons. */
.btn {
  position: relative;
  border-radius: 13px;
  border-color: #9b88ff;
  background: linear-gradient(128deg, #947cff 0%, #755ce8 60%, #5a66dc 100%);
  box-shadow: 0 6px 18px #634ee325, inset 0 1px 0 #ffffff2b;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.1) saturate(1.08);
  box-shadow: 0 10px 25px #6957e43b, inset 0 1px 0 #ffffff40;
}
.btn:active { transform: translateY(0) scale(.985); }
.btn.secondary {
  border-radius: 12px;
  background: linear-gradient(135deg, #ffffff0a, #a78bfa0a);
  border-color: #bda8ff38;
  box-shadow: inset 0 1px 0 #ffffff0c;
}
.btn.secondary:hover { border-color: #bda8ff9c; background: #a78bfa15; }
.btn.danger { border-radius: 12px; box-shadow: inset 0 1px 0 #ffffff0b; }
.btn svg.color-icon { width: 17px; height: 17px; filter: drop-shadow(0 1px 4px #91e8d92e); }
.btn.small { border-radius: 11px; }
.btn:focus-visible, .icon-btn:focus-visible, .tab:focus-visible { outline: 2px solid #8de9de; outline-offset: 3px; }
.btn.busy { opacity: .88; }
.btn.busy:after {
  width: 13px; height: 13px; margin-left: 2px;
  border: 2px solid #ffffff45; border-top-color: #dffdf8; border-right-color: #c9b8ff;
  box-shadow: 0 0 10px #b8a4ff66;
}
.status.approved, .status.started, .status.in_progress, .status.almost_completed {
  background: linear-gradient(100deg, #75e4d014, #9e8aff1b);
  color: #a8e6dc;
}
.status.approved { color: #83d9b4; }
.status.started { color: #8edbc9; }
.status.almost_completed { color: #b9adff; }
.status.banned, .status.refunded { background: #f28dcb16; color: #f19acb; }
.status.protected { background: #63e4cf12; color: #8bd8c9; }
.manual-stage-strip, .ai-queue-chips { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0 18px; }
.manual-stage-strip span, .ai-queue-chips span {
  display: flex; align-items: center; gap: 8px; padding: 7px 10px;
  border: 1px solid #a78bfa25; border-radius: 11px;
  background: linear-gradient(135deg, #9b7cff0b, #61dcca08);
  color: #a99abb; font-size: 10px;
}
.manual-stage-strip strong, .ai-queue-chips b { color: #d9c9ff; font-size: 12px; }
.order-timeline { display: grid; gap: 8px; margin: 14px 0 20px; }
.order-timeline > div { display: grid; grid-template-columns: auto 1fr; gap: 7px 10px; align-items: center; padding: 9px 11px; border: 1px solid #ffffff0c; border-radius: 10px; background: #ffffff03; }
.order-timeline small { color: #a39ab2; font-size: 10px; white-space: normal; }
.payment-details-row { display: flex; align-items: stretch; gap: 9px; margin-bottom: 18px; }
.payment-details-row .notice { display: flex; align-items: center; min-width: 0; flex: 1; margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.payment-copy-button { align-self: stretch; flex-shrink: 0; }
.payment-copy-button[hidden] { display: none; }
.service-progress { display: grid; grid-template-columns: minmax(85px, 1fr) auto; gap: 7px 10px; align-items: center; margin-top: 12px; }
.service-progress-track { height: 6px; overflow: hidden; border-radius: 99px; background: #a78bfa1c; }
.service-progress-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #62e5ce, #9280ff 58%, #ea8bc7); transition: width .45s ease; }
.service-progress > small { color: #b4a6c6; font-size: 9px; white-space: nowrap; }
.service-order-note { grid-column: 1 / -1; margin: 0; }
.service-progress-detail { grid-template-columns: minmax(100px, 1fr) auto; padding: 15px; border: 1px solid #a98bff20; border-radius: 13px; background: #9479ff08; margin: 14px 0; }
.service-progress-detail p { grid-column: 1 / -1; margin: 0; font-size: 11px; }
.service-timeline { margin: 17px 0; }
.service-timeline h3 { margin: 0 0 9px; font-size: 13px; }
.service-timeline article { display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; padding: 10px 0; border-bottom: 1px solid #ffffff0c; }
.service-timeline time { justify-self: end; color: #90859d; font-size: 9px; }
.service-timeline p { grid-column: 1 / -1; margin: 0; color: #b8aec6; font-size: 10px; }
.account-suspended-notice { max-width: 980px; margin: 0 auto 16px; border-color: #f08fb94d; color: #edb0ca; }
.account-suspended-notice a { text-decoration: underline; text-underline-offset: 2px; }
.ai-ops-snapshot { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin: 18px 0 8px; }
.ai-ops-snapshot > div { padding: 12px 14px; border: 1px solid #aa8bf52c; border-radius: 13px; background: linear-gradient(135deg, #8e76f210, #62dfd00b 70%, #ec8cc30a); }
.ai-ops-snapshot small { display: block; color: #a698b9; font-size: 9px; letter-spacing: .35px; }
.ai-ops-snapshot strong { display: block; margin-top: 5px; color: #e5d9ff; font-size: 21px; font-variant-numeric: tabular-nums; }
.ai-privacy-note { max-width: 900px; margin: 10px 0 0; color: #9d91ac; font-size: 10px; line-height: 1.7; }
.boot { min-height: 100vh; background: radial-gradient(ellipse at 50% 38%, #643aa12b, transparent 43%), #0c0f19; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; color: #efe8ff; }
.boot-orbit { position: relative; width: 90px; height: 90px; display: grid; place-items: center; margin-bottom: 5px; }
.boot-orbit img { position: relative; z-index: 2; width: 45px; height: 45px; filter: drop-shadow(0 0 14px #ab8cff80); }
.boot-orbit span { position: absolute; inset: 1px; border: 1px solid #a58cff3b; border-radius: 50%; animation: boot-orbit 2.7s linear infinite; }
.boot-orbit span:nth-child(2) { inset: 11px; border-color: #60dfd04b; border-style: dashed; animation-direction: reverse; animation-duration: 4s; }
.boot strong { font-size: 13px; font-weight: 650; letter-spacing: .2px; }
.boot small { color: #aa9cbd; font-size: 10px; }
.boot-progress { width: 150px; height: 3px; margin-top: 9px; overflow: hidden; border-radius: 10px; background: #ffffff12; }
.boot-progress i { display: block; width: 42%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #61e1d0, #927bff, #e58bc4); animation: boot-loading 1.65s ease-in-out infinite; }
@keyframes boot-orbit { to { transform: rotate(360deg); } }
@keyframes boot-loading { 0% { transform: translateX(-115%); } 65%, 100% { transform: translateX(260%); } }
@media (max-width: 760px) {
  .payment-details-row { align-items: stretch; gap: 7px; }
  .payment-copy-button { padding-inline: 10px; font-size: 9px; white-space: normal; }
  .ai-ops-snapshot { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .manual-stage-strip span { font-size: 9px; }
  .manual-stage-strip { gap: 6px; }
  .order-timeline > div { grid-template-columns: 1fr; }
  .order-timeline small { grid-column: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .boot-orbit span, .boot-progress i, .service-progress-track i { animation: none !important; transition: none !important; }
  .boot-progress i { width: 100%; opacity: .75; }
}

/* Responsive top bar: search gets its own full-width row instead of being clipped. */
@media (min-width: 761px) and (max-width: 1050px) {
  .topbar { gap: 12px; padding-inline: 18px; }
  .topbar .header-search { flex: 1 1 190px; width: auto; min-width: 150px; max-width: none; }
  .top-actions { gap: 7px; }
  .top-actions .btn { padding-inline: 10px; }
  .breadcrumb { min-width: 0; white-space: nowrap; }
}
@media (max-width: 760px) {
  .topbar {
    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    grid-template-areas: "menu crumb actions" "search search search";
    align-items: center;
    align-content: center;
    height: auto !important;
    min-height: 104px;
    padding: 10px 14px !important;
    gap: 8px 10px !important;
    overflow: visible !important;
  }
  .topbar .mobile-toggle { grid-area: menu; display: grid !important; }
  .topbar .breadcrumb { grid-area: crumb; min-width: 0; max-width: 100%; }
  .topbar .top-actions { grid-area: actions; min-width: 0; max-width: 100%; gap: 3px; }
  .topbar .top-actions .icon-btn { width: 30px; min-width: 30px; padding: 5px; }
  .topbar .top-actions .btn { max-width: 105px; min-width: 0; padding: 6px 8px; font-size: 9px; overflow: hidden; text-overflow: ellipsis; }
  .topbar .header-search {
    display: flex !important;
    grid-area: search;
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    height: 40px;
    min-height: 40px;
    margin: 0 !important;
    flex: none !important;
  }
  .topbar .header-search input { min-width: 0; }
}

/* Airy product filters: no glued-together tabs or controls. */
.catalog-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(150px, auto); gap: 12px; align-items: center; }
.catalog-toolbar .tabs { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.catalog-toolbar .tab { flex: 0 0 auto; min-height: 38px; padding: 8px 13px; white-space: nowrap; }
.catalog-toolbar .sort-select { min-width: 165px; max-width: 100%; }
.collection-controls { align-items: center; gap: 9px; }
.collection-controls .toggle-pill { min-height: 40px; padding: 8px 14px; gap: 8px; }
.collection-controls .text-link { margin-left: auto; min-height: 40px; padding: 8px 12px; border-radius: 11px; }
@media (max-width: 760px) {
  .catalog-toolbar { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px; }
  .catalog-toolbar .tabs { gap: 7px; }
  .catalog-toolbar .tab { min-height: 38px; padding: 8px 11px; }
  .catalog-toolbar .sort-select { width: 100%; min-height: 42px; }
  .collection-controls { display: flex; gap: 8px; }
  .collection-controls .toggle-pill { flex: 1 1 auto; justify-content: center; }
  .collection-controls .text-link { flex: 1 0 100%; justify-content: center; margin-left: 0; }
}

/* White theme: keep the search surface and its input consistently light. */
[data-theme="white"] .search-field {
  background: #fff !important;
  border: 1px solid #d7dfea !important;
  border-radius: 12px;
  box-shadow: 0 5px 18px rgba(35, 50, 80, .06);
  overflow: hidden;
}
[data-theme="white"] .search-field > svg { color: #64748b !important; }
[data-theme="white"] .search-field input#catalog-search {
  background: transparent !important;
  border: 0 !important;
  color: #152238 !important;
  box-shadow: none !important;
}
[data-theme="white"] .search-field input#catalog-search::placeholder { color: #718096 !important; }
[data-theme="white"] .topbar .header-search {
  background: #fff !important;
  border-color: #d7dfea !important;
  color: #64748b !important;
}
[data-theme="white"] .topbar .header-search input {
  background: transparent !important;
  border: 0 !important;
  color: #152238 !important;
}
[data-theme="white"] .topbar .header-search input::placeholder { color: #718096 !important; }
[data-theme="white"] .topbar .header-search kbd { border-color: #cbd5e1 !important; color: #64748b !important; }
[data-theme="white"] .catalog-toolbar,
[data-theme="white"] .collection-controls .toggle-pill {
  background: #fff !important;
  border-color: #dce3ed !important;
  color: #334155 !important;
}
[data-theme="white"] .catalog-toolbar .tab {
  background: #f7f9fc !important;
  border-color: #e0e7f0 !important;
  color: #475569 !important;
}
[data-theme="white"] .catalog-toolbar .tab.active {
  background: linear-gradient(135deg, #6255dc, #5147c8) !important;
  border-color: #6255dc !important;
  color: #fff !important;
}
[data-theme="white"] .catalog-toolbar .sort-select {
  background: #fff !important;
  border-color: #d5deea !important;
  color: #1e293b !important;
}
[data-theme="white"] .collection-controls .toggle-pill.on {
  background: #eef2ff !important;
  border-color: #c7d2fe !important;
  color: #4338ca !important;
}
[data-theme="white"] .collection-controls .text-link { color: #4f46c8 !important; }

/* Sharper brand artwork with a soft, restrained brand-color halo. */
.product-art { position: relative; isolation: isolate; overflow: hidden; }
.product-art::before {
  content: ""; position: absolute; inset: 18% 27%; z-index: 0; border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, currentColor 22%, transparent), transparent 72%);
  filter: blur(12px); opacity: .9; pointer-events: none; transition: transform .3s ease, opacity .3s ease;
}
.product-art .brand-svg {
  position: relative; z-index: 1; width: 58px; height: 58px;
  filter: drop-shadow(0 9px 15px rgba(5, 8, 20, .3));
  transition: transform .28s cubic-bezier(.2,.8,.2,1), filter .28s ease;
}
.product-art .generic-product-mark {
  position: relative; z-index: 1; filter: drop-shadow(0 10px 18px rgba(5, 8, 20, .3));
  transition: transform .28s cubic-bezier(.2,.8,.2,1), filter .28s ease;
}
.product:hover .product-art .brand-svg,
.product:hover .product-art .generic-product-mark { transform: translateY(-3px) scale(1.07); filter: drop-shadow(0 12px 18px rgba(5, 8, 20, .34)); }
.product:hover .product-art::before { transform: scale(1.22); opacity: 1; }
[data-theme="white"] .product-art { background: radial-gradient(circle at 50% 45%, #eef2ff, #f7f9ff 60%, #f1f5f9) !important; }
[data-theme="white"] .product-art::before { background: radial-gradient(circle, color-mix(in srgb, currentColor 14%, transparent), transparent 72%); }

.markup-example-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 12px; margin: 12px 0; align-items: center; }
.markup-example-grid > :nth-child(-n+3) { color: var(--muted); font-size: 10px; font-weight: 650; }
.markup-example-grid strong, .markup-example-grid span { font-variant-numeric: tabular-nums; font-size: 11px; }
.markup-example-grid small { color: var(--muted); font-size: 9px; }
.markup-example-error { display: block; margin: 10px 0; color: #f0a6ba; font-size: 10px; }
#f-platform_margin_tiers, #f-api_margin_tiers { min-height: 152px; font-family: var(--font-mono, monospace); font-size: 11px; line-height: 1.65; }
[data-theme="white"] .markup-example-grid > :nth-child(-n+3) { color: #64748b; }
[data-theme="white"] .markup-example-grid small { color: #64748b; }
@media (max-width: 560px) {
  .markup-example-grid { gap: 8px; }
  .markup-example-grid strong, .markup-example-grid span { font-size: 9px; }
  .markup-example-grid small { display: block; }
}
@media (prefers-reduced-motion: reduce) {
  .product-art::before, .product-art .brand-svg, .product-art .generic-product-mark { transition: none !important; }
}

/* Global overflow protection, offline banner controls, and mobile Admin console polish */
.workspace, .content, .admin-workspace, .operator-workspace, .admin-two-col > *, .split > *, .panel {
  min-width: 0;
  max-width: 100%;
}
.split {
  align-items: start;
}
.payment-copy-button {
  align-self: flex-start;
}
.stat .wallet-precision-note svg {
  float: none !important;
  width: 13px !important;
  height: 13px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
.offline-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.offline-notice > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 200px;
}

@media (max-width: 760px) {
  html, body {
    overflow-x: hidden;
  }
  .topbar .top-actions .quick-search {
    display: none !important;
  }
  .topbar .breadcrumb {
    font-size: 11px;
    gap: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .section-title {
    flex-wrap: wrap;
    gap: 10px;
  }
  .admin-workspace .page-heading {
    flex-wrap: wrap;
    gap: 10px;
    align-items: flex-start;
  }
  .admin-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    overflow-x: visible !important;
    gap: 6px !important;
    padding: 8px !important;
    max-width: 100%;
  }
  .admin-tabs .tab {
    flex: 1 1 calc(33.333% - 6px);
    justify-content: center;
    text-align: center;
    padding: 8px 8px !important;
    font-size: 11px !important;
    min-height: 36px;
    white-space: nowrap;
  }
  .admin-context-bar {
    flex-direction: column;
    align-items: stretch !important;
    gap: 10px;
    padding: 12px 14px !important;
  }
  .admin-context-bar > span {
    flex-wrap: wrap;
    font-size: 11px;
  }
  .admin-context-bar > div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
  }
  .admin-context-bar > div > * {
    flex: 1 1 auto;
    justify-content: center;
  }
  .admin-welcome {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 14px;
    padding: 20px 18px !important;
  }
  .admin-welcome .btn {
    width: 100%;
  }
  .operator-strip {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .operator-workspace, .admin-two-col {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .operator-task {
    flex-wrap: wrap;
    gap: 8px;
  }
  .workload-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .analytics-header-controls {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 10px;
  }
  .analytics-range-selector {
    width: 100%;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .analytics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .export-buttons-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .export-buttons-row > * {
    flex: 1 1 100%;
    justify-content: center;
  }
  .admin-live-monitor-bar {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 10px;
  }
  .live-monitor-controls {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .live-monitor-controls > * {
    flex: 1 1 auto;
  }
  .ai-copilot-header {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 10px;
  }
  .ai-input-row {
    flex-direction: column;
    gap: 8px;
  }
  .ai-input-row .btn, .ai-connection-actions .btn {
    width: 100%;
  }
  .data-toolbar {
    flex-direction: column;
    align-items: stretch !important;
    gap: 8px;
  }
  .data-search {
    max-width: none !important;
    width: 100% !important;
  }
  .data-tools {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .data-tools > * {
    flex: 1 1 auto;
  }
  .data-pagination {
    flex-direction: column;
    align-items: stretch !important;
    gap: 8px;
  }
  .data-pagination > div {
    justify-content: space-between;
    width: 100%;
  }
  .sync-counts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .payment-details-row {
    flex-direction: column;
  }
  .payment-copy-button {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .stats, .workload-grid, .analytics-grid {
    grid-template-columns: 1fr !important;
  }
  .admin-tabs .tab {
    flex: 1 1 calc(50% - 6px);
  }
}

/* =========================================================
   GLOBAL CHECKBOX / RADIO & SUPPORT FORM LAYOUT FIXES
   ========================================================= */
input[type="checkbox"],
input[type="radio"] {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  padding: 0 !important;
  margin: 0;
  border-radius: 5px;
  accent-color: #8b78ff;
  cursor: pointer;
  flex: 0 0 18px;
  vertical-align: middle;
}

.form-note,
small.form-note,
.ai-consent-note,
.field-hint {
  display: block;
  line-height: 1.6;
}

.support-split {
  align-items: start;
}

.support-form-panel,
.support-list-panel {
  min-width: 0;
}

.ai-consent-box {
  margin: 14px 0 16px;
  padding: 14px 16px;
  border-radius: 14px;
  background: rgba(168, 85, 247, 0.08);
  border: 1px solid rgba(168, 85, 247, 0.28);
}

.ai-consent-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 8px 0;
  cursor: pointer;
  line-height: 1.4;
}

.ai-consent-label strong {
  font-size: 13.5px;
}

.ai-consent-box .ai-consent-note {
  margin: 0 !important;
  font-size: 12px;
  color: var(--muted, #949ec0);
}

.support-submit-btn {
  margin-top: 6px;
  width: 100%;
  justify-content: center;
}

.support-ticket-item {
  align-items: flex-start;
  gap: 14px;
  flex-wrap: wrap;
}

.support-ticket-info h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  overflow-wrap: anywhere;
  line-height: 1.4;
  margin-bottom: 6px;
}

.support-ticket-info p {
  overflow-wrap: anywhere;
  margin: 4px 0 0;
  line-height: 1.5;
}


/* HxH Store verification, remembered-login and mail-routing polish */
.verification-choice-panel{
  margin-top:14px;
  padding:16px;
  border:1px solid rgba(164,112,255,.26);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(124,58,237,.10),rgba(20,15,36,.42));
}
.verification-choice-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.verification-choice-heading strong{font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.verification-choice-heading small{color:#9b8fb4;font-size:10px}
.verification-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.verification-choice-card{position:relative;display:flex;align-items:flex-start;gap:12px;padding:14px;border:1px solid #33264d;border-radius:15px;background:#120c1f;cursor:pointer;transition:.2s ease}
.verification-choice-card:hover{transform:translateY(-1px);border-color:#7045a8;background:#171024}
.verification-choice-card:has(input:checked){border-color:#a46cff;box-shadow:0 0 0 1px rgba(164,108,255,.25),0 12px 30px rgba(103,42,162,.16);background:linear-gradient(150deg,rgba(124,58,237,.20),rgba(24,15,40,.86))}
.verification-choice-card input{position:absolute;opacity:0;pointer-events:none}
.verification-choice-card span{display:flex;flex-direction:column;gap:5px;min-width:0}
.verification-choice-card strong{font-size:12px;color:#fff}
.verification-choice-card small{font-size:10px;line-height:1.55;color:#9e91b7}
.auth-remember-field{margin-top:12px}
.remember-me-label{display:flex;align-items:flex-start;gap:10px;cursor:pointer;user-select:none;padding:11px 12px;border:1px solid #2d2540;border-radius:13px;background:rgba(255,255,255,.025)}
.remember-me-label input{width:17px!important;height:17px!important;min-width:17px;margin:2px 0 0;accent-color:#9b64ff}
.remember-me-label span{display:flex;flex-direction:column;gap:3px}
.remember-me-label strong{font-size:11px;color:#e9e3f4}
.remember-me-label small{font-size:9px;color:#8e829f;line-height:1.45}
.verification-benefit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:12px}
.verification-benefit-row{display:flex;gap:9px;align-items:flex-start;padding:11px 12px;border:1px solid #2c2440;border-radius:13px;background:rgba(12,9,20,.36)}
.verification-benefit-row b{font-size:11px;color:#e9e3f4}
.verification-benefit-row small{display:block;margin-top:3px;font-size:9px;color:#8d829e;line-height:1.45}
.verification-page-panel{border:1px solid rgba(156,101,255,.24);background:linear-gradient(160deg,rgba(72,37,119,.18),rgba(10,7,18,.48));border-radius:22px;padding:20px;margin:0 0 16px}
.otp-stage{position:relative;overflow:hidden;border-radius:20px;border:1px solid rgba(175,121,255,.23);background:radial-gradient(circle at 50% -20%,rgba(149,86,246,.26),transparent 58%),linear-gradient(145deg,#140c22,#0b0812);padding:18px}
.otp-stage:before{content:"";position:absolute;inset:-40%;background:conic-gradient(from 180deg,transparent,rgba(167,110,255,.08),transparent 28%);animation:otpOrbit 8s linear infinite;pointer-events:none}
.otp-stage-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.otp-stage-head strong{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#ece6f7}
.otp-stage-head small{font-size:9px;color:#8e819f}
.otp-random-display{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;min-height:53px;align-items:center}
.otp-random-chip{min-width:0;height:44px;display:grid;place-items:center;border-radius:12px;border:1px solid rgba(169,110,255,.25);background:rgba(23,14,39,.88);font:800 11px/1 "Space Grotesk",ui-monospace,monospace;color:#d6c4f6;letter-spacing:.06em;box-shadow:0 8px 24px rgba(0,0,0,.22);opacity:.72}
.otp-random-chip.is-live{animation:otpCodeFlip 1.6s ease-in-out}
.otp-digit-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:14px}
.otp-digit{width:100%!important;min-width:0!important;height:60px!important;padding:0!important;text-align:center;font:900 22px/1 "Space Grotesk",ui-monospace,monospace!important;letter-spacing:0!important;border-radius:14px!important;border:1px solid #35294c!important;background:#0d0916!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
.otp-digit:focus{border-color:#a76bff!important;box-shadow:0 0 0 3px rgba(167,107,255,.13),0 10px 26px rgba(86,35,130,.18)!important}
.verification-timing-warning{display:flex;gap:11px;align-items:flex-start;margin:13px 0;padding:13px 14px;border:1px solid rgba(255,184,77,.28);background:linear-gradient(145deg,rgba(94,58,16,.24),rgba(39,25,10,.16));border-radius:14px;color:#d7c8ae;font-size:10px;line-height:1.6}.verification-timing-warning>.color-icon{width:18px;height:18px;min-width:18px;margin-top:1px}.verification-timing-warning div{display:flex;flex-direction:column;gap:3px}.verification-timing-warning strong{color:#ffe1a5;font-size:11px}.verification-timing-warning b{color:#fff0c9}.verification-timing-warning span{display:block}.email-security-note{margin-top:12px;padding:12px 14px;border:1px solid rgba(99,228,207,.16);background:rgba(99,228,207,.04);border-radius:13px;color:#a49ab0;font-size:10px;line-height:1.6}
.email-security-note strong{color:#c5fff3;margin-right:6px}
.sender-profile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}
.sender-profile-card{padding:14px;border:1px solid #352849;border-radius:15px;background:rgba(15,10,26,.46)}
.sender-profile-card>div:first-child{display:flex;flex-direction:column;gap:4px;margin-bottom:11px}
.sender-profile-card>div:first-child strong{font-size:11px;color:#efe8fb}
.sender-profile-card>div:first-child small{font-size:9px;color:#8f839e;line-height:1.45}
.sender-profile-card .form-grid{grid-template-columns:1fr}
.product-verification-fee{display:block!important;margin-top:3px;color:#d1a8ff!important;font-size:9px!important;font-weight:700}
.verification-status-card{display:flex;align-items:center;gap:13px;padding:14px 16px;margin:0 0 16px;border-radius:17px;border:1px solid #34264a;background:linear-gradient(145deg,rgba(23,15,38,.8),rgba(12,9,20,.72))}
.verification-status-card.is-verified{border-color:rgba(79,209,178,.3);background:linear-gradient(145deg,rgba(32,91,79,.14),rgba(12,9,20,.72))}
.verification-status-card.is-pending{border-color:rgba(179,113,255,.3);background:linear-gradient(145deg,rgba(104,51,157,.12),rgba(12,9,20,.72))}
.verification-status-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;font-size:17px;background:rgba(148,92,255,.14);color:#b992ff}
.verification-status-card.is-verified .verification-status-icon{background:rgba(74,205,174,.12);color:#7cebd0}
.verification-status-copy{flex:1;min-width:0}
.verification-status-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.verification-status-top strong{font-size:12px;color:#eee7f8}
.verification-status-copy small{display:block;margin-top:4px;color:#91869e;font-size:9px;line-height:1.55}
.verification-status-pill{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;font-size:8px;letter-spacing:.08em;text-transform:uppercase;background:#2a2138;color:#b7abc6}
.verification-status-pill.verified{background:rgba(76,211,175,.12);color:#7debd2}
.verification-status-pill.pending{background:rgba(166,99,255,.13);color:#c9a6ff}
@keyframes otpCodeFlip{0%,100%{transform:translateY(0) scale(1);opacity:.72}25%{transform:translateY(-5px) scale(1.04);opacity:1}55%{transform:translateY(2px) scale(.98);opacity:.85}}
@keyframes otpOrbit{to{transform:rotate(360deg)}}
@media(max-width:760px){
  .verification-choice-grid,.verification-benefit-grid{grid-template-columns:1fr}
  .verification-choice-panel{padding:13px}
  .otp-stage{padding:14px}
  .otp-digit-grid{gap:6px}
  .otp-digit{height:54px!important;font-size:19px!important}
  .otp-random-display{gap:5px}
  .otp-random-chip{height:40px;font-size:9px}
  .sender-profile-grid{grid-template-columns:1fr}
  .sender-profile-card{padding:12px}
}
@media(max-width:400px){
  .otp-digit{height:50px!important;font-size:17px!important}
  .otp-random-pop{width:47px}
  .verification-status-card{align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){.otp-stage:before,.otp-random-chip.is-live{animation:none!important}}

@media(max-width:760px){
  .footer .socials{display:flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0}
  .footer-social{display:inline-flex;align-items:center;justify-content:center}
  .footer .socials svg{width:18px;height:18px}
}

/* ---- Loading polish (no layout/colour changes) ---- */
img[data-brand-logo],.boot-orbit img,svg{shape-rendering:geometricPrecision;text-rendering:optimizeLegibility}
.product-photo{background:#ffffff08}

/* Admin → Add Products workspace */
.admin-api-products-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:14px}.api-product-import-panel .inline-actions{margin-top:14px}.api-product-card{margin:0;padding:17px;min-width:0}.api-product-card .section-title{align-items:flex-start;gap:12px}.api-product-card h3{margin:7px 0 0;font-size:15px}.api-product-card>p{margin:12px 0;color:var(--muted);font-size:11px;word-break:break-word}.api-product-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--muted);font-size:10px}.api-product-meta strong{font-size:16px;color:var(--text)}@media(max-width:1000px){.admin-api-products-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.admin-api-products-grid{grid-template-columns:1fr}.api-product-import-panel .inline-actions{align-items:stretch}.api-product-import-panel .inline-actions select,.api-product-import-panel .inline-actions input{min-width:0!important;width:100%}}
