:root { --ink:#17232d; --navy:#14384f; --blue:#2f718b; --line:#d9dedb; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#fffdf9; font-family:"Yu Gothic",sans-serif; line-height:1.7; }
header { display:flex; gap:24px; justify-content:space-between; padding:22px max(20px,calc((100% - 1120px)/2)); background:var(--navy); }
header a { color:white; text-decoration:none; font-weight:bold; }
.local-banner { padding:10px 20px; background:#fff3cc; text-align:center; }
main { width:min(1120px,calc(100% - 40px)); margin:40px auto 70px; }
h1 { font-size:clamp(1.5rem,4vw,2.4rem); }
h2 { font-size:1.12rem; }
a { color:var(--blue); }
.cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
article { background:white; border:1px solid var(--line); border-radius:10px; padding:24px; min-width:0; overflow-wrap:anywhere; }
main>article { max-width:760px; }
strong { color:var(--navy); }
form { margin:20px 0; }
label { display:block; font-weight:bold; margin:14px 0; }
input,select { display:block; width:min(100%,520px); padding:12px; border:1px solid #92a4af; border-radius:5px; background:white; color:var(--ink); font:inherit; }
input[type="checkbox"] { display:inline-block; width:auto; margin-right:8px; accent-color:var(--blue); }
button,.button { display:inline-block; max-width:100%; padding:12px 18px; border:0; border-radius:5px; background:var(--blue); color:white; font:inherit; font-weight:bold; cursor:pointer; text-decoration:none; }
button:disabled { opacity:.5; cursor:wait; }
.actions { border-top:1px solid var(--line); padding-top:12px; }
.actions button { margin:5px; }
dl { display:grid; grid-template-columns:100px 1fr; gap:8px; }
dt { font-weight:bold; }
dd { margin:0; overflow-wrap:anywhere; }
#feedback { color:#a32922; overflow-wrap:anywhere; }
pre { white-space:pre-wrap; overflow-wrap:anywhere; font:inherit; }
.muted { color:#5f6c75; font-size:.9rem; }
footer { padding:22px; background:var(--navy); color:white; text-align:center; }
@media(max-width:760px) { .cards { grid-template-columns:1fr; } article { padding:20px; } header { flex-wrap:wrap; } }