:root{--navy:#17385f;--blue:#2e68a4;--blue-soft:#eaf1f8;--ink:#25374b;--muted:#7b8999;--line:#e3e8ee;--canvas:#f4f6f8;--red:#bb4e4a;--green:#388565}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#e8edf2;color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}
button,input{font:inherit;color:inherit;border:0;background:none}button{cursor:pointer;-webkit-tap-highlight-color:transparent}
.phone-shell{position:relative;display:flex;flex-direction:column;width:min(100%,30rem);height:100dvh;min-height:35rem;margin:auto;overflow:hidden;background:var(--canvas)}
.app-body{flex:1;min-height:0;overflow:auto;padding:.6rem .78rem .95rem;scrollbar-width:none}.app-body::-webkit-scrollbar{display:none}
.topbar{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(6rem,1fr) auto auto;align-items:center;gap:.38rem;padding:.52rem .58rem;border:1px solid #e3e8ed;border-radius:.65rem;background:#fff;box-shadow:0 .16rem .5rem #24364a08}
.brand{display:flex;align-items:center;gap:.38rem;min-width:0}.brand-mark{display:grid;place-items:center;flex:none;width:1.95rem;height:1.95rem;border-radius:.48rem;color:#fff;background:var(--navy);font-size:.78rem}.brand-copy{display:grid;gap:.08rem;min-width:0}.brand-copy strong{overflow:hidden;color:#203955;font-size:.7rem;font-weight:750;text-overflow:ellipsis;white-space:nowrap}.brand-copy small{overflow:hidden;color:#8b98a7;font-size:.35rem;letter-spacing:.05rem;text-overflow:ellipsis;white-space:nowrap}
.search-box{display:flex;align-items:center;gap:.28rem;min-width:0;padding:.38rem .42rem;border:1px solid #e2e7ed;border-radius:.42rem;color:#7b8999;background:#f8f9fb}.search-box>i{flex:none;color:#73849a;font-size:.58rem}.search-box input{width:100%;min-width:0;padding:0;outline:0;color:#33485f;background:transparent;font-size:.43rem}.search-box input::placeholder{color:#9ba6b3}.search-box kbd{flex:none;padding:.08rem .16rem;border:1px solid #e0e5eb;border-radius:.22rem;color:#9ba5b1;background:#fff;font-size:.31rem}
.icon-button,.avatar{position:relative;display:grid;place-items:center;flex:none;width:1.72rem;height:1.72rem;border:1px solid #e2e7ed;border-radius:50%;color:#546b83;background:#fff;font-size:.67rem}.icon-button b{position:absolute;top:-.13rem;right:-.12rem;display:grid;place-items:center;width:.68rem;height:.68rem;border:1px solid #fff;border-radius:50%;color:#fff;background:#bd514d;font-size:.35rem}.avatar{border:0;color:#fff;background:#557491;font-size:.52rem;font-weight:700}
.page-title{display:flex;align-items:end;justify-content:space-between;margin:.7rem .08rem .48rem}.eyebrow{color:#8d9bab;font-size:.38rem;font-weight:800;letter-spacing:.1rem}.page-title h1{margin:.12rem 0 0;color:#203853;font-size:.9rem;font-weight:750}.date-control{display:flex;align-items:center;gap:.2rem;padding:.3rem .38rem;border:1px solid #e0e6ed;border-radius:.4rem;color:#65788c;background:#fff;font-size:.4rem}
.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.3rem;margin-bottom:.72rem}.kpi{display:grid;align-content:start;gap:.16rem;min-width:0;min-height:4rem;padding:.43rem .36rem .36rem;border:1px solid #e0e6ed;border-top:2px solid #557da6;border-radius:.58rem;background:#fff}.kpi>span{overflow:hidden;color:#768597;font-size:.43rem;white-space:nowrap;text-overflow:ellipsis}.kpi strong{color:#223b58;font-size:.95rem;line-height:1.08}.kpi strong small{margin-left:.06rem;color:#8190a1;font-size:.39rem;font-weight:550}.kpi em{overflow:hidden;color:#8795a4;font-size:.33rem;font-style:normal;white-space:nowrap;text-overflow:ellipsis}.kpi em.blue{color:#4c739a}.kpi em.red{color:#b64c48}.kpi em.green{color:#388565}.urgent-kpi{border-top-color:#bb4e4a;background:#fffdfd}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:.35rem}.section-head h2{margin:.12rem 0 0;color:#253a51;font-size:.76rem;font-weight:750}.section-head>button{color:#3d6d9a;font-size:.42rem;white-space:nowrap}
.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.38rem;margin-top:.4rem}.service-card{display:flex;align-items:center;gap:.38rem;min-width:0;padding:.46rem .45rem;border:1px solid #e0e6ed;border-radius:.58rem;background:#fff;text-align:left;box-shadow:0 .16rem .42rem #20395508}.service-card:active{border-color:#99b0c7;background:#fafdff}.service-icon{display:grid;place-items:center;flex:none;width:1.8rem;height:1.8rem;border-radius:.48rem;font-size:.75rem}.service-icon.blue{color:#376a9d;background:#eaf1f8}.service-icon.navy{color:#344d6b;background:#edf0f4}.service-icon.teal{color:#467d83;background:#eaf3f2}.service-icon.slate{color:#5a7087;background:#eef1f4}.service-card>span:nth-child(2){display:grid;flex:1;gap:.14rem;min-width:0}.service-card strong{overflow:hidden;color:#2b4158;font-size:.56rem;text-overflow:ellipsis;white-space:nowrap}.service-card small{overflow:hidden;color:#8a97a5;font-size:.38rem;text-overflow:ellipsis;white-space:nowrap}.service-card .go{flex:none;color:#9ba7b4;font-size:.46rem}
.task-heading{margin:.78rem .04rem .4rem}.task-list{overflow:hidden;border:1px solid #e0e6ed;border-radius:.62rem;background:#fff}.task-row{display:flex;align-items:center;gap:.38rem;width:100%;min-width:0;padding:.48rem .44rem;border-bottom:1px solid #ebeff3;text-align:left}.task-row:last-child{border:0}.task-row:active{background:#f8fafc}.task-type{display:grid;place-items:center;flex:none;width:1.65rem;height:1.65rem;border-radius:.42rem;color:#4d7397;background:#edf2f7;font-size:.58rem;font-weight:800}.task-type.urgent-type{color:#fff;background:var(--red)}.task-type.doc-type{color:#526f90;background:#edf2f8}.task-type.request-type{color:#507c7e;background:#edf4f3}.task-type.review-type{color:#64768a;background:#f0f2f5}.task-copy{display:grid;flex:1;gap:.14rem;min-width:0}.task-copy strong{overflow:hidden;color:#2b3e53;font-size:.52rem;font-weight:650;text-overflow:ellipsis;white-space:nowrap}.task-copy small{overflow:hidden;color:#8794a3;font-size:.39rem;text-overflow:ellipsis;white-space:nowrap}.task-status{flex:none;padding:.17rem .28rem;border-radius:.22rem;font-size:.34rem;white-space:nowrap}.task-status.overdue{color:#ad4743;background:#f9e9e8}.task-status.unread{color:#536e8d;background:#edf2f7}.task-status.processing{color:#397d72;background:#eaf4f1}.task-row .arrow{flex:none;color:#a0abb7;font-size:.45rem}
.lower-grid{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;margin-top:.58rem}.deadline-card,.meeting-card{min-width:0;padding:.52rem .5rem;border:1px solid #e1e7ed;border-radius:.58rem;background:#fff}.deadline-card .section-head h2,.meeting-card h2{font-size:.62rem}.deadline-card .section-head>button{font-size:.37rem}.deadline-number{display:flex;align-items:baseline;gap:.24rem;margin:.42rem 0 .3rem}.deadline-number strong{color:#244262;font-size:1rem}.deadline-number strong small{font-size:.55rem}.deadline-number span{color:#8996a4;font-size:.35rem}.progress-track{height:.28rem;overflow:hidden;border-radius:1rem;background:#edf1f4}.progress-track i{display:block;width:92%;height:100%;border-radius:inherit;background:#527ba3}.deadline-foot{display:flex;justify-content:space-between;margin-top:.28rem;color:#8492a0;font-size:.32rem}.deadline-foot b{color:#b34d49;font-weight:600}
.meeting-card .eyebrow{font-size:.33rem;letter-spacing:.08rem}.meeting-card h2{margin:.13rem 0 .3rem;color:#2c4158;font-size:.62rem}.meeting-card>strong{display:grid;color:#355f89;font-size:.72rem}.meeting-card>strong small{margin-top:.08rem;color:#677b90;font-size:.4rem;font-weight:600}.meeting-card p{margin:.19rem 0;color:#8b98a6;font-size:.36rem}.meeting-card>button{padding:0;color:#3e6d99;font-size:.37rem}
footer{padding:.62rem .04rem .1rem;color:#738496;font-size:.41rem}footer span{display:block;margin-top:.13rem;color:#9aa5b1;font-size:.36rem}
.bottom-nav{position:relative;z-index:2;display:flex;flex:none;align-items:center;justify-content:space-around;padding:.38rem .14rem max(.42rem,env(safe-area-inset-bottom));border-top:1px solid #e2e7ed;background:#fff}.bottom-nav button{position:relative;display:grid;justify-items:center;gap:.12rem;min-width:2.2rem;color:#96a2af;font-size:.39rem}.bottom-nav button>i{font-size:.74rem}.bottom-nav button.active{color:#2e659b}.bottom-nav button>b{position:absolute;top:-.12rem;right:.02rem;display:grid;place-items:center;min-width:.65rem;height:.65rem;padding:0 .1rem;border:1px solid #fff;border-radius:1rem;color:#fff;background:#ba514d;font-size:.33rem}
.toast{position:absolute;z-index:8;bottom:4rem;left:50%;max-width:88%;padding:.48rem .66rem;border-radius:.42rem;color:#fff;background:#1d3b5e;font-size:.52rem;text-align:center;white-space:nowrap;opacity:0;pointer-events:none;transform:translate(-50%,.4rem);transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
.modal-wrap{position:absolute;inset:0;z-index:9;display:none;align-items:end;background:#172d4678;backdrop-filter:blur(2px)}.modal-wrap.open{display:flex}.modal{position:relative;width:100%;max-height:78%;overflow:auto;padding:1.25rem .95rem 1.3rem;border-radius:.82rem .82rem 0 0;background:#fff;box-shadow:0 -.4rem 1.2rem #12294524}.close{position:absolute;top:.72rem;right:.75rem;display:grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;color:#718298;background:#f0f3f6}.modal h2{margin:0 2rem .32rem 0;color:#243b55;font-size:.85rem}.modal p{margin:.15rem 0 .72rem;color:#8391a0;font-size:.52rem;line-height:1.7}.modal-row{margin:.3rem 0;padding:.55rem .6rem;border:1px solid #e8edf2;border-radius:.42rem;color:#52667a;background:#f8f9fb;font-size:.52rem}.modal-primary{width:100%;margin-top:.52rem;padding:.58rem;border-radius:.42rem;color:#fff;background:#234b74;font-size:.56rem;font-weight:650}
@media(min-width:600px){body{display:grid;min-height:100dvh;place-items:center;padding:1rem}.phone-shell{width:26rem;height:min(56rem,calc(100dvh - 2rem));border:.58rem solid #151b25;border-radius:2.1rem;box-shadow:0 1.5rem 3rem #21364a35}.bottom-nav{border-radius:0 0 1.48rem 1.48rem}.modal-wrap{border-radius:1.5rem}}
@media(max-width:360px){.app-body{padding-right:.62rem;padding-left:.62rem}.topbar{grid-template-columns:minmax(0,1fr) minmax(5.4rem,.9fr) auto auto;gap:.25rem;padding-right:.42rem;padding-left:.42rem}.brand{gap:.28rem}.brand-mark{width:1.75rem;height:1.75rem}.brand-copy strong{font-size:.62rem}.brand-copy small{font-size:.3rem}.search-box{padding:.34rem}.search-box input{font-size:.38rem}.search-box kbd{display:none}.kpi-grid{gap:.22rem}.kpi{padding-right:.28rem;padding-left:.28rem}.kpi>span{font-size:.4rem}.service-card{gap:.28rem;padding-right:.34rem;padding-left:.34rem}.service-icon{width:1.62rem;height:1.62rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Usable navigation sizing and viewport-contained mockup preview. */
.phone-shell,.app-shell{min-height:0!important}
.bottom-nav,.app-nav{box-sizing:border-box;min-height:4.2rem;padding-block:.42rem max(.48rem,env(safe-area-inset-bottom))}
.bottom-nav button,.bottom-nav a,.app-nav button,.app-nav a{box-sizing:border-box;min-width:2.75rem;min-height:2.85rem;padding:.22rem .12rem;gap:.24rem;font-size:.68rem;line-height:1.15;touch-action:manipulation}
.bottom-nav button>i,.bottom-nav a>i,.app-nav button>i,.app-nav a>i{font-size:1.3rem;line-height:1}
.bottom-nav button.scan,.bottom-nav button.nav-center{min-width:2.9rem;min-height:2.9rem}
.bottom-nav button.scan>i,.bottom-nav button.nav-center>i{font-size:1.35rem}.bottom-nav button.scan>span,.bottom-nav button.nav-center>span{font-size:.58rem}

.phone-shell,.app-shell{position:relative}.modal-wrap,.modal-backdrop{background:rgba(20,32,45,.34);backdrop-filter:none}.modal,.app-modal{max-height:68%}
