@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&display=swap');
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f7fb;color:#17243b;font-family:'Be Vietnam Pro',system-ui,sans-serif;font-size:14px}.app-shell{display:flex;min-height:100vh}.sidebar{width:256px;flex:none;background:#101b2d;color:#a9b9d0;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;padding:26px 14px}.brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none;padding:0 10px 28px;border-bottom:1px solid #26344a}.brand img{width:42px;height:42px;object-fit:contain;background:white;border-radius:11px;padding:3px}.brand strong{display:block;font-size:15px;line-height:1.4}.brand small{font-size:10px;color:#8b9cb4;letter-spacing:.08em;text-transform:uppercase}.sidebar-caption{font-size:10px;letter-spacing:.15em;font-weight:700;color:#71829b;margin:30px 12px 12px}.nav-item{display:flex;align-items:center;gap:12px;color:#b9c5d4;text-decoration:none;padding:12px;border-radius:10px;margin:2px 0;font-weight:500}.nav-item i{font-size:17px}.nav-item:hover{background:#26364e;color:white}.sidebar-bottom{margin-top:auto}.help-card{display:flex;gap:12px;background:#1b2c44;border-radius:14px;padding:16px;color:white}.help-card i{font-size:22px;color:#90b8ff}.help-card strong,.help-card a,.help-card span{display:block;font-size:11px}.help-card a{color:#c8d8ed;margin:7px 0;text-decoration:none}.help-card span{color:#94a6bd}.main{min-width:0;flex:1;display:flex;flex-direction:column}.topbar{height:74px;background:white;border-bottom:1px solid #e7ebf2;display:flex;align-items:center;justify-content:space-between;padding:0 36px}.topbar-title span{display:block}.eyebrow{color:var(--brand);font-size:10px;letter-spacing:.14em;font-weight:800;text-transform:uppercase}.topbar-title span:last-child{font-size:15px;font-weight:700}.topbar-actions{display:flex;align-items:center;gap:18px}.user-pill{display:flex;align-items:center;gap:6px;font-weight:700}.user-pill small{font-weight:500;color:#8491a4}.content{padding:34px 36px;max-width:1600px;width:100%;margin:auto;flex:1}footer{padding:18px 36px;color:#94a0b0;font-size:11px}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:26px}.page-heading h1{font-size:28px;font-weight:800;letter-spacing:-.04em;margin:7px 0}.page-heading p{color:#728099;margin:0}.date-pill,.student-id{background:white;border:1px solid #e2e8f0;border-radius:9px;padding:10px 15px;color:#596c85;font-size:12px}.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:22px}.metric{background:white;border:1px solid #e6ebf1;border-radius:16px;padding:22px;box-shadow:0 3px 14px #14233e08}.metric span,.metric small{display:block;color:#7a899d}.metric strong{display:block;font-size:26px;letter-spacing:-.04em;margin:13px 0 8px}.metric.accent{background:var(--brand);color:white;border-color:var(--brand);position:relative;overflow:hidden}.metric.accent:after{content:'↗';position:absolute;right:10px;top:-35px;font-size:130px;opacity:.1}.metric.accent span,.metric.accent small{color:#ffffffc7}.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}.panel{background:white;border:1px solid #e5ebf2;border-radius:16px;box-shadow:0 3px 14px #14233e07;margin-bottom:20px;overflow:hidden}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:23px 24px;border-bottom:1px solid #edf0f5}.panel-head h2{font-size:17px;font-weight:800;margin:5px 0 0}.panel-body{padding:22px 24px}.scroll-list{max-height:350px;overflow:auto}.list-row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #edf0f5}.list-row:last-child{border-bottom:0}.list-row>div:nth-child(2){flex:1;min-width:0}.list-row strong,.list-row small{display:block}.list-row strong{font-size:13px}.list-row small{font-size:11px;color:#8693a7;margin-top:4px;overflow-wrap:anywhere}.list-icon,.avatar,.icon-badge{background:var(--brand-pale);color:var(--brand);border-radius:11px;width:36px;height:36px;display:grid;place-items:center;flex:none}.avatar{font-weight:700}.count-pill{background:var(--brand-pale);color:var(--brand);padding:5px 10px;border-radius:99px}.form-divider{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#8190a4;font-weight:800;margin:18px 0 12px}.mini-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.mini-form .btn{width:max-content}.stack-form{display:grid;gap:12px}.stack-form .btn{width:max-content}.form-control,.form-select{border-color:#dfe6ef;padding:10px 11px;font-size:12px}.form-control:focus,.form-select:focus{border-color:var(--brand);box-shadow:0 0 0 .2rem var(--brand-pale)}.btn-brand{background:var(--brand);border-color:var(--brand);color:white}.btn-brand:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:white}.btn-outline-brand{border:1px solid var(--brand);color:var(--brand)}.btn-outline-brand:hover{background:var(--brand);color:white}.smart-table{margin:0;font-size:12px}.smart-table th{background:#f8fafd;color:#8290a4;text-transform:uppercase;font-size:10px;letter-spacing:.07em;padding:14px 18px;white-space:nowrap}.smart-table td{padding:15px 18px;vertical-align:middle}.smart-table td small{display:block;color:#91a0b1;margin-top:4px}.status{display:inline-flex;padding:5px 9px;border-radius:99px;font-size:10px;font-weight:700;background:#eef2f7;color:#63758e;white-space:nowrap}.status.paid,.status.matched{background:#e5f7ed;color:#18804a}.status.partial,.status.overpaid{background:#fff1d9;color:#ad670b}.status.review,.status.unmatched{background:#fff0f1;color:#b52c48}.transaction{padding:14px 0;border-bottom:1px solid #edf0f5}.transaction p{font-size:11px;color:#8290a4;margin:5px 0 10px}.transaction .form-select{max-width:210px}.template-links{display:flex;gap:16px;flex-wrap:wrap;margin:18px 0}.template-links a{font-size:12px;color:var(--brand)}.bank-summary{display:flex;align-items:center;gap:14px;background:var(--brand-pale);padding:18px;border-radius:12px}.bank-summary i{font-size:25px;color:var(--brand)}.bank-summary small{display:block;color:#73839b;margin-top:4px}.notice-row{padding:17px 23px;border-bottom:1px solid #edf0f5;display:flex;justify-content:space-between}.notice-row.unread{background:var(--brand-pale)}.notice-row p{font-size:12px;color:#617089;margin:5px 0}.notice-row small{font-size:10px;color:#95a2b3}.muted-pad{padding:24px;color:#8491a4}.empty-state{text-align:center;padding:50px;color:#8190a4}.empty-state i{font-size:35px;color:var(--brand)}.empty-state h3{font-size:17px;color:#1a2b42;margin-top:15px}.qr-image{width:min(100%,310px);height:auto;margin-bottom:10px}.qr-modal .modal-body{padding:24px}.login-grid{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;min-height:calc(100vh - 180px);gap:60px}.login-intro{padding:40px;max-width:700px}.login-intro h1{font-size:clamp(40px,5vw,70px);font-weight:800;line-height:1.14;letter-spacing:-.055em;margin:24px 0}.login-intro h1 em{font-style:normal;color:var(--brand)}.login-intro p{font-size:16px;color:#758399;line-height:1.8;max-width:550px}.intro-tag{font-size:11px;letter-spacing:.15em;color:var(--brand);font-weight:800}.intro-flow{display:flex;gap:14px;align-items:center;color:#76859a;margin-top:50px;flex-wrap:wrap;font-size:11px;font-weight:700}.intro-flow i{color:var(--brand)}.card-soft{background:white;border:1px solid #e6ebf1;box-shadow:0 24px 70px #0d214116;border-radius:22px;padding:38px;max-width:430px;width:100%}.login-card h2{font-weight:800;font-size:24px;margin:20px 0 8px}.login-card .form-label{font-weight:700;font-size:12px}.login-help{text-align:center;margin-top:24px;font-size:12px;color:#8490a1}.login-help a{color:var(--brand)}@media(max-width:1050px){.sidebar{width:210px}.split-grid{grid-template-columns:1fr}.login-grid{gap:20px}}@media(max-width:760px){.app-shell{display:block}.sidebar{width:100%;height:auto;position:static;padding:10px}.sidebar .brand{padding:5px 10px;border:0}.sidebar-caption,.sidebar .nav-item,.sidebar-bottom{display:none}.topbar{padding:0 16px;height:56px}.topbar-title .eyebrow,.user-pill small{display:none}.content{padding:22px 15px}.page-heading{align-items:flex-start}.date-pill{display:none}.login-grid{grid-template-columns:1fr;min-height:0}.login-intro{padding:24px 8px}.login-intro h1{font-size:36px}.intro-flow{margin-top:24px}.card-soft{margin:auto;padding:25px}.metric-grid{grid-template-columns:1fr 1fr}.metric{padding:16px}.metric strong{font-size:18px}.mini-form{grid-template-columns:1fr}.user-pill{font-size:11px}.topbar-actions{gap:7px}}@media(max-width:430px){.metric-grid{grid-template-columns:1fr}.topbar-title span:last-child{font-size:11px}}