:root { color-scheme:dark; --ink:#0c0b08; --paper:#f7f4ec; --yellow:#ffd344; }
* { box-sizing:border-box; } body { margin:0; background:var(--ink); color:var(--paper); font:16px/1.5 system-ui,sans-serif; }
header { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px; border-bottom:1px solid #41413a; } .logo { font-size:24px; font-weight:900; text-decoration:none; } .logo small { display:block; font-size:11px; letter-spacing:.12em; color:var(--yellow); }
main { max-width:540px; margin:auto; padding:16px 16px 50px; } h1 { font-size:28px; line-height:1.2; } h2 { font-size:21px; } h3 { font-size:18px; } a { color:var(--yellow); } p { overflow-wrap:anywhere; } label { display:block; margin:16px 0; }
input,select,textarea,button { font:inherit; min-height:48px; border-radius:7px; } input,select,textarea { display:block; width:100%; padding:12px; border:1px solid #74746a; background:#11120f; color:var(--paper); margin-top:6px; } button { border:0; background:var(--yellow); color:var(--ink); font-weight:700; padding:12px 16px; cursor:pointer; margin:6px 0; } button:disabled { opacity:.45; cursor:default; } button.quiet { border:1px solid #77786e; background:transparent; color:var(--paper); } button.danger { color:#ffb5ad; }
.card,fieldset { display:block; padding:16px; margin:20px 0; border:1px solid #42443b; background:#1b1d17; border-radius:10px; min-width:0; } .card-link { text-decoration:none; } .card-link span { display:block; color:#d4d5ca; margin-top:8px; } .notice { background:#28291d; border-left:3px solid var(--yellow); padding:12px; } .error { border-color:#ff8d80; background:#35201d; } .badge { width:fit-content; border-radius:20px; background:var(--yellow); color:var(--ink); padding:5px 12px; font-weight:700; }
.content-row,.review-item { padding:12px 0; border-bottom:1px solid #5a5a50; } .check { display:flex; gap:12px; align-items:flex-start; } .check input { width:24px; min-height:24px; flex-shrink:0; }
canvas[data-signature],.signature-read { width:100%; height:160px; background:#fff; border-radius:6px; touch-action:none; display:block; } .signature-read { height:auto; } [data-qr-url] svg { width:180px; height:180px; max-width:100%; background:#fff; } video { width:100%; max-height:320px; } [hidden] { display:none!important; }
:focus-visible { outline:3px solid var(--yellow); outline-offset:4px; } .skip { position:absolute; top:-100px; left:10px; } .skip:focus { top:5px; background:var(--ink); z-index:5; } .report-hash { font-size:12px; overflow-wrap:anywhere; } footer { text-align:center; color:#babbaf; padding:24px; font-size:13px; } .desktop-note { display:none; font-size:14px; color:#babbaf; }
@media(min-width:700px) { .desktop-note { display:block; } }
@media print { :root { color-scheme:light; } body { background:#fff; color:#111; } header,footer,button,.desktop-note,.skip { display:none; } main { max-width:none; } .card,.notice { background:#fff; color:#111; border-color:#aaa; break-inside:avoid; } a { color:#111; } }
