:root{--bg: #f3f5f2;--surface: #ffffff;--surface-soft: #f7f9f6;--border: #dfe5dc;--border-strong: #cbd5c8;--text: #1e2820;--muted: #68726a;--muted-light: #8a938c;--accent: #4f873b;--accent-dark: #356927;--accent-soft: #edf5e9;--warning: #b96f1d;--danger: #bd3f3a;--shadow: 0 18px 48px rgb(28 42 31 / .1);--radius: 6px}*{box-sizing:border-box}html,body,#app{min-height:100%}body{margin:0;color:var(--text);background:var(--bg);font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif;font-size:14px}button,input,textarea,select{font:inherit}.app-shell{min-height:100dvh;background:var(--bg)}.login-page{min-height:100dvh;display:grid;place-items:center;padding:24px;background:var(--bg)}.login-panel{width:min(400px,100%);padding:32px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.login-brand,.brand{display:flex;align-items:center;gap:12px}.login-brand{padding-bottom:24px;border-bottom:1px solid var(--border)}.login-brand>div,.brand-copy,.account-copy{min-width:0;display:grid;gap:3px}.login-brand strong,.brand strong{font-size:17px;letter-spacing:0}.login-brand span:not(.brand-mark),.brand-copy span,.account-copy span{color:var(--muted);font-size:12px}.brand-mark{width:36px;height:36px;flex:0 0 auto;display:grid;place-items:center;color:#fff;background:var(--accent-dark);border-radius:var(--radius);font-size:18px;font-weight:800}.login-heading{margin:26px 0 22px}.login-heading h1{margin:0;font-size:22px;letter-spacing:0}.login-heading p{margin:8px 0 0;color:var(--muted)}.login-button{width:100%;min-height:40px;margin-top:12px}.sidebar{min-height:100dvh;display:flex;flex-direction:column;position:sticky;top:0;align-self:flex-start;background:var(--surface);border-right:1px solid var(--border);transition:width .18s ease}.brand{height:80px;padding:0 20px;border-bottom:1px solid var(--border)}.nav-caption{padding:22px 20px 9px;color:var(--muted-light);font-size:11px;font-weight:700}.nav{padding:0 10px;border-right:0;background:transparent}.nav .el-menu-item{height:44px;margin-bottom:4px;padding:0 12px!important;position:relative;color:#4e5950;border-radius:var(--radius);font-weight:600;transition:color .16s ease,background-color .16s ease}.nav .el-menu-item:before{width:3px;height:18px;position:absolute;left:0;top:13px;content:"";background:transparent;border-radius:0 3px 3px 0}.nav .el-menu-item .el-icon{margin-right:10px;color:#707a72}.nav .el-menu-item:hover{color:var(--accent-dark);background:var(--surface-soft)}.nav .el-menu-item.is-active{color:var(--accent-dark);background:var(--accent-soft)}.nav .el-menu-item.is-active:before{background:var(--accent)}.nav .el-menu-item.is-active .el-icon{color:var(--accent-dark)}.sidebar-account{min-height:72px;display:flex;align-items:center;gap:10px;margin-top:auto;padding:14px 18px;border-top:1px solid var(--border)}.account-avatar{width:34px;height:34px;flex:0 0 auto;display:grid;place-items:center;color:var(--accent-dark);background:var(--accent-soft);border:1px solid #d4e5cd;border-radius:50%;font-size:13px;font-weight:800}.account-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.topbar{min-height:96px;height:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 30px;position:sticky;top:0;z-index:20;background:#fffffff0;border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.page-heading{min-width:0}.page-eyebrow{display:block;margin-bottom:5px;color:var(--accent-dark);font-size:11px;font-weight:700}.topbar h1,.panel h2{margin:0;letter-spacing:0}.topbar h1{font-size:22px;line-height:1.25}.topbar p{margin:6px 0 0;color:var(--muted);font-size:13px}.topbar-actions,.panel-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}.topbar-actions .el-button+.el-button,.panel-actions .el-button+.el-button{margin-left:0}.content{min-width:0;padding:24px 30px 40px;overflow-x:hidden}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;margin-bottom:20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.dashboard-metrics{grid-template-columns:repeat(5,minmax(0,1fr))}.metric{min-width:0;min-height:94px;display:flex;align-items:center;gap:13px;padding:18px 20px;border-right:1px solid var(--border)}.metric:last-child{border-right:0}.metric-icon{width:36px;height:36px;flex:0 0 auto;color:var(--accent-dark);background:var(--accent-soft);border-radius:var(--radius)}.metric-icon svg{width:17px;height:17px}.metric>div,.metric:not(:has(.metric-icon)){min-width:0}.metric>div{display:grid;gap:6px}.metric span{color:var(--muted);font-size:12px}.metric strong{overflow:hidden;color:var(--text);font-size:23px;line-height:1.1;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}.panel-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.75fr);gap:20px}.panel{min-width:0;overflow:hidden;margin-top:20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.panel-grid .panel{margin-top:0}.panel-head{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px;border-bottom:1px solid var(--border)}.panel-head>div:first-child{min-width:0;display:grid;gap:5px}.panel h2{font-size:16px;line-height:1.3}.panel-head span{color:var(--muted);font-size:12px}.search{width:260px}.product-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px;margin:16px 22px 14px;background:var(--surface-soft);border-radius:var(--radius)}.product-toolbar .search{flex:1 1 320px}.filter-select{width:132px}.product-toolbar .el-checkbox{flex:0 0 auto;margin-right:0;color:#505a52}.panel>.el-alert{width:auto;margin:0 22px 14px}.product-empty{padding:50px 0}.table-footer{min-height:62px;display:flex;align-items:center;justify-content:flex-end;gap:18px;padding:12px 22px;color:var(--muted);border-top:1px solid var(--border);font-size:12px}.product-table,.order-table{width:100%}.el-table{--el-table-border-color: var(--border);--el-table-header-bg-color: #fafbf9;--el-table-row-hover-bg-color: #f5f8f3;--el-table-text-color: var(--text);--el-table-header-text-color: #6f7971;background:transparent}.el-table:before,.el-table__inner-wrapper:before{display:none}.el-table th.el-table__cell{padding:10px 0;font-size:12px;font-weight:700}.el-table td.el-table__cell{padding:11px 0}.el-table .cell{padding-right:18px;padding-left:18px;line-height:1.45}.product-cell,.order-cell{min-width:0;display:flex;align-items:center;gap:11px}.product-cell img{width:48px;height:48px;flex:0 0 auto;object-fit:cover;background:var(--surface-soft);border:1px solid var(--border);border-radius:var(--radius)}.product-cell div,.order-cell,.content-text-cell{min-width:0;display:grid;gap:4px}.product-cell strong,.product-cell span,.order-cell strong,.order-cell span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.product-cell span,.order-cell span,.muted,.empty-panel p{color:var(--muted);font-size:12px}.order-cell{align-items:start}.product-actions{display:flex;align-items:center;gap:6px;white-space:nowrap}.product-actions .el-button+.el-button,.banner-card-actions .el-button+.el-button{margin-left:0}.stock-warning{color:var(--warning);font-variant-numeric:tabular-nums}.empty-panel{min-height:180px;display:grid;gap:8px;place-items:start}.empty-panel p{margin:0}.content-panel{margin-top:0}.content-tabs{min-height:360px;padding:0 22px 22px}.content-tabs .el-tabs__header{margin-bottom:18px}.content-tabs .el-tabs__item{height:46px;padding:0 18px;font-size:13px;font-weight:600}.banner-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;min-height:240px}.content-empty{grid-column:1 / -1;min-height:280px}.banner-card{min-width:0;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);transition:border-color .18s ease,box-shadow .18s ease}.banner-card:hover{border-color:var(--border-strong);box-shadow:0 10px 24px #23332714}.banner-media{display:block;overflow:hidden;aspect-ratio:750 / 876;background:var(--surface-soft);border-bottom:1px solid var(--border)}.banner-media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .22s ease}.banner-card:hover .banner-media img{transform:scale(1.012)}.banner-card.is-inactive .banner-media img{filter:grayscale(.35);opacity:.58}.banner-card-body{display:grid;gap:11px;padding:14px}.banner-card-title,.banner-card-meta,.banner-card-actions{display:flex;align-items:center}.banner-card-title{justify-content:space-between;gap:10px}.banner-card-title>div,.content-name-cell>div{min-width:0;display:grid;gap:4px}.banner-card-title strong,.content-name-cell strong,.content-text-cell strong{overflow:hidden;color:var(--text);font-size:14px;text-overflow:ellipsis;white-space:nowrap}.banner-card-title span,.content-name-cell span,.content-text-cell span{overflow:hidden;color:var(--muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.banner-card-meta{justify-content:space-between;color:var(--muted);font-size:12px}.banner-card-meta a{color:var(--accent-dark);text-decoration:none}.banner-card-meta a:hover{text-decoration:underline}.banner-card-actions{gap:8px}.banner-card-actions .el-button{flex:1;min-height:34px;margin-left:0}.content-name-cell{min-width:0;display:flex;align-items:center;gap:11px}.content-name-cell img{width:42px;height:42px;flex:0 0 auto;object-fit:cover;background:var(--surface-soft);border:1px solid var(--border);border-radius:var(--radius)}.discount-value{color:var(--accent-dark);font-variant-numeric:tabular-nums}.content-dialog-form,.product-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}.content-dialog-form .form-wide,.product-form .form-wide{grid-column:1 / -1}.content-dialog-form .banner-form-media{grid-column:1;grid-row:span 4}.content-dialog-form .el-input-number,.content-dialog-form .el-select,.product-form .el-input-number,.product-form .el-select{width:100%}.image-upload-field{min-width:0;display:grid;grid-template-columns:88px minmax(0,1fr);gap:10px;align-items:center}.image-preview{width:88px;height:64px;display:grid;place-items:center;overflow:hidden;color:var(--muted-light);background:var(--surface-soft);border:1px solid var(--border);border-radius:var(--radius);font-size:12px}.image-preview img{width:100%;height:100%;object-fit:cover}.image-upload-main{min-width:0;display:flex;align-items:center;gap:8px}.image-file-meta{min-width:0;flex:1;display:grid;gap:4px}.image-file-meta strong,.image-file-meta span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.image-file-meta strong{color:var(--text);font-size:13px}.image-file-meta span{color:var(--muted);font-size:12px}.image-upload-main .el-button{flex:0 0 auto}.image-upload-input{display:none}.banner-form-media .image-upload-field.banner-image-upload{grid-template-columns:1fr;gap:10px;align-items:center}.banner-form-media .banner-image-upload .image-preview{width:100%;max-width:260px;height:auto;aspect-ratio:750 / 876}.banner-image-upload .image-upload-main{min-height:40px}.el-button{min-height:32px;border-radius:var(--radius)}.el-button--primary{--el-button-bg-color: var(--accent);--el-button-border-color: var(--accent);--el-button-text-color: #fff;--el-button-hover-bg-color: var(--accent-dark);--el-button-hover-border-color: var(--accent-dark);--el-button-hover-text-color: #fff;--el-button-active-bg-color: var(--accent-dark);--el-button-active-border-color: var(--accent-dark);--el-button-active-text-color: #fff}.el-button--primary.is-plain{--el-button-bg-color: #f4f9f1;--el-button-border-color: #a9c49e;--el-button-text-color: var(--accent-dark);--el-button-hover-text-color: #fff}.el-button.is-text{color:var(--accent-dark)}.el-input__wrapper,.el-textarea__inner,.el-select__wrapper{border-radius:var(--radius);box-shadow:0 0 0 1px var(--border-strong) inset}.el-input__wrapper:hover,.el-textarea__inner:hover,.el-select__wrapper:hover{box-shadow:0 0 0 1px #aebca9 inset}.el-input__wrapper.is-focus,.el-textarea__inner:focus,.el-select__wrapper.is-focused{box-shadow:0 0 0 1px var(--accent) inset}.el-tag{border-radius:4px}.el-tag--success{--el-tag-bg-color: var(--accent-soft);--el-tag-border-color: #cfe0c8;--el-tag-text-color: var(--accent-dark)}.el-dialog{max-width:calc(100% - 32px);border-radius:var(--radius);box-shadow:0 24px 70px #18241b2e}.el-dialog__header{margin:0;padding:20px 22px 10px;border-bottom:1px solid var(--border)}.el-dialog__title{color:var(--text);font-size:17px;font-weight:700}.el-dialog__body{padding:18px 22px 10px}.el-dialog__footer{padding:12px 22px 20px}@media(max-width:1180px){.dashboard-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.metrics:not(.dashboard-metrics),.banner-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric:nth-child(3n){border-right:0}.panel-grid{grid-template-columns:1fr}.product-toolbar .search{flex-basis:100%}}@media(max-width:900px){.sidebar{width:72px!important}.brand{justify-content:center;padding:0}.brand-copy,.nav-caption,.nav .el-menu-item span,.account-copy{display:none}.nav{padding:12px 8px}.nav .el-menu-item{justify-content:center;padding:0!important}.nav .el-menu-item .el-icon{margin-right:0}.sidebar-account{justify-content:center;padding:14px 0}.topbar,.content{padding-right:22px;padding-left:22px}}@media(max-width:760px){.sidebar{width:64px!important}.brand-mark{width:34px;height:34px}.topbar{min-height:82px;padding:14px 16px}.topbar p{display:none}.topbar h1{font-size:19px}.content{padding:16px}.metrics,.dashboard-metrics,.metrics:not(.dashboard-metrics),.banner-grid,.content-dialog-form,.product-form{grid-template-columns:1fr}.metric,.metric:nth-child(3n){min-height:76px;padding:14px 16px;border-right:0;border-bottom:1px solid var(--border)}.metric:last-child{border-bottom:0}.panel-head{min-height:68px;padding:14px 16px}.product-toolbar{margin-right:16px;margin-left:16px}.product-toolbar .filter-select{flex:1 1 120px;width:auto}.content-tabs{padding-right:16px;padding-left:16px}.content-dialog-form .form-wide,.content-dialog-form .banner-form-media,.product-form .form-wide{grid-column:auto;grid-row:auto}.banner-form-media .image-upload-field.banner-image-upload{grid-template-columns:1fr;align-items:center}.content-dialog{width:calc(100% - 32px)!important}.el-table .cell{padding-right:14px;padding-left:14px}}@media(max-width:520px){.page-eyebrow{display:none}.topbar-actions{gap:5px}.topbar-actions .el-button{padding-right:10px;padding-left:10px}.topbar-actions .el-button:first-child span{display:none}.login-page{padding:16px}.login-panel{padding:24px}.panel-head{gap:10px}.panel-actions .el-button{padding-right:10px;padding-left:10px}.image-upload-field:not(.banner-image-upload){grid-template-columns:72px minmax(0,1fr)}.image-upload-field:not(.banner-image-upload) .image-preview{width:72px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}