/* Aoteng: quiet surfaces, readable hierarchy, consistent control geometry. */
:root{--bg:#f5f5f7;--text:#202329;--text2:#68717f;--accent:#1765cc;--border:#e4e7ed;--shadow:0 3px 14px #15284408;--blue:#1765cc;--green:#228166;--red:#bc3f4c}
body,#pageApp{background:#f5f5f7!important;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;letter-spacing:.05px;color:var(--text)}
button,input,select,textarea{font:inherit}
button,[role=button]{touch-action:manipulation}
button:focus-visible,[role=button]:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #7cb6ff!important;outline-offset:3px}
#appHeader,.topbar{background:rgba(250,250,252,.92)!important;border-bottom:1px solid #e4e7ed!important;box-shadow:none!important;backdrop-filter:blur(18px)}
#appHeader::after{display:none}
.header h2{font-size:25px!important;letter-spacing:-.7px;color:#1c232e!important;font-weight:650;display:block}
.ui-role-caption{font-size:12px!important;letter-spacing:.1px;color:#76808d!important;margin-top:5px}
.header-btn,.ui-density-toggle{min-width:44px!important;min-height:44px!important;border:1px solid transparent!important;background:transparent!important;box-shadow:none!important;border-radius:12px!important;color:#5c6572!important;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.header-btn:hover,.ui-density-toggle:hover{background:#e9edf3!important;color:#1e58a9!important}
.ui-line-icon{width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px;vertical-align:-4px;color:currentColor;line-height:1}
.ui-line-icon svg{width:100%;height:100%;display:block;pointer-events:none}
.header-btn>.ui-line-icon{width:21px;height:21px;flex-basis:21px}
.ui-icon-label{font-size:13px;font-weight:550}
.card,.kpi-card,.stat-card,.setting-category,.equip-card,.pipe-overview-card,.role-group{background:#fff!important;border:1px solid #e7e9ee!important;border-radius:18px!important;box-shadow:0 3px 14px #16243b06!important;color:var(--text)}
.card{padding:24px;margin-bottom:20px}
.card[style*="color:#fff"]{color:#252d3a!important}
.card[style*="color:#fff"]>*{color:#252d3a}
.kpi-card::after,.stat-card::after{display:none!important}
.kpi-card,.stat-card{padding:22px;text-align:left!important}
.kpi-value,.stat-num{font-size:36px!important;font-weight:600;letter-spacing:-1.3px;text-shadow:none!important;color:#1d2736!important;line-height:1.25;font-variant-numeric:tabular-nums}
.kpi-label,.stat-label{font-size:13px!important;letter-spacing:0;color:#6d7785!important;line-height:1.6}
.section-title{font-size:18px!important;letter-spacing:-.3px;font-weight:650;color:#252d39!important;margin:26px 0 16px;display:flex;gap:9px;align-items:center}
.btn,.sys-btn{min-height:42px;padding:10px 16px!important;border-radius:10px!important;font-size:13px!important;font-weight:550!important;line-height:1.4!important;box-shadow:none!important;display:inline-flex;justify-content:center;align-items:center;gap:7px;transition:background .16s,transform .16s,border-color .16s!important}
.btn:active,.header-btn:active{transform:scale(.97)!important}
.btn-primary,.sys-btn-primary{background:#1765cc!important;border:1px solid #1765cc!important;color:#fff!important;box-shadow:0 3px 8px #1765cc16!important}
.btn-ghost{background:#f5f6f8!important;color:#435268!important;border:1px solid #e9ebf0!important}
.btn-success{background:#217e62!important;color:#fff!important;border-color:#217e62!important}
.btn-danger{background:#fff0f0!important;color:#ae3542!important;border:1px solid #f1d5d8!important}
.btn-warning{background:#fff7e9!important;color:#956019!important;border:1px solid #f2dfbb!important}
.btn-xs,.btn-sm{min-height:34px!important;padding:7px 11px!important;font-size:12px!important}
.btn .ui-line-icon{width:17px;height:17px;flex-basis:17px}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea{min-height:44px!important;border-radius:10px!important;border:1px solid #dfe3ea!important;background:#fff!important;box-shadow:0 1px 2px #132a4503!important;font-size:14px!important;padding:10px 13px!important;color:#253044!important}
input::placeholder,textarea::placeholder{color:#939ba7!important}
.badge{border-radius:7px!important;padding:5px 9px!important;font-size:12px!important;line-height:1.35!important;box-shadow:none!important;font-weight:550;display:inline-flex;align-items:center;gap:5px;background:#edf2f9!important;color:#476080!important;border:1px solid transparent}
.badge.urgency-red,.badge.overdue{background:#fff0f1!important;color:#b23f4f!important;border-color:#f5dce0!important}
.badge.urgency-orange{background:#fff5e6!important;color:#97651e!important}
.badge.urgency-green{background:#ecf6f1!important;color:#258164!important}
.badge .ui-line-icon{width:13px;height:13px;flex-basis:13px}
.status-dot{width:7px!important;height:7px!important;box-shadow:none!important;margin-right:7px}
.progress-bar{height:5px!important;border-radius:5px;background:#edf0f5!important;box-shadow:none!important;overflow:hidden}
.progress-fill{background:#5187ce!important;box-shadow:none!important;border-radius:5px;transition:width .4s ease}
.edit-icon{min-width:32px;min-height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;color:#8c95a2!important;vertical-align:middle}
.edit-icon:hover{background:#fff0f0;color:#b63745!important}
.edit-icon>.ui-line-icon{width:17px;height:17px;flex-basis:17px}
.modal{background:#fff!important;border:1px solid #ffffffbb!important;border-radius:22px!important;box-shadow:0 25px 85px #15213b29!important}
.modal-overlay{background:#1e2b3c40!important;backdrop-filter:blur(9px)}
.step-tog,.pipe-block{box-shadow:none!important;border-radius:12px!important;border:1px solid #e2e7ee!important;background:#f8f9fb!important;color:#5b687b!important;min-height:94px;padding:13px!important}
.step-tog.done{background:#edf7f2!important;border-color:#d2eade!important;color:#247257!important}
.step-tog.current{background:#edf4ff!important;border-color:#cbdffa!important;color:#2368ba!important}
.st-name{font-size:14px!important}.st-status,.st-assignee{font-size:12px!important;line-height:1.6}
.step-tip{font-size:12px!important;color:#7b8591!important;padding:10px 0;line-height:1.7}
.ui-project-card{padding:24px!important;position:relative;cursor:pointer}
.ui-project-card>div:first-child>span:first-child{font-size:17px!important;line-height:1.6;letter-spacing:-.3px;color:#26354a}
.ui-project-card>div:nth-child(2){font-size:13px!important;margin-top:9px!important}
.ui-project-card>div:nth-child(3){margin-top:24px!important;margin-bottom:14px}
.ui-project-card>div:nth-child(3)>span{font-size:14px!important;color:#567195;font-variant-numeric:tabular-nums}
.ui-project-card>div:nth-child(4){margin-top:12px!important}
.ui-project-card>div:last-child:has(>.btn){margin-top:20px!important;padding-top:16px!important;gap:8px!important;border-color:#f0f1f4!important}
#projListContainer{gap:20px!important}
.ui-project-card>div:nth-child(4)>span:last-child{font-size:12px!important;color:#728198!important}
.ui-stage-summary{font-size:12px;color:#66758b;line-height:1.7}
.ui-step-work{margin-top:20px}.ui-step-work h3{font-size:18px;margin:0 0 6px;letter-spacing:-.3px}
.ui-step-work p{font-size:13px;color:#748196;margin:0 0 17px}
.ui-step-row{display:grid;grid-template-columns:minmax(110px,1fr) minmax(120px,1.2fr) auto;align-items:center;gap:15px;padding:17px 0;border-top:1px solid #edf0f4}
.ui-step-row strong{display:block;font-size:14px;font-weight:600}.ui-step-row small{display:block;font-size:12px;color:#728098;margin-top:5px;line-height:1.6}.ui-step-actions{display:flex;gap:8px;flex-wrap:wrap}
.ui-assignment-form{display:grid;grid-template-columns:1fr 1.3fr;gap:12px;width:100%}.ui-assignment-form label{font-size:12px;color:#728098;display:block;margin-bottom:7px}.ui-assignment-form select{width:100%}.ui-assignment-form select[multiple]{min-height:112px!important}
.ui-assignment-form small{font-size:11px;color:#8490a1;display:block;margin-top:5px}
table{font-size:13px!important}th{font-weight:550!important;font-size:12px!important;background:#f5f7fa!important;color:#69778a!important;padding:14px 16px!important}td{padding:14px 16px!important;border-color:#edf0f4!important;line-height:1.6}
@media(min-width:1000px){
 #pageApp.active{grid-template-columns:224px minmax(0,1fr);grid-template-rows:100px minmax(0,1fr)}
 #pageApp>.ui-app-brand,#appTabs.tab-bar{background:#fafafb!important;border-right:1px solid #e3e6ec!important;box-shadow:none!important}
 #pageApp>.ui-app-brand{padding:25px 20px;border-bottom:0!important}
 #pageApp>.ui-app-brand strong,#pageApp>.ui-app-brand span{color:#29364a!important}
 #pageApp>.ui-app-brand img{box-shadow:none!important;width:53px;height:40px;background:transparent!important;padding:0}
 #appTabs{padding:20px 12px!important}.tab-item{min-height:49px!important;border-radius:11px!important;color:#748194!important;font-size:14px!important;gap:13px!important;padding:0 18px!important;background:transparent!important;box-shadow:none!important;border:0!important;margin:5px 0!important}
 .tab-item.active{background:#eaf0f9!important;color:#2267bf!important;box-shadow:none!important}.tab-item:hover{background:#f0f3f7!important}
 #appHeader{padding:0 32px!important;gap:12px}#appContent{padding:28px 32px 48px!important;gap:20px}
 #appContent[data-ui-page=home]{display:block!important}#appContent[data-ui-page=home]>*{grid-column:auto!important;grid-row:auto!important}
 .sidebar{background:#f8f9fb!important;border-right:1px solid #e1e6ed!important;box-shadow:none!important}.sidebar-item{color:#748194!important;border-radius:10px!important;box-shadow:none!important}.sidebar-item.active{background:#e8f0fa!important;color:#2267bf!important;border-color:transparent!important}
 .ui-sidebar-brand strong,.ui-sidebar-brand small{color:#29364a!important}.ui-sidebar-brand{border-color:#e3e6ed!important}
}
@media(hover:hover){.card[onclick]:hover,.kpi-card[onclick]:hover,.setting-category:hover{transform:translateY(-2px)!important;border-color:#d5dfe9!important;box-shadow:0 8px 24px #263a540d!important}}
@media(max-width:999px){#pageApp>.ui-app-brand{background:#fafafb!important;border-color:#e5e8ee!important;box-shadow:none!important}#pageApp>.ui-app-brand strong,#pageApp>.ui-app-brand span{color:#29364a!important}#appHeader{padding:14px 20px!important;gap:6px}.header h2{font-size:22px!important}#appContent{padding:18px 16px 105px!important}.header-btn{min-width:42px!important}.ui-role-caption{font-size:11px!important}.ui-icon-label{display:none}.card{padding:20px}.ui-project-card{padding:20px!important}.ui-project-card>div:first-child>span:first-child{font-size:16px!important}.ui-density-toggle{font-size:12px!important}.ui-step-row{grid-template-columns:1fr 1fr}.ui-step-actions{grid-column:1/-1}.ui-assignment-form{grid-template-columns:1fr}input,select,textarea{font-size:16px!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* Final specificity bridge for the retained original/premium selectors. */
#appTabs .tab-item{color:#667385!important;border:0!important;background:transparent!important;box-shadow:none!important}
#appTabs .tab-item.active{background:#e9f0fb!important;color:#2468bc!important;border:0!important;box-shadow:none!important}
#appTabs .tab-item:not(.active):hover{color:#285680!important;background:#eef1f6!important}
.ui-workshop{border:1px solid #e6e9ee;border-radius:20px;background:white;box-shadow:0 3px 14px #16243b06}
.ui-workshop-header,.ui-workshop-toolbar,.ui-workshop-footer{background:#fff}
.ui-workshop .ui-workshop-title{color:#263243;letter-spacing:-.4px;font-size:22px}
.ui-workshop .ui-workshop-description{color:#768395;font-size:12px}
.ui-workshop .ui-workshop-project,.ui-workshop .ui-workshop-search{font-size:13px!important}
.ui-workshop .ui-workshop-search{padding-left:34px!important}
.ui-workshop .ui-workshop-legend{font-size:11px;color:#708096}
.ui-workshop-canvas{height:670px}
.ui-workshop .ui-equipment-card{background:#ffffffed;border:1px solid #e1e6ed;border-radius:16px;box-shadow:0 6px 22px #2349660d;padding:16px;min-width:290px}
.ui-equipment-project-name{font-size:14px;font-weight:600;color:#314357;margin-top:8px}
.ui-equipment-name{font-size:12px;color:#7c8a9b;font-weight:450}.ui-equipment-project-id,.ui-equipment-project-status,.ui-equipment-id{font-size:10px}
.ui-equipment-current-label{font-size:11px}.ui-equipment-pending{font-size:11px;color:#708399;min-height:30px}
.ui-equipment-current-name{font-size:22px;color:#3d6da2}.ui-equipment-percentage{color:#3d6da2}
.ui-equipment-step-name{font-size:10px;color:#75879a}.ui-equipment-meta{font-size:10px}.ui-equipment-deadline.ui-equipment-overdue{color:#b15562}
.ui-equipment-responsibilities>summary,.ui-workshop .ui-equipment-detail-button{font-size:11px}.ui-equipment-primary,.ui-equipment-helpers,.ui-equipment-person-empty{font-size:12px}
.ui-equipment-responsibility-heading{font-size:13px}.ui-equipment-state{font-size:11px}
.ui-workshop-note{font-size:11px;color:#8b96a3}.ui-workshop-footer{min-height:56px}
@media(min-width:1000px){
 body #appContent[data-ui-page=home]:has(>.stat-grid-4){display:flex!important;flex-direction:column;gap:0;align-items:stretch!important}
 body #appContent[data-ui-page=home]:has(>.stat-grid-4)>*{flex-shrink:0!important}
 body #appContent[data-ui-page=home]>.stat-grid-4{order:-2!important;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:24px!important}
 body #appContent[data-ui-page=home]>.ui-workshop{order:-1!important}
 #appContent:has(#chartStages)>.stat-grid-4 .kpi-card{padding:17px 16px;margin-bottom:0;min-width:0}
 #appContent:has(#chartStages)>.stat-grid-4 .kpi-value{font-size:29px!important}.stat-grid-4 .kpi-label{font-size:12px!important;white-space:normal}
}
@media(min-width:1350px){body #appContent[data-ui-page=home]>.stat-grid-4{grid-template-columns:repeat(8,minmax(0,1fr))!important}}
@container(max-width:800px){.ui-workshop-canvas{height:auto}}
.sidebar-item .si-icon{color:inherit!important}.sidebar-item.active .si-icon{color:#2468bc!important}.sidebar-item.active::before{display:none!important}
.ui-sidebar-brand img{box-shadow:none!important;border:0!important;background:transparent!important}
.top-bar{background:#fafafc!important;box-shadow:none!important;border-bottom:1px solid #e4e7ed!important;gap:20px}
.top-bar-left .logo{display:none}.top-bar-left .title{font-size:23px!important;font-weight:650;color:#28364b!important;background:none!important;-webkit-text-fill-color:#28364b!important;white-space:nowrap;letter-spacing:-.5px}
.top-bar-center{background:transparent!important;border:0!important;box-shadow:none!important}.top-bar-center .clock{font-size:26px!important;font-weight:550;color:#53667d!important}
.top-bar-right button{background:#f6f7f9!important;border:1px solid #e2e7ee!important;box-shadow:none!important;color:#5a697c!important;min-height:38px;border-radius:10px!important}
.kpi-card .kpi-icon{background:#f4f7fb!important;box-shadow:none!important;border:0!important;color:#6785aa!important;border-radius:11px;width:36px;height:36px}
.kpi-card .kpi-icon .ui-line-icon{width:21px;height:21px;flex-basis:21px}
.kpi-card::before{display:none!important}.kpi-sub{font-size:12px!important;color:#8a97a8!important}
#page-dashboard .section-header{background:transparent!important;box-shadow:none!important;border-color:transparent!important}
.ui-density{min-height:38px!important;border:1px solid #e5e9ef!important;background:#f7f9fc!important;box-shadow:none!important;color:#708096!important;border-radius:10px;font-size:12px!important}
.badge{white-space:nowrap}
.ui-project-card>div:first-child{align-items:flex-start!important;gap:10px}
.ui-project-card>div:first-child>span:last-child{flex-shrink:0}
@media(max-width:999px){.btn,.btn-sm,.btn-xs{min-height:44px!important}.header-btn{min-width:44px!important;min-height:44px!important}.ui-project-card>div:first-child>span:first-child{font-size:15px!important}.ui-project-card>div:first-child>span:last-child{gap:4px!important}.ui-project-card .edit-icon{min-width:26px}.ui-project-card .badge{font-size:11px!important;padding:5px 7px!important}}
@media(min-width:1000px){
 html[data-ui-density=compact] #pageApp.active{grid-template-columns:204px minmax(0,1fr);grid-template-rows:82px minmax(0,1fr)}
 html[data-ui-density=compact] #appHeader{padding:0 26px!important}
 html[data-ui-density=compact] #appContent{padding:20px 26px 35px!important}
 html[data-ui-density=compact] #appTabs .tab-item{min-height:44px!important;margin:3px 0!important}
 html[data-ui-density=compact] .header h2{font-size:23px!important}
 html[data-ui-density=compact] .ui-project-card{padding:18px 20px!important;border-radius:14px!important;margin-bottom:0!important}
 html[data-ui-density=compact] .ui-project-card>div:first-child>span:first-child{font-size:15px!important;line-height:1.6}
 html[data-ui-density=compact] .ui-project-card>div:nth-child(2){font-size:12px!important;margin-top:7px!important}
 html[data-ui-density=compact] .ui-project-card>div:nth-child(3){margin-top:18px!important;margin-bottom:10px}
 html[data-ui-density=compact] .ui-project-card>div:last-child:has(>.btn){margin-top:14px!important;padding-top:12px!important;gap:6px!important}
 html[data-ui-density=compact] #projListContainer{gap:16px!important}
 html[data-ui-density=compact] .section-title{font-size:17px!important;margin-top:20px;margin-bottom:13px}
 html[data-ui-density=compact] #appContent:has(#chartStages)>.stat-grid-4 .kpi-card{padding:14px 12px!important;border-radius:13px!important}
 html[data-ui-density=compact] #appContent:has(#chartStages)>.stat-grid-4 .kpi-value{font-size:27px!important}
 html[data-ui-density=compact] #appContent:has(#chartStages)>.stat-grid-4{margin-bottom:18px!important}
 html[data-ui-density=compact] .ui-workshop-header{padding:16px 20px 12px}
 html[data-ui-density=compact] .ui-workshop-toolbar{padding:0 20px 12px}
 html[data-ui-density=compact] .ui-workshop-canvas{height:610px}
 html[data-ui-density=compact] .ui-workshop .ui-equipment-card{padding:12px 14px}
 html[data-ui-density=compact] .ui-equipment-pending{min-height:22px}
 html[data-ui-density=compact] .ui-equipment-steps{margin-top:8px}
 html[data-ui-density=compact] .ui-equipment-current{margin-top:8px}
 html[data-ui-density=compact] .ui-equipment-meta{margin-top:7px}
 html[data-ui-density=compact] .ui-equipment-name-line{margin-top:5px}
 html[data-ui-density=compact] .ui-equipment-project-name{margin-top:5px}
 html[data-ui-density=compact] .ui-equipment-actions{margin-top:5px}
 html[data-ui-density=compact] .ui-equipment-responsibilities>summary,html[data-ui-density=compact] .ui-workshop .ui-equipment-detail-button{min-height:36px}
 html[data-ui-density=compact] #appContent[data-ui-page=report] .stat-card{padding:17px 20px!important}
 html[data-ui-density=compact] td,html[data-ui-density=compact] th{padding-top:10px!important;padding-bottom:10px!important}
}
@media(min-width:1350px){html[data-ui-density=compact] #projListContainer{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@container(max-width:800px){html[data-ui-density=compact] .ui-workshop-canvas{height:auto}}
@media(min-width:1000px){
 #appContent[data-ui-page=projects]{display:grid!important;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-auto-rows:min-content;gap:16px 18px;align-content:start}
 #appContent[data-ui-page=projects]>div:first-child{grid-column:2;grid-row:1;margin:0!important;gap:12px!important}
 #appContent[data-ui-page=projects]>#projSearch{grid-column:1;grid-row:1;margin:0!important;height:44px}
 #appContent[data-ui-page=projects]>div:nth-child(3){grid-column:1/-1;margin:0!important;min-height:42px}
 #appContent[data-ui-page=projects]>#batchBar,#appContent[data-ui-page=projects]>#projListContainer{grid-column:1/-1}
 #appContent[data-ui-page=projects] #projListContainer{margin-top:0;align-items:stretch}
}
@media(max-width:999px){
 .ui-workshop .ui-equipment-card{min-width:0}.ui-workshop .ui-workshop-title{font-size:20px}
 #appTabs .tab-item.active{background:transparent!important;color:#1765cc!important}
 .ui-workshop-description{font-size:12px!important}.ui-workshop-scope{font-size:10px}
 .ui-workshop .ui-workshop-project,.ui-workshop .ui-workshop-search{font-size:16px!important}
 .ui-workshop .ui-equipment-project-name{font-size:15px}.ui-equipment-meta,.ui-equipment-pending,.ui-equipment-responsibilities>summary,.ui-workshop .ui-equipment-detail-button{font-size:12px}
}
@media(max-width:999px){
 body #appContent input:not([type=checkbox]):not([type=radio]):not([type=range]),
 body #appContent select,body #appContent textarea,
 body .modal input:not([type=checkbox]):not([type=radio]),body .modal select,body .modal textarea{font-size:16px!important}
}