:root{--bg:#0f172a;--panel:#111827;--muted:#64748b;--accent:#22c55e;--accent-contrast:#0f766e;--border:#1f2937;--text:#e5e7eb;--text-weak:#cbd5e1;--danger:#ef4444}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:linear-gradient(180deg,#0b1220, #0f172a);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;}

.container{max-width:1100px;margin:0 auto;padding:24px}
.header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.title{font-size:22px;font-weight:600}
.subtle{color:var(--text-weak)}

.grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:900px){.grid{grid-template-columns:2fr 1fr}}
.stack{display:flex;flex-direction:column;gap:16px}

.card{background:linear-gradient(180deg,#101523,#0f172a);border:1px solid var(--border);border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.35);padding:18px}
.card h3{margin:0 0 10px;font-size:18px}

.table{width:100%;border-collapse:separate;border-spacing:0 8px}
.table thead th{font-weight:600;color:var(--text-weak);text-align:left;padding:10px 12px}
.table thead th.col-fromto{text-align:center}
.table tbody th{font-weight:600;color:var(--text-weak);text-align:left;padding:10px 12px;width:220px}
.table tbody tr{background:#0b1324;border:1px solid var(--border)}
.table tbody td{padding:10px 12px}
.table tbody tr:hover{background:#0e1830}
/* Home column sizing */
.table thead th.uni-time{width:240px}
.table thead th.uni-pa{width:260px}
.table tbody td.uni-time{white-space:nowrap}
.table tbody td.uni-pa{white-space:nowrap}

.input, .select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:#0b1324;color:var(--text)}
.input:focus,.select:focus{outline:2px solid #334155;border-color:#334155}
.select.wide{min-width:260px}
.select.narrow{min-width:140px}
.number{width:110px}
.time{width:130px}

.sheet{width:100%;border-collapse:collapse}
.sheet thead th{background:#0e1830;color:var(--text-weak);padding:10px 12px;border:1px solid var(--border);text-align:left}
.sheet tbody td,.sheet tbody th{border:1px solid var(--border);padding:8px 10px;background:#0b1324}
.sheet .input{width:100%}

.btn{display:inline-flex;align-items:center;gap:8px;border-radius:10px;padding:10px 14px;border:1px solid var(--border);background:#0b1324;color:var(--text);cursor:pointer}
.btn:hover{filter:brightness(1.15)}
.btn-primary{background:linear-gradient(90deg,#22c55e,#10b981);border-color:#16a34a;color:#062b1e;font-weight:600}
.btn-danger{background:linear-gradient(90deg,#ef4444,#f43f5e);border-color:#b91c1c;color:#1b0b0b}

.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.tab{padding:8px 12px;border:1px solid var(--border);border-radius:999px;color:var(--text-weak);text-decoration:none;background:#0b1324}
.tab:hover{color:var(--text)}
.tab.active{background:linear-gradient(90deg,#22c55e,#10b981);color:#062b1e;border-color:#16a34a}

.nav{display:flex;gap:12px;margin-top:8px}
.nav a{color:var(--text-weak);text-decoration:none}
.nav a:hover{color:var(--text)}

.kpi{display:flex;gap:24px;margin-top:8px}
.kpi .item{background:#0b1324;border:1px solid var(--border);border-radius:10px;padding:8px 12px}
.kpi .label{font-size:12px;color:var(--text-weak)}
.kpi .value{font-weight:600}
.pair{display:flex;align-items:center;gap:8px}
.pair.compact{gap:6px}
.pair.compact .time{width:96px;padding:6px 8px;font-size:13px}
.pair.compact span{color:var(--text-weak)}