:root {
  color-scheme: light dark;
  --paper: #f8f7f3;
  --ink: #30342f;
  --muted: #686d64;
  --line: #d6d9ce;
  --field: #fdfcf9;
  --accent: #465444;
  --button-text: #fffefa;
  --error: #a02e29;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  background: var(--paper);
  color: var(--ink);
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; padding: 0 max(24px, env(safe-area-inset-right)) 0 max(24px, env(safe-area-inset-left)); }
main { width: 100%; max-width: 520px; margin: 0 auto; padding: clamp(32px, 7vh, 72px) 0 max(32px, env(safe-area-inset-bottom)); }
header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: clamp(40px, 7vh, 68px); }
a { color: inherit; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.wordmark { font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; font-size: 36px; letter-spacing: -1.6px; text-decoration: none; }
.eyebrow { color: var(--muted); font-size: 10px; letter-spacing: 1.7px; line-height: 1.6; text-align: right; }
h1, h2 { font-family: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; font-weight: 400; }
h1 { font-size: clamp(32px, 7.4vw, 42px); line-height: 1.14; letter-spacing: -1.3px; margin: 0 0 16px; }
.intro { color: var(--muted); line-height: 1.65; font-size: 16px; margin: 0 0 36px; }
.field { margin-bottom: 24px; }
label { display: block; font-size: 14px; font-weight: 500; margin-bottom: 10px; }
select, textarea, button { font: inherit; }
select, textarea { display: block; width: 100%; color: var(--ink); background: var(--field); border: 1px solid var(--line); border-radius: 10px; padding: 15px 16px; font-size: 16px; line-height: 1.5; }
select { min-height: 54px; }
textarea { min-height: 190px; resize: vertical; }
textarea::placeholder { color: var(--muted); opacity: 1; }
.hint, footer { font-size: 13px; line-height: 1.6; color: var(--muted); }
.hint { margin: 10px 0 0; }
button { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; padding: 16px 20px; min-height: 54px; border: 0; border-radius: 10px; background: var(--accent); color: var(--button-text); cursor: pointer; font-size: 15px; font-weight: 500; }
button:disabled { opacity: .65; cursor: not-allowed; }
button:hover:not(:disabled) { filter: brightness(1.1); }
.copy-button { display: inline-flex; width: auto; min-height: 44px; margin-top: 12px; padding: 8px 0; background: transparent; color: var(--muted); font-size: 13px; text-decoration: underline; text-underline-offset: 4px; }
#handoff-status:empty { display: none; }
#copy-fallback { margin-top: 16px; font-size: 14px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.error { color: var(--error); font-size: 14px; line-height: 1.6; margin: 0 0 20px; }
footer { margin-top: 28px; }
footer > p { margin: 0; }
.privacy { margin-top: 28px; border-top: 1px solid var(--line); padding-top: 16px; }
summary { cursor: pointer; padding: 8px 0; min-height: 44px; }
.privacy p { margin: 8px 0 16px; }
@media (max-width: 380px) { .eyebrow { max-width: 120px; } .wide-only { display: none; } }
@media (prefers-color-scheme: dark) {
  :root { --paper: #1d201c; --ink: #ebece4; --muted: #adb3a6; --line: #454d40; --field: #252a23; --accent: #c4d0b9; --button-text: #252e20; --error: #ffb3ab; }
}