/* Shared image atlas: native image decoding, one resource for all destinations. */
.destination-art{display:block;position:relative;overflow:hidden;isolation:isolate;aspect-ratio:9/8;background:#eee3c8}
.destination-art>img.passport-scene{position:absolute;inset:auto;left:var(--destination-x);top:var(--destination-y);width:400%;height:300%;max-width:none;object-fit:fill;object-position:initial;z-index:0;pointer-events:none;user-select:none}
.passport-art>.passport-destination{position:absolute;inset:auto;left:0;top:50%;width:100%;height:auto;aspect-ratio:9/8;transform:translateY(-50%);z-index:-2}
.arena-selector .venue-art>.destination-art{position:absolute;inset:auto;left:-12.5%;top:50%;width:125%;height:auto;aspect-ratio:9/8;transform:translateY(-50%)}

dialog.journey-modal{--journey-navy:#0c2c63;--journey-blue:#0458f8;--journey-mint:#36dbbb;color-scheme:light;color:var(--journey-navy);width:min(calc(100% - 12px),540px);padding:12px 14px 14px;max-height:calc(100dvh - 16px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));border:1px solid #fff8e8;border-radius:22px;background:#fff8ed url('/assets/arena-postcard-background-v3.3.1.png') top center/100% auto no-repeat;box-shadow:0 18px 60px #061c4055;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b3cec2 transparent;scroll-padding-top:12px}
.journey-modal [hidden]{display:none!important}
dialog.journey-modal .dialog-close{position:sticky;top:0;float:right;margin:0 0 0 6px;right:auto;width:38px;height:38px;min-width:38px;min-height:38px;display:grid;place-items:center;border:1px solid #e5ded0;background:#fffef9;color:#14346b;border-radius:12px;box-shadow:0 2px 6px #604c1c24;z-index:5;font:800 22px/1 system-ui}
.journey-brand{height:39px;display:flex;align-items:center;margin:0 44px 0 0}
.journey-brand .postcard-logo{height:40px;width:126px;display:block;mix-blend-mode:multiply;overflow:hidden}
.journey-header{clear:both;padding:4px 0 0;text-align:left}
.journey-header .eyebrow{display:inline-block;border-radius:12px;padding:2px 9px;background:#91f3d6;color:#102f55;font:850 9px/1.4 system-ui;letter-spacing:1px;transform:rotate(-2deg)}
dialog.journey-modal .journey-header h2{width:max-content;max-width:100%;padding:0 2px;margin:5px 0 7px;font:900 italic clamp(25px,7.5vw,38px)/1.12 'Trebuchet MS',ui-rounded,system-ui;letter-spacing:-1.1px;color:#082760;transform:rotate(-1deg);text-shadow:1px 1px #ffffffb3}
.journey-header h2:after{content:'';display:block;height:3px;width:35%;margin:3px 0 0 auto;border-radius:50%;background:linear-gradient(90deg,#2dddb4 55%,#ff78b7 55%);transform:rotate(-3deg)}
dialog.journey-modal .journey-header #journey-title{width:100%;max-width:440px;margin:2px 0 4px;padding:0;line-height:0;transform:none}
.journey-header #journey-title:after{display:none}
.journey-title-art{display:block;overflow:hidden;width:100%;height:auto;mix-blend-mode:multiply}
.journey-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:5px 0 8px}
.journey-stats>span{min-width:0;text-align:center;padding:4px 3px;border:1px solid #ded7c9;border-radius:10px;background:#fffef9ed;box-shadow:0 2px 4px #6a4c1a12;font-size:9px;color:#16366a;white-space:nowrap}
.journey-stats b{font-size:10px;margin-right:2px}
.journey-modal .passport-progress{height:5px;background:#d9ddd9;margin:0 0 5px;box-shadow:inset 0 1px 2px #766a3326}
.journey-modal .passport-progress i{background:linear-gradient(90deg,#6ef4d7,#20cda9);border-radius:5px}
.journey-header p.journey-subtitle{color:#335276;font-size:10px;margin:0 0 4px}
.journey-modal .journey-focus{background:none;border:0;padding:0;margin:0;overflow:visible;border-radius:0}
.journey-track{display:flex;align-items:start;gap:12px;margin:0 -14px;padding:16px 0 18px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:16%;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x pan-y;isolation:isolate;contain:paint}
.journey-track::-webkit-scrollbar{display:none}
.journey-track:before,.journey-track:after{content:'';flex:0 0 calc(16% - 12px)}
.journey-track .venue-card{position:relative;flex:0 0 68%;min-width:0;aspect-ratio:.84;padding:0;background:none;border:0;border-radius:16px;box-shadow:none;transform:none;transition:none;scroll-snap-align:center;scroll-snap-stop:normal;overflow:visible}
.journey-track .postcard-visual{position:absolute;inset:0;transform-origin:50% 60%;transition:none}
dialog.journey-modal button.journey-card-open{display:flex;flex-direction:column;position:absolute;inset:0;padding:5px;min-height:0;width:100%;height:100%;overflow:hidden;border:2px solid #fdf8e8;border-radius:15px;background:#fff9eb;box-shadow:0 5px 9px #69553633;color:#102d60;text-align:center;line-height:1.25;cursor:pointer}
.journey-postcard.selected button.journey-card-open{border-color:#54dcbc;box-shadow:0 0 0 2px #c5f4d4,0 5px 9px #69553633}
.journey-card-art{flex:0 0 auto;width:100%;aspect-ratio:9/8;min-height:0;position:relative;isolation:isolate;overflow:hidden;border-radius:9px 9px 2px 2px}
.journey-card-art .destination-art{position:absolute;inset:0;aspect-ratio:9/8}
.journey-table{position:absolute;right:8px;bottom:7px;max-width:25%;width:auto;height:40%;object-fit:contain;transform:rotate(10deg);opacity:0;pointer-events:none}
.journey-postcard.selected .journey-table{opacity:1}
.journey-region-number{position:absolute;left:7px;top:7px;padding:5px 7px;border:1px solid #e5d8bd;background:#fff9e9f5;color:#0d2d63;border-radius:7px;transform:rotate(-5deg);font:900 13px/1.1 system-ui;box-shadow:0 2px 3px #53432822}
.journey-postcard.selected .journey-region-number{background:#9bf5d5;border-color:#64d8b6}
.journey-earned{position:absolute;right:6px;top:5px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#ffdf83;color:#79551a;font:800 18px/1 system-ui}
.journey-card-caption{position:relative;flex:1;min-height:0;display:grid;align-content:center;gap:3px;padding:6px 3px 4px;background:#fff9ed;border-bottom:1px dashed #cbab6d}
.journey-card-caption strong{font:900 clamp(16px,4.6vw,23px)/1.15 'Trebuchet MS',system-ui;color:#0b2b62;letter-spacing:-.5px;white-space:nowrap}
.journey-card-caption strong>span{font-style:normal;font-size:16px}
.journey-card-caption small{font:600 clamp(8px,2.2vw,11px)/1.3 system-ui;color:#28496b}
.journey-card-caption>b{font:800 12px/1.3 system-ui;color:#a7700f}
.journey-carousel-nav{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;align-items:center;text-align:center;gap:8px;margin:-7px 10px 9px}
dialog.journey-modal .journey-carousel-nav>button{display:grid;place-items:center;width:42px;height:42px;min-height:42px;min-width:42px;padding:0;border:1px solid #fff;background:#fffefa;border-radius:50%;color:#173c71;box-shadow:0 3px 7px #76614326;font:700 30px/1 Georgia}
.journey-carousel-nav>div{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:3px 8px}
.journey-swipe{width:100%;font:800 italic 13px/1.3 'Trebuchet MS',system-ui;color:#154a8a}
.journey-swipe i{color:#42b5b8;font:22px/1 Georgia;margin-left:4px}
#journey-counter{font:850 11px/1.3 system-ui;color:#164c8a}
.journey-page-dots{display:flex;gap:4px}
.journey-page-dot{display:block;width:4px;height:4px;border-radius:50%;background:#a4b5bf}
.journey-page-dot.active{background:#18caa7;box-shadow:0 0 0 2px #69e0c755}
.journey-modal .journey-stages{gap:7px;margin-top:4px}
.journey-modal .journey-stages button{background:#fffefa;color:#15356c;border:1px solid #e2d7bd;border-radius:12px;min-height:51px;padding:5px;gap:3px;box-shadow:0 2px 4px #7559261f;font-size:11px}
.journey-modal .journey-stages button.active{border:2px solid #35d9b7;background:linear-gradient(135deg,#fffefa,#f8e5f8);box-shadow:0 0 0 2px #b5efd64a}
.journey-modal .stage-stars{color:#bd870d;font:800 17px/1 system-ui;letter-spacing:2px}
.journey-modal .journey-objective{font-size:10px;line-height:1.7;color:#375571;margin:8px 2px}
dialog.journey-modal button.journey-play{min-height:57px;padding:7px 9px;gap:2px;border:1px solid #72b4fa;border-radius:17px;background:linear-gradient(115deg,#1488ff,#0048f1);color:#fff;box-shadow:inset 0 2px 2px #ffffff5c,0 3px 6px #095ad02b;font-size:20px}
.journey-modal .journey-play small{color:#effcff;font-size:9px}
dialog.journey-modal button.journey-boss{min-height:50px;background:linear-gradient(115deg,#fffef8,#f1eaf6);border:1px solid #d9cddd;color:#18366b;box-shadow:0 2px 4px #75592617;border-radius:13px;padding:7px 10px;margin:8px 0}
.journey-modal .journey-boss small{color:#4b6383;font-size:9px}
.journey-modal .journey-boss>span{font-size:24px}
.journey-modal .journey-boss:disabled{opacity:.66}
dialog.journey-modal button.journey-explore{display:flex;align-items:center;gap:10px;text-align:left;min-height:44px;padding:7px 12px;border:1px solid #d9dcca;border-radius:12px;background:#fffef8e8;color:#153f7b;font-size:11px;box-shadow:0 2px 4px #75592612}
.journey-explore>span{font-size:22px;color:#0664f0}.journey-explore>b{margin-left:auto;font-size:23px}
.journey-modal .journey-map-title{display:flex;align-items:center;margin:6px 0 9px}
.journey-modal .journey-map-title h3{font:900 italic 19px/1.2 'Trebuchet MS',system-ui;color:#133465}
.journey-modal .journey-map-title>button{background:#fffefa;border:1px solid #ded7c8;color:#215089;font-size:9px;min-height:34px;padding:4px 7px;border-radius:9px}
.journey-modal .journey-nodes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px 7px;padding:2px}
.journey-modal .journey-nodes:before{display:none}
.journey-modal .journey-node.passport-card{border:1px solid #ddcfb3;border-radius:10px;overflow:hidden;padding:0;background:#fff8eb}
.journey-modal .journey-node.selected{outline:2px solid #38d6b3;outline-offset:1px}
.journey-modal .journey-node button{display:flex;flex-direction:column;padding:3px;min-height:0;background:#fffbf2;border:0;border-radius:0;isolation:auto;overflow:hidden}
.journey-modal .journey-node button:after{display:none}
.journey-thumb{width:100%;aspect-ratio:9/8;position:relative;overflow:hidden;border-radius:6px}
.journey-thumb .destination-art{position:absolute;inset:0;aspect-ratio:9/8}
.journey-modal .journey-node-number{top:3px;left:3px;border:0;border-radius:4px;background:#fff9eaf2;color:#15366d;font-size:8px;padding:1px 4px}
.journey-modal .journey-node-copy{display:block;padding:4px 1px 2px}
.journey-modal .journey-node-copy strong{font:800 clamp(8px,2.25vw,11px)/1.3 system-ui;color:#133768;white-space:nowrap;letter-spacing:-.2px}
.journey-modal .journey-node-copy small{margin:2px 0 0;color:#426385;font:600 8px/1.3 system-ui}
dialog.journey-modal button.journey-reward-link{display:flex;align-items:center;gap:8px;text-align:left;min-height:54px;border:1px solid #e5d7b7;border-radius:13px;background:#fffef7;color:#173b70;padding:8px;margin-top:12px;box-shadow:0 2px 4px #75592620}
.journey-reward-link>span:first-child{font-size:27px}.journey-reward-link strong,.journey-reward-link small{display:block}.journey-reward-link strong{font-size:11px}.journey-reward-link small{font-size:10px;color:#406a96}.journey-reward-link>b{margin-left:auto;white-space:nowrap;font-size:17px;color:#a48b58}.journey-reward-link>i{font:25px/1 Georgia;font-style:normal}
.journey-footer{text-align:center;color:#648da4;font:750 8px/1.5 system-ui;letter-spacing:1.8px;padding:16px 0 2px}.journey-footer small{font:600 8px/1.5 system-ui;color:#628595;letter-spacing:0;display:block;margin-top:3px}
.journey-modal[data-moving=true] .journey-swipe{color:#507891}
@supports (view-timeline-name:--arena-card) and (view-timeline-axis:inline) and (animation-timeline:--arena-card){
 .journey-track .venue-card{view-timeline-name:var(--arena-timeline);view-timeline-axis:inline;view-timeline-inset:0}
 .journey-track .postcard-visual{animation:journey-card-turn linear both;animation-timeline:var(--arena-timeline);animation-range:0% 100%}
}
@keyframes journey-card-turn{
 0%{transform:perspective(900px) translate3d(0,4px,0) rotateY(-30deg) rotate(1.75deg) scale(.9)}
 50%{transform:perspective(900px) translate3d(0,0,0) rotateY(0deg) rotate(0deg) scale(1)}
 100%{transform:perspective(900px) translate3d(0,4px,0) rotateY(30deg) rotate(-1.75deg) scale(.9)}
}
@media(prefers-reduced-motion:reduce){.journey-track .postcard-visual{animation:none!important;transform:none!important;will-change:auto!important}}
@media(max-width:365px){dialog.journey-modal{padding:10px 11px}.journey-track{margin-inline:-11px}.journey-stats{gap:5px}.journey-stats>span{font-size:8px}.journey-stats b{font-size:9px}.journey-card-caption strong{font-size:15px}.journey-card-caption small{font-size:8px}.journey-modal .journey-node-copy strong{font-size:8px}.journey-reward-link>b{font-size:13px}}
@media(min-width:600px){.journey-modal .journey-node-copy strong{font-size:11px}}
