:root{color-scheme:light}
body{font-family:-apple-system,system-ui,Segoe UI,Roboto,Arial,sans-serif;margin:0;background:#f6f7f9}
header{padding:14px 16px;background:#0f4c81;color:#fff;position:sticky;top:0;z-index:5}
header .bar{display:flex;gap:10px;align-items:center;justify-content:space-between}
header h1{margin:0;font-size:16px;font-weight:800;letter-spacing:.2px}
header .crumb{font-size:12px;opacity:.95}
header a.navbtn, header button.navbtn{text-decoration:none;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:10px;padding:8px 10px;font-weight:700;cursor:pointer}
main{padding:14px;max-width:1100px;margin:0 auto}
.grid{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:980px){.grid{grid-template-columns:1.1fr .9fr}}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:12px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.card h2{margin:0 0 10px;font-size:14px}
.muted{color:#6b7280;font-size:12px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace}
.pill{display:inline-flex;gap:8px;align-items:center;padding:8px 10px;border-radius:999px;background:#f1f5f9;border:1px solid #e2e8f0;font-size:12px}
.pill strong{font-size:13px}
.row{display:grid;gap:10px;grid-template-columns:1fr}
@media(min-width:640px){.row.cols-2{grid-template-columns:1fr 1fr}.row.cols-3{grid-template-columns:1fr 1fr 1fr}}
label{font-size:12px;color:#374151;display:block;margin-bottom:4px}
input,textarea{width:100%;padding:10px;border:1px solid #d1d5db;border-radius:12px;font-size:14px;background:#fff}
textarea{min-height:90px;resize:vertical}
.btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
button{padding:10px 12px;border:1px solid #cbd5e1;background:#fff;border-radius:12px;font-weight:800;cursor:pointer}
button.primary{background:#0f4c81;border-color:#0f4c81;color:#fff}
button.danger{background:#b42318;border-color:#b42318;color:#fff}
button.ghost{background:#f8fafc}
a.navbtn{display:inline-block}
.tablewrap{max-height:420px;overflow:auto;border:1px solid #e5e7eb;border-radius:12px}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:8px;border-bottom:1px solid #e5e7eb;vertical-align:top;font-size:13px}
th{font-size:12px;color:#374151;background:#f8fafc;position:sticky;top:0;z-index:1}
.kv{display:grid;grid-template-columns:150px 1fr;gap:6px 10px}
.kv div{padding:6px 0;border-bottom:1px dashed #e5e7eb}
.kv .k{color:#6b7280;font-size:12px}
.kv .v{font-weight:800}
.imgbox{display:grid;place-items:center;border:1px solid #e5e7eb;border-radius:12px;padding:8px;min-height:190px;background:#fafafa}
.imgbox img{max-width:100%;max-height:260px;border-radius:12px}
.warn{color:#b42318;font-weight:900}
.ok{color:#067647;font-weight:900}
.homebtn{width:100%;text-align:left;padding:14px;border-radius:14px;display:block}
.homegrid{display:grid;gap:10px;grid-template-columns:1fr;margin-top:12px}
@media(min-width:640px){.homegrid{grid-template-columns:1fr 1fr}}
.hidden{display:none !important}
.modalBack{position:fixed;inset:0;background:rgba(0,0,0,.55);display:grid;place-items:center;z-index:50}
.modal{background:#fff;border-radius:14px;padding:12px;width:min(92vw,520px);border:1px solid #e5e7eb}
video{width:100%;border-radius:12px;background:#000}
hr{border:none;border-top:1px solid #e5e7eb;margin:12px 0}
