:root{
    --brand-red:#e10d12;
    --brand-orange:#ff7a00;
    --brand-yellow:#ffb000;
    --dark:#172033;
    --muted:#7b8495;
    --glass-bg:rgba(255,255,255,.70);
    --glass-border:rgba(255,255,255,.78);
    --soft-shadow:0 22px 55px rgba(255,91,0,.10), 0 8px 30px rgba(20,30,55,.08);
}
*{box-sizing:border-box}
body{
    min-height:100vh;
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--dark);
    background:
        radial-gradient(circle at 8% 0%, rgba(255,76,0,.22), transparent 32%),
        radial-gradient(circle at 100% 100%, rgba(255,80,0,.25), transparent 34%),
        linear-gradient(135deg,#fff8f4 0%,#ffffff 48%,#fff4ef 100%);
    background-attachment:fixed;
}
body:before, body:after{
    content:"";
    position:fixed;
    pointer-events:none;
    z-index:-1;
}
body:before{
    width:460px;height:460px;left:-160px;top:-120px;
    background:linear-gradient(135deg,rgba(225,13,18,.32),rgba(255,122,0,.08));
    filter:blur(8px);border-radius:42% 58% 58% 42%;
}
body:after{
    width:520px;height:520px;right:-210px;bottom:-220px;
    background:linear-gradient(135deg,rgba(255,122,0,.35),rgba(225,13,18,.14));
    filter:blur(9px);border-radius:55% 45% 60% 40%;
}
.app-shell{display:flex;min-height:100vh;padding:18px;gap:18px}
.glass-panel,.glass-card{
    background:var(--glass-bg);
    border:1px solid var(--glass-border);
    box-shadow:var(--soft-shadow);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-radius:24px;
}
.sidebar{width:260px;flex:0 0 260px;padding:18px;position:sticky;top:18px;height:calc(100vh - 36px);overflow:auto}
.brand-wrap{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding:6px 8px}
.brand-logo{width:58px;height:42px;object-fit:contain;border-radius:12px;background:rgba(255,255,255,.55)}
.brand-title{font-weight:900;letter-spacing:-.03em;line-height:1;color:var(--brand-red)}
.brand-subtitle{font-size:12px;color:var(--brand-orange);letter-spacing:.12em;text-transform:uppercase}
.nav-menu{gap:6px}
.nav-menu .nav-link{display:flex;align-items:center;gap:12px;color:#4b5565;border-radius:16px;padding:12px 14px;font-weight:650;font-size:14px}
.nav-menu .nav-link i{width:20px;text-align:center}
.nav-menu .nav-link:hover{background:rgba(255,122,0,.08);color:var(--brand-red)}
.nav-menu .nav-link.active{background:linear-gradient(135deg,rgba(225,13,18,.16),rgba(255,122,0,.22));color:var(--brand-red);box-shadow:inset 0 0 0 1px rgba(255,255,255,.45)}
.main-content{flex:1;min-width:0}
.topbar{height:74px;padding:14px 18px;display:flex;align-items:center;margin-bottom:18px}
.top-title span{display:block;font-weight:900;font-size:19px;letter-spacing:-.02em;background:linear-gradient(135deg,var(--brand-red),var(--brand-orange));-webkit-background-clip:text;color:transparent}
.top-title small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.top-actions{display:flex;align-items:center;gap:10px}
.icon-btn{width:42px;height:42px;border:1px solid rgba(255,255,255,.72);border-radius:15px;background:rgba(255,255,255,.52);display:inline-flex;align-items:center;justify-content:center;color:#475569;text-decoration:none;box-shadow:0 8px 20px rgba(20,30,55,.05)}
.icon-btn:hover{color:var(--brand-red);background:rgba(255,255,255,.8)}
.user-pill{display:flex;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.74);background:rgba(255,255,255,.52);border-radius:18px;padding:8px 12px}
.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--brand-red),var(--brand-orange));font-weight:900}
.user-pill strong{display:block;font-size:13px;line-height:1.1}.user-pill span{display:block;font-size:11px;color:var(--muted)}
.page-content{padding-bottom:30px}
.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}
.page-header h1{font-size:30px;font-weight:900;letter-spacing:-.04em;margin:0}.page-header p{color:var(--muted);margin:5px 0 0}
.glass-card{padding:18px;margin-bottom:18px}
.stat-card{position:relative;overflow:hidden;padding:18px}.stat-card:after{content:"";position:absolute;width:90px;height:90px;right:-30px;bottom:-30px;background:linear-gradient(135deg,rgba(225,13,18,.12),rgba(255,122,0,.25));border-radius:50%}
.stat-label{font-size:12px;color:var(--muted);font-weight:700}.stat-value{font-size:24px;font-weight:900;letter-spacing:-.03em;margin-top:8px}.stat-icon{width:42px;height:42px;border-radius:15px;background:rgba(255,122,0,.12);color:var(--brand-red);display:grid;place-items:center;font-size:18px}
.btn-brand{background:linear-gradient(135deg,var(--brand-red),var(--brand-orange));border:none;color:#fff;font-weight:800;box-shadow:0 12px 25px rgba(225,13,18,.2)}
.btn-brand:hover{color:#fff;filter:brightness(.98);transform:translateY(-1px)}
.btn-soft{background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.85);color:#526071;font-weight:700}
.form-control,.form-select{border-radius:14px;border:1px solid rgba(226,232,240,.9);background:rgba(255,255,255,.72);font-size:14px;padding:.72rem .9rem}
.form-control:focus,.form-select:focus{border-color:rgba(255,122,0,.55);box-shadow:0 0 0 .25rem rgba(255,122,0,.13)}
.form-label{font-size:12px;font-weight:800;color:#445066}.required{color:var(--brand-red)}
.table{--bs-table-bg:transparent;font-size:13px}.table thead th{color:#637083;font-size:12px;text-transform:uppercase;letter-spacing:.02em;background:rgba(255,255,255,.48);border-bottom:1px solid rgba(226,232,240,.9)}.table tbody td{vertical-align:middle;color:#2e3849}.table-hover tbody tr:hover{background:rgba(255,122,0,.05)}
.badge-status{border-radius:999px;padding:.45rem .65rem;font-weight:800;font-size:11px}.badge-warning{background:#fff1d6;color:#bc6500}.badge-success{background:#dcfce7;color:#15803d}.badge-danger{background:#fee2e2;color:#b91c1c}.badge-info{background:#dbeafe;color:#1d4ed8}.badge-primary{background:#e0e7ff;color:#4338ca}.badge-secondary{background:#eef2f7;color:#475569}.badge-dark{background:#e5e7eb;color:#111827}.badge-revision{background:#ffedd5;color:#c2410c}
.chart-line{height:210px;position:relative;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.38));overflow:hidden}.chart-line svg{width:100%;height:100%}.donut{width:150px;height:150px;border-radius:50%;background:conic-gradient(var(--brand-red) 0 35%,var(--brand-orange) 35% 60%,#ffb000 60% 76%,#ffdb7a 76% 88%,#eef2f7 88% 100%);position:relative;margin:auto}.donut:after{content:"";position:absolute;inset:34px;background:rgba(255,255,255,.88);border-radius:50%;box-shadow:inset 0 0 30px rgba(20,30,55,.05)}
.dropzone{border:1.5px dashed rgba(255,122,0,.45);border-radius:18px;background:rgba(255,255,255,.42);padding:25px;text-align:center;color:#6b7280}.dropzone i{font-size:30px;color:var(--brand-orange);margin-bottom:8px}
.detail-list{display:grid;gap:8px}.detail-item{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed rgba(148,163,184,.35);padding-bottom:8px}.detail-item span{color:var(--muted);font-size:12px}.detail-item strong{text-align:right;font-size:13px}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(980px,100%);display:grid;grid-template-columns:1.1fr .9fr;overflow:hidden}.login-hero{padding:48px;background:linear-gradient(135deg,rgba(225,13,18,.10),rgba(255,122,0,.18));display:flex;flex-direction:column;justify-content:space-between}.login-form{padding:48px}.login-logo{max-width:260px;height:auto}.gradient-text{background:linear-gradient(135deg,var(--brand-red),var(--brand-orange));-webkit-background-clip:text;color:transparent}.mini-caption{font-size:12px;color:var(--muted)}
.glass-alert{border:1px solid rgba(255,255,255,.75);border-radius:18px;box-shadow:var(--soft-shadow)}
.section-title{font-weight:900;font-size:16px;margin-bottom:14px}.empty-state{padding:40px;text-align:center;color:var(--muted)}
@media(max-width:991px){.app-shell{padding:10px}.sidebar{position:fixed;z-index:20;left:-280px;transition:.25s;top:10px;height:calc(100vh - 20px)}.sidebar.show{left:10px}.main-content{width:100%}.login-card{grid-template-columns:1fr}.login-hero{display:none}}
@media(max-width:575px){.topbar{height:auto}.page-header{display:block}.stat-value{font-size:20px}.glass-card{padding:14px}.table-responsive{border-radius:18px}}
.notif-dot{position:absolute;right:-4px;top:-5px;min-width:20px;height:20px;border-radius:999px;background:linear-gradient(135deg,var(--brand-red),var(--brand-orange));color:#fff;font-size:11px;font-weight:900;display:grid;place-items:center;border:2px solid rgba(255,255,255,.9)}
.item-row-card{border:1px solid rgba(255,255,255,.72);background:rgba(255,255,255,.45);border-radius:18px;padding:14px;margin-bottom:12px}
.total-pill{border-radius:18px;background:linear-gradient(135deg,rgba(225,13,18,.12),rgba(255,122,0,.15));padding:14px 18px;font-weight:900;color:var(--brand-red);display:flex;justify-content:space-between;align-items:center;gap:12px}
.mobile-card-list{display:none}.mobile-request-card{border:1px solid rgba(255,255,255,.72);background:rgba(255,255,255,.58);border-radius:18px;padding:14px;margin-bottom:12px;box-shadow:0 8px 22px rgba(20,30,55,.05)}
.mobile-request-card .mobile-title{font-weight:900;color:var(--brand-red)}.mobile-request-card .mobile-meta{font-size:12px;color:var(--muted)}
.timeline{position:relative;display:grid;gap:12px}.timeline-item{display:flex;gap:12px}.timeline-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--brand-red),var(--brand-orange));color:#fff;flex:0 0 34px;box-shadow:0 8px 20px rgba(225,13,18,.18)}.timeline-body{background:rgba(255,255,255,.45);border:1px solid rgba(255,255,255,.68);border-radius:16px;padding:10px 12px;flex:1}.timeline-body strong{display:block;font-size:13px}.timeline-body small{color:var(--muted)}
.file-preview-box{border:1px dashed rgba(255,122,0,.45);border-radius:18px;background:rgba(255,255,255,.42);padding:16px;text-align:center;min-height:104px;display:grid;place-items:center}.file-preview-box img{max-width:100%;max-height:180px;border-radius:14px;object-fit:contain}
@media(max-width:767px){.desktop-table{display:none!important}.mobile-card-list{display:block}.page-header h1{font-size:24px}.btn{white-space:normal}.top-actions{gap:6px}.user-pill{padding:6px 8px}.brand-logo{width:48px}.sidebar{width:245px;flex-basis:245px}.item-row-card .btn-remove-item{width:100%;margin-top:6px}}
.recipient-list .list-group-item{border:1px solid rgba(255,255,255,.72);background:rgba(255,255,255,.45);color:var(--dark)}
.recipient-list .list-group-item.active{background:linear-gradient(135deg,rgba(225,13,18,.16),rgba(255,122,0,.22));border-color:rgba(255,122,0,.28);color:var(--dark)}
.recipient-list .list-group-item:hover{background:rgba(255,122,0,.08);color:var(--dark)}
.reimbursement-summary-card .detail-item strong{font-size:14px}
.reimbursement-item-row input[type="file"]{padding:.55rem .75rem}
.xls-preview-note{border:1px dashed rgba(255,122,0,.45);background:rgba(255,255,255,.45);border-radius:18px;padding:14px;color:var(--muted);font-size:12px}