﻿:root{--color-text:#333;--color-text-secondary:#666;--color-placeholder:#999;--color-border:#e5e7eb;--color-border-hover:#d1d5db;--color-surface:#fff;--color-page:#f8f9fa;--color-primary:#9f5f68;--color-primary-hover:#89515a;--color-primary-soft:#f7ecee;--color-success:#5f7f70;--color-warning:#a47b49;--color-danger:#a85d66;--color-overlay:rgba(31,35,41,.42);--color-focus:rgba(159,95,104,.18);--radius-sm:4px;--radius-lg:8px;--radius-xl:12px;--radius-2xl:16px;--control-height:44px;--space-xs:8px;--space-sm:12px;--space-md:16px;--space-lg:24px;--textarea-min-height:80px;--shadow-sm:0 4px 12px rgba(31,35,41,.08);--shadow-lg:0 12px 32px rgba(31,35,41,.12);--transition-base:all .2s ease;--ink:var(--color-text);--muted:var(--color-text-secondary);--line:var(--color-border);--paper:var(--color-page);--white:var(--color-surface);--rose:var(--color-primary);--rose-dark:var(--color-primary-hover);--rose-soft:var(--color-primary-soft);--gold:var(--color-warning);--green:var(--color-success);--shadow:var(--shadow-lg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;color:var(--color-text);background:var(--color-page)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{margin:0;color:var(--color-text)}button,input,select,textarea{font:inherit;transition:var(--transition-base)}input,select,textarea{appearance:none;-webkit-appearance:none;outline:none;border:none;caret-color:var(--color-primary)}button{cursor:pointer}.hidden{display:none!important}.eyebrow{font-size:11px;letter-spacing:.2em;color:var(--rose);font-weight:700;text-transform:uppercase}.muted{color:var(--muted)}
.login-view{min-height:100vh;display:grid;grid-template-columns:1.15fr .85fr;background:var(--color-text)}.login-brand{padding:9vh 9vw;color:white;position:relative;overflow:hidden;background:radial-gradient(circle at 70% 20%,var(--color-focus),transparent 31%),linear-gradient(145deg,var(--color-text),var(--color-text))}.login-brand:after{content:"囍";position:absolute;right:-2vw;bottom:-14vh;font-family:serif;font-size:42vw;color:var(--color-focus)}.brand-mark,.mini-mark{font-family:serif;color:var(--color-text)}.brand-mark{font-size:54px;margin-bottom:10vh}.login-brand .eyebrow{color:var(--color-text)}.login-brand h1{font-family:serif;font-size:clamp(42px,5vw,78px);line-height:1.15;margin:18px 0 28px;font-weight:500;letter-spacing:.06em}.login-copy{font-size:17px;line-height:1.9;color:var(--color-text);max-width:520px}.brand-stats{display:flex;gap:38px;position:absolute;bottom:8vh}.brand-stats span{font-size:12px;color:var(--color-text)}.brand-stats b{display:block;font-size:18px;color:white;margin-bottom:6px}.login-panel{display:flex;align-items:center;justify-content:center;background:var(--color-primary-soft);padding:40px}.login-card{width:min(400px,100%);background:white;padding:48px;border-radius:var(--radius-sm);box-shadow:var(--shadow)}.login-card h2{font-family:serif;font-size:30px;margin:8px 0}.login-card label{display:block;font-size:13px;font-weight:700;margin-top:26px}.login-card input{display:block;width:100%;border:0;border-bottom:1px solid var(--color-border);padding:13px 2px;outline:none;background:transparent}.login-card input:focus{border-color:var(--rose)}.primary{border:0;background:var(--rose);color:white;padding:12px 20px;border-radius:var(--radius-sm)}.login-button{width:100%;margin-top:20px;display:flex;justify-content:space-between}.form-error{height:18px;color:var(--color-primary);font-size:12px}.login-hint{font-size:11px;color:var(--color-text-secondary);text-align:center;margin:18px 0 0}
.app-view{min-height:100vh;display:grid;grid-template-columns:244px 1fr}.sidebar{position:fixed;width:244px;height:100vh;background:var(--color-text);color:white;padding:24px 16px;display:flex;flex-direction:column;z-index:20}.sidebar-brand{height:72px;display:flex;align-items:center;gap:13px;padding:0 12px;border-bottom:1px solid var(--color-focus)}.mini-mark{font-size:30px}.sidebar-brand b,.sidebar-brand small,.sidebar-footer b,.sidebar-footer small{display:block}.sidebar-brand small,.sidebar-footer small{font-size:10px;color:var(--color-text-secondary);margin-top:4px}.sidebar nav{padding:24px 0;overflow:auto;flex:1}.nav-group{color:var(--color-text-secondary);font-size:10px;letter-spacing:.15em;margin:18px 13px 8px}.nav-item{width:100%;border:0;background:transparent;color:var(--color-text-secondary);padding:12px 14px;margin:3px 0;border-radius:var(--radius-sm);text-align:left;display:flex;align-items:center;gap:12px}.nav-item:hover,.nav-item.active{background:var(--color-text);color:white}.nav-icon{width:18px;text-align:center}.sidebar-footer{border-top:1px solid var(--color-focus);padding:18px 8px 0;display:grid;grid-template-columns:36px 1fr 28px;gap:10px;align-items:center;font-size:12px}.user-avatar{width:36px;height:36px;border-radius:50%;background:var(--rose);display:grid;place-items:center}.sidebar-footer button{border:0;background:none;color:var(--color-text-secondary)}.main{grid-column:2;min-width:0}.topbar{height:106px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px;position:sticky;top:0;z-index:10}.topbar h2{margin:5px 0 0;font-family:serif;font-size:25px}.topbar .eyebrow{margin:0}.top-actions{display:flex;align-items:center;gap:22px;color:var(--muted);font-size:12px}.icon-button,.menu-button{border:1px solid var(--line);background:white;border-radius:50%;width:38px;height:38px;position:relative}.dot{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--rose);right:3px;top:2px}.menu-button{display:none}.page-content{padding:32px 38px 60px;max-width:1600px;margin:auto}.welcome{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:26px}.welcome h3{font-family:serif;font-size:30px;margin:0 0 8px}.welcome p{margin:0;color:var(--muted)}.date-card{text-align:right;color:var(--muted)}.date-card b{display:block;font-family:serif;color:var(--rose);font-size:28px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.metric-card,.panel{background:white;border:1px solid var(--line);border-radius:var(--radius-lg)}.metric-card{padding:22px;position:relative;overflow:hidden}.metric-card:before{content:"";position:absolute;width:3px;height:45px;left:0;top:25px;background:var(--rose)}.metric-label{font-size:12px;color:var(--muted)}.metric-value{font-family:Georgia,serif;font-size:30px;margin:10px 0}.metric-trend{font-size:11px;color:var(--green)}.dashboard-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;margin-top:18px}.panel{padding:22px}.panel-header,.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.panel-header h3,.section-head h3{font-family:serif;margin:0;font-size:19px}.link-button{border:0;background:none;color:var(--rose);font-size:12px}.progress-list{display:grid;gap:18px}.progress-item{display:grid;grid-template-columns:55px 1fr 60px;gap:12px;align-items:center;font-size:12px}.progress-track{height:7px;background:var(--color-border);border-radius:var(--radius-2xl)}.progress-bar{height:100%;border-radius:var(--radius-2xl);background:linear-gradient(90deg,var(--rose),var(--color-primary))}.todo-list{list-style:none;padding:0;margin:0}.todo-list li{display:flex;gap:12px;padding:13px 0;border-bottom:1px solid var(--color-border)}.todo-dot{width:9px;height:9px;border-radius:50%;background:var(--gold);margin-top:5px}.todo-list b{font-size:13px;display:block}.todo-list small{color:var(--muted)}
.section-head{margin-bottom:18px}.section-head p{margin:5px 0 0;color:var(--muted);font-size:12px}.toolbar{display:flex;gap:10px}.search{border:1px solid var(--line);padding:10px 13px;border-radius:var(--radius-sm);background:white;min-width:230px}.data-panel{background:white;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}.data-table{width:100%;border-collapse:collapse}.data-table th{text-align:left;padding:13px 18px;background:var(--color-primary-soft);color:var(--color-text-secondary);font-size:11px}.data-table td{padding:16px 18px;border-top:1px solid var(--color-border);font-size:13px}.data-table tbody tr:hover{background:var(--color-primary-soft)}.badge{display:inline-block;padding:5px 9px;border-radius:var(--radius-2xl);font-size:10px;background:var(--rose-soft);color:var(--rose)}.badge.green{background:var(--color-text);color:var(--green)}.empty{padding:70px;text-align:center;color:var(--muted)}.empty b{display:block;font-family:serif;color:var(--ink);font-size:22px;margin-bottom:8px}.modal{position:fixed;inset:0;background:var(--color-focus);z-index:50;display:grid;place-items:center;padding:20px}.modal-card{width:min(650px,100%);max-height:90vh;overflow:auto;background:white;border-radius:var(--radius-lg);padding:34px;position:relative;box-shadow:var(--shadow)}.modal-close{position:absolute;right:18px;top:15px;border:0;background:none;font-size:25px;color:var(--muted)}.modal h3{font-family:serif;font-size:24px;margin:0 0 25px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.form-grid label{font-size:12px;font-weight:700}.form-grid input,.form-grid select,.form-grid textarea{display:block;width:100%;margin-top:7px;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:10px;background:white}.form-grid .full{grid-column:1/-1}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.secondary{border:1px solid var(--line);background:white;padding:11px 20px;border-radius:var(--radius-sm)}.toast{position:fixed;right:25px;bottom:25px;background:var(--color-text);color:white;padding:13px 20px;border-radius:var(--radius-sm);opacity:0;transform:translateY(15px);transition:.25s;z-index:80;font-size:12px}.toast.show{opacity:1;transform:none}.toast.error{background:var(--color-primary)}
@media(max-width:1000px){.metric-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.login-view{grid-template-columns:1fr}.login-brand{display:none}}@media(max-width:760px){.app-view{display:block}.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:none}.main{margin:0}.menu-button{display:block}.topbar{height:86px;padding:0 18px;justify-content:flex-start;gap:15px}.top-actions{margin-left:auto}.top-actions time{display:none}.page-content{padding:22px 16px}.metric-grid{grid-template-columns:1fr 1fr}.toolbar .search{display:none}.data-panel{overflow:auto}.data-table{min-width:800px}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}}@media(max-width:460px){.metric-grid{grid-template-columns:1fr}.login-panel{padding:18px}.login-card{padding:30px}}

/* 高密度后台布局：桌面端内容铺满可用工作区，避免两侧出现大面积空白。 */
@media(min-width:761px){
  .page-content{width:100%;max-width:none;margin:0;padding:22px 24px 40px}
  .topbar{height:88px;padding:0 24px}
  .welcome{margin-bottom:18px}
  .welcome h3{font-size:26px;margin-bottom:5px}
  .metric-grid{gap:12px}
  .metric-card{padding:17px 20px;min-height:112px}
  .metric-card:before{top:20px;height:38px}
  .metric-value{font-size:27px;margin:7px 0}
  .dashboard-grid{grid-template-columns:minmax(0,2fr) minmax(320px,1fr);gap:12px;margin-top:12px}
  .panel{padding:18px}
  .panel-header,.section-head{margin-bottom:14px}
  .progress-list{gap:14px}
  .todo-list li{padding:10px 0}
  .section-head{min-height:48px}
  .data-panel{width:100%;min-height:calc(100vh - 190px)}
  .data-table{width:100%;table-layout:auto}
  .data-table th{padding:11px 14px;white-space:nowrap}
  .data-table td{padding:13px 14px}
  .empty{padding:48px 24px}
}

@media(min-width:1500px){
  .page-content{padding-left:28px;padding-right:28px}
  .metric-grid{grid-template-columns:repeat(4,minmax(220px,1fr))}
  .dashboard-grid{grid-template-columns:minmax(0,2.35fr) minmax(360px,.85fr)}
}

/* 小程序可视化装修 */
.editor-toolbar{display:flex;align-items:center;justify-content:space-between;background:var(--color-surface);border:1px solid var(--line);padding:13px 18px;margin-bottom:12px;border-radius:var(--radius-lg)}.editor-toolbar>div{display:flex;align-items:center;gap:12px}.editor-toolbar span{font-size:11px;color:var(--muted)}.editor-status{padding:5px 10px;border-radius:var(--radius-2xl)}.editor-status.online{background:var(--color-text);color:var(--green)}.editor-status.draft{background:var(--color-surface)0df;color:var(--color-text)}.miniapp-editor{height:calc(100vh - 176px);min-height:650px;display:grid;grid-template-columns:248px minmax(430px,1fr) 300px;gap:12px}.component-library,.property-panel{background:var(--color-surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:auto}.editor-panel-title{position:sticky;top:0;z-index:2;background:var(--color-surface);border-bottom:1px solid var(--line);padding:16px 17px}.editor-panel-title b,.editor-panel-title small{display:block}.editor-panel-title small{color:var(--muted);font-size:10px;margin-top:4px}.component-library-list{padding:12px}.library-component{display:grid;grid-template-columns:36px 1fr;gap:10px;align-items:center;border:1px solid var(--color-border);background:var(--color-primary-soft);padding:11px;margin-bottom:8px;border-radius:var(--radius-sm);cursor:grab;transition:.18s}.library-component:hover{border-color:var(--rose);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.library-component:active{cursor:grabbing}.library-component>span{width:34px;height:34px;display:grid;place-items:center;background:var(--rose-soft);color:var(--rose);border-radius:var(--radius-sm);font-weight:700}.library-component b,.library-component small{display:block}.library-component b{font-size:12px}.library-component small{font-size:9px;color:var(--muted);margin-top:3px}.phone-workspace{background:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-lg);display:flex;flex-direction:column;align-items:center;overflow:auto;padding:13px 20px 30px}.phone-scale-label{font-size:10px;color:var(--color-text-secondary);margin-bottom:9px}.phone-frame{width:375px;min-height:690px;background:var(--color-surface);border:9px solid var(--color-text);border-radius:var(--radius-2xl);box-shadow:var(--shadow-sm);overflow:hidden;position:relative;display:flex;flex-direction:column}.phone-status{height:27px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;font-size:9px;color:var(--color-text)}.phone-status b{font-size:7px;letter-spacing:2px}.miniapp-nav{height:42px;display:grid;grid-template-columns:40px 1fr 40px;align-items:center;text-align:center;border-bottom:1px solid var(--color-border);font-size:12px}.miniapp-nav span{font-size:17px}.phone-canvas{background:var(--color-primary-soft);flex:1;min-height:565px;padding-bottom:55px;transition:.2s}.phone-canvas.drag-over{background:var(--color-primary-soft);outline:2px dashed var(--rose);outline-offset:-6px}.canvas-empty{height:520px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);border:2px dashed var(--color-border);margin:12px;border-radius:var(--radius-sm)}.canvas-empty b{font-size:13px;color:var(--ink);margin-bottom:5px}.canvas-empty span{font-size:10px}.phone-component{position:relative;border:2px solid transparent;cursor:pointer}.phone-component:hover{border-color:var(--color-primary)}.phone-component.selected{border-color:var(--rose);z-index:1}.component-actions{display:none;position:absolute;right:2px;top:2px;z-index:4;background:var(--color-text);border-radius:var(--radius-sm);overflow:hidden}.phone-component.selected>.component-actions{display:flex}.component-actions button{width:25px;height:24px;border:0;background:var(--color-text);color:var(--color-surface);font-size:11px}.component-actions button:hover{background:var(--rose)}.mini-hero{padding:35px 23px 30px;color:var(--color-surface);min-height:195px;background:linear-gradient(145deg,var(--color-primary),var(--color-primary))}.mini-hero.theme-gold{background:linear-gradient(145deg,var(--color-text),var(--color-text))}.mini-hero.theme-dark{background:linear-gradient(145deg,var(--color-text),var(--color-text))}.mini-hero small{font-size:8px;letter-spacing:.22em;opacity:.75}.mini-hero h3{font-family:serif;font-size:24px;max-width:260px;margin:13px 0 8px}.mini-hero p{font-size:10px;opacity:.85;margin:0 0 20px}.mini-hero button{border:0;background:var(--color-surface);color:var(--color-primary);border-radius:var(--radius-2xl);padding:8px 19px;font-size:10px}.mini-section-title{padding:15px 16px 10px;display:flex;align-items:center;justify-content:space-between;background:var(--color-surface)}.mini-section-title h4,.mini-services h4{margin:0;font-size:14px;font-family:serif}.mini-section-title span{font-size:9px;color:var(--muted)}.mini-notice{margin:10px 12px;padding:10px 12px;border-radius:var(--radius-sm);background:var(--color-surface)4e8;display:flex;gap:10px;font-size:10px;color:var(--color-text)}.mini-notice b{background:var(--color-text);color:var(--color-surface);padding:2px 5px;border-radius:var(--radius-sm);font-size:8px}.mini-services{padding:15px;background:var(--color-surface)}.mini-services h4{margin-bottom:13px}.mini-services>div{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.mini-services span{font-size:9px;text-align:center;color:var(--color-text-secondary)}.mini-services i{display:grid;place-items:center;width:42px;height:42px;margin:0 auto 6px;background:var(--color-primary-soft);color:var(--rose);border-radius:50%;font-style:normal;font-size:17px}.mini-image{background:var(--color-surface);margin-top:8px;padding:12px}.image-placeholder{height:105px;background:linear-gradient(135deg,var(--color-text),var(--color-text));display:grid;place-items:center;color:var(--color-surface);letter-spacing:.3em;font-size:9px;border-radius:var(--radius-sm)}.mini-image b{display:block;margin-top:10px;font-family:serif;font-size:13px}.mini-image p{font-size:9px;color:var(--muted);margin:4px 0}.mini-button-wrap{padding:14px;background:var(--color-surface)}.mini-action-button{width:100%;border:0;background:var(--rose);color:var(--color-surface);padding:11px;border-radius:var(--radius-2xl);font-size:11px}.mini-spacer{position:relative;background:repeating-linear-gradient(45deg,var(--color-text),var(--color-text) 5px,var(--color-border) 5px,var(--color-border) 10px);min-height:8px}.mini-spacer span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:8px;color:var(--color-text-secondary)}.miniapp-tabs{height:52px;position:absolute;bottom:0;left:0;right:0;background:var(--color-surface);border-top:1px solid var(--color-border);display:grid;grid-template-columns:repeat(4,1fr);z-index:5}.miniapp-tabs span{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--color-text-secondary);font-size:14px}.miniapp-tabs small{font-size:8px;margin-top:2px}.miniapp-tabs .active{color:var(--rose)}.property-panel{padding-bottom:20px}.property-type{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;background:var(--color-primary-soft);border-bottom:1px solid var(--line);font-size:12px}.property-type button{border:0;background:none;color:var(--rose);font-size:10px}.property-field{display:block;padding:13px 16px 0;font-size:11px;font-weight:700}.property-field input,.property-field select{display:block;width:100%;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:9px;margin-top:7px;background:var(--color-surface);font-size:11px}.property-field small{display:block;color:var(--muted);font-weight:400;font-size:9px;margin-top:5px}.property-empty{padding:60px 22px;text-align:center;color:var(--muted)}.property-empty b,.property-empty span{display:block}.property-empty b{color:var(--ink);font-size:13px;margin-bottom:6px}.property-empty span{font-size:10px}.range-field{display:flex;align-items:center;gap:10px}.range-field input{padding:0;border:0}.range-field output{font-size:10px;color:var(--rose);min-width:34px}

@media(max-width:1150px){.miniapp-editor{grid-template-columns:210px minmax(400px,1fr) 255px}.phone-workspace{padding-left:10px;padding-right:10px}}@media(max-width:900px){.miniapp-editor{height:auto;grid-template-columns:1fr}.component-library-list{display:grid;grid-template-columns:repeat(2,1fr)}.phone-workspace{min-height:760px}.property-panel{min-height:300px}.editor-toolbar{align-items:flex-start;gap:12px}.editor-toolbar>div:first-child{flex-wrap:wrap}}

.venue-map-field{margin-top:4px;border-top:1px solid var(--line);padding-top:18px}.venue-map-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.venue-map-heading b,.venue-map-heading small{display:block}.venue-map-heading small{margin-top:4px;color:var(--muted);font-weight:400}.venue-map{height:340px;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;background:var(--color-text);z-index:1}.map-help{margin:8px 0 0;color:var(--muted);font-size:10px}.map-load-error{height:100%;display:grid;place-items:center;color:var(--muted);font-size:12px}.venue-map-field .leaflet-control-attribution{font-size:9px}.venue-map-field .leaflet-control-attribution a{color:var(--rose)}
.venue-images-field{border-top:1px solid var(--line);padding-top:18px}.venue-images-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.venue-images-heading b,.venue-images-heading small{display:block}.venue-images-heading small{margin-top:4px;color:var(--muted);font-weight:400}.image-select-button{border:1px solid var(--rose);border-radius:var(--radius-sm);padding:9px 14px;color:var(--rose);cursor:pointer}.image-select-button input{display:none}.venue-image-previews{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.venue-image-preview{height:105px;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;position:relative;background:var(--color-primary-soft)}.venue-image-preview img{width:100%;height:100%;object-fit:cover}.venue-image-preview.pending span{position:absolute;right:5px;bottom:5px;padding:3px 7px;border-radius:var(--radius-lg);background:var(--color-focus);color:var(--color-surface);font-size:9px}.venue-image-empty{grid-column:1/-1;padding:30px;border:1px dashed var(--color-border);border-radius:var(--radius-sm);text-align:center;color:var(--muted);font-size:11px}
.material-size-preview{border-top:1px solid var(--line);padding-top:18px}.material-size-preview b,.material-size-preview small{display:block}.material-size-preview small{margin-top:5px;color:var(--muted);font-weight:400}.size-preview-stage{height:220px;margin-top:12px;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:linear-gradient(var(--color-primary-soft) 49%,var(--color-border) 50%);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.size-preview-stage i{display:block;min-width:10px;min-height:10px;border:2px solid var(--color-focus);box-shadow:var(--shadow-sm);transition:.2s}.size-preview-stage span{position:absolute;left:12px;bottom:10px;padding:5px 9px;border-radius:var(--radius-xl);background:var(--color-focus);color:var(--color-surface);font-size:10px}
.material-image-field{border-top:1px solid var(--line);padding-top:18px}.material-image-preview{height:220px;border:1px dashed var(--color-border);border-radius:var(--radius-lg);background:var(--color-primary-soft);display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--muted);font-size:11px}.material-image-preview img{width:100%;height:100%;object-fit:contain}.scene-material-image{width:44px;height:44px;object-fit:contain}.scene-object-image{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.plan-effect-preview{height:300px;border:1px dashed var(--color-border);border-radius:var(--radius-lg);background:var(--color-primary-soft);display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--muted);font-size:11px}.plan-effect-preview img{width:100%;height:100%;object-fit:contain}.plan-material-field{border-top:1px solid var(--line);padding-top:18px}.plan-material-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.plan-material-option{display:grid!important;grid-template-columns:20px minmax(0,1fr) 70px 24px;gap:8px;align-items:center;margin:0!important;padding:10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--color-primary-soft)}.plan-material-option>input[type=checkbox]{width:16px!important;margin:0!important}.plan-material-option>input[type=number]{width:70px!important;margin:0!important}.plan-material-option>span{display:grid;grid-template-columns:38px 1fr;align-items:center;column-gap:8px}.plan-material-option img{grid-row:1/3;width:36px;height:36px;object-fit:contain}.plan-material-option b,.plan-material-option small{display:block}.plan-material-option small{color:var(--muted);font-size:9px}.plan-material-option em{font-style:normal;color:var(--muted);font-size:10px}

@media(min-width:761px){.venue-map-field{width:760px}.venue-map-field~*{max-width:760px}.modal-card:has(.venue-map-field){width:min(830px,100%)}}
@media(max-width:760px){.venue-map-heading,.venue-images-heading{align-items:flex-start;gap:8px}.venue-map-heading>div:last-child{text-align:right}.venue-map{height:280px}.venue-image-previews{grid-template-columns:repeat(2,1fr)}}

.scene-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.scene-toolbar>div{display:flex;align-items:center;gap:18px}.scene-toolbar span{color:var(--muted);font-size:11px}.scene-toolbar b{font-family:serif;color:var(--rose);font-size:17px}.scene-designer{height:calc(100vh - 205px);min-height:650px;display:grid;grid-template-columns:235px minmax(560px,1fr) 270px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--color-surface);overflow:hidden}.scene-library,.scene-properties{overflow:auto;background:var(--color-surface)}.scene-library{border-right:1px solid var(--line)}.scene-properties{border-left:1px solid var(--line)}.scene-library header,.scene-properties header{position:sticky;top:0;z-index:5;padding:17px;background:var(--color-primary-soft);border-bottom:1px solid var(--line)}.scene-library header b,.scene-library header small,.scene-properties header b,.scene-properties header small{display:block}.scene-library header small,.scene-properties header small{margin-top:4px;color:var(--muted);font-size:9px}.scene-material-list{padding:10px}.scene-material{display:grid;grid-template-columns:48px 1fr;gap:10px;align-items:center;margin-bottom:8px;padding:10px;border:1px solid var(--line);border-radius:var(--radius-sm);cursor:grab}.scene-material:hover{border-color:var(--rose);background:var(--color-primary-soft)}.scene-material b,.scene-material small{display:block}.scene-material b{font-size:11px}.scene-material small{margin-top:4px;color:var(--muted);font-size:8px;line-height:1.5}.scene-workspace{position:relative;padding:35px 22px 22px;background:var(--color-border);overflow:auto}.scene-hint{position:absolute;top:11px;left:22px;color:var(--color-text-secondary);font-size:9px}.scene-stage{width:100%;height:100%;min-height:570px;position:relative;overflow:hidden;border:10px solid var(--color-text);border-radius:var(--radius-lg);background:linear-gradient(var(--color-text) 0 57%,var(--color-text) 57%);box-shadow:var(--shadow-sm);perspective:900px}.scene-backdrop{position:absolute;inset:0 0 43%;background:radial-gradient(circle at 50% 48%,var(--color-focus),transparent 44%),linear-gradient(135deg,var(--color-text),var(--color-text))}.scene-floor{position:absolute;left:-15%;right:-15%;bottom:-12%;height:58%;background:repeating-linear-gradient(90deg,var(--color-focus) 0 1px,transparent 1px 90px),repeating-linear-gradient(0deg,var(--color-focus) 0 1px,transparent 1px 65px),linear-gradient(var(--color-text),var(--color-text));transform:rotateX(58deg);transform-origin:bottom}.scene-object{position:absolute;width:var(--object-width);height:var(--object-height);cursor:move;filter:drop-shadow(0 12px 7px var(--color-focus))}.scene-object.selected{outline:2px solid var(--color-surface);box-shadow:var(--shadow-sm)}.scene-object>span{position:absolute;left:50%;bottom:-21px;transform:translateX(-50%);padding:3px 7px;border-radius:var(--radius-lg);background:var(--color-focus);color:var(--color-surface);font-size:8px;white-space:nowrap}.scene-shape{display:block;width:100%;height:100%;position:relative;background:var(--scene-color,var(--color-primary));box-shadow:var(--shadow-sm)}.scene-material .scene-shape{width:44px;height:44px}.scene-shape:after{content:"";position:absolute;left:8%;right:-10%;bottom:-10%;height:16%;background:var(--color-focus);filter:blur(3px);transform:skewX(-35deg);z-index:-1}.type-stage{border-radius:var(--radius-sm) 4px 0 0;background:linear-gradient(135deg,var(--scene-color),var(--color-text))}.type-arch{background:transparent;border:12px solid var(--scene-color);border-bottom:0;border-radius:50% 50% 0 0;box-shadow:var(--shadow-sm)}.scene-material .type-arch{border-width:7px}.type-flower{border-radius:50%;background:radial-gradient(circle at 30% 25%,var(--color-surface) 0 8%,transparent 9%),radial-gradient(circle at 68% 35%,var(--color-text) 0 13%,transparent 14%),radial-gradient(circle,var(--scene-color) 0 55%,var(--color-text) 56%)}.type-light{width:28%!important;margin:auto;border-radius:50% 50% 8px 8px;background:radial-gradient(circle at 50% 70%,var(--color-surface)9c9,var(--scene-color) 62%)}.type-light:before{content:"";position:absolute;left:45%;top:-70%;width:10%;height:75%;background:var(--color-text)}.type-table{height:45%!important;margin-top:40%;border-radius:50%;background:radial-gradient(ellipse,var(--color-surface) 0 48%,var(--scene-color) 49% 70%,var(--color-text) 71%)}.type-screen{background:linear-gradient(135deg,var(--color-text),var(--color-text));border:8px solid var(--color-text);box-shadow:var(--shadow-sm)}.type-carpet{height:35%!important;margin-top:50%;background:linear-gradient(90deg,var(--color-focus),transparent),var(--scene-color);transform:skewX(-12deg)}.type-decor{border-radius:var(--radius-xl) 2px 12px 2px}.scene-properties>div:not(.scene-price-card){padding:14px}.scene-properties label{display:block;margin-bottom:13px;color:var(--color-text-secondary);font-size:10px;font-weight:700}.scene-properties input{display:block;width:100%;margin-top:6px;padding:8px;border:1px solid var(--color-border);border-radius:var(--radius-sm)}.scene-selected-name{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px!important;border-bottom:1px solid var(--line)}.scene-selected-name button{border:0;background:none;color:var(--color-primary);font-size:10px}.scene-item-subtotal{display:flex;justify-content:space-between;padding:11px;background:var(--color-primary);color:var(--color-primary);font-size:11px}.scene-price-card{margin:12px;padding:14px;background:var(--color-text);color:var(--color-surface);border-radius:var(--radius-sm)}.scene-price-card span,.scene-price-card b,.scene-price-card small{display:block}.scene-price-card span,.scene-price-card small{color:var(--color-text-secondary);font-size:9px}.scene-price-card b{margin:8px 0;font-family:serif;font-size:23px;color:var(--color-primary)}.scene-empty{padding:40px 15px;text-align:center;color:var(--muted);font-size:10px}

.plan-effect-preview{height:auto;min-height:180px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:8px}.plan-effect-preview span{grid-column:1/-1;text-align:center}.plan-effect-preview img{width:100%;height:150px;object-fit:cover;border-radius:var(--radius-sm)}
.order-service-list{min-width:230px;display:grid;gap:6px}.order-service-list>div{padding:7px 9px;border-radius:var(--radius-sm);background:var(--color-primary-soft)}.order-service-list b,.order-service-list small{display:block}.order-service-list b{font-size:10px}.order-service-list small{margin-top:3px;color:var(--muted);font-size:8px}
@media(max-width:1100px){.scene-designer{grid-template-columns:195px minmax(470px,1fr) 230px}}@media(max-width:800px){.scene-designer{height:auto;grid-template-columns:1fr}.scene-library,.scene-properties{max-height:340px;border:0}.scene-workspace{min-height:650px}.scene-toolbar{align-items:flex-start;gap:10px}.scene-toolbar>div{flex-wrap:wrap;justify-content:flex-end}}

/* 星婚纪商户运营中心：基于确认原型的正式视觉实现。 */
:root {
  --color-page: #f8f7f5;
  --color-text: #29252a;
  --color-text-secondary: #746d72;
  --color-sidebar: #352c31;
  --color-sidebar-muted: #b9aeb4;
  --color-primary: #a15f70;
  --color-primary-hover: #8d5060;
  --color-primary-soft: #f5e9ed;
  --color-border: #e5dfdc;
  --color-success: #638276;
  --color-warning: #a97735;
  --color-danger: #b45b66;
  --shadow-sm: 0 6px 18px rgba(54, 43, 48, .06);
  --shadow-lg: 0 18px 48px rgba(54, 43, 48, .12);
}

body { background: var(--color-page); }
.app-view { grid-template-columns: 224px minmax(0, 1fr); }
.sidebar { width: 224px; padding: 22px 14px; background: var(--color-sidebar); }
.sidebar-brand { height: 72px; padding: 0 12px 18px; border-color: rgba(255,255,255,.1); }
.mini-mark { display: grid; width: 38px; height: 38px; place-items: center; border-radius: var(--radius-lg); background: var(--color-primary); color: var(--color-surface); font-size: 21px; }
.sidebar-brand b { color: var(--color-surface); font-size: 17px; }
.sidebar-brand small, .sidebar-footer small { color: var(--color-sidebar-muted); }
.sidebar nav { padding: 20px 0; }
.nav-group { margin: 17px 12px 7px; color: #8f8389; letter-spacing: .12em; }
.nav-item { min-height: 42px; margin: 2px 0; padding: 10px 12px; border-radius: var(--radius-lg); color: #d7ced2; font-weight: 600; }
.nav-icon { display: none; }
.nav-item:hover { background: rgba(255,255,255,.06); color: var(--color-surface); }
.nav-item.active { background: var(--color-primary); color: var(--color-surface); box-shadow: 0 8px 20px rgba(161,95,112,.2); }
.nav-item.active .nav-icon { color: var(--color-surface); }
.sidebar-footer { border-color: rgba(255,255,255,.1); }
.user-avatar { background: var(--color-primary-soft); color: var(--color-primary); }
.main { grid-column: 2; }
.topbar { height: 88px; padding: 0 30px; border-color: var(--color-border); }
.topbar h2 { margin-top: 4px; font-family: inherit; font-size: 25px; letter-spacing: -.02em; }
.topbar .eyebrow { color: var(--color-primary); letter-spacing: .03em; }
.top-actions { gap: 14px; }
.global-search { display: flex; width: 270px; height: 44px; align-items: center; padding: 0 13px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-page); color: var(--color-text-secondary); }
.global-search span { margin-right: 10px; font-size: 11px; white-space: nowrap; }
.global-search input { height: auto!important; padding: 0!important; border: 0!important; background: transparent!important; box-shadow: none!important; font-size: 12px; }
.top-create { min-width: 98px; height: 44px; border-radius: var(--radius-lg); font-weight: 700; }
.page-content { width: 100%; max-width: none; margin: 0; padding: 24px 30px 48px; }

.metric-strip { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-xl); background: var(--color-surface); box-shadow: var(--shadow-sm); }
.metric-strip .metric-card { min-height: 124px; padding: 22px; border: 0; border-right: 1px solid var(--color-border); border-radius: 0; box-shadow: none; }
.metric-strip .metric-card:last-child { border-right: 0; }
.metric-strip .metric-card:before { display: none; }
.metric-label { color: var(--color-text-secondary); }
.metric-value { margin: 10px 0 6px; font-family: inherit; font-size: 30px; font-weight: 700; letter-spacing: -.025em; }
.metric-trend { color: var(--color-text-secondary); }
.operations-grid { display: grid; grid-template-columns: minmax(0,2.4fr) minmax(280px,.85fr); gap: 18px; margin-top: 18px; }
.panel { padding: 0; border: 1px solid var(--color-border); border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); }
.panel-header { min-height: 70px; margin: 0; padding: 16px 18px; border-bottom: 1px solid var(--color-border); }
.panel-header h3 { font-family: inherit; font-size: 16px; }
.panel-header p { margin: 5px 0 0; color: var(--color-text-secondary); font-size: 11px; }
.panel-header span { color: var(--color-text-secondary); font-size: 11px; }
.dashboard-table-wrap { overflow-x: auto; }
.dashboard-table { width: 100%; border-collapse: collapse; }
.dashboard-table th, .dashboard-table td { padding: 13px 15px; border-bottom: 1px solid var(--color-border); text-align: left; font-size: 12px; white-space: nowrap; }
.dashboard-table th { background: #fbfaf9; color: var(--color-text-secondary); font-size: 11px; font-weight: 500; }
.dashboard-table tbody tr:last-child td { border-bottom: 0; }
.dashboard-table tbody tr:hover { background: #fcf8f9; }
.dashboard-table td:first-child b, .dashboard-table td:first-child small { display: block; }
.dashboard-table td:first-child small { margin-top: 4px; color: var(--color-text-secondary); font-size: 9px; }
.dashboard-status { display: inline-block; padding: 6px 9px; border-radius: var(--radius-sm); background: #f3f1ef; color: var(--color-text-secondary); font-size: 10px; }
.dashboard-status.success { background: #eaf1ee; color: var(--color-success); }
.dashboard-status.warning { background: #f8efdf; color: var(--color-warning); }
.next-action, .soft-action { min-height: 34px; padding: 7px 12px; border: 0; border-radius: var(--radius-lg); background: var(--color-primary-soft); color: var(--color-primary); font-weight: 700; }
.next-action:hover, .soft-action:hover { background: var(--color-primary); color: var(--color-surface); }
.attention-list { margin: 0; padding: 6px 18px 18px; list-style: none; }
.attention-list li { display: grid; grid-template-columns: 9px 1fr; gap: 11px; padding: 16px 0; border-bottom: 1px solid var(--color-border); }
.attention-list li:last-child { border-bottom: 0; }
.attention-list b, .attention-list small { display: block; }
.attention-list b { font-size: 12px; }
.attention-list small { margin-top: 6px; color: var(--color-text-secondary); font-size: 10px; line-height: 1.5; }
.attention-dot { width: 7px; height: 7px; margin-top: 4px; border-radius: 50%; background: var(--color-warning); }
.attention-dot.danger { background: var(--color-danger); }
.attention-dot.success { background: var(--color-success); }
.pipeline-panel { margin-top: 18px; padding-bottom: 18px; }
.pipeline { display: grid; grid-template-columns: repeat(7,1fr); padding: 14px 18px 2px; }
.pipeline-stage { position: relative; padding-top: 22px; }
.pipeline-stage:before { content: ""; position: absolute; top: 7px; left: 8px; right: -8px; height: 1px; background: var(--color-border); }
.pipeline-stage:last-child:before { right: calc(100% - 8px); }
.pipeline-stage i { position: absolute; top: 1px; left: 0; z-index: 1; width: 14px; height: 14px; border: 3px solid var(--color-surface); border-radius: 50%; background: #ddd6d3; box-shadow: 0 0 0 1px var(--color-border); }
.pipeline-stage.active i { background: var(--color-primary); box-shadow: 0 0 0 1px var(--color-primary); }
.pipeline-stage b, .pipeline-stage small { display: block; }
.pipeline-stage b { font-size: 11px; }
.pipeline-stage small { margin-top: 5px; color: var(--color-text-secondary); font-size: 10px; }
.compact { padding: 35px; }

.section-head { min-height: 66px; margin-bottom: 14px; }
.section-head h3 { font-family: inherit; font-size: 18px; }
.data-panel { min-height: calc(100vh - 190px); border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); }
.data-table th { padding: 13px 15px; background: #fbfaf9; font-weight: 500; }
.data-table td { padding: 14px 15px; }
.data-table tbody tr:hover { background: #fcf8f9; }
.primary, .secondary, .search { border-radius: var(--radius-lg); }
.modal-card { border-radius: var(--radius-xl); }

@media(max-width:1100px) {
  .global-search { display: none; }
  .operations-grid { grid-template-columns: 1fr; }
  .metric-strip { grid-template-columns: repeat(2,1fr); }
  .metric-strip .metric-card:nth-child(2) { border-right: 0; }
  .metric-strip .metric-card:nth-child(-n+2) { border-bottom: 1px solid var(--color-border); }
}
@media(max-width:760px) {
  .app-view { display: block; }
  .topbar { height: 78px; padding: 0 16px; }
  .topbar h2 { font-size: 20px; }
  .top-create { display: none; }
  .page-content { padding: 18px 14px 32px; }
  .metric-strip { grid-template-columns: 1fr; }
  .metric-strip .metric-card { border-right: 0; border-bottom: 1px solid var(--color-border); }
  .metric-strip .metric-card:last-child { border-bottom: 0; }
  .pipeline { min-width: 720px; }
  .pipeline-panel { overflow-x: auto; }
}

/* 全站视觉规范覆盖层：所有后台页面共享统一控件、层级与交互反馈。 */
a,
button,
[role="button"],
.nav-item,
.link-button,
.library-component,
.phone-component,
.scene-material {
  transition: var(--transition-base);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select {
  width: 100%;
  height: var(--control-height);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  color: var(--color-text);
}

select {
  padding-right: calc(var(--space-md) * 2);
  background-image: linear-gradient(45deg, transparent 50%, var(--color-text-secondary) 50%), linear-gradient(135deg, var(--color-text-secondary) 50%, transparent 50%);
  background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

textarea {
  width: 100%;
  min-height: var(--textarea-min-height);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  color: var(--color-text);
  line-height: 1.5;
  resize: vertical;
}

input::placeholder,
textarea::placeholder {
  color: var(--color-placeholder);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover,
select:hover,
textarea:hover {
  border-color: var(--color-border-hover);
  box-shadow:var(--shadow-sm);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
select:focus,
textarea:focus {
  border-color: var(--color-primary);
  box-shadow:var(--shadow-sm);
}

.primary,
.secondary,
.search,
.image-select-button,
.nav-item,
.link-button {
  min-height: var(--control-height);
  border-radius: var(--radius-lg);
}

.primary:hover,
.image-select-button:hover {
  box-shadow:var(--shadow-sm);
  filter: brightness(.98);
}

.card,
.metric-card,
.panel,
.data-panel,
.component-library,
.property-panel,
.editor-toolbar {
  border-color: var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
}

.login-card,
.modal-card,
.scene-designer {
  border-radius: var(--radius-xl);
  box-shadow:var(--shadow-sm);
}

.modal {
  background: var(--color-overlay);
  animation: layer-fade-in .2s ease;
}

.modal-card {
  animation: panel-slide-in .2s ease;
}

.drop-panel {
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
  transition: var(--transition-base);
}

.drop-panel.open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

@keyframes layer-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes panel-slide-in {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

.banner-manager-head {
  display: flex;
  width: 100%;
  margin-bottom: var(--space-lg);
  padding: var(--space-lg);
  align-items: center;
  justify-content: space-between;
  gap: var(--space-lg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  background: var(--color-surface);
}

.banner-manager-head h3,
.banner-manager-head p {
  margin: 0 0 var(--space-sm);
}

.banner-manager-list {
  display: grid;
  width: 100%;
  gap: var(--space-md);
}

.banner-config-card {
  display: grid;
  width: 100%;
  padding: var(--space-md);
  grid-template-columns: minmax(260px, 36%) minmax(320px, 1fr) auto;
  align-items: center;
  gap: var(--space-lg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  background: var(--color-surface);
  transition: var(--transition-base);
}

.banner-config-card:hover {
  border-color: var(--color-border-hover);
  box-shadow: var(--shadow-sm);
}

.banner-preview {
  display: flex;
  width: 100%;
  aspect-ratio: 16 / 9;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-page);
  color: var(--color-text-secondary);
}

.banner-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.banner-fields {
  display: grid;
  gap: var(--space-md);
}

.banner-fields b,
.banner-fields small,
.banner-fields span {
  display: block;
}

.banner-fields small {
  margin-top: var(--space-xs);
  color: var(--color-text-secondary);
}

.banner-fields span {
  color: var(--color-text-secondary);
  font-size: 12px;
  line-height: 1.5;
}

.banner-fields label {
  display: grid;
  gap: var(--space-xs);
  color: var(--color-text-secondary);
}

.banner-enabled {
  display: flex !important;
  align-items: center;
  grid-template-columns: none !important;
}

.banner-actions {
  display: grid;
  min-width: 88px;
  gap: var(--space-sm);
}

.banner-upload {
  display: inline-flex;
  min-height: var(--control-height);
  padding: var(--control-padding-y) var(--control-padding-x);
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  color: var(--color-text);
  cursor: pointer;
  transition: var(--transition-base);
}

.banner-upload:hover {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-sm);
}

.banner-upload.primary {
  border-color: var(--color-primary);
  background: var(--color-primary);
  color: var(--color-surface);
}

.banner-upload.primary:hover {
  border-color: var(--color-primary-hover);
  background: var(--color-primary-hover);
}

.banner-upload input {
  display: none;
}

.banner-actions button {
  min-height: var(--control-height);
  padding: var(--control-padding-y) var(--control-padding-x);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
}

.banner-actions button:disabled {
  cursor: not-allowed;
  opacity: .45;
}

.banner-actions .danger-button {
  border-color: var(--color-danger);
  color: var(--color-danger);
}

.banner-actions .danger-button:hover {
  background: var(--color-primary-soft);
  box-shadow: var(--shadow-sm);
}

.modal-card:has(.banner-config-modal) {
  width: min(1040px, 100%);
}

.banner-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-lg);
  margin-bottom: var(--space-lg);
}

.banner-modal-head h3,
.banner-modal-head p {
  margin: 0;
}

.banner-modal-head p {
  margin-top: var(--space-xs);
  color: var(--color-text-secondary);
  font-size: 13px;
}

.banner-edit-list {
  display: grid;
  gap: var(--space-md);
}

.banner-edit-card {
  display: grid;
  grid-template-columns: minmax(220px, 30%) minmax(300px, 1fr) 96px;
  align-items: center;
  gap: var(--space-lg);
  padding: var(--space-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  background: var(--color-surface);
}

.banner-edit-fields {
  display: grid;
  gap: var(--space-sm);
}

.banner-edit-fields label {
  color: var(--color-text-secondary);
  font-size: 12px;
  font-weight: 600;
}

.banner-edit-fields input {
  display: block;
  width: 100%;
  height: var(--control-height);
  margin-top: var(--space-xs);
  padding: var(--control-padding-y) var(--control-padding-x);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
}

.banner-edit-fields input:hover {
  border-color: var(--color-border-hover);
  box-shadow: var(--shadow-sm);
}

.banner-edit-fields input:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-focus);
}

@media (max-width: 900px) {
  .banner-manager-head,
  .banner-config-card,
  .banner-edit-card {
    grid-template-columns: 1fr;
  }

  .banner-manager-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .banner-actions {
    grid-template-columns: repeat(3, 1fr);
  }

  .banner-modal-head {
    flex-direction: column;
  }
}

.banner-visual-editor .phone-canvas {
  position: relative;
  padding: var(--space-sm);
  overflow-y: auto;
}

.component-coming {
  display: grid;
  padding: var(--space-md);
  gap: var(--space-xs);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-lg);
  color: var(--color-text-secondary);
  text-align: center;
}

.component-coming b {
  color: var(--color-text);
}

.component-coming span {
  font-size: 11px;
}

.simulator-carousel {
  padding: var(--space-xs);
  border: 2px solid var(--color-primary);
  border-radius: var(--radius-xl);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}

.simulator-main-banner {
  position: relative;
  height: 185px;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: var(--color-primary-soft);
}

.simulator-main-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.simulator-upload-hint {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
  color: var(--color-text-secondary);
  font-size: 12px;
}

.simulator-banner-caption {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: var(--space-md);
  background: linear-gradient(transparent, var(--color-overlay));
  color: var(--color-surface);
  font-size: 16px;
  font-weight: 700;
}

.simulator-banner-thumbs {
  display: flex;
  margin-top: var(--space-sm);
  gap: var(--space-xs);
  overflow-x: auto;
}

.simulator-banner-thumb {
  position: relative;
  width: 68px;
  height: 44px;
  flex: none;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: var(--radius-lg);
  background: var(--color-page);
  cursor: grab;
  transition: var(--transition-base);
}

.simulator-banner-thumb.selected,
.simulator-banner-thumb:hover {
  border-color: var(--color-primary);
}

.simulator-banner-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.simulator-banner-thumb span {
  display: grid;
  height: 100%;
  place-items: center;
  color: var(--color-text-secondary);
  font-size: 9px;
}

.simulator-banner-thumb small {
  position: absolute;
  right: 2px;
  bottom: 2px;
  padding: 1px 4px;
  border-radius: var(--radius-sm);
  background: var(--color-overlay);
  color: var(--color-surface);
  font-size: 8px;
}

.simulator-add-slide {
  width: 100%;
  height: var(--control-height);
  margin-top: var(--space-sm);
  border: 1px dashed var(--color-border-hover);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  color: var(--color-primary);
}

.simulator-home-placeholder {
  display: grid;
  margin-top: var(--space-md);
  grid-template-columns: 1fr 1fr;
  gap: var(--space-sm);
}

.simulator-home-placeholder b {
  grid-column: 1 / -1;
  font-size: 13px;
}

.simulator-home-placeholder div {
  height: 82px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
}

.banner-canvas-empty {
  height: 230px;
  margin: 0;
}

.banner-drop-zone.drag-over {
  outline: 3px solid var(--color-primary);
  outline-offset: -5px;
}

.banner-drop-zone.drag-over::after {
  content: "松开鼠标上传图片";
  position: absolute;
  inset: var(--space-sm);
  z-index: 8;
  display: grid;
  place-items: center;
  border: 2px dashed var(--color-primary);
  border-radius: var(--radius-xl);
  background: var(--color-primary-soft);
  color: var(--color-primary);
  font-size: 16px;
  font-weight: 700;
  pointer-events: none;
}

.property-upload {
  margin: var(--space-md);
}

.property-sort-actions {
  display: grid;
  padding: 0 var(--space-md);
  grid-template-columns: 1fr 1fr;
  gap: var(--space-sm);
}
