/* Shared settings only. Classic business screens keep their original styling. */
.product .photo{position:relative}
.product .photo .cloud-image-retry{position:absolute;left:8px;right:8px;bottom:8px;min-height:44px;padding:8px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font-family:inherit;font-size:12px;line-height:1.4;cursor:pointer}
.product .photo .cloud-image-retry:disabled{opacity:.7;cursor:wait}
.cloud-image-retry:focus-visible,#salesPeriod:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.sales-period{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:18px 0;color:var(--muted);font-size:13px}
.sales-period .select{min-width:150px;min-height:44px;max-width:100%;color:var(--ink)}
.sales-period span{flex-basis:100%;font-size:12px}
#productForm{--field-error:#a12e32}
html[data-appearance="baroque"] #productForm{--field-error:#ffb4bc}
#productForm .product-field-error{margin:4px 0 0;color:var(--field-error);font-size:13px;line-height:1.5;white-space:normal}
html #productForm [aria-invalid="true"]{border-color:var(--field-error);outline:1px solid var(--field-error);outline-offset:1px}
#lumaEntrance:not([hidden]){pointer-events:auto}
html[data-appearance="classic"] #lumaEntrance:not([hidden]){pointer-events:auto}
html:not(:has(#visualPreviewTools)) .app{padding-top:24px}
html[data-appearance="classic"]:not(:has(#visualPreviewTools)) .app{padding-top:24px}
html .aura-sample{background:radial-gradient(ellipse at 10% 20%,#bdd4ed,transparent 70%),radial-gradient(ellipse at 90% 80%,#efc5b9,transparent 70%),#e9f3f0}
html:not([data-appearance="classic"]) #homePage .stat em,html:not([data-appearance="classic"]) .stat em,html:not([data-appearance="classic"]) .chart-note{font-size:12px}
@media(max-width:800px){html:not([data-appearance="classic"]) .mobile-nav button .nav-label{font-size:12px;line-height:1.4}html:not(:has(#visualPreviewTools)) .app{padding-top:calc(24px + var(--pwa-safe-top))}}
/* Round only the launch tile background, never replace the brand asset. */
#lumaEntrance .entrance-word{line-height:0;letter-spacing:normal}
#lumaEntrance .entrance-word img{display:block;width:88px;height:88px;margin:auto;object-fit:contain;border-radius:26px;filter:none;box-shadow:0 12px 30px #00000018}
#visualPreviewTools{position:fixed;inset:0 0 auto;z-index:1100;background:#fff;border-bottom:1px solid #e3ded8;padding:6px 12px;min-height:36px;font-size:11px;color:#665e58;display:flex;align-items:center;justify-content:space-between;gap:10px}
#visualPreviewTools>div{display:flex;gap:12px;align-items:center}
#visualPreviewTools a,#visualPreviewTools button{color:inherit;background:none;font-size:11px;padding:0;min-height:28px}
#visualPreviewTools [hidden]{display:none}
#appearancePanel{margin-top:20px;scroll-margin-top:70px}
#appearancePanel .panel-head{gap:12px;flex-wrap:wrap}
#appearancePanel .panel-head span,#appearancePanel p{font-size:12px;color:var(--muted);line-height:1.7}
.appearance-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.appearance-options button{text-align:left;background:var(--card);color:var(--ink);border:2px solid var(--line);border-radius:14px;padding:12px;min-width:0}
.appearance-options button[aria-pressed="true"]{border-color:var(--brown)}
.appearance-options button[aria-pressed="true"] b:after{content:' · 已选';font-size:12px}
.appearance-options b,.appearance-options small{display:block;margin-top:7px}
.appearance-options small{font-size:12px;color:var(--muted);line-height:1.5}
.theme-sample{height:64px;display:block;border-radius:8px;position:relative;overflow:hidden}
.theme-sample:after{content:'';position:absolute;inset:14px 20%;border-radius:6px;background:#ffffffab;border:1px solid #ffffffdd;box-shadow:12px 9px 0 #ffffff60}
.classic-sample{background:linear-gradient(120deg,#eee4d6,#bda68e)}
.aura-sample{background:radial-gradient(ellipse at 15% 20%,#a7baf0,transparent 75%),radial-gradient(ellipse at 85% 85%,#e8adce,transparent 75%),#e7e2f6}
.baroque-sample{background:radial-gradient(ellipse at 75% 0,#642d35,transparent 75%),#171518;border:1px solid #b8995f}
.baroque-sample:after{background:#211b1e;border:1px solid #bd9d61;outline:1px solid #bd9d6155;outline-offset:4px;box-shadow:none;border-radius:20px 20px 2px 2px}
.appearance-options [data-theme="baroque"]{grid-column:1/-1}
@media(min-width:600px){.appearance-options{grid-template-columns:repeat(3,1fr)}.appearance-options [data-theme="baroque"]{grid-column:auto}}
#appearancePanel button:focus-visible{outline:3px solid var(--brown);outline-offset:3px}
html[data-appearance="classic"] .app{padding-top:66px}
/* Classic adds only its entrance, preserving all other original visual behavior. */
html[data-appearance="classic"] #lumaEntrance{position:fixed;inset:0;z-index:1050;display:grid;place-items:center;background:var(--paper);pointer-events:none;overflow:hidden}
html[data-appearance="classic"] #lumaEntrance[hidden]{display:none}
html[data-appearance="classic"] #lumaEntrance:before{content:'';position:absolute;width:min(680px,140vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(ellipse at 25% 35%,#dcc5a480,transparent 55%),radial-gradient(ellipse at 75% 65%,#b99b783b,transparent 60%);filter:blur(20px);animation:classic-glow .85s ease-out both}
html[data-appearance="classic"] .entrance-content{text-align:center;position:relative}
html[data-appearance="classic"] .entrance-word img{display:block;margin:auto;object-fit:contain}
html[data-appearance="classic"] .entrance-sub{font-size:10px;letter-spacing:.2em;color:var(--muted);margin-top:18px}
html[data-appearance="classic"] .entrance-line{height:1px;width:84px;background:var(--gold);margin:26px auto 0;transform-origin:left}
@keyframes classic-glow{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){html[data-appearance="classic"] #lumaEntrance{display:none}html[data-appearance="classic"] #lumaEntrance:before{animation:none}}

/* 统计入口、月份筛选及只读明细，沿用各主题的语义颜色。 */
#salesPage .sales-period{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:20px 0 16px}
#salesPage .sales-period label{font-size:14px;white-space:nowrap}
#salesPage #salesPeriod{width:200px;max-width:100%;min-height:44px;padding:9px 10px;font:inherit;font-size:16px}
#salesPage #salesPeriodSummary{flex-basis:100%;color:var(--muted);font-size:12px;line-height:1.6}
#salesPage .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
#homePage .metric-button,#salesPage .metric-button{font-family:inherit;text-align:left;min-width:0;color:var(--ink);cursor:pointer;touch-action:manipulation;transition:box-shadow .15s,opacity .15s}
#homePage .metric-button:active,#salesPage .metric-button:active{opacity:.75}
#homePage .metric-button:focus-visible,#salesPage .metric-button:focus-visible{outline:2px solid var(--brown);outline-offset:3px}
.metric-button strong{overflow-wrap:anywhere}
.metric-button .metric-hint{display:block;margin-top:10px;color:var(--brown);font-size:12px}
#metricBack{z-index:60}
#metricBack[hidden]{display:none}
#metricBack .metric-dialog{background:var(--paper);color:var(--ink);width:min(620px,100%)}
#metricBack .close{min-width:44px;min-height:44px;flex-shrink:0}
#metricBody{overflow:auto;overscroll-behavior:contain;touch-action:pan-y;padding:18px 23px 26px;min-height:0;line-height:1.6}
#metricBody .sub{margin-bottom:16px}
.metric-total{font-size:30px;font-weight:700;margin:0 0 8px;overflow-wrap:anywhere}
.metric-line{padding:14px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.metric-line b,.metric-line span{display:block}
.metric-line span{color:var(--muted);font-size:13px;margin-top:4px}
.metric-order{margin-bottom:18px}.metric-order h3{font-size:16px;margin:0;color:var(--brown)}
.metric-day{margin:0 0 18px}.metric-day>div:first-child{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px}
.metric-track{height:8px;border-radius:8px;background:var(--line);margin-top:6px;overflow:hidden}
.metric-track i{display:block;height:100%;width:var(--metric-width);background:var(--brown);border-radius:8px;transform-origin:left;animation:metric-grow .35s ease-out}
.metric-track i.negative{background:var(--red)}
@keyframes metric-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:800px){#salesPage .stats{grid-template-columns:repeat(2,minmax(0,1fr))}#salesPage .stats>.stat:last-child{grid-column:1/-1}#metricBody{padding:16px 19px 24px}}
@media(prefers-reduced-motion:reduce){.metric-track i{animation:none}#homePage .metric-button,#salesPage .metric-button{transition:none}}