:root {
  color-scheme: light;
  --forest: #3478e5;
  --forest-deep: #245fb9;
  --forest-soft: #eef5ff;
  --ink: #19324f;
  --muted: #6d7d91;
  --line: #dce7f5;
  --paper: #ffffff;
  --canvas: #f7faff;
  --danger: #ef493d;
  --danger-bg: #fff1ef;
  --orange: #ff8a34;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* iOS-inspired glass and motion layer. Kept at the end so every portal module
   receives one consistent surface treatment without changing its data layout. */
:root {
  --glass-surface: rgba(255, 255, 255, .72);
  --glass-surface-strong: rgba(255, 255, 255, .86);
  --glass-border: rgba(255, 255, 255, .78);
  --glass-shadow: 0 18px 50px rgba(39, 91, 157, .10), inset 0 1px 0 rgba(255, 255, 255, .9);
  --glass-shadow-hover: 0 24px 64px rgba(39, 91, 157, .16), inset 0 1px 0 rgba(255, 255, 255, .95);
  --ease-spring: cubic-bezier(.22, 1, .36, 1);
}

.portal-body {
  background:
    radial-gradient(circle at 8% 8%, rgba(116, 181, 255, .24), transparent 30rem),
    radial-gradient(circle at 92% 20%, rgba(255, 165, 94, .16), transparent 28rem),
    radial-gradient(circle at 65% 86%, rgba(108, 202, 220, .14), transparent 32rem),
    linear-gradient(145deg, #f4f8ff 0%, #fbfdff 48%, #f8fbff 100%);
  background-attachment: fixed;
}

.portal-body::before {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.26) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.26) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.32), transparent 72%);
}

.portal-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(248, 252, 255, .69);
  border-bottom-color: rgba(255, 255, 255, .82);
  box-shadow: 0 8px 28px rgba(46, 104, 174, .08);
  -webkit-backdrop-filter: blur(24px) saturate(165%);
  backdrop-filter: blur(24px) saturate(165%);
  transition: background .35s ease, box-shadow .35s ease, min-height .35s var(--ease-spring);
}

.portal-header.is-scrolled {
  background: rgba(247, 251, 255, .86);
  box-shadow: 0 12px 34px rgba(46, 104, 174, .14);
}

.portal-nav a {
  transition: color .22s ease, background .22s ease, border-color .22s ease, transform .22s var(--ease-spring);
}

.portal-nav a:hover { background: rgba(255,255,255,.54); transform: translateY(-1px); }
.portal-nav a.active { background: rgba(255,255,255,.7); }

.update-chip,
.period-filter,
.inventory-search,
.metric-card,
.cost-strip,
.table-shell,
.empty-state,
.report-alert,
.dashboard-board,
.inventory-alert-item,
.inventory-alert-empty,
.account-form-card,
.account-list-card,
.shipment-summary,
.shipment-filter,
.shipment-card,
.shipment-form,
.delivery-summary,
.cost-policy,
.delivery-filter,
.delivery-card {
  background-color: var(--glass-surface);
  border-color: var(--glass-border);
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(22px) saturate(145%);
  backdrop-filter: blur(22px) saturate(145%);
}

.live-sales-panel {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 8%, rgba(255,255,255,.2), transparent 34%),
    linear-gradient(135deg, rgba(83,154,244,.96), rgba(52,120,229,.94) 58%, rgba(41,106,203,.96));
  border-color: rgba(255,255,255,.42);
  box-shadow: 0 22px 58px rgba(42, 108, 203, .24), inset 0 1px 0 rgba(255,255,255,.34);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  backdrop-filter: blur(22px) saturate(150%);
}

.live-sales-panel::before {
  position: absolute;
  width: 260px;
  height: 260px;
  top: -175px;
  right: 8%;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  filter: blur(2px);
  content: "";
}

.live-sales-panel > * { position: relative; z-index: 1; }

.metric-card,
.dashboard-board,
.inventory-alert-item,
.shipment-card,
.delivery-card,
.account-form-card,
.account-list-card,
.update-chip {
  transition: transform .38s var(--ease-spring), box-shadow .38s ease, border-color .3s ease;
}

.metric-card:hover,
.dashboard-board:hover,
.inventory-alert-item:hover,
.shipment-card:hover,
.delivery-card:hover,
.account-form-card:hover,
.account-list-card:hover,
.update-chip:hover {
  transform: translateY(-4px) scale(1.003);
  border-color: rgba(255,255,255,.96);
  box-shadow: var(--glass-shadow-hover);
}

.glass-hover {
  position: relative;
  isolation: isolate;
}

.glass-hover::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  border-radius: inherit;
  opacity: 0;
  background: radial-gradient(420px circle at var(--glass-x, 50%) var(--glass-y, 0%), rgba(255,255,255,.45), transparent 46%);
  transition: opacity .35s ease;
  content: "";
}

.glass-hover:hover::after { opacity: 1; }

button,
.text-button,
.shipment-create,
.inventory-alert-more,
.shipment-form-heading > a {
  transition: transform .2s var(--ease-spring), box-shadow .25s ease, filter .25s ease;
}

button:hover,
.shipment-create:hover,
.shipment-form-heading > a:hover { filter: brightness(1.035); transform: translateY(-1px); }
button:active,
.text-button:active,
.shipment-create:active,
.shipment-form-heading > a:active { transform: scale(.97); }

input,
select,
textarea {
  transition: border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

input:focus,
select:focus,
textarea:focus {
  background-color: rgba(255,255,255,.94);
  box-shadow: 0 0 0 4px rgba(74, 143, 236, .12), 0 8px 24px rgba(44, 108, 190, .08);
}

.motion-ready .reveal-item {
  opacity: 0;
  filter: blur(5px);
  transform: translate3d(0, 16px, 0) scale(.992);
  transition:
    opacity .7s var(--ease-spring) var(--reveal-delay, 0ms),
    filter .7s var(--ease-spring) var(--reveal-delay, 0ms),
    transform .7s var(--ease-spring) var(--reveal-delay, 0ms);
}

.motion-ready .reveal-item.is-visible {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0, 0, 0) scale(1);
}

.motion-ready meter { transform-origin: left center; }

.live-dot { animation: livePulse 2.4s ease-in-out infinite; }

@keyframes livePulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(35,163,109,.12); }
  50% { box-shadow: 0 0 0 8px rgba(35,163,109,0); }
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .portal-header,
  .update-chip,
  .period-filter,
  .inventory-search,
  .metric-card,
  .dashboard-board,
  .shipment-card,
  .delivery-card { background-color: rgba(255,255,255,.96); }
}

@media (max-width: 760px) {
  .portal-header { top: 0; }
  .portal-body { background-attachment: scroll; }
  .metric-card:hover,
  .dashboard-board:hover,
  .shipment-card:hover,
  .delivery-card:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    transition-delay: 0ms !important;
  }
  .motion-ready .reveal-item { opacity: 1; filter: none; transform: none; }
}

* { box-sizing: border-box; }

body { margin: 0; color: var(--ink); background: var(--canvas); }
button, input, select { font: inherit; }

.login-body { min-height: 100vh; background: var(--paper); }
.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, 0.92fr) 1.08fr; }
.brand-panel {
  min-height: 100vh;
  padding: clamp(40px, 7vw, 96px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: white;
  background:
    radial-gradient(circle at 84% 18%, rgba(180, 216, 198, 0.2), transparent 25%),
    linear-gradient(145deg, var(--forest) 0%, var(--forest-deep) 100%);
}
.login-logo { width: 190px; height: 92px; margin-bottom: 64px; padding: 8px 12px; border-radius: 12px; background: white; object-fit: contain; }
.header-logo { width: 86px; height: 42px; padding: 3px 7px; border-radius: 8px; background: white; object-fit: contain; }
.eyebrow { margin: 0 0 14px; font-size: 12px; font-weight: 750; letter-spacing: .18em; color: #b9d5c8; }
.eyebrow.dark { color: var(--forest); }
.brand-panel h1 { margin: 0; font-size: clamp(42px, 5vw, 72px); line-height: 1.06; letter-spacing: -.045em; }
.brand-copy { max-width: 570px; margin: 28px 0 0; color: #d9e7e0; font-size: 18px; line-height: 1.8; }
.brand-footnote { margin: 60px 0 0; color: #aac9ba; font-size: 13px; }
.login-panel { display: grid; place-items: center; padding: 48px 7vw; }
.login-card { width: min(100%, 430px); }
.login-card h2 { margin: 0; font-size: 36px; letter-spacing: -.035em; }
.login-intro { margin: 14px 0 34px; color: var(--muted); line-height: 1.7; }
.login-card form { display: grid; gap: 12px; }
.login-card label { margin-top: 8px; font-size: 14px; font-weight: 650; }
.login-card input {
  width: 100%; height: 50px; padding: 0 15px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--paper); color: var(--ink);
  outline: none; transition: border-color .15s, box-shadow .15s;
}
.login-card input:focus { border-color: var(--forest); box-shadow: 0 0 0 3px rgba(18, 63, 51, .12); }
.login-card button {
  height: 52px; margin-top: 14px; border: 0; border-radius: 9px;
  background: var(--forest); color: white; font-weight: 700; cursor: pointer;
  transition: background .15s, transform .15s;
}
.login-card button:hover { background: var(--forest-deep); }
.login-card button:active { transform: translateY(1px); }
.alert { margin: -16px 0 18px; padding: 12px 14px; border: 1px solid #efcaca; border-radius: 8px; background: var(--danger-bg); color: var(--danger); font-size: 14px; }
.security-note { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.security-note span { color: var(--forest); margin-right: 7px; }

.portal-body { min-height: 100vh; }
.portal-header { min-height: 76px; padding: 0 clamp(24px, 4vw, 62px); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px; color: var(--ink); background: rgba(255,255,255,.96); border-bottom: 1px solid #dce8f7; box-shadow: 0 6px 24px rgba(45,107,190,.07); }
.brand-zone { display:flex; align-items:center; gap:11px; min-width:265px; }
.brand-logo-link { display:flex; align-items:center; flex:0 0 auto; }
.brand-identity { display:flex; flex-direction:column; align-items:flex-start; gap:4px; }
.portal-brand, .user-menu { display: flex; align-items: center; gap: 12px; }
.portal-brand { color: #245997; text-decoration: none; font-size:13px; line-height:1.1; font-weight:800; white-space:nowrap; }
.store-switcher { display:flex; align-items:center; gap:2px; padding:2px; border:1px solid rgba(119,153,193,.22); border-radius:10px; background:rgba(239,246,255,.72); box-shadow:inset 0 1px 0 rgba(255,255,255,.9); }
.store-switcher a { display:flex; align-items:center; gap:5px; padding:4px 7px; border-radius:7px; color:#7589a1; text-decoration:none; font-size:10px; line-height:1; font-weight:800; white-space:nowrap; }
.store-switcher a:hover { color:#2670d6; background:rgba(255,255,255,.72); }
.store-switcher a.active { color:#1d5fae; background:#fff; box-shadow:0 3px 10px rgba(55,105,168,.12); }
.store-dot { width:8px; height:8px; border-radius:50%; background:#ff6b35; box-shadow:0 0 0 3px rgba(255,107,53,.12); }
.store-dot.amazon { background:#d6282d; box-shadow:0 0 0 3px rgba(214,40,45,.12); }
.header-logo.nissin-logo { width:92px; height:49px; padding:2px 4px; object-fit:contain; }
.portal-nav { height: 76px; display: flex; align-items: stretch; gap: 4px; }
.portal-nav a { min-width: 62px; padding: 0 15px; display: grid; place-items: center; border-bottom: 3px solid transparent; color: #66809f; text-decoration: none; font-size: 14px; font-weight: 650; }
.portal-nav a:hover, .portal-nav a.active { color: #2670d6; background: #f2f7ff; border-bottom-color: var(--orange); }
.user-menu { justify-self: end; font-size: 14px; }
.user-menu form { margin: 0; }
.text-button { border: 1px solid #c8daef; border-radius: 7px; padding: 7px 11px; color: #2a64a7; background: white; cursor: pointer; }
.portal-main { width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 72px 0; }
.portal-main h1 { margin: 0; font-size: clamp(36px, 5vw, 58px); letter-spacing: -.045em; }
.welcome-copy { max-width: 700px; margin: 18px 0 42px; color: var(--muted); font-size: 17px; line-height: 1.75; }
.hero-row, .report-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 48px; }
.update-chip { min-width: 185px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.update-chip span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 12px; }
.update-chip strong { color: var(--forest); font-size: 20px; }
.report-entry-grid { margin-bottom: 72px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.report-entry { min-height: 150px; padding: 24px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 20px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: var(--paper); text-decoration: none; transition: transform .15s, box-shadow .15s, border-color .15s; }
.report-entry:hover { transform: translateY(-2px); border-color: #b4c9bf; box-shadow: 0 12px 30px rgba(16,57,47,.08); }
.report-entry.featured { color: white; background: var(--forest); border-color: var(--forest); }
.entry-index { color: #8da39a; font-size: 12px; font-weight: 750; letter-spacing: .12em; }
.report-entry.featured .entry-index, .report-entry.featured p { color: #bcd3c8; }
.report-entry.inventory-entry { border-color: #b9cec4; background: linear-gradient(135deg, #f8fbf9, #e7f0eb); }
.report-entry strong { display: block; margin-bottom: 8px; font-size: 21px; }
.report-entry p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.entry-arrow { font-size: 25px; }
.section-heading { margin-bottom: 20px; display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.section-heading h2 { margin: 0; font-size: 28px; letter-spacing: -.025em; }
.section-heading > span { color: var(--muted); font-size: 13px; }
.status-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.status-card { min-height: 145px; padding: 25px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); }
.status-card span { color: var(--muted); font-size: 13px; }
.status-card strong { font-size: 25px; }
.accent-card { color: white; background: var(--forest); border-color: var(--forest); }
.accent-card span { color: #bfd7cc; }

.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.metric-card { min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); }
.metric-card > span { display: block; margin-bottom: 25px; color: var(--muted); font-size: 13px; }
.metric-card > strong { display: block; overflow-wrap: anywhere; font-size: clamp(20px, 2vw, 27px); letter-spacing: -.025em; }
.metric-card > small { display: block; margin-top: 10px; color: var(--muted); }
.metric-card.accent-card > span, .metric-card.accent-card > small { color: #bfd7cc; }

.report-main { padding-top: 56px; }
.report-heading { align-items: end; }
.report-heading .welcome-copy { margin-bottom: 0; }
.period-filter { min-width: 300px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.period-filter label { display: block; margin-bottom: 8px; color: var(--muted); font-size: 12px; font-weight: 650; }
.period-filter > div { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.period-filter select { min-width: 0; height: 42px; padding: 0 34px 0 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: white; }
.period-filter button { padding: 0 18px; border: 0; border-radius: 8px; color: white; background: var(--forest); font-weight: 700; cursor: pointer; }
.period-caption { margin: 36px 0 14px; color: var(--muted); font-size: 13px; }
.period-caption strong { margin-left: 6px; color: var(--ink); font-size: 15px; }
.period-caption span { color: #7e91a7; }
.report-scope-filter { display: grid; grid-template-columns: minmax(210px, 1.35fr) minmax(165px, .85fr) auto; align-items: end; gap: 7px 9px; min-width: 550px; }
.report-scope-filter label { margin: 0; }
.report-scope-filter label:first-child { grid-column: 1; }
.report-scope-filter label:nth-of-type(2) { grid-column: 2; grid-row: 1; }
.report-scope-filter select:first-of-type { grid-column: 1; }
.report-scope-filter select:nth-of-type(2) { grid-column: 2; grid-row: 2; }
.report-scope-filter button { grid-column: 3; grid-row: 2; height: 42px; background: #3478e5; }
.report-metrics { margin-bottom: 16px; }
.cost-strip { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line); border-radius: 12px; background: #edf3ef; overflow: hidden; }
.cost-strip > div { padding: 17px 20px; border-right: 1px solid #d5e0da; }
.cost-strip > div:last-child { border: 0; }
.cost-strip span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 12px; }
.cost-strip strong { font-size: 15px; }
.table-section { margin-top: 64px; }
.section-heading.compact { align-items: center; }
.section-heading.compact .eyebrow { margin-bottom: 7px; }
.table-shell { width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); }
table { width: 100%; min-width: 1080px; border-collapse: collapse; font-variant-numeric: tabular-nums; }
th, td { padding: 15px 16px; border-bottom: 1px solid #e7ece9; text-align: left; white-space: nowrap; }
th { position: sticky; top: 0; color: var(--muted); background: #f7f9f8; font-size: 11px; font-weight: 750; letter-spacing: .035em; }
td { font-size: 13px; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #f8faf9; }
td:first-child strong { display: block; color: var(--ink); }
td:first-child small { display: block; margin-top: 4px; color: var(--muted); }
.number { text-align: right; }
.positive { color: #176747; font-weight: 700; }
.negative { color: var(--danger); font-weight: 700; }
.empty-row { padding: 52px; color: var(--muted); text-align: center; }
.empty-state, .report-alert { margin-top: 36px; padding: 34px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); }
.empty-state p { margin: 8px 0 0; color: var(--muted); }
.report-alert { color: var(--danger); background: var(--danger-bg); border-color: #efcaca; }

.inventory-search { min-width: 360px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.inventory-search label { display: block; margin-bottom: 8px; color: var(--muted); font-size: 12px; font-weight: 650; }
.inventory-search > div { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.inventory-search input { min-width: 0; height: 42px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; outline: none; }
.inventory-search input:focus { border-color: var(--forest); box-shadow: 0 0 0 3px rgba(18,63,51,.1); }
.inventory-search button { padding: 0 20px; border: 0; border-radius: 8px; color: white; background: var(--forest); font-weight: 700; cursor: pointer; }
.inventory-sync { margin: 34px 0 14px; display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; }
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: #23a36d; box-shadow: 0 0 0 4px rgba(35,163,109,.12); }
.inventory-metrics { margin-bottom: 16px; }
.warning-card { color: #6d4314; border-color: #ead5b2; background: #fff8eb; }
.warning-card > span, .warning-card > small { color: #8b683d; }
.inventory-table-section { margin-top: 58px; }
.inventory-table { min-width: 940px; }
.stock-total { color: var(--forest); font-size: 16px; font-weight: 800; }
.muted-number { color: var(--muted); }
.stock-badge { display: inline-block; padding: 5px 9px; border-radius: 999px; font-size: 11px; font-weight: 750; }
.stock-badge.ok { color: #176747; background: #e8f5ef; }
.stock-badge.low { color: #8a591c; background: #fff1d7; }
.stock-badge.out { color: var(--danger); background: var(--danger-bg); }
.stock-badge.neutral { color: #5e6a65; background: #edf1ef; }
.coverage-days { font-weight: 750; }
.inventory-note { margin: 14px 4px 0; color: var(--muted); font-size: 12px; line-height: 1.7; }

.inventory-alert-section { margin-top: 72px; }
.alert-summary { margin-bottom: 14px; padding: 15px 18px; display: flex; justify-content: space-between; gap: 20px; border: 1px solid #ead5b2; border-radius: 11px; color: #6d4314; background: #fff8eb; }
.alert-summary span { color: #8b683d; font-size: 12px; }
.inventory-alert-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.inventory-alert-item { padding: 18px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 22px; border: 1px solid var(--line); border-left: 4px solid #d58a28; border-radius: 11px; color: var(--ink); background: var(--paper); text-decoration: none; }
.inventory-alert-item:hover { border-color: #d8b579; background: #fffdf8; }
.inventory-alert-item > div:first-child strong, .inventory-alert-item > div:first-child small { display: block; overflow: hidden; text-overflow: ellipsis; }
.inventory-alert-item small { margin-top: 4px; color: var(--muted); font-size: 11px; }
.alert-stock { color: var(--muted); text-align: right; font-size: 12px; }
.alert-days { min-width: 58px; color: var(--danger); text-align: right; }
.alert-days strong { font-size: 24px; }
.alert-days span { margin-left: 3px; font-size: 11px; }
.inventory-alert-more { margin-top: 16px; display: inline-block; color: var(--forest); font-size: 13px; font-weight: 700; text-decoration: none; }
.inventory-alert-empty { padding: 30px; display: flex; flex-direction: column; gap: 7px; border: 1px solid #cfe0d7; border-radius: 14px; color: #176747; background: #f1f8f4; }
.inventory-alert-empty span { color: var(--muted); font-size: 13px; }

.dashboard-main { display: grid; gap: 26px; }
.dashboard-hero { margin-bottom: 6px; display: flex; align-items: flex-start; justify-content: space-between; gap: 44px; }
.dashboard-hero .welcome-copy { margin-bottom: 0; }
.live-sales-panel, .dashboard-board { padding: 30px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
.live-sales-panel { color: white; border-color: var(--forest); background: linear-gradient(135deg, var(--forest-deep), var(--forest)); }
.panel-heading { margin-bottom: 24px; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.panel-heading h2 { margin: 0; font-size: 28px; letter-spacing: -.03em; }
.panel-heading a { color: var(--forest); font-size: 13px; font-weight: 700; text-decoration: none; }
.inverse-heading a { color: white; }
.sync-state { padding: 8px 11px; display: flex; align-items: center; gap: 8px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; color: #d8e8e0; font-size: 12px; }
.sync-state.preview-state .live-dot { background: #efbd64; box-shadow: 0 0 0 4px rgba(239,189,100,.14); }
.live-sales-grid { display: grid; grid-template-columns: 1.55fr repeat(3, 1fr); }
.live-sales-grid > div { min-width: 0; padding: 10px 24px; border-left: 1px solid rgba(255,255,255,.16); }
.live-sales-grid > div:first-child { padding-left: 0; border-left: 0; }
.live-sales-grid span { display: block; margin-bottom: 13px; color: #bad2c6; font-size: 12px; }
.live-sales-grid strong { display: inline-block; overflow-wrap: anywhere; font-size: clamp(22px, 2.2vw, 32px); letter-spacing: -.03em; }
.live-primary strong { display: block; font-size: clamp(32px, 4vw, 48px); }
.live-sales-grid small { display: block; margin-top: 8px; color: #acc8ba; font-size: 11px; }
.board-layout { display: grid; grid-template-columns: minmax(300px, .82fr) minmax(440px, 1.18fr); gap: 46px; }
.board-date { margin-bottom: 17px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.board-date span { color: var(--muted); font-size: 12px; }
.board-date strong { color: var(--forest); font-size: 18px; }
.summary-list { margin: 0; border-top: 1px solid var(--line); }
.summary-list > div { padding: 12px 0; display: flex; align-items: baseline; justify-content: space-between; gap: 20px; border-bottom: 1px solid #e9eeeb; }
.summary-list dt { color: var(--muted); font-size: 12px; }
.summary-list dd { margin: 0; text-align: right; font-size: 14px; font-weight: 750; }
.bar-figure { min-width: 0; margin: 0; }
.bar-figure figcaption { margin-bottom: 17px; display: flex; justify-content: space-between; gap: 16px; }
.bar-figure figcaption span { color: var(--muted); font-size: 11px; }
.horizontal-bars { display: grid; gap: 10px; }
.bar-row { display: grid; grid-template-columns: 42px minmax(120px, 1fr) 104px; align-items: center; gap: 12px; }
.bar-row > span { color: var(--muted); font-size: 11px; }
.bar-row > strong { text-align: right; font-size: 11px; font-variant-numeric: tabular-nums; }
meter { width: 100%; height: 14px; border: 0; border-radius: 3px; background: #e9efec; }
meter::-webkit-meter-bar { border: 0; border-radius: 3px; background: #e9efec; box-shadow: none; }
meter::-webkit-meter-optimum-value { border-radius: 3px; background: #89aa9a; }
meter::-moz-meter-bar { border-radius: 3px; background: #89aa9a; }
.bar-row.current meter::-webkit-meter-optimum-value { background: var(--forest); }
.bar-row.current meter::-moz-meter-bar { background: var(--forest); }
.inventory-overview { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.inventory-overview > div { padding: 19px 21px; border-right: 1px solid var(--line); }
.inventory-overview > div:last-child { border-right: 0; }
.inventory-overview span, .inventory-overview small { color: var(--muted); font-size: 11px; }
.inventory-overview strong { margin: 0 5px 0 12px; font-size: 24px; }
.inventory-overview .alert-total { color: #7c4716; background: #fff7e8; }
.inventory-visuals { margin-top: 24px; display: grid; grid-template-columns: .7fr 1.3fr; gap: 38px; }
.inventory-copy strong { font-size: 19px; }
.inventory-copy p { margin: 10px 0 26px; color: var(--muted); font-size: 13px; line-height: 1.75; }
.inventory-copy small { color: var(--muted); font-size: 11px; }
.coverage-list { display: grid; gap: 8px; }
.coverage-list a { padding: 9px 0; display: grid; grid-template-columns: minmax(135px, 1fr) minmax(100px, 1fr) 54px; align-items: center; gap: 15px; border-bottom: 1px solid #e9eeeb; color: var(--ink); text-decoration: none; }
.coverage-list a:last-child { border-bottom: 0; }
.coverage-list a > div strong, .coverage-list a > div span { display: block; }
.coverage-list a > div strong { overflow: hidden; text-overflow: ellipsis; font-size: 12px; }
.coverage-list a > div span { margin-top: 3px; color: var(--muted); font-size: 10px; }
.coverage-list meter::-webkit-meter-optimum-value { background: #d89234; }
.coverage-list meter::-moz-meter-bar { background: #d89234; }
.coverage-list b { color: var(--danger); text-align: right; font-size: 12px; }
.panel-empty { margin: 0; color: var(--muted); }
.inverse-empty { color: #bad2c6; }

/* LEAD HIGH palette: airy blue foundation, orange action, red urgency, white space. */
.brand-panel { background: radial-gradient(circle at 84% 18%, rgba(255,184,116,.38), transparent 28%), linear-gradient(145deg, #5296f4 0%, #3478e5 58%, #2868c8 100%); }
.brand-panel .eyebrow, .brand-footnote { color: #ffe2c7; }
.brand-copy { color: #f4f8ff; }
.eyebrow.dark { color: #3478e5; }
.report-entry.featured, .metric-card.accent-card, .live-sales-panel { background: linear-gradient(135deg, #5799f4, #3478e5 58%, #296acb); border-color: #3478e5; box-shadow: 0 14px 32px rgba(52,120,229,.16); }
.report-entry.inventory-entry { border-color: #cfdaea; background: linear-gradient(135deg, #ffffff, #edf3fb); }
.entry-index { color: #7182a1; }
.report-entry.featured .entry-index, .report-entry.featured p, .metric-card.accent-card > span, .metric-card.accent-card > small { color: #dbe5f4; }
.live-sales-grid span, .live-sales-grid small, .inverse-empty { color: #dbe5f4; }
.positive, .stock-badge.ok { color: #2868bc; }
.stock-badge.ok { background: #eaf2fc; }
.live-dot { background: #ff9b51; box-shadow: 0 0 0 4px rgba(255,155,81,.18); }
.warning-card, .alert-summary { color: #8f350b; border-color: #ffd1ae; background: #fff5ec; }
.warning-card > span, .warning-card > small, .alert-summary span { color: #a95118; }
.inventory-alert-item { border-left-color: #ff7500; }
.inventory-alert-item:hover { border-color: #ffba82; background: #fff8f2; }
.inventory-alert-empty { color: #164f94; border-color: #cfdaea; background: #edf3fb; }
meter::-webkit-meter-optimum-value { background: #668fc2; }
meter::-moz-meter-bar { background: #668fc2; }
.bar-row.current meter::-webkit-meter-optimum-value { background: #3478e5; }
.bar-row.current meter::-moz-meter-bar { background: #3478e5; }
.inventory-overview .alert-total { color: #b2291f; background: #fff0ee; }
.coverage-list meter::-webkit-meter-optimum-value { background: #ff7500; }
.coverage-list meter::-moz-meter-bar { background: #ff7500; }

.account-main { padding-top: 56px; }
.account-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 36px; }
.preview-ribbon { padding: 9px 13px; border: 1px solid #ffd1ae; border-radius: 999px; color: #a44a12; background: #fff5ec; font-size: 12px; font-weight: 700; }
.account-message { margin: -14px 0 24px; padding: 12px 15px; border: 1px solid #bcd8c9; border-radius: 9px; color: #176747; background: #f0faf5; font-size: 13px; }
.account-message.error { border-color: #f1cbc7; color: #b52d24; background: #fff3f1; }
.account-layout { display: grid; grid-template-columns: minmax(330px, .78fr) minmax(540px, 1.22fr); gap: 20px; align-items: start; }
.account-form-card, .account-list-card { padding: 28px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
.account-form { display: grid; gap: 17px; }
.account-form label, .account-form legend { color: #26324b; font-size: 12px; font-weight: 700; }
.account-form input[type="text"], .account-form input[type="password"], .account-form select { width: 100%; height: 45px; margin-top: 8px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: white; outline: none; }
.account-form input:focus, .account-form select:focus { border-color: #3478e5; box-shadow: 0 0 0 3px rgba(52,120,229,.11); }
.account-form label > small { margin-top: 6px; display: block; color: var(--muted); font-weight: 400; }
.field-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.account-form fieldset { margin: 0; padding: 15px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; border: 1px solid var(--line); border-radius: 10px; }
.account-form legend { padding: 0 6px; }
.account-form fieldset label { display: flex; align-items: center; gap: 8px; font-weight: 550; }
.account-form input[type="checkbox"] { accent-color: #ff8a34; }
.account-form > button { height: 48px; border: 0; border-radius: 9px; color: white; background: linear-gradient(90deg, #f05245, #ff8a34); box-shadow: 0 9px 22px rgba(240,82,69,.18); font-weight: 800; cursor: pointer; }
.account-list-card .panel-heading > span { color: var(--muted); font-size: 12px; }
.account-list { display: grid; }
.account-item { border-bottom: 1px solid #e7ebf2; }
.account-item:last-child { border-bottom: 0; }
.account-item > summary { list-style: none; cursor: pointer; }
.account-item > summary::-webkit-details-marker { display: none; }
.account-row { padding: 17px 0; display: grid; grid-template-columns: 42px minmax(130px, 1fr) minmax(160px, 1.15fr) auto auto; align-items: center; gap: 14px; border-bottom: 1px solid #e7ebf2; }
.account-item .account-row { border-bottom: 0; }
.account-avatar { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; color: white; background: linear-gradient(145deg, #67a7fb, #3478e5); font-weight: 800; }
.account-identity strong, .account-identity span, .account-role strong, .account-role span { display: block; }
.account-identity strong, .account-role strong { font-size: 13px; }
.account-identity span, .account-role span { margin-top: 4px; overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.account-status { padding: 5px 8px; border-radius: 999px; color: #164f94; background: #edf3fb; font-size: 10px; font-weight: 750; }
.account-status.disabled { color: #b2291f; background: #fff0ee; }
.account-edit { padding: 6px 9px; border: 1px solid #bdd4ef; border-radius: 7px; color: #3478e5; background: #f8fbff; font-size: 11px; cursor: pointer; }
.account-item[open] .account-edit { color: white; border-color: #3478e5; background: #3478e5; }
.account-edit-form { margin: 0 0 18px 54px; padding: 18px; display: grid; grid-template-columns: 1fr 1.35fr; gap: 14px; border: 1px solid #d8e6f6; border-radius: 11px; background: #f7faff; }
.account-edit-form label, .account-edit-form legend { color: #31465f; font-size: 11px; font-weight: 700; }
.account-edit-form select, .account-edit-form input[type="password"] { width: 100%; height: 40px; margin-top: 7px; padding: 0 10px; border: 1px solid #cfdeef; border-radius: 7px; color: var(--ink); background: white; }
.account-edit-form label > small { margin-top: 5px; display: block; color: var(--muted); font-weight: 400; }
.account-edit-form fieldset { margin: 0; padding: 11px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; border: 1px solid #cfdeef; border-radius: 8px; }
.account-edit-form fieldset label, .account-active { display: flex; align-items: center; gap: 7px; }
.account-edit-form input[type="checkbox"] { accent-color: #ff8a34; }
.account-edit-form > button { align-self: end; height: 40px; border: 0; border-radius: 7px; color: white; background: #3478e5; font-weight: 750; cursor: pointer; }
.account-edit-form .product-assignment-fieldset { grid-column: 1 / -1; display: block; }
.product-assignment-fieldset > p { margin: 0 0 11px; color: #74889e; font-size: 9px; font-weight: 400; line-height: 1.55; }
.product-assignment-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); max-height: 225px; overflow: auto; gap: 7px; }
.account-edit-form .product-assignment-grid label { min-width: 0; padding: 8px; border: 1px solid #dfe9f4; border-radius: 8px; background: white; font-size: 9px; }
.product-assignment-grid label:has(input:checked) { border-color: #82afe5; color: #2167b9; background: #eaf4ff; }
.product-assignment-grid span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-assignment-grid small { display: block; margin-top: 2px; overflow: hidden; color: #df7a35; font-size: 7px; text-overflow: ellipsis; }
.role-guide { margin-top: 18px; padding-top: 16px; display: flex; flex-wrap: wrap; gap: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.role-dot { width: 7px; height: 7px; margin-right: 5px; display: inline-block; border-radius: 50%; }
.admin-dot { background: #ef493d; }.operator-dot { background: #ff8a34; }.viewer-dot { background: #3478e5; }

.shipment-main, .shipment-form-main { padding-top: 56px; }
.shipment-heading, .shipment-form-heading { margin-bottom: 30px; display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; }
.shipment-heading .welcome-copy, .shipment-form-heading .welcome-copy { margin-bottom: 0; }
.shipment-create, .shipment-form-heading > a { flex: 0 0 auto; padding: 12px 17px; border-radius: 9px; color: white; background: linear-gradient(90deg, #f05245, #ff8a34); box-shadow: 0 9px 22px rgba(240,82,69,.16); font-size: 13px; font-weight: 750; text-decoration: none; }
.shipment-form-heading > a { color: #3478e5; border: 1px solid #c8daef; background: white; box-shadow: none; }
.shipment-summary { margin-bottom: 20px; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: white; }
.shipment-summary > div { padding: 20px; border-right: 1px solid var(--line); }
.shipment-summary > div:last-child { border-right: 0; }
.shipment-summary span, .shipment-summary small { display: block; color: var(--muted); font-size: 11px; }
.shipment-summary strong { display: block; margin: 9px 0 5px; color: #3478e5; font-size: 28px; }
.shipment-summary .shipment-warning { background: #fff8f2; }
.shipment-summary .shipment-warning strong { color: #ef493d; }
.shipment-filter { margin-bottom: 20px; padding: 16px; display: grid; grid-template-columns: 170px minmax(260px, 1fr) auto auto; align-items: end; gap: 12px; border: 1px solid var(--line); border-radius: 12px; background: white; }
.shipment-filter label { color: var(--muted); font-size: 11px; }
.shipment-filter select, .shipment-filter input { width: 100%; height: 40px; margin-top: 6px; padding: 0 11px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: white; }
.shipment-filter button { height: 40px; padding: 0 19px; border: 0; border-radius: 7px; color: white; background: #3478e5; font-weight: 700; cursor: pointer; }
.shipment-filter > a { height: 40px; padding: 0 9px; display: grid; place-items: center; color: var(--muted); font-size: 12px; text-decoration: none; }
.shipment-list { display: grid; gap: 14px; }
.shipment-card { padding: 22px 24px; border: 1px solid var(--line); border-radius: 14px; background: white; box-shadow: 0 7px 24px rgba(54,101,160,.045); }
.shipment-card-head, .shipment-card-foot { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.shipment-card-head > div:first-child strong, .shipment-card-head > div:first-child small { display: block; }
.shipment-card-head > div:first-child strong { margin: 8px 0 3px; font-size: 18px; }
.shipment-card-head > div:first-child small { color: var(--muted); font-size: 11px; }
.market-badge { padding: 4px 8px; border-radius: 999px; color: #2868bc; background: #eef5ff; font-size: 10px; font-weight: 800; }
.market-badge.japan { color: #a64b12; background: #fff2e7; }
.shipment-card-state { max-width: 390px; text-align: right; }
.shipment-card-state > span { display: block; margin-top: 6px; color: var(--muted); font-size: 10px; }
.shipment-card-state form { display: flex; align-items: end; justify-content: flex-end; gap: 8px; }
.shipment-card-state label { text-align: left; }
.shipment-card-state label > span { display: block; margin-bottom: 5px; color: var(--muted); font-size: 9px; font-weight: 700; }
.shipment-card-state select { min-width: 150px; height: 36px; padding: 0 30px 0 10px; border: 1px solid #c9d9eb; border-radius: 8px; color: #284766; background: rgba(255,255,255,.9); font-size: 11px; font-weight: 700; outline: none; }
.shipment-card-state select:focus { border-color: #3478e5; box-shadow: 0 0 0 3px rgba(52,120,229,.1); }
.shipment-card-state button { height: 36px; padding: 0 12px; border: 0; border-radius: 8px; color: white; background: linear-gradient(135deg, #3478e5, #65a4ed); font-size: 10px; font-weight: 750; cursor: pointer; white-space: nowrap; }
.shipment-route { margin: 20px 0 18px; display: grid; grid-template-columns: minmax(100px, auto) minmax(70px, 1fr) minmax(100px, auto) 1.4fr; align-items: center; gap: 14px; }
.shipment-route span, .shipment-dates span { display: block; margin-bottom: 5px; color: var(--muted); font-size: 10px; }
.shipment-route strong, .shipment-dates strong { font-size: 13px; }
.shipment-route > i { height: 1px; position: relative; background: #c9d9ec; }
.shipment-route > i::after { width: 7px; height: 7px; position: absolute; right: 0; top: -3px; border-top: 1px solid #8eadd1; border-right: 1px solid #8eadd1; content: ""; transform: rotate(45deg); }
.container-number { justify-self: end; text-align: right; }
.container-number strong { color: #3478e5; }
.shipment-dates { padding: 14px 0; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #edf1f6; border-bottom: 1px solid #edf1f6; }
.shipment-dates > div { padding: 0 14px; border-right: 1px solid #edf1f6; }
.shipment-dates > div:first-child { padding-left: 0; }
.shipment-dates > div:last-child { border-right: 0; }
.shipment-card-foot { padding-top: 15px; align-items: center; }
.shipment-card-foot > span { color: var(--muted); font-size: 10px; }
.shipment-card-foot > div { display: flex; align-items: center; gap: 14px; }
.shipment-card-foot a, .shipment-cost-detail summary { color: #3478e5; font-size: 11px; font-weight: 750; text-decoration: none; cursor: pointer; }
.shipment-cost-detail { position: relative; }
.shipment-cost-detail summary { list-style: none; }
.shipment-cost-detail summary::-webkit-details-marker { display: none; }
.shipment-cost-detail > div { width: 290px; padding: 14px; position: absolute; z-index: 3; right: 0; top: 25px; border: 1px solid var(--line); border-radius: 10px; background: white; box-shadow: 0 16px 38px rgba(31,62,99,.15); }
.shipment-cost-detail p { margin: 0; padding: 6px 0; display: flex; justify-content: space-between; gap: 14px; border-bottom: 1px solid #edf1f6; font-size: 10px; }
.shipment-cost-detail p:last-child { border-bottom: 0; }
.shipment-cost-detail p span { color: var(--muted); }
.shipment-empty { padding: 50px; border: 1px dashed #cbd9ea; border-radius: 14px; color: var(--muted); text-align: center; background: white; }
.shipment-entry-form { display: grid; gap: 18px; }
.shipment-entry-form > section { padding: 26px; border: 1px solid var(--line); border-radius: 15px; background: white; }
.shipment-form-section { margin-bottom: 20px; display: flex; align-items: center; gap: 13px; }
.shipment-form-section > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: white; background: #3478e5; font-size: 10px; font-weight: 800; }
.shipment-form-section h2, .shipment-form-section p { margin: 0; }
.shipment-form-section h2 { font-size: 19px; }
.shipment-form-section p { margin-top: 4px; color: var(--muted); font-size: 11px; }
.shipment-form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.shipment-form-grid label, .shipment-notes { color: #31465f; font-size: 11px; font-weight: 700; }
.shipment-form-grid input, .shipment-form-grid select, .shipment-form-grid textarea, .shipment-notes textarea { width: 100%; margin-top: 7px; padding: 10px 11px; border: 1px solid #cfdeef; border-radius: 8px; color: var(--ink); background: white; outline: none; }
.shipment-form-grid input, .shipment-form-grid select { height: 42px; }
.shipment-form-grid input:focus, .shipment-form-grid select:focus, .shipment-form-grid textarea:focus, .shipment-notes textarea:focus { border-color: #3478e5; box-shadow: 0 0 0 3px rgba(52,120,229,.1); }
.shipment-form-grid .wide-field { grid-column: span 2; }
.cost-fields { grid-template-columns: repeat(4, 1fr); }
.shipment-notes { display: block; }
.shipment-form-actions { display: flex; justify-content: flex-end; align-items: center; gap: 18px; }
.shipment-form-actions a { color: var(--muted); font-size: 12px; text-decoration: none; }
.shipment-form-actions button { height: 46px; padding: 0 24px; border: 0; border-radius: 8px; color: white; background: linear-gradient(90deg, #f05245, #ff8a34); font-weight: 800; cursor: pointer; }

.delivery-main { padding-top: 56px; }
.delivery-heading { margin-bottom: 30px; display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; }
.delivery-heading .welcome-copy { margin-bottom: 0; }
.delivery-source { flex: 0 0 auto; padding: 14px 17px; border: 1px solid #cfe3f8; border-radius: 11px; background: #f4f9ff; }
.delivery-source span, .delivery-source strong, .delivery-source small { display: block; }
.delivery-source span { color: #2d8b73; font-size: 10px; font-weight: 800; }
.delivery-source strong { margin: 6px 0 4px; font-size: 12px; }
.delivery-source small { color: var(--muted); font-size: 9px; }
.delivery-summary { margin-bottom: 20px; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: white; }
.delivery-summary > div { padding: 21px; border-right: 1px solid var(--line); }
.delivery-summary > div:last-child { border-right: 0; }
.delivery-summary span, .delivery-summary small { display: block; color: var(--muted); font-size: 11px; }
.delivery-summary strong { display: block; margin: 9px 0 5px; color: #3478e5; font-size: 28px; }
.delivery-summary .receiving { background: #fff8f2; }
.delivery-summary .receiving strong { color: #f06b30; }
.delivery-summary .completed strong { color: #2e8b78; }
.delivery-summary .cancelled strong { color: #8492a3; }
.cost-policy { margin-bottom: 20px; padding: 22px 24px; display: grid; grid-template-columns: minmax(180px,.7fr) 2fr; align-items: center; gap: 32px; border: 1px solid #fed9be; border-radius: 14px; background: linear-gradient(110deg, #fff9f4, #fff); }
.cost-policy h2 { margin: 0; font-size: 19px; }
.cost-policy .eyebrow { margin-bottom: 7px; }
.cost-policy ol { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4,1fr); list-style: none; }
.cost-policy li { position: relative; display: flex; align-items: center; gap: 9px; }
.cost-policy li:not(:last-child)::after { position: absolute; right: 9px; color: #dfbd9f; content: "→"; }
.cost-policy li i { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; color: white; background: linear-gradient(145deg,#f15e43,#ff8a34); font-size: 10px; font-style: normal; font-weight: 800; }
.cost-policy li b, .cost-policy li small { display: block; }
.cost-policy li b { font-size: 11px; }
.cost-policy li small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.delivery-filter { margin-bottom: 20px; padding: 16px; display: grid; grid-template-columns: 175px minmax(270px, 1fr) auto auto auto; align-items: end; gap: 12px; border: 1px solid var(--line); border-radius: 12px; background: white; }
.delivery-filter label { color: var(--muted); font-size: 11px; }
.delivery-filter select, .delivery-filter input { width: 100%; height: 40px; margin-top: 6px; padding: 0 11px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: white; }
.delivery-filter button { height: 40px; padding: 0 19px; border: 0; border-radius: 7px; color: white; background: #3478e5; font-weight: 700; cursor: pointer; }
.delivery-filter > a { height: 40px; padding: 0 7px; display: grid; place-items: center; color: var(--muted); font-size: 12px; text-decoration: none; }
.delivery-sync { height: 40px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; color: #65809e; font-size: 10px; white-space: nowrap; }
.delivery-sync i { width: 7px; height: 7px; border-radius: 50%; background: #37a28a; box-shadow: 0 0 0 4px rgba(55,162,138,.12); }
.delivery-list { display: grid; gap: 15px; }
.delivery-card { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: white; box-shadow: 0 7px 24px rgba(54,101,160,.045); }
.delivery-card-head { padding: 22px 24px; display: grid; grid-template-columns: 1fr 1.12fr 1.45fr auto; align-items: center; gap: 24px; }
.delivery-card-head div > span, .delivery-card-head div > small { display: block; color: var(--muted); font-size: 10px; }
.delivery-card-head div > strong { margin: 6px 0 4px; display: block; overflow-wrap: anywhere; font-size: 14px; }
.delivery-id strong { color: #3478e5; font-size: 19px !important; }
.delivery-status { padding: 7px 10px; border-radius: 999px; font-size: 10px; font-weight: 800; white-space: nowrap; }
.delivery-status.scheduled { color: #2767b5; background: #edf5ff; }
.delivery-status.receiving { color: #aa510f; background: #fff2e6; }
.delivery-status.completed { color: #287861; background: #eaf8f3; }
.delivery-status.cancelled { color: #8b96a5; background: #f0f2f5; }
.delivery-progress { padding: 0 24px 20px; }
.delivery-progress-label { margin-bottom: 8px; display: flex; justify-content: space-between; color: #8796a8; font-size: 9px; }
.delivery-progress-track { height: 4px; overflow: hidden; border-radius: 999px; background: #e9f0f8; }
.delivery-progress-track i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, #3478e5, #ff8a34); }
.delivery-progress-track.cancelled i { background: #aeb8c4; }
.delivery-metrics { display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid #edf1f6; border-bottom: 1px solid #edf1f6; background: #fbfdff; }
.delivery-metrics > div { padding: 16px 24px; border-right: 1px solid #edf1f6; }
.delivery-metrics > div:last-child { border-right: 0; }
.delivery-metrics span, .delivery-metrics small { display: block; color: var(--muted); font-size: 10px; }
.delivery-metrics strong { display: block; margin: 6px 0 3px; font-size: 17px; }
.delivery-metrics .date-value { font-size: 13px; }
.delivery-card-actions { display: grid; grid-template-columns: 1fr 1fr; }
.delivery-products { border-right: 1px solid #edf1f6; }
.delivery-products summary, .delivery-cost summary { padding: 15px 24px; display: flex; justify-content: space-between; color: #3478e5; list-style: none; font-size: 11px; font-weight: 750; cursor: pointer; }
.delivery-products summary::-webkit-details-marker { display: none; }
.delivery-cost summary::-webkit-details-marker { display: none; }
.delivery-products summary b, .delivery-cost summary b { color: var(--muted); font-weight: 500; }
.delivery-products[open] summary, .delivery-cost[open] summary { border-bottom: 1px solid #edf1f6; background: #f7faff; }
.delivery-cost.locked summary { color: #2e8b78; }
.delivery-product-table { padding: 8px 24px 18px; }
.delivery-product-row { padding: 10px 0; display: grid; grid-template-columns: 1.5fr 1fr .55fr; gap: 16px; border-bottom: 1px solid #edf1f6; font-size: 11px; }
.delivery-product-row:last-child { border-bottom: 0; }
.delivery-product-row.header { color: var(--muted); font-size: 9px; font-weight: 700; }
.delivery-product-row div strong, .delivery-product-row div small { display: block; }
.delivery-product-row div small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.delivery-cost-form { padding: 18px 24px; display: grid; grid-template-columns: 1fr 130px; gap: 12px; background: #fffaf6; }
.delivery-cost-form label { color: #6d7d91; font-size: 9px; font-weight: 700; }
.delivery-cost-form input, .delivery-cost-form select { width: 100%; height: 38px; margin-top: 6px; padding: 0 10px; border: 1px solid #dfd9d3; border-radius: 7px; color: var(--ink); background: white; }
.delivery-cost-form .cost-note { grid-column: 1 / -1; }
.delivery-cost-form button { height: 40px; grid-column: 1 / -1; border: 0; border-radius: 7px; color: white; background: linear-gradient(90deg,#ef5944,#ff8a34); font-size: 11px; font-weight: 800; cursor: pointer; }
.delivery-cost-form p { margin: 0; grid-column: 1 / -1; color: #9a6a48; font-size: 8px; text-align: center; }
.delivery-cost-form.change { background: #f7faff; }
.delivery-cost-form.change button { background: #3478e5; }
.cost-approval { padding: 17px 24px; display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 10px; background: #fff8f2; }
.cost-approval span, .cost-approval strong, .cost-approval small { display: block; }
.cost-approval span { color: #a8521a; font-size: 9px; font-weight: 800; }
.cost-approval strong { margin: 5px 0; font-size: 12px; }
.cost-approval small { color: var(--muted); font-size: 9px; }
.cost-approval form { margin: 0; }
.cost-approval button { padding: 8px 10px; border-radius: 6px; font-size: 9px; font-weight: 750; cursor: pointer; }
.cost-approval .approve { color: white; border: 1px solid #2e8b78; background: #2e8b78; }
.cost-approval .reject { color: #b34235; border: 1px solid #efc7c1; background: white; }

@media (max-width: 760px) {
  .login-shell { grid-template-columns: 1fr; }
  .brand-panel { min-height: auto; padding: 38px 28px 42px; }
  .brand-mark { width: 44px; height: 44px; margin-bottom: 50px; font-size: 24px; }
  .brand-panel h1 { font-size: 42px; }
  .brand-copy { font-size: 15px; }
  .brand-footnote { margin-top: 38px; }
  .login-panel { padding: 52px 28px 64px; }
  .status-grid, .metric-grid, .report-entry-grid { grid-template-columns: 1fr; }
  .portal-header { padding: 12px 18px 0; grid-template-columns: 1fr auto; gap: 8px; }
  .portal-brand > span:last-child { display: none; }
  .user-menu > span { display: none; }
  .portal-nav { height: 52px; grid-column: 1 / -1; grid-row: 2; justify-content: space-between; order: 3; }
  .portal-nav a { flex: 1; min-width: 0; padding: 0 10px; }
  .portal-main { width: calc(100% - 36px); padding: 48px 0; }
  .hero-row, .report-heading { display: block; }
  .update-chip, .period-filter, .inventory-search { width: 100%; min-width: 0; margin-top: 24px; }
  .report-entry-grid { margin-bottom: 52px; }
  .report-entry { min-height: 125px; }
  .section-heading { align-items: start; }
  .cost-strip { grid-template-columns: 1fr 1fr; }
  .cost-strip > div { border-bottom: 1px solid #d5e0da; }
  .cost-strip > div:nth-child(2n) { border-right: 0; }
  .cost-strip > div:last-child { border-bottom: 0; }
  .table-section { margin-top: 48px; }
  .inventory-alert-grid { grid-template-columns: 1fr; }
  .alert-summary { align-items: flex-start; flex-direction: column; gap: 5px; }
  .dashboard-hero { display: block; }
  .live-sales-panel, .dashboard-board { padding: 22px; }
  .panel-heading { align-items: flex-start; }
  .live-sales-grid { grid-template-columns: 1fr 1fr; }
  .live-sales-grid > div, .live-sales-grid > div:first-child { padding: 17px 12px; border-top: 1px solid rgba(255,255,255,.16); border-left: 0; }
  .live-sales-grid > div:nth-child(even) { border-left: 1px solid rgba(255,255,255,.16); }
  .board-layout, .inventory-visuals { grid-template-columns: 1fr; gap: 28px; }
  .inventory-overview { grid-template-columns: 1fr 1fr; }
  .inventory-overview > div { border-bottom: 1px solid var(--line); }
  .inventory-overview > div:nth-child(2n) { border-right: 0; }
  .inventory-overview > div:nth-child(n+3) { border-bottom: 0; }
  .bar-row { grid-template-columns: 38px minmax(80px, 1fr) 88px; gap: 8px; }
  .coverage-list a { grid-template-columns: minmax(120px, 1fr) 80px 48px; gap: 9px; }
  .header-logo { width: 66px; height: 34px; }
  .portal-brand > span:last-child { display: none; }
  .account-heading { display: block; }
  .preview-ribbon { margin-bottom: 22px; display: inline-block; }
  .account-layout { grid-template-columns: 1fr; }
  .field-pair, .account-form fieldset { grid-template-columns: 1fr; }
  .account-row { grid-template-columns: 40px 1fr auto; }
  .account-role { grid-column: 2 / -1; }
  .account-edit-form { margin-left: 0; grid-template-columns: 1fr; }
  .shipment-heading, .shipment-form-heading { display: block; }
  .shipment-create, .shipment-form-heading > a { margin-top: 20px; display: inline-block; }
  .shipment-summary { grid-template-columns: 1fr 1fr; }
  .shipment-summary > div { border-bottom: 1px solid var(--line); }
  .shipment-summary > div:nth-child(2n) { border-right: 0; }
  .shipment-summary > div:nth-child(n+3) { border-bottom: 0; }
  .shipment-filter { grid-template-columns: 1fr; }
  .shipment-filter > a { justify-content: start; }
  .shipment-card { padding: 19px; }
  .shipment-card-head { display: block; }
  .shipment-card-state { max-width: none; margin-top: 14px; text-align: left; }
  .shipment-card-state form { justify-content: flex-start; }
  .shipment-route { grid-template-columns: auto 1fr auto; }
  .container-number { grid-column: 1 / -1; justify-self: start; text-align: left; }
  .shipment-dates { grid-template-columns: 1fr 1fr; gap: 12px 0; }
  .shipment-dates > div:nth-child(2) { border-right: 0; }
  .shipment-dates > div:nth-child(3) { padding-left: 0; }
  .shipment-card-foot { align-items: flex-start; flex-direction: column; }
  .shipment-cost-detail > div { left: 0; right: auto; }
  .shipment-form-grid, .cost-fields { grid-template-columns: 1fr; }
  .shipment-form-grid .wide-field { grid-column: auto; }
  .delivery-heading { display: block; }
  .delivery-source { margin-top: 20px; display: inline-block; }
  .delivery-summary { grid-template-columns: 1fr 1fr; }
  .delivery-summary > div { border-bottom: 1px solid var(--line); }
  .delivery-summary > div:nth-child(2n) { border-right: 0; }
  .delivery-summary > div:nth-child(n+3) { border-bottom: 0; }
  .delivery-filter { grid-template-columns: 1fr; }
  .delivery-filter > a, .delivery-sync { justify-content: flex-start; }
  .delivery-card-head { grid-template-columns: 1fr 1fr; gap: 18px; }
  .delivery-warehouse { grid-column: 1 / -1; }
  .delivery-status { justify-self: start; }
  .delivery-metrics { grid-template-columns: 1fr 1fr; }
  .delivery-metrics > div { border-bottom: 1px solid #edf1f6; }
  .delivery-metrics > div:nth-child(2n) { border-right: 0; }
  .delivery-metrics > div:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .cost-policy { grid-template-columns: 1fr; }
  .cost-policy ol { grid-template-columns: 1fr 1fr; gap: 14px; }
  .cost-policy li:not(:last-child)::after { display: none; }
  .delivery-card-actions { grid-template-columns: 1fr; }
  .delivery-products { border-right: 0; border-bottom: 1px solid #edf1f6; }
  .delivery-cost-form { grid-template-columns: 1fr; }
  .delivery-cost-form .cost-note, .delivery-cost-form button, .delivery-cost-form p { grid-column: auto; }
  .cost-approval { grid-template-columns: 1fr auto auto; }
  .delivery-product-table { overflow-x: auto; }
  .delivery-product-row { min-width: 600px; }
}

/* Final cascade lock for the glass layer. */
.portal-body {
  background:
    radial-gradient(circle at 8% 8%, rgba(116, 181, 255, .24), transparent 30rem),
    radial-gradient(circle at 92% 20%, rgba(255, 165, 94, .16), transparent 28rem),
    radial-gradient(circle at 65% 86%, rgba(108, 202, 220, .14), transparent 32rem),
    linear-gradient(145deg, #f4f8ff 0%, #fbfdff 48%, #f8fbff 100%);
  background-attachment: fixed;
}

.portal-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(248, 252, 255, .69);
  border-bottom-color: rgba(255, 255, 255, .82);
  box-shadow: 0 8px 28px rgba(46, 104, 174, .08);
  -webkit-backdrop-filter: blur(24px) saturate(165%);
  backdrop-filter: blur(24px) saturate(165%);
}

.portal-header.is-scrolled {
  background: rgba(247, 251, 255, .86);
  box-shadow: 0 12px 34px rgba(46, 104, 174, .14);
}

.update-chip,
.period-filter,
.inventory-search,
.metric-card:not(.accent-card),
.cost-strip,
.table-shell,
.empty-state,
.dashboard-board,
.inventory-alert-item,
.inventory-alert-empty,
.account-form-card,
.account-list-card,
.shipment-summary,
.shipment-filter,
.shipment-card,
.shipment-form,
.delivery-summary,
.cost-policy,
.delivery-filter,
.delivery-card {
  background-color: var(--glass-surface);
  border-color: var(--glass-border);
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(22px) saturate(145%);
  backdrop-filter: blur(22px) saturate(145%);
}

.live-sales-panel {
  background:
    radial-gradient(circle at 88% 8%, rgba(255,255,255,.2), transparent 34%),
    linear-gradient(135deg, rgba(83,154,244,.96), rgba(52,120,229,.94) 58%, rgba(41,106,203,.96));
  border-color: rgba(255,255,255,.42);
  box-shadow: 0 22px 58px rgba(42, 108, 203, .24), inset 0 1px 0 rgba(255,255,255,.34);
}

.login-body {
  background:
    radial-gradient(circle at 76% 12%, rgba(110,177,255,.25), transparent 28rem),
    radial-gradient(circle at 92% 88%, rgba(255,157,83,.16), transparent 25rem),
    #f4f8ff;
}

.login-panel { background: rgba(244, 248, 255, .48); }
.login-card {
  padding: 38px;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 24px;
  background: rgba(255,255,255,.68);
  box-shadow: 0 26px 70px rgba(38,87,150,.14), inset 0 1px 0 rgba(255,255,255,.95);
  -webkit-backdrop-filter: blur(28px) saturate(155%);
  backdrop-filter: blur(28px) saturate(155%);
}

@media (max-width: 760px) {
  .portal-body { background-attachment: scroll; }
  .login-card { padding: 27px; border-radius: 20px; }
}

/* Enhanced glass preview: stronger depth while preserving dashboard legibility. */
.portal-body {
  position: relative;
  isolation: isolate;
  background: linear-gradient(145deg, #eaf3ff 0%, #fbfdff 46%, #eef8ff 100%);
}

.portal-body::after {
  position: fixed;
  inset: -18vh -12vw;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 13% 18%, rgba(80, 157, 255, .44) 0 8%, transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(255, 139, 69, .34) 0 7%, transparent 27%),
    radial-gradient(circle at 70% 82%, rgba(70, 193, 220, .30) 0 8%, transparent 29%),
    radial-gradient(circle at 24% 88%, rgba(240, 73, 61, .13) 0 5%, transparent 23%);
  filter: blur(34px) saturate(125%);
  transform: translate3d(0,0,0) scale(1.04);
  animation: ambientDrift 18s ease-in-out infinite alternate;
}

@keyframes ambientDrift {
  0% { transform: translate3d(-1.5%, -1%, 0) scale(1.04); }
  50% { transform: translate3d(1.2%, 1.4%, 0) scale(1.08); }
  100% { transform: translate3d(2%, -.8%, 0) scale(1.045); }
}

.portal-header {
  top: 12px;
  width: min(1440px, calc(100% - 24px));
  min-height: 68px;
  margin: 12px auto 0;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(255,255,255,.72), rgba(240,248,255,.58));
  box-shadow:
    0 18px 48px rgba(37,93,164,.16),
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -1px 0 rgba(135,181,236,.14);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  backdrop-filter: blur(30px) saturate(180%);
}

.portal-header.is-scrolled {
  background: linear-gradient(135deg, rgba(255,255,255,.86), rgba(237,247,255,.74));
  box-shadow: 0 22px 58px rgba(37,93,164,.22), inset 0 1px 0 white;
}

.portal-nav { height: 68px; }
.portal-nav a { border-radius: 13px; border-bottom-width: 0; margin: 9px 0; }
.portal-nav a:hover { background: rgba(255,255,255,.68); box-shadow: inset 0 1px 0 white; }
.portal-nav a.active {
  color: #266dd0;
  background: rgba(255,255,255,.82);
  box-shadow: 0 8px 20px rgba(52,120,229,.13), inset 0 1px 0 white;
}
.portal-nav a.active::after {
  position: absolute;
  width: 18px;
  height: 3px;
  bottom: 6px;
  border-radius: 99px;
  background: linear-gradient(90deg, #f05245, #ff9b43);
  content: "";
}
.portal-nav a { position: relative; }

.report-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: min(620px, 100%);
  margin: 0 0 22px;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.92);
  border-radius: 20px;
  background: rgba(235,245,255,.64);
  box-shadow: 0 14px 34px rgba(42,102,176,.10), inset 0 1px 0 white;
  -webkit-backdrop-filter: blur(22px) saturate(165%);
  backdrop-filter: blur(22px) saturate(165%);
}
.report-tabs.has-export { grid-template-columns: repeat(4, minmax(0, 1fr)); width: min(820px, 100%); }

.report-tabs a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 52px;
  padding: 8px 14px;
  border-radius: 14px;
  color: #66809f;
  text-decoration: none;
  transition: color .22s ease, background .22s ease, box-shadow .22s ease, transform .22s var(--ease-spring);
}

.report-tabs a:hover { color: #2874d7; background: rgba(255,255,255,.58); transform: translateY(-1px); }
.report-tabs a.active { color: #246ed1; background: rgba(255,255,255,.9); box-shadow: 0 8px 20px rgba(48,114,208,.14), inset 0 1px 0 white; }
.report-tabs span { font-size: 15px; font-weight: 760; }
.report-tabs small { color: #8ca0b9; font-size: 11px; }

@media (max-width: 640px) {
  .report-tabs { gap: 5px; padding: 5px; border-radius: 16px; }
  .report-tabs a { min-height: 46px; padding: 6px 8px; }
  .report-tabs a small { display: none; }
}

@media (max-width: 760px) {
  .report-scope-filter { grid-template-columns: 1fr; min-width: 0; }
  .report-scope-filter label, .report-scope-filter label:first-child,
  .report-scope-filter label:nth-of-type(2), .report-scope-filter select:first-of-type,
  .report-scope-filter select:nth-of-type(2), .report-scope-filter button { grid-column: 1; grid-row: auto; }
  .product-assignment-grid { grid-template-columns: 1fr 1fr; }
}

.header-logo {
  box-shadow: 0 7px 18px rgba(35,86,148,.12), inset 0 1px 0 white;
  transform: translateZ(0);
}

.update-chip,
.period-filter,
.inventory-search,
.metric-card:not(.accent-card),
.cost-strip,
.table-shell,
.empty-state,
.dashboard-board,
.inventory-alert-item,
.inventory-alert-empty,
.account-form-card,
.account-list-card,
.shipment-summary,
.shipment-filter,
.shipment-card,
.shipment-form,
.delivery-summary,
.cost-policy,
.delivery-filter,
.delivery-card {
  background: linear-gradient(145deg, rgba(255,255,255,.70), rgba(245,250,255,.48));
  border-color: rgba(255,255,255,.92);
  box-shadow:
    0 20px 54px rgba(40,92,157,.13),
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -1px 0 rgba(118,169,228,.12);
  -webkit-backdrop-filter: blur(30px) saturate(165%);
  backdrop-filter: blur(30px) saturate(165%);
}

.dashboard-board,
.shipment-card,
.delivery-card,
.metric-card,
.account-form-card,
.account-list-card,
.update-chip,
.live-sales-panel {
  transform-style: preserve-3d;
  will-change: transform;
}

.dashboard-board > *,
.shipment-card > *,
.delivery-card > *,
.metric-card > *,
.account-form-card > *,
.account-list-card > * { transform: translateZ(10px); }

.metric-card:not(.accent-card)::before,
.dashboard-board::before,
.shipment-card::before,
.delivery-card::before,
.account-form-card::before,
.account-list-card::before {
  position: absolute;
  inset: 1px 12% auto;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.96), transparent);
  content: "";
}

.metric-card:not(.accent-card),
.dashboard-board,
.shipment-card,
.delivery-card,
.account-form-card,
.account-list-card { position: relative; }

.dashboard-board.inventory-board {
  background:
    linear-gradient(145deg, rgba(255,255,255,.68), rgba(247,251,255,.48)),
    radial-gradient(circle at 100% 0, rgba(255,157,73,.18), transparent 36%);
}

.warning-card,
.delivery-summary .receiving,
.shipment-summary .shipment-warning {
  background: linear-gradient(145deg, rgba(255,249,235,.82), rgba(255,244,229,.58));
}

.live-sales-panel {
  border-color: rgba(255,255,255,.55);
  box-shadow:
    0 28px 72px rgba(39,105,204,.31),
    inset 0 1px 0 rgba(255,255,255,.48),
    inset 0 -1px 0 rgba(14,73,158,.22);
}

.glass-hover::after {
  z-index: 0;
  background: radial-gradient(520px circle at var(--glass-x, 50%) var(--glass-y, 0%), rgba(255,255,255,.54), transparent 43%);
  mix-blend-mode: soft-light;
}
.glass-hover > * { position: relative; z-index: 1; }

.motion-ready .reveal-item {
  opacity: 0;
  filter: blur(8px);
  transform: translate3d(0, 26px, 0) scale(.975);
}
.motion-ready .reveal-item.is-visible {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0, 0, 0) scale(1);
}

@media (max-width: 1060px) {
  .portal-header { width: calc(100% - 16px); padding-left: 18px; padding-right: 18px; }
  .portal-nav a { padding-left: 10px; padding-right: 10px; }
}

@media (max-width: 760px) {
  .portal-header {
    top: 0;
    width: 100%;
    margin-top: 0;
    border-left: 0;
    border-right: 0;
    border-top: 0;
    border-radius: 0 0 18px 18px;
  }
  .portal-nav { height: 52px; }
  .portal-nav a { margin: 4px 0; border-radius: 10px; }
  .portal-body::after { animation: none; opacity: .68; }
}

.expense-ledger {
  margin-top: 18px;
  padding: 28px;
  border: 1px solid rgba(255,255,255,.92);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.72), rgba(245,250,255,.52));
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(30px) saturate(165%);
  backdrop-filter: blur(30px) saturate(165%);
}
.expense-ledger > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 30px; }
.expense-ledger h2, .expense-ledger h3, .expense-ledger p { margin: 0; }
.expense-ledger h2 { font-size: 25px; }
.expense-ledger header p:last-child { margin-top: 8px; color: var(--muted); font-size: 12px; }
.expense-total { min-width: 220px; padding: 14px 17px; border: 1px solid rgba(255,255,255,.9); border-radius: 13px; background: rgba(255,255,255,.58); text-align: right; }
.expense-total span, .expense-total strong { display: block; }
.expense-total span { color: var(--muted); font-size: 10px; }
.expense-total strong { margin-top: 6px; color: #296dca; font-size: 21px; }
.expense-group { margin-top: 25px; }
.expense-group h3 { margin-bottom: 11px; color: #51677f; font-size: 11px; letter-spacing: .08em; }
.expense-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.expense-grid.gross-costs { grid-template-columns: repeat(3, 1fr); }
.expense-grid article { min-width: 0; padding: 16px; border: 1px solid rgba(255,255,255,.88); border-radius: 12px; background: rgba(255,255,255,.54); box-shadow: inset 0 1px 0 white; }
.expense-grid span, .expense-grid strong, .expense-grid small { display: block; }
.expense-grid span { color: var(--muted); font-size: 10px; }
.expense-grid strong { margin-top: 8px; overflow-wrap: anywhere; font-size: 16px; }
.expense-grid small { min-height: 28px; margin-top: 7px; color: #8390a0; font-size: 9px; line-height: 1.55; }
.daily-cost-table { min-width: 2460px; }
.daily-cost-table td small { color: #8997a7; font-size: 9px; }
.attribution-badge { display: inline-block; padding: 5px 8px; border-radius: 999px; color: #356da9; background: #edf5ff; font-size: 9px; font-weight: 700; }

@media (max-width: 920px) {
  .expense-grid { grid-template-columns: repeat(2, 1fr); }
  .expense-grid.gross-costs { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .expense-ledger { padding: 20px; }
  .expense-ledger > header { flex-direction: column; }
  .expense-total { width: 100%; text-align: left; }
  .expense-grid, .expense-grid.gross-costs { grid-template-columns: 1fr; }
}

/* Business analysis */
.analysis-main { padding-bottom: 72px; }
.analysis-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 22px; }
.analysis-hero h1 { margin: 4px 0 8px; font-size: clamp(34px, 4vw, 52px); }
.analysis-date { min-width: 220px; padding: 16px 18px; border: 1px solid rgba(255,255,255,.92); border-radius: 17px; background: rgba(255,255,255,.62); box-shadow: var(--glass-shadow); text-align: right; backdrop-filter: blur(24px); }
.analysis-date span, .analysis-date strong, .analysis-date small { display: block; }
.analysis-date span, .analysis-date small { color: var(--muted); font-size: 10px; }
.analysis-date strong { margin: 5px 0; color: #2c72d1; font-size: 21px; }
.trend-explorer { margin-bottom: 18px; }
.trend-explorer > .panel-heading > span { color: #71869c; font-size: 10px; white-space: nowrap; }
.trend-filter { display: grid; grid-template-columns: 1.15fr 1.2fr .85fr .85fr auto; align-items: end; gap: 11px; padding: 15px; border: 1px solid rgba(255,255,255,.9); border-radius: 17px; background: rgba(255,255,255,.5); }
.trend-filter label, .trend-filter label > span { display: block; }
.trend-filter label > span { margin-bottom: 7px; color: #698097; font-size: 9px; font-weight: 750; letter-spacing: .03em; }
.trend-filter select, .trend-filter input { width: 100%; height: 42px; padding: 0 11px; border: 1px solid rgba(153,177,201,.48); border-radius: 10px; color: #24425e; background: rgba(255,255,255,.82); outline: none; }
.trend-filter select:focus, .trend-filter input:focus { border-color: #5897e4; box-shadow: 0 0 0 3px rgba(58,128,218,.11); }
.trend-filter button { height: 42px; padding: 0 20px; border: 0; border-radius: 10px; color: white; background: linear-gradient(135deg, #377fdc, #5ca3ed); box-shadow: 0 8px 18px rgba(55,127,220,.2); font-weight: 750; cursor: pointer; white-space: nowrap; }
.trend-filter-error { margin-top: 12px; padding: 11px 13px; border-radius: 11px; color: #a54343; background: rgba(255,231,231,.8); font-size: 10px; }
.trend-result-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 23px 2px 12px; }
.trend-result-heading span { display: inline-block; padding: 4px 8px; border-radius: 999px; color: #2872cd; background: #e7f2ff; font-size: 9px; font-weight: 750; }
.trend-result-heading h3 { margin: 7px 0 0; color: #23425f; font-size: 19px; }
.trend-result-heading small { color: #8093a7; font-size: 9px; text-align: right; }
.trend-stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin-bottom: 12px; }
.trend-stat-grid article { padding: 13px 15px; border: 1px solid rgba(255,255,255,.9); border-radius: 14px; background: rgba(255,255,255,.56); }
.trend-stat-grid span, .trend-stat-grid strong { display: block; }
.trend-stat-grid span { color: #7d90a4; font-size: 9px; }
.trend-stat-grid strong { margin-top: 7px; color: #274968; font-size: 16px; }
.trend-chart-shell { overflow-x: auto; padding: 10px 0 0; border: 1px solid rgba(255,255,255,.9); border-radius: 17px; background: linear-gradient(180deg, rgba(255,255,255,.66), rgba(236,246,255,.42)); }
.trend-line-chart { display: block; width: 100%; min-width: 720px; height: auto; overflow: visible; }
.trend-y-tick line { stroke: rgba(121,151,181,.18); stroke-width: 1; }
.trend-y-tick text { fill: #8497a9; font-size: 9px; text-anchor: end; }
.trend-zero-line { stroke: rgba(64,94,123,.34); stroke-width: 1.3; }
.trend-area { fill: rgba(62,137,226,.1); }
.trend-line { fill: none; stroke: #347fdb; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; }
.trend-point { fill: white; stroke: #347fdb; stroke-width: 2.5; transition: r .15s ease, fill .15s ease; }
.trend-point:hover { r: 6px; fill: #ff8748; stroke: white; }
.trend-x-label { fill: #7d91a6; font-size: 9px; text-anchor: middle; }
.trend-details { margin-top: 11px; color: #627b94; font-size: 10px; }
.trend-details summary { padding: 8px 2px; cursor: pointer; font-weight: 700; }
.trend-details table { min-width: 420px; }
.range-dashboard { margin-bottom: 18px; }
.range-dashboard .panel-heading { align-items: center; }
.analysis-export-link { padding: 9px 13px; border-radius: 10px; color: #2874d7; background: rgba(225,240,255,.82); font-size: 10px; font-weight: 760; text-decoration: none; white-space: nowrap; }
.range-filter { grid-template-columns: 1.1fr .82fr .82fr 1.05fr 1.15fr auto; }
.data-source-note { display: flex; align-items: center; gap: 8px; margin: 12px 2px 0; color: #71869c; font-size: 10px; }
.source-dot { width: 8px; height: 8px; border-radius: 50%; background: #f0a143; box-shadow: 0 0 0 4px rgba(240,161,67,.12); }
.source-dot.ready { background: #37ad78; box-shadow: 0 0 0 4px rgba(55,173,120,.12); }
.range-kpis { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.hero-kpi { background: linear-gradient(145deg, rgba(226,242,255,.88), rgba(255,255,255,.63)); }
.selected-trend-panel, .advertising-dashboard, .expense-ledger { margin-bottom: 18px; }
.selected-trend-panel > .panel-heading > span { color: #71869c; font-size: 10px; }
.mini-metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.mini-metric-grid article { min-width: 0; padding: 13px; border: 1px solid rgba(255,255,255,.88); border-radius: 14px; background: rgba(255,255,255,.52); }
.mini-metric-grid span, .mini-metric-grid strong { display: block; }
.mini-metric-grid span { color: #7d90a4; font-size: 9px; }
.mini-metric-grid strong { margin-top: 7px; overflow-wrap: anywhere; color: #274968; font-size: 14px; }
.analysis-detail-table { min-width: 2350px; }
.clean-analysis { max-width: 1440px; }
.clean-analysis-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.clean-analysis-head h1 { margin: 3px 0 5px; font-size: clamp(34px,4vw,50px); }
.clean-analysis-head p:last-child { margin: 0; color: var(--muted); font-size: 12px; }
.analysis-scope { padding: 11px 14px; border-radius: 13px; background: rgba(255,255,255,.54); text-align: right; }
.analysis-scope strong, .analysis-scope span { display: block; }
.analysis-scope strong { color: #294d70; font-size: 13px; }
.analysis-scope span { margin-top: 4px; color: #8093a7; font-size: 9px; }
.analysis-filter-card { margin-bottom: 15px; padding: 12px; border: 1px solid rgba(255,255,255,.9); border-radius: 17px; background: rgba(255,255,255,.58); box-shadow: 0 10px 28px rgba(46,88,131,.08); backdrop-filter: blur(22px); }
.clean-filter { display: grid; grid-template-columns: 1fr .8fr .8fr 1fr 1.15fr auto; align-items: end; gap: 8px; }
.clean-filter label span { display: block; margin: 0 0 6px 3px; color: #7b8fa3; font-size: 8px; font-weight: 760; }
.clean-filter select, .clean-filter input { width: 100%; height: 38px; padding: 0 9px; border: 1px solid rgba(145,170,195,.4); border-radius: 9px; color: #284761; background: rgba(255,255,255,.86); font-size: 10px; }
.clean-filter button { height: 38px; padding: 0 18px; border: 0; border-radius: 9px; color: white; background: #3d82dc; font-size: 10px; font-weight: 760; cursor: pointer; }
.clean-kpis { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 15px; }
.clean-kpis article { padding: 17px 18px; border: 1px solid rgba(255,255,255,.9); border-radius: 17px; background: rgba(255,255,255,.62); box-shadow: 0 9px 24px rgba(51,91,132,.07); }
.clean-kpis article.primary { background: linear-gradient(135deg,rgba(54,126,220,.96),rgba(83,162,235,.91)); }
.clean-kpis span, .clean-kpis strong, .clean-kpis small { display: block; }
.clean-kpis span { color: #7c90a5; font-size: 9px; }
.clean-kpis strong { margin: 9px 0 5px; color: #1f405e; font-size: clamp(19px,2vw,28px); }
.clean-kpis small { color: #8295a9; font-size: 9px; }
.clean-kpis .primary span, .clean-kpis .primary strong, .clean-kpis .primary small { color: white; }
.clean-kpis .primary small { opacity: .72; }
.clean-main-grid { display: grid; grid-template-columns: minmax(0,1fr) 255px; gap: 15px; margin-bottom: 12px; }
.clean-trend-card { min-width: 0; padding: 18px 20px 12px; }
.clean-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.clean-card-head span, .focus-title > span { color: #8194a8; font-size: 8px; font-weight: 760; text-transform: uppercase; }
.clean-card-head h2, .focus-title h2 { margin: 5px 0 0; color: #244662; font-size: 18px; }
.clean-card-head em { padding: 5px 8px; border-radius: 999px; color: #3279cf; background: #eaf4ff; font-size: 8px; font-style: normal; }
.clean-chart { margin-top: 5px; border: 0; background: transparent; }
.focus-card { display: flex; flex-direction: column; padding: 20px; }
.focus-title strong { display: block; margin-top: 26px; color: #246fcf; font-size: 25px; }
.focus-title small { display: block; margin-top: 5px; color: #8a9caf; font-size: 8px; }
.focus-stats { display: grid; gap: 8px; margin-top: 19px; }
.focus-stats div { display: flex; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid rgba(137,163,187,.18); }
.focus-stats span { color: #8396aa; font-size: 9px; }
.focus-stats b { color: #34536f; font-size: 10px; }
.source-status { display: flex; align-items: center; gap: 7px; margin-top: auto; padding-top: 18px; color: #8799aa; font-size: 8px; }
.source-status i { width: 7px; height: 7px; border-radius: 50%; background: #f1a047; }
.source-status i.ready { background: #39ae79; }
.context-strip { display: grid; grid-template-columns: repeat(6,1fr); gap: 1px; overflow: hidden; margin-bottom: 12px; border: 1px solid rgba(255,255,255,.9); border-radius: 15px; background: rgba(182,202,221,.25); }
.context-strip div { padding: 12px 14px; background: rgba(255,255,255,.63); }
.context-strip span, .context-strip strong { display: block; }
.context-strip span { color: #8496a9; font-size: 8px; }
.context-strip strong { margin-top: 6px; color: #2f506d; font-size: 12px; }
.analysis-disclosures { display: grid; gap: 8px; }
.analysis-disclosures details { border: 1px solid rgba(255,255,255,.9); border-radius: 15px; background: rgba(255,255,255,.57); box-shadow: 0 7px 20px rgba(45,84,122,.05); }
.analysis-disclosures summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 17px; cursor: pointer; list-style: none; }
.analysis-disclosures summary::-webkit-details-marker { display: none; }
.analysis-disclosures summary span b, .analysis-disclosures summary span small { display: block; }
.analysis-disclosures summary b { color: #31516e; font-size: 11px; }
.analysis-disclosures summary small { margin-top: 3px; color: #8a9bae; font-size: 8px; }
.analysis-disclosures summary em { color: #3a76bd; font-size: 9px; font-style: normal; }
.analysis-disclosures details[open] summary { border-bottom: 1px solid rgba(137,163,187,.15); }
.analysis-disclosures .table-shell { margin: 12px; }
.compact-cost-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 1px; margin: 12px; overflow: hidden; border-radius: 11px; background: rgba(176,198,218,.25); }
.compact-cost-grid div { padding: 12px; background: rgba(255,255,255,.65); }
.compact-cost-grid span, .compact-cost-grid b { display: block; }
.compact-cost-grid span { color: #8396aa; font-size: 8px; }
.compact-cost-grid b { margin-top: 5px; color: #385874; font-size: 10px; }
.compact-cost-grid b::before { content: "₽ "; color: #8aa0b5; }
.analysis-footer-action { margin-top: 15px; text-align: right; }
.analysis-footer-action a { color: #397bc9; font-size: 9px; text-decoration: none; }
.analysis-tabs { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-bottom: 20px; padding: 6px; border: 1px solid rgba(255,255,255,.9); border-radius: 17px; background: rgba(255,255,255,.44); }
.analysis-tabs a { display: flex; flex-direction: column; padding: 12px 15px; border-radius: 12px; color: #627a92; text-decoration: none; }
.analysis-tabs a.active { color: #246fcf; background: rgba(255,255,255,.9); box-shadow: 0 7px 18px rgba(44,95,153,.1); }
.analysis-tabs b { font-size: 11px; }
.analysis-tabs span { margin-top: 3px; color: #91a1b2; font-size: 8px; }
.function-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 4px 3px 15px; }
.function-heading h2 { margin: 3px 0 5px; color: #24445f; font-size: 23px; }
.function-heading p:last-child { margin: 0; color: #8294a7; font-size: 10px; }
.function-heading > strong { color: #2f78d0; font-size: 14px; }
.daily-date-picker { display:flex; align-items:flex-end; gap:8px; padding:9px 10px 9px 13px; border:1px solid rgba(255,255,255,.94); border-radius:15px; background:rgba(255,255,255,.68); box-shadow:0 10px 28px rgba(61,113,164,.08); }
.daily-date-picker label { align-self:center; color:#71869c; font-size:11px; font-weight:700; }
.daily-date-picker input { min-height:36px; padding:0 10px; border:1px solid #d7e5f2; border-radius:10px; background:rgba(255,255,255,.9); color:#264866; font:inherit; }
.daily-date-picker button { min-height:36px; padding:0 15px; border:0; border-radius:10px; background:linear-gradient(135deg,#4c94e8,#3478e5); color:#fff; font-weight:700; cursor:pointer; box-shadow:0 7px 16px rgba(52,120,229,.2); }
@media (max-width: 760px) { .daily-function-heading { align-items:stretch; flex-direction:column; } .daily-date-picker { align-items:stretch; flex-wrap:wrap; } .daily-date-picker label { width:100%; } .daily-date-picker input { flex:1; } }
.daily-overview-disclosure { overflow: hidden; border: 1px solid rgba(255,255,255,.94); border-radius: 22px; background: rgba(255,255,255,.66); box-shadow: 0 16px 38px rgba(41,83,126,.09); }
.daily-overview-disclosure > summary { position: relative; display: grid; grid-template-columns: 150px 1fr auto; align-items: center; gap: 20px; padding: 24px; cursor: pointer; list-style: none; }
.daily-overview-disclosure > summary::-webkit-details-marker { display: none; }
.daily-summary-title span, .daily-summary-title small { display: block; }
.daily-summary-title span { color: #244661; font-size: 18px; font-weight: 760; }
.daily-summary-title small { margin-top: 6px; color: #8a9bad; font-size: 8px; line-height: 1.5; }
.daily-summary-metrics { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 1px; overflow: hidden; border-radius: 13px; background: rgba(173,196,218,.22); }
.daily-summary-metrics article { padding: 13px; background: rgba(248,252,255,.84); }
.daily-summary-metrics span, .daily-summary-metrics b { display: block; }
.daily-summary-metrics span { color: #8496a9; font-size: 8px; }
.daily-summary-metrics b { margin-top: 6px; color: #294c69; font-size: 13px; }
.daily-overview-disclosure summary > em { color: #2f77ce; font-size: 9px; font-style: normal; white-space: nowrap; }
.daily-overview-disclosure[open] summary { border-bottom: 1px solid rgba(145,169,192,.16); }

/* System health */
.health-main { max-width: 1500px; }
.health-hero { position: relative; min-height: 190px; margin-bottom: 14px; padding: 34px 38px; overflow: hidden; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 30px; border: 1px solid rgba(255,255,255,.9); border-radius: 24px; background: linear-gradient(132deg,rgba(237,249,255,.9),rgba(255,255,255,.7)); box-shadow: 0 20px 46px rgba(43,89,133,.1); }
.health-hero::after { position: absolute; inset: auto -60px -90px auto; width: 310px; height: 210px; border-radius: 50%; background: radial-gradient(circle,rgba(68,153,231,.18),transparent 68%); content: ""; }
.health-hero.warning::after { background: radial-gradient(circle,rgba(244,153,57,.22),transparent 68%); }
.health-hero.danger::after { background: radial-gradient(circle,rgba(224,82,82,.23),transparent 68%); }
.health-hero > div:not(.health-orbit):not(.health-score) { position: relative; z-index: 1; }
.health-hero h1 { margin: 5px 0 8px; color: #24445f; font-size: 30px; }
.health-hero p { max-width: 680px; margin: 0; color: #657d94; font-size: 12px; }
.health-hero small { display: block; margin-top: 17px; color: #8ca0b4; font-size: 9px; }
.health-orbit { position: absolute; width: 230px; height: 230px; right: 170px; opacity: .38; }
.health-orbit span,.health-orbit i,.health-orbit b { position: absolute; inset: 20%; border: 1px solid rgba(48,128,207,.35); border-radius: 50%; animation: health-spin 14s linear infinite; }
.health-orbit i { inset: 31%; border-color: rgba(255,131,51,.45); animation-direction: reverse; animation-duration: 10s; }
.health-orbit b { inset: 44%; border: 0; background: #58b79a; box-shadow: 0 0 30px rgba(88,183,154,.48); }
.health-score { position: relative; z-index: 1; min-width: 210px; padding: 20px 24px; border: 1px solid rgba(255,255,255,.88); border-radius: 18px; text-align: center; background: rgba(255,255,255,.64); backdrop-filter: blur(16px); }
.health-score > strong { display: block; color: #2f9a78; font-size: 42px; line-height: 1; }
.health-score > span { display: block; margin-top: 5px; color: #7890a7; font-size: 9px; }
.health-score > div { margin-top: 15px; display: grid; grid-template-columns: auto auto auto auto; justify-content: center; align-items: baseline; gap: 6px; }
.health-score em { font-size: 15px; font-style: normal; font-weight: 800; }
.health-score em.warning { color: #d88732; }.health-score em.danger { color: #d95757; }
.health-score small { margin: 0; font-size: 8px; }
.health-legend { margin-bottom: 18px; padding: 10px 16px; display: flex; align-items: center; gap: 18px; border: 1px solid rgba(207,222,236,.7); border-radius: 13px; color: #74899d; background: rgba(255,255,255,.55); font-size: 9px; }
.health-legend span { display: inline-flex; align-items: center; gap: 6px; }.health-legend b { margin-left: auto; font-weight: 500; }
.health-legend i,.health-check-top > i { width: 8px; height: 8px; border-radius: 50%; background: #45a989; box-shadow: 0 0 0 4px rgba(69,169,137,.11); }
.health-legend i.warning,.health-check.warning .health-check-top > i { background: #e7953d; box-shadow: 0 0 0 4px rgba(231,149,61,.12); }
.health-legend i.danger,.health-check.danger .health-check-top > i { background: #df5d5d; box-shadow: 0 0 0 4px rgba(223,93,93,.12); }
.health-legend i.preview,.health-check.preview .health-check-top > i { background: #6b9ed3; box-shadow: 0 0 0 4px rgba(107,158,211,.12); }
.health-section { margin-top: 18px; padding: 23px; border: 1px solid rgba(255,255,255,.88); border-radius: 20px; background: rgba(255,255,255,.57); box-shadow: 0 14px 34px rgba(47,86,123,.07); }
.health-section .panel-heading { margin-bottom: 15px; }.health-section .panel-heading span { display: block; margin-top: 4px; color: #8498aa; font-size: 9px; font-weight: 400; }
.health-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 11px; }
.health-check { min-height: 145px; padding: 17px 18px; border: 1px solid rgba(213,227,239,.75); border-radius: 15px; background: rgba(250,253,255,.78); }
.health-check.warning { border-color: rgba(238,180,111,.55); background: rgba(255,249,239,.78); }.health-check.danger { border-color: rgba(230,129,129,.55); background: rgba(255,244,244,.78); }
.health-check-top { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 9px; }
.health-check-top span { color: #607b93; font-size: 9px; font-weight: 700; }.health-check-top em { padding: 3px 7px; border-radius: 99px; color: #278269; background: #e5f6f0; font-size: 7px; font-style: normal; }
.health-check.warning .health-check-top em { color: #a76522; background: #fff0db; }.health-check.danger .health-check-top em { color: #b44141; background: #ffe6e6; }.health-check.preview .health-check-top em { color: #3d70a8; background: #e8f2fc; }
.health-check > strong { display: block; margin: 18px 0 8px; color: #284e6d; font-size: 19px; }.health-check > p { margin: 0; color: #7e91a4; font-size: 9px; line-height: 1.55; }.health-check > small { display: block; margin-top: 9px; color: #c46d2f; font-size: 8px; }
@keyframes health-spin { to { transform: rotate(360deg); } }

@media (max-width: 1050px) { .health-grid { grid-template-columns: 1fr 1fr; }.health-hero { grid-template-columns: 1fr; }.health-score { width: 100%; }.health-orbit { right: 40px; } }
@media (max-width: 650px) { .health-main { padding-inline: 12px; }.health-hero { padding: 25px 21px; }.health-grid { grid-template-columns: 1fr; }.health-legend { flex-wrap: wrap; }.health-legend b { width: 100%; margin-left: 0; }.health-section { padding: 17px; } }
.daily-detail-body { padding: 14px 18px 18px; }
.daily-source-line { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; color: #8194a8; font-size: 8px; }
.daily-source-line i { padding: 4px 7px; border-radius: 99px; color: #b06b29; background: #fff1df; font-style: normal; }
.daily-source-line i.ready { color: #277c5b; background: #e6f7ef; }
.daily-full-table { min-width: 1900px; }
.range-analysis-filter { display: grid; grid-template-columns: 1fr .8fr .8fr 1fr 1.15fr auto; align-items: end; gap: 9px; }
.range-analysis-filter label span { display: block; margin: 0 0 6px 3px; color: #7b8fa3; font-size: 8px; font-weight: 760; }
.range-analysis-filter select, .range-analysis-filter input { width: 100%; height: 40px; padding: 0 10px; border: 1px solid rgba(145,170,195,.4); border-radius: 9px; color: #284761; background: rgba(255,255,255,.86); }
.range-analysis-filter button { height: 40px; padding: 0 18px; border: 0; border-radius: 9px; color: white; background: #3d82dc; font-weight: 760; }
.range-data-details { padding: 14px 18px; border: 1px solid rgba(255,255,255,.9); border-radius: 15px; background: rgba(255,255,255,.56); color: #3975bc; font-size: 10px; }
.range-data-details summary { cursor: pointer; font-weight: 700; }
.range-data-details .table-shell { margin-top: 13px; }
.finance-linked-kpis { grid-template-columns: repeat(5, minmax(0,1fr)); }
.finance-linked-kpis .delivery-fee-kpi { border-color: rgba(255,138,52,.32); background: rgba(255,247,238,.76); }
.finance-linked-kpis .delivery-fee-kpi strong { color: #de6c1d; }
.finance-linked-kpis .true-profit-kpi { border-color: rgba(52,120,229,.34); background: rgba(236,246,255,.84); }
.finance-reconciliation { display:flex; align-items:center; gap:14px; margin:0 0 18px; padding:16px 20px; border:1px solid rgba(255,255,255,.94); border-radius:18px; background:rgba(255,255,255,.62); box-shadow:0 12px 32px rgba(64,111,159,.08); }
.finance-reconciliation > div { flex:1; display:flex; flex-direction:column; gap:5px; }
.finance-reconciliation span { color:#71869c; font-size:12px; }
.finance-reconciliation strong { color:#203e5d; font-size:16px; }
.finance-reconciliation > b { color:#9ab0c5; font-size:20px; }
.finance-reconciliation .result { padding:10px 14px; border-radius:13px; background:linear-gradient(135deg,rgba(232,244,255,.92),rgba(255,255,255,.9)); }
.finance-warning { margin-bottom:18px; }
@media (max-width: 1000px) { .finance-linked-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .finance-reconciliation { align-items:stretch; flex-direction:column; } .finance-reconciliation > b { display:none; } }
.multi-analysis-filter { display: grid; gap: 13px; }
.range-filter-row { display: grid; grid-template-columns: 1fr .8fr .8fr 1fr auto; align-items: end; gap: 9px; }
.range-filter-row label span { display: block; margin: 0 0 6px 3px; color: #7b8fa3; font-size: 8px; font-weight: 760; }
.range-filter-row select, .range-filter-row input { width: 100%; height: 40px; padding: 0 10px; border: 1px solid rgba(145,170,195,.4); border-radius: 9px; color: #284761; background: rgba(255,255,255,.86); }
.range-filter-row button { height: 40px; padding: 0 18px; border: 0; border-radius: 9px; color: white; background: #3d82dc; font-weight: 760; cursor: pointer; }
.metric-multi-picker { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 12px; border: 1px solid rgba(145,170,195,.23); border-radius: 12px; }
.metric-multi-picker legend { padding: 0 6px; color: #758ba1; font-size: 8px; font-weight: 760; }
.metric-multi-picker label { position: relative; cursor: pointer; }
.metric-multi-picker input { position: absolute; opacity: 0; pointer-events: none; }
.metric-multi-picker span { display: block; padding: 7px 9px; border: 1px solid rgba(138,165,190,.26); border-radius: 8px; color: #5b748d; background: rgba(255,255,255,.54); font-size: 8px; }
.metric-multi-picker input:checked + span { border-color: #3c82d9; color: #246ec8; background: #e9f3ff; box-shadow: inset 0 0 0 1px rgba(60,130,217,.08); }
.comparison-panel { margin-bottom: 12px; }
.comparison-panel .clean-card-head p { margin: 5px 0 0; color: #8395a8; font-size: 8px; }
.comparison-legend { display: flex; flex-wrap: wrap; gap: 12px; margin: 10px 0 2px; }
.comparison-legend span { display: flex; align-items: center; gap: 5px; color: #647b91; font-size: 8px; }
.comparison-legend i, .comparison-stat-grid i { width: 8px; height: 8px; border-radius: 50%; }
.comparison-line { fill: none; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.comparison-point { fill: white; stroke-width: 2; }
.comparison-line.series-0, .comparison-point.series-0 { stroke: #347fdb; }
.comparison-line.series-1, .comparison-point.series-1 { stroke: #f08045; }
.comparison-line.series-2, .comparison-point.series-2 { stroke: #31a77a; }
.comparison-line.series-3, .comparison-point.series-3 { stroke: #8a6de0; }
.comparison-line.series-4, .comparison-point.series-4 { stroke: #e05267; }
.comparison-line.series-5, .comparison-point.series-5 { stroke: #30a6b8; }
.series-0 i { background: #347fdb; }.series-1 i { background: #f08045; }
.series-2 i { background: #31a77a; }.series-3 i { background: #8a6de0; }
.series-4 i { background: #e05267; }.series-5 i { background: #30a6b8; }
.comparison-stat-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 7px; margin-top: 8px; }
.comparison-stat-grid article { display: grid; grid-template-columns: auto 1fr; gap: 4px 7px; padding: 11px; border: 1px solid rgba(145,170,195,.2); border-radius: 11px; background: rgba(255,255,255,.5); }
.comparison-stat-grid i { grid-row: 1 / 4; margin-top: 2px; }
.comparison-stat-grid span { color: #71879b; font-size: 8px; }
.comparison-stat-grid strong { color: #2c506f; font-size: 12px; }
.comparison-stat-grid small { color: #8b9bad; font-size: 8px; }
.hub-export-form { display: grid; gap: 11px; }
.hub-export-form > section { padding: 18px; border: 1px solid rgba(255,255,255,.92); border-radius: 18px; background: rgba(255,255,255,.62); box-shadow: 0 9px 26px rgba(48,89,130,.06); }
.hub-export-form section > header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.hub-export-form header > b { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 9px; color: white; background: #3c80d8; font-size: 10px; }
.hub-export-form h3, .hub-export-form header p { margin: 0; }
.hub-export-form h3 { color: #2a4a66; font-size: 14px; }
.hub-export-form header p { margin-top: 3px; color: #899bad; font-size: 8px; }
.export-date-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; max-width: 650px; }
.export-date-pair label { color: #7d90a4; font-size: 8px; }
.export-date-pair input { display: block; width: 100%; height: 39px; margin-top: 6px; padding: 0 10px; border: 1px solid rgba(145,170,195,.4); border-radius: 9px; background: rgba(255,255,255,.86); }
.select-all-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; color: #315777; font-size: 10px; font-weight: 700; }
.compact-picker { display: grid; grid-template-columns: repeat(6,1fr); gap: 6px; max-height: 170px; overflow-y: auto; }
.compact-picker label { display: flex; align-items: center; gap: 6px; padding: 8px; border: 1px solid rgba(149,175,199,.26); border-radius: 9px; color: #49677f; background: rgba(255,255,255,.55); font-size: 8px; }
.compact-picker label.is-disabled { opacity: .42; }
.hub-export-action { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 20px; border-radius: 17px; color: white; background: linear-gradient(135deg,#2f75ce,#529ce8); }
.hub-export-action strong, .hub-export-action span { display: block; }
.hub-export-action strong { font-size: 13px; }
.hub-export-action span { margin-top: 4px; color: rgba(255,255,255,.72); font-size: 8px; }
.hub-export-action button { padding: 11px 17px; border: 0; border-radius: 10px; color: #2d6ebb; background: white; font-weight: 760; cursor: pointer; }
.analysis-overview { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.health-score-card, .analysis-kpi, .analysis-panel { border: 1px solid rgba(255,255,255,.92); background: linear-gradient(145deg, rgba(255,255,255,.73), rgba(241,248,255,.52)); box-shadow: var(--glass-shadow); backdrop-filter: blur(28px) saturate(165%); }
.health-score-card { display: flex; align-items: center; gap: 15px; min-height: 142px; padding: 20px; border-radius: 21px; color: white; background: linear-gradient(135deg, rgba(49,119,220,.95), rgba(80,159,235,.86)); }
.health-score-card.score-watch { background: linear-gradient(135deg, rgba(245,132,45,.96), rgba(255,174,82,.88)); }
.health-score-card.score-risk { background: linear-gradient(135deg, rgba(225,72,72,.96), rgba(250,116,74,.88)); }
.health-score-card h2, .health-score-card p { margin: 0; color: white; }
.health-score-card h2 { margin: 3px 0 5px; font-size: 22px; }
.health-score-card small { color: rgba(255,255,255,.77); font-size: 10px; line-height: 1.5; }
.score-ring { --score: 0; display: grid; flex: 0 0 82px; width: 82px; height: 82px; place-content: center; border-radius: 50%; background: radial-gradient(circle at center, rgba(35,101,190,.96) 57%, transparent 59%), conic-gradient(white calc(var(--score) * 1%), rgba(255,255,255,.22) 0); text-align: center; }
.score-watch .score-ring { background: radial-gradient(circle at center, rgba(225,111,32,.96) 57%, transparent 59%), conic-gradient(white calc(var(--score) * 1%), rgba(255,255,255,.22) 0); }
.score-risk .score-ring { background: radial-gradient(circle at center, rgba(207,61,61,.96) 57%, transparent 59%), conic-gradient(white calc(var(--score) * 1%), rgba(255,255,255,.22) 0); }
.score-ring strong, .score-ring span { display: block; }
.score-ring strong { font-size: 25px; line-height: 1; }
.score-ring span { margin-top: 3px; color: rgba(255,255,255,.72); font-size: 9px; }
.analysis-kpi { min-width: 0; padding: 19px; border-radius: 19px; }
.analysis-kpi span, .analysis-kpi strong, .analysis-kpi small { display: block; }
.analysis-kpi span { color: var(--muted); font-size: 10px; }
.analysis-kpi strong { margin: 12px 0 8px; overflow-wrap: anywhere; color: #193553; font-size: clamp(18px, 1.6vw, 25px); }
.analysis-kpi small { color: #7e91a8; font-size: 10px; line-height: 1.5; }
.score-breakdown { margin-bottom: 18px; }
.score-breakdown > .panel-heading > strong { color: #2b72d3; font-size: 22px; }
.score-components { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.score-component { padding: 14px; border: 1px solid rgba(255,255,255,.9); border-radius: 15px; background: rgba(255,255,255,.54); }
.score-component > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.score-component span { color: #5f7690; font-size: 10px; font-weight: 700; }
.score-component strong { color: #2b70cb; font-size: 18px; }
.score-component strong small { color: #8da0b5; font-size: 9px; }
.score-component meter { width: 100%; height: 11px; margin-top: 9px; }
.score-component meter::-webkit-meter-bar { border: 0; border-radius: 99px; background: rgba(203,218,233,.58); }
.score-component meter::-webkit-meter-optimum-value { border-radius: 99px; background: linear-gradient(90deg, #5aa0ee, #3179dc); }
.score-component.profit meter::-webkit-meter-optimum-value { background: linear-gradient(90deg, #4fbea0, #2f9a78); }
.score-component.ads meter::-webkit-meter-optimum-value { background: linear-gradient(90deg, #8c96ef, #6270d8); }
.score-component.stock meter::-webkit-meter-optimum-value { background: linear-gradient(90deg, #ffad5f, #f07c45); }
.score-component.freshness meter::-webkit-meter-optimum-value { background: linear-gradient(90deg, #51bda7, #309889); }
.score-component p { margin: 6px 0 0; color: #8395a8; font-size: 9px; line-height: 1.4; }
.analysis-grid { display: grid; grid-template-columns: 1.35fr .85fr; gap: 18px; margin-bottom: 18px; }
.analysis-panel { padding: 25px; border-radius: 23px; }
.analysis-panel .panel-heading { margin-bottom: 18px; }
.analysis-panel .panel-heading h2, .analysis-panel .panel-heading p { margin: 0; }
.analysis-panel .panel-heading p:last-child { margin-top: 7px; color: var(--muted); font-size: 10px; }
.analysis-bars { display: grid; gap: 7px; }
.analysis-bar-row { display: grid; grid-template-columns: 42px minmax(100px, 1fr) 105px 92px; align-items: center; gap: 9px; font-size: 10px; }
.analysis-bar-row > span { color: var(--muted); }
.analysis-bar-row meter { width: 100%; height: 15px; }
.analysis-bar-row meter::-webkit-meter-bar { border: 0; border-radius: 99px; background: rgba(205,219,231,.55); }
.analysis-bar-row meter::-webkit-meter-optimum-value { border-radius: 99px; background: linear-gradient(90deg, #5598ec, #2775dc); }
.analysis-bar-row strong, .analysis-bar-row small { text-align: right; white-space: nowrap; }
.analysis-bar-row strong { color: #38546f; font-size: 10px; }
.diagnosis-list { display: grid; gap: 11px; }
.diagnosis-item { display: grid; grid-template-columns: 10px 1fr; gap: 12px; padding: 13px; border-radius: 14px; background: rgba(255,255,255,.55); }
.diagnosis-item i { width: 9px; height: 9px; margin-top: 5px; border-radius: 50%; background: #42b982; box-shadow: 0 0 0 5px rgba(66,185,130,.11); }
.diagnosis-item.warning i { background: #f0804e; box-shadow: 0 0 0 5px rgba(240,128,78,.12); }
.diagnosis-item strong { color: #284761; font-size: 12px; }
.diagnosis-item p { margin: 4px 0 0; color: #73879d; font-size: 10px; line-height: 1.55; }
.product-map-panel, .action-panel { margin-top: 18px; }
.portfolio-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 11px; margin-bottom: 18px; }
.portfolio-card { position: relative; overflow: hidden; padding: 17px; border: 1px solid rgba(255,255,255,.88); border-radius: 16px; background: rgba(255,255,255,.56); }
.portfolio-card::after { position: absolute; width: 70px; height: 70px; right: -20px; bottom: -25px; border-radius: 50%; background: #5798eb; opacity: .12; content: ""; }
.portfolio-card.potential::after { background: #42b982; }
.portfolio-card.traffic::after { background: #ff9e43; }
.portfolio-card.optimize::after { background: #ef6464; }
.portfolio-card span { color: var(--muted); font-size: 9px; }
.portfolio-card strong { display: block; margin-top: 8px; color: #1e4267; font-size: 29px; }
.portfolio-card h3 { margin: 2px 0 0; color: #46647f; font-size: 11px; }
.analysis-table { min-width: 980px; }
.portfolio-badge, .action-type { display: inline-block; padding: 5px 9px; border-radius: 999px; font-size: 9px; font-weight: 750; }
.portfolio-badge.star { color: #216bc7; background: #e8f2ff; }
.portfolio-badge.potential { color: #23835d; background: #e5f8ef; }
.portfolio-badge.traffic { color: #b6651d; background: #fff1df; }
.portfolio-badge.optimize { color: #b84e4e; background: #ffe9e9; }
.action-list { display: grid; gap: 10px; }
.action-item { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; align-items: center; gap: 15px; padding: 15px 17px; border: 1px solid rgba(255,255,255,.86); border-radius: 15px; background: rgba(255,255,255,.54); }
.action-item .action-type { color: #a85d20; background: #fff0df; text-align: center; }
.action-item.urgent .action-type { color: #b34141; background: #ffe8e8; }
.action-item.opportunity .action-type { color: #217557; background: #e4f7ee; }
.action-item strong { color: #284761; font-size: 12px; }
.action-item p { margin: 4px 0 0; color: #75889e; font-size: 10px; }
.action-item b { color: #3b5872; font-size: 10px; white-space: nowrap; }

@media (max-width: 1180px) {
  .range-filter-row { grid-template-columns: 1fr 1fr; }
  .range-filter-row button { grid-column: span 2; }
  .daily-overview-disclosure > summary { grid-template-columns: 1fr; }
  .daily-summary-metrics { grid-template-columns: repeat(3,1fr); }
  .range-analysis-filter { grid-template-columns: 1fr 1fr; }
  .range-analysis-filter button { grid-column: span 2; }
  .compact-picker { grid-template-columns: repeat(4,1fr); }
  .clean-filter { grid-template-columns: repeat(3,1fr); }
  .clean-filter button { grid-column: span 3; }
  .context-strip { grid-template-columns: repeat(3,1fr); }
  .trend-filter { grid-template-columns: 1fr 1fr; }
  .trend-filter button { grid-column: span 2; }
  .analysis-overview { grid-template-columns: repeat(4, 1fr); }
  .range-kpis { grid-template-columns: repeat(3, 1fr); }
  .health-score-card { grid-column: 1 / -1; }
  .score-components { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 860px) {
  .clean-main-grid { grid-template-columns: 1fr; }
  .clean-kpis { grid-template-columns: 1fr 1fr; }
  .compact-cost-grid { grid-template-columns: repeat(3,1fr); }
  .analysis-grid { grid-template-columns: 1fr; }
  .analysis-overview { grid-template-columns: 1fr 1fr; }
  .range-kpis { grid-template-columns: 1fr 1fr; }
  .mini-metric-grid { grid-template-columns: 1fr 1fr; }
  .health-score-card { grid-column: 1 / -1; }
  .portfolio-cards { grid-template-columns: 1fr 1fr; }
  .score-components { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .range-filter-row { grid-template-columns: 1fr; }
  .range-filter-row button { grid-column: auto; }
  .analysis-tabs { grid-template-columns: 1fr; }
  .daily-summary-metrics { grid-template-columns: 1fr 1fr; }
  .range-analysis-filter { grid-template-columns: 1fr; }
  .range-analysis-filter button { grid-column: auto; }
  .compact-picker { grid-template-columns: 1fr 1fr; }
  .export-date-pair { grid-template-columns: 1fr; }
  .hub-export-action { align-items: stretch; flex-direction: column; }
  .clean-analysis-head { align-items: stretch; flex-direction: column; }
  .analysis-scope { text-align: left; }
  .clean-filter { grid-template-columns: 1fr; }
  .clean-filter button { grid-column: auto; }
  .clean-kpis, .context-strip { grid-template-columns: 1fr 1fr; }
  .compact-cost-grid { grid-template-columns: 1fr 1fr; }
  .analysis-hero { align-items: stretch; flex-direction: column; }
  .analysis-date { text-align: left; }
  .trend-filter { grid-template-columns: 1fr; }
  .trend-filter button { grid-column: auto; }
  .trend-result-heading { align-items: flex-start; flex-direction: column; }
  .trend-result-heading small { text-align: left; }
  .trend-stat-grid { grid-template-columns: 1fr 1fr; }
  .analysis-overview { grid-template-columns: 1fr; }
  .range-kpis { grid-template-columns: 1fr; }
  .health-score-card { grid-column: auto; }
  .analysis-panel { padding: 19px; }
  .score-components { grid-template-columns: 1fr; }
  .analysis-bar-row { grid-template-columns: 38px 1fr 82px; }
  .analysis-bar-row small { display: none; }
  .action-item { grid-template-columns: 52px 1fr; }
  .action-item b { grid-column: 2; }
}

/* Business data export */
.export-main { max-width: 1280px; padding-bottom: 72px; }
.export-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 24px; }
.export-heading h1 { margin: 4px 0 8px; font-size: clamp(34px, 4vw, 52px); }
.export-available { min-width: 245px; padding: 15px 18px; border: 1px solid rgba(255,255,255,.92); border-radius: 17px; background: rgba(255,255,255,.62); box-shadow: var(--glass-shadow); text-align: right; backdrop-filter: blur(24px); }
.export-available span, .export-available strong { display: block; }
.export-available span { color: var(--muted); font-size: 10px; }
.export-available strong { margin-top: 6px; color: #2d72cd; font-size: 14px; }
.export-form-card { overflow: hidden; border: 1px solid rgba(255,255,255,.94); border-radius: 25px; background: linear-gradient(145deg, rgba(255,255,255,.76), rgba(241,248,255,.54)); box-shadow: var(--glass-shadow); backdrop-filter: blur(30px) saturate(165%); }
.export-step { display: grid; grid-template-columns: 58px 1fr; gap: 20px; padding: 28px 30px; border-bottom: 1px solid rgba(207,222,236,.72); }
.export-step-number { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 15px; color: white; background: linear-gradient(135deg, #4a91eb, #2d72d4); box-shadow: 0 10px 24px rgba(45,114,212,.2); font-size: 11px; font-weight: 800; }
.export-step-number.orange { background: linear-gradient(135deg, #ffad5c, #f37c35); box-shadow: 0 10px 24px rgba(243,124,53,.2); }
.export-step-body { min-width: 0; }
.export-step .panel-heading { margin-bottom: 20px; }
.export-step .panel-heading h2 { margin: 2px 0 0; font-size: 22px; }
.export-period-grid { display: grid; grid-template-columns: minmax(220px, 1fr) 38px minmax(220px, 1fr); align-items: end; gap: 16px; max-width: 760px; }
.export-period-grid label, .export-search-wrap label { color: #627990; font-size: 10px; font-weight: 700; }
.export-period-grid input, .export-search-wrap input { display: block; width: 100%; margin-top: 8px; padding: 13px 14px; border: 1px solid rgba(185,207,229,.9); border-radius: 12px; color: #24435f; background: rgba(255,255,255,.78); box-shadow: inset 0 1px 0 white; font: inherit; }
.export-period-grid input:focus, .export-search-wrap input:focus { border-color: #68a4eb; outline: 3px solid rgba(75,143,226,.12); }
.export-date-arrow { padding-bottom: 13px; color: #6c8bab; font-size: 19px; text-align: center; }
.export-all-option { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid rgba(119,171,229,.48); border-radius: 14px; background: linear-gradient(135deg, rgba(230,242,255,.88), rgba(255,255,255,.64)); cursor: pointer; }
.export-all-option input, .product-option input { width: 17px; height: 17px; accent-color: #347fe0; }
.export-all-option span, .export-all-option strong, .export-all-option small { display: block; }
.export-all-option strong { color: #245990; font-size: 12px; }
.export-all-option small { margin-top: 3px; color: #7d91a6; font-size: 9px; }
.export-search-wrap { display: block; max-width: 390px; margin-top: 18px; }
.product-picker { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); max-height: 310px; margin-top: 14px; padding: 10px; overflow: auto; gap: 8px; border: 1px solid rgba(203,219,234,.8); border-radius: 15px; background: rgba(245,250,255,.48); }
.product-option { display: flex; min-width: 0; align-items: center; gap: 9px; padding: 10px 11px; border: 1px solid rgba(255,255,255,.92); border-radius: 10px; color: #385772; background: rgba(255,255,255,.66); cursor: pointer; font-size: 10px; }
.product-option[hidden] { display: none; }
.product-option span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-option:has(input:checked) { border-color: rgba(70,139,221,.55); color: #2167b9; background: #eaf4ff; }
.product-option.is-disabled { opacity: .48; cursor: default; }
.export-action { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 30px; }
.export-file-preview { display: flex; min-width: 0; align-items: center; gap: 13px; }
.export-file-icon { display: grid; flex: 0 0 48px; height: 48px; place-items: center; border-radius: 13px; color: white; background: linear-gradient(135deg, #42ae86, #258967); font-size: 9px; font-weight: 850; }
.export-file-preview strong, .export-file-preview small { display: block; }
.export-file-preview strong { color: #294861; font-size: 12px; }
.export-file-preview small { margin-top: 5px; color: #7b8fa3; font-size: 9px; line-height: 1.45; }
.export-submit { min-width: 235px; padding: 14px 18px; border: 0; border-radius: 13px; color: white; background: linear-gradient(135deg, #4b91ea, #2c70cf); box-shadow: 0 12px 28px rgba(44,112,207,.22); font-weight: 800; cursor: pointer; }
.export-submit span { margin-left: 9px; font-size: 16px; }
.export-submit:hover { transform: translateY(-1px); box-shadow: 0 15px 32px rgba(44,112,207,.28); }
.export-submit:disabled { opacity: .5; cursor: not-allowed; }
.export-note { margin: 0; padding: 0 30px 24px; color: #8797a8; font-size: 9px; text-align: right; }

@media (max-width: 980px) {
  .product-picker { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .export-heading { align-items: stretch; flex-direction: column; }
  .export-available { text-align: left; }
  .export-step { grid-template-columns: 1fr; padding: 22px; }
  .export-period-grid { grid-template-columns: 1fr; }
  .export-date-arrow { display: none; }
  .product-picker { grid-template-columns: 1fr 1fr; }
  .export-action { align-items: stretch; flex-direction: column; padding: 22px; }
  .export-submit { width: 100%; }
  .export-note { padding: 0 22px 22px; text-align: left; }
}

/* Unified inventory management */
.inventory-tabs { display: flex; width: max-content; max-width: 100%; gap: 5px; margin: -8px 0 22px; padding: 5px; border-radius: 14px; background: rgba(213,229,244,.7); }
.inventory-tabs a { padding: 9px 17px; border-radius: 10px; color: #617a92; font-size: 11px; font-weight: 750; text-decoration: none; }
.inventory-tabs a.active { color: #244b72; background: rgba(255,255,255,.88); box-shadow: 0 5px 16px rgba(45,92,137,.12); }
.inventory-stage-metrics { grid-template-columns: repeat(5, minmax(0, 1fr)); margin-bottom: 22px; }
.inventory-entry-panel, .contract-card { margin-bottom: 18px; border: 1px solid rgba(255,255,255,.9); border-radius: 20px; background: rgba(255,255,255,.62); box-shadow: var(--glass-shadow); backdrop-filter: blur(24px); }
.inventory-entry-panel > summary { padding: 18px 22px; color: #294c6b; cursor: pointer; font-size: 13px; font-weight: 800; }
.inventory-entry-form { padding: 0 22px 22px; }
.inventory-form-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.inventory-entry-form label, .inspection-form label, .shipment-item-lines label { color: #607990; font-size: 10px; font-weight: 700; }
.inventory-entry-form input, .inspection-form input, .shipment-item-lines input { display: block; width: 100%; margin-top: 6px; padding: 10px 11px; border: 1px solid rgba(185,207,229,.9); border-radius: 10px; color: #24435f; background: rgba(255,255,255,.82); font: inherit; }
.contract-lines { margin: 18px 0; }
.contract-lines > strong { color: #345674; font-size: 11px; }
.contract-lines > div, .shipment-item-lines > div { display: grid; grid-template-columns: minmax(180px,2fr) minmax(110px,1fr); gap: 12px; margin-top: 8px; }
.inventory-entry-form > button, .inspection-form button { padding: 11px 15px; border: 0; border-radius: 10px; color: white; background: linear-gradient(135deg,#4b91ea,#2c70cf); font: inherit; font-weight: 750; cursor: pointer; }
.inventory-contract-summary { margin: 20px 0; }
.contract-list { display: grid; gap: 18px; }
.contract-card { overflow: hidden; }
.contract-card > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 19px 22px; }
.contract-card > header span { color: #2f7d62; font-size: 9px; font-weight: 800; }
.contract-card h2 { margin: 4px 0; color: #234766; font-size: 17px; }
.contract-card header p { margin: 0; color: #7a8ea2; font-size: 10px; }
.contract-card header > strong { color: #347fdc; font-size: 18px; }
.inspection-form { display: grid; min-width: 300px; grid-template-columns: 90px 132px minmax(170px,1fr); align-items: end; gap: 8px; }
.inspection-form button { grid-column: 1 / -1; }
.document-link { display: block; max-width: 230px; margin: 3px 0; overflow: hidden; color: #347fdc; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.muted-copy { color: #8799aa; font-size: 9px; }
.shipment-item-lines { display: grid; gap: 2px; }
.shipment-item-readonly, .shipment-products { display: flex; flex-wrap: wrap; gap: 8px; }
.shipment-item-readonly span, .shipment-products strong { padding: 7px 10px; border-radius: 9px; color: #315d87; background: rgba(224,239,255,.8); font-size: 10px; }
.shipment-products { align-items: center; padding: 12px 0; }
.shipment-products > span { color: #8192a3; font-size: 9px; }
.shipment-products > div { display: flex; flex-wrap: wrap; gap: 7px; }
.shipment-products em { color: #8b9baa; font-size: 9px; font-style: normal; }
@media (max-width: 900px) {
  .inventory-stage-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .inventory-form-grid { grid-template-columns: 1fr 1fr; }
  .inspection-form { min-width: 240px; grid-template-columns: 1fr; }
  .inspection-form button { grid-column: auto; }
}
@media (max-width: 600px) {
  .inventory-stage-metrics, .inventory-form-grid { grid-template-columns: 1fr; }
  .contract-lines > div, .shipment-item-lines > div { grid-template-columns: 1fr; }
  .contract-card > header { align-items: flex-start; flex-direction: column; }
}

/* Amazon Japan workspace - palette derived from the NISSIN identity. */
.store-amazon {
  --blue: #34589a;
  --orange: #d6282d;
  --green: #28683a;
  background:
    radial-gradient(circle at 8% 8%, rgba(52,88,154,.15), transparent 30rem),
    radial-gradient(circle at 92% 18%, rgba(214,40,45,.10), transparent 27rem),
    radial-gradient(circle at 66% 88%, rgba(40,104,58,.10), transparent 31rem),
    linear-gradient(145deg, #f5f7fb 0%, #fff 50%, #f8faf8 100%);
}
.store-amazon .portal-header {
  border-color: rgba(255,255,255,.94);
  background: linear-gradient(135deg, rgba(255,255,255,.88), rgba(246,248,251,.76));
  box-shadow: 0 18px 48px rgba(52,88,154,.13), inset 0 1px 0 #fff;
}
.store-amazon .portal-brand { color:#294c88; }
.store-amazon .store-switcher { background:rgba(244,246,249,.86); border-color:rgba(52,88,154,.16); }
.store-amazon .store-switcher a.active { color:#9f2025; box-shadow:0 3px 10px rgba(214,40,45,.12); }
.store-amazon .portal-nav a:hover { color:#34589a; background:rgba(52,88,154,.07); }
.store-amazon .portal-nav a.active { color:#294c88; background:rgba(255,255,255,.9); box-shadow:0 8px 20px rgba(52,88,154,.12), inset 0 1px 0 white; }
.store-amazon .portal-nav a.active::after { background:#d6282d; }
.store-amazon .report-heading .eyebrow,
.store-amazon .section-heading .eyebrow { color:#d6282d; }
.store-amazon .report-heading h1,
.store-amazon .section-heading h2 { color:#294c88; }
.store-amazon .metric-card { border-color:rgba(52,88,154,.12); box-shadow:0 16px 36px rgba(52,88,154,.08); }
.store-amazon .metric-card strong { color:#294c88; }
.store-amazon .metric-card:nth-child(4) strong,
.store-amazon .stock-total { color:#28683a; }
.store-amazon .report-alert { border-color:rgba(214,40,45,.18); background:rgba(255,248,248,.86); color:#8f2529; }
.store-amazon .inventory-table thead { background:rgba(52,88,154,.06); }
.store-amazon .inventory-table tbody tr:hover { background:rgba(40,104,58,.045); }
.store-amazon .finance-component strong,
.store-amazon .finance-component small { display:block; }
.store-amazon .finance-component small { margin-top:3px; color:#77899d; }

@media (max-width: 760px) {
  .brand-zone { min-width:0; }
  .portal-brand { font-size:12px; }
  .header-logo.nissin-logo { width:72px; height:39px; }
  .store-switcher a { padding:4px 6px; }
}