.pass-progress { margin: 36px auto 0; padding: clamp(24px,4vw,44px); border: 1px solid #bd95554f; border-radius: 24px; background: radial-gradient(ellipse at 0 0,#d6ab711a,transparent 65%),#061c1b; color: #edcf9e; text-align: left; }
.pass-progress__eyebrow { display:block;margin:0 0 14px;color:#c6a169;font-size:10px;line-height:1.8;letter-spacing:.18em; }
.pass-progress h2 { margin:0;font:500 clamp(32px,4vw,46px)/1.15 "Cormorant Garamond",Georgia,serif; }
.pass-progress__status { color:#c9baa0;font-size:13px;line-height:1.9;margin:14px 0 24px; }
.pass-progress__list { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none;padding:0;margin:0; }
.pass-progress__meter { height:5px;overflow:hidden;background:#d6b7811c;border-radius:8px;margin:12px 0 6px; }
.pass-progress__meter span { display:block;height:100%;background:linear-gradient(90deg,#be631f,#e2ae65);border-radius:inherit;transition:width .35s ease; }
.pass-progress__overview { display:flex;align-items:center;justify-content:flex-end;gap:16px;font-size:13px;line-height:1.7;color:#cbbda3; }
.pass-progress__overview strong { color:#e9b575;font:600 20px/1.4 "Montserrat",sans-serif; }
.pass-progress__total { height:8px;margin:12px 0 24px; }
.pass-progress__row { min-width:0;display:flex;flex-direction:column;gap:8px;padding:16px;border:1px solid #c29a5a26;border-radius:12px;background:#c29a5a06; }
.pass-progress__row.is-current { border-color:#c29a5a80;background:#c29a5a10; }
.pass-progress__chapter-title { color:#e0c89f;font-size:13px;line-height:1.7;overflow-wrap:anywhere; }
.pass-progress__chapter-state { color:#a89e87;font-size:11px;line-height:1.7; }
.pass-progress__row.is-ready .pass-progress__chapter-state { color:#b9c39e; }
.pass-progress__row.is-current .pass-progress__chapter-state { color:#e7b574; }
.pass-progress__actions { display:flex;flex-wrap:wrap;gap:12px;margin-top:24px; }
.pass-progress__actions button { min-height:48px;padding:12px 20px;border-radius:10px;font:500 12px/1.6 "Be Vietnam Pro",sans-serif;cursor:pointer; }
.pass-progress__resume { background:linear-gradient(115deg,#df8b39,#b65c20);border:1px solid #f2b574;color:#151e19; }
.pass-progress__resume span { padding-left:12px; }
.pass-progress__register { background:transparent;border:1px solid #ad8955;color:#edcf9e; }
.pass-progress__issued { margin-top:26px;padding:30px 24px;border:1px solid #c59850;border-radius:18px;background:linear-gradient(140deg,#25392b,#071b19);text-align:center; }
.pass-progress__issued p { font-size:12px;line-height:1.9; }
.pass-progress__issued small { display:block;color:#b9ac95;font-size:10px;line-height:1.9; }
.account-canvas:has(.pass-progress) { min-height:0;border:0;background:none;box-shadow:none; }
.account-canvas .pass-progress { margin-top:0; }
@media(max-width:700px) { .pass-progress__list { grid-template-columns:1fr;gap:8px; }.pass-progress__row { padding:12px 14px;gap:4px; }.pass-progress__actions { flex-direction:column; }.pass-progress__actions button { width:100%; }.pass-progress { padding:24px 22px; } }


.pass-progress__login { display:inline-block;margin-top:18px;min-height:44px;padding:12px 0;color:#e3b879;font-size:12px;line-height:1.8; }

@media(prefers-reduced-motion:reduce) { .pass-progress__meter span { transition:none; } }

/* A personal, reusable digital pass. The QR keeps its white quiet zone. */
.pass-ticket { --pass-qr:144px; display:grid;grid-template-columns:minmax(0,1fr) calc(var(--pass-qr) + 40px);position:relative;width:min(100%,650px);margin:24px auto;overflow:hidden;border:1px solid #caab70;border-radius:20px;background:radial-gradient(ellipse at 0 0,#b8914a33,transparent 58%),linear-gradient(125deg,#143830,#061d1c);box-shadow:inset 0 1px #fff0c43b,0 16px 40px #0003;text-align:left;color:#f1d5a8; }
.pass-ticket::after { content:"";position:absolute;inset:6px;border:1px solid #d4b57421;border-radius:14px;pointer-events:none; }
.pass-ticket__body { position:relative;min-width:0;padding:28px; }
.pass-ticket__body::after { content:"";position:absolute;inset:0;opacity:.16;pointer-events:none;background:repeating-linear-gradient(135deg,transparent 0 14px,#d8b57618 15px 16px); }
.pass-ticket .pass-ticket__brand { display:block;width:100px;max-width:70%;height:auto;margin:0 0 27px;background:none;border:0;border-radius:0; }
.pass-ticket__eyebrow { position:relative;z-index:1;display:block;margin-bottom:13px;color:#c4aa7a;font:500 8px/1.7 "Be Vietnam Pro",sans-serif;letter-spacing:.22em; }
.pass-ticket .pass-ticket__title { display:block;margin:0 0 18px;color:#f5dcad;font:500 43px/.94 "Cormorant Garamond",Georgia,serif;letter-spacing:.06em;overflow-wrap:normal; }
.pass-ticket__holder { display:block;margin-bottom:9px;color:#e4d3b4;font:400 12px/1.6 "Be Vietnam Pro",sans-serif;overflow-wrap:anywhere; }
.pass-ticket__code { display:block;color:#efbe77;font:600 15px/1.7 "Montserrat",sans-serif;letter-spacing:.06em;white-space:nowrap; }
.pass-ticket__date { display:block;margin-top:9px;color:#a99e83;font:400 8px/1.6 "Be Vietnam Pro",sans-serif;letter-spacing:.1em; }
.pass-ticket__stub { display:flex;position:relative;flex-direction:column;justify-content:center;align-items:center;gap:20px;padding:26px 20px;border-left:1px dashed #bb9e686e;background:#041b1780; }
.pass-ticket__stub::before,.pass-ticket__stub::after { content:"";position:absolute;left:-9px;width:18px;height:18px;background:#061c1b;border:1px solid #caab70;border-radius:50%; }
.pass-ticket__stub::before { top:-10px; }.pass-ticket__stub::after { bottom:-10px; }
.pass-ticket__seal { display:grid;place-items:center;width:40px;height:40px;border:1px solid #d1ae6b8c;border-radius:50%;color:#dab578;font:italic 500 26px/1 "Cormorant Garamond",Georgia,serif;box-shadow:0 0 0 4px #caa4690d; }
.pass-ticket [data-ticket-qr] { display:block;width:var(--pass-qr);max-width:100%;height:auto;margin:0;padding:8px;background:#fff;border:0;border-radius:7px;box-sizing:border-box; }
.pass-ticket__stub > span:last-child { text-align:center;color:#bfa77c;font:400 7px/1.7 "Be Vietnam Pro",sans-serif;letter-spacing:.16em; }
.pass-progress__issued:has(.pass-ticket) { padding:0;border:0;background:none; }
.pass-completed { display:grid;grid-template-columns:42px minmax(0,1fr);gap:16px;width:min(100%,520px);margin:18px auto 0;padding:24px;border:1px solid #c8a667;border-radius:22px;background:radial-gradient(ellipse at 0 0,#d6ab712b,transparent 70%),#08231f;color:#eace9d; }
.pass-completed__mark { display:grid;place-items:center;width:38px;height:38px;border:1px solid #c8a667;border-radius:50%;color:#ecc985; }
.pass-completed h2 { margin:0;font:500 23px/1.2 "Cormorant Garamond",Georgia,serif; }
.pass-completed p { margin:10px 0 0;font-size:11px;line-height:1.9;color:#c3b79d; }
.pass-completed button { grid-column:1/-1;display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:52px;padding:14px 20px;background:linear-gradient(115deg,#df8b39,#b65c20);border:1px solid #f2b574;border-radius:10px;color:#161e18;font:600 12px/1.5 "Be Vietnam Pro",sans-serif;cursor:pointer; }
.journey-complete__mark { display:grid;place-items:center;width:56px;height:56px;margin:0 auto 22px;border:1px solid #c8a667;border-radius:50%;background:#d6ab710b;color:#e9c485;box-shadow:0 0 0 7px #d6ab7106; }
.journey-complete__mark svg { width:30px;height:30px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round; }
.journey-welcome.is-complete .journey-welcome__title { font-size:clamp(27px,3vw,34px);margin-bottom:18px; }
.journey-welcome.is-complete .journey-welcome__art { display:none; }
#journey-complete .journey-welcome__subtitle { line-height:1.85; }
#journey-complete .journey-welcome__helper { margin:18px auto 22px;font-size:12px;color:#cdbd9b; }
.journey-complete__account { display:inline-flex;align-items:center;justify-content:center;min-height:48px;margin:0 auto;color:#ebc389;font-size:12px;text-decoration:none;border-bottom:1px solid #ac8d55; }
#journey-pending-login { margin:12px auto 20px; }
@media(max-width:580px) {
 .pass-ticket { --pass-qr:100px;grid-template-columns:minmax(0,1fr) 120px;border-radius:16px; }
 .pass-ticket__body { padding:22px 16px; }.pass-ticket .pass-ticket__brand { width:78px;margin-bottom:22px; }
 .pass-ticket__eyebrow { font-size:6px;letter-spacing:.15em; }.pass-ticket .pass-ticket__title { font-size:32px;margin-bottom:14px; }
 .pass-ticket__holder { font-size:10px; }.pass-ticket__code { font-size:11px;letter-spacing:.025em; }.pass-ticket__date { font-size:8px; }
 .pass-ticket__stub { padding:20px 10px;gap:18px; }.pass-ticket__seal { width:32px;height:32px;font-size:22px; }.pass-ticket__stub > span:last-child { font-size:6px;letter-spacing:.08em; }
 .journey-welcome.is-complete .journey-welcome__card { padding-inline:20px; }.journey-welcome.is-complete .journey-welcome__close { right:2px; }
 .pass-completed { padding:22px 18px;gap:12px; }.pass-completed h2 { font-size:22px; }
}
/* Keep the issued-pass announcement comfortable on a laptop and a phone. */
.journey-welcome.is-pass-issued .journey-welcome__card { padding-top:22px;padding-bottom:22px; }
.journey-welcome.is-pass-issued .journey-welcome__top { margin-bottom:14px; }
.journey-welcome.is-pass-issued .journey-welcome__close { top:8px; }
.journey-welcome.is-pass-issued .journey-complete__mark { display:none; }
.journey-welcome.is-pass-issued .journey-welcome__title { font-size:30px;margin-bottom:12px; }
.journey-welcome.is-pass-issued .pass-ticket { --pass-qr:124px;margin:18px auto; }
.journey-welcome.is-pass-issued .pass-ticket__body { padding:22px; }
.journey-welcome.is-pass-issued .pass-ticket__brand { width:82px;margin-bottom:18px; }
.journey-welcome.is-pass-issued .pass-ticket__eyebrow { margin-bottom:10px; }
.journey-welcome.is-pass-issued .pass-ticket__title { font-size:38px;margin-bottom:14px; }
.journey-welcome.is-pass-issued .pass-ticket__holder { margin-bottom:6px; }
.journey-welcome.is-pass-issued .pass-ticket__date { margin-top:6px; }
.journey-welcome.is-pass-issued .pass-ticket__stub { padding:22px 20px;gap:16px; }
#journey-complete .journey-complete__account { min-height:42px;font-size:11px; }
.journey-welcome.is-pass-issued #journey-complete-helper { margin:14px auto 12px;font-size:11px;line-height:1.7; }
@media(max-width:580px) {
 .journey-welcome.is-pass-issued .journey-welcome__close { top:0; }
 .journey-welcome.is-pass-issued .journey-welcome__title { font-size:25px; }
 .journey-welcome.is-pass-issued .pass-ticket { --pass-qr:100px; }
 .journey-welcome.is-pass-issued .pass-ticket__body { padding:20px 15px; }
 .journey-welcome.is-pass-issued .pass-ticket__title { font-size:32px; }
 .journey-welcome.is-pass-issued .pass-ticket__stub { padding:20px 10px; }
}
@media(max-width:359px) {
 .pass-ticket,.journey-welcome.is-pass-issued .pass-ticket { --pass-qr:88px;grid-template-columns:minmax(0,1fr) 108px; }
 .pass-ticket__body,.journey-welcome.is-pass-issued .pass-ticket__body { padding:18px 12px; }
 .pass-ticket .pass-ticket__brand,.journey-welcome.is-pass-issued .pass-ticket__brand { width:66px;margin-bottom:18px; }
 .pass-ticket .pass-ticket__title,.journey-welcome.is-pass-issued .pass-ticket__title { font-size:27px; }
 .pass-ticket__eyebrow { font-size:6px;letter-spacing:.08em; }
 .pass-ticket__code { font-size:9px;letter-spacing:.01em; }.pass-ticket__holder { font-size:9px; }.pass-ticket__date { font-size:7px;letter-spacing:0; }
 .pass-ticket__stub,.journey-welcome.is-pass-issued .pass-ticket__stub { padding:18px 10px; }
}

/* Resending reuses the private ticket and never obscures the listening journey. */
.pass-resend { margin:24px auto 14px;max-width:520px;padding-top:22px;border-top:1px solid #c9a26740; }
.pass-resend__button { display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:50px;max-width:100%;padding:14px 22px;border:1px solid #e3ad68;border-radius:12px;background:linear-gradient(115deg,#df8b39,#b65c20);color:#10221b;font:600 11px/1.8 "Be Vietnam Pro",sans-serif;letter-spacing:.02em;cursor:pointer;transition:filter .2s,box-shadow .2s; }
.pass-resend__button:hover:enabled { filter:brightness(1.1);box-shadow:0 5px 20px #d68a3826; }
.pass-resend__button:focus-visible { outline:2px solid #f7d49a;outline-offset:4px; }
.pass-resend__button:disabled { background:#c9a26712;border-color:#b99a6459;color:#c5b28f;cursor:default; }
.pass-resend .pass-resend__hint { margin:12px 0 0;font-size:10px;line-height:1.9;color:#bfb096; }
.pass-resend .pass-resend__feedback { margin:10px 0 0;font-size:12px;line-height:1.9;color:#f0d5ab; }
.pass-resend__feedback:empty { display:none; }
@media(max-width:580px) { .pass-resend__button { width:100%;padding-inline:12px;font-size:10px;gap:10px; }.pass-resend { padding-top:20px; } }

.pass-resend .pass-resend__rules { margin-top:12px;color:#c9b795;font-size:10px;line-height:1.9; }

/* More comfortable reading on desktop; preserve the existing mobile typography. */
@media (min-width: 861px) {
 .pass-progress__status { font-size:15px; }
 .pass-progress__actions button { font-size:14px; }
}

/* Let the half-circle cutouts cover only the crossing border strokes. */
.pass-ticket { overflow:visible; }
.pass-ticket__body { border-radius:inherit; }
.pass-ticket__body::after { border-radius:inherit; }
.pass-ticket__stub { border-top-right-radius:inherit;border-bottom-right-radius:inherit; }
.pass-ticket__stub::before,.pass-ticket__stub::after { z-index:2;box-sizing:border-box;left:-10px;width:20px;height:20px;pointer-events:none; }
.pass-ticket__stub::before { top:-11px;clip-path:inset(10px 0 0); }
.pass-ticket__stub::after { bottom:-11px;clip-path:inset(0 0 10px); }

@media(min-width:861px){.pass-progress__chapter-title{font-size:15px}.pass-progress__chapter-state{font-size:12px}.pass-progress__overview{font-size:14px}}
.pass-progress__actions button:focus-visible{outline:2px solid #efc88f;outline-offset:4px}