:root { --og-ink: #203c35; --og-paper: #f7f3e8; --og-accent: #b4482c; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; color: var(--og-ink); background: radial-gradient(ellipse at top left, #e5eedc, transparent 55%), var(--og-paper); font-family: "Noto Serif SC", "Source Han Serif SC", Georgia, serif; line-height: 1.7; }
header, main, footer { max-width: 1120px; margin: auto; padding: 24px; }
header { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; border-bottom: 2px solid var(--og-ink); }
h1, h2, h3, p { margin: 0 0 12px; }
h1 { font-size: 2.2rem; letter-spacing: -.04em; }
nav { display: flex; flex-wrap: wrap; gap: 14px; margin-left: auto; }
a { color: var(--og-ink); text-underline-offset: 4px; }
section { background: #fffdf7; border: 1px solid #d7d5c5; padding: 24px; margin-bottom: 22px; }
form { display: grid; gap: 10px; max-width: 720px; }
input:not([type=checkbox]), select, textarea { width: 100%; min-width: 0; font: inherit; background: white; color: inherit; border: 1px solid #7b9189; padding: 10px; }
textarea { min-height: 110px; resize: vertical; }
button { font: inherit; cursor: pointer; padding: 10px 16px; border: 1px solid var(--og-ink); background: var(--og-ink); color: white; min-height: 44px; width: fit-content; max-width: 100%; }
button:disabled { opacity: .5; cursor: not-allowed; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible { outline: 3px solid var(--og-accent); outline-offset: 3px; }
article { margin: 18px 0; padding: 18px; border-left: 3px solid var(--og-accent); background: #f2f4e9; overflow-wrap: anywhere; }
#og-status { max-width: 1072px; margin: 18px auto; padding: 16px; background: #e3ecdd; overflow-wrap: anywhere; }
#og-status[data-error=true] { background: #ffe1d5; }
#og-selection, #og-export-result, #og-capabilities { overflow-wrap: anywhere; }
footer { font-size: .9rem; }
@media (max-width: 560px) { header, main, footer { padding: 16px; } section { padding: 16px; } nav { margin: 0; } h1 { font-size: 1.8rem; } }