:root {
  color-scheme: light;
  --paper: #edf4f2;
  --paper-deep: #dceae9;
  --ink: #103147;
  --forest: #0f7185;
  --orange: #da8250;
  --muted: #5d7580;
  --line: rgba(16, 49, 71, .18);
  --serif: "Songti SC", "STSong", "Noto Serif CJK SC", serif;
  --sans: "Avenir Next", "PingFang SC", "Noto Sans CJK SC", sans-serif;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: var(--paper); }
body { min-height: 100vh; margin: 0; color: var(--ink); font-family: var(--sans); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.micro { font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.muted { color: var(--muted); }
.message { min-height: 1.4em; margin: 12px 0 0; font-size: 13px; color: var(--forest); }
.message.error { color: #a02e1f; }
.small { font-size: 12px; line-height: 1.6; }

.login-shell { display: grid; grid-template-columns: 1.08fr .92fr; min-height: 100vh; }
.login-art { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(30px, 5vw, 70px); background: var(--forest); color: var(--paper); }
.login-art::after { content: "P"; position: absolute; right: -3vw; bottom: -22vh; font-family: Georgia, serif; font-size: min(65vw, 900px); font-style: italic; line-height: 1; opacity: .08; pointer-events: none; }
.login-art .brand { position: relative; z-index: 1; width: fit-content; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 7px; }
.login-art h1 { position: relative; z-index: 1; margin: 0; max-width: 650px; font-family: var(--serif); font-weight: 400; font-size: clamp(60px, 8vw, 140px); letter-spacing: -.07em; line-height: .95; }
.login-art h1 span { display: block; margin-left: .28em; color: #f6b291; font-style: italic; }
.login-art .login-foot { position: relative; z-index: 1; border-top: 1px solid rgba(255,255,255,.38); padding-top: 18px; }
.login-side { display: flex; align-items: center; justify-content: center; padding: 40px clamp(28px, 5vw, 80px); background: radial-gradient(circle at 100% 0, #f9d8c6 0, transparent 35%), var(--paper); }
.login-box { width: min(100%, 420px); }
.login-box .eyebrow { color: var(--orange); margin-bottom: 28px; }
.login-box h2 { margin: 0 0 16px; font: 400 clamp(38px, 4vw, 62px)/1.12 var(--serif); letter-spacing: -.04em; }

label { display: block; font-size: 13px; font-weight: 600; }
label span { display: block; margin-bottom: 8px; }
input, select, textarea { width: 100%; min-height: 46px; padding: 11px 13px; border: 1px solid #abb8ac; border-radius: 0; background: #fffdf7; color: var(--ink); outline: none; }
input:focus, select:focus, textarea:focus { border-color: var(--forest); box-shadow: 0 0 0 2px rgba(36,94,73,.12); }
.form-stack { display: grid; gap: 22px; }
.primary, .secondary, .text-button { min-height: 45px; border: 1px solid var(--ink); padding: 10px 17px; font-weight: 700; background: var(--ink); color: #fff; }
.primary:hover { background: var(--forest); border-color: var(--forest); }
.secondary { background: transparent; color: var(--ink); }
.secondary:hover { background: var(--paper-deep); }
.text-button { min-height: auto; border: 0; padding: 4px 0; background: none; color: var(--ink); font-size: 12px; text-decoration: underline; text-underline-offset: 4px; }
.wide { width: 100%; }

.app-shell { min-height: 100vh; background: linear-gradient(90deg, transparent calc(50% - .5px), rgba(24,32,29,.055) 50%, transparent calc(50% + .5px)), var(--paper); }
.app-header { display: flex; justify-content: space-between; align-items: center; gap: 20px; min-height: 92px; padding: 18px clamp(24px, 4vw, 64px); border-bottom: 1px solid var(--ink); }
.app-brand { display: flex; align-items: baseline; gap: 12px; text-decoration: none; }
.app-brand strong { font: 400 28px var(--serif); letter-spacing: -.06em; }
.app-user { display: flex; align-items: center; gap: 20px; }
.back-home { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; padding: 10px 16px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); font-size: 14px; font-weight: 600; text-decoration: none; }
.back-home span { font-size: 20px; line-height: 1; }
.back-home:hover { background: var(--paper-deep); border-color: var(--forest); }
.account-pill { color: var(--muted); font-size: 12px; }
.page-content { max-width: 1480px; margin: 0 auto; padding: clamp(38px, 5vw, 76px) clamp(24px, 4vw, 64px) 90px; }
.page-lead { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 46px; }
.page-lead .kicker { color: var(--forest); margin: 0 0 16px; }
.page-lead h1 { margin: 0; font: 400 clamp(30px,3.2vw,42px)/1.2 var(--serif); letter-spacing: -.04em; }
.home-lead { margin-bottom: 28px; }
.page-lead p:not(.kicker) { max-width: 390px; margin: 0; line-height: 1.8; color: var(--muted); font-size: 14px; }
.rule { border: 0; border-top: 1px solid var(--ink); margin: 0 0 34px; }
.module-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px,1fr)); gap: 18px; }
.module { min-height: 136px; display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: 18px; text-decoration: none; border: 1px solid var(--ink); border-radius: 12px; background: #e9eadf; padding: 24px; transition: transform 200ms ease, background 200ms ease; }
.module:hover, .module:focus-visible { transform: translateY(-3px); background: #dee8dd; }
.module.account { background: #f5ddcd; }
.module.account:hover { background: #f6d0b8; }
.module.catalog { background: #dce8e5; }
.module.catalog:hover { background: #c9dfda; }
.entry-tabs { display: flex; gap: 8px; margin: 0 0 24px; border-bottom: 1px solid var(--ink); }
.entry-tabs a { padding: 12px 20px; text-decoration: none; font-size: 14px; font-weight: 700; border-bottom: 3px solid transparent; }
.entry-tabs a[aria-current="page"] { color: var(--forest); border-bottom-color: var(--orange); }
.liu-controls { display: flex; gap: 16px; align-items: end; }
.liu-controls label { width: 240px; max-width: 60%; }
.liu-controls button { white-space: nowrap; }
.liu-section { margin-top: 32px; }
.liu-table { min-width: 740px; }
.liu-table th[scope="row"] { white-space: nowrap; }
.monthly-table.sea-cucumber-table { table-layout: fixed; min-width: 900px; }
.sea-cucumber-table col { width: calc(100% / 6); }
.sales-table.sea-cucumber-table td.product-name { min-width: 0; max-width: none; white-space: normal; }
.liu-salary-total { display: flex; align-items: baseline; gap: 24px; padding: 0 8px 24px; color: var(--forest); }
.liu-salary-total strong { font-family: var(--serif); font-size: clamp(26px,4vw,38px); font-weight: 400; }
.module-icon { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid var(--ink); border-radius: 10px; }
.module-icon svg { width: 29px; height: 29px; fill: none; stroke: var(--ink); stroke-width: 1.5; }
.module-arrow { font: 25px Georgia, serif; color: var(--forest); }
.module h2 { margin: 0; font: 500 clamp(20px,2vw,27px) var(--sans); letter-spacing: .02em; }

.section { margin-top: 50px; border-top: 1px solid var(--ink); padding-top: 22px; }
.section-title { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.section-title h2 { margin: 0; font: 400 clamp(25px,3vw,35px) var(--serif); }
.section-title p { margin: 0; color: var(--muted); font-size: 12px; }
.panel { border: 1px solid var(--line); background: rgba(255,253,247,.7); padding: 24px; }
.filters { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 14px; align-items: end; }
.filters label { min-width: 0; }
.filters button { align-self: end; }
.monthly-upload-scope { display: flex; align-items: end; justify-content: space-between; gap: 20px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.monthly-upload-scope > label { width: 240px; max-width: 55%; }
.monthly-upload-scope > button { flex-shrink: 0; }
.platform-uploads { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 24px; }
.platform-upload { padding: 22px; border: 1px solid var(--line); background: #edf5f3; min-width: 0; }
.platform-upload > span { display: block; font-size: 18px; color: var(--ink); margin-bottom: 18px; }
.platform-upload input { width: 100%; min-width: 0; background: #fff; }
.import-result-dialog { width: min(1050px,calc(100vw - 32px)); max-height: 85vh; padding: 28px; color: var(--ink); background: #f8fbfa; border: 1px solid var(--line); overflow-y: auto; }
.import-result-dialog::backdrop { background: rgb(15 45 59 / 60%); }
.import-result-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); padding-bottom: 18px; }
.import-result-heading h2 { margin: 0; }
.upload-result { margin-top: 24px; }
.upload-result h3 { display: flex; align-items: center; gap: 14px; }
.comparison-table { min-width: 700px; }
.comparison-warning { color: #8a361c; background: #fff0e6; }
.reconciliation-summary { margin: 0 0 16px; font-weight: 700; }
.reconciliation-details { margin-top: 20px; }
.reconciliation-details > summary { cursor: pointer; color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
.reconciliation-table { min-width: 940px; }
.reconciliation-status { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.reconciliation-status small { color: var(--muted); font-size: 11px; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; margin-top: 18px; }
.metric-card { min-height: 130px; padding: 20px; border: 1px solid var(--ink); background: #e3e9dc; }
.metric-card:nth-child(2) { background: #f6dfd0; }
.metric-card:nth-child(3) { background: #ece8d7; }
.metric-card:nth-child(4) { background: #e6e4df; }
.metric-card span { color: var(--muted); font-size: 12px; }
.metric-card strong { display: block; margin-top: 20px; font: 400 clamp(28px,3vw,43px) var(--serif); letter-spacing: -.05em; }
.sales-layout { display: grid; grid-template-columns: 1.25fr .75fr; gap: 18px; }
.sales-lead { margin-bottom: 40px; }
.panel.sales-question { margin-bottom: 20px; padding: 26px 30px; border-color: var(--ink); background: linear-gradient(120deg,#123f59,#0d6171); color: #f8fcfa; }
.sales-question .micro { margin: 0 0 8px; color: #b8dedb; }
.sales-question h2 { margin: 0; font: 400 clamp(27px,3vw,38px) var(--serif); }
.sales-question p:not(.micro):not(.message) { margin: 9px 0 0; color: #d8ece9; font-size: 13px; line-height: 1.7; }
.sales-question .question-row { margin-top: 20px; }
.sales-question .primary { border-color: #b8dedb; background: #b8dedb; color: var(--ink); }
.sales-question .primary:hover { border-color: #fff; background: #fff; }
.sales-question .message { color: #d8ece9; }
.sales-question .message.error { color: #ffd3c4; }
.sales-question .answer { color: var(--ink); }
.sales-controls { padding: 20px 24px; background: #e9e9dd; }
.sales-filters { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)) auto; gap: 12px; align-items: end; }
.sales-filters label { min-width: 0; }
.sales-filters > button { grid-column: 5; white-space: nowrap; }
.sales-filters.category-filters { grid-template-columns: repeat(3,minmax(0,1fr)) auto; }
.category-filters > button { grid-column: 4; }
.sales-method { margin-top: 14px; color: var(--muted); font-size: 12px; }
.sales-method summary { width: fit-content; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.sales-method p { max-width: 940px; margin: 10px 0 0; line-height: 1.8; }
.sales-hero { display: grid; grid-template-columns: minmax(0,1.8fr) minmax(260px,.7fr); margin-top: 22px; border: 1px solid var(--ink); }
.sales-hero-main { min-width: 0; padding: clamp(28px,4vw,54px); background: var(--forest); color: #f8f3e7; }
.sales-hero-main .micro { color: #b3d7c6; }
.sales-hero-main h2 { margin: 28px 0 0; font: 400 clamp(27px,3vw,42px) var(--serif); }
.sales-hero-main > strong { display: block; margin: 7px 0 26px; font: 400 clamp(46px,6vw,87px)/1.08 var(--serif); letter-spacing: -.045em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.sales-hero-target { border-top: 1px solid rgba(255,255,255,.35); padding-top: 18px; }
.sales-hero-target span { display: block; color: #bcdedc; font-size: 13px; }
.sales-hero-target strong { display: block; margin-top: 7px; font: 400 clamp(25px,2.8vw,38px) var(--serif); font-variant-numeric: tabular-nums; }
.sales-hero-caveat { margin: 0; border-top: 1px solid rgba(255,255,255,.35); padding-top: 17px; color: #d9e4d8; font-size: 13px; line-height: 1.7; }
.sales-hero-aside { display: flex; flex-direction: column; justify-content: stretch; background: #dfe8da; }
.sales-hero-aside div { display: flex; flex: 1; flex-direction: column; justify-content: center; padding: 18px 24px; border-bottom: 1px solid var(--line); }
.sales-hero-aside div:last-child { border-bottom: 0; }
.sales-hero-aside span { display: block; color: var(--muted); font-size: 12px; }
.sales-hero-aside strong { display: block; margin-top: 8px; font: 400 clamp(20px,2vw,29px) var(--serif); line-height: 1.3; }
.sales-prior-change { display: block; margin-top: 9px; font-size: 12px; line-height: 1.5; }
.sales-prior-change.up { color: #176b59; }
.sales-prior-change.down { color: #a64528; }
.sales-prior-change.flat { color: var(--muted); }
.sales-section { margin-top: 48px; }
.sales-tabs { margin-bottom: 26px; }
.monthly-hero-change { margin: 12px 0 0; font-size: 14px; color: #d8ece9; }
.monthly-source { color: var(--muted); font-size: 12px; }
.monthly-table { min-width: 680px; }
.monthly-table td.num strong { font-size: 14px; font-weight: 600; }
.monthly-table td.num small { display: block; margin-top: 6px; font-size: 11px; font-weight: 400; color: var(--muted); }
.monthly-product-table { min-width: 880px; }
.monthly-product-table td:first-child { white-space: normal; }
.monthly-product-table td:first-child small { font-size: 11px; }
.monthly-product-rank { display: inline-block; min-width: 24px; margin-right: 8px; color: var(--muted); font-size: 12px; }
.monthly-products-panel { margin-top: 16px; scroll-margin-top: 24px; }
.monthly-products-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 18px; margin-bottom: 18px; }
.monthly-products-toolbar > span { color: var(--muted); font-size: 13px; }
.monthly-products-toolbar label { display: flex; align-items: center; gap: 12px; }
.monthly-products-toolbar label span { margin: 0; white-space: nowrap; }
.monthly-products-toolbar select { width: auto; }
.monthly-product-pagination { display: flex; align-items: center; justify-content: end; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.monthly-product-pagination > span { margin-right: auto; color: var(--muted); font-size: 12px; }
.sales-chart-panel { overflow-x: auto; padding: 22px 24px 16px; background: #f7f3e9; }
.sales-chart-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-width: 720px; color: var(--muted); font-size: 12px; }
.sales-legend { display: flex; gap: 18px; }
.sales-legend span { display: flex; align-items: center; gap: 7px; }
.sales-legend i { display: inline-block; width: 11px; height: 11px; }
.sales-legend .current, .sales-bar.current { background: var(--forest); }
.sales-legend .prior, .sales-bar.prior { background: #c99e81; }
.sales-chart { display: grid; grid-template-columns: repeat(12,minmax(52px,1fr)); gap: 8px; min-width: 720px; margin-top: 16px; }
.sales-month { display: grid; grid-template-rows: 176px auto; text-align: center; color: var(--muted); font-size: 12px; }
.sales-month-bars { display: flex; align-items: end; justify-content: center; gap: 4px; border-bottom: 1px solid #b9c5b9; }
.sales-bar { display: block; width: min(26px,40%); min-height: 4px; }
.sales-bar.negative { background: var(--orange); }
.sales-month.unreported { opacity: .35; }
.sales-month > span { padding-top: 10px; font-variant-numeric: tabular-nums; }
.sales-table-panel { margin-top: 14px; padding: 8px 18px; }
.sales-table th { white-space: nowrap; }
.sales-table td:first-child { white-space: nowrap; }
.sales-table td:first-child strong { font-weight: 700; }
.sales-table td:first-child small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }
.sales-table td.sales-net-cell { color: var(--forest); font-weight: 700; }
.sales-table td.up { color: #26734d; }
.sales-table td.down { color: #a64528; }
.sales-table tr.sales-unreported { color: #8b9690; }
.sales-table tr.sales-unreported td.sales-net-cell { color: inherit; }
.bars { display: flex; align-items: flex-end; gap: 12px; min-height: 190px; padding-top: 20px; overflow-x: auto; }
.bar-item { min-width: 56px; max-width: 90px; flex: 1; display: grid; justify-items: center; gap: 9px; font-size: 11px; color: var(--muted); }
.bar-item b { display: block; width: 100%; background: var(--forest); min-height: 3px; }
.bar-item span { white-space: nowrap; }
.data-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.data-table th, .data-table td { padding: 13px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.data-table th { color: var(--muted); font-size: 11px; font-weight: 700; }
.data-table td.num, .data-table th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.data-table td.product-name { min-width: 230px; max-width: 420px; line-height: 1.6; }
.table-scroll { overflow-x: auto; }
.badge { display: inline-block; border: 1px solid var(--line); padding: 4px 7px; color: var(--forest); font-size: 11px; white-space: nowrap; }
.badge.review { color: #a04424; border-color: #d6a88b; }
.empty { color: var(--muted); line-height: 1.8; font-size: 13px; }
.notice { margin: 15px 0 0; padding: 13px 16px; border-left: 4px solid var(--orange); background: #f9e7d9; font-size: 13px; line-height: 1.7; }
.question-row { display: flex; gap: 10px; }
.question-row input { flex: 1; }
.answer { margin-top: 18px; padding: 20px; border: 1px solid var(--forest); background: #e9efe6; line-height: 1.8; }
.answer strong { display: block; font: 400 34px var(--serif); }
.answer .small { margin-top: 8px; color: var(--muted); }
.account-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 24px; }
.account-row { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.account-row strong { display: block; margin-bottom: 4px; }
.permission-options { display: grid; gap: 8px; }
.check { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 400; white-space: nowrap; }
.check input { width: 17px; min-height: 17px; accent-color: var(--forest); }
.reset-form { display: flex; gap: 8px; align-items: end; }
.reset-form input { min-width: 100px; }
.reset-form button { flex-shrink: 0; }
.catalog-counts { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin-bottom: 18px; }
.catalog-counts div { border: 1px solid var(--ink); padding: 18px 20px; background: #e3e9dc; }
.catalog-counts div:nth-child(3) { background: #dce8e5; }
.catalog-counts div:nth-child(4) { background: #f5ddcd; }
.catalog-counts strong { display: block; font: 400 36px var(--serif); }
.catalog-counts span { display: block; margin-top: 7px; color: var(--muted); font-size: 12px; }
.catalog-filters { display: grid; grid-template-columns: minmax(200px,2fr) repeat(6,minmax(110px,1fr)); gap: 14px; }
.catalog-period { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line); font-size: 12px; }
.catalog-period label { flex: 1; min-width: 130px; }
.catalog-version-button { min-height: 30px; padding: 5px 10px; font-size: 12px; }
.catalog-title-history { margin-top: 10px; font-size: 12px; color: var(--ink); }
.catalog-title-history summary { cursor: pointer; }
.catalog-title-history ul { padding-left: 18px; }
.catalog-title-history li { margin-bottom: 8px; }
.catalog-version-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.catalog-version-fields .wide { grid-column: 1 / -1; }
.catalog-panel { padding-top: 18px; }
.catalog-toolbar { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.catalog-toolbar label { width: 160px; }
.catalog-toolbar label:has(#batch-product) { width: 200px; }
.catalog-toolbar label span { margin-bottom: 4px; }
.catalog-toolbar select { min-height: 42px; }
.catalog-table { min-width: 1100px; }
.catalog-table td { vertical-align: top; line-height: 1.55; }
.catalog-table .batch-select, .catalog-table #select-all { width: 17px; min-height: 17px; accent-color: var(--forest); }
.catalog-table th:first-child { min-width: 150px; }
.catalog-table.editing th:first-child { min-width: 40px; width: 40px; }
.catalog-table th:nth-child(2) { min-width: 130px; }
.catalog-table th:nth-child(3) { min-width: 130px; }
.catalog-table th:nth-child(4) { min-width: 220px; }
.catalog-table th:nth-child(5) { min-width: 220px; }
.catalog-table th:nth-child(6) { min-width: 260px; }
.catalog-table td.catalog-detail { max-width: 370px; overflow-wrap: anywhere; color: #4b5650; }
.catalog-table input, .catalog-table select, .catalog-table textarea { min-height: 38px; padding: 8px; font-size: 13px; }
.catalog-table textarea { min-width: 200px; height: 90px; resize: vertical; }
.catalog-id { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.catalog-category { color: var(--forest); font-weight: 700; }
.catalog-hint { display: block; margin-top: 4px; color: #9a5637; font-size: 11px; }
.catalog-confirmed { display: block; margin-top: 4px; color: var(--forest); font-size: 11px; }
.catalog-conflict { display: inline-block; margin-top: 6px; padding: 3px 5px; color: #9a3f20; border: 1px solid #cf9b80; font-size: 11px; }
.catalog-actions { min-width: 82px; }
.catalog-actions button { display: block; width: 100%; margin-bottom: 7px; }
.catalog-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 20px; margin-top: 18px; font-size: 13px; }
.catalog-pagination button:disabled { opacity: .4; cursor: not-allowed; }
.catalog-jump { display: flex; align-items: center; gap: 10px; }
.catalog-jump input { width: 80px; text-align: center; }

.page-content:has(.manual-sales-panel) { max-width: 1760px; }
.manual-sales-lead { margin-bottom: 28px; }
.manual-sales-panel { padding: 24px 0 0; }
.manual-sales-toolbar { display: flex; align-items: end; gap: 26px; padding: 0 24px; }
.manual-sales-toolbar > label { width: 170px; flex-shrink: 0; }
.manual-sales-toolbar > button { margin-left: auto; }
.manual-sales-toolbar > button:disabled { opacity: .5; cursor: default; }
.manual-sales-summary > span { font-size: 12px; color: var(--muted); }
.manual-sales-summary strong { display: block; margin-top: 4px; font: 400 clamp(28px,3vw,40px) var(--serif); font-variant-numeric: tabular-nums; }
.manual-sales-summary p { margin: 6px 0 0; font-size: 12px; color: var(--muted); }
.manual-sales-panel > .message { margin: 8px 24px 16px; }
.manual-sales-panel > .message:empty { display: none; }
.manual-sales-scroll { margin-top: 16px; border-top: 1px solid var(--line); }
.manual-sales-table { width: 1547px; table-layout: fixed; font-variant-numeric: tabular-nums; }
.manual-month-col { width: 65px; }
.manual-review-col { width: 60px; }
.manual-total-col { width: 150px; }
.manual-input-col { width: 142px; }
.manual-net-col { width: 140px; }
.manual-sales-table th, .manual-sales-table td { padding: 11px 8px; }
.manual-sales-table thead th { color: var(--ink); background: #d7e7e7; text-align: center; border-right: 1px solid var(--line); font-size: 12px; }
.manual-sales-table thead tr:first-child th { height: 40px; }
.manual-sales-table thead tr:nth-child(2) th { height: 36px; }
.manual-sales-table tbody th, .manual-sales-table thead tr:first-child th:first-child, .manual-sales-table tfoot th { position: sticky; left: 0; z-index: 2; background: #edf4f2; }
.manual-sales-table .manual-review, .manual-sales-table thead tr:first-child th:nth-child(2) { position: sticky; left: 65px; z-index: 2; background: #edf4f2; }
.manual-sales-table .manual-total, .manual-sales-table [data-sum="total"], .manual-sales-table thead tr:first-child th:nth-child(3) { position: sticky; left: 125px; z-index: 2; box-shadow: 1px 0 var(--line); }
.manual-sales-table tbody th { min-width: 65px; text-align: center; }
.manual-sales-table .manual-review { min-width: 60px; text-align: center; }
.manual-sales-table .manual-review input { width: 20px; min-height: 20px; margin: 0; padding: 0; accent-color: var(--forest); }
.manual-sales-table td input:not([type="checkbox"]) { min-width: 0; width: 100%; min-height: 38px; padding: 8px; background: #fff; color: var(--ink); text-align: right; font-size: 13px; font-variant-numeric: tabular-nums; }
.manual-sales-table td input[data-field]:disabled { background: #e8efed; color: #3c5860; opacity: 1; cursor: not-allowed; border-color: transparent; }
.manual-sales-table input::placeholder { color: #809399; }
.manual-sales-table .manual-calculated { background: #e1eeee; }
.manual-sales-table .manual-total { font-weight: 700; }
.manual-sales-table .manual-reviewed > th { color: var(--forest); }
.manual-sales-table tfoot { font-weight: 700; background: #d3e5e5; }
.manual-sales-table tfoot th { white-space: nowrap; text-align: center; }

@media (max-width: 650px) {
  .manual-sales-toolbar { flex-wrap: wrap; gap: 20px; }
  .manual-sales-toolbar > label { width: 125px; }
  .manual-sales-toolbar > button { width: 100%; margin-left: 0; }
  .manual-sales-summary strong { font-size: 26px; }
  .manual-sales-table .manual-total, .manual-sales-table [data-sum="total"], .manual-sales-table thead tr:first-child th:nth-child(3) { position: static; box-shadow: none; }
}

@media (max-width: 1100px) {
  .module-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sales-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sales-filters.category-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sales-filters > button { grid-column: 1 / -1; }
  .sales-filters > button { justify-self: stretch; }
  .catalog-filters { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .login-shell { grid-template-columns: 1fr; }
  .login-art { min-height: 260px; }
  .login-art h1 { font-size: 70px; }
  .login-art .login-foot { display: none; }
  .login-side { min-height: 480px; }
  .filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sales-layout, .account-layout { grid-template-columns: 1fr; }
  .sales-hero { grid-template-columns: 1fr; }
  .sales-hero-aside { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
  .sales-hero-aside div { border-bottom: 0; border-right: 1px solid var(--line); }
  .sales-hero-aside div:last-child { border-right: 0; }
  .catalog-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .catalog-counts { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 650px) {
  .app-header { flex-wrap: wrap; min-height: auto; }
  .catalog-version-fields { grid-template-columns: 1fr; }
  .app-user { gap: 12px; }
  .account-pill { display: none; }
  .page-lead { display: block; }
  .page-lead p:not(.kicker) { margin-top: 22px; }
  .module-grid { grid-template-columns: 1fr; }
  .module { min-height: 108px; padding: 20px; }
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .metric-card { min-height: 118px; padding: 14px; }
  .filters, .platform-uploads { grid-template-columns: 1fr; }
  .monthly-upload-scope { gap: 12px; }
  .monthly-upload-scope > label { width: auto; flex: 1; max-width: none; min-width: 0; }
  .monthly-upload-scope > button { padding-inline: 14px; }
  .import-result-dialog { padding: 18px; }
  .sales-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sales-filters > button { grid-column: 1/-1; justify-self: stretch; }
  .sales-hero-main > strong { font-size: clamp(43px,11vw,64px); }
  .sales-hero-aside { grid-template-columns: 1fr; }
  .sales-hero-aside div { border-right: 0; border-bottom: 1px solid var(--line); }
  .sales-chart-panel { padding: 18px; }
  .catalog-filters { grid-template-columns: 1fr; }
  .question-row { flex-direction: column; }
  .account-row { grid-template-columns: 1fr auto; }
  .account-row .secondary { grid-column: 1/-1; }
}

/* 大连海滨 / 天气观察站视觉层。保留数据表格的结构与交互。 */
body { background: var(--paper); }
:focus-visible { outline-color: var(--orange); }
input, select, textarea { border-color: #aabec3; background: #fbfdfb; }
input:focus, select:focus, textarea:focus { box-shadow: 0 0 0 3px rgba(15,113,133,.13); }
.primary { border-color: var(--ink); background: var(--ink); }
.primary:hover { background: var(--forest); border-color: var(--forest); }
.secondary:hover { background: #d8e8e8; }

.login-art { isolation: isolate; background: linear-gradient(135deg,#164e67 0%,#09283e 67%,#0d5265 100%); }
.login-art::before { content: ""; position: absolute; z-index: -1; inset: 0; background: repeating-radial-gradient(ellipse at 80% 47%,transparent 0 63px,rgba(205,235,231,.17) 64px 65px,transparent 66px 112px); }
.login-art::after { content: none; }
.login-art .brand, .login-art h1, .login-art .login-foot { z-index: 2; }
.login-art h1 { max-width: 470px; align-self: start; font-size: clamp(58px,6.5vw,105px); line-height: 1.05; }
.login-art h1 span { margin-left: 0; color: #f3b784; }
.login-portrait { position: absolute; z-index: 1; right: -5%; bottom: 0; width: min(57%,540px); height: 92%; object-fit: contain; object-position: bottom right; filter: drop-shadow(-16px 20px 22px rgba(0,24,35,.24)); pointer-events: none; }
.login-side { background: radial-gradient(circle at 100% 0,rgba(185,222,218,.75),transparent 39%),var(--paper); }
.login-box .eyebrow { color: var(--forest); }
.app-shell { background: radial-gradient(circle at 93% 7%,rgba(197,226,222,.56),transparent 28rem), repeating-linear-gradient(0deg,transparent 0 79px,rgba(16,49,71,.025) 80px 81px),var(--paper); }
.app-header { border-bottom-color: var(--line); background: rgba(237,244,242,.92); }
.app-brand strong { color: var(--ink); }
.app-brand .micro { color: var(--forest); }
.page-lead .kicker { color: var(--forest); }
.page-lead h1 { color: var(--ink); }
.rule, .section { border-color: var(--line); }
.module { overflow: hidden; position: relative; border-color: var(--line); background: linear-gradient(145deg,#d8e9e7,#eff6f3); }
.module::before { content: ""; position: absolute; right: 22px; bottom: 14px; width: 54px; height: 8px; border-top: 1px solid rgba(15,113,133,.2); border-bottom: 1px solid rgba(15,113,133,.2); transform: skewY(-8deg); pointer-events: none; }
.module:hover, .module:focus-visible { background: #d1e5e2; }
.module.account { background: linear-gradient(145deg,#e8e4d9,#f5f2e7); }
.module.account:hover { background: #e6e2d5; }
.module.catalog { background: linear-gradient(145deg,#cbdfe4,#e5eff0); }
.module.catalog:hover { background: #bfd9e0; }
.module > * { position: relative; z-index: 1; }
.module-icon { border-color: var(--forest); }
.module-icon svg { stroke: var(--forest); }
.panel { background: rgba(251,253,251,.88); }
.sales-controls { background: #e2eeee; }
.metric-card, .catalog-counts div { background: #dcece9; }
.metric-card:nth-child(2), .catalog-counts div:nth-child(4) { background: #f1e8d9; }
.metric-card:nth-child(3) { background: #e5edf0; }
.metric-card:nth-child(4) { background: #e9eeeb; }
.sales-hero-main { background: linear-gradient(135deg,#123f59,#09283e); }
.sales-hero-main .micro { color: #bcdedc; }
.sales-hero-aside { background: #dcebea; }
.sales-chart-panel { background: #f8fbf8; }
.sales-legend .prior, .sales-bar.prior { background: #dba679; }
.sales-month-bars { border-bottom-color: #a7bec3; }
.notice { background: #f8eee2; }
.answer { border-color: var(--forest); background: #e7f1ef; }

@media (max-width: 900px) {
  .login-art { min-height: 330px; }
  .login-art h1 { max-width: 58%; font-size: clamp(52px,8vw,80px); }
  .login-portrait { width: min(42%,340px); height: 110%; }
}
@media (max-width: 650px) {
  .login-art { min-height: 300px; }
  .login-art h1 { max-width: 65%; font-size: clamp(44px,10vw,62px); }
  .login-portrait { right: -12%; width: 57%; height: 100%; opacity: .84; }
  .app-brand .micro { display: none; }
}
@media (prefers-reduced-motion: reduce) { .module, .primary, .secondary { transition-duration: .01ms !important; } }