:root{
  --presentation-green:#155e4b;
  --presentation-deep:#0f3f35;
  --presentation-mint:#e9f6ef;
  --presentation-orange:#f28b3c;
  --presentation-ink:#18332c;
  --presentation-muted:#70827c;
  --presentation-line:#dce8e3;
  --presentation-shadow:0 14px 36px rgba(21,94,75,.09);
}

body{background:#f5f8f7;color:var(--presentation-ink)}
.login-page{background:linear-gradient(135deg,#0d3d34 0%,#155e4b 48%,#edf6f1 48%,#f8fbf9 100%)}
.login-brand{position:relative;overflow:hidden;padding:68px 7vw;color:#fff}
.login-brand:before,.login-brand:after{content:"";position:absolute;border-radius:999px;border:1px solid rgba(255,255,255,.14)}
.login-brand:before{width:440px;height:440px;right:-150px;top:-170px}
.login-brand:after{width:260px;height:260px;right:15px;top:-80px}
.login-brand>*{position:relative;z-index:1}
.login-brand h1{font-size:clamp(36px,4.2vw,64px);line-height:1.13;letter-spacing:-2px;margin:22px 0 18px}
.login-brand .brand-copy{max-width:650px;font-size:17px;line-height:1.9;color:rgba(255,255,255,.78)}
.version-pill{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);letter-spacing:1.8px}
.brand-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:42px}
.brand-points span{padding:16px 18px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);border-radius:14px;backdrop-filter:blur(8px)}
.login-card{width:min(520px,calc(100vw - 40px));padding:38px 42px;border:1px solid rgba(21,94,75,.1);box-shadow:0 28px 80px rgba(15,63,53,.16);border-radius:24px}
.login-card h2{font-size:28px;margin-bottom:8px}
.role-picker{gap:10px}
.role-option{border:1px solid #e1ebe6;border-radius:15px;transition:.2s ease;background:#fbfdfc}
.role-option:hover{transform:translateY(-2px);border-color:#9dcab9;box-shadow:0 8px 24px rgba(21,94,75,.08)}
.role-option.active{border-color:var(--presentation-green);background:var(--presentation-mint);box-shadow:inset 3px 0 var(--presentation-green)}
.role-option i{background:#fff;color:var(--presentation-green);box-shadow:0 4px 12px rgba(21,94,75,.12)}
.login-card input{border-radius:12px;border-color:#dbe7e1;padding:13px 14px}
.login-card input:focus{border-color:var(--presentation-green);box-shadow:0 0 0 4px rgba(21,94,75,.09)}
.login-btn{min-height:50px;border-radius:13px;font-size:16px;box-shadow:0 10px 24px rgba(21,94,75,.22)}
.formal-login-note{background:#f5f9f7;border:1px solid #e1ebe6;color:#647871;border-radius:12px}

.sidebar{overflow:hidden;background:linear-gradient(180deg,#103f35 0%,#0d332c 100%);box-shadow:8px 0 32px rgba(12,49,42,.08)}
.sidebar .logo{padding:24px 18px 20px;border-bottom:1px solid rgba(255,255,255,.08)}
.sidebar nav{min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:4px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}
.sidebar nav::-webkit-scrollbar{width:5px}
.sidebar nav::-webkit-scrollbar-thumb{border-radius:999px;background:rgba(255,255,255,.18)}
.nav-group>small{color:rgba(255,255,255,.45);letter-spacing:1px}
.nav-item{border-radius:10px;margin:3px 10px;color:rgba(255,255,255,.73);transition:.18s ease}
.nav-item:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(2px)}
.nav-item.active{background:linear-gradient(90deg,rgba(77,174,137,.3),rgba(77,174,137,.14));color:#fff;box-shadow:inset 3px 0 #64d4a9}
.sidebar-foot{flex:0 0 auto;background:rgba(0,0,0,.08);border-top-color:rgba(255,255,255,.08)}
.topbar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid #e2ebe7;box-shadow:0 4px 22px rgba(15,63,53,.04)}
.top-actions{gap:12px}
.prototype-mode{display:inline-flex;align-items:center;gap:7px;background:#eaf7f0;color:#207052;border:1px solid #d4eddf;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:700}
.prototype-mode i{width:7px;height:7px;border-radius:50%;background:#27a76d;box-shadow:0 0 0 4px rgba(39,167,109,.12)}
.header-icon{position:relative;width:36px;height:36px;border-radius:11px;border:1px solid #dde8e3;background:#fff;color:#3a6255;cursor:pointer}
.header-icon span{position:absolute;right:-5px;top:-6px;min-width:17px;height:17px;line-height:17px;border-radius:9px;background:#f2673a;color:#fff;font-size:10px}
.content{padding:28px 34px 50px;background:radial-gradient(circle at 92% 2%,rgba(64,165,126,.08),transparent 290px),#f5f8f7}
.page-title h1{letter-spacing:-.6px}
.page-title p{color:var(--presentation-muted)}

.formal-metrics,.metric-grid{gap:16px}
.metric-card{position:relative;overflow:hidden;border:1px solid var(--presentation-line);border-radius:17px;background:linear-gradient(145deg,#fff,#fbfdfc);box-shadow:0 8px 25px rgba(20,75,60,.045);transition:.2s ease}
.metric-card:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--presentation-green),#66c69f)}
.metric-card:hover{transform:translateY(-3px);box-shadow:var(--presentation-shadow)}
.metric-card strong{font-size:28px;color:#173c32}
.panel{border:1px solid var(--presentation-line);border-radius:18px;box-shadow:0 9px 28px rgba(20,75,60,.045)}
.panel-head{padding-bottom:14px;border-bottom:1px solid #edf2f0}
.data-table thead th{background:#f1f6f3;color:#526b63;font-size:12px;letter-spacing:.2px}
.data-table tbody tr{transition:.16s ease}
.data-table tbody tr:hover{background:#f6fbf8}
.tag,.status-pill{border-radius:999px}
.primary{background:linear-gradient(135deg,#176b54,#25876a);border-color:#176b54}
.primary:hover{box-shadow:0 8px 20px rgba(23,107,84,.22);transform:translateY(-1px)}
.outline-btn{border-color:#cfddd7;color:#375e52;background:#fff}

.presentation-dashboard{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr);gap:18px;margin-top:18px}
.presentation-card{background:#fff;border:1px solid var(--presentation-line);border-radius:18px;padding:21px 22px;box-shadow:0 8px 28px rgba(20,75,60,.05)}
.presentation-card.wide{grid-column:1/-1}
.presentation-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:19px}
.presentation-card-head h3{font-size:17px;margin:0 0 5px}
.presentation-card-head p{margin:0;color:var(--presentation-muted);font-size:12px}
.presentation-card-head strong{font-size:24px;color:var(--presentation-green)}
.trend-bars{height:190px;display:flex;align-items:flex-end;gap:12px;padding:16px 4px 0;border-bottom:1px solid #dfe9e4;background:repeating-linear-gradient(to top,transparent 0,transparent 44px,#edf2ef 45px)}
.trend-bar{flex:1;min-width:24px;position:relative;height:var(--h);border-radius:8px 8px 2px 2px;background:linear-gradient(180deg,#57b88f,#176b54);box-shadow:0 6px 13px rgba(23,107,84,.12);transition:.2s ease}
.trend-bar:hover{filter:brightness(1.08);transform:scaleX(1.06)}
.trend-bar span{position:absolute;left:50%;bottom:-25px;transform:translateX(-50%);font-size:11px;color:#74877f;white-space:nowrap}
.trend-bar b{position:absolute;left:50%;top:-22px;transform:translateX(-50%);font-size:10px;color:#42665a;opacity:0;transition:.2s}
.trend-bar:hover b{opacity:1}
.structure-list{display:grid;gap:15px}
.structure-row{display:grid;grid-template-columns:92px 1fr 48px;align-items:center;gap:10px;font-size:13px}
.structure-track{height:9px;background:#edf3f0;border-radius:99px;overflow:hidden}
.structure-track i{display:block;width:var(--w);height:100%;border-radius:inherit;background:linear-gradient(90deg,#1a755b,#68c59f)}
.structure-row strong{text-align:right;color:#284b40}
.presentation-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.presentation-kpi{padding:17px;border-radius:14px;background:#f6faf8;border:1px solid #e4ede9}
.presentation-kpi span{display:block;color:#71847d;font-size:12px;margin-bottom:7px}
.presentation-kpi b{font-size:20px;color:#193f34}
.presentation-kpi small{display:block;color:#2a8b67;margin-top:5px}
.activity-list{display:grid;gap:0}
.activity-item{display:grid;grid-template-columns:12px 1fr auto;gap:12px;align-items:start;padding:13px 0;border-bottom:1px solid #edf2f0}
.activity-item:last-child{border-bottom:0}
.activity-item>i{width:10px;height:10px;margin-top:5px;border-radius:50%;background:#35a879;box-shadow:0 0 0 5px #e5f5ed}
.activity-item b{display:block;font-size:13px;margin-bottom:4px}.activity-item small{color:#7b8c86}.activity-item time{color:#8a9994;font-size:11px}
.region-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.region-cell{min-height:86px;padding:14px;border-radius:14px;background:linear-gradient(145deg,#eff8f3,#fff);border:1px solid #dceae4}
.region-cell.featured{background:linear-gradient(145deg,#1b765d,#12503f);color:#fff;border-color:#1b765d;box-shadow:0 10px 24px rgba(21,94,75,.18)}
.region-cell span{display:block;font-size:12px;opacity:.7}.region-cell b{display:block;font-size:19px;margin:6px 0}.region-cell small{font-size:11px;opacity:.7}
.executive-strip{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px;padding:16px 20px;border-radius:16px;background:linear-gradient(120deg,#123f35,#1b725a);color:#fff;box-shadow:0 12px 28px rgba(15,63,53,.17)}
.executive-strip p{margin:4px 0 0;color:rgba(255,255,255,.72);font-size:13px}.executive-strip button{background:#fff;color:#175b49;border:0}

label:has(#runtimeMode),label:has(#hqRuntimeMode),#apiBaseLabel,#hqApiBaseLabel{display:none!important}
.api-reservation{font-size:12px;color:#71847d;background:#f3f7f5;border-color:#e1ebe6}

@media(max-width:1100px){.presentation-dashboard{grid-template-columns:1fr}.presentation-card.wide{grid-column:auto}.presentation-kpis{grid-template-columns:repeat(2,1fr)}.region-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.login-page{background:linear-gradient(180deg,#0e4438 0,#155e4b 38%,#f7faf8 38%)}.login-brand{padding:34px 24px}.brand-points{grid-template-columns:1fr}.login-card{padding:28px 22px}.content{padding:20px 15px 40px}.presentation-kpis{grid-template-columns:1fr}.top-actions .date{display:none}.executive-strip{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* 二级与三级业务页面 */
.detail-overview{display:grid;gap:18px;margin:18px 0 22px}
.detail-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.detail-kpis article{position:relative;overflow:hidden;padding:18px 20px;border:1px solid #dce7e2;border-radius:16px;background:linear-gradient(145deg,#fff,#f8fbf9);box-shadow:0 7px 20px rgba(21,68,53,.055)}
.detail-kpis article::after{content:"";position:absolute;right:-18px;top:-24px;width:76px;height:76px;border-radius:50%;background:rgba(55,143,108,.08)}
.detail-kpis span,.detail-kpis small{display:block;color:#728078;font-size:12px}
.detail-kpis b{display:block;margin:8px 0 6px;color:#17372d;font-size:24px;letter-spacing:-.5px}
.detail-insights{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
.detail-insights .panel{margin:0;padding:20px;border-radius:16px}
.detail-insights .panel-head{margin-bottom:13px}
.detail-insights .panel-head small{display:block;margin-bottom:4px;color:#829088;font-size:11px;letter-spacing:.08em}
.detail-insights ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.detail-insights li{position:relative;padding-left:18px;color:#42554e;font-size:13px;line-height:1.55}
.detail-insights li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:#3c9b74;box-shadow:0 0 0 4px rgba(60,155,116,.1)}
.progress-panel .panel-head>b{color:#247b5a;font-size:24px}
.detail-progress{height:10px;margin:20px 0 12px;overflow:hidden;border-radius:999px;background:#e8f0ec}
.detail-progress i{display:block;width:92%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2f8f69,#6dc09d)}
.detail-steps{display:flex;justify-content:space-between;color:#75847d;font-size:11px}
.detail-overview+.formal-toolbar{margin-top:0}
@media(max-width:1100px){.detail-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-insights{grid-template-columns:1fr}}
@media(max-width:680px){.detail-kpis{grid-template-columns:1fr}.detail-steps{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}}
.api-reservation{display:none!important}
.embedded-list-head{margin:24px 0 12px;padding:18px 20px;border-left:4px solid #3c9b74;border-radius:0 14px 14px 0;background:linear-gradient(90deg,rgba(60,155,116,.09),rgba(60,155,116,.02))}
.embedded-list-head small{display:block;margin-bottom:4px;color:#31805f;font-size:11px;font-weight:700;letter-spacing:.12em}
.embedded-list-head h3{margin:0 0 5px;color:#17372d;font-size:18px}
.embedded-list-head p{margin:0;color:#64766e;font-size:13px}