:root { --bg:#f6f8fb; --panel:#fff; --text:#1f2937; --muted:#6b7280; --line:#d8dee9; --brand:#0f4c81; --brand2:#0b6aa2; --danger:#b42318; --ok:#027a48; }
* { box-sizing:border-box; }
body { margin:0; font-family: Arial, Helvetica, sans-serif; background:var(--bg); color:var(--text); }
a { color:var(--brand); }
.container { width:min(1120px, calc(100% - 2rem)); margin:0 auto; }
.py-4 { padding-top:1.5rem; padding-bottom:1.5rem; }
.site-header { background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10; }
.site-header__inner { width:min(1120px, calc(100% - 2rem)); margin:0 auto; min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand { font-weight:700; text-decoration:none; font-size:1.1rem; }
.main-nav { display:flex; gap:.75rem; align-items:center; }
.main-nav a { text-decoration:none; padding:.55rem .7rem; border-radius:.7rem; }
.main-nav a:hover { background:#eef5fb; }
.nav-toggle { display:none; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:1rem; padding:1rem; box-shadow:0 8px 24px rgba(31,41,55,.06); }
.grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1rem; }
.form-row { display:flex; flex-direction:column; gap:.35rem; margin-bottom:1rem; }
label { font-weight:700; }
input, select { width:100%; padding:.75rem; border:1px solid var(--line); border-radius:.7rem; background:#fff; font-size:1rem; }
.btn { display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:.7rem; padding:.7rem 1rem; font-weight:700; cursor:pointer; text-decoration:none; }
.btn-primary { background:var(--brand); color:#fff; }
.btn-secondary { background:#e9eef5; color:#1f2937; }
.notice { color:var(--ok); background:#ecfdf3; border:1px solid #abefc6; padding:.7rem; border-radius:.7rem; margin-bottom:1rem; }
.error { color:var(--danger); background:#fef3f2; border:1px solid #fecdca; padding:.7rem; border-radius:.7rem; margin-bottom:1rem; white-space:pre-wrap; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; }
th, td { text-align:left; border-bottom:1px solid var(--line); padding:.75rem; vertical-align:top; }
th { color:#374151; background:#f9fafb; }
.status { display:inline-block; background:#eef5fb; border:1px solid #c8dff0; border-radius:999px; padding:.2rem .55rem; }
.site-footer { padding:2rem 0; color:var(--muted); }
@media (max-width: 720px) {
    .site-header__inner { align-items:flex-start; padding:.75rem 0; flex-wrap:wrap; }
    .nav-toggle { display:inline-flex; margin-left:auto; }
    .main-nav { display:none; width:100%; flex-direction:column; align-items:stretch; }
    .main-nav.is-open { display:flex; }
    .grid { grid-template-columns:1fr; }
    th, td { padding:.6rem; }
}