:root { font-family: Arial, sans-serif; color: #242424; background: #fff; }
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.5; }
header { border-bottom: 1px solid #ddd; padding: 18px 24px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
a { color: #27664a; }
main { max-width: 720px; padding: 32px 24px; margin: auto; }
main.wide { max-width: 1100px; }
h1 { font-size: 28px; margin: 0 0 24px; }
label { display: block; margin: 18px 0 6px; }
input, select, textarea, button { font: inherit; }
input:not([type=checkbox]), select, textarea { width: 100%; border: 1px solid #aaa; border-radius: 4px; padding: 10px; background: white; color: #222; }
textarea { min-height: 150px; resize: vertical; }
button { background: #27664a; color: white; padding: 10px 18px; border: 0; border-radius: 4px; cursor: pointer; margin: 18px 8px 0 0; }
button:disabled { opacity: .5; cursor: default; }
:focus-visible { outline: 3px solid #b27728; outline-offset: 3px; }
[hidden] { display: none !important; }
.status { min-height: 28px; color: #744117; overflow-wrap: anywhere; }
article { padding: 22px 0; border-bottom: 1px solid #ccc; overflow-wrap: anywhere; }
article p { white-space: pre-wrap; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
code { overflow-wrap: anywhere; }
