/* ==========================================
   REGISTRATION MODAL & PASS STYLES
========================================== */

/* ── Overlay ── */
.reg-overlay,
.success-overlay {
    position: fixed;
    inset: 0;
    background: rgba(4, 2, 8, 0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.35s ease;
    padding: 20px;
}

.reg-overlay.active,
.success-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* ── Modal Box ── */
.reg-modal,
.success-modal {
    width: min(720px, 94vw);
    max-height: 90vh;
    overflow-y: auto;
    background: linear-gradient(150deg, rgba(20, 13, 6, 0.98), rgba(9, 5, 2, 0.99));
    border: 1px solid rgba(201, 144, 42, 0.35);
    border-radius: 14px;
    position: relative;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.9), 0 0 50px rgba(201, 144, 42, 0.15);
    transform: translateY(30px) scale(0.96);
    transition: all 0.35s ease;
}

.reg-overlay.active .reg-modal,
.success-overlay.active .success-modal {
    transform: translateY(0) scale(1);
}

/* Top Accent line */
.reg-modal::before,
.success-modal::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--crimson), var(--gold), var(--crimson));
    border-radius: 14px 14px 0 0;
}

/* ── Form Header ── */
.reg-header {
    padding: 28px 32px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    background: radial-gradient(ellipse at top right, rgba(139, 32, 32, 0.15), transparent 60%);
}

.reg-header h2 {
    font-size: 1.8rem;
    color: var(--white);
    margin-bottom: 4px;
}

.reg-header p {
    color: var(--gold);
    font-size: 0.85rem;
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* ── Form Body ── */
.reg-body {
    padding: 24px 32px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-group label {
    font-family: "Cinzel", serif;
    font-size: 0.78rem;
    color: var(--gold);
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-weight: 600;
}

.form-group input,
.form-group select {
    width: 100%;
    padding: 12px 16px;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid rgba(201, 144, 42, 0.2);
    border-radius: 6px;
    color: var(--white);
    font-size: 0.92rem;
    outline: none;
    transition: all 0.3s ease;
}

.form-group input:focus,
.form-group select:focus {
    border-color: var(--gold);
    background: rgba(201, 144, 42, 0.06);
    box-shadow: 0 0 12px rgba(201, 144, 42, 0.2);
}

.form-group select option {
    background: #0d0804;
    color: var(--white);
    padding: 10px;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

@media (max-width: 600px) {
    .form-row {
        grid-template-columns: 1fr;
    }
}

/* Member 2 Section */
.member2-box {
    background: rgba(201, 144, 42, 0.04);
    border: 1px dashed rgba(201, 144, 42, 0.25);
    border-radius: 8px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.member2-box h4 {
    color: var(--gold);
    font-size: 0.8rem;
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* ── Form Footer ── */
.reg-footer {
    padding: 18px 32px 28px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    display: flex;
    justify-content: flex-end;
    gap: 14px;
}

.reg-footer .btn {
    padding: 12px 28px;
    font-size: 0.85rem;
    letter-spacing: 2px;
}
.registration-error {
    flex: 1 1 100%;
    margin: 0;
    color: #ff9b8d;
    font-size: .78rem;
    line-height: 1.4;
}

/* ── SUCCESS MODAL & ONE PIECE WANTED POSTER STYLES (REAL PARCHMENT TEXTURE) ── */
.wanted-modal {
    width: min(600px, 94vw);
    max-height: 94vh;
    background: linear-gradient(rgba(12, 6, 2, 0.88), rgba(12, 6, 2, 0.92)), url('../images/real_parchment.png') no-repeat center/cover;
    border: 2px solid var(--gold);
    border-radius: 10px;
    box-shadow: 0 15px 50px rgba(0,0,0,0.98), 0 0 35px rgba(201, 144, 42, 0.3);
    overflow-y: auto;
    scrollbar-width: none;
}
.wanted-modal::-webkit-scrollbar {
    display: none;
}

.wanted-modal-body {
    padding: 16px 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

/* ONE PIECE WANTED POSTER CARD */
.wanted-poster-pass {
    width: 100%;
    background: #d4b886 url('../images/real_parchment.png') no-repeat center/cover;
    color: #170e06;
    font-family: "Cinzel", serif;
    padding: 18px 16px;
    border: 10px solid #28160a;
    outline: 2px solid #d4af37;
    outline-offset: -7px;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.85), inset 0 0 30px rgba(40,22,10,0.4);
    box-sizing: border-box;
    position: relative;
}

.wanted-header {
    text-align: center;
    border-bottom: 2px double #3d2413;
    padding-bottom: 6px;
    margin-bottom: 10px;
}

.wanted-title {
    font-family: "Cinzel", serif;
    font-size: 3.1rem;
    font-weight: 900;
    color: #170e06;
    letter-spacing: 10px;
    margin: 0;
    text-transform: uppercase;
    line-height: 1;
    text-shadow: 1.5px 1.5px 0px rgba(255,255,255,0.25), -1px -1px 0px rgba(0,0,0,0.3);
}

.wanted-dead-or-alive {
    font-size: 0.78rem;
    font-weight: 800;
    color: #3d2413;
    letter-spacing: 4px;
    margin-top: 3px;
    text-transform: uppercase;
}

/* Center Portrait Photo Frame */
.wanted-portrait-frame {
    width: 78%;
    margin: 0 auto 10px;
    border: 5px solid #2b180d;
    border-radius: 5px;
    background: #120904;
    padding: 10px;
    text-align: center;
    box-shadow: inset 0 0 20px rgba(0,0,0,0.95), 0 3px 10px rgba(0,0,0,0.4);
    position: relative;
    overflow: hidden;
}

.wanted-emblem-img {
    width: 95px;
    height: 95px;
    object-fit: contain;
    margin: 0 auto;
    display: block;
    filter: drop-shadow(0 0 10px rgba(212, 175, 55, 0.45));
    transition: transform 0.3s ease;
}

.wanted-portrait-frame:hover .wanted-emblem-img {
    transform: scale(1.05);
}

.wanted-fest-title {
    font-family: "Cinzel", serif;
    font-size: 1.35rem;
    font-weight: 900;
    color: #f4d66d;
    letter-spacing: 3px;
    margin-top: 4px;
    line-height: 1;
}

.wanted-fest-title span {
    color: #e05c5c;
}

.wanted-fest-sub {
    font-size: 0.62rem;
    letter-spacing: 3px;
    color: #d4af37;
    text-transform: uppercase;
    margin-top: 1px;
}

/* Participant Name Block */
.wanted-name-block {
    text-align: center;
    margin-bottom: 6px;
}

.wanted-captain-name {
    font-family: "Cinzel", serif;
    font-size: 1.85rem;
    font-weight: 900;
    color: #170e06;
    letter-spacing: 3px;
    margin: 0;
    text-transform: uppercase;
    line-height: 1.1;
    word-break: break-word;
    text-shadow: 1px 1px 0px rgba(255,255,255,0.3);
}

/* Bounty Section (One Piece Berries Symbol ฿) */
.wanted-bounty-row {
    text-align: center;
    font-family: "Cinzel", serif;
    font-size: 1.45rem;
    font-weight: 900;
    color: #170e06;
    letter-spacing: 2px;
    margin-bottom: 10px;
    background: rgba(0,0,0,0.04);
    padding: 4px 0;
    border-radius: 4px;
    border-top: 1px dashed rgba(61,36,19,0.3);
    border-bottom: 1px dashed rgba(61,36,19,0.3);
}

.bounty-symbol {
    font-size: 1.65rem;
    color: #8b1a1a;
    margin-right: 3px;
    font-weight: 900;
}

.bounty-dash {
    margin-left: 3px;
}

/* Details Box */
.wanted-details-box {
    border: 2px double #3d2413;
    border-radius: 5px;
    padding: 10px 10px;
    background: rgba(255, 248, 230, 0.65);
    position: relative;
    margin-bottom: 8px;
}

.corner-anchor {
    position: absolute;
    font-size: 0.6rem;
    color: #3d2413;
}
.corner-anchor.top-left { top: 3px; left: 5px; }
.corner-anchor.top-right { top: 3px; right: 5px; }
.corner-anchor.bottom-left { bottom: 3px; left: 5px; }
.corner-anchor.bottom-right { bottom: 3px; right: 5px; }

.wanted-details-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    text-align: left;
}

.w-detail-item label {
    display: block;
    font-size: 0.58rem;
    font-weight: 800;
    color: #5a381e;
    letter-spacing: 1.2px;
    margin-bottom: 1px;
}

.w-detail-item span {
    font-size: 0.85rem;
    font-weight: 900;
    color: #170e06;
    display: block;
}

.w-detail-item span.cursive-val {
    font-family: "Caveat", cursive;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
}

.w-detail-item small {
    font-size: 0.6rem;
    color: #6b4426;
    display: block;
}

/* Official Red Marine Stamp */
.wanted-marine-stamp {
    position: absolute;
    bottom: 4px;
    right: 8px;
    transform: rotate(-14deg);
    width: 68px;
    height: 68px;
    border: 2px double #9e1b1b;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(158, 27, 27, 0.08);
    color: #9e1b1b;
    pointer-events: none;
}

.stamp-outer-ring {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stamp-inner-ring {
    text-align: center;
}
.wanted-header::before {
    content: "✦\A GRAND LINE\A OFFICIAL SEAL";
    white-space: pre;
    position: absolute;
    top: 5%;
    right: 3%;
    width: clamp(42px, 6vw, 76px);
    height: clamp(42px, 6vw, 76px);
    display: grid;
    place-content: center;
    border: 2px solid rgba(48,23,8,.7);
    border-radius: 50%;
    color: rgba(48,23,8,.82);
    font: 900 clamp(.3rem, .55vw, .48rem)/1.25 Georgia, serif;
    letter-spacing: .06em;
    transform: rotate(-12deg);
}

.stamp-icon {
    font-size: 0.75rem;
    line-height: 1;
}

.stamp-text {
    font-family: "Cinzel", serif;
    font-size: 0.5rem;
    font-weight: 900;
    letter-spacing: 0.5px;
    line-height: 1.1;
    margin-top: 1px;
}

.stamp-sub {
    font-size: 0.42rem;
    letter-spacing: 1px;
}

/* Footer Marine Bar */
.wanted-footer-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 0.62rem;
    font-weight: 900;
    letter-spacing: 2px;
    color: #28160a;
    border-top: 1px solid #3d2413;
    padding-top: 6px;
}

.wanted-quote-line {
    text-align: center;
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 1.2px;
    color: #5a381e;
    margin-top: 3px;
}

/* Email note */
.pass-email-note {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.6);
    margin: 0;
}

/* Actions */
.success-actions {
    display: flex;
    gap: 10px;
    justify-content: center;
}

.pass-close-btn {
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.7);
    padding: 10px 20px;
    border-radius: 4px;
    font-family: "Cinzel", serif;
    font-size: 0.75rem;
    letter-spacing: 2px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.pass-close-btn:hover {
    background: rgba(255, 255, 255, 0.12);
    color: var(--white);
}





/* ──────────────────────────────────────────
   PRINTABLE PDF TEMPLATE (RENDERABLE OFF-SCREEN)
─────────────────────────────────────────── */
#pdfPassContainer {
    position: fixed;
    top: 0;
    left: 0;
    width: 700px;
    z-index: -9999;
    opacity: 1;
    visibility: visible;
    background: #0f0a04;
    color: #f0ece0;
    font-family: "Poppins", sans-serif;
    padding: 36px;
    border: 3px solid #c9902a;
    border-radius: 12px;
    box-sizing: border-box;
    pointer-events: none;
}

/* =========================================================
   PHASE 1 — GENESIS LANDSCAPE POSTER UI
   The poster is intentionally self-contained: no raster paper
   textures are used. Later phases can bind data to the existing IDs.
========================================================= */
.success-overlay {
    background: rgba(8, 7, 5, .94);
    backdrop-filter: blur(18px);
}

.success-modal.wanted-modal {
    width: min(1240px, 96vw);
    max-height: none;
    overflow: visible;
    background: transparent;
    border: 0;
    box-shadow: none;
}
.success-modal.wanted-modal::before { display: none; }
.success-modal.wanted-modal > .modal-close {
    z-index: 5;
    top: -18px;
    right: -10px;
    color: #eed9a6;
    border-color: rgba(238,217,166,.5);
}
.wanted-modal-body { padding: 0; gap: 16px; }

.genesis-poster {
    --ink: #291b12;
    --red: #8f2b22;
    --paper: #d4b47a;
    position: relative;
    isolation: isolate;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    display: grid;
    grid-template-columns: 39% 61%;
    grid-template-rows: 25% 49% 20% 6%;
    padding: 3.2% 4%;
    box-sizing: border-box;
    color: var(--ink);
    background:
        radial-gradient(ellipse at 15% 18%, rgba(84,40,16,.3), transparent 14%),
        radial-gradient(ellipse at 86% 72%, rgba(71,35,17,.22), transparent 18%),
        linear-gradient(120deg, #b48a54, #e5ca91 42%, #c59d65 72%, #8b5b32);
    border: 10px solid #3a2113;
    outline: 2px solid #d4af62;
    outline-offset: -15px;
    box-shadow: 0 22px 70px rgba(0,0,0,.65), inset 0 0 80px rgba(52,25,11,.48);
}
.genesis-poster::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .32;
    mix-blend-mode: multiply;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='4' seed='9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
}
.genesis-poster::after {
    content: "";
    position: absolute;
    inset: 3%;
    z-index: -1;
    border: 1px solid rgba(52,29,15,.65);
    box-shadow: inset 0 0 34px rgba(45,21,9,.42);
    pointer-events: none;
}
.wanted-bg-overlay { display: none; }
.wanted-header {
    grid-column: 1 / -1;
    margin: 0;
    padding: 0 0 1.2%;
    border-bottom: 2px solid rgba(46,28,17,.72);
    display: flex;
    flex-direction: column;
    justify-content: end;
    text-align: center;
}
.wanted-title { font-size: clamp(2rem, 7.4vw, 6.2rem); letter-spacing: .18em; line-height: .8; }
.wanted-dead-or-alive { font-size: clamp(.48rem, 1vw, .8rem); letter-spacing: .38em; margin-top: 1.2%; }
.wanted-portrait-frame {
    grid-column: 1;
    grid-row: 2 / 4;
    width: auto;
    height: auto;
    margin: 5% 8% 0 0;
    padding: 3%;
    border: 7px solid #2b180d;
    border-radius: 2px;
    background: linear-gradient(135deg, #27170d, #55341b);
    box-shadow: inset 0 0 28px #080402, 6px 7px 0 rgba(47,25,12,.3);
}
.wanted-emblem-img { width: 100%; height: 100%; min-height: 0; object-fit: contain; filter: sepia(.4) grayscale(.35) contrast(1.15); }
.wanted-portrait-overlay { display: none; }
.wanted-name-block { grid-column: 2; grid-row: 2; align-self: end; margin: 0 0 3% 4%; text-align: left; }
.wanted-captain-name { font-size: clamp(1.35rem, 3.5vw, 3.35rem); letter-spacing: .08em; line-height: .98; }
.poster-registration { margin-top: 3%; display: flex; align-items: baseline; gap: 1em; color: rgba(41,27,18,.72); font-size: clamp(.4rem, .7vw, .62rem); letter-spacing: .16em; }
.poster-registration strong { color: var(--ink); font-size: 1.15em; letter-spacing: .12em; }
.wanted-bounty-row { grid-column: 2; grid-row: 2; align-self: start; justify-content: flex-start; margin: 5% 0 0 4%; padding: 1% 0; background: transparent; border-top: 1px solid rgba(46,28,17,.5); border-bottom: 1px solid rgba(46,28,17,.5); font-size: clamp(.8rem, 1.7vw, 1.45rem); }
.bounty-symbol, .bounty-dash { display: none; }
.bounty-amount::before { content: "OFFICIAL STATUS / "; font-size: .55em; letter-spacing: .18em; vertical-align: middle; }
.wanted-details-box { grid-column: 2; grid-row: 3; margin: 0 0 0 4%; padding: 2.5% 3%; border: 1px solid rgba(46,28,17,.7); border-radius: 0; background: rgba(255,239,191,.2); }
.wanted-details-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
.w-detail-item label { font-size: clamp(.38rem, .72vw, .62rem); letter-spacing: .12em; }
.w-detail-item span { font-size: clamp(.48rem, 1vw, .85rem); }
.w-detail-item small { font-size: clamp(.38rem, .65vw, .58rem); }
.wanted-marine-stamp { width: clamp(48px, 6vw, 78px); height: clamp(48px, 6vw, 78px); right: 2%; bottom: 8%; }
.stamp-text { font-size: clamp(.35rem, .5vw, .5rem); }
.wanted-footer-bar { grid-column: 1 / -1; grid-row: 4; align-self: end; padding-top: 1%; font-size: clamp(.35rem, .7vw, .62rem); letter-spacing: .16em; }
.wanted-quote-line { display: none; }
.pass-email-note { color: rgba(255,255,255,.72); }
.success-actions { flex-wrap: wrap; }

@media (max-width: 640px) {
    .success-modal.wanted-modal { width: 94vw; }
    .genesis-poster { border-width: 6px; outline-offset: -10px; padding: 5% 6%; grid-template-columns: 37% 63%; }
    .wanted-title { letter-spacing: .1em; }
    .wanted-dead-or-alive { letter-spacing: .16em; }
    .wanted-portrait-frame { border-width: 4px; }
    .wanted-details-grid { grid-template-columns: repeat(2, 1fr); }
    .wanted-marine-stamp { display: none; }
}

/* =========================================================
   FINAL WANTED WARRANT — reference-matched poster surface
========================================================= */
.genesis-poster {
    display: block;
    aspect-ratio: 16 / 9;
    min-height: 0;
    padding: 0;
    overflow: hidden;
    isolation: isolate;
    clip-path: polygon(1% 2.1%, 7% .7%, 14% 1.5%, 22% .6%, 31% 1.1%, 40% .5%, 49% 1.3%, 58% .5%, 68% 1.2%, 77% .6%, 87% 1.4%, 96% 2.1%, 99.1% 7%, 98.4% 16%, 99% 25%, 98.3% 35%, 99.1% 46%, 98.4% 57%, 99% 67%, 98.1% 78%, 99% 89%, 96.2% 98%, 87% 98.5%, 77% 98%, 68% 98.8%, 58% 98%, 49% 98.6%, 39% 98%, 30% 98.8%, 20% 98%, 11% 98.5%, 3% 97%, .8% 89%, 1.7% 79%, .8% 68%, 1.5% 57%, .7% 46%, 1.5% 35%, .8% 24%, 1.4% 13%);
    background: #c18a48;
    box-shadow: 0 26px 80px rgba(0,0,0,.78);
}
.genesis-poster > :not(.wanted-reference-layout) { display: none !important; }
.genesis-poster::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .68;
    mix-blend-mode: multiply;
    background:
        radial-gradient(ellipse at 4% 8%, rgba(54,20,5,.78), transparent 13%),
        radial-gradient(ellipse at 98% 14%, rgba(50,19,5,.74), transparent 15%),
        radial-gradient(ellipse at 8% 92%, rgba(49,18,5,.76), transparent 15%),
        radial-gradient(ellipse at 91% 91%, rgba(49,18,5,.8), transparent 18%),
        radial-gradient(ellipse at 68% 38%, rgba(78,33,8,.2) 0 1%, transparent 10%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.48' numOctaves='5' seed='7'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23paper)' opacity='.85'/%3E%3C/svg%3E");
}
.genesis-poster::after { display: none; }
.warrant-photo-frame { position: relative; overflow: hidden; background: radial-gradient(ellipse at 50% 38%, #8b6035, #543117 62%, #2b1508); }
.warrant-photo { opacity: 0; }
.warrant-photo-frame::before { content: ""; position: absolute; z-index: 1; top: 13%; left: 50%; width: 32%; aspect-ratio: 1; border-radius: 46% 46% 43% 43%; background: #28170c; transform: translateX(-50%); box-shadow: 0 5px 0 #211207; }
.warrant-photo-frame::after { content: ""; position: absolute; z-index: 1; left: 50%; bottom: -7%; width: 78%; height: 57%; background: #28170c; clip-path: polygon(35% 0, 65% 0, 74% 15%, 91% 30%, 100% 100%, 0 100%, 9% 30%, 26% 15%); transform: translateX(-50%); }
.wanted-reference-layout {
    position: absolute;
    inset: 1.8%;
    display: grid;
    grid-template-columns: 55.5% 44.5%;
    grid-template-rows: 26% 62% 12%;
    color: #271207;
    font-family: Georgia, "Times New Roman", serif;
    background:
        radial-gradient(ellipse at 50% 45%, rgba(255,230,165,.44), transparent 48%),
        radial-gradient(circle at 12% 72%, rgba(76,31,7,.22) 0 1%, transparent 12%),
        radial-gradient(circle at 82% 22%, rgba(76,31,7,.22) 0 1.2%, transparent 12%),
        linear-gradient(108deg, #9d612c, #d8a85f 17%, #edce8d 48%, #d1a060 78%, #965925);
    border: 1px solid rgba(46,18,5,.78);
    box-shadow: inset 0 0 45px rgba(61,22,5,.56), inset 0 0 3px rgba(255,228,164,.82);
}
.warrant-fold { position: absolute; pointer-events: none; z-index: 1; }
.warrant-fold-vertical { top: 0; bottom: 0; left: 55.5%; width: 7px; transform: translateX(-50%); background: linear-gradient(90deg, rgba(53,22,6,.35), rgba(255,225,158,.42), rgba(49,19,5,.42)); box-shadow: -2px 0 4px rgba(47,18,5,.18), 2px 0 4px rgba(255,230,166,.17); }
.warrant-fold-horizontal { left: 0; right: 0; top: 1px; height: 5px; background: linear-gradient(#3d1b07, rgba(255,226,159,.45), transparent); opacity: .7; }
.warrant-masthead { grid-column: 1; grid-row: 1; z-index: 2; padding: 5.2% 4% 0; text-align: center; }
.warrant-masthead h1 { margin: 0; color: #1b0c05; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.2rem, 7.1vw, 6.4rem); font-weight: 900; letter-spacing: .12em; line-height: .77; text-shadow: 1px 1px 0 rgba(255,220,143,.32); }
.warrant-masthead p { width: 86%; margin: 5% auto 0; padding-top: 1.5%; border-top: 2px solid rgba(49,18,5,.7); font-size: clamp(.43rem, .9vw, .8rem); font-weight: 900; letter-spacing: .055em; }
.warrant-masthead p span { margin: 0 .55em; }
.warrant-masthead strong { display: block; margin-top: 2%; color: #84251b; font-size: clamp(.53rem, 1.13vw, .96rem); letter-spacing: .2em; }
.warrant-postmark { position: absolute; right: 5.1%; top: 5.1%; z-index: 2; display: grid; place-content: center; width: clamp(56px, 9vw, 112px); aspect-ratio: 1; border: 3px double rgba(45,18,5,.78); border-radius: 50%; box-shadow: inset 0 0 0 4px rgba(96,46,15,.18), 0 0 0 2px rgba(255,219,143,.22); color: rgba(43,17,5,.85); text-align: center; transform: rotate(-13deg); }
.warrant-postmark span { font-size: clamp(.32rem, .55vw, .5rem); font-weight: 900; letter-spacing: .07em; line-height: 1.2; }
.warrant-postmark b { display: block; margin: 2px 0; font-size: clamp(.85rem, 1.7vw, 1.5rem); }
.warrant-left-panel { grid-column: 1; grid-row: 2 / 4; position: relative; z-index: 2; display: grid; grid-template-columns: 31% 46% 23%; grid-template-rows: 67% 33%; align-items: center; }
.warrant-compass { grid-column: 1; grid-row: 1; width: 70%; aspect-ratio: 1; justify-self: center; position: relative; border: 2px solid rgba(58,25,7,.63); border-radius: 50%; background: repeating-conic-gradient(from 0deg, rgba(49,19,4,.62) 0 1deg, transparent 1deg 15deg), radial-gradient(circle, transparent 31%, rgba(57,24,6,.52) 32% 33%, transparent 34%); box-shadow: inset 0 0 0 8px rgba(130,76,31,.1); transform: rotate(-8deg); opacity: .72; }
.warrant-compass::before, .warrant-compass::after { content: ""; position: absolute; top: 50%; left: 50%; background: rgba(51,18,4,.7); transform: translate(-50%,-50%); clip-path: polygon(50% 0, 59% 40%, 100% 50%, 59% 59%, 50% 100%, 41% 59%, 0 50%, 41% 40%); }
.warrant-compass::before { width: 72%; height: 72%; }
.warrant-compass::after { width: 37%; height: 37%; background: #d6a35d; }
.warrant-compass i { position: absolute; font-size: clamp(.42rem, .75vw, .68rem); font-style: normal; font-weight: 900; }
.warrant-compass i:nth-child(1) { top: -20%; left: 50%; transform: translateX(-50%); }.warrant-compass i:nth-child(2) { left: -21%; top: 50%; transform: translateY(-50%); }.warrant-compass i:nth-child(3) { right: -21%; top: 50%; transform: translateY(-50%); }.warrant-compass i:nth-child(4) { bottom: -20%; left: 50%; transform: translateX(-50%); }
.warrant-photo-frame { grid-column: 2; grid-row: 1; width: 87%; aspect-ratio: .96; align-self: end; justify-self: center; padding: 2.3%; background: linear-gradient(140deg, #241006, #855222, #2a1106); border: 2px solid #2a1106; box-shadow: 0 0 0 2px rgba(215,162,86,.43), inset 0 0 15px #0b0402; }
.warrant-photo { width: 100%; height: 100%; display: block; object-fit: cover; filter: sepia(.86) grayscale(.75) contrast(1.2) brightness(.72); background: #37200f; }
.warrant-status { grid-column: 1 / 4; grid-row: 2; align-self: center; text-align: center; }
.warrant-status span, .warrant-status em { display: block; font-size: clamp(.43rem, .78vw, .68rem); font-style: normal; font-weight: 900; letter-spacing: .18em; }
.warrant-status strong { display: block; margin: .4% 0; color: #8d261b; font-size: clamp(1.2rem, 3.5vw, 3.05rem); line-height: .9; letter-spacing: .17em; }
.warrant-status b { display: block; margin: .8% 0 .3%; font-size: clamp(1.3rem, 3.7vw, 3.25rem); line-height: .85; letter-spacing: .14em; }.warrant-status p { margin: 3% 0 0; font-size: clamp(.36rem, .66vw, .59rem); font-weight: 700; letter-spacing: .09em; }
.warrant-details { grid-column: 2; grid-row: 1 / 4; z-index: 2; align-self: center; width: 85%; margin: 8% 6% 0 8%; padding: 7% 0 2%; }
.warrant-detail { min-height: 11.5%; display: grid; grid-template-columns: 53% 47%; align-items: center; border-bottom: 1px solid rgba(49,18,5,.48); column-gap: 0; }
.warrant-detail::before { display: none; }.warrant-detail span { font-size: clamp(.4rem, .76vw, .68rem); font-weight: 900; letter-spacing: .02em; }.warrant-detail b { font-size: clamp(.43rem, .84vw, .75rem); letter-spacing: .025em; overflow-wrap: anywhere; }.warrant-number b { color: #81281d; letter-spacing: .07em; }
.warrant-wax-seal { position: absolute; z-index: 4; right: 5%; bottom: 4.5%; display: grid; place-content: center; width: clamp(50px, 8vw, 100px); aspect-ratio: 1; border: 5px solid #6e170f; border-radius: 50%; background: radial-gradient(circle at 36% 28%, #c7593a, #8a2018 54%, #4c100b 100%); box-shadow: 0 7px 10px rgba(39,13,4,.48), inset 0 0 0 3px #b83c29, inset 0 0 0 6px #66130d; color: rgba(40,9,5,.82); text-align: center; transform: rotate(-13deg); }.warrant-wax-seal span { font-size: clamp(.85rem, 1.6vw, 1.45rem); }.warrant-wax-seal b { font-size: clamp(.3rem, .55vw, .48rem); line-height: 1.05; letter-spacing: .08em; }.warrant-wax-seal small { font-size: clamp(.25rem, .43vw, .36rem); letter-spacing: .11em; }
@media (max-width: 640px) { .warrant-masthead { padding-top: 7%; }.warrant-postmark { display: none; }.warrant-details { width: 88%; margin-left: 6%; }.warrant-detail { grid-template-columns: 50% 50%; }.warrant-detail::before { display: none; }.warrant-compass { display: none; }.warrant-left-panel { grid-template-columns: 1fr; }.warrant-photo-frame { grid-column: 1; width: 55%; }.warrant-status { grid-column: 1; }.warrant-wax-seal { right: 3%; bottom: 3%; } }

/* =========================================================
   PHASE 3 — CEREMONIAL POSTER REVEAL
========================================================= */
@keyframes genesisBackdropIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes genesisPosterUnfold {
    0% { opacity: 0; transform: perspective(1200px) rotateX(-8deg) scaleY(.08) translateY(-14px); filter: brightness(.55) blur(3px); }
    48% { opacity: 1; transform: perspective(1200px) rotateX(2deg) scaleY(1.02) translateY(0); filter: brightness(.86) blur(0); }
    72% { transform: perspective(1200px) rotateX(0) scaleY(.99); }
    100% { opacity: 1; transform: perspective(1200px) rotateX(0) scaleY(1); filter: brightness(1) blur(0); }
}
@keyframes genesisInkReveal {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes genesisStampDrop {
    0% { opacity: 0; transform: translateY(-34px) rotate(-30deg) scale(1.28); }
    65% { opacity: 1; transform: translateY(4px) rotate(-12deg) scale(.96); }
    100% { opacity: 1; transform: translateY(0) rotate(-14deg) scale(1); }
}
@keyframes genesisActionsIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes genesisDust {
    0%, 100% { background-position: 0 0, 30px 14px, 80px 45px; opacity: .16; }
    50% { background-position: 14px -22px, 2px 28px, 58px 18px; opacity: .3; }
}

.success-overlay.active {
    animation: genesisBackdropIn .65s ease both;
}
.success-overlay.active::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .2;
    background-image: radial-gradient(circle at 20% 30%, #e8d2a3 0 1px, transparent 1.5px), radial-gradient(circle at 70% 65%, #e8d2a3 0 1px, transparent 1.5px), radial-gradient(circle at 42% 78%, #e8d2a3 0 1px, transparent 1.5px);
    background-size: 120px 100px, 180px 160px, 240px 190px;
    animation: genesisDust 8s ease-in-out infinite;
}
.success-overlay.active .genesis-poster {
    animation: genesisPosterUnfold 1.45s cubic-bezier(.2,.7,.2,1) both;
}
.success-overlay.active .wanted-header,
.success-overlay.active .wanted-portrait-frame,
.success-overlay.active .wanted-name-block,
.success-overlay.active .wanted-bounty-row,
.success-overlay.active .wanted-details-box,
.success-overlay.active .wanted-footer-bar {
    opacity: 0;
    animation: genesisInkReveal .62s ease both;
}
.success-overlay.active .wanted-header { animation-delay: .48s; }
.success-overlay.active .wanted-portrait-frame { animation-delay: .72s; }
.success-overlay.active .wanted-name-block { animation-delay: .92s; }
.success-overlay.active .wanted-bounty-row { animation-delay: 1.06s; }
.success-overlay.active .wanted-details-box { animation-delay: 1.18s; }
.success-overlay.active .wanted-footer-bar { animation-delay: 1.34s; }
.success-overlay.active .wanted-marine-stamp {
    animation: genesisStampDrop .56s cubic-bezier(.2,.75,.25,1.2) 1.38s both;
}
.success-overlay.active .success-actions,
.success-overlay.active .pass-email-note {
    opacity: 0;
    animation: genesisActionsIn .5s ease 1.68s both;
}
.success-overlay.active .pass-email-note { animation-delay: 1.58s; }

@media (prefers-reduced-motion: reduce) {
    .success-overlay.active,
    .success-overlay.active::before,
    .success-overlay.active .genesis-poster,
    .success-overlay.active .wanted-header,
    .success-overlay.active .wanted-portrait-frame,
    .success-overlay.active .wanted-name-block,
    .success-overlay.active .wanted-bounty-row,
    .success-overlay.active .wanted-details-box,
    .success-overlay.active .wanted-footer-bar,
    .success-overlay.active .wanted-marine-stamp,
    .success-overlay.active .success-actions,
    .success-overlay.active .pass-email-note { animation: none; opacity: 1; transform: none; filter: none; }
}

.pdf-ticket-header {
    text-align: center;
    border-bottom: 2px solid #c9902a;
    padding-bottom: 20px;
    margin-bottom: 24px;
}

.pdf-ticket-header h1 {
    font-family: "Cinzel", serif;
    font-size: 2.2rem;
    color: #f4d66d;
    letter-spacing: 4px;
    margin-bottom: 4px;
}

.pdf-ticket-header p {
    font-size: 0.9rem;
    color: #c9902a;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.pdf-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 24px;
}

.pdf-box {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(201, 144, 42, 0.3);
    border-radius: 8px;
    padding: 16px;
}

.pdf-box label {
    font-family: "Cinzel", serif;
    font-size: 0.75rem;
    color: #c9902a;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    display: block;
    margin-bottom: 4px;
}

.pdf-box span {
    font-size: 1.05rem;
    font-weight: 600;
    color: #ffffff;
}

.pdf-stamp {
    text-align: center;
    border: 2px dashed #8b2020;
    border-radius: 8px;
    padding: 16px;
    background: rgba(139, 32, 32, 0.1);
    color: #ff8a8a;
    font-family: "Cinzel", serif;
    font-size: 1.1rem;
    letter-spacing: 3px;
    font-weight: 700;
}

/* =========================================================
   REFERENCE-LED WANTED WARRANT COMPOSITION
========================================================= */
.genesis-poster {
    grid-template-columns: 54% 46%;
    grid-template-rows: 28% 58% 14%;
    padding: 3.4% 4.2%;
    border: 0;
    outline: 0;
    border-radius: 0;
    clip-path: polygon(1.3% 2%, 8% 1%, 17% 1.8%, 28% .8%, 40% 1.6%, 53% .9%, 66% 1.5%, 79% .8%, 91% 1.8%, 98.7% 3%, 99.2% 18%, 98.5% 34%, 99.2% 51%, 98.4% 70%, 99% 88%, 96% 98%, 84% 98.7%, 69% 98%, 55% 99%, 41% 98.2%, 28% 99%, 14% 98%, 3% 96%, 1% 82%, 1.5% 65%, .8% 47%, 1.4% 29%);
    background:
        linear-gradient(90deg, transparent 53.75%, rgba(53,27,10,.6) 53.9%, rgba(255,230,165,.35) 54.05%, transparent 54.25%),
        radial-gradient(ellipse at 8% 12%, rgba(61,26,9,.42), transparent 12%),
        radial-gradient(ellipse at 92% 86%, rgba(66,28,9,.45), transparent 15%),
        radial-gradient(ellipse at 46% 54%, rgba(255,233,166,.3), transparent 32%),
        linear-gradient(112deg, #a76d31 0%, #d7aa65 17%, #edce91 44%, #d9ae6a 72%, #9c602b 100%);
    box-shadow: 0 24px 80px rgba(0,0,0,.8), inset 0 0 100px rgba(55,24,7,.55);
}
.genesis-poster::before {
    opacity: .28;
    mix-blend-mode: multiply;
    background-image:
        radial-gradient(ellipse at 14% 78%, rgba(38,17,6,.6) 0 1%, transparent 8%),
        radial-gradient(ellipse at 75% 18%, rgba(38,17,6,.45) 0 1%, transparent 7%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.68' numOctaves='4' seed='31'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.68'/%3E%3C/svg%3E");
}
.genesis-poster::after {
    inset: 2.4%;
    border: 1px solid rgba(54,28,10,.65);
    box-shadow: inset 0 0 42px rgba(47,20,6,.48), 0 0 0 1px rgba(242,204,132,.22);
}
.wanted-header {
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    justify-content: start;
    padding: 0 2% 2% 0;
    border-bottom: 0;
    text-align: center;
}
.wanted-title {
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.5rem, 8vw, 7rem);
    font-weight: 900;
    letter-spacing: .08em;
    line-height: .82;
    color: #1e1008;
    text-shadow: 2px 2px 0 rgba(236,202,137,.35), 0 0 8px rgba(49,22,7,.18);
}
.wanted-dead-or-alive {
    margin-top: 2.2%;
    padding-top: 2%;
    border-top: 2px solid rgba(51,26,10,.62);
    font-size: 0;
    letter-spacing: .15em;
}
.wanted-dead-or-alive::before {
    content: "WORLD GOVERNMENT  •  GRAND LINE AUTHORITY";
    font-size: clamp(.45rem, .95vw, .78rem);
    font-weight: 900;
}
.wanted-header::after {
    content: "BY ORDER OF THE GRAND LINE";
    display: block;
    margin-top: 1.6%;
    color: #812419;
    font: 900 clamp(.55rem, 1.15vw, .95rem) Georgia, serif;
    letter-spacing: .16em;
}
.wanted-portrait-frame {
    grid-column: 1;
    grid-row: 2;
    justify-self: center;
    align-self: center;
    width: 46%;
    height: 82%;
    margin: 0 4% 0 0;
    padding: 1.5%;
    border: 5px solid #2d1709;
    border-radius: 0;
    background: linear-gradient(135deg, #6f4521, #29160a 52%, #8d5927);
    box-shadow: inset 0 0 26px #100702, 0 4px 0 rgba(48,22,7,.42);
}
.wanted-portrait-frame::before {
    content: "✦  N  ✦\A W     E\A ✦  S  ✦";
    white-space: pre;
    position: absolute;
    left: -72%;
    top: 20%;
    width: 58%;
    color: rgba(52,25,8,.78);
    font: 900 clamp(.55rem, 1.1vw, .9rem)/1.55 Georgia, serif;
    text-align: center;
    transform: rotate(-8deg);
    opacity: .75;
}
.wanted-emblem-img { width: 100%; height: 100%; filter: sepia(.8) grayscale(.8) contrast(1.25) brightness(.68); }
.wanted-name-block {
    grid-column: 1;
    grid-row: 3;
    align-self: end;
    margin: 0 4% 1% 0;
    text-align: center;
}
.wanted-captain-name { font-size: 0; margin: 0; }
.wanted-captain-name::before {
    content: "GENESIS";
    display: block;
    color: #1f1008;
    font: 900 clamp(1.4rem, 4.2vw, 3.8rem)/.85 Georgia, serif;
    letter-spacing: .12em;
}
.wanted-captain-name::after {
    content: "THE GRAND VOYAGE";
    display: block;
    margin-top: 2%;
    color: #2b160a;
    font: 900 clamp(.5rem, 1.1vw, .88rem) Georgia, serif;
    letter-spacing: .23em;
}
.wanted-name-block::before {
    content: "CREW STATUS";
    display: block;
    color: #2f1709;
    font: 700 clamp(.45rem, .9vw, .72rem) Georgia, serif;
    letter-spacing: .18em;
}
.wanted-name-block::after {
    content: "ACCEPTED";
    display: block;
    color: #8e251b;
    font: 900 clamp(1.2rem, 3.5vw, 3.1rem) Georgia, serif;
    letter-spacing: .16em;
    line-height: .95;
}
.poster-registration { display: none; }
.wanted-bounty-row { display: none; }
.wanted-details-box {
    grid-column: 2;
    grid-row: 1 / 4;
    align-self: stretch;
    margin: 1.5% 0 1% 5%;
    padding: 10% 3% 7% 7%;
    border: 0;
    border-left: 1px solid rgba(50,24,8,.5);
    border-radius: 0;
    background: transparent;
}
.wanted-details-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    height: 100%;
    align-content: center;
}
.w-detail-item {
    min-height: 12%;
    display: grid;
    grid-template-columns: minmax(92px, 43%) 1fr;
    align-content: center;
    gap: 3%;
    border-bottom: 1px solid rgba(62,31,11,.45);
}
.w-detail-item label {
    margin: 0;
    font: 900 clamp(.38rem, .7vw, .62rem) Georgia, serif;
    letter-spacing: .06em;
    color: #2d1609;
}
.w-detail-item span {
    font: 900 clamp(.48rem, .9vw, .78rem) Georgia, serif;
    letter-spacing: .04em;
    color: #241107;
    overflow-wrap: anywhere;
}
.w-detail-item small { display: none; }
.wanted-marine-stamp {
    width: clamp(52px, 8vw, 96px);
    height: clamp(52px, 8vw, 96px);
    right: 1%;
    bottom: 1%;
    border: 4px double #8d1d16;
    background: rgba(125,28,18,.16);
    box-shadow: 0 3px 5px rgba(55,18,5,.35), inset 0 0 9px rgba(55,18,5,.3);
}
.wanted-footer-bar { display: none; }
.wanted-quote-line { display: block; position: absolute; left: 20%; bottom: 2.5%; width: 30%; margin: 0; font: 700 clamp(.4rem, .75vw, .65rem) Georgia, serif; letter-spacing: .1em; color: #3a1c0b; }

@media (max-width: 640px) {
    .genesis-poster { grid-template-columns: 48% 52%; padding: 5% 5%; }
    .wanted-details-box { padding-left: 5%; margin-left: 2%; }
    .w-detail-item { grid-template-columns: 1fr; gap: 0; padding: 2% 0; }
    .wanted-portrait-frame::before { display: none; }
    .wanted-marine-stamp { display: flex; }
    .wanted-quote-line { display: none; }
}

/* Keep the purpose-built reference layout above the legacy poster rules. */
.genesis-poster {
    display: block;
    padding: 0;
    min-height: 0;
    overflow: hidden;
    isolation: isolate;
    background: #c18a48;
    box-shadow: 0 26px 80px rgba(0,0,0,.78);
}
.genesis-poster > :not(.wanted-reference-layout) { display: none !important; }
.genesis-poster::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .68;
    mix-blend-mode: multiply;
    background:
        radial-gradient(ellipse at 4% 8%, rgba(54,20,5,.78), transparent 13%),
        radial-gradient(ellipse at 98% 14%, rgba(50,19,5,.74), transparent 15%),
        radial-gradient(ellipse at 8% 92%, rgba(49,18,5,.76), transparent 15%),
        radial-gradient(ellipse at 91% 91%, rgba(49,18,5,.8), transparent 18%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.48' numOctaves='5' seed='7'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23paper)' opacity='.85'/%3E%3C/svg%3E");
}
.genesis-poster::after { display: none; }