:root { font-family: system-ui, sans-serif; color: #172b42; background: #f3f7fb; line-height: 1.55; }
* { box-sizing: border-box; }
body { margin: 0; }
header { background: white; border-bottom: 1px solid #dbe5ef; padding: 1rem max(1rem, calc((100% - 1100px) / 2)); }
nav { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
nav img { width: 42px; vertical-align: middle; }
a { color: #075faa; }
nav a { text-decoration: none; }
nav a[aria-current="page"] { font-weight: 700; text-decoration: underline; }
main { max-width: 1100px; margin: auto; padding: 1.5rem 1rem 4rem; }
h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: .25rem; }
h2 { margin-top: 0; font-size: 1.3rem; }
h3 { margin-top: .25rem; }
.muted { color: #506579; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 1rem; }
.card { background: white; border: 1px solid #dbe5ef; border-radius: 14px; padding: 1.35rem; margin-bottom: 1rem; }
.notice { padding: .85rem 1rem; border-left: 4px solid #0877bf; background: #e7f3fc; margin: 1rem 0; overflow-wrap: anywhere; }
.warning { border-color: #b36500; background: #fff5dc; }
.error { border-color: #be263d; background: #fff0f2; }
label { display: block; margin: .7rem 0 .25rem; font-weight: 600; }
input, select, textarea { width: 100%; border: 1px solid #a9bacb; border-radius: 7px; padding: .7rem; font: inherit; background: white; color: inherit; }
input[type="checkbox"] { width: auto; margin-right: .4rem; }
textarea { font-family: ui-monospace, monospace; font-size: .9rem; min-height: 90px; }
button, .button { display: inline-block; background: #075faa; color: white; padding: .65rem 1rem; border: 0; border-radius: 7px; font: inherit; cursor: pointer; text-decoration: none; margin: .6rem .4rem .2rem 0; }
button.secondary { background: #e9f0f7; color: #172b42; }
button.danger { background: #a72338; }
button:disabled { opacity: .6; cursor: wait; }
:focus-visible { outline: 3px solid #e99b21; outline-offset: 3px; }
pre { padding: 1rem; border-radius: 8px; background: #142338; color: #e1efff; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 550px; overflow: auto; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: .65rem; border-bottom: 1px solid #dbe5ef; vertical-align: top; }
td { overflow-wrap: anywhere; }
.badge { display: inline-block; padding: .1rem .5rem; border-radius: 5px; background: #e9f0f7; font-size: .85rem; }
progress { width: 100%; height: 1rem; }
[hidden] { display: none !important; }
details { margin: .7rem 0; }
footer { color: #506579; font-size: .9rem; margin-top: 2rem; }