*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;background:#151515;color:#f5f5f5;font:15px Inter,Segoe UI,Arial,sans-serif;min-height:100vh}
a{color:inherit;text-decoration:none}
.topbar{height:76px;border-bottom:1px solid #303030;background:#1d1d1d;display:flex;align-items:center;justify-content:space-between;padding:0 max(5%,calc((100% - 1200px)/2));gap:20px}
.brand{font-weight:900;font-size:25px}
.brand b{color:#ff2638}
.topbar nav{display:flex;align-items:center;gap:22px;color:#bdbdbd}
.topbar nav a:hover{color:#ff2638}
.navbtn,.btn{background:linear-gradient(100deg,#ff2638,#c81025);border:1px solid #ff394b;border-radius:10px;color:white;padding:12px 17px;font-weight:700;display:inline-block;cursor:pointer}
.navbtn:hover,.btn:hover{filter:brightness(1.1);transform:translateY(-1px)}
.container{max-width:1200px;margin:0 auto;padding:34px 22px;min-height:calc(100vh - 130px)}
.footer{text-align:center;padding:22px;color:#777;border-top:1px solid #303030;font-size:12px}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;padding:65px 0}
.eyebrow{color:#ff2638;text-transform:uppercase;font-size:11px;letter-spacing:2px;font-weight:800}
.hero h1{font-size:clamp(36px,5vw,62px);line-height:1.08;margin:20px 0;color:#fff}
.hero h1 span{color:#ff2638!important}
.hero p,.muted{color:#aaa;line-height:1.8}
.hero-actions{display:flex;gap:12px;margin:25px 0}
.btn.secondary{background:#292929;border:1px solid #414141;color:#fff}
.panel,.card{background:#202020;border:1px solid #363636;border-radius:16px;padding:24px}
.auth-wrap{max-width:520px;margin:30px auto}
.auth-wrap h1{margin-top:0;color:#fff}
.field{margin:15px 0}
.field label{display:block;font-size:13px;margin-bottom:8px;color:#c7c7c7}
.field input,.field select{width:100%;padding:14px;border-radius:10px;border:1px solid #414141;background:#171717;color:#f5f5f5;outline:none}
.field input:focus,.field select:focus{border-color:#ff2638;box-shadow:0 0 0 2px rgba(255,38,56,.12)}
.hint{font-size:12px;color:#888;margin-top:7px}
.btn.full{width:100%;text-align:center;margin-top:8px}
.alert{padding:13px 16px;border-radius:10px;margin:15px 0;background:#183326;color:#8ef0b9;border:1px solid #286344}
.alert.error{background:#351b20;color:#ffb9c8;border-color:#71303b}
.dashhead{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:22px}
.dashhead h1{margin:0;color:#fff}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:20px 0}
.stat small{color:#aaa}
.stat strong{font-size:26px;display:block;margin:12px 0;color:#ff2638}
.linkbox{word-break:break-all;background:#171717;padding:14px;border-radius:10px;border:1px solid #363636;margin:12px 0}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.section-title{margin:0 0 16px;color:#fff}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse;min-width:650px}
th,td{text-align:left;padding:13px;border-bottom:1px solid #363636}
th{color:#888;text-transform:uppercase;font-size:11px}
td{color:#d0d0d0}
.badge{padding:5px 9px;border-radius:20px;font-size:11px}
.pending{background:#3b3020;color:#ffd27c}
.approved,.paid{background:#15382e;color:#6ee7b7}
.rejected{background:#3b202a;color:#ff9bae}
.actions{display:flex;gap:7px;flex-wrap:wrap}
.btn.sm{padding:8px 10px;font-size:12px}
.btn.green{background:#17694e;border-color:#267c5d}
.btn.red{background:#c81025;border-color:#ff2638}
.btn.gray{background:#333;border-color:#444}
.sidebar-layout{display:grid;grid-template-columns:220px 1fr;gap:20px}
.side-menu a{display:block;padding:12px;border-radius:9px;color:#aaa;margin:4px 0}
.side-menu a.active,.side-menu a:hover{background:#292929;color:#fff;border-left:3px solid #ff2638}
.empty{text-align:center;color:#888;padding:25px}
.copybtn{border:1px solid #444;background:#292929;color:#fff;padding:9px 12px;border-radius:8px;cursor:pointer}
.copybtn:hover{background:#333;border-color:#ff2638}
@media(max-width:800px){.hero{grid-template-columns:1fr;padding:35px 0;gap:20px}.stats{grid-template-columns:repeat(2,1fr)}.grid2{grid-template-columns:1fr}.sidebar-layout{grid-template-columns:1fr}.side-menu{display:flex;flex-wrap:wrap}.topbar{padding:0 18px}.topbar nav{gap:12px}.container{padding:22px 14px}.dashhead{align-items:flex-start;flex-direction:column}}
