*{box-sizing:border-box}body{margin:0;background:#f4f6fa;color:#202c40;font:14px -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}button,select{font:inherit;cursor:pointer}button:focus-visible,select:focus-visible{outline:3px solid #8cacf9;outline-offset:3px}aside{position:fixed;width:218px;inset:0 auto 0 0;background:#111d31;color:#a8b4c8;padding:30px 18px;display:flex;flex-direction:column}.brand{color:#fff;font-size:21px;font-weight:750;padding:0 14px 6px}.brand i{font-style:normal;color:#8fb1ff}.sub{padding:0 14px;font-size:11px;letter-spacing:2px;color:#71819b;margin-bottom:40px}nav button{border:0;background:none;color:#a8b4c8;text-align:left;width:100%;padding:14px 16px;border-radius:9px;margin:4px 0}nav button.active{color:#fff;background:#2a4e99}nav button span{margin-right:14px}aside footer{margin-top:auto;border-top:1px solid #29354a;padding:20px 12px 0;line-height:1.9;font-size:12px}main{margin-left:218px;padding:28px 38px;max-width:1700px}.top{display:flex;justify-content:space-between;align-items:center;color:#778397;font-size:12px}.demo{background:#fff2d8;color:#8b5f13;padding:8px 12px;border-radius:7px}header{display:flex;align-items:center;justify-content:space-between;margin:26px 0 24px}h1{font-size:28px;margin:0 0 8px}h2{font-size:17px;margin:0}p{line-height:1.7;color:#778397;margin:6px 0}select,.outline{padding:10px 14px;border:1px solid #dce2ed;background:white;border-radius:8px;color:#34435a}.primary{background:#315ed0;border:0;color:#fff;padding:11px 17px;border-radius:8px}.panel{background:#fff;border:1px solid #e4e8ef;border-radius:13px;padding:22px;margin-bottom:22px}.row{display:flex;justify-content:space-between;align-items:center;gap:12px}.muted{color:#8590a3;font-size:12px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}.stat{background:#fff;border:1px solid #e4e8ef;border-radius:12px;padding:21px}.stat label{color:#7a879a;font-size:13px}.stat strong{display:block;font-size:30px;margin:13px 0 8px;letter-spacing:-1px}.stat small{font-size:12px;color:#8290a3}.green{color:#1c8b6d!important}.grid{display:grid;grid-template-columns:1.6fr 1fr;gap:22px}.chip{font-size:11px;border-radius:5px;padding:4px 8px;background:#eef3ff;color:#4568ba;display:inline-block;white-space:nowrap}.amber{background:#fff4dc;color:#9c7420}.gray{background:#eff2f7;color:#7a879a}.chart{height:215px;display:flex;align-items:end;gap:22px;padding:25px 10px 26px;border-bottom:1px solid #e8edf5;margin-bottom:25px}.bar{height:100%;flex:1;display:flex;align-items:end;justify-content:center;position:relative}.bar i{width:65%;background:#7595e8;border-radius:6px 6px 0 0;display:block}.bar small{position:absolute;bottom:-25px;color:#8995a5;font-size:11px}.task{padding:16px 0;border-bottom:1px solid #edf0f5}.task:last-child{border:0}.task strong{display:block;font-size:14px;margin-bottom:6px}.task p{font-size:12px}.link{color:#315ed0;background:none;border:0;padding:0;text-align:left}table{width:100%;border-collapse:collapse;text-align:left;margin-top:20px}th{font-size:12px;color:#8490a2;font-weight:500;background:#f8f9fc}th,td{padding:15px 12px;border-bottom:1px solid #edf0f5}td{font-size:13px}.titlecell{max-width:310px}.titlecell small{display:block;color:#8a96a8;margin-top:6px;font-size:11px}.notice{padding:12px 16px;background:#eef3fc;border-radius:8px;color:#627697;font-size:12px;line-height:1.8;margin:16px 0}.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:20px}.day{min-height:112px;border:1px solid #e4e9f1;border-radius:8px;padding:12px}.day em{font-style:normal;font-size:12px;color:#8d98aa}.day b{display:block;margin-top:15px;font-size:12px;line-height:1.6}.day.due{background:#f0f4ff;border-color:#cfdbfa}.empty{padding:40px;text-align:center;border:1px dashed #d2dbea;border-radius:10px;color:#8290a3}dialog{width:620px;max-width:90vw;border:0;border-radius:16px;padding:28px;box-shadow:0 30px 100px #13213c50}dialog::backdrop{background:#14213a66}.details{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:22px 0}.details div{padding:15px;background:#f5f7fb;border-radius:9px;line-height:1.8}.details b{display:block;font-size:21px}a{color:#315ed0} @media(max-width:1050px){main{padding:24px;margin-left:185px}aside{width:185px}.grid{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,1fr)}table{min-width:650px}.panel{overflow:auto}}@media(max-width:650px){aside{width:74px;padding:22px 6px}.brand{font-size:14px;padding:0}.sub,aside footer,nav button span{display:none}nav button{padding:12px 6px;font-size:11px}main{margin-left:74px;padding:16px}.top{align-items:start;gap:10px}header{align-items:start;gap:10px}h1{font-size:23px}.calendar{grid-template-columns:repeat(2,1fr)}}

input,textarea{font:inherit;padding:10px;border:1px solid #dce2ed;border-radius:7px;width:100%;background:white;color:#202c40}textarea{min-height:80px}label{display:block;font-size:12px;color:#62728a;margin:12px 0 6px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.error{color:#b33c36;white-space:pre-wrap}.login{max-width:420px;margin:12vh auto}.login main{margin:0;padding:28px}.login h1{font-size:25px}.login button{width:100%;margin-top:20px}.actions{display:flex;gap:10px;flex-wrap:wrap}a.primary{text-decoration:none}.userbar{margin-top:12px}.readonly{color:#8793a6}.chartnote{padding:30px;border:1px dashed #d5ddea;border-radius:8px;color:#7a889c}dialog form{max-height:75vh;overflow:auto}.caption{font-size:12px;margin-top:6px;color:#8896aa}

/* 手机布局与电脑端使用相同的数据和权限。 */
.mobile-metrics{display:none}
@media(max-width:650px){
 body{overflow-wrap:anywhere}
 aside{position:sticky;top:0;z-index:10;width:auto;inset:auto;padding:12px 12px 8px;box-shadow:0 3px 14px #14213a18}
 .brand{font-size:18px;padding:0 4px 8px}
 .sub{display:none}
 nav{display:flex;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
 nav button{flex:0 0 auto;width:auto;min-height:44px;margin:0;padding:10px 13px;font-size:14px;white-space:nowrap}
 aside footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding:8px 4px 0;border-top:1px solid #29354a;font-size:12px}
 aside footer .caption{display:none}
 aside footer .outline{padding:8px 14px;min-height:44px}
 main{min-width:0;width:100%;margin:0;padding:16px 12px 28px}
 .top{flex-direction:column;gap:8px;align-items:stretch}
 .demo{line-height:1.6;padding:8px 10px}
 header{flex-direction:column;gap:12px;margin:20px 0}
 header>div,header select{width:100%;min-width:0;max-width:100%}
 h1{font-size:24px}h2{font-size:17px}
 .panel{padding:16px 12px;margin-bottom:16px;border-radius:12px;overflow:visible;min-width:0}
 .row{flex-wrap:wrap;align-items:center;gap:8px}
 .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:16px}
 .stat{padding:14px 10px;min-width:0}
 .stat strong{font-size:26px;margin:10px 0}
 .stat small{display:block;line-height:1.6}
 .primary,.outline,.link{min-height:44px}
 .primary{padding:10px 14px}.link{display:inline-flex;align-items:center;padding:8px 0}
 input,textarea,select{font-size:16px;min-height:44px;max-width:100%;min-width:0}
 textarea{min-height:110px}
 .notice{padding:10px 12px;margin:12px 0;line-height:1.8}
 .empty{padding:24px 12px}
 table{display:block;min-width:0;margin-top:14px}
 thead{display:none}
 tbody{display:block}
 tbody tr{display:block;margin-bottom:12px;padding:8px 12px;border:1px solid #e4e8ef;border-radius:10px}
 tbody td{display:block;padding:10px 0;font-size:14px;overflow-wrap:anywhere}
 tbody td::before{content:attr(data-label);display:block;margin-bottom:4px;color:#7a879a;font-size:12px;line-height:1.7}
 tbody td:last-child{border-bottom:0}
 td .caption,td p{margin:0}
 .calendar{grid-template-columns:minmax(0,1fr);gap:10px;margin-top:14px}
 .day{min-height:0;padding:14px}.day em{font-size:15px;font-weight:600}.day b{margin-top:10px;font-size:14px}
 .desktop-metrics{display:none}
 .mobile-metrics{display:grid;gap:12px}
 .metric-card{padding:14px;border:1px solid #e4e8ef;border-radius:10px;min-width:0}
 .metric-card h3{font-size:15px;line-height:1.6;margin:0 0 4px}
 .metric-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px 0;color:#7a879a;font-size:12px}
 .metric-preview strong{display:block;margin-top:5px;font-size:23px;color:#202c40}
 .metric-card summary{min-height:44px;padding:12px 0;color:#315ed0;cursor:pointer}
 .metric-card dl{margin:0}
 .metric-card dl>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid #edf0f5}
 .metric-card dt{color:#7a879a;font-size:13px}.metric-card dd{margin:0;font-variant-numeric:tabular-nums}
 dialog{width:100%;max-width:none;height:100dvh;max-height:100dvh;margin:0;border-radius:0;padding:16px 16px max(16px,env(safe-area-inset-bottom));overflow:hidden}
 dialog[open]{display:flex;flex-direction:column}
 dialog>.row{flex:0 0 auto;padding-bottom:12px;border-bottom:1px solid #e4e8ef}
 dialog form{flex:1;min-height:0;max-height:none;overflow:auto;padding-bottom:12px}
 dialog form>button[type=submit]{position:sticky;bottom:0;width:100%;margin-top:16px;min-height:48px;box-shadow:0 -8px 16px #fff}
 .formgrid,.details{grid-template-columns:minmax(0,1fr)}
 body.login{width:auto;max-width:420px;margin:32px auto;padding:0 12px}
 .login main{padding:24px 18px}.login h1{font-size:22px}
}