:root { color-scheme: light; font-family: system-ui, sans-serif; color: #17313c; background: #f1f5f6; line-height: 1.6; }
* { box-sizing: border-box; }
body { margin: 0 auto; max-width: 1120px; padding: 24px; }
header { background: #132b36; color: #f6fafb; border-radius: 18px; padding: 32px; }
h1 { font-size: clamp(1.7rem, 5vw, 2.7rem); line-height: 1.2; }
h2 { font-size: 1.25rem; }
.eyebrow { font-size: .8rem; letter-spacing: .12em; color: #afded7; }
.notice { border-left: 4px solid #eac073; padding-left: 14px; }
nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0; }
nav a { color: #17313c; background: white; padding: 10px 16px; border: 1px solid #a5b7bd; border-radius: 8px; text-decoration: none; }
nav a[aria-current] { background: #173f49; color: white; }
a:focus-visible { outline: 3px solid #b65c00; outline-offset: 3px; }
main { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; }
section, aside { background: white; border: 1px solid #ccd8dc; border-radius: 14px; padding: 24px; min-width: 0; }
.status { color: #714400; background: #fff3d9; padding: 12px; border-radius: 6px; font-weight: 600; }
dt { font-weight: 600; margin-top: 16px; } dd { margin: 4px 0; }
footer { padding: 24px 0; color: #455d67; }
.skip { position: absolute; left: -10000px; } .skip:focus { position: static; }
@media (max-width: 640px) { body { padding: 12px; } header { padding: 22px; } main { grid-template-columns: 1fr; } nav a { flex: 1 1 140px; } }
form { display: grid; gap: 14px; margin: 20px 0 30px; }
label { display: grid; gap: 5px; font-weight: 600; }
input, select, textarea, button { font: inherit; padding: 11px; border: 1px solid #718b96; border-radius: 6px; width: 100%; min-width: 0; }
textarea { min-height: 100px; } button { background: #173f49; color: white; cursor: pointer; }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible { outline: 3px solid #b65c00; outline-offset: 2px; }
.table-scroll { overflow-x: auto; } table { border-collapse: collapse; width: 100%; } th, td { text-align: left; padding: 10px; border-bottom: 1px solid #ccd8dc; overflow-wrap: anywhere; }
body { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); padding-bottom: max(24px, env(safe-area-inset-bottom)); }