:root { color-scheme: light dark; font: 16px system-ui,sans-serif; background: #f7f8fa; color: #182332; }
* { box-sizing: border-box; } body { margin: 0; } header { background: #133b2d; color: white; padding: 1rem 1.5rem; display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; } header a { color: white; } nav { display: flex; gap: 1rem; flex: 1; flex-wrap: wrap; } main { max-width: 1100px; margin: auto; padding: 1.5rem; } section,article { border: 1px solid #bac4cf; border-radius: .5rem; padding: 1rem; margin: 1rem 0; background: white; } h1,h2,h3 { margin-top: 0; } label { display: block; margin: .6rem 0; } input,select,textarea,button { font: inherit; min-height: 44px; padding: .6rem; border-radius: .3rem; border: 1px solid #8896a6; } input,select,textarea { display: block; width: 100%; max-width: 600px; } button { margin: .4rem .5rem .4rem 0; cursor: pointer; background: #135439; color: white; } button:disabled { opacity: .5; cursor: wait; } pre { white-space: pre-wrap; overflow-wrap: anywhere; background: #eef1f5; color: #152231; padding: 1rem; max-height: 65vh; overflow: auto; } .danger { background: #8d2727; } .muted { color: #56677b; } .badge { display: inline-block; padding: .25rem .5rem; background: #edf2f0; border: 1px solid #b5c6bf; border-radius: 5px; } #status { min-height: 1.5rem; } [hidden] { display:none!important; }
@media(prefers-color-scheme:dark) { :root { background:#12202a;color:#edf2f5; } section,article {background:#20303a;border-color:#637985;} input,select,textarea { background:#162630;color:#edf2f5; } pre { background:#0d1b25;color:#edf2f5;} .muted{color:#bdcbd6;}.badge{background:#234738;color:#f2fff7;} }
@media(max-width:600px) { main { padding:.7rem; } header { padding:.8rem; } nav { gap:.7rem; } section,article {padding:.8rem;} button {width:100%;} }
.identifier { overflow-wrap: anywhere; }