:root { color-scheme: dark; --ink: #eee8df; --dim: #b4a99b; --gold: #ffd09a; --line: #483525; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: radial-gradient(ellipse at 75% 0, #352117 0, transparent 48%), #08070c; color: var(--ink); font: 16px/1.55 system-ui, sans-serif; }
main { width: min(720px, 100% - 40px); margin: 0 auto; padding: 30px 0 64px; }
a { color: var(--gold); text-underline-offset: 4px; }
.back { font-size: 14px; text-decoration: none; }
header { margin: 42px 0 22px; }
.eyebrow { color: var(--gold); text-transform: uppercase; font-size: 12px; letter-spacing: .18em; margin: 0 0 10px; }
h1 { font-size: clamp(28px, 5vw, 38px); font-weight: 500; line-height: 1.2; margin: 0 0 14px; }
header > p:last-child, #success > p:not(.eyebrow) { color: var(--dim); }
.direct { padding: 15px 18px; margin-bottom: 24px; border: 1px solid var(--line); border-radius: 8px; background: #19120fc9; }
.direct span { margin-right: 8px; }
.direct a { overflow-wrap: anywhere; }
form, #success { padding: 26px; border: 1px solid #3c3231; border-radius: 12px; background: #100e13; }
fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
label { display: block; font-weight: 500; font-size: 14px; margin: 0 0 18px; }
.pair { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
input, select, textarea { display: block; width: 100%; min-width: 0; margin-top: 7px; padding: 11px 12px; color: var(--ink); background: #09080d; border: 1px solid #554745; border-radius: 5px; font: inherit; font-weight: 400; }
textarea { resize: vertical; min-height: 150px; }
input::placeholder { color: #a1958b; opacity: 1; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline-offset: 1px; }
.optional, .hint { color: var(--dim); font-weight: 400; }
.hint { margin: -10px 0 20px; font-size: 13px; }
#images { margin: -8px 0 16px; font-size: 14px; padding: 10px; }
#images::file-selector-button { margin-right: 12px; padding: 6px 10px; background: #31251e; border: 1px solid #73533a; border-radius: 4px; color: var(--gold); cursor: pointer; }
#selectedFiles { margin: 0 0 12px; padding-left: 20px; color: var(--dim); font-size: 13px; overflow-wrap: anywhere; }
#selectedFiles:empty { display: none; }
button { font: 600 15px/1.3 system-ui, sans-serif; padding: 13px 20px; color: #211408; background: var(--gold); border: 1px solid var(--gold); border-radius: 5px; cursor: pointer; }
button:hover { background: #ffe0bb; }
button:disabled { opacity: .55; cursor: wait; }
.text-button { padding: 0; border: 0; background: transparent; color: var(--gold); font-size: 13px; text-decoration: underline; margin-bottom: 20px; }
.text-button:hover { background: transparent; }
#privacy { margin: 8px 0 22px; }
#status { margin: 16px 0 0; font-size: 14px; color: var(--dim); }
#status:empty { display: none; }
#status.error { color: #ffb9aa; }
.trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#success h2 { font-size: 27px; font-weight: 500; margin: 0; }
@media (max-width: 520px) { main { width: calc(100% - 28px); padding-top: 22px; } header { margin-top: 30px; } form, #success { padding: 20px; } .pair { grid-template-columns: 1fr; gap: 0; } .direct span { display: block; } }