:root {
  --ink: #1e272d;
  --muted: #68747b;
  --line: #dce1e3;
  --soft: #f5f7f7;
  --soft-2: #edf1f2;
  --accent: #c7dc19;
  --accent-dark: #8fa100;
  --green: #26744a;
  --orange: #b46a10;
  --red: #b84545;
  --blue: #356c81;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Noto Sans TC", "PingFang TC", sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { color-scheme: light; }
body { margin: 0; color: var(--ink); background: #fff; font-size: 15px; }
button, input, select, textarea { color: inherit; font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin-top: 0; }

.site-header {
  position: sticky;
  z-index: 20;
  top: 0;
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) 250px;
  align-items: stretch;
  min-height: 72px;
  border-bottom: 1px solid #aeb7bb;
  padding: 0 38px;
  background: rgba(255,255,255,.97);
}
.brand { display: flex; align-items: center; gap: 9px; width: fit-content; }
.brand > span { display: grid; place-items: center; width: 34px; height: 34px; background: var(--accent); color: #111; font-size: 20px; font-weight: 900; }
.brand strong { font-size: 16px; letter-spacing: 0; }
.brand small { align-self: center; border-left: 1px solid var(--line); padding-left: 9px; color: var(--muted); font-size: 10px; }
.main-nav { display: flex; align-items: stretch; gap: 34px; }
.main-nav a { display: grid; place-items: center; border-bottom: 3px solid transparent; color: #4f5a60; white-space: nowrap; }
.main-nav a:hover, .main-nav a.active { border-bottom-color: var(--ink); color: var(--ink); font-weight: 700; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; }
.account-link { display: flex; align-items: center; gap: 9px; border-left: 1px solid var(--line); padding-left: 18px; }
.account-link > span:last-child { display: grid; }
.account-link strong { max-width: 150px; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.account-link small { color: var(--muted); font-size: 11px; }
.account-avatar, .avatar { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; background: #e9edef; font-size: 12px; font-weight: 800; }
.mobile-menu { display: none; border: 0; background: none; font-weight: 700; }

.page-shell { width: min(1460px, 100%); margin: 0 auto; padding: 54px 42px 90px; }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 44px; }
.page-heading h1 { margin: 4px 0 8px; color: #354047; font-size: clamp(30px, 4vw, 44px); font-weight: 550; letter-spacing: 0; }
.page-heading p { margin: 0; color: var(--muted); }
.eyebrow { color: #778188; font-size: 11px; font-weight: 800; letter-spacing: 0; }

.button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; border: 1px solid var(--ink); border-radius: 3px; padding: 0 16px; background: #fff; font-weight: 700; white-space: nowrap; }
.button:hover { background: var(--soft); }
.button.primary { border-color: var(--accent); background: var(--accent); color: #111; }
.button.primary:hover { background: #b7ca0f; }
.button.secondary { border-color: #849097; }
.button.text-button { border-color: transparent; background: transparent; color: #526168; }
.button.active { border-color: var(--ink); background: var(--ink); color: #fff; }
.button.full { width: 100%; }
.text-link, .icon-link { border: 0; padding: 0; background: none; color: #436e78; font-weight: 700; }

.dealer-bar { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-bottom: 36px; }
.dealer-bar > div { border-right: 1px solid var(--line); padding: 14px 18px; }
.dealer-bar > div:first-child { padding-left: 0; }
.dealer-bar > div:last-child { border-right: 0; }
.dealer-bar span, .summary-grid span, .plain-section .section-head > span { display: block; color: var(--muted); font-size: 12px; }
.dealer-bar strong { display: block; margin-top: 5px; font-size: 15px; }

.shop-tools, .list-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) 230px auto; align-items: end; gap: 14px; margin-bottom: 22px; }
.list-toolbar { grid-template-columns: minmax(260px, 360px) minmax(440px, 1fr) auto; }
.list-toolbar .wide { max-width: 500px; }
.search-box, .select-box, .order-note { display: grid; gap: 7px; }
.search-box > span, .select-box > span, .order-note > span { color: #4e5960; font-size: 12px; font-weight: 700; }
.search-box input, .select-box select, .order-note textarea { width: 100%; min-height: 44px; border: 1px solid #929da2; border-radius: 2px; padding: 0 13px; background: #fff; outline: none; }
.order-note textarea { min-height: 72px; padding-top: 10px; resize: vertical; }
.search-box input:focus, .select-box select:focus, .order-note textarea:focus { border-color: var(--ink); box-shadow: 0 0 0 2px rgba(30,39,45,.08); }

.category-tabs { display: flex; gap: 8px; overflow-x: auto; border-bottom: 1px solid var(--line); margin-bottom: 32px; padding-bottom: 12px; }
.category-tabs button, .segmented button { min-height: 34px; border: 0; border-radius: 3px; padding: 0 15px; background: var(--soft); color: #515c62; white-space: nowrap; }
.category-tabs button.active, .segmented button.active { background: var(--ink); color: #fff; font-weight: 700; }
.segmented { display: flex; gap: 5px; overflow-x: auto; }

.ordering-layout { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 32px; align-items: start; }
.product-list { min-width: 0; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 38px; margin-bottom: 18px; }
.section-head > div { display: flex; align-items: baseline; gap: 12px; }
.section-head h2 { margin: 0; font-size: 21px; font-weight: 650; }
.section-head a, .section-head > div > span { color: #4f737b; font-size: 13px; font-weight: 700; }
.price-note { color: var(--muted); font-size: 12px; }
.table-wrap { width: 100%; max-width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
.product-table { min-width: 820px; }
th { border-bottom: 1px solid var(--ink); padding: 0 12px 13px; color: #566168; font-size: 12px; text-align: left; white-space: nowrap; }
td { border-bottom: 1px solid #e3e7e8; padding: 16px 12px; vertical-align: middle; }
.product-cell { display: grid; grid-template-columns: 64px minmax(140px, 1fr); align-items: center; gap: 12px; }
.product-image { display: grid; place-items: center; width: 64px; height: 64px; overflow: hidden; background: var(--soft); }
.product-image img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.product-image span { font-weight: 800; }
.product-cell > div:last-child { min-width: 0; }
.product-cell strong, .product-cell small, td > small { display: block; }
.product-cell strong { margin: 2px 0 3px; font-size: 14px; }
.product-cell small, td > small { color: var(--muted); font-size: 11px; }
.brand-name { color: #788389; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.row-links { display: flex; gap: 10px; margin-top: 7px; }
.row-links a, .row-links button { color: #4d7780; font-size: 11px; }
.row-links .selected { color: var(--accent-dark); }
.sku { display: block; margin-bottom: 4px; font-size: 12px; }
.number-cell { text-align: right; white-space: nowrap; }
.dealer-price { color: #182126; font-weight: 800; }
.status-chip { display: inline-flex; align-items: center; justify-content: center; min-width: 62px; min-height: 25px; border: 1px solid currentColor; border-radius: 2px; padding: 0 7px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.status-chip.success { color: var(--green); }.status-chip.info { color: var(--blue); }.status-chip.warning { color: var(--orange); }.status-chip.danger { color: var(--red); }
.stepper { display: grid; grid-template-columns: 30px 46px 30px; border: 1px solid #899399; border-radius: 2px; width: 108px; }
.stepper button, .stepper input { width: 100%; height: 34px; border: 0; background: #fff; text-align: center; }
.stepper button { font-size: 17px; }.stepper input { border-right: 1px solid var(--line); border-left: 1px solid var(--line); }

.cart-panel { position: sticky; top: 96px; border: 1px solid #aeb7bb; padding: 20px; background: #fff; }
.cart-head { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); padding-bottom: 15px; }
.cart-head span:first-child { color: var(--muted); font-size: 11px; }.cart-head h2 { margin: 4px 0 0; font-size: 20px; }
.count-badge { display: grid; place-items: center; min-width: 28px; height: 28px; border-radius: 50%; background: var(--accent); color: #111 !important; font-weight: 800; }
.cart-lines { max-height: 330px; overflow: auto; }
.cart-line { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid #edf0f1; padding: 14px 0; }
.cart-line > div { display: grid; gap: 3px; }.cart-line > div:last-child { justify-items: end; }
.cart-line strong { font-size: 12px; }.cart-line span { color: var(--muted); font-size: 11px; }.cart-line button { border: 0; padding: 0; background: none; color: #8a5555; font-size: 10px; }
.cart-empty, .empty-state { display: grid; place-items: center; gap: 6px; min-height: 150px; color: var(--muted); text-align: center; }
.cart-empty strong, .empty-state strong { color: #4e5960; }.cart-empty span, .empty-state span { font-size: 12px; }
.order-note { margin-top: 16px; }
.cart-total { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--ink); margin-top: 18px; padding: 16px 0; }
.cart-total strong { font-size: 20px; }.cart-panel .button { margin-top: 8px; }

.summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-bottom: 48px; }
.summary-grid > a, .summary-grid > div { display: grid; gap: 7px; border-right: 1px solid var(--line); padding: 20px; }
.summary-grid > :first-child { padding-left: 0; }.summary-grid > :last-child { border-right: 0; }
.summary-grid strong { font-size: 25px; font-weight: 600; }.summary-grid small { color: #4f737b; }
.dashboard-grid, .account-layout { display: grid; grid-template-columns: 1.25fr .75fr; gap: 36px; margin-bottom: 48px; }
.account-layout { grid-template-columns: 1fr 1fr; }
.plain-section { min-width: 0; }
.order-item { display: grid; grid-template-columns: 155px minmax(220px, 1fr) 90px 120px 62px; align-items: center; gap: 18px; border-top: 1px solid var(--line); padding: 17px 0; }
.order-item > div:first-child, .order-products { display: grid; gap: 4px; }.order-item span, .order-item small { color: var(--muted); font-size: 11px; }.order-item strong { font-size: 13px; }.order-products span { color: var(--ink); font-size: 12px; }.order-total { text-align: right; }
.notice-row { display: grid; gap: 6px; border-top: 1px solid var(--line); padding: 17px 0; }.notice-row span { color: var(--muted); font-size: 11px; }.notice-row b { margin-left: 8px; color: var(--orange); }.notice-row strong { font-size: 13px; }
.progress-section { display: grid; grid-template-columns: minmax(180px, .8fr) 1.2fr; align-items: end; gap: 24px; border-top: 1px solid var(--ink); margin: 48px 0; padding-top: 25px; }.progress-section h2 { margin: 5px 0 0; font-size: 23px; }.progress-copy { display: flex; justify-content: space-between; gap: 20px; }.progress-copy span { color: var(--muted); }.progress-track { grid-column: 1 / -1; height: 8px; overflow: hidden; background: var(--soft-2); }.progress-track span { display: block; width: 0; height: 100%; background: var(--accent); transition: width .6s ease; }
.points-section { margin: 48px 0; border-top: 1px solid var(--ink); padding-top: 25px; }
.points-section .section-head { align-items: end; }
.points-balance { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 16px; margin: 18px 0 22px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.points-balance > span, .points-balance small { color: var(--muted); font-size: 12px; }
.points-balance strong { font-size: 30px; font-weight: 600; }
.points-table { min-width: 720px; }
.point-positive { color: #156b36; }
.point-negative { color: #a53c32; }
.company-team-section { margin: 48px 0; border-top: 1px solid var(--ink); padding-top: 25px; }
.company-team-form { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(170px, .8fr) minmax(150px, .7fr) auto; align-items: end; gap: 10px; margin: 20px 0 30px; }
.company-team-form label { display: grid; gap: 6px; }
.company-team-form label span { color: var(--muted); font-size: 11px; font-weight: 750; }
.company-team-form input, .company-team-form select, .company-user-list select { min-height: 42px; border: 1px solid #aeb8bc; padding: 0 11px; background: #fff; font: inherit; }
.company-user-list, .company-invite-list { display: grid; border-top: 1px solid var(--line); }
.company-user-list article { display: grid; grid-template-columns: minmax(210px, 1fr) 150px 120px auto auto; align-items: center; gap: 9px; border-bottom: 1px solid var(--line); padding: 13px 0; }
.company-user-list article > div, .company-invite-list article > div { display: grid; gap: 4px; }
.company-user-list article span, .company-invite-list article span, .company-invite-list time { color: var(--muted); font-size: 11px; }
.company-role-label { font-size: 12px; }
.company-invite-head { margin-top: 34px; }
.company-invite-head h3 { margin: 0; font-size: 18px; }
.company-invite-list article { display: grid; grid-template-columns: minmax(220px, 1fr) 90px 110px auto auto; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); padding: 12px 0; }
.text-link.danger { color: #a53c32; }
.company-invite-modal { display: grid; justify-items: center; gap: 10px; text-align: center; }
.company-invite-modal img { width: 220px; height: 220px; object-fit: contain; border: 1px solid var(--line); background: #fff; }
.company-invite-modal > span, .company-invite-modal p { color: var(--muted); font-size: 12px; }
.company-invite-modal > strong { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 22px; letter-spacing: 0; }
.company-invite-modal p { max-width: 480px; line-height: 1.7; }
.company-invite-modal input { width: 100%; min-height: 42px; border: 1px solid var(--line); padding: 0 10px; background: var(--soft); }

.download-list article { display: grid; grid-template-columns: 82px minmax(0, 1fr) 90px; align-items: center; gap: 18px; border-top: 1px solid var(--line); padding: 17px 0; }.download-list article > div { display: grid; gap: 3px; }.download-list article > div > span, .download-list small { color: var(--muted); font-size: 11px; }.file-type { display: grid; place-items: center; min-height: 46px; background: var(--soft); font-size: 11px; font-weight: 800; }
.record-table { min-width: 850px; }.record-table th, .record-table td { padding-right: 18px; padding-left: 18px; }.record-table td:first-child, .record-table th:first-child { padding-left: 0; }
.channel-section { display: flex; align-items: center; justify-content: space-between; gap: 24px; border-top: 1px solid var(--line); margin-top: 40px; padding-top: 28px; }.channel-section > div > span { color: var(--muted); font-size: 11px; }.channel-section h2 { margin: 5px 0 7px; font-size: 21px; }.channel-section p { margin: 0; color: var(--muted); }
.details-list { margin: 0; }.details-list > div { display: grid; grid-template-columns: 120px 1fr; border-top: 1px solid var(--line); padding: 16px 0; }.details-list dt { color: var(--muted); font-size: 12px; }.details-list dd { margin: 0; font-weight: 650; }
.line-profile, .sales-contact { display: flex; align-items: center; gap: 13px; border-top: 1px solid var(--line); margin-bottom: 22px; padding: 21px 0; }.line-profile > div:last-child, .sales-contact > div:last-child { display: grid; gap: 4px; }.line-profile span, .sales-contact span { color: var(--muted); font-size: 12px; }.avatar { width: 46px; height: 46px; background: #06c755; color: #fff; }.avatar.dark { background: var(--ink); }

.shop-tools-brands { grid-template-columns: minmax(260px, 1fr) 190px 220px auto; }
.brand-tabs { display: flex; align-items: center; gap: 8px; overflow-x: auto; border-top: 1px solid var(--line); padding: 13px 0; }
.brand-tabs > span { margin-right: 6px; color: var(--muted); font-size: 11px; font-weight: 800; }
.brand-tabs button { min-height: 32px; border: 0; border-radius: 2px; padding: 0 14px; background: #f1f3f3; color: #4f5a60; white-space: nowrap; }
.brand-tabs button.active { background: var(--ink); color: #fff; font-weight: 800; }
.brand-achievement-section { margin: 34px 0; }.brand-achievement-section .section-head h2 { margin: 4px 0 0; }.brand-achievement-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }.brand-achievement-grid > .brand-performance-card { display: grid; gap: 15px; border: 0; border-right: 1px solid var(--line); padding: 20px; background: #fff; color: var(--ink); text-align: left; cursor: pointer; }.brand-achievement-grid > .brand-performance-card:first-child { padding-left: 0; }.brand-achievement-grid > .brand-performance-card:last-child { border-right: 0; }.brand-achievement-grid > .brand-performance-card:hover { background: #f7f8f8; }.brand-card-head, .brand-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.brand-card-head > b { font-size: 15px; }.brand-card-numbers { display: grid; gap: 4px; }.brand-card-numbers small, .brand-card-meta span { color: var(--muted); font-size: 11px; }.brand-card-numbers strong { font-size: 23px; }.brand-card-meta b { font-size: 17px; }.brand-achievement-grid .target-progress { height: 5px; background: #e8ecec; }.brand-achievement-grid .target-progress i { display: block; height: 100%; background: var(--green); }
.account-menu-wrap { display: flex; align-items: center; gap: 10px; }.logout-button { min-height: 32px; border: 0; border-left: 1px solid var(--line); padding: 0 0 0 12px; background: transparent; color: var(--muted); font-size: 11px; }.logout-button:hover { color: var(--ink); }.logout-button:disabled { opacity: .55; }
.locked-product { background: #fafbfb; }.locked-product .product-image, .locked-product .dealer-price { opacity: .62; }
.brand-locked { display: inline-block; min-width: 108px; border: 1px solid #a9b1b5; padding: 8px 10px; color: var(--muted); font-size: 11px; text-align: center; }

.turnover-overview { display: grid; grid-template-columns: 1.1fr 1fr 1fr; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); margin-bottom: 46px; }
.manager-block, .turnover-card { min-height: 168px; border-right: 1px solid var(--line); padding: 24px; }.manager-block { padding-left: 0; }.turnover-card:last-child { border-right: 0; }
.manager-profile { display: flex; align-items: center; gap: 13px; margin: 17px 0; }.manager-profile > div:last-child { display: grid; gap: 3px; }.manager-profile span, .turnover-card span, .turnover-card small { color: var(--muted); font-size: 12px; }
.turnover-card { display: flex; flex-direction: column; justify-content: center; }.turnover-card strong { margin: 12px 0 7px; font-size: 30px; font-weight: 550; }
.chart-section { border-top: 1px solid var(--ink); margin-bottom: 58px; padding-top: 24px; }
.chart-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 26px; margin-bottom: 22px; }.chart-head h2 { margin: 5px 0 0; font-size: 24px; }
.chart-controls { display: flex; align-items: flex-end; gap: 10px; }.chart-controls label { display: grid; gap: 5px; }.chart-controls label > span { color: var(--muted); font-size: 11px; }.chart-controls select { min-width: 145px; min-height: 42px; border: 1px solid #879198; padding: 0 10px; background: #fff; }
.brand-target-strip { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-bottom: 18px; }.brand-target-strip > div:not(.target-progress) { padding: 14px 18px; }.brand-target-strip span { display: block; color: var(--muted); font-size: 11px; }.brand-target-strip strong { display: block; margin-top: 5px; }.target-progress { grid-column: 1 / -1; height: 6px; overflow: hidden; background: var(--soft-2); }.target-progress > span { display: block; height: 100%; background: var(--accent); }
.chart-legend { display: flex; justify-content: flex-end; gap: 18px; margin-bottom: 8px; }.chart-legend span { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 11px; }.chart-legend i { display: block; width: 18px; height: 5px; }.legend-current { background: #354047; }.legend-previous { background: #b9c2c6; }.legend-target { background: var(--accent); }
.canvas-wrap { width: 100%; overflow-x: auto; }.canvas-wrap canvas { display: block; }
.chart-table { display: grid; grid-template-columns: repeat(12, 1fr); border-top: 1px solid var(--line); margin-top: 12px; }.chart-table > div { display: grid; gap: 4px; border-right: 1px solid var(--line); padding: 9px 6px; text-align: center; }.chart-table > div:last-child { border-right: 0; }.chart-table span { color: var(--muted); font-size: 10px; }.chart-table strong { font-size: 10px; }

.download-summary { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); margin-bottom: 34px; }.download-summary > div { display: grid; gap: 5px; border-right: 1px solid var(--line); padding: 18px; }.download-summary > div:first-child { padding-left: 0; }.download-summary > div:last-child { border-right: 0; }.download-summary span, .download-summary small { color: var(--muted); font-size: 11px; }.download-summary strong { font-size: 22px; }.download-brand-tabs { margin-bottom: 24px; }.download-list.rich article { grid-template-columns: 90px minmax(0,1fr) 130px; }.download-actions { justify-items: end; }.download-actions > span { color: var(--green) !important; }

.brand-agreement-section { margin-bottom: 48px; }.brand-agreement-list article { display: grid; grid-template-columns: 1.1fr repeat(4, 1fr); align-items: center; gap: 18px; border-top: 1px solid var(--line); padding: 18px 0; }.brand-agreement-list article > div { display: grid; gap: 4px; }.brand-agreement-list article > div > span { color: var(--muted); font-size: 11px; }.brand-agreement-list .target-progress { grid-column: 1 / -1; }
.agreement-check { display: flex; align-items: flex-start; gap: 9px; color: var(--muted); font-size: 12px; line-height: 1.6; }.agreement-check input { margin-top: 4px; }.agreement-check a { color: #4f7780; font-weight: 700; text-decoration: underline; }
.agreement-page { width: min(760px, calc(100% - 36px)); margin: 0 auto; padding: 54px 0 90px; }.agreement-page .brand { margin-bottom: 70px; }.agreement-page h1 { margin: 8px 0 20px; font-size: 42px; }.agreement-lead { border-bottom: 1px solid var(--ink); padding-bottom: 28px; color: #465159; font-size: 17px; line-height: 1.8; }.agreement-page section { border-bottom: 1px solid var(--line); padding: 22px 0; }.agreement-page section h2 { font-size: 18px; }.agreement-page section p, .agreement-note { color: var(--muted); line-height: 1.8; }.agreement-note { margin-top: 28px; font-size: 12px; }

.admin-label { display: block; margin: -24px 0 22px 48px; color: #8e9ba1; font-size: 10px; }.admin-top-actions { display: flex; align-items: center; gap: 18px; }.admin-top-actions > span { color: var(--muted); font-size: 11px; }
.dealer-picker { position: relative; display: flex; align-items: center; gap: 8px; }.dealer-picker-label { color: var(--muted); font-size: 10px; }.dealer-picker-trigger { position: relative; display: grid; min-width: 260px; min-height: 42px; border: 1px solid #899399; padding: 6px 34px 6px 11px; background: #fff; text-align: left; }.dealer-picker-trigger::after { position: absolute; right: 11px; top: 50%; content: "⌄"; transform: translateY(-50%); }.dealer-picker-trigger span { max-width: 210px; overflow: hidden; font-size: 12px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }.dealer-picker-trigger small { color: var(--muted); font-size: 9px; }.dealer-picker-panel { position: absolute; z-index: 45; top: calc(100% + 8px); right: 0; width: min(540px, calc(100vw - 32px)); border: 1px solid var(--ink); background: #fff; box-shadow: 0 16px 48px rgba(0,0,0,.18); }.dealer-picker-tools { display: grid; grid-template-columns: minmax(220px,1fr) 130px 130px; gap: 8px; border-bottom: 1px solid var(--line); padding: 12px; }.dealer-picker-tools label { display: grid; gap: 5px; }.dealer-picker-tools label span { color: var(--muted); font-size: 9px; }.dealer-picker-tools input, .dealer-picker-tools select { width: 100%; min-height: 38px; border: 1px solid #899399; padding: 0 9px; background: #fff; }.dealer-picker-results { max-height: 360px; overflow: auto; padding: 5px; }.dealer-picker-results button { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 54px; border: 0; border-bottom: 1px solid var(--line); padding: 8px 10px; background: #fff; text-align: left; }.dealer-picker-results button:hover, .dealer-picker-results button.selected { background: var(--soft); }.dealer-picker-results button span { display: grid; gap: 3px; }.dealer-picker-results button small { color: var(--muted); font-size: 9px; }.dealer-picker-results button b { border: 1px solid var(--line); padding: 3px 6px; font-size: 9px; }.dealer-picker-empty { padding: 24px; color: var(--muted); text-align: center; }
.admin-summary small { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; }.admin-dashboard-grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(0,.7fr); gap: 20px; margin-bottom: 20px; }.admin-chart { min-width: 0; min-height: 280px; }
.channel-mix { display: grid; gap: 21px; }.channel-mix > div { display: grid; grid-template-columns: 1fr 42px; gap: 7px; }.channel-mix > div > span { display: flex; justify-content: space-between; grid-column: 1 / -1; font-size: 12px; }.channel-mix > div > div { height: 8px; overflow: hidden; background: var(--soft-2); }.channel-mix i { display: block; height: 100%; background: var(--accent); }.channel-mix small { color: var(--muted); text-align: right; }
.action-row { display: grid; grid-template-columns: minmax(240px,1fr) 90px 130px 60px; align-items: center; gap: 16px; border-top: 1px solid var(--line); padding: 14px 0; }.action-row > div { display: grid; gap: 4px; }.action-row span { color: var(--muted); font-size: 10px; }
.admin-filters { display: grid; grid-template-columns: minmax(280px,1fr) 220px; gap: 12px; margin-bottom: 22px; }.mini-agreements { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 7px; }.mini-agreements span { border: 1px solid var(--line); padding: 3px 5px; color: var(--muted); font-size: 9px; }
.admin-quick-actions { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--ink); margin-bottom: 18px; }.admin-quick-actions button { display: grid; gap: 7px; min-height: 76px; border: 0; border-right: 1px solid var(--line); padding: 14px 16px; background: #fff; text-align: left; }.admin-quick-actions button:last-child { border-right: 0; }.admin-quick-actions button:hover { background: var(--soft); }.admin-quick-actions span { color: var(--muted); font-size: 9px; }.admin-quick-actions strong { font-size: 12px; }
.dealer-list-filters { display: grid; grid-template-columns: minmax(260px,1.4fr) repeat(3,minmax(150px,1fr)) 100px; gap: 10px; margin: 0 0 18px; }.dealer-list-filters label, .dealer-result-count { display: grid; gap: 5px; }.dealer-list-filters label > span, .dealer-result-count span { color: var(--muted); font-size: 9px; }.dealer-list-filters input, .dealer-list-filters select { width: 100%; min-height: 40px; border: 1px solid #899399; padding: 0 10px; background: #fff; }.dealer-result-count { align-content: center; border-left: 1px solid var(--line); padding-left: 14px; }.dealer-result-count strong { font-size: 14px; }
.invite-manager { border-top: 1px solid var(--ink); margin-bottom: 24px; padding-top: 16px; }.invite-manager h3 { margin: 0; font-size: 16px; }.invite-code-list { display: grid; border-top: 1px solid var(--line); }.invite-code-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); padding: 12px 0; }.invite-code-row.disabled { opacity: .55; }.invite-code-row > div { display: flex; align-items: center; gap: 10px; }.invite-code-row > div:first-child { display: grid; grid-template-columns: 150px minmax(180px,1fr); flex: 1; }.invite-code-row small, .invite-code-row span { grid-column: 2; color: var(--muted); font-size: 10px; }.invite-code-value { border: 1px solid var(--ink); padding: 8px 10px; background: #fff; font-family: ui-monospace, monospace; font-size: 11px; font-weight: 800; }.invite-code-value:hover { background: var(--soft); }
.download-upload-form { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; }.download-upload-form label { display: grid; gap: 6px; }.download-upload-form label > span { color: var(--muted); font-size: 10px; }.download-upload-form input, .download-upload-form select { box-sizing: border-box; width: 100%; min-height: 42px; border: 1px solid #899399; padding: 8px 10px; background: #fff; }.download-upload-form .wide { grid-column: span 2; }.download-upload-form .file-field input { padding: 7px; }.upload-actions { display: flex; align-items: center; justify-content: flex-end; grid-column: 3 / -1; gap: 14px; }.upload-actions span { color: var(--muted); font-size: 10px; }.download-admin-actions { display: flex; flex-wrap: wrap; gap: 5px; min-width: 240px; }
.erp-intro { display: flex; align-items: flex-end; justify-content: space-between; border-top: 1px solid var(--ink); margin-bottom: 20px; padding: 22px 0 4px; }.erp-intro h2 { margin: 5px 0 8px; font-size: 26px; }.erp-intro p { max-width: 720px; color: var(--muted); }.erp-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 20px; }.required-columns { margin: 20px 0; }.required-columns > span { display: block; margin-bottom: 8px; color: var(--muted); font-size: 11px; }.required-columns > div { display: flex; flex-wrap: wrap; gap: 5px; }.required-columns > div span { border: 1px solid var(--line); padding: 4px 6px; background: var(--soft); font-size: 9px; }
.export-list { display: grid; }.export-list a { display: flex; justify-content: space-between; border-top: 1px solid var(--line); padding: 16px 0; }.export-list a:hover { color: #4f7780; }.export-list strong { font-size: 12px; }
.erp-direction-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }.direction-title { border-bottom: 1px solid var(--ink); padding-bottom: 16px; }.direction-title > span { color: #4f7780; font-size: 11px; font-weight: 800; }.direction-title h2 { margin: 5px 0; font-size: 21px; }.direction-title small { color: var(--muted); }.sync-source-list { display: grid; }.sync-source-list article { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); padding: 15px 0; }.sync-source-list article > div { display: grid; gap: 4px; }.sync-source-list article span { color: var(--muted); font-size: 10px; }.sync-source-list b { color: #9b681d; font-size: 10px; white-space: nowrap; }.sync-foot { padding-top: 15px; color: var(--muted); font-size: 10px; }.transfer-stats { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--line); }.transfer-stats article { display: grid; gap: 5px; padding: 17px 8px; }.transfer-stats article + article { border-left: 1px solid var(--line); }.transfer-stats span { color: var(--muted); font-size: 10px; }.transfer-stats strong { font-size: 23px; }.transfer-fields { margin: 12px 0 18px; }.transfer-fields > div { display: grid; grid-template-columns: 60px 1fr; gap: 12px; border-bottom: 1px solid var(--line); padding: 10px 0; }.transfer-fields dt { color: var(--muted); font-size: 10px; }.transfer-fields dd { margin: 0; font-size: 11px; }.erp-fallback { margin-bottom: 20px; }.erp-fallback-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }.import-zone.compact { min-height: 190px; }.button:disabled { cursor: not-allowed; opacity: .48; }
.sku-transform-manager { margin-bottom: 20px; }.sku-transform-manager td:first-child strong, .sku-transform-manager td:first-child small { display: block; }.sku-transform-manager td:first-child small { margin-top: 4px; color: var(--muted); }.sku-transform-manager .dealer-result-count { align-self: end; min-width: 90px; }
.product-table tr.product-locked { background: #f7f7f7; color: #6f767a; }.product-table tr.product-locked .product-thumb { filter: grayscale(1); opacity: .65; }.product-table .order-limit { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; }.reorder-row button.reorder-card { color: inherit; font: inherit; text-align: left; }.reorder-card.saved-template { position: relative; padding: 0; }.reorder-card.saved-template > button:first-child { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 100%; border: 0; padding: 18px 46px 18px 18px; background: transparent; color: inherit; font: inherit; text-align: left; }.template-delete { position: absolute; top: 8px; right: 8px; display: grid; place-items: center; width: 28px; height: 28px; border: 0; background: transparent; color: var(--muted); font-size: 20px; }.template-delete:hover { background: #f1f3f3; color: var(--red); }.product-thumb[src] { object-fit: contain; }
body[data-page="shop"] .product-table { min-width: 760px; table-layout: fixed; }
body[data-page="shop"] .product-table th:nth-child(1) { width: 28%; }
body[data-page="shop"] .product-table th:nth-child(2) { width: 12%; }
body[data-page="shop"] .product-table th:nth-child(3) { width: 10%; }
body[data-page="shop"] .product-table th:nth-child(4),
body[data-page="shop"] .product-table th:nth-child(5) { width: 11%; }
body[data-page="shop"] .product-table th:nth-child(6) { width: 15%; }
body[data-page="shop"] .product-table th:nth-child(7) { width: 13%; }
body[data-page="shop"] .product-table td { overflow-wrap: anywhere; }
body[data-page="shop"] .product-table .stepper { grid-template-columns: 26px 38px 26px; width: 90px; }
.import-preview { margin-top: 20px; }.import-preview table { min-width: 1500px; font-size: 11px; }.validation { display: grid; gap: 4px; border: 1px solid var(--line); margin-bottom: 18px; padding: 13px; }.validation span { font-size: 11px; }.validation.success { border-color: #7eae8d; color: var(--green); }.validation.error { border-color: #d48787; color: var(--red); }
.finance-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-bottom: 28px; }.finance-summary article { display: grid; gap: 7px; border: 1px solid var(--line); padding: 16px; }.finance-summary article > span { font-size: 12px; font-weight: 800; }.finance-summary article > strong { font-size: 13px; }.finance-summary article > small { color: var(--muted); }.finance-summary .target-progress { grid-column: auto; }

.toast { position: fixed; z-index: 50; right: 24px; bottom: 24px; transform: translateY(20px); min-width: 260px; border-radius: 3px; padding: 14px 18px; background: var(--ink); color: #fff; opacity: 0; pointer-events: none; transition: .2s ease; }.toast.show { transform: translateY(0); opacity: 1; }
.modal-backdrop { position: fixed; z-index: 60; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(15,20,23,.48); }.modal { width: min(600px, 100%); max-height: calc(100vh - 40px); overflow: auto; border-radius: 4px; background: #fff; box-shadow: 0 18px 70px rgba(0,0,0,.2); }.modal-head { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); padding: 18px 22px; }.modal-head h2 { margin: 0; font-size: 20px; }.modal-head button { border: 0; background: none; font-size: 26px; }.modal-body { padding: 22px; }.modal-actions { display: flex; justify-content: flex-end; gap: 9px; border-top: 1px solid var(--line); padding: 16px 22px; }.success-message { display: grid; place-items: center; text-align: center; }.success-message > span { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--accent); font-size: 12px; font-weight: 900; }.success-message h3 { margin: 16px 0 8px; font-size: 22px; }.success-message p { max-width: 410px; color: var(--muted); }.order-detail-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }.order-detail-meta > div { display: grid; gap: 5px; }.order-detail-meta span { color: var(--muted); font-size: 11px; }.order-detail-lines > div, .detail-total { display: flex; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); padding: 14px 0; }.order-detail-lines span { display: grid; gap: 3px; }.order-detail-lines small { color: var(--muted); }.detail-total { border-bottom: 0; font-size: 18px; }

.admin-shell { display: grid; grid-template-columns: 242px minmax(0, 1fr); min-height: 100vh; }.admin-sidebar { position: sticky; top: 0; box-sizing: border-box; height: 100vh; overflow-y: auto; padding: 24px 18px; background: #1f282d; color: #fff; }.admin-sidebar-head { display: flex; align-items: center; justify-content: space-between; }.admin-sidebar .brand { margin-bottom: 30px; }.admin-menu-toggle { display: none; width: 38px; height: 38px; border: 1px solid #59666d; border-radius: 2px; background: transparent; color: #fff; font-size: 20px; cursor: pointer; }.admin-sidebar nav { display: grid; gap: 3px; padding-bottom: 28px; }.admin-nav-group { display: block; margin: 20px 12px 7px; color: #7f8c92; font-size: 9px; font-weight: 800; letter-spacing: 0; }.admin-nav-group:first-child { margin-top: 0; }.admin-sidebar nav button, .admin-sidebar nav .admin-nav-link { display: block; width: 100%; border: 0; border-left: 3px solid transparent; border-radius: 2px; padding: 10px 11px; background: transparent; color: #c3cbd0; font-size: 12px; line-height: 1.35; text-align: left; text-decoration: none; }.admin-sidebar nav button.active, .admin-sidebar nav button:hover, .admin-sidebar nav .admin-nav-link:hover { border-left-color: var(--accent); background: #303a40; color: #fff; }.admin-sidebar nav .admin-nav-secondary { color: #8f9ba1; font-size: 11px; }.admin-main { min-width: 0; padding: 38px; background: #f7f8f8; }.admin-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; }.admin-top h1 { margin: 0; font-size: 28px; }.admin-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 24px; }.admin-summary article, .admin-panel { min-width: 0; border: 1px solid var(--line); border-radius: 4px; padding: 19px; background: #fff; }.admin-summary span { display: block; color: var(--muted); font-size: 11px; }.admin-summary strong { display: block; margin-top: 8px; font-size: 24px; }.admin-panel table { min-width: 860px; }.admin-panel select { min-height: 34px; border: 1px solid #899399; background: #fff; }.admin-view[hidden] { display: none; }.import-zone { display: grid; place-items: center; min-height: 260px; border: 1px dashed #9da7ab; text-align: center; }.import-zone p { color: var(--muted); }
.acceptance-summary { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); border: 1px solid var(--line); margin: 18px 0; }
.acceptance-summary article { min-width: 0; padding: 16px; border-right: 1px solid var(--line); }
.acceptance-summary article:last-child { border-right: 0; }
.acceptance-summary span, .acceptance-tools span { display: block; color: var(--muted); font-size: 11px; }
.acceptance-summary strong { display: block; margin-top: 6px; font-size: 22px; }
.acceptance-tools { display: grid; grid-template-columns: minmax(180px,240px) minmax(180px,240px) 1fr; gap: 12px; align-items: end; margin-bottom: 18px; }
.acceptance-tools label { display: grid; gap: 6px; }
.acceptance-tools select { width: 100%; }
.acceptance-tools > div { justify-self: end; text-align: right; }
.acceptance-list { display: grid; gap: 10px; }
.acceptance-row { display: grid; grid-template-columns: minmax(220px,1.2fr) minmax(180px,.8fr) 150px minmax(220px,1fr) auto; gap: 14px; align-items: center; border-top: 1px solid var(--line); padding: 15px 0; }
.acceptance-row:first-child { border-top: 0; }
.acceptance-row h3 { margin: 3px 0 5px; font-size: 15px; }
.acceptance-row p, .acceptance-row small { display: block; margin: 0; color: var(--muted); line-height: 1.5; }
.acceptance-row .acceptance-evidence { border-left: 3px solid var(--orange); padding-left: 10px; }
.acceptance-row .acceptance-evidence.ready { border-left-color: var(--green); }
.acceptance-row textarea { box-sizing: border-box; width: 100%; min-height: 58px; resize: vertical; border: 1px solid #899399; padding: 8px; font: inherit; }
.acceptance-row select { width: 100%; }
.acceptance-row .acceptance-actions { display: grid; gap: 6px; justify-items: stretch; }
.acceptance-empty { padding: 36px 0; text-align: center; color: var(--muted); }
.admin-dealer-modal { width: min(980px, 100%); }.dealer-modal-body { display: grid; gap: 28px; }.dealer-modal-section { border-top: 1px solid var(--ink); padding-top: 18px; }.dealer-modal-section h3 { margin: 0; font-size: 18px; }.dealer-form-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 14px; }.dealer-form-grid label, .admin-brand-editor label { display: grid; gap: 5px; }.dealer-form-grid label > span, .admin-brand-editor label > span { color: var(--muted); font-size: 10px; }.dealer-form-grid input, .dealer-form-grid select, .admin-brand-editor input, .admin-brand-editor select { width: 100%; min-height: 38px; border: 1px solid #899399; padding: 0 9px; background: #fff; }.dealer-user-list { display: grid; }.dealer-user-list article { display: grid; grid-template-columns: minmax(190px,1fr) 145px 120px 72px; align-items: center; gap: 9px; border-top: 1px solid var(--line); padding: 11px 0; }.dealer-user-list article > div { display: grid; gap: 3px; }.dealer-user-list span { color: var(--muted); font-size: 10px; }.dealer-user-list select { min-height: 36px; border: 1px solid #899399; background: #fff; }.admin-brand-editor { display: grid; }.admin-brand-editor article { display: grid; grid-template-columns: 1.2fr 135px 105px 130px 90px 72px; align-items: end; gap: 9px; border-top: 1px solid var(--line); padding: 13px 0; }.brand-editor-head { display: grid; align-self: center; gap: 4px; }.brand-editor-head span { color: var(--muted); font-size: 10px; }
.login-page { min-height: 100vh; background: #f2f4f4; }.login-shell { display: grid; grid-template-columns: 1.1fr .9fr; width: min(980px, calc(100% - 40px)); min-height: 610px; margin: 7vh auto; background: #fff; box-shadow: 0 16px 60px rgba(24,34,39,.1); }.login-brand { display: flex; flex-direction: column; justify-content: space-between; padding: 48px; background: var(--ink); color: #fff; }.login-brand .brand { color: #fff; }.login-brand .brand small, .login-brand > small { color: #b5c0c5; }.login-brand h1 { margin: 8px 0 16px; font-size: 48px; font-weight: 550; }.login-brand p { max-width: 430px; color: #c7d0d4; font-size: 17px; line-height: 1.7; }.login-panel { display: flex; flex-direction: column; justify-content: center; gap: 22px; padding: 58px; }.login-panel h2 { margin: 5px 0 9px; font-size: 30px; }.login-panel p { color: var(--muted); line-height: 1.6; }.line-button { min-height: 48px; border: 0; border-radius: 3px; background: #06c755; color: #fff; font-weight: 800; }.line-button:disabled { cursor: wait; opacity: .65; }.divider { position: relative; border-top: 1px solid var(--line); text-align: center; }.divider span { position: relative; top: -10px; padding: 0 12px; background: #fff; color: var(--muted); font-size: 11px; }.login-panel form { display: grid; gap: 10px; }.login-status { min-height: 20px; color: var(--muted); font-size: 13px; line-height: 1.5; }.invite-bind { display: grid; gap: 18px; }.login-result { display: grid; gap: 8px; border: 1px solid var(--line); padding: 14px; line-height: 1.5; }.login-result span { color: var(--muted); font-size: 12px; }.login-result.error { border-color: #d98e8e; color: var(--red); }.login-result.success { border-color: #7dbb94; color: #156b36; }.login-result .button { margin-top: 8px; }
.login-mode-tabs { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--line); }.login-mode-tabs button { border: 0; border-bottom: 2px solid transparent; padding: 11px 8px; background: transparent; color: var(--muted); }.login-mode-tabs button.active { border-bottom-color: var(--ink); color: var(--ink); font-weight: 800; }.register-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }.register-steps span { border-top: 2px solid var(--line); padding-top: 7px; color: var(--muted); font-size: 10px; }.register-steps span.done { border-color: #06c755; color: var(--ink); }
.register-steps.four { grid-template-columns: repeat(4, 1fr); }
.registration-mode .login-shell { grid-template-columns: .75fr 1.25fr; width: min(1180px, calc(100% - 40px)); margin: 3vh auto; }.registration-mode .login-panel { justify-content: flex-start; max-height: 94vh; overflow-y: auto; padding: 36px 48px; }.registration-mode .login-brand h1 { font-size: 42px; }.registration-agreement, .brand-contract-preview { border: 1px solid var(--line); padding: 17px; }.registration-doc-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }.registration-doc-head h3 { margin: 3px 0 0; font-size: 17px; }.registration-doc-head > a, .registration-doc-head > span { color: var(--green); font-size: 11px; font-weight: 800; }.agreement-scroll { max-height: 190px; overflow-y: auto; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 14px 0; padding: 12px 4px; }.agreement-scroll h4 { margin: 13px 0 3px; font-size: 12px; }.agreement-scroll p, .brand-contract-preview > p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }.agreement-check { display: grid; grid-template-columns: 18px 1fr; align-items: start; gap: 8px; }.agreement-check input { width: 16px; height: 16px; margin: 1px 0 0; accent-color: var(--green); }.agreement-check span { font-size: 11px; line-height: 1.5; }.brand-contract-preview { display: grid; gap: 13px; background: #f8f9f9; }.brand-contract-list { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }.brand-contract-list article { display: grid; gap: 5px; border-right: 1px solid var(--line); padding: 12px; }.brand-contract-list article:first-child { padding-left: 0; }.brand-contract-list article:last-child { border-right: 0; }.brand-contract-list strong { font-size: 11px; }.brand-contract-list span { color: var(--muted); font-size: 10px; }
.identity-confirmation { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; border: 1px solid var(--line); padding: 13px; }.line-identity-avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #06c755; color: #fff; font-weight: 900; }.identity-confirmation > div:nth-child(2) { display: grid; gap: 2px; }.identity-confirmation span, .identity-confirmation small { color: var(--muted); font-size: 10px; }.identity-confirmation strong { font-size: 14px; }.identity-verified { color: var(--green) !important; font-size: 10px; font-weight: 800; }.invite-verification { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 9px; }.invite-verification .button { min-height: 44px; }.agreement-stage { display: grid; gap: 12px; }.company-confirmation { border: 1px solid #8daf97; padding: 16px; background: #f7fbf8; }.company-confirm-head { display: flex; align-items: flex-start; justify-content: space-between; }.company-confirm-head > div { display: grid; gap: 4px; }.company-confirm-head span, .company-confirmation dt { color: var(--muted); font-size: 10px; }.company-confirm-head strong { font-size: 18px; }.company-confirmation dl { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); margin: 13px 0; padding-top: 12px; }.company-confirmation dl > div { display: grid; gap: 4px; }.company-confirmation dd { margin: 0; font-size: 11px; font-weight: 800; }.identity-check { display: flex; align-items: flex-start; gap: 8px; font-size: 11px; }.identity-check input { accent-color: var(--green); }
.contact-verification { display: grid; gap: 13px; border: 1px solid var(--line); padding: 16px; }.contact-verify-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }.contact-verify-head > div { display: grid; gap: 4px; }.contact-verify-head span, .contact-verification > p { color: var(--muted); font-size: 10px; }.contact-verify-head strong { font-size: 14px; }.contact-verification > p { margin: 0; line-height: 1.5; }.demo-code { border-left: 3px solid var(--green); padding: 8px 10px; background: #f3f7ee; }.verification-success { display: grid; gap: 5px; border-left: 3px solid var(--green); padding-left: 12px; }
.registration-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }.registration-fields select { width: 100%; min-height: 44px; border: 1px solid #899399; border-radius: 0; padding: 0 12px; background: #fff; }
.dealer-account-head { border-top: 1px solid var(--line); margin-top: 30px; padding-top: 26px; }.registration-review-table table { min-width: 1180px; }
.admin-finance-controls { display: flex; justify-content: flex-end; margin: 0 0 20px; }.admin-finance-controls .select-box { min-width: 320px; }
.brand-tier-field { grid-column: span 2; }.reconciliation-panel { margin-top: 20px; }.reconciliation-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }.reconciliation-summary { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); margin-bottom: 18px; }.reconciliation-summary article { border-right: 1px solid var(--line); padding: 16px; }.reconciliation-summary article:last-child { border-right: 0; }.reconciliation-summary span { display: block; color: var(--muted); font-size: 10px; }.reconciliation-summary strong { display: block; margin-top: 6px; font-size: 18px; }.reconciliation-difference { color: var(--red); font-weight: 800; }.reconciliation-preview-modal { width: min(920px,100%); }
.brand-metrics { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.brand-metrics span { display: grid; gap: 4px; padding: 10px 0; color: var(--muted); font-size: 11px; }.brand-metrics strong { color: var(--text); font-size: 13px; }.brand-metrics span + span { border-left: 1px solid var(--line); padding-left: 12px; }
.admin-brand-editor article { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 16px 0; }.admin-brand-editor .brand-editor-head { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 12px; }

.checkout-form { display: grid; gap: 20px; }.checkout-summary { display: grid; gap: 5px; border-left: 3px solid var(--green); padding: 12px 15px; background: #f6f8f5; }.checkout-summary span, .checkout-summary small, .checkout-form label > span { color: var(--muted); font-size: 11px; }.checkout-summary strong { font-size: 18px; }.checkout-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }.checkout-form label { display: grid; gap: 6px; }.checkout-form input, .checkout-form select, .checkout-form textarea, .order-next-action input { box-sizing: border-box; width: 100%; min-height: 43px; border: 1px solid #899399; border-radius: 0; padding: 9px 11px; background: #fff; color: var(--text); }.checkout-form textarea { resize: vertical; }.checkout-address, .checkout-note { grid-column: 1 / -1; }.field-muted { opacity: .55; }.form-error, .error-text { color: var(--red); font-size: 11px; }.success-text { color: var(--green); font-size: 11px; }
.order-info-block { display: grid; gap: 12px; border-top: 1px solid var(--line); margin-top: 20px; padding-top: 18px; }.order-info-block h3 { margin: 0; font-size: 14px; }.order-info-block dl, .compact-details { display: grid; gap: 9px; margin: 0; }.order-info-block dl > div, .compact-details > div { display: grid; grid-template-columns: 100px 1fr; gap: 12px; }.order-info-block dt, .compact-details dt { color: var(--muted); font-size: 11px; }.order-info-block dd, .compact-details dd { margin: 0; font-size: 12px; line-height: 1.5; }.status-timeline { display: grid; gap: 0; }.status-timeline article { position: relative; display: grid; grid-template-columns: 14px 1fr; gap: 10px; min-height: 48px; }.status-timeline article::before { position: absolute; top: 12px; bottom: -6px; left: 4px; width: 1px; background: var(--line); content: ""; }.status-timeline article:last-child::before { display: none; }.status-timeline i { position: relative; z-index: 1; width: 9px; height: 9px; margin-top: 4px; border-radius: 50%; background: var(--green); }.status-timeline article > div { display: grid; gap: 3px; }.status-timeline span, .status-timeline small { color: var(--muted); font-size: 10px; }.transfer-note { border-left: 3px solid var(--line); padding: 9px 12px; background: #f5f6f6; font-size: 11px; }
.order-adjustments { display: grid; gap: 7px; border-top: 1px solid var(--line); padding: 12px 0 4px; }
.order-adjustments > div { display: flex; justify-content: space-between; gap: 20px; color: var(--muted); font-size: 12px; }
.order-adjustments strong { color: #a53c32; }
.status-timeline .event-shipment i { background: #2d7180; }
.status-timeline .event-points i { background: #bd7a24; }
.status-timeline .event-transfer i { background: #555d62; }
.status-timeline .event-fulfillment i { background: #557bd4; }
.button.danger { border-color: #bd6d6d; background: #fff; color: #9f2525; }.button.compact { min-height: 32px; padding: 0 10px; font-size: 11px; }.admin-order-modal { width: min(920px, calc(100vw - 36px)); }.admin-order-body { display: grid; gap: 18px; }.order-work-summary { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); }.order-work-summary > div { display: grid; align-content: center; gap: 7px; min-height: 76px; border-right: 1px solid var(--line); padding: 10px 14px; }.order-work-summary > div:last-child { border-right: 0; }.order-work-summary span { color: var(--muted); font-size: 10px; }.order-work-summary strong { font-size: 12px; }.order-work-columns { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; }.order-next-action { display: grid; grid-template-columns: 1fr 1.4fr auto; align-items: end; gap: 15px; border: 1px solid var(--line); padding: 16px; }.order-next-action h3, .order-next-action p { margin: 0; }.order-next-action p, .order-next-action label span { color: var(--muted); font-size: 10px; }.order-next-action label { display: grid; gap: 5px; }.order-action-buttons { display: flex; gap: 8px; }.fulfillment-confirm-form, .transfer-confirm-form { display: grid; gap: 10px; margin-top: 12px; }.fulfillment-confirm-form { grid-template-columns: 1fr 1fr; }.fulfillment-confirm-form label, .transfer-confirm-form label { display: grid; gap: 5px; }.fulfillment-confirm-form label span, .transfer-confirm-form label span { color: var(--muted); font-size: 10px; }.fulfillment-confirm-form .wide { grid-column: 1 / -1; }.fulfillment-confirm-form input, .fulfillment-confirm-form select, .transfer-confirm-form input { width: 100%; min-height: 40px; border: 1px solid var(--line); background: #fff; padding: 0 10px; }

@media (max-width: 1120px) {
  .site-header { grid-template-columns: 180px 1fr 210px; padding: 0 22px; }.main-nav { gap: 18px; font-size: 13px; }
  .ordering-layout { grid-template-columns: 1fr; }.cart-panel { position: static; }.cart-lines { max-height: none; }
  .dashboard-grid { grid-template-columns: 1fr; }.list-toolbar { grid-template-columns: 1fr; }.segmented { order: 3; }
  .shop-tools-brands { grid-template-columns: 1fr 1fr; }.admin-dashboard-grid, .erp-grid, .erp-direction-grid { grid-template-columns: minmax(0,1fr); }.admin-summary { grid-template-columns: repeat(3, 1fr); }.dealer-form-grid { grid-template-columns: 1fr 1fr; }.admin-brand-editor article { grid-template-columns: 1fr 1fr 1fr; }.brand-editor-head { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .acceptance-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .acceptance-summary article { border-bottom: 1px solid var(--line); }
  .acceptance-tools, .acceptance-row { grid-template-columns: 1fr; }
  .acceptance-tools > div { justify-self: start; text-align: left; }
  body[data-page="shop"] { overflow-x: hidden; }
  body[data-page="shop"] .page-heading { display: grid; gap: 18px; }
  body[data-page="shop"] .status-strip button { min-width: 0; padding: 11px 4px; }
  body[data-page="shop"] .status-strip span { display: block; font-size: 10px; overflow-wrap: anywhere; }
  body[data-page="shop"] .smart-order-panel .section-head { align-items: flex-start; flex-direction: column; }
  body[data-page="shop"] .reorder-card { min-width: 0; width: 100%; }
  body[data-page="shop"] .product-list .table-wrap { overflow: visible; }
  body[data-page="shop"] .product-table { display: block; min-width: 0; width: 100%; }
  body[data-page="shop"] .product-table thead { display: none; }
  body[data-page="shop"] .product-table tbody { display: grid; gap: 12px; }
  body[data-page="shop"] .product-table tr { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); padding: 14px; background: #fff; }
  body[data-page="shop"] .product-table td { display: block; border: 0; padding: 8px 0; }
  body[data-page="shop"] .product-table td:first-child { grid-column: 1 / -1; border-bottom: 1px solid var(--line); padding-top: 0; padding-bottom: 13px; }
  body[data-page="shop"] .product-table td:nth-child(2),
  body[data-page="shop"] .product-table td:nth-child(3) { border-bottom: 1px solid var(--line); }
  body[data-page="shop"] .product-table td:nth-child(6),
  body[data-page="shop"] .product-table td:nth-child(7) { border-top: 1px solid var(--line); }
  body[data-page="shop"] .product-table td:nth-child(even) { padding-right: 10px; }
  body[data-page="shop"] .product-table td:nth-child(odd):not(:first-child) { padding-left: 10px; }
  body[data-page="shop"] .product-table td:nth-child(2)::before,
  body[data-page="shop"] .product-table td:nth-child(3)::before,
  body[data-page="shop"] .product-table td:nth-child(4)::before,
  body[data-page="shop"] .product-table td:nth-child(5)::before,
  body[data-page="shop"] .product-table td:nth-child(6)::before,
  body[data-page="shop"] .product-table td:nth-child(7)::before { display: block; margin-bottom: 5px; color: var(--muted); font-size: 9px; font-weight: 700; }
  body[data-page="shop"] .product-table td:nth-child(2)::before { content: "SKU / 規格"; }
  body[data-page="shop"] .product-table td:nth-child(3)::before { content: "供貨"; }
  body[data-page="shop"] .product-table td:nth-child(4)::before { content: "建議售價"; }
  body[data-page="shop"] .product-table td:nth-child(5)::before { content: "上次成交"; }
  body[data-page="shop"] .product-table td:nth-child(6)::before { content: "您的價格"; }
  body[data-page="shop"] .product-table td:nth-child(7)::before { content: "訂購數量"; }
  body[data-page="shop"] .product-table .stepper { width: 90px; }
  body[data-page="shop"] .product-table .button.compact { width: 100%; height: auto; min-height: 38px; white-space: normal; }
  .checkout-grid, .order-work-columns, .order-work-summary, .fulfillment-confirm-form { grid-template-columns: 1fr; }.checkout-address, .checkout-note, .fulfillment-confirm-form .wide { grid-column: 1; }.order-work-summary > div { min-height: 60px; border-right: 0; border-bottom: 1px solid var(--line); }.order-work-summary > div:last-child { border-bottom: 0; }.order-next-action { grid-template-columns: 1fr; }.order-action-buttons { display: grid; grid-template-columns: 1fr 1fr; }
  .modal-backdrop { padding: 10px; }.admin-dealer-modal { box-sizing: border-box; width: calc(100vw - 40px); max-width: calc(100vw - 40px); overflow-x: hidden; }.admin-dealer-modal .modal-head, .admin-dealer-modal .modal-body, .admin-dealer-modal .modal-actions { box-sizing: border-box; padding-left: 18px; padding-right: 18px; }.admin-dealer-modal .modal-head { position: relative; padding-right: 52px; }.admin-dealer-modal .modal-head button { position: absolute; top: 14px; right: 18px; }.admin-dealer-modal * { box-sizing: border-box; min-width: 0; }
  .admin-dealer-modal { width: calc(100vw - 60px); max-width: calc(100vw - 60px); }
  .admin-dealer-modal .modal-head button { left: 18px; right: auto; }.admin-dealer-modal .modal-head > div { padding-left: 34px; }
  .site-header { grid-template-columns: 1fr auto; min-height: 62px; padding: 0 16px; }.brand small, .account-link { display: none; }.mobile-menu { display: block; }.main-nav { position: absolute; top: 62px; right: 0; left: 0; display: none; align-items: stretch; gap: 0; border-bottom: 1px solid var(--line); padding: 8px 16px 16px; background: #fff; }.main-nav.open { display: grid; }.main-nav a { place-items: start; min-height: 44px; border-bottom: 1px solid var(--line); padding: 12px 0; }
  .page-shell { padding: 34px 16px 70px; }.page-heading { align-items: flex-start; margin-bottom: 30px; }.page-heading .button { min-height: 38px; padding: 0 10px; font-size: 12px; }.page-heading h1 { font-size: 31px; }
  .dealer-bar { grid-template-columns: 1fr 1fr; }.dealer-bar > div, .dealer-bar > div:first-child { border-bottom: 1px solid var(--line); padding: 12px 8px; }.dealer-bar > div:nth-child(even) { border-right: 0; }
  .shop-tools { grid-template-columns: 1fr; }.shop-tools .button { width: 100%; }.category-tabs { margin-right: -16px; padding-right: 16px; }.brand-achievement-grid { grid-template-columns: 1fr; }.brand-achievement-grid > .brand-performance-card, .brand-achievement-grid > .brand-performance-card:first-child { border-right: 0; border-bottom: 1px solid var(--line); padding: 18px 0; }
  .brand-tabs { margin-right: -16px; padding-right: 16px; }.turnover-overview, .download-summary { grid-template-columns: 1fr; }.manager-block, .turnover-card { min-height: 120px; border-right: 0; border-bottom: 1px solid var(--line); padding: 18px 0; }.chart-head, .chart-controls, .erp-intro, .admin-top { align-items: stretch; flex-direction: column; }.chart-controls label, .chart-controls select, .chart-controls .button { width: 100%; }.brand-target-strip { grid-template-columns: 1fr 1fr; }.chart-table { min-width: 760px; }.brand-agreement-list article { grid-template-columns: 1fr 1fr; }.download-list.rich article { grid-template-columns: 62px 1fr; }.download-actions { grid-column: 2; justify-items: start; }
  .summary-grid, .admin-summary { grid-template-columns: 1fr 1fr; }.summary-grid > a, .summary-grid > div { border-bottom: 1px solid var(--line); padding: 15px 8px; }.summary-grid strong { font-size: 19px; }
  .account-layout { grid-template-columns: 1fr; gap: 34px; }.order-item { grid-template-columns: 1fr auto; gap: 8px 14px; }.order-products { grid-column: 1 / -1; }.order-item > div:nth-child(3), .order-total { text-align: left; }.order-item .button { grid-column: 2; grid-row: 1; }
  .progress-section { grid-template-columns: 1fr; }.progress-copy, .channel-section { align-items: flex-start; flex-direction: column; }.progress-track { grid-column: 1; }.points-section .section-head, .company-team-section .section-head { align-items: flex-start; flex-direction: column; }.points-balance { grid-template-columns: 1fr; gap: 7px; }.company-team-form, .company-user-list article, .company-invite-list article { grid-template-columns: 1fr; align-items: stretch; }.company-team-form .button, .company-user-list .button { width: fit-content; }.download-list article { grid-template-columns: 60px 1fr; }.download-list article .button { grid-column: 2; width: fit-content; }.details-list > div { grid-template-columns: 90px 1fr; }
  .modal-actions { flex-direction: column; }.modal-actions .button { width: 100%; }.order-detail-meta { grid-template-columns: 1fr; }.dealer-form-grid, .admin-brand-editor article, .dealer-user-list article { grid-template-columns: 1fr; }.admin-brand-editor .brand-editor-head { grid-column: 1; align-items: flex-start; flex-direction: column; }.dealer-user-list article > div { grid-column: 1; }.dealer-user-list select, .dealer-user-list .button { width: 100%; }.brand-metrics { grid-template-columns: 1fr; }.brand-metrics span + span { border-top: 1px solid var(--line); border-left: 0; padding-left: 0; }
  .admin-shell { grid-template-columns: minmax(0,1fr); }.admin-sidebar { position: sticky; z-index: 40; height: 66px; overflow: visible; padding: 14px 18px; }.admin-sidebar .brand { margin-bottom: 0; }.admin-menu-toggle { display: inline-grid; place-items: center; }.admin-sidebar nav { position: absolute; top: 66px; right: 0; left: 0; display: none; grid-template-columns: 1fr; max-height: calc(100vh - 66px); overflow-y: auto; padding: 8px 18px 24px; background: #1f282d; box-shadow: 0 18px 36px rgba(0,0,0,.24); }.admin-sidebar.open nav { display: grid; }.admin-main { padding: 20px 14px; }.admin-summary { grid-template-columns: 1fr 1fr; }
  .admin-top-actions, .admin-filters, .erp-fallback-grid { display: grid; grid-template-columns: 1fr; }.dealer-picker { align-items: stretch; flex-direction: column; }.dealer-picker-trigger { min-width: 0; width: 100%; }.dealer-picker-panel { left: 0; right: auto; }.dealer-picker-tools, .dealer-list-filters, .admin-quick-actions, .download-upload-form { grid-template-columns: 1fr; }.admin-quick-actions button { border-right: 0; border-bottom: 1px solid var(--line); }.admin-quick-actions button:last-child { border-bottom: 0; }.dealer-result-count { border-top: 1px solid var(--line); border-left: 0; padding: 10px 0 0; }.invite-code-row, .invite-code-row > div { align-items: flex-start; flex-direction: column; }.invite-code-row > div:first-child { display: grid; grid-template-columns: 1fr; }.invite-code-row small, .invite-code-row span { grid-column: 1; }.download-upload-form .wide, .upload-actions { grid-column: 1; }.upload-actions { align-items: stretch; flex-direction: column; }.action-row { grid-template-columns: 1fr auto; }.action-row > strong { grid-column: 1; }.finance-summary { grid-template-columns: 1fr; }.admin-finance-controls { display: block; }.admin-finance-controls .select-box { min-width: 0; width: 100%; }
  .reconciliation-actions { justify-content: flex-start; }.reconciliation-summary { grid-template-columns: 1fr 1fr; }.reconciliation-summary article { border-bottom: 1px solid var(--line); }.brand-tier-field { grid-column: 1; }
  .login-shell { grid-template-columns: 1fr; width: 100%; min-height: 100vh; margin: 0; }.login-brand { min-height: 280px; padding: 30px 22px; }.login-brand h1 { font-size: 36px; }.login-panel { padding: 36px 22px; }
}

/* REUN dealer-facing visual system */
body[data-page] {
  --ink: #111;
  --muted: #686868;
  --line: #dedede;
  --soft: #f6f6f6;
  --soft-2: #ededed;
  --accent: #00a8d6;
  --accent-dark: #007d9f;
  color: #111;
  overflow-x: hidden;
}

.site-header {
  display: block;
  min-height: 0;
  border: 0;
  padding: 0;
  background: rgba(255,255,255,.98);
  box-shadow: 0 1px 0 rgba(0,0,0,.12);
}
.reun-site-row, .partner-row {
  display: grid;
  align-items: center;
  width: min(1460px, 100%);
  margin: 0 auto;
  padding-right: 42px;
  padding-left: 42px;
}
.reun-site-row {
  grid-template-columns: 260px minmax(0, 1fr) auto;
  min-height: 76px;
}
.reun-site-logo { display: flex; width: fit-content; }
.reun-site-logo img { display: block; width: 212px; height: auto; }
.reun-site-nav { display: flex; justify-content: flex-end; gap: 31px; }
.reun-site-nav a { position: relative; padding: 28px 0; color: #111; font-size: 13px; font-weight: 600; white-space: nowrap; }
.reun-site-nav a::after { position: absolute; right: 0; bottom: 18px; left: 0; height: 1px; transform: scaleX(0); transform-origin: left; background: #111; content: ""; transition: transform .18s ease; }
.reun-site-nav a:hover::after { transform: scaleX(1); }
.partner-row {
  grid-template-columns: 215px minmax(0, 1fr) 250px;
  min-height: 52px;
  border-top: 1px solid #e3e3e3;
  background: #111;
  color: #fff;
}
.partner-title { display: flex; align-items: baseline; gap: 10px; white-space: nowrap; }
.partner-title strong { font-size: 14px; }
.partner-title span { color: #aaa; font-size: 9px; font-weight: 700; }
.main-nav { justify-content: center; gap: 4px; }
.main-nav a { min-height: 52px; border: 0; padding: 0 18px; color: #bdbdbd; font-size: 13px; }
.main-nav a:hover, .main-nav a.active { border: 0; background: #242424; color: #fff; font-weight: 700; }
.header-actions { color: #fff; }
.account-link { border-left-color: #3c3c3c; padding-left: 16px; }
.account-link strong { color: #fff; }
.account-link small { color: #999; }
.account-avatar { background: #fff; color: #111; }
.logout-button { border-left-color: #444; color: #aaa; }
.logout-button:hover { color: #fff; }
.mobile-menu { color: #111; }

body[data-page] .page-shell { width: min(1460px, 100%); padding-top: 64px; }
body[data-page] .page-heading { padding-bottom: 31px; border-bottom: 1px solid #111; margin-bottom: 36px; }
body[data-page] .page-heading h1 { color: #111; font-size: 40px; font-weight: 600; }
body[data-page] .eyebrow { color: #777; }
body[data-page] .button.primary { border-color: #111; background: #111; color: #fff; }
body[data-page] .button.primary:hover { border-color: #333; background: #333; }
body[data-page] .button.secondary { border-color: #aaa; }
body[data-page] .button.secondary:hover { border-color: #111; background: #111; color: #fff; }
body[data-page] .category-tabs button, body[data-page] .brand-tabs button { background: #f2f2f2; color: #555; }
body[data-page] .category-tabs button.active, body[data-page] .brand-tabs button.active { background: #111; color: #fff; }
body[data-page] th { border-bottom-color: #111; color: #666; }
body[data-page] td { border-bottom-color: #e5e5e5; }
body[data-page] .product-image { background: #f5f5f5; }
body[data-page] .cart-panel { top: 148px; border-color: #bdbdbd; box-shadow: 0 12px 34px rgba(0,0,0,.06); }
body[data-page] .count-badge { background: #111; color: #fff !important; }
body[data-page] .progress-track span,
body[data-page] .target-progress > span,
body[data-page] .brand-achievement-grid .target-progress i { background: #00a8d6; }
body[data-page] .brand-achievement-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body[data-page] .brand-achievement-grid[data-columns="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body[data-page] .brand-achievement-grid[data-columns="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body[data-page] .brand-achievement-grid[data-columns="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body[data-page] .brand-achievement-grid[data-card-style="soft"] { gap: 10px; border: 0; }
body[data-page] .brand-achievement-grid[data-card-style="soft"] > .brand-performance-card { border: 0; padding: 20px; background: #f2f4f4; }
body[data-page] .brand-achievement-grid[data-card-style="compact"] > .brand-performance-card { gap: 8px; padding-top: 13px; padding-bottom: 13px; }
body[data-page] .brand-achievement-grid[data-card-style="compact"] .brand-card-numbers strong { font-size: 19px; }
body[data-page] .brand-achievement-grid [hidden] { display: none !important; }
body[data-page] .brand-achievement-grid > .brand-performance-card { width: 100%; min-width: 0; transition: background .15s ease; }
body[data-page] .brand-card-head, body[data-page] .brand-card-meta { min-width: 0; }
body[data-page] .brand-achievement-grid > .brand-performance-card:hover { background: #f5f5f5; }
body[data-page] .chart-section, body[data-page] .turnover-overview { border-top-color: #111; }
body[data-page] .legend-target { background: #00a8d6; }
body[data-page="dashboard"] [data-home-section][hidden] { display: none !important; }
body[data-page="dashboard"] [data-home-widget][hidden] { display: none !important; }
body[data-page="dashboard"] [data-home-widget] { animation-duration: var(--home-widget-duration, 500ms); animation-delay: var(--home-widget-delay, 0ms); animation-fill-mode: both; }
body[data-page="dashboard"] [data-widget-width="full"] { grid-column: 1 / -1 !important; width: 100%; }
body[data-page="dashboard"] .summary-grid > [data-widget-width="wide"],
body[data-page="dashboard"] .turnover-overview > [data-widget-width="wide"] { grid-column: span 2; }
body[data-page="dashboard"] .dashboard-grid > [data-widget-width="wide"] { grid-column: 1 / -1; }
body[data-page="dashboard"] .page-heading:has(> [data-widget-width="full"]) { flex-wrap: wrap; }
body[data-page="dashboard"] .page-heading > [data-widget-width="wide"] { flex: 1 1 66%; }
body[data-page="dashboard"] .page-heading > [data-widget-width="full"] { flex: 1 1 100%; }
body[data-page="dashboard"] [data-widget-align="center"] { text-align: center; }
body[data-page="dashboard"] [data-widget-align="end"] { text-align: right; }
body[data-page="dashboard"] [data-widget-align="center"] .chart-controls,
body[data-page="dashboard"] [data-widget-align="center"] .manager-profile,
body[data-page="dashboard"] [data-widget-align="center"] .brand-card-head,
body[data-page="dashboard"] [data-widget-align="center"] .brand-card-meta { justify-content: center; }
body[data-page="dashboard"] [data-widget-align="end"] .chart-controls,
body[data-page="dashboard"] [data-widget-align="end"] .manager-profile,
body[data-page="dashboard"] [data-widget-align="end"] .brand-card-head,
body[data-page="dashboard"] [data-widget-align="end"] .brand-card-meta { justify-content: flex-end; }
body[data-page="dashboard"] [data-widget-size="compact"] { min-height: 0; padding-top: 12px; padding-bottom: 12px; }
body[data-page="dashboard"] [data-widget-size="large"] { min-height: 190px; padding-top: 32px; padding-bottom: 32px; }
body[data-page="dashboard"] [data-widget-size="compact"] h1,
body[data-page="dashboard"] [data-widget-size="compact"] h2 { font-size: 20px; }
body[data-page="dashboard"] [data-widget-size="compact"] strong { font-size: 18px; }
body[data-page="dashboard"] [data-widget-size="large"] h1,
body[data-page="dashboard"] [data-widget-size="large"] h2 { font-size: 34px; }
body[data-page="dashboard"] [data-widget-size="large"] strong { font-size: 31px; }
body[data-page="dashboard"] [data-widget-surface="soft"] { background: #f1f4f4 !important; box-shadow: inset 0 0 0 1px #e1e6e7; padding-right: 18px; padding-left: 18px; }
body[data-page="dashboard"] [data-widget-surface="outline"] { box-shadow: inset 0 0 0 1px #9ba6aa; padding-right: 18px; padding-left: 18px; }
body[data-page="dashboard"] [data-widget-surface="dark"] { background: #171a1b !important; box-shadow: none; padding-right: 18px; padding-left: 18px; color: #fff; }
body[data-page="dashboard"] [data-widget-surface="dark"] h1,
body[data-page="dashboard"] [data-widget-surface="dark"] h2,
body[data-page="dashboard"] [data-widget-surface="dark"] strong { color: #fff; }
body[data-page="dashboard"] [data-widget-surface="dark"] span,
body[data-page="dashboard"] [data-widget-surface="dark"] small,
body[data-page="dashboard"] [data-widget-surface="dark"] .eyebrow { color: #c5cccf; }
body[data-page="dashboard"] [data-widget-effect="fade"] { animation-name: home-widget-fade; }
body[data-page="dashboard"] [data-widget-effect="fade-up"] { animation-name: home-widget-fade-up; }
body[data-page="dashboard"] [data-widget-effect="slide-left"] { animation-name: home-widget-slide-left; }
body[data-page="dashboard"] [data-widget-effect="zoom"] { animation-name: home-widget-zoom; }
@keyframes home-widget-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes home-widget-fade-up { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes home-widget-slide-left { from { opacity: 0; transform: translateX(-28px); } to { opacity: 1; transform: none; } }
@keyframes home-widget-zoom { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
body[data-page="dashboard"] [data-home-section].home-spacing-compact { margin-bottom: 28px !important; }
body[data-page="dashboard"] [data-home-section].home-spacing-standard { margin-bottom: 48px !important; }
body[data-page="dashboard"] [data-home-section].home-spacing-airy { margin-bottom: 76px !important; }
body[data-page="dashboard"] [data-home-section].home-tone-soft { background: #f3f5f5; box-shadow: 0 0 0 20px #f3f5f5; }
body[data-page="dashboard"] [data-home-section].home-tone-dark { background: #171a1b; box-shadow: 0 0 0 20px #171a1b; color: #fff; }
body[data-page="dashboard"] [data-home-section].home-tone-dark h1,
body[data-page="dashboard"] [data-home-section].home-tone-dark h2,
body[data-page="dashboard"] [data-home-section].home-tone-dark strong { color: #fff; }
body[data-page="dashboard"] [data-home-section].home-tone-dark p,
body[data-page="dashboard"] [data-home-section].home-tone-dark span,
body[data-page="dashboard"] [data-home-section].home-tone-dark small,
body[data-page="dashboard"] [data-home-section].home-tone-dark .eyebrow { color: #bdc5c8; }
#homeHeroSubtitle:not(:empty)::after { content: " · "; }
body.dashboard-editor-preview { background: #ecefef; }
body.dashboard-editor-preview #portalHeader { pointer-events: none; }
body.dashboard-editor-preview [data-home-section] { position: relative; cursor: pointer; transition: outline-color .15s, opacity .15s; }
body.dashboard-editor-preview [data-home-section]::before { position: absolute; z-index: 20; inset: -8px; border: 2px solid transparent; pointer-events: none; content: ""; }
body.dashboard-editor-preview [data-home-section]:hover::before { border-color: #718087; }
body.dashboard-editor-preview [data-home-section].editor-selected::before { border-color: #111; box-shadow: 0 0 0 3px #fff; }
body.dashboard-editor-preview [data-home-widget].editor-widget-selected { position: relative; outline: 2px dashed #00a8d6; outline-offset: 3px; }
body.dashboard-editor-preview [data-home-section] a,
body.dashboard-editor-preview [data-home-section] button,
body.dashboard-editor-preview [data-home-section] select { pointer-events: none; }
body.dashboard-editor-preview [data-home-field] { position: relative; z-index: 25; cursor: text; pointer-events: auto; }
body.dashboard-editor-preview .brand-achievement-grid > .brand-performance-card,
body.dashboard-editor-preview .brand-achievement-grid > .brand-performance-card [data-home-field] { pointer-events: auto; }
body.dashboard-editor-preview [data-home-field][contenteditable="true"] { position: relative; z-index: 30; outline: 2px solid #111; outline-offset: 4px; background: #fff; color: #111; cursor: text; pointer-events: auto; }
@media (prefers-reduced-motion: reduce) { body[data-page="dashboard"] [data-home-widget] { animation: none !important; } }
@media (max-width: 760px) { body[data-page="dashboard"] [data-widget-width="wide"], body[data-page="dashboard"] [data-widget-width="full"] { grid-column: 1 / -1 !important; width: 100%; } }
.custom-home-section { display: grid; gap: 20px; border-top: 1px solid #111; padding: 34px 0; }
.custom-home-section .eyebrow { display: block; margin-bottom: 7px; }
.custom-home-section h2 { margin: 0 0 12px; font-size: 30px; }
.custom-home-section h3 { margin: 0 0 10px; font-size: 21px; }
.custom-home-section p { max-width: 820px; margin: 0 0 20px; color: #657177; line-height: 1.8; white-space: pre-line; }
.custom-home-section.custom-heading { padding-top: 52px; padding-bottom: 20px; }
.custom-home-section.custom-heading h2 { font-size: 42px; }
.custom-home-section.custom-image { grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr); align-items: center; gap: 54px; }
.custom-home-section figure { margin: 0; }
.custom-home-section img { display: block; width: 100%; max-height: 520px; object-fit: cover; }
.custom-image-placeholder { display: grid; place-items: center; min-height: 260px; background: #e9eded; color: #7b868b; }
.custom-home-section.custom-cta { grid-template-columns: minmax(0, 1fr) auto; align-items: center; background: #f1f3f3; padding: 32px; }
.custom-home-section.custom-columns { grid-template-columns: 1fr 1fr; gap: 54px; }
.custom-home-section.custom-notice { border: 1px solid #cdd4d6; border-left: 5px solid #111; padding: 26px 30px; background: #f5f6f6; }

.login-page { background: #fff; color: #111; }
.login-shell { width: min(1180px, calc(100% - 64px)); min-height: 690px; margin: 5vh auto; border: 1px solid #d9d9d9; box-shadow: 0 18px 60px rgba(0,0,0,.08); }
.login-brand { position: relative; overflow: hidden; padding: 54px; background: #111; color: #fff; }
.login-brand::after { position: absolute; right: -100px; bottom: -160px; width: 410px; height: 410px; border: 1px solid #353535; border-radius: 50%; content: ""; }
.login-logo { position: relative; z-index: 1; display: block; width: fit-content; padding: 12px 15px; background: #fff; }
.login-logo img { display: block; width: 205px; height: auto; }
.login-brand-copy, .login-brand-foot { position: relative; z-index: 1; }
.login-brand .eyebrow { color: #9d9d9d; }
.login-brand h1 { margin: 9px 0 19px; font-size: 50px; font-weight: 600; }
.login-brand p { max-width: 440px; color: #c8c8c8; line-height: 1.8; }
.login-brand-foot { display: grid; gap: 7px; }
.login-brand-foot span { color: #8f8f8f; font-size: 9px; font-weight: 700; }
.login-brand-foot small { color: #c7c7c7; }
.login-panel { padding: 58px 64px; }
.login-panel h2 { color: #111; font-weight: 600; }
.login-mode-tabs button.active { border-bottom-color: #111; color: #111; }
.line-button { border-radius: 2px; }
.registration-mode .login-shell { width: min(1280px, calc(100% - 64px)); }
.registration-mode .login-brand { padding: 44px; }
.registration-mode .login-panel { padding: 40px 52px; }
.registration-agreement, .brand-contract-preview, .identity-confirmation, .contact-verification { border-radius: 0; }
.brand-contract-preview { background: #f6f6f6; }
.agreement-page { padding-top: 48px; }
.agreement-logo { display: flex; align-items: center; gap: 18px; width: fit-content; margin-bottom: 72px; }
.agreement-logo img { display: block; width: 205px; }
.agreement-logo span { border-left: 1px solid #bbb; padding-left: 18px; color: #666; font-size: 12px; }

@media (max-width: 1180px) {
  .reun-site-row, .partner-row { padding-right: 24px; padding-left: 24px; }
  .reun-site-row { grid-template-columns: 210px minmax(0, 1fr) auto; }
  .reun-site-logo img { width: 180px; }
  .reun-site-nav { gap: 18px; }
  .partner-row { grid-template-columns: 180px minmax(0, 1fr) 215px; }
  .main-nav a { padding-right: 11px; padding-left: 11px; }
  body[data-page] .brand-achievement-grid,
  body[data-page] .brand-achievement-grid[data-columns] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-page] .brand-achievement-grid > .brand-performance-card:nth-child(2n) { border-right: 0; }
}

@media (max-width: 820px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  .site-header { position: sticky; }
  .reun-site-row { grid-template-columns: 1fr auto; min-height: 68px; padding: 0 18px; }
  .reun-site-logo img { width: 168px; }
  .mobile-menu { display: block; min-width: 56px; min-height: 38px; border: 1px solid #111; padding: 0 10px; }
  .reun-site-nav, .partner-row { display: none; }
  .site-header.menu-open { max-height: 100vh; overflow-y: auto; }
  .site-header.menu-open .reun-site-nav { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid #ddd; padding: 10px 0 16px; }
  .site-header.menu-open .reun-site-nav a { border-bottom: 1px solid #eee; padding: 14px 4px; }
  .site-header.menu-open .reun-site-nav a::after { display: none; }
  .site-header.menu-open .partner-row { display: grid; grid-template-columns: 1fr; width: 100%; padding: 18px; }
  .partner-title { margin-bottom: 10px; }
  .main-nav { display: grid; gap: 0; width: 100%; }
  .main-nav a { place-items: start; min-height: 46px; border-bottom: 1px solid #363636; padding: 14px 0; }
  .header-actions { justify-content: flex-start; padding-top: 13px; }
  .account-link { border-left: 0; padding-left: 0; }
  body[data-page] .page-shell { padding: 38px 18px 72px; }
  body[data-page] .page-heading { align-items: flex-start; flex-direction: column; gap: 18px; }
  body[data-page] .page-heading h1 { font-size: 32px; }
  body[data-page] .brand-achievement-grid,
  body[data-page] .brand-achievement-grid[data-columns] { grid-template-columns: 1fr; }
  body[data-page] .brand-achievement-grid > .brand-performance-card, body[data-page] .brand-achievement-grid > .brand-performance-card:first-child { border-right: 0; padding: 18px 0; }
  body[data-page] .brand-achievement-section .section-head { align-items: flex-start; flex-direction: column; }
  body[data-page] .brand-card-head, body[data-page] .brand-card-meta { width: 100%; }
  .reun-site-row { max-width: 100vw; }
  .mobile-menu { justify-self: end; }
  .login-shell, .registration-mode .login-shell { grid-template-columns: minmax(0, 1fr); width: 100%; min-width: 0; min-height: 100vh; margin: 0; border: 0; }
  .login-brand, .registration-mode .login-brand { min-height: 315px; padding: 30px 22px; }
  .login-logo img { width: 170px; }
  .login-brand h1, .registration-mode .login-brand h1 { font-size: 38px; }
  .login-brand p { font-size: 14px; }
  .login-brand, .login-panel, .registration-mode .login-brand, .registration-mode .login-panel { min-width: 0; }
  .login-brand-copy, .login-brand p, .login-panel > div, .login-panel p { max-width: 100%; overflow-wrap: anywhere; }
  .login-panel, .registration-mode .login-panel { max-height: none; overflow: visible; padding: 38px 22px; }
  .login-mode-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; min-width: 0; }
  .login-mode-tabs button { min-width: 0; white-space: normal; }
  .registration-fields { grid-template-columns: 1fr; }
  .agreement-logo { margin-bottom: 52px; }
  .agreement-logo img { width: 165px; }
}

.brand-logo-frame { display: flex; align-items: center; width: min(190px, 62%); height: 44px; overflow: hidden; }
.brand-logo { display: block; width: 100%; height: 100%; object-fit: contain; object-position: left center; mix-blend-mode: multiply; }
.brand-logo-tabs { min-height: 64px; }
.brand-logo-tabs button { display: grid; place-items: center; min-width: 118px; height: 44px; padding: 4px 12px; }
.brand-logo-tabs button:first-of-type, .brand-logo-tabs button:last-child { min-width: auto; }
.brand-logo-tabs button img { display: block; width: 105px; height: 34px; object-fit: contain; mix-blend-mode: multiply; }
.brand-logo-tabs button.active img { filter: invert(1) grayscale(1); mix-blend-mode: normal; }
.notice-row em { margin-left: 8px; color: #111; font-size: 10px; font-style: normal; font-weight: 800; }
.notice-row.pinned { border-top-color: #111; }

.notice-publisher { margin-bottom: 20px; }
.notice-form { display: grid; grid-template-columns: minmax(300px, 2fr) repeat(3, minmax(145px, .7fr)); align-items: end; gap: 12px; border-top: 1px solid var(--ink); padding-top: 18px; }
.notice-title { grid-column: span 2; }
.notice-check { display: flex; align-items: center; gap: 8px; min-height: 42px; color: var(--muted); font-size: 11px; }
.notice-check input { width: 16px; height: 16px; accent-color: var(--ink); }
.notice-admin-list { margin-top: 28px; }
.notice-admin-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 20px; border-top: 1px solid var(--line); padding: 15px 0; }
.notice-admin-row > div { display: grid; gap: 4px; }
.notice-admin-row span, .notice-admin-row small { color: var(--muted); font-size: 10px; }
.notice-admin-row strong { font-size: 13px; }
.notice-admin-row.disabled { opacity: .55; }
.notice-row-actions, .notice-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }

.brand-manager { margin-bottom: 20px; }
.brand-admin-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--ink); }
.brand-admin-list > button { display: grid; grid-template-columns: 110px minmax(0, 1fr); align-items: center; gap: 14px; min-height: 84px; border: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 12px; background: #fff; text-align: left; }
.brand-admin-list > button:hover { background: var(--soft); }
.brand-admin-list > button:nth-child(4n) { border-right: 0; }
.brand-admin-logo { display: grid; place-items: center; width: 110px; height: 54px; overflow: hidden; background: #fff; }
.brand-admin-logo img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.brand-admin-list > button > span:last-child { display: grid; gap: 4px; min-width: 0; }
.brand-admin-list small { color: var(--muted); font-size: 10px; }
.brand-admin-list em { color: var(--ink); font-size: 10px; font-style: normal; font-weight: 800; text-decoration: underline; }
.admin-product-modal { width: min(920px, calc(100vw - 40px)); }
.product-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.product-form label { display: grid; gap: 6px; min-width: 0; }
.product-form label > span { color: var(--muted); font-size: 10px; }
.product-form input, .product-form select { width: 100%; min-height: 42px; border: 1px solid #899399; padding: 8px 10px; background: #fff; }
.product-form .wide { grid-column: span 2; }
.product-readonly-note { display: grid; gap: 4px; border-left: 3px solid var(--blue); padding: 11px 13px; background: var(--soft); }
.product-readonly-note strong { font-size: 11px; }
.product-readonly-note span { color: var(--muted); font-size: 10px; }

@media (max-width: 1120px) {
  .notice-form { grid-template-columns: 1fr 1fr; }
  .notice-title { grid-column: 1 / -1; }
  .brand-admin-list { grid-template-columns: 1fr 1fr; }
  .brand-admin-list > button:nth-child(2n) { border-right: 0; }
}

@media (max-width: 760px) {
  .brand-logo-tabs button { min-width: 108px; }
  .brand-logo-tabs button img { width: 94px; }
  .notice-form { grid-template-columns: 1fr; }
  .notice-title { grid-column: 1; }
  .notice-admin-row { grid-template-columns: 1fr; }
  .notice-admin-row .button { width: fit-content; }
  .notice-row-actions, .notice-form-actions { justify-content: flex-start; }
  .brand-admin-list, .product-form { grid-template-columns: 1fr; }
  .brand-admin-list > button { border-right: 0; }
  .product-form .wide { grid-column: 1; }
}

.admin-account { display: grid; min-width: 86px; padding-left: 12px; border-left: 1px solid var(--line); line-height: 1.25; }
.admin-account span { font-size: 12px; font-weight: 800; }
.admin-account small { color: var(--muted); font-size: 10px; }
.admin-account[role="button"] { cursor: pointer; }
.admin-account[role="button"]:hover span, .admin-account[role="button"]:focus span { text-decoration: underline; }
.admin-logout { width: 36px; height: 36px; border: 1px solid var(--line); background: #fff; color: var(--ink); font-size: 18px; cursor: pointer; }

.admin-login-page { min-height: 100vh; background: #f1f3f3; }
.admin-login-shell { display: grid; grid-template-columns: minmax(340px, .85fr) minmax(420px, 1.15fr); width: min(1040px, calc(100% - 48px)); min-height: 650px; margin: 6vh auto; border: 1px solid #d9ddde; background: #fff; box-shadow: 0 18px 60px rgba(18,28,32,.08); }
.admin-login-brand { display: flex; flex-direction: column; justify-content: space-between; padding: 46px; background: var(--ink); color: #fff; }
.admin-login-brand img { width: 132px; height: auto; filter: brightness(0) invert(1); }
.admin-login-brand h1 { margin: 8px 0 14px; font-size: 42px; font-weight: 560; letter-spacing: 0; }
.admin-login-brand p { max-width: 360px; color: #c3cdd1; line-height: 1.7; }
.admin-login-brand small { color: #9eacb2; font-size: 11px; }
.admin-login-form-wrap { display: grid; place-items: center; width: 100%; min-width: 0; padding: 56px; }
.admin-login-form { display: grid; gap: 20px; width: 100%; min-width: 0; max-width: 390px; }
.admin-login-form h2 { margin: 6px 0 8px; font-size: 29px; }
.admin-login-form p { color: var(--muted); font-size: 13px; line-height: 1.6; }
.admin-login-form label { display: grid; min-width: 0; gap: 7px; }
.admin-login-form label span { color: var(--muted); font-size: 11px; font-weight: 800; }
.admin-login-form input { width: 100%; min-width: 0; min-height: 46px; border: 1px solid #bec6c9; padding: 0 13px; font: inherit; }
.admin-login-form .button { min-height: 47px; }
.admin-login-status { min-height: 20px; color: var(--muted); font-size: 12px; }
.admin-login-status.error { color: var(--red); }
.admin-login-status.success { color: #156b36; }
.admin-password-input { display: grid; grid-template-columns: minmax(0, 1fr) 58px; width: 100%; min-width: 0; border: 1px solid #bec6c9; }
.admin-password-input:focus-within { border-color: var(--ink); box-shadow: 0 0 0 2px rgba(18,28,32,.08); }
.admin-password-input input { width: 100%; min-width: 0; border: 0; outline: 0; }
.admin-password-input button { width: 58px; border: 0; border-left: 1px solid var(--line); background: #f5f7f7; color: var(--ink); font-size: 11px; font-weight: 800; cursor: pointer; }
.admin-field-hint { color: var(--red); font-size: 11px; }
.admin-login-help { max-width: 100%; overflow-wrap: anywhere; border-top: 1px solid var(--line); padding-top: 16px; }
.admin-password-rules { display: grid; gap: 7px; margin: 0; padding: 13px 15px; background: #f5f7f7; color: var(--muted); font-size: 12px; list-style: none; }
.admin-password-rules li::before { content: "○"; display: inline-block; width: 20px; color: #8a969b; }
.admin-password-rules li.valid { color: #156b36; }
.admin-password-rules li.valid::before { content: "✓"; color: #156b36; }
.product-master-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.product-master-actions label.button { display: inline-flex; align-items: center; margin: 0; cursor: pointer; }
.admin-product-import-modal { width: min(780px, calc(100vw - 32px)); }
.import-summary { display: grid; gap: 5px; border-left: 3px solid #7c8a90; padding: 13px 15px; background: #f5f7f7; }
.import-summary.success { border-color: #69a875; }
.import-summary.error { border-color: #c96f6f; }
.import-summary span, .import-errors span { color: var(--muted); font-size: 12px; }
.import-errors { display: grid; gap: 8px; margin-top: 14px; }
.import-errors > div { display: grid; gap: 4px; border-bottom: 1px solid var(--line); padding: 10px 0; }
.admin-password-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: end; gap: 10px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.admin-password-form label { display: grid; gap: 6px; }
.admin-password-form label span { color: var(--muted); font-size: 11px; font-weight: 750; }
.admin-password-form input, .admin-user-create input, .admin-user-create select { min-height: 40px; border: 1px solid #aeb8bc; padding: 0 11px; background: #fff; font: inherit; }
.account-security-intro { display: grid; gap: 5px; margin-bottom: 14px; }
.account-security-intro span, .admin-password-note { color: var(--muted); font-size: 12px; }
.admin-password-note { margin: 10px 0 0; }
.admin-user-section-head { margin-top: 34px; }
.admin-user-create { display: grid; grid-template-columns: 1fr 1fr 160px auto; gap: 9px; margin: 18px 0; }
.admin-user-list { display: grid; }
.admin-user-list article { display: grid; grid-template-columns: minmax(220px, 1fr) 150px 120px auto auto; align-items: center; gap: 8px; border-top: 1px solid var(--line); padding: 12px 0; }
.admin-user-list article > div { display: grid; gap: 4px; }
.admin-user-list article span { color: var(--muted); font-size: 11px; }
.temporary-password { display: grid; gap: 8px; border: 1px solid var(--line); padding: 18px; background: #f5f7f7; }
.temporary-password strong { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 20px; letter-spacing: 0; overflow-wrap: anywhere; }
.temporary-password span, .temporary-password small { color: var(--muted); }
.product-image-upload { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px 12px; border: 1px dashed #aab5b9; padding: 12px; }
.product-image-upload > span { grid-column: 1 / -1; }
.product-image-upload input { min-height: auto; border: 0; padding: 0; }
.product-image-upload small { color: var(--muted); font-size: 11px; }
.product-image-upload img { grid-column: 1 / -1; width: 100%; max-width: 220px; max-height: 150px; object-fit: contain; border: 1px solid var(--line); background: #fff; }
.transfer-run-summary { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 18px; border: 1px solid var(--line); }
.transfer-run-summary article { display: grid; gap: 7px; border-right: 1px solid var(--line); padding: 16px; }
.transfer-run-summary article:last-child { border-right: 0; }
.transfer-run-summary span { color: var(--muted); font-size: 11px; }
.transfer-run-summary strong { font-size: 24px; }
.priority-panel, .readiness-panel { margin-bottom: 20px; }
.readiness-details { border-top: 1px solid var(--line); margin-top: 16px; padding-top: 12px; }
.readiness-details summary { width: fit-content; cursor: pointer; color: var(--accent-dark); font-size: 12px; font-weight: 800; }
.readiness-details[open] summary { margin-bottom: 8px; }
.readiness-pending { color: #9a5b13 !important; }
.readiness-ok { color: #156b36 !important; }
.readiness-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.readiness-summary article { display: grid; gap: 6px; border-right: 1px solid var(--line); padding: 14px; }
.readiness-summary article:last-child { border-right: 0; }
.readiness-summary span { color: var(--muted); font-size: 10px; }
.readiness-summary strong { font-size: 22px; }
.readiness-list { display: grid; }
.readiness-list > article { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px; border-bottom: 1px solid var(--line); padding: 13px 0; }
.readiness-list > article > div { display: grid; grid-template-columns: 82px minmax(0, 1fr); align-items: center; gap: 3px 12px; }
.readiness-list > article span { grid-row: span 2; align-self: start; width: fit-content; padding: 4px 6px; background: #fff0df; color: #8b4a00; font-size: 9px; font-weight: 800; }
.readiness-list > article.warning span { background: #edf2f4; color: #526169; }
.readiness-list > article strong { font-size: 12px; }
.readiness-list > article small { color: var(--muted); font-size: 10px; }

@media (max-width: 1400px) and (min-width: 761px) {
  .admin-top { gap: 20px; }
  .admin-top > div:first-child { min-width: 190px; }
  .admin-top h1 { font-size: 24px; white-space: nowrap; }
  .admin-top-actions { gap: 10px; }
  .admin-top-actions > span { display: none; }
}

@media (max-width: 760px) {
  .admin-login-shell { grid-template-columns: minmax(0, 1fr); width: 100%; min-height: 100vh; margin: 0; border: 0; }
  .admin-login-brand { min-height: 230px; padding: 28px 24px; }
  .admin-login-brand h1 { font-size: 32px; }
  .admin-login-form-wrap { padding: 38px 24px; }
  .admin-login-form { width: 100%; max-width: 390px; }
  .admin-account { display: none; }
  .product-master-actions { justify-content: flex-start; }
  .admin-password-form, .admin-user-create, .admin-user-list article { grid-template-columns: 1fr; }
  .transfer-run-summary { grid-template-columns: 1fr; }
  .transfer-run-summary article { border-right: 0; border-bottom: 1px solid var(--line); }
  .readiness-summary { grid-template-columns: 1fr 1fr; }
  .readiness-summary article { border-bottom: 1px solid var(--line); }
  .readiness-list > article { grid-template-columns: 1fr; }
  .readiness-list > article > div { grid-template-columns: 74px minmax(0, 1fr); }
  .priority-panel .section-head, .readiness-panel .section-head, .admin-dashboard-grid .section-head { align-items: stretch; flex-direction: column; }
  .priority-panel .section-head > div, .readiness-panel .section-head > div, .admin-dashboard-grid .section-head > div { align-items: flex-start; flex-direction: column; gap: 4px; }
  .priority-panel .section-head .button, .readiness-panel .section-head .button { width: 100%; }
  .admin-logout { position: fixed; z-index: 42; top: 14px; right: 70px; border-color: #59666d; background: transparent; color: #fff; }
}

.invite-qr-modal { width: min(520px, 100%); }
.invite-qr-body { display: grid; justify-items: center; gap: 12px; text-align: center; }
.invite-qr-body img { width: min(320px, 100%); aspect-ratio: 1; border: 1px solid var(--line); background: #fff; }
.invite-qr-body > span { max-width: 360px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.invite-qr-body code { width: 100%; overflow-wrap: anywhere; border-top: 1px solid var(--line); padding-top: 12px; color: var(--muted); font-size: 10px; }
.invite-code-row > div:first-child { grid-template-columns: minmax(180px, 1fr); }
.invite-code-row small, .invite-code-row span { grid-column: 1; }
.smart-order-panel { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); margin-bottom: 24px; padding: 20px 0; }
.smart-order-input { display: grid; grid-template-columns: 1fr 180px; align-items: stretch; gap: 10px; }
.smart-order-input textarea { min-height: 86px; resize: vertical; border: 1px solid #899399; padding: 12px; font: inherit; }
.smart-order-result { display: grid; gap: 12px; margin-top: 14px; }
.smart-order-summary { display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); padding-bottom: 10px; }
.smart-order-summary span, .smart-order-lines article span { color: var(--muted); font-size: 10px; }
.smart-order-lines { display: grid; }
.smart-order-lines article { display: grid; grid-template-columns: minmax(0, 1fr) 90px 80px; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); padding: 10px 0; }
.smart-order-lines article > div { display: grid; gap: 4px; }
.smart-order-lines article > b { font-size: 10px; }
.smart-order-lines article.review > b { color: var(--red); }
@media (max-width: 720px) { .smart-order-input { grid-template-columns: 1fr; }.smart-order-lines article { grid-template-columns: 1fr auto; }.smart-order-lines article .button { grid-column: 1 / -1; }.smart-order-summary { display: grid; } }
@media (max-width: 820px) { .custom-home-section.custom-image, .custom-home-section.custom-cta, .custom-home-section.custom-columns { grid-template-columns: 1fr; gap: 24px; }.custom-home-section.custom-heading h2 { font-size: 34px; } }

/* ── 信用管制開關 ──────────────────────────────────────────
   這是設定面板,不是驗證訊息。原本借用 .validation 的樣式,
   結果一個開關長得像錯誤框,而且按鈕沒有間距。2026-08-08 重做。 */
.credit-panel { border: 1px solid var(--line); border-left: 4px solid var(--muted);
  background: #fff; margin-bottom: 18px; }
.credit-panel[data-mode="block"] { border-left-color: var(--green); }
.credit-panel[data-mode="warn"]  { border-left-color: var(--orange); }
.credit-panel[data-mode="off"]   { border-left-color: var(--red); }
.credit-panel-main { display: flex; align-items: center; justify-content: space-between;
  gap: 18px; flex-wrap: wrap; padding: 14px 16px; }
.credit-panel-state { display: grid; gap: 2px; min-width: 220px; }
.credit-panel-label { font-size: 10.5px; font-weight: 800; letter-spacing: .1em; color: var(--muted); }
.credit-panel-mode { font-size: 17px; line-height: 1.3; }
.credit-panel[data-mode="block"] .credit-panel-mode { color: var(--green); }
.credit-panel[data-mode="warn"]  .credit-panel-mode { color: var(--orange); }
.credit-panel[data-mode="off"]   .credit-panel-mode { color: var(--red); }
.credit-panel-desc { font-size: 12.5px; color: var(--muted); }
.credit-panel-modes { display: flex; gap: 8px; flex-wrap: wrap; }
.credit-panel-modes .button { margin-top: 0; min-height: 38px; padding: 0 14px; }
.credit-panel-meta { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  border-top: 1px solid var(--line); background: var(--soft);
  padding: 9px 16px; font-size: 11.5px; color: var(--muted); }