:root { --navy:#1f3a5f; --gold:#b08d57; --bg:#f7f7f4; --line:#dcdcd4; }
* { box-sizing: border-box; }
body { margin:0; font:16px/1.5 Georgia, "Times New Roman", serif; color:#222; background:var(--bg); }
header { background:var(--navy); color:#fff; padding:.8rem 1.5rem; display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; }
.brand { color:#fff; text-decoration:none; font-weight:bold; font-size:1.1rem; }
nav a { color:#e8e2d4; text-decoration:none; margin-left:1.2rem; }
nav a:hover { color:#fff; text-decoration:underline; }
main { max-width:880px; margin:2rem auto; padding:0 1.5rem; }
h1 { color:var(--navy); }
h2 { color:var(--navy); margin-top:2rem; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1rem; }
.card { background:#fff; border:1px solid var(--line); border-radius:8px; padding:1.2rem; }
.card h2 { margin-top:0; font-size:1.1rem; }
.btn { display:inline-block; background:#fff; border:1px solid var(--navy); color:var(--navy); padding:.45rem .9rem; border-radius:6px; text-decoration:none; margin:.2rem .3rem .2rem 0; cursor:pointer; font-size:.95rem; }
.btn:hover { background:var(--navy); color:#fff; }
.btn.primary { background:var(--gold); border-color:var(--gold); color:#fff; font-weight:bold; }
.btn.primary:hover { background:#9a784a; }
fieldset { border:1px solid var(--line); border-radius:8px; margin:1rem 0; padding:1rem 1.2rem; background:#fff; }
legend { color:var(--navy); font-weight:bold; padding:0 .4rem; }
label { display:block; margin:.7rem 0; font-size:.95rem; }
input, textarea, select { width:100%; padding:.5rem; border:1px solid var(--line); border-radius:5px; font:inherit; margin-top:.2rem; }
.req { color:#b00; }
table { width:100%; border-collapse:collapse; background:#fff; }
th, td { border:1px solid var(--line); padding:.5rem .7rem; text-align:left; font-size:.92rem; }
th { background:#eee; }
.flash { background:#e7f3e7; border:1px solid #b7d8b7; padding:.7rem 1rem; border-radius:6px; margin-bottom:1rem; }
.flash.error { background:#fbe7e7; border-color:#e0a0a0; }
.output { background:#fff; border:1px solid var(--line); border-radius:8px; padding:1.2rem; white-space:pre-wrap; font:14px/1.55 "SF Mono", Menlo, monospace; }
.muted { color:#888; }
footer { text-align:center; color:#999; padding:2rem; }
