.preview-banner{position:relative;z-index:5;margin-top:88px;padding:14px 5vw;background:#2a231d;color:#f3ede4;text-align:center}
.preview-banner p{margin:0;font-size:13px;line-height:1.5}
.preview-banner strong{color:var(--accent, #d64c31)}

.quick-lookup{margin:28px 0 44px;padding:0}
.quick-lookup-label{margin:0 0 16px;font-size:16px;line-height:1.4;font-family:Georgia,"Times New Roman",serif;color:var(--ink)}
.quick-lookup-label strong{color:var(--accent)}
.quick-lookup .lookup-row{margin:0}
.quick-lookup .lookup-row input{width:100%;padding:12px 0;border:0;border-bottom:1px solid var(--ink);background:transparent;color:var(--ink);font:18px Georgia,"Times New Roman",serif;outline:none}
.quick-lookup .lookup-row input:focus{border-bottom-color:var(--accent)}
.quick-lookup .field-note{margin-top:12px}

.wizard-main{max-width:760px;margin:0 auto;padding:70px 6vw 140px}
.wizard-head{margin-bottom:44px}
.wizard-progress{display:flex;flex-wrap:wrap;gap:22px;margin:18px 0 0;padding:0;list-style:none;border-top:1px solid var(--line);padding-top:18px}
.wizard-progress li{font-size:11px;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}
.wizard-progress li.is-current{color:var(--ink);font-weight:700}
.wizard-progress li.is-done{color:var(--accent)}

.wizard-step h1{margin:0 0 16px;font-size:clamp(30px,4vw,46px);line-height:1.15}
.step-intro{max-width:560px;margin:0 0 44px;font-family:Georgia,"Times New Roman",serif;font-size:18px;line-height:1.5;color:#5f5f59}

.field-group{margin:0 0 40px;padding:0;border:0}
.field-group legend{padding:0 0 18px;width:100%;border-bottom:1px solid var(--line);font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:var(--accent)}
.legend-note{text-transform:none;letter-spacing:0;color:#a9a9a3}
.field{margin-top:24px}
.field label{display:block;margin-bottom:8px;font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.req{color:var(--accent)}
.field input,.field select,.field textarea{width:100%;padding:12px 0;border:0;border-bottom:1px solid var(--ink);background:transparent;color:var(--ink);font:18px Georgia,"Times New Roman",serif;outline:none}
.field textarea{resize:vertical;min-height:70px}
.field input:focus,.field select:focus,.field textarea:focus{border-bottom-color:var(--accent)}
.field input:disabled,.field input[readonly]{border-bottom-style:dashed;color:var(--muted);font-style:italic;cursor:default}
.field-row{display:flex;gap:28px;margin-top:24px}
.field-row .field{margin-top:0;flex:1}
.field-small{max-width:220px}
.radio-group{display:flex;flex-wrap:wrap;gap:28px}
#edition-group>.radio-group{margin-top:24px}
#edition-details{margin-top:24px}
.radio-option{display:flex;align-items:center;gap:10px;font-family:Georgia,"Times New Roman",serif;font-size:16px;cursor:pointer}
.field-note{margin:10px 0 0;font-size:12px;line-height:1.55;color:var(--muted)}
.lookup-row{display:flex;gap:12px;align-items:flex-end}
.lookup-row input{flex:1}
.btn-lookup{flex-shrink:0;white-space:nowrap;padding:12px 18px}
.btn-lookup:disabled{opacity:.35;cursor:not-allowed}
.lookup-status:empty{display:none}
.lookup-status.is-pending{color:var(--muted);font-style:italic}
.lookup-status.is-found{color:var(--accent)}
.lookup-status.is-error{color:#a52f1e}
.byte-counter{margin:6px 0 0;font-size:11px;color:var(--muted)}
.byte-counter.over{color:#a52f1e;font-weight:700}

.custom-attr-list{margin-top:20px}
.attr-row{display:flex;gap:20px;align-items:flex-end;margin-bottom:20px;padding-bottom:20px;border-bottom:1px dashed var(--line)}
.attr-row .field{margin-top:0;flex:1}
.attr-row .field.label-field{max-width:220px}
.attr-remove{border:0;background:transparent;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;padding:12px 0}
.attr-remove:hover{color:#a52f1e}

.wizard-actions{display:flex;gap:20px;margin-top:48px}
.btn{padding:15px 26px;border:1px solid var(--ink);background:transparent;color:var(--ink);font:13px Arial,sans-serif;text-transform:uppercase;letter-spacing:.12em;cursor:pointer}
.btn-primary{background:var(--ink);color:var(--paper)}
.btn-primary:disabled{opacity:.35;cursor:not-allowed}
.btn-primary:not(:disabled):hover{background:var(--accent);border-color:var(--accent)}
.btn-ghost{border-color:var(--line);color:var(--muted)}
.btn-ghost:hover{border-color:var(--ink);color:var(--ink)}
.btn-danger{background:#a52f1e;border-color:#a52f1e;color:#fff}
.btn-danger:hover{background:#821f12}

.form-error{margin:0 0 28px;padding:14px 18px;border:1px solid #a52f1e;background:#fbeae7;color:#a52f1e;font-size:14px;line-height:1.5}
.form-error:empty,.form-error[hidden]{display:none}

.notice{margin:0 0 28px;padding:18px 20px;border:1px solid var(--accent);background:#fdf3ef}
.notice.deeper{border-color:#a52f1e;background:#fbeae7}
.notice p{margin:0;font-size:14.5px;line-height:1.5}
.notice strong{color:var(--accent)}
.notice.deeper strong{color:#a52f1e}

.record-card{margin:0 0 22px;border:1px solid var(--line);background:var(--soft, #f7f7f5)}
.record-card-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.record-card-head span:last-child{color:var(--accent);font-family:"Courier New",monospace;letter-spacing:0;text-transform:none}
.record-card dl{margin:0;padding:4px 18px}
.record-card dl div{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.record-card dl div:last-child{border-bottom:0}
.record-card dt{color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;padding-top:2px}
.record-card dd{margin:0;font-family:Georgia,"Times New Roman",serif}

.siblings-block{margin:0 0 28px}
.siblings-label{margin-bottom:12px !important;font-size:11.5px;text-transform:uppercase;letter-spacing:.1em}
.sibling-row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.sibling-row .sib-main{font-family:Georgia,"Times New Roman",serif}
.sibling-row .sib-reason{color:var(--muted);font-size:12.5px;margin-top:3px}
.no-siblings{padding:14px 0;color:var(--muted);font-size:13.5px;font-style:italic}

.badge{display:inline-block;margin:0 0 24px;padding:7px 14px;border:1px solid var(--accent);color:var(--accent);font-size:11.5px;text-transform:uppercase;letter-spacing:.1em}
.badge-original{border-color:#466d4d;color:#466d4d}
/* JS toggles a "hidden" class (not the native `hidden` attribute) on these
   badges — this rule is what actually hides them. Without it, both badges
   render at once regardless of which one JS intended to show (a real bug
   found live on 2026-09-16: both "Original edition" and "Sibling edition"
   appeared together on every Review screen). !important guards against the
   .badge rule's own `display` declaration winning the cascade. */
.badge.hidden{display:none !important}

.record-view{margin:0 0 24px;border-top:1px solid var(--line)}
.record-view div{display:grid;grid-template-columns:1fr 2fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:15px;align-items:baseline}
.record-view dt{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.1em;padding-top:2px;overflow-wrap:anywhere}
.record-view dd{margin:0;font-family:Georgia,"Times New Roman",serif;word-break:break-word;overflow-wrap:anywhere}
.record-view dd .unset{color:#a9a9a3;font-style:italic}

.raw-json{margin:0 0 40px}
.raw-json summary{cursor:pointer;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);padding:10px 0}
.raw-json pre{margin:10px 0 0;padding:20px;background:var(--soft, #f7f7f5);border:1px solid var(--line);overflow-x:auto;font:13px/1.6 "Courier New",monospace}

.ack-block{margin:0 0 8px;padding-top:24px;border-top:1px solid var(--line)}
.ack{display:flex;gap:14px;align-items:flex-start;margin-bottom:18px;font-size:14px;line-height:1.5;cursor:pointer}
.ack input{margin-top:3px;flex-shrink:0}

.payment-stub{max-width:460px;padding:28px;border:1px solid var(--line);background:var(--soft, #f7f7f5)}
.payment-row{display:flex;justify-content:space-between;padding-bottom:20px;border-bottom:1px solid var(--line);font-size:18px;font-family:Georgia,"Times New Roman",serif}
.payment-row em{font-style:normal;font-size:12px;color:var(--muted)}
.payment-note{margin:20px 0 26px;font-size:13px;color:var(--muted);line-height:1.5}
.payment-stub .btn{width:100%;margin-bottom:14px}

/* Result-screen identity card: no decorative tilt or hero-layout offset here —
   this card is meant to be screenshotted, so it sits flush and level. */
#result-done .identity-card{transform:none;margin-left:0;max-width:520px}
.record-note{margin:20px 0 0;padding-top:16px;border-top:1px solid var(--line);font-size:13px;line-height:1.55;color:var(--muted)}

#result-fields{margin:0}
#result-fields div{display:grid;grid-template-columns:150px 1fr;column-gap:18px;padding:10px 0;border-top:1px solid var(--line);font-size:13px;line-height:1.5;align-items:baseline}
#result-fields dt{color:var(--muted);white-space:nowrap}
#result-fields dd{margin:0;word-break:break-word;overflow-wrap:anywhere}
#result-fields code{display:inline-block;word-break:break-all}
#result-badge{color:#466d4d !important}

#result-error{padding:28px;border:1px solid #a52f1e;background:#fbeae7}
#result-error h1{color:#a52f1e}

.modal-overlay{position:fixed;inset:0;z-index:50;align-items:center;justify-content:center;padding:20px;background:rgba(23,23,20,.55)}
.modal-overlay:not([hidden]){display:flex}
.modal-overlay[hidden]{display:none}
.modal{max-width:440px;padding:36px;background:var(--paper);border:1px solid var(--line)}
.modal p#modal-body{margin:16px 0 30px;font-family:Georgia,"Times New Roman",serif;font-size:19px;line-height:1.4}
.modal-actions{display:flex;gap:16px}

@media(max-width:640px){
  .wizard-main{padding:60px 20px 100px}
  .field-row{flex-direction:column;gap:24px}
  .lookup-row{flex-direction:column;align-items:stretch;gap:12px}
  .attr-row{flex-direction:column;align-items:stretch;gap:12px}
  .wizard-actions{flex-direction:column}
  .record-view div{grid-template-columns:1fr}
  #result-fields div{grid-template-columns:1fr}
  #result-done .identity-card{max-width:100%}
  .record-card dl div{grid-template-columns:1fr}
}
