/* Shared light glass presentation. Opaque text surfaces; no blur or animation cost. */
:root {
  --ink:#1c2943; --muted:#52627c; --blue:#385dbe; --navy:#263c70;
  --line:#d5dff0; --bg:#eaf0fb; --soft:#eaf0ff; --panel:#fffffff0;
  --green:#116b59; --round:22px;
}
body {
  min-height:100vh;
  background:linear-gradient(130deg,#dce7ff 0%,#f1e7f7 60%,#def0ef 100%);
  color:var(--ink);
}
a { text-underline-offset:3px; }
button,.button { border-radius:12px; background:var(--blue); color:#fff; }
button:hover,.button:hover { filter:brightness(.96); }
.button.secondary,button.secondary { background:#fffffff0; border-color:#c4d0e7; color:#294e9d; }
:where(a,button,input,select,textarea,summary):focus-visible {
  outline:3px solid #385dbe; outline-offset:3px;
}
.site-header,.management-header { background:#f8faff; isolation:isolate; border-bottom:1px solid #dbe4f4; box-shadow:0 4px 24px #46669b08; }
.brand { color:#243e77; }
.brand-mark { background:#385dbe; border-radius:14px; box-shadow:0 4px 12px #385dbe1a; }
.brand small { color:#52627c; letter-spacing:1px; }
.topnav a,.management-shell .header-end { color:#405575; }
.environment { color:#34518b; background:#e9effc; border-color:#cfdbef; }
.sandbox-bar { background:#edf2fbe8; color:#405778; border-bottom:1px solid #d8e2f1; }
.preview-bar { background:#fff4de; color:#644910; }
.business-quick {
  display:grid; grid-template-columns:repeat(3,minmax(0,220px));
  justify-content:center; gap:10px; padding:12px 24px;
  background:#ffffffd9; border-bottom:1px solid #ffffff;
}
.business-quick a {
  text-align:center; padding:10px 12px; min-width:0; white-space:normal;
  overflow-wrap:anywhere; background:#edf2fc; color:#2e4f94;
  border:1px solid #dce5f6; border-radius:12px; line-height:1.5;
}
.business-quick a:hover,.business-quick a[aria-current=page] { background:#385dbe; border-color:#385dbe; color:white; }
.page-shell { padding-top:30px; }
.catalog-heading { padding:24px 28px; margin-bottom:20px; background:#ffffffb5; border:1px solid #ffffff; border-radius:var(--round); box-shadow:0 10px 30px #46669b0c; }
.catalog-heading h1 { color:#22385f; font-size:28px; letter-spacing:0; margin:0; }
.catalog-heading p { margin:8px 0 0; color:var(--muted); }
.market-sidebar,.management-shell .ops-side {
  background:#ffffffc9; border:1px solid #ffffff; padding:14px 10px;
  border-radius:var(--round); box-shadow:0 8px 24px #4763a309;
}
.sidebar-caption,.ops-side .sidebar-caption { color:#526586; letter-spacing:1px; }
.side-link,.management-shell .ops-side .side-link:not(.active) { color:#435575; }
.side-link.active,.management-shell .ops-side .side-link.active { background:#385dbe; color:#fff; }
.side-link:hover:not(.active),.management-shell .ops-side .side-link:hover:not(.active) { background:#eaf0fc; color:#2b4b8d; }
.sidebar-help { background:#eaf0fa; color:#52627c; }
.sidebar-help strong { color:#314f80; }
:is(.panel,.ops-panel,.supplier-card,.metric-card,.product-card,.business-entry,.recommendation-slot,.card,.auth-panel,.empty-state) {
  background:var(--panel); border:1px solid #ffffff;
  border-radius:var(--round); box-shadow:0 8px 20px #4763a30a;
}
.business-entry { padding:20px; }
.business-entry:hover,.business-entry.selected,.variant-choice.selected { border-color:#8fa8df; box-shadow:0 4px 16px #385dbe0c; }
.business-icon { border-radius:14px; background:#e8efff; color:#385dbe; }
.business-entry.long .business-icon { background:#e8f3f2; color:#166b61; }
.business-entry.short .business-icon { background:#f1eafb; color:#715296; }
.business-entry strong { color:#273e69; }
.business-entry small,.business-entry .entry-count,.slot-purpose,.recommendation-empty { color:#52627c; }
.recommendation-slot { padding:20px; }
.slot-heading a,.recommendation-price,.product-price,.price { color:#3158b7; }
.product-card { overflow:hidden; }
.product-card:hover { border-color:#c2d0ed; box-shadow:0 10px 24px #4763a311; }
.product-image { background:#f5f7fc; border-color:#e1e7f1; }
.search-bar { border-radius:16px; border-color:#c9d5ed; box-shadow:0 4px 16px #4763a308; }
.search-bar button { background:#385dbe; border-radius:11px; }
.service-chip,.search-groups a { background:#ffffffe8; border-color:#d5dff0; color:#3d5378; }
.service-chip.active,.search-groups a:hover { background:#e4ecff; border-color:#b6c8ed; color:#2a4e9c; }
.filters,.ops-toolbar { background:#ffffffbd; border:1px solid #ffffff; border-radius:16px; }
.page-shell :where(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea) {
  background:#fff; color:#243149; border-color:#bbcbe5; border-radius:10px;
}
.page-shell .search-bar input { background:transparent; border:0; }
.search-suggestions,.account-popover { background:#fff; border-color:#cbd7ec; box-shadow:0 12px 35px #354b7720; border-radius:14px; }
.ops-panel-head,.bulk-bar,.inventory-head { background:#f1f5fce8; border-color:#dce4f1; }
.inventory-row { border-color:#e0e7f2; }
.inventory-row:hover { background:#f5f8fe; }
.status-badge,.tag.purple { background:#e8efff; color:#324f96; }
.notice,.purchase-message { background:#fff5df; color:#634916; border:1px solid #ead8b4; border-radius:14px; }
.toast { color:#245c45; background:#edf8f0; border-color:#cce5d4; }
.terms,.secret,.receive-number,.receive-code { background:#f0f5fc; border:1px solid #dce6f3; border-radius:14px; }
.variant-choice { background:#ffffffef; border-color:#d1ddee; border-radius:14px; }
.variant-choice.selected { background:#edf3ff; }
.page-shell details { border-color:#cedbef; border-radius:12px; }
.page-shell details.panel { border-radius:var(--round); }
.ops-mobile-primary,.ops-mobile-menu { background:#ffffffed; border-color:#d5dff0; border-radius:14px; }
.mobile-nav { background:#fffffff5; border-top:1px solid #d3dff0; }
.mobile-nav a { color:#405778; }
.site-footer { color:#4d607f; border-color:#ffffff; font-size:12px; }
.credential,.audit-item { border-color:#dce5f2; }
.display-settings { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:14px 0; }
.display-settings div { padding:14px; border-radius:14px; background:#f0f5ff; min-width:0; overflow-wrap:anywhere; }
.display-settings span { display:block; margin-top:5px; color:#52627c; font-size:12px; }
.capability-audit { font-size:13px; }
/* Legacy routes use the same shell and components. */
.hero { display:grid; grid-template-columns:1.4fr 1fr; gap:24px; margin-bottom:24px; }
.hero-aside { padding:24px; background:#ffffffb5; border:1px solid #fff; border-radius:var(--round); }
.grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.card { padding:22px; min-width:0; }
.card-footer { display:flex; justify-content:space-between; gap:12px; }
@media(max-width:900px) {
  .hero { grid-template-columns:1fr; }
}
@media(max-width:700px) {
  .business-quick { gap:6px; padding:9px 12px; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .business-quick a { padding:9px 4px; font-size:13px; }
  .catalog-heading { padding:20px; margin-bottom:16px; border-radius:20px; }
  .catalog-heading h1 { font-size:24px; }
  .catalog-heading p { font-size:13px; }
  .business-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  .page-shell a.business-entry { display:flex; flex-direction:column; justify-content:center; gap:8px; text-align:center; padding:14px 6px; min-height:86px; border-radius:16px; }
  .business-entry strong { font-size:13px; overflow-wrap:anywhere; }
  .business-entry .entry-count { margin:0; font-size:11px; }
  .business-entry .business-icon,.business-entry small { display:none; }
  .panel,.ops-panel,.supplier-card,.product-card,.recommendation-slot { border-radius:18px; }
  .display-settings { grid-template-columns:1fr; }
  .site-footer { font-size:11px; }
  .grid { grid-template-columns:1fr; }
}
@media(prefers-contrast:more) {
  :root { --panel:#fff; --line:#7186a9; }
  .site-header,.business-quick,.market-sidebar,.ops-side { background:#fff; }
}

/* v29: one category entry and optional filters keep products in the first screen. */
.compact-catalog .catalog-heading { display:block; padding:0; margin:0 0 16px; background:none; border:0; box-shadow:none; }
.compact-catalog .catalog-heading h1 { font-size:28px; line-height:1.4; }
.compact-catalog .catalog-heading p { max-width:760px; font-size:14px; line-height:1.7; margin-top:6px; }
.compact-catalog .business-grid { margin:0 0 16px; gap:10px; }
.compact-catalog .business-entry { padding:14px; border-radius:16px; gap:10px; }
.compact-catalog .business-entry.selected { background:#e5edff; border-color:#91a8da; }
.compact-catalog .catalog-toolbar { margin:0 0 10px; }
.catalog-links { display:flex; gap:16px; font-size:13px; flex-wrap:wrap; }
.compact-catalog .catalog-refine { margin:0 0 16px; background:#ffffffa8; border:1px solid #fff; padding:0; }
.catalog-refine>summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 14px; cursor:pointer; list-style:none; color:#344e7c; }
.catalog-refine>summary::after { content:'＋'; font-size:18px; }
.catalog-refine[open]>summary::after { content:'−'; }
.catalog-refine>summary>span { display:flex; align-items:center; gap:8px; }
.catalog-refine>summary>small { margin-left:auto; color:var(--muted); font-weight:normal; }
.catalog-refine .compact-filters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; border:0; border-top:1px solid var(--line); border-radius:0; background:none; margin:0; padding:14px; }
.compact-filters label { display:flex; flex-direction:column; gap:5px; min-width:0; color:var(--muted); font-size:12px; }
.catalog-refine .compact-filters select { width:100%; max-width:none; min-width:0; font-size:13px; padding:9px; }
.refine-actions { grid-column:1/-1; display:flex; align-items:center; gap:20px; }
@media(max-width:700px) {
  .customer-shell .page-shell { padding-top:20px; }
  .compact-catalog .catalog-heading { margin-bottom:12px; }
  .compact-catalog .catalog-heading h1 { font-size:24px; }
  .compact-catalog .catalog-heading p { font-size:13px; line-height:1.65; }
  .compact-catalog .search-area { margin-bottom:12px; }
  .compact-catalog .business-grid { gap:7px; margin-bottom:14px; }
  .compact-catalog a.business-entry { min-height:68px; padding:10px 4px; gap:5px; }
  .compact-catalog .catalog-toolbar { gap:6px; }
  .catalog-links { font-size:12px; gap:10px; }
  .catalog-refine>summary { padding:10px 12px; font-size:13px; }
  .catalog-refine>summary>small { font-size:11px; }
  .catalog-refine .compact-filters { grid-template-columns:repeat(2,minmax(0,1fr)); padding:12px; }
}

.configuration-records pre{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%;font-size:.82rem;line-height:1.65}
.comparison-summary{margin-top:16px;min-width:0;scroll-margin-top:20px}
.comparison-scroll{overflow-x:auto;border:1px solid #cedbef;border-radius:14px;background:#fff;scroll-padding-inline-start:100px}
.comparison-table{table-layout:fixed;font-size:14px;margin:0;min-width:calc(100px + var(--compare-count)*150px)}
.comparison-table caption{text-align:left;padding:8px 12px;color:var(--muted);background:#f0f5fc;font-size:12px}
.comparison-table :is(th,td){padding:10px 12px;vertical-align:top;text-align:left;border:1px solid #dce5f3;white-space:normal;overflow-wrap:anywhere}
.comparison-table tr>:first-child{position:sticky;left:0;width:100px;background:#edf2fc;z-index:1;font-weight:600}
.comparison-table thead th{background:#f4f7fe;color:#243b62;font-size:15px;font-weight:650}
.comparison-table th small{display:block;color:#405575;font-size:13px;font-weight:500;margin-top:4px}
.comparison-table tbody th{color:#344d72}
.comparison-table [data-compare-prices] strong{color:#294e9d;font-size:17px;white-space:nowrap}
.comparison-table :is(button,.button){width:100%;min-height:44px;padding:8px 4px;white-space:normal;font-size:13px}
.comparison-controls{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:8px;font-size:12px}
.comparison-controls[hidden]{display:none}.comparison-controls button{font-size:12px;padding:8px;min-height:44px}
.comparison-controls button:disabled{opacity:.5;cursor:default}
.comparison-scroll-hint{font-size:12px;color:var(--muted);margin:6px 0}
.comparison-terms{margin-top:22px}.comparison-terms h2{font-size:18px}.comparison-terms p{white-space:pre-wrap;overflow-wrap:anywhere}
.comparison-terms details{background:#ffffffd9}.comparison-terms summary{line-height:1.6}
.copy-feedback{display:block;font-size:13px;color:var(--muted);overflow-wrap:anywhere}.sms-line{flex-wrap:wrap}.receive-number strong{user-select:text;overflow-wrap:anywhere}
/* Match the actual fixed navigation height, including the device safe area. */
:root{--mobile-safe-bottom:env(safe-area-inset-bottom,0px);--mobile-nav-space:calc(64px + var(--mobile-safe-bottom))}
@media(max-width:700px){
  html{scroll-padding-bottom:calc(var(--mobile-nav-height,var(--mobile-nav-space)) + 16px);scroll-padding-top:16px}
  .customer-shell{padding-bottom:calc(var(--mobile-nav-height,var(--mobile-nav-space)) + 16px)}
  .customer-shell .site-footer{padding-bottom:24px}
  .mobile-nav{min-height:var(--mobile-nav-space);padding:8px 12px calc(8px + var(--mobile-safe-bottom))}
  .customer-shell main :is(button,a,input,textarea,summary,[tabindex]){scroll-margin-block:16px}
  .comparison-table{min-width:calc(56px + var(--compare-count)*88px);font-size:12px}
  .comparison-table :is(th,td){padding:7px 5px}
  .comparison-table tr>:first-child{width:56px}
  .comparison-table thead th{font-size:13px}.comparison-table th small{font-size:12px}
  .comparison-table [data-compare-prices] strong{font-size:14px}
  .comparison-scroll{scroll-padding-inline-start:56px}
  .comparison-intro{font-size:13px!important;line-height:1.6;margin-bottom:12px!important}
  .comparison-terms h2{font-size:16px}
}
