:root { color-scheme: dark; font-family: Inter, system-ui, sans-serif; background: #0b1020; color: #e8ecf4; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top, #182343, #0b1020 55%); }
header { min-height: 64px; padding: 0 5vw; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #293451; background: rgba(8, 13, 28, .9); }
.brand { color: #fff; font-size: 1.15rem; font-weight: 750; text-decoration: none; }
nav { display: flex; align-items: center; gap: 1rem; }
nav a, .link-button { color: #cbd6f0; text-decoration: none; }
nav form { margin: 0; }
.link-button { border: 0; padding: 0; background: transparent; }
main { width: min(1180px, 92vw); margin: 2rem auto; }
.grid.two { display: grid; grid-template-columns: minmax(280px, .8fr) minmax(360px, 1.2fr); gap: 1.25rem; align-items: start; }
.card { background: rgba(18, 26, 49, .96); border: 1px solid #2d3a5d; border-radius: 14px; padding: 1.35rem; margin-bottom: 1.25rem; box-shadow: 0 18px 45px rgba(0,0,0,.22); }
.narrow { max-width: 480px; margin: 10vh auto; }
h1, h2 { margin-top: 0; }
p, small, label span { color: #aeb9cf; }
label { display: grid; gap: .45rem; margin: .9rem 0; font-weight: 650; }
input, select { width: 100%; padding: .75rem; color: #fff; background: #0c1429; border: 1px solid #3b496c; border-radius: 8px; font: inherit; }
button { padding: .72rem 1rem; border: 0; border-radius: 8px; color: #07101e; background: #74d4ff; font-weight: 750; cursor: pointer; }
button.secondary { background: #8792aa; }
.flash { padding: .85rem 1rem; margin-bottom: 1rem; border-radius: 8px; background: #253452; }
.flash.error { background: #582b38; }
.flash.success { background: #184b3c; }
.request-list article { display: grid; grid-template-columns: 1fr auto; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid #2c3857; }
.request-list article:last-child { border-bottom: 0; }
.request-list article p { grid-column: 1 / -1; margin: 0; }
.badge { display: inline-block; padding: .25rem .55rem; border-radius: 999px; background: #34415f; text-transform: capitalize; font-size: .8rem; }
.badge.pending { background: #6d531a; }.badge.submitted { background: #145849; }.badge.error,.badge.rejected { background: #6d2938; }
.actions { display: flex; gap: .5rem; margin-top: .7rem; }
.inline-form { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: .75rem; align-items: end; }
table { width: 100%; border-collapse: collapse; margin-top: 1rem; }
th, td { text-align: left; padding: .7rem; border-bottom: 1px solid #2c3857; }
@media (max-width: 760px) { .grid.two, .inline-form { grid-template-columns: 1fr; } header { align-items: flex-start; padding-block: 1rem; gap: 1rem; } nav { flex-wrap: wrap; justify-content: flex-end; } }