:root { font-family: system-ui, "Microsoft YaHei", sans-serif; color: #172334; background: #f3f6fa; }
* { box-sizing: border-box; }
body { margin: 0; }
header { background: #10263a; color: white; padding: 1rem max(1rem, calc((100vw - 1200px)/2)); display: flex; align-items: center; justify-content: space-between; }
h1 { font-size: 1.3rem; margin: 0; }
main { max-width: 1200px; margin: 1.5rem auto; padding: 0 1rem; }
.card { background: white; border: 1px solid #dce4ed; border-radius: 12px; padding: 1.25rem; margin: 1rem 0; box-shadow: 0 2px 10px #182b4110; }
h2 { margin-top: 0; font-size: 1.2rem; }
h3 { margin-top: 2rem; }
nav { display: flex; flex-wrap: wrap; gap: .5rem; }
button { border: 0; border-radius: 8px; padding: .55rem .85rem; color: white; background: #155f9c; cursor: pointer; font: inherit; }
button:hover { background: #0d4b7d; }
button.secondary { color: #155f9c; background: #e7f1f9; }
button.danger { background: #ad3c36; }
input, select, textarea { width: 100%; padding: .5rem; border: 1px solid #adbac8; border-radius: 6px; font: inherit; background: white; }
label { display: block; font-weight: 600; }
label input, label select, label textarea { margin-top: .25rem; font-weight: 400; }
form { display: grid; gap: .75rem; max-width: 800px; }
.grid-form { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); align-items: end; }
.rule-form { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.wide { grid-column: 1/-1; }
.inline-form { display: flex; flex-wrap: wrap; align-items: end; margin: .8rem 0; }
.inline-form label { min-width: 220px; }
.inline-form button { align-self: end; }
.actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
#notice { min-height: 1.5rem; color: #8a251e; font-weight: 600; }
.item { border-top: 1px solid #e4eaf1; padding: .9rem 0; }
.item p { margin: .35rem 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.meta { color: #526579; font-size: .9rem; }
.tag { display: inline-block; border-radius: 999px; background: #eaf0f8; padding: .15rem .5rem; margin-right: .3rem; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; background: #f3f6fa; padding: .75rem; border-radius: 6px; }
.secret { background: #fff2df; }
code { background: #edf2f6; padding: .1rem .25rem; }
@media (max-width: 600px) { header { display: block; } .inline-form { display: grid; } }