/* Source visual reference: original private XBB_Sales_Unified_UI_V0.5.3.2.html.
   Authenticated O7 real-data adaptation; no offline demo scripts, customers or pricing logic. */
:root{--p53-text:#273f5a;--p53-soft:#8195ae;--p53-blue:#2669b9;--p53-line:#e3eaf2;--p53-bg:#f5f7fa;--p53-font:"Microsoft YaHei","PingFang SC",Arial,sans-serif;--shadow:0 1px 2px rgba(28,56,88,.035)}
body{background:var(--p53-bg);font-family:var(--p53-font);font-size:12px;color:var(--p53-text)}
button,input,select,textarea{font-family:var(--p53-font)}
.app-shell{display:block;min-height:100vh;background:var(--p53-bg)}
.topbar{position:fixed;top:0;left:0;right:0;height:49px;padding:0 17px;background:#fff;border-bottom:1px solid var(--p53-line);z-index:26;box-shadow:none;gap:12px}
.topbrand{display:flex;align-items:center;gap:11px;min-width:0;color:#1f3c5a;flex:1}
.p53-logo{display:grid;place-items:center;background:#2c6cb0;color:white;width:27px;height:28px;border-radius:5px;font-size:15px;font-weight:800;flex:none}
.p53-brand{display:flex;flex-direction:column;line-height:1.45;min-width:156px}
.p53-brand>b{font-size:12.5px;white-space:nowrap}
.p53-brand>small{font-size:9.5px;color:#9aacc3;font-weight:400;white-space:nowrap}
.p53-header-note{margin-left:11px;border-left:1px solid var(--p53-line);padding-left:14px;font-size:11px;color:#92a4b9;font-weight:400;white-space:nowrap;max-width:40vw;overflow:hidden;text-overflow:ellipsis}
.toplinks{gap:8px;flex:none}
.toplinks #top-user{font-size:11px;color:#6a83a1;white-space:nowrap}
.toplinks .btn{font-size:11px;min-height:29px;padding:5px 9px;border:1px solid #dce6f1;background:#fff;color:#5f7797;border-radius:4px}
.toplinks [data-act="logout"]{color:#647b9b!important}
.sidebar{position:fixed;left:0;top:49px;bottom:0;height:calc(100dvh - 49px);width:174px;border-right:1px solid var(--p53-line);z-index:12;box-shadow:none;background:#fff}
.sidebar .brand{display:flex;height:45px;line-height:44px;padding:0 17px;white-space:nowrap;font-size:11px;font-weight:700;color:#6d84a0}
.sidebar #account{display:none}
.sidebar .side-nav{padding:11px 8px;gap:2px}
.sidebar .nav-item{height:34px;padding:7px 11px;border-radius:3px;gap:10px;font-size:11px;font-weight:600;color:#657e9c}
.sidebar .nav-item.active{border-left:0;background:#e9f2fc;color:#246ebd;font-weight:700}
.sidebar .nav-item .nav-index{border:0;background:none;width:17px;height:20px;font-size:10px;color:#7b97b9}
.sidebar .nav-item.active .nav-index{color:#246ebd}
.sidebar .nav-foot{padding:12px 14px;border-color:var(--p53-line);color:#a2b1c4;font-size:10px}
.body{min-height:100vh;padding-top:49px;margin-left:174px}
.page-header{padding:12px 17px 6px;align-items:flex-start;display:flex;flex-direction:column;gap:0;min-height:56px}
.page-header h1{font-size:16px;color:#263a52;letter-spacing:-.2px;font-weight:750}
.page-header #sub{font-size:10px;color:#a3b3c8}
main{max-width:none;padding:0 16px 24px;min-width:0}
body[data-role="manager"] .page-header,body[data-role="gm"] .page-header,body[data-role="vp"] .page-header{display:none}
body[data-role="manager"] main,body[data-role="gm"] main,body[data-role="vp"] main{padding-top:22px}
.panel{background:white;border:1px solid var(--p53-line);border-radius:5px;box-shadow:none;margin-bottom:10px}
.panel-head{padding:10px 12px;border-color:var(--p53-line)}
.panel-head h2{font-size:12px}
.panel-body{padding:12px}
.btn{min-height:29px;padding:5px 10px;font-size:11px;border-radius:4px}
.btn.primary{background:#2869b7;border-color:#2869b7}
.btn.sm{min-height:25px;padding:3px 8px;font-size:11px}
.input{min-height:29px;font-size:11px;border-color:#dce5f0;box-shadow:none}
.table-wrap th,.table-wrap td{font-size:11px}
.section-tabs .tab{font-size:11px;padding:9px 12px}
.form-grid{gap:12px}
.field label{font-size:11px}
.note,.tag,.subline,.muted,.kv span{font-size:11px}
.p53-workspace,.p53-manager-overview{width:100%;min-width:0}
.p53-title-row{display:flex;align-items:center;justify-content:space-between;gap:13px;margin:0 0 11px;min-height:38px}
.p53-title-row h2{font-size:13px;color:#284362;font-weight:750}
.p53-title-row p{font-size:10.5px;color:#94a7bd;margin-top:3px}
.p53-btn{border:1px solid #d6e2ef;background:#fff;border-radius:4px;color:#566f8d;font-size:10.5px;padding:5px 10px;min-height:27px;font-weight:650;white-space:nowrap;cursor:pointer}
.p53-btn:hover{border-color:#6c9bcf;background:#f2f7fd}
.p53-btn.solid{background:#286dbb;border-color:#286dbb;color:#fff}
.p53-btn.solid:hover{background:#1e59a0;border-color:#1e59a0}
.p53-mini-stats{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:9px}
.p53-mini-stat{height:41px;min-width:102px;border:1px solid var(--p53-line);border-radius:4px;background:white;display:flex;align-items:center;gap:9px;padding:4px 11px}
.p53-mini-stat strong{font-size:16px;color:#27517d}
.p53-mini-stat span{font-size:10px;color:#8a9eb6;white-space:nowrap}
.p53-table-panel,.p53-panel{background:#fff;border:1px solid var(--p53-line);border-radius:5px;overflow:hidden}
.p53-filters{padding:10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.p53-search{display:flex;align-items:center;gap:6px;flex:0 1 480px;min-width:200px}
.p53-search input{flex:1;min-width:80px;width:100%;max-width:none}
.p53-sort{display:flex;align-items:center;gap:5px;font-size:10px;color:#a0b0c4}
.p53-sort select{width:103px;padding:2px 5px}
.p53-count{font-size:10px;color:#9caec2}
.p53-table-scroll{max-width:100%;overflow-x:auto;scrollbar-width:thin}
.p53-project-table{border-collapse:collapse;min-width:1060px;width:100%;font-size:11px}
.p53-project-table th{height:36px;font-size:10px;color:#7f96b0;background:#f8fafc;font-weight:650;text-align:left}
.p53-project-table th,.p53-project-table td{padding:10px 11px;border-bottom:1px solid #eef2f6;vertical-align:middle}
.p53-project-table tr:hover td{background:#fbfdff}
.p53-project-table td:first-child{min-width:210px}
.p53-project-table td:nth-child(2){min-width:88px}
.p53-project-table td:nth-child(3){min-width:138px}
.p53-project-table td:nth-child(4){min-width:82px}
.p53-project-table td:nth-child(5){min-width:210px}
.p53-project-table td:nth-child(6){min-width:112px}
.p53-project-table td:last-child{min-width:140px;text-align:right}
.p53-prj-name{font-size:11.5px;font-weight:750;color:#243e5c}
.p53-sub{font-size:10px;color:#a0aec1;line-height:1.6;margin-top:2px}
.p53-small{font-size:10px;color:#8498b2}
.p53-clamp{max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.p53-money{font-weight:750;color:#2b5788;white-space:nowrap}
.p53-badge{font-size:10px;font-weight:650;padding:3px 6px;border:1px solid #d3e6fb;background:#edf5ff;color:#2670bf;border-radius:3px;display:inline-flex;white-space:nowrap}
.p53-badge.amber{border-color:#f3d8b4;background:#fff6e9;color:#af7937}
.p53-badge.red{border-color:#f0d0d0;background:#fff1f1;color:#b35d5d}
.p53-actions{display:flex;gap:5px;justify-content:flex-end;align-items:center;white-space:nowrap}
.p53-actions .p53-btn{padding:4px 7px;min-height:25px;font-size:10px}
.p53-mobile-projects{display:none}
.p53-pager{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;color:#a2b2c6;font-size:10px}
.p53-pager>div{display:flex;gap:5px}
.p53-empty{padding:20px 14px;text-align:center;color:#a0b1c6;font-size:11px}
.p53-manager-caption{padding:8px 12px;background:#f8fafc;border:1px solid #e4ecf5;border-radius:4px;color:#a3b3c8;font-size:10px;margin-bottom:15px}
.p53-manager-overview .p53-title-row h2{font-size:14px}
.p53-panel{margin-bottom:10px;min-width:0}
.p53-card-head{min-height:42px;display:flex;align-items:center;padding:8px 12px;border-bottom:1px solid var(--p53-line);gap:6px}
.p53-card-head b{font-size:11px;color:#2c4b6d}
.p53-card-head span{font-size:10px;color:#a3b2c4}
.p53-pills{margin-left:auto;background:#f3f6fa;border-radius:20px;padding:6px 11px;font-size:10px;color:#718ba8;white-space:nowrap}
.p53-panel table{width:100%;border-collapse:collapse;font-size:11px}
.p53-panel th{background:#f8fafc;font-size:10px;color:#90a3ba;padding:9px 10px;text-align:left}
.p53-panel td{border-top:1px solid #eef2f7;padding:9px 10px;font-size:10.5px;color:#47617d}
.p53-kpi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;padding:12px}
.p53-kpi{min-width:0;text-align:left;min-height:83px;border:1px solid #dfe8f2;border-radius:5px;background:#fff;padding:9px 12px;display:flex;flex-direction:column;gap:1px;cursor:pointer;color:inherit}
.p53-kpi:hover{border-color:#91b5de;background:#f9fcff}
.p53-kpi>b{color:#315982;font-size:19px;line-height:1.25}
.p53-kpi>strong{font-size:10.5px;color:#47617e}
.p53-kpi>small{font-size:9px;color:#a2b2c6;white-space:normal}
.p53-two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:stretch}
.p53-two-col>.p53-panel{margin-bottom:0}
.p53-activity{padding:10px 14px}
.p53-activity-row{position:relative;display:flex;justify-content:space-between;gap:12px;padding:6px 0 9px;font-size:10.5px;border-bottom:1px dashed #edf2f6}
.p53-activity-row>b{font-size:10.5px}
.p53-activity-row>i{height:5px;background:#286fbe;width:var(--pct);position:absolute;bottom:1px;left:0;border-radius:3px}
.p53-stage-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;padding:12px}
.p53-stage{min-height:68px;padding:7px 3px;border:1px solid #dce6f1;border-radius:5px;background:#f5f8fc;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:10px;color:#607d9b;text-align:center}
.p53-stage>b{font-size:16px;color:#425d7e}
.p53-report-form{display:grid;gap:12px}
.p53-form-section{border:1px solid #e3ebf4;background:#fff;border-radius:5px;overflow:hidden}
.p53-form-section>h3{padding:9px 12px;background:#f8fafc;border-bottom:1px solid #e3ebf4;font-size:12px}
.p53-form-section>.form-grid,.p53-form-section>.field{margin:11px}
.p53-form-section>.p53-hint{margin:0 11px 12px}
.p53-form-section>.field.full{display:block}
.p53-hint{font-size:10.5px;line-height:1.6;color:#839ab4}
.p53-form-footer{position:sticky;bottom:-17px;display:flex;justify-content:flex-end;gap:8px;background:#fff;border-top:1px solid #e5edf6;padding:12px 3px;z-index:4}
@media(min-width:1450px){.p53-project-table td,.p53-project-table th{padding-left:13px;padding-right:13px}}
@media(max-width:1388px) and (min-width:721px){.sidebar{width:165px}.body{margin-left:165px}.p53-mini-stat{min-width:94px;padding:4px 8px}.p53-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.p53-project-table{min-width:1050px}}
@media(max-width:1050px) and (min-width:721px){.p53-two-col{grid-template-columns:1fr}.p53-brand{min-width:auto}.p53-header-note{display:none}.toplinks{gap:3px}}
@media(max-width:720px){
 .app-shell{display:block}.sidebar{display:none!important}.body{margin:0;padding-top:48px}
 .topbar{height:48px;padding:0 10px}.topbrand{gap:6px}.p53-logo{width:25px;height:25px}.p53-brand>b{font-size:11px}.p53-brand>small,.p53-header-note{display:none}.p53-brand{min-width:0}
 .toplinks{gap:3px}.toplinks #top-user,.toplinks [data-act="preview"]{display:none!important}.toplinks .btn{padding:3px 5px;min-height:25px;font-size:10px}
 .page-header{padding:10px 12px 7px;min-height:43px}.page-header h1{font-size:15px}
 main{padding:0 9px 130px!important}.p53-title-row{padding:0 2px;align-items:center}.p53-title-row h2{font-size:12px}.p53-title-row p{font-size:9px}
 .p53-mini-stats{display:grid;grid-template-columns:1fr 1fr;gap:6px}.p53-mini-stat{min-width:0;height:39px}
 .p53-filters{gap:6px}.p53-search{flex:1 1 100%;min-width:0}.p53-search input{min-width:0}.p53-sort{flex:1}.p53-count{margin-left:auto}
 .p53-project-table{display:none}.p53-mobile-projects{display:grid;gap:7px;padding:0 9px 9px}.p53-mobile-row{background:#fff;border:1px solid #e5ecf4;border-radius:5px;padding:11px 10px;font-size:11px;color:#627d9c}.p53-mobile-row-top{display:flex;justify-content:space-between;align-items:center;gap:5px}.p53-mobile-row-top>b{color:#304f72;font-size:12px}.p53-mobile-row .p53-actions{justify-content:flex-start;margin-top:10px}.p53-mobile-row .p53-sub{margin:5px 0}
 .p53-manager-overview{padding-top:0}.p53-manager-caption{font-size:9px;margin-bottom:9px}.p53-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:8px}.p53-kpi{min-height:75px}.p53-two-col{grid-template-columns:1fr;gap:8px}.p53-panel{overflow:hidden}.p53-panel .p53-table-scroll>table{min-width:590px}.p53-stage-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
 .p53-form-section>.form-grid{display:grid;grid-template-columns:1fr}.p53-form-footer{bottom:-12px}
 .drawer{width:100%;height:100dvh;max-height:100dvh}
 #drawer-body{overflow-y:auto;min-height:0}
}
@media(max-height:780px){.p53-kpi{min-height:74px}.p53-mini-stat{height:39px}.p53-form-footer{padding:8px 0}}