/* Hallmark · genre: modern-minimal · macrostructure: Index-First Console · design-system: design.md · designed-as-app
 * theme: custom · vibe: "clear, compact, operational, trustworthy" · nav: N3 task rail (user-directed) · footer: none
 * knob delta: independent enterprise rail, grouped purchase tasks, compact page context, mobile drawer
 * pre-emit critique: P5 H5 E5 S5 R5 V4 · contrast: pass (40–41) · nav: N3 · footer: none
 * honest: pass (46) · chrome: pass (47) · tokens: pass (48) · responsive: pass (49) · icons: pass (30) · mobile: pass (34, 49–57) · slop: pass (1–58)
 */
@import url("../shared/base.06b0b7a85678.css");

.portal-layout { min-height: 100dvh; }
.portal-workspace { min-width: 0; }
.portal-rail {
  position: fixed;
  z-index: var(--z-modal);
  inset: 0 auto 0 0;
  display: flex;
  width: min(var(--portal-rail), calc(100% - 3rem));
  flex-direction: column;
  border-inline-end: var(--rule-thin) solid var(--color-rule);
  opacity: 0;
  overflow-y: auto;
  pointer-events: none;
  transform: translateX(-101%);
  background: var(--color-paper-2);
  box-shadow: var(--shadow-float);
  transition: transform var(--dur-short) var(--ease-out), opacity var(--dur-short) var(--ease-out);
}
body.portal-nav-open .portal-rail { opacity: 1; pointer-events: auto; transform: translateX(0); }

.portal-brand {
  display: grid;
  min-height: calc(var(--control-height) + var(--space-lg));
  align-content: center;
  gap: var(--space-2xs);
  padding: var(--space-md) var(--space-lg);
  color: var(--color-ink);
  font-family: var(--font-wordmark);
  text-decoration: none;
}
.portal-brand strong { font-size: var(--text-lg); letter-spacing: -0.025em; }
.portal-brand span { color: var(--color-muted); font-family: var(--font-body); font-size: var(--text-xs); font-weight: 500; }
.portal-nav { display: grid; gap: var(--space-3xs); padding: 0 var(--space-sm) var(--space-md); }
.portal-nav__label { padding: var(--space-sm) var(--space-sm) var(--space-2xs); color: var(--color-muted); font-size: var(--text-xs); font-weight: 650; }
.portal-nav a {
  display: flex;
  min-height: var(--control-height);
  align-items: center;
  padding-inline: var(--space-md);
  border-radius: var(--radius-sm);
  color: var(--color-neutral);
  font-size: var(--text-sm);
  font-weight: 550;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}
.portal-nav a[aria-current="page"] { background: var(--color-paper-raised); color: var(--color-ink); box-shadow: var(--shadow-card); font-weight: 650; }
.portal-nav a:active { background: var(--color-paper-3); }
.portal-rail__footer { display: grid; gap: var(--space-xs); margin-block-start: auto; padding: var(--space-md) var(--space-lg); border-block-start: var(--rule-thin) solid var(--color-rule); }
.portal-rail__footer strong,
.portal-rail__footer small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.portal-topbar {
  position: sticky;
  z-index: var(--z-sticky);
  inset-block-start: 0;
  display: flex;
  min-height: calc(var(--control-height) + var(--space-md));
  align-items: center;
  gap: var(--space-md);
  padding-inline: var(--space-md);
  border-block-end: var(--rule-thin) solid var(--color-rule);
  background: var(--color-frosted-header);
  backdrop-filter: saturate(180%) blur(24px);
  -webkit-backdrop-filter: saturate(180%) blur(24px);
}
.portal-topbar__title { display: grid; min-width: 0; gap: var(--space-3xs); }
.portal-topbar__title strong,
.portal-topbar__title small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-topbar__title strong { font-size: var(--text-md); }
.portal-topbar__title small { color: var(--color-muted); }
.portal-topbar__status { display: flex; min-width: 0; align-items: center; gap: var(--space-sm); margin-inline-start: auto; }
.portal-topbar__status > small { display: none; max-width: 15rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.button.portal-menu-button { padding-inline: var(--space-md); }
.portal-content { width: min(100% - 1.5rem, var(--content-max)); margin-inline: auto; }

.product-index { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-md); }
.product-row { display: grid; min-width: 0; gap: var(--space-md); padding: var(--space-md); border: var(--rule-thin) solid var(--color-rule); border-radius: var(--radius-card); background: var(--color-paper-raised); box-shadow: var(--shadow-card); }
.product-row__title { display: grid; gap: var(--space-xs); }
.product-row__title h2 { font-size: var(--text-lg); }
.product-row__title p { max-width: 56ch; color: var(--color-neutral); }
.product-row > div:not(.product-row__title) { display: grid; align-content: start; gap: var(--space-2xs); }
.product-row__price { font-size: var(--text-xl); font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.025em; }
.product-row .button { justify-self: start; }

.balance-band { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-sm); }
.balance-band > div { min-width: 0; padding: var(--space-md); border: var(--rule-thin) solid var(--color-rule); border-radius: var(--radius-md); background: var(--color-paper-raised); box-shadow: var(--shadow-card); }
.balance-band > div:first-child { grid-column: 1 / -1; background: var(--color-ink); color: var(--color-paper-raised); }
.balance-band > div:first-child span,
.balance-band > div:first-child small { color: var(--color-paper-3); }
.balance-band span { display: block; color: var(--color-neutral); font-size: var(--text-sm); }
.balance-band strong { display: block; margin-block-start: var(--space-xs); font-size: var(--text-xl); font-variant-numeric: tabular-nums; letter-spacing: -0.025em; line-height: 1.05; }
.balance-band small { display: block; margin-block-start: var(--space-2xs); }

@media (hover: hover) and (pointer: fine) {
  .portal-nav a:hover { background: var(--color-paper-raised); color: var(--color-ink); }
}

@media (min-width: 40rem) {
  .portal-topbar { padding-inline: var(--space-lg); }
  .portal-topbar__status > small { display: block; }
  .portal-content { width: min(100% - 3rem, var(--content-max)); }
  .product-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-row { grid-template-columns: minmax(0, 1fr) auto; }
  .product-row__title { grid-column: 1 / -1; }
  .product-row > :nth-child(2),
  .product-row > :nth-child(3) { grid-column: 1; }
  .product-row .button { grid-column: 2; grid-row: 2 / span 2; align-self: end; }
}

@media (min-width: 64rem) {
  .portal-layout { padding-inline-start: var(--portal-rail); }
  .portal-rail { z-index: var(--z-sticky); width: var(--portal-rail); opacity: 1; pointer-events: auto; transform: none; box-shadow: none; }
  .button.portal-menu-button { display: none; }
}

@media (min-width: 80rem) {
  .balance-band { grid-template-columns: 1.25fr repeat(3, minmax(0, 0.75fr)); }
  .balance-band > div:first-child { grid-column: auto; }
}

/* 登录入口与门店捷径常驻，不要求用户先展开菜单辨认身份。 */
.auth-page.auth-page--entry { display: block; padding: 32px 20px; background: #f5f6f8; }
.auth-page--entry .auth-panel { width: min(100%, 480px); min-height: 0; margin: 0 auto; padding: 20px; gap: 16px; background: #fff; border: 1px solid #dce1e7; }
.auth-page--entry .auth-brand { font-size: 17px; }
.auth-page--entry h1 { font-size: 20px; line-height: 1.4; }
.auth-page--entry .stack--tight p, .auth-entry-help { color: #596779; font-size: 13px; line-height: 1.6; }
.auth-page--entry .button, .auth-page--entry input:not([type="checkbox"]) { min-height: 34px; padding: 5px 10px; border-radius: 4px; font-size: 14px; line-height: 20px; }
.auth-entry-tabs { display: flex; border-bottom: 1px solid #dce1e7; gap: 20px; }
.auth-entry-tabs a { display: inline-flex; min-height: 36px; align-items: center; padding: 5px 0; border-bottom: 2px solid transparent; color: #536273; text-decoration: none; font-size: 14px; font-weight: 600; }
.auth-entry-tabs a[aria-current="page"] { border-bottom-color: #185ea5; color: #185ea5; }
.auth-entry-help { border-top: 1px solid #dce1e7; padding-top: 12px; }
.console-shell .portal-nav a.portal-store-entry { color: #185ea5; font-weight: 700; }
.console-shell .portal-topbar > .portal-store-shortcut { display: none; }
@media (max-width: 63.99rem) {
  .console-shell .portal-topbar { position: sticky; top: 0; }
  .console-shell .portal-topbar > .portal-store-shortcut { display: inline-flex; flex: 0 0 auto; margin-inline-start: auto; min-height: 44px; align-items: center; padding: 7px 10px; font-size: 13px; color: #185ea5; border: 1px solid #b4c4d4; background: #fff; }
  .console-shell .portal-topbar__title { flex: 1; min-width: 0; }
  .console-shell .portal-topbar > .portal-topbar__status { display: none; }
}
@media (max-width: 39.99rem) {
  .auth-page.auth-page--entry { padding: 16px 12px; background: #fff; }
  .auth-page--entry .auth-panel { padding: 8px; border: 0; }
  .auth-entry-tabs { gap: 18px; }
  .auth-entry-tabs a { min-height: 44px; }
  .auth-page--entry .button, .auth-page--entry input:not([type="checkbox"]) { min-height: 44px; }
  .auth-page--entry input:not([type="checkbox"]) { font-size: 16px; }
}

/* 低频设置收起，仍保留键盘访问和当前设置页面的定位。 */
.portal-settings summary { cursor: pointer; padding: var(--space-md); font-size: var(--text-sm); color: var(--color-neutral); }
.portal-settings { margin-block-start: var(--space-sm); border-block-start: var(--rule-thin) solid var(--color-rule); }
.purchase-optional summary { cursor: pointer; padding-block: var(--space-sm); color: var(--color-muted); }
.purchase-optional .field { margin-block-start: var(--space-sm); }
#preview-button[hidden] { display: none; }
#purchase-remaining, #purchase-total { overflow-wrap: anywhere; }
.purchase-summary .definition div { grid-template-columns: minmax(5rem, 1fr) minmax(0, 1.4fr); }
.purchase-summary .surface__body { display: grid; gap: var(--space-sm); }
