/* Crown positions are spatial values, not equally-spaced list rows. */
.journey-shell{padding:14px 16px 9px;background:radial-gradient(ellipse at 50% 20%,#284a5b 0,#102b3b 43%,#071b2a 100%);color:#fff1cb}
.journey-header{margin-bottom:7px}.journey-header h2{font-size:23px}.journey-shell #crownNext{margin-bottom:8px}
.journey-tabs{display:flex;align-items:center;gap:4px;padding:5px;background:#03121dc9;border:1px solid #7b979433;border-radius:12px;flex-shrink:0;z-index:2}
.journey-tabs button{padding:9px 10px;background:transparent;border:0;border-radius:8px;color:#b8cbd0;font:800 11px system-ui;cursor:pointer}.journey-tabs button[aria-pressed=true]{background:linear-gradient(#f5d68b,#ba8b3f);color:#28332c;box-shadow:0 2px 0 #725328}
#coinBalance{margin-left:auto;color:#efce77;font:bold 12px system-ui;white-space:nowrap;padding-right:5px}
.journey-scroll{margin:8px -16px 0;mask-image:linear-gradient(transparent,#000 16px,#000 calc(100% - 14px),transparent);border-top:1px solid #9dc6d540;border-bottom:1px solid #9dc6d525;scrollbar-color:#d3b46d #183240;background:#0c2638;min-height:120px;position:relative;overscroll-behavior:contain}
.journey-map{height:5000px;padding:0;overflow:hidden;position:relative;background:radial-gradient(ellipse at 50% 50%,#153c50 0%,#0d2c40 50%,#0a2236 100%);isolation:isolate}
#trailRegions{position:absolute;inset:0;z-index:0;pointer-events:none}.trail-region{position:absolute;left:0;right:0;border-top:1px solid color-mix(in srgb,var(--realm-glow),transparent 72%);background:radial-gradient(ellipse 88% 46% at 50% 50%,color-mix(in srgb,var(--realm-glow),transparent 91%),transparent 100%),linear-gradient(90deg,#d4edee08,transparent 35%,transparent 65%,#b1dbf10a)}
.journey-map::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 55% 230px at 50% 50%,#9ccace14,transparent 100%),linear-gradient(90deg,#04182755,transparent 17%,transparent 83%,#04182755)}
.journey-map::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.65;background:repeating-radial-gradient(ellipse 44% 180px at 50% 50%,transparent 0 83px,#c8e4e41a 84px,#c8e4e408 86px,transparent 89px 140px),linear-gradient(180deg,#12354a22,#8ec9d30a 50%,#071b2a44)}
.journey-map .journey-road{width:100%;height:5000px;inset:0;z-index:1;filter:none;overflow:visible}
.journey-map .journey-road path{animation:none;opacity:1;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none}
.journey-map .journey-road .wire-cable{stroke:#72502d;stroke-width:3.5;opacity:.78}.journey-map .journey-road .wire-progress{stroke:#fff0a0;stroke-width:4;filter:drop-shadow(0 0 5px #ffd15c)}
#crownRuler span{position:absolute;left:89%;transform:translateY(-50%);z-index:4;min-width:22px;color:#dce8e4;font:bold 9px system-ui;text-shadow:0 2px 4px #00101a}
.journey-shell #arenaLadder{position:absolute;inset:0;display:block;pointer-events:none;z-index:3}
.journey-shell #arenaLadder li{position:absolute;left:3%;width:54%;max-width:none;height:88px;transform:translateY(-50%);padding:0;pointer-events:auto}
.journey-shell #arenaLadder .journey-stop{width:100%;height:100%;padding:8px 10px 8px 44px;display:flex;flex-direction:column;justify-content:center;gap:3px;border:1px solid #aac3c277;border-left:3px solid var(--realm);border-radius:12px;background:linear-gradient(115deg,#122d3fed,#173546e8 70%,#1d3c49eb);box-shadow:0 7px 14px #00121d80,inset 0 1px #e8f3e321;transform:none;color:#edf2e8}
.journey-shell #arenaLadder .current .journey-stop{border-color:#ffe29a;border-left:3px solid #ffe29a;box-shadow:0 0 19px #ffe1812c,0 8px 18px #00121d88,inset 0 1px #fff4d24a}
#arenaLadder .stop-number{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:30px;height:30px;border:1px solid #fff0c183;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,var(--realm),#203847);font:bold 13px system-ui;color:#122837;box-shadow:0 0 12px color-mix(in srgb,var(--realm),transparent 55%)}
.journey-shell #arenaLadder .stop-label{position:static;display:block;max-width:100%;text-align:left}.journey-shell #arenaLadder .stop-label strong{font-size:12px;line-height:1.2;white-space:nowrap}.journey-shell #arenaLadder .stop-label small{font-size:8px;letter-spacing:.035em;color:#c3d5d4;display:block;margin-top:2px}.journey-shell #arenaLadder .stop-crowns{position:absolute;right:7px;top:6px;padding:3px 4px;border:1px solid #e9e0c83b;background:#0b2337d6;border-radius:6px;font-size:8px;color:#f2d997}
.climb-post{position:absolute;left:calc(100% + 46%);top:50%;transform:translate(-50%,-50%);width:60px;height:78px;z-index:4;filter:drop-shadow(0 9px 6px #0009)}
.climb-post .post-mast{position:absolute;left:24px;top:12px;width:12px;height:54px;background:linear-gradient(90deg,#50677d,#d5d2b8 28%,#75899a 58%,#314c64);border:1px solid #aebbb5;border-radius:3px}
.climb-post .post-arm{position:absolute;left:2px;top:18px;width:56px;height:9px;background:linear-gradient(#ede1bd,#7e755b 48%,#293f53 75%);border:1px solid #ded3b0;border-radius:3px}
.climb-post .post-left-insulator,.climb-post .post-right-insulator{position:absolute;top:11px;width:7px;height:15px;background:linear-gradient(90deg,#358d9d,#d7ece1,#3a8291);border:1px solid #b6e2dc;border-radius:3px;box-shadow:0 0 8px #9cfcf344}
.climb-post .post-left-insulator{left:5px}.climb-post .post-right-insulator{right:5px}
.climb-post .post-foot{position:absolute;left:9px;bottom:1px;width:42px;height:12px;background:linear-gradient(#e2c783,#826b46 50%,#30495b 52%);border:1px solid #e9d398;border-radius:3px}
.climb-post>b{position:absolute;left:50%;top:36px;transform:translate(-50%,-50%);font-size:17px;color:#ffe594;text-shadow:0 0 7px #7ce7ed;transition:filter .2s}
.journey-shell #arenaLadder .locked .climb-post{filter:grayscale(.7) brightness(.75) drop-shadow(0 8px 5px #0008)}.journey-shell #arenaLadder .current .climb-post{filter:drop-shadow(0 0 12px #ffdd8266) drop-shadow(0 8px 5px #0008)}
#trailRewards{position:absolute;inset:0;pointer-events:none;z-index:4}.trail-pack{pointer-events:auto;position:absolute;transform:translateY(-50%);width:22%;min-width:73px;max-width:88px;border:0;background:transparent;color:#ffedb8;cursor:pointer;text-align:center;filter:drop-shadow(0 4px 4px #00111d)}
.trail-pack strong,.trail-pack small{display:block;background:#102638ed;padding:3px;border-radius:5px;font:bold 9px system-ui}.trail-pack small{font-size:8px;color:#d4e3dd}.trail-pack.locked{filter:grayscale(.7) brightness(.85);cursor:default}.trail-pack.claimed{opacity:.62;cursor:default}.trail-pack.ready .pack-object{animation:pack-float 2.5s ease-in-out infinite}
.pack-object{width:53px;height:58px;display:block;margin:0 auto 5px;position:relative;border:2px solid #ffe6a4;border-radius:7px 7px 13px 13px;background:linear-gradient(110deg,#aa612e,#f4c66d 25%,#d58c3d 50%,#87511f);box-shadow:inset 0 6px #ffebb16b,inset 0 -7px #60371766,4px 4px 0 #142c3d;font-size:0;transform:rotate(5deg)}
.pack-object::before{content:'';position:absolute;left:4px;right:4px;top:8px;bottom:8px;background:linear-gradient(#173f51,#0e2a3d);border:1px solid #cda34e;border-radius:5px}.pack-object i{position:absolute;inset:10px 0;display:grid;place-items:center;font:29px Georgia;color:#f9d478;font-style:normal;text-shadow:0 2px #4a3517}
#trailPlayer{position:absolute;transform:translate(-50%,-50%);z-index:4;pointer-events:none;text-align:center;filter:drop-shadow(0 5px 5px #062231)}
#trailPlayer>span{display:grid;place-items:center;border:3px solid #ffe396;border-radius:50%;width:44px;height:44px;background:radial-gradient(#709790,#173d51);font-size:25px;box-shadow:0 0 0 4px #ffdb7622,0 0 17px #ffdc7360}
#trailPlayer>img{display:block;width:62px;height:62px;object-fit:cover;object-position:50% 11%;border:3px solid #251509;border-radius:50%;background:linear-gradient(#fff467,#ffbb17 63%,#db610b);box-shadow:0 0 0 3px #ffe176,0 3px 0 #241409,0 0 15px #ffda5188}
#trailPlayer strong{position:absolute;top:49px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#ffdd86;color:#213c46;border-radius:5px;padding:4px 7px;font:900 9px system-ui}
.journey-preview{position:absolute;left:16px;right:16px;bottom:86px;z-index:10;height:178px;box-shadow:0 0 0 100vmax #03182277,0 15px 40px #0009}
#closeArenaPreview{position:absolute;top:8px;right:8px;width:32px;height:32px;border-radius:50%;background:#122e39ee;border:1px solid #ecd095;color:#ffe1a2;z-index:3;cursor:pointer}
.journey-preview[hidden],.journey-scroll[hidden],.collection-panel[hidden]{display:none!important}
.journey-footer{background:#0b2331;border-color:#708f9255;padding-top:7px}.journey-footer details{font-size:8px}.journey-footer #journeyNotice{font-size:10px;max-height:30px;overflow:auto}
.collection-panel{flex:1;min-height:0;overflow:auto;padding:14px 1px 20px;scrollbar-width:thin;scrollbar-color:#bba166 #102d3d;color:#e9eddf}
.collection-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:4px 0 8px}.collection-heading h3{font-size:20px;letter-spacing:-.045em}.collection-heading span,.collection-kicker{font-size:8px;letter-spacing:.1em;color:#a6c3c4}.collection-heading b{color:#f5d581;font-size:13px}
.collection-help{font-size:10px;line-height:1.5;color:#b4cbd1;margin:7px 0 13px}.deck-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:15px}
.deck-slots button,.collection-card{padding:0;background:#153649;border:1px solid #55747e;border-radius:9px;overflow:hidden;cursor:pointer;color:#eff2dd;position:relative}.deck-slots img,.collection-card img{display:block;width:100%;aspect-ratio:2/3;object-fit:contain}.deck-slots span{font-size:9px;display:block;padding:3px;background:#0a2534}.deck-slots button[aria-pressed=true]{outline:2px solid #f6d58a;outline-offset:2px}
.card-detail{background:linear-gradient(130deg,#1e4657,#123342);border:1px solid #5f838b;border-radius:12px;padding:12px;margin-bottom:20px}.card-detail h3{font-size:17px;margin:4px 0}.card-detail h3 small{color:#f3d47e;font-size:11px}.card-detail p{font-size:11px;color:#d5e0d9;line-height:1.5}.card-detail>small{font-size:9px;color:#a9c4c6;display:block;margin-top:8px;line-height:1.4}
.card-actions{display:flex;gap:6px;margin-top:9px}.card-actions button,.pack-shop button,.pack-reveal>button{flex:1;border:1px solid #eed59d;border-radius:7px;padding:10px 5px;font:800 10px system-ui;background:linear-gradient(#f3d686,#c49445);color:#203638;cursor:pointer}.card-actions button:disabled,.pack-shop button:disabled{background:#284b5a;color:#98aeb3;border-color:#4c6872;cursor:default}
.collection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.collection-card b,.collection-card small{display:block;font-size:11px;margin-top:3px}.collection-card small{font-size:8px;color:#c5d1ce;padding-bottom:3px}.collection-card.unowned img{filter:grayscale(.8) brightness(.55)}.collection-card progress{margin:4px 6px 8px;width:calc(100% - 12px);height:4px}
.pack-inventory{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:12px 0 20px}.pack-inventory>button{border:1px solid #d5bc7e88;border-radius:13px;background:radial-gradient(at 50% 25%,#3d6971,#112e42);padding:17px 10px;color:#f9eac0;cursor:pointer}.pack-inventory strong,.pack-inventory small{display:block;font-size:11px}.pack-inventory small{font-size:8px;margin-top:6px;color:#bad4d2}.pack-inventory>p{font-size:11px;line-height:1.5;grid-column:1/-1;color:#aec5cb}.collection-panel h4{font-size:12px;color:#e8d099;margin:12px 0}
.pack-shop{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.pack-shop article{border:1px solid #66848b;border-radius:12px;padding:15px 8px;text-align:center;background:linear-gradient(#254758,#0f2a3d)}.pack-shop h3{font-size:13px;margin-top:9px}.pack-shop p{font-size:10px;color:#c0d5d5;margin:7px 0 12px}.pack-shop button{width:100%;min-height:36px}
.pack-rules{font-size:10px;color:#a8c3c8;margin-top:20px;line-height:1.6}.pack-rules summary{cursor:pointer;color:#ebd18f}.pack-rules p{margin:8px 0}
.pack-reveal{border:1px solid #e3cd83;border-radius:15px;background:radial-gradient(at top,#487874,#193b50 80%);padding:15px;margin:12px 0 20px;text-align:center}.pack-reveal>span{font:800 9px system-ui;letter-spacing:.2em;color:#f9df9c}.pack-reveal h3{font-size:22px;margin:6px 0 15px}.pack-reveal>div{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.pack-reveal article{position:relative;animation:card-reveal .45s ease-out both}.pack-reveal img{width:100%;aspect-ratio:2/3;object-fit:contain}.pack-reveal b{display:block;color:#ffe69c}.pack-reveal small{display:block;font-size:7px;color:#d3ecce}.pack-reveal>button{margin-top:14px;width:100%}
@keyframes pack-float{50%{transform:translateY(-5px) rotate(-3deg)}}@keyframes card-reveal{from{opacity:0;transform:translateY(16px) scale(.85)}to{opacity:1;transform:none}}
@media(max-height:650px){.journey-shell{padding-top:8px}.journey-header h2{font-size:20px}.journey-balance #crownTotal{font-size:17px}.journey-tabs button{padding:8px}.journey-preview{height:155px}}
@media(prefers-reduced-motion:reduce){.trail-pack .pack-object,.pack-reveal article{animation:none!important}}

/* Unified oPombo menu language: toasted-gold controls, cocoa frames and real card art. */
.journey-shell{padding:12px 15px 8px;color:#fff8e8;background:radial-gradient(ellipse at 50% 0%,#805321 0,#49301b 34%,#24180f 77%,#160f0b 100%);border:3px solid #17100c;border-radius:20px;box-shadow:0 0 0 2px #e5a816,0 10px 0 #100b08,0 20px 45px #000b,inset 0 2px #ffdb6e66}
.journey-header h2{font-size:21px;color:#ffe090;text-shadow:0 2px #44270d,0 0 10px #f4ad2840;letter-spacing:-.035em}
.journey-brand{display:grid;grid-template-columns:38px auto;column-gap:7px;align-items:center}.journey-brand-mark{grid-row:span 2;width:38px;height:38px;display:grid;place-items:center;position:relative;border:2px solid #241509;border-radius:11px;background:linear-gradient(#fff265,#ffb411 67%,#e96c0b);color:#fff9df;-webkit-text-stroke:1.5px #21140b;text-shadow:0 2px #1c1108,1px 0 #1c1108;font:1000 26px system-ui;box-shadow:0 3px 0 #1a1009,inset 0 2px #fff7b5}.journey-brand-mark sup{position:absolute;right:-6px;top:-11px;color:#ffe34c;font:18px Georgia;-webkit-text-stroke:1px #33200c;text-shadow:0 2px #261507}
.journey-shell #journeyScroll{min-height:90px}.journey-shell #arenaLadder{display:block;position:absolute;inset:0;max-height:none;overflow:visible;z-index:3}
.journey-eyebrow{color:#ffdc70;font-weight:1000;letter-spacing:.09em;text-shadow:0 1px #4d2c12}
.journey-shell .journey-balance{color:#fff3dc}.journey-shell #crownTotal{color:#ffdc54;text-shadow:0 2px #6e3608}.journey-shell #journeyRank{color:#fff0c3;background:#3b2619;border:1px solid #d39b35;border-radius:7px;padding:4px 7px}
.journey-shell #crownProgress{border:2px solid #2d180a;border-radius:10px;background:#291b13;box-shadow:inset 0 2px 3px #0009}.journey-shell #crownProgress::-webkit-progress-bar{background:#291b13;border-radius:8px}.journey-shell #crownProgress::-webkit-progress-value{background:linear-gradient(#fff568,#ffb800 70%,#e36b0c);border-radius:7px;box-shadow:0 0 9px #ffd42988}.journey-shell #crownProgress::-moz-progress-bar{background:linear-gradient(#fff568,#ffb800 70%,#e36b0c);border-radius:7px}
.journey-shell #crownNext{color:#ffe2a2;text-shadow:0 1px #2e1b0d}
.journey-tabs{gap:5px;padding:5px;background:linear-gradient(#423020,#241910);border:2px solid #17100a;border-radius:13px;box-shadow:0 3px 0 #130c08,inset 0 1px #f9d17855}
.journey-tabs button{flex:1;min-height:37px;border:1px solid #15100b;border-bottom-width:3px;border-radius:9px;background:linear-gradient(#715033,#49301d);color:#fff0d4;text-shadow:0 1px #21140b;font-size:10px;letter-spacing:.035em;box-shadow:inset 0 1px #ffe7a13b}
.journey-tabs button span{font-size:15px;vertical-align:-1px;margin-right:3px}.journey-tabs button[aria-pressed=true]{background:linear-gradient(#fff15e 0%,#ffba16 61%,#ed790d 100%);border-color:#22150a;border-bottom-color:#683a12;color:#24170b;text-shadow:0 1px #fff6ad;box-shadow:0 2px 0 #170d07,inset 0 2px #fff9c17a}
#coinBalance{background:#21150e;border:1px solid #c88b2d;border-radius:7px;padding:6px 7px;color:#ffe04f;text-shadow:0 1px #55350e}
.journey-scroll{background:#22170f;border-color:#e1a93877;scrollbar-color:#eca923 #322115}
.journey-map{background:radial-gradient(ellipse at 50% 47%,#79502a 0,#59381f 54%,#382313 100%)}
#trailRegions .trail-region{border-top:2px solid color-mix(in srgb,var(--realm-glow),transparent 45%);background:linear-gradient(90deg,#180f0c66,transparent 18%,#ffdc3010 49%,transparent 80%,#180f0c66),radial-gradient(ellipse at 83% 50%,color-mix(in srgb,var(--realm-glow),transparent 70%),transparent 28%)}
.journey-map::before{background:repeating-linear-gradient(0deg,#160e0a12 0 3px,transparent 3px 116px),linear-gradient(90deg,#100a0866,transparent 15%,transparent 91%,#130b0999)}
.journey-map::after{opacity:.35;background:radial-gradient(ellipse at 20% 50%,#ffd65e18,transparent 40%),radial-gradient(ellipse at 82% 50%,#faaf201e,transparent 37%)}
.journey-map .journey-road .wire-halo{stroke:#ffd33850;stroke-width:58;filter:drop-shadow(0 0 18px #ffcd3777)}.journey-map .journey-road .wire-shadow{stroke:#17100b;stroke-width:43}.journey-map .journey-road .wire-metal{stroke:url(#wireMetal);stroke-width:32}.journey-map .journey-road .wire-core{stroke:#47311b;stroke-width:21}.journey-map .journey-road .wire-progress{stroke:#fff180;stroke-width:12;filter:drop-shadow(0 0 8px #fff1a2)}
.journey-shell #arenaLadder li{left:3%;width:59%;height:88px}
.journey-shell #arenaLadder .journey-stop img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 46%;z-index:0;filter:saturate(1.1) brightness(.94)}
.journey-shell #arenaLadder .journey-stop img.journey-stop-art{z-index:-2}
.journey-shell #arenaLadder .journey-stop::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#1d1106bb 0%,#37200e99 42%,#27160855 72%,#24140788 100%);pointer-events:none}
.journey-shell #arenaLadder .journey-stop{border:2px solid #1d120b;border-left:6px solid var(--realm);border-radius:13px;background:linear-gradient(105deg,#ffce32 0%,#efa219 35%,#9e5218 100%);box-shadow:0 4px 0 #1a1009,0 7px 14px #10090499,inset 0 2px #fff2aa,inset 0 -5px #683511;color:#fff1cf;text-shadow:0 2px #271608}
.journey-shell #arenaLadder .journey-stop::after{content:'';position:absolute;inset:5px;z-index:5;border:1px solid #fff4bb8c;border-radius:8px;pointer-events:none}
.journey-shell #arenaLadder .journey-stop{isolation:isolate}
.journey-shell #arenaLadder .journey-stop>.journey-stop-art{z-index:-2}
.journey-shell #arenaLadder .journey-stop::before{z-index:-1}
.journey-shell #arenaLadder .journey-stop::before{background:linear-gradient(90deg,#1d110680 0%,#37200e55 42%,#27160822 72%,#24140766 100%)}
.journey-shell #arenaLadder .journey-stop>.stop-number,.journey-shell #arenaLadder .journey-stop>.stop-label,.journey-shell #arenaLadder .journey-stop>.stop-crowns{z-index:3}
.journey-shell #arenaLadder .journey-stop>.stop-label{position:absolute;left:44px;right:6px;bottom:8px;margin:0;padding:4px 6px;background:#29180bbd;border:1px solid #f3c55388;border-radius:6px;transform:none}
.journey-shell #arenaLadder .journey-stop>.stop-label{position:absolute;z-index:6;left:42px;right:5px;bottom:7px;margin:0;padding:5px 7px 6px;background:#120b08e8;border:1px solid #ffce52;border-radius:6px;transform:none}
.journey-shell #arenaLadder .journey-stop>.stop-label{left:42px;right:5px;bottom:7px;padding:5px 7px 6px;background:#120b08e8;border:1px solid #ffce52}
.journey-shell #arenaLadder .journey-stop>.stop-label strong{color:#fff!important;-webkit-text-stroke:.55px #090604;text-shadow:0 2px 1px #090604,1px 0 #090604,-1px 0 #090604,0 -1px #090604,0 0 5px #090604!important}
.journey-shell #arenaLadder .journey-stop>.stop-label strong{font-size:15px!important;line-height:1.08;color:#fff!important;-webkit-text-stroke:.7px #090604;text-shadow:0 2px #090604,1px 0 #090604,-1px 0 #090604!important}
.journey-shell #arenaLadder .stop-label strong{font-size:15px!important;line-height:1.08;letter-spacing:-.025em;color:#fff!important;-webkit-text-stroke:.55px #090604;text-shadow:0 2px 1px #090604,1px 0 #090604,-1px 0 #090604,0 -1px #090604,0 0 5px #090604!important}
.journey-shell #arenaLadder .stop-label small{font-size:8px!important;color:#ffe477!important}
.journey-shell #arenaLadder .journey-stop>.stop-label{z-index:6}
.journey-shell #arenaLadder .journey-stop>.stop-label strong{font-size:15px!important;color:#fff!important;-webkit-text-stroke:.7px #090604;text-shadow:0 2px #090604,1px 0 #090604,-1px 0 #090604!important}
.journey-shell #arenaLadder .journey-stop img.journey-stop-art{z-index:0}
.journey-shell #arenaLadder .journey-stop::before{z-index:1;background:linear-gradient(90deg,#1d110680 0%,#37200e55 42%,#27160822 72%,#24140766 100%)}
.journey-shell #arenaLadder .journey-stop>.stop-label,.journey-shell #arenaLadder .journey-stop>.stop-number,.journey-shell #arenaLadder .journey-stop>.stop-crowns{z-index:6}
.journey-shell #arenaLadder .journey-stop>.stop-label{position:absolute;left:42px;right:5px;bottom:7px;margin:0;padding:5px 7px 6px;background:#120b08d9;border:1px solid #ffce52;border-radius:6px;transform:none}
.journey-shell #arenaLadder .journey-stop>.stop-label strong{font-size:15px!important;line-height:1.08;color:#fff!important;-webkit-text-stroke:.7px #090604;text-shadow:0 2px #090604,1px 0 #090604,-1px 0 #090604!important}

/* Modular collectible cards: art, farelo, title, class and progression are separate layers. */
.deck-slots,.collection-grid{align-items:stretch}
.journey-shell .card-tile{position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;min-width:0;overflow:hidden;padding:6px 6px 7px;border:2px solid #21150d;border-radius:11px;background:linear-gradient(155deg,#70451f,#382619 72%,#24180f);box-shadow:0 4px 0 #170e08,inset 0 1px #ffe18a66;color:#fff5dc;text-align:center;cursor:pointer;gap:2px}
.journey-shell .deck-card{height:clamp(172px,29vh,226px);padding:7px 6px 8px}.journey-shell .collection-card{height:clamp(142px,23vh,190px)}
.journey-shell .card-tile[aria-pressed=true]{outline:3px solid #ffd332;outline-offset:1px;box-shadow:0 4px 0 #170e08,0 0 17px #ffd33d88,inset 0 1px #fff6ad}
.card-art-window{position:relative;display:grid;place-items:center;flex:1 1 auto;min-height:64px;margin:0 0 2px;overflow:hidden;border:1px solid #f4cc5d77;border-radius:7px;background:radial-gradient(ellipse at 50% 38%,#79512c,#3a281a 71%,#251910);isolation:isolate}
.deck-card .card-art-window{min-height:92px}.card-art-window::after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,#ffe99012,transparent 48%,#140d0855)}
.card-art-window .card-character{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;mix-blend-mode:normal}
.card-art-window .card-unit-art{background-image:var(--card-sheet);background-size:400% 400%;background-position:var(--card-frame,0 0);background-repeat:no-repeat}
.card-art-window .card-full-art{padding:3px;object-fit:contain;background:linear-gradient(145deg,#49321b,#21170f 76%)}
.card-cost{position:absolute;z-index:3;top:5px;left:5px;display:flex;align-items:center;justify-content:center;gap:1px;min-width:32px;height:29px;padding:1px 4px;border:2px solid #261609;border-radius:8px;background:linear-gradient(#ffe851,#ffae0b 67%,#ec690b);box-shadow:0 2px 0 #160d07;color:#24160b;text-shadow:0 1px #fff39c;font:1000 14px system-ui}.card-cost small{font-size:9px}
.card-name{display:block;min-height:20px;overflow:hidden;color:#fff;font:900 11px/1.1 system-ui;text-shadow:0 2px #160d08,1px 0 #160d08,-1px 0 #160d08;white-space:nowrap;text-overflow:ellipsis}.deck-card .card-name{font-size:12px}.card-type{display:block;color:#f9cb57;font:900 8px/1 system-ui;letter-spacing:.08em}
.card-level{display:block;margin-top:1px;color:#fff3ce;font:900 8px/1.1 system-ui;text-shadow:0 1px #160d08}.card-evolution{appearance:none;display:block;width:100%;height:6px;flex:none;margin:2px 0 0;border:1px solid #1a1009;border-radius:8px;background:#20150d;overflow:hidden}.card-evolution::-webkit-progress-bar{background:#20150d;border-radius:8px}.card-evolution::-webkit-progress-value{background:linear-gradient(90deg,#48dbef,#1489f5);border-radius:7px;box-shadow:0 0 5px #51deff88}.card-evolution::-moz-progress-bar{background:linear-gradient(90deg,#48dbef,#1489f5);border-radius:7px}.card-copies{display:block;min-height:9px;color:#e8d8b2;font:700 7px/1.1 system-ui}
.journey-shell .collection-card.unowned .card-art-window{filter:saturate(.55) brightness(.62)}.journey-shell .collection-card.unowned .card-cost{filter:grayscale(.6) brightness(.8)}
.journey-shell .card-tile:focus-visible{outline:3px solid #42d8ff;outline-offset:2px}
.journey-shell .card-name{min-height:22px;max-height:24px;white-space:normal;text-overflow:clip;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere;align-content:center;font-size:9px;line-height:1.02}
.journey-shell .deck-card .card-name{font-size:10px}
.journey-shell .card-type{font-size:7px;min-height:8px}
@media(max-width:480px){.journey-shell .deck-card{height:clamp(160px,27vh,205px)}.journey-shell .collection-card{height:clamp(135px,22vh,175px)}.card-art-window{min-height:58px}.deck-card .card-art-window{min-height:80px}.card-name{font-size:10px}}
.journey-shell #arenaLadder .current .journey-stop{border-color:#fff3a1;border-left-color:#fff173;box-shadow:0 0 0 2px #201308,0 0 22px #ffdb4b99,0 5px 0 #211208,inset 0 2px #fff7c9}
#arenaLadder .stop-number{z-index:3;left:8px;width:32px;height:32px;background:linear-gradient(#fff4a2,#ffb400 65%,#e56310);border:2px solid #211307;color:#281708;box-shadow:0 3px 0 #6b3209,0 0 8px #fff07a66}
.journey-shell #arenaLadder .stop-label{position:relative;z-index:3}
.journey-shell #arenaLadder .stop-label strong{font-size:12px;color:#fff4d6;text-shadow:0 2px #261307}.journey-shell #arenaLadder .stop-label small{color:#ffe17c;text-shadow:0 1px 2px #31180a;font-weight:900}.journey-shell #arenaLadder .stop-crowns{background:#382213;border:1px solid #ffd568;color:#ffe574;text-shadow:none}
.climb-post{width:78px;height:98px;left:calc(100% + 34%);filter:drop-shadow(0 5px 0 #1e130a) drop-shadow(0 7px 7px #0009)}
.climb-post .post-mast{left:31px;top:13px;width:16px;height:71px;border:2px solid #2a180c;border-radius:4px;background:linear-gradient(90deg,#64340d,#ffdd74 24%,#a9681d 55%,#49270d);box-shadow:inset 0 0 0 2px #ffe4a04a}
.climb-post .post-arm{left:3px;top:19px;width:72px;height:13px;border:2px solid #271708;border-radius:4px;background:linear-gradient(#fff1ae,#efa92f 54%,#8d4a13);box-shadow:0 2px 0 #45240c}
.climb-post .post-left-insulator,.climb-post .post-right-insulator{top:10px;width:10px;height:18px;border:2px solid #28160a;background:linear-gradient(90deg,#9b370c,#fff0a1,#d7650a);box-shadow:0 0 8px #ffda5966}.climb-post .post-left-insulator{left:7px}.climb-post .post-right-insulator{right:7px}
.climb-post .post-foot{left:9px;width:60px;height:14px;border:2px solid #271708;background:linear-gradient(#ffdf77,#ac6719 50%,#47260e 52%)}.climb-post>b{top:48px;color:#fff4a1;font-size:23px;text-shadow:0 2px #643005,0 0 8px #ffe34a}
.journey-shell #arenaLadder .locked .climb-post{filter:grayscale(.8) brightness(.75) drop-shadow(0 6px 5px #0008)}.journey-shell #arenaLadder .current .climb-post{filter:drop-shadow(0 0 12px #ffdc55) drop-shadow(0 5px 0 #26160a)}
.trail-pack{width:25%;max-width:102px;color:#fff7d5}.trail-pack strong,.trail-pack small{background:#3b2617;border:1px solid #d99c32;border-radius:5px;color:#fff0c4;text-shadow:0 1px #1d1007;box-shadow:0 2px 0 #160c06}.trail-pack small{color:#ffdf70}.trail-pack.locked{filter:grayscale(.72) brightness(.8)}
.pack-object{border:3px solid #211307;border-radius:8px 8px 14px 14px;background:linear-gradient(110deg,#e07a18,#ffdc41 27%,#ef9518 52%,#8e4210);box-shadow:inset 0 5px #fff3a5aa,inset 0 -7px #73380c88,3px 4px 0 #211308,0 0 12px #ffb91e66}
.pack-object::before{background:linear-gradient(#793b11,#40200f);border:2px solid #ffdb54}.pack-object i{color:#ffe45a;text-shadow:0 2px #59300c}
.journey-preview{border:3px solid #1d120b;border-radius:16px;background:#3d291b;box-shadow:0 0 0 2px #edaf22,0 0 0 100vmax #100a07b0,0 15px 40px #000b}
.journey-preview #useArenaBtn,.journey-shell #closeArenaPreview,.journey-shell #closeProgression{border:2px solid #1f130a;border-bottom-width:4px;border-radius:9px;background:linear-gradient(#fff05d,#ffb40f 65%,#e96f0b);color:#251608;text-shadow:0 1px #ffe993;box-shadow:0 2px 0 #160d07,inset 0 2px #fff6a1}
.journey-shell #closeProgression{width:36px;height:36px;border-radius:10px;color:#251608}
.journey-footer{background:#382619;border:1px solid #bd822d;border-radius:10px;color:#f8e6be}.journey-footer details{color:#ecd4a5}.journey-footer summary{color:#ffe078}.sound-controls button{border:2px solid #21140a!important;background:linear-gradient(#fff05d,#f4a710)!important;color:#251608!important;box-shadow:0 2px 0 #150c06,inset 0 1px #fff5a5!important}
.collection-panel{color:#fff2d3;scrollbar-color:#eca923 #322115}.collection-heading h3{color:#ffe08a;text-shadow:0 2px #3b210d}.collection-heading span,.collection-kicker{color:#f2c35b}.collection-help{color:#ffebc6}
.deck-slots button,.collection-card{border:2px solid #261608;border-radius:10px;background:linear-gradient(#79471d,#3a2414);box-shadow:0 3px 0 #1a1009,inset 0 1px #ffda6a55;color:#fff2d6}.deck-slots button{height:clamp(142px,27vh,218px);display:grid;grid-template-rows:minmax(0,1fr) 25px;padding:5px;align-items:stretch;justify-content:stretch}.deck-slots .deck-art{display:block;width:100%;height:100%;min-height:0;aspect-ratio:auto;object-fit:contain;padding:5px;border-radius:7px;background:radial-gradient(ellipse,#654a27,#342315 70%,#21170f);mix-blend-mode:normal}.deck-slots .card-unit-art{display:block;width:100%;height:100%;min-height:0;border-radius:7px;background-color:#382719;background-image:var(--card-sheet);background-size:400% 400%;background-position:0 0;background-repeat:no-repeat}.deck-slots span{font-size:9px;display:grid;place-items:center;padding:3px;background:#382213;color:#ffe8a3;border-radius:5px}.deck-slots button[aria-pressed=true]{outline:3px solid #ffcf31;outline-offset:1px}.collection-grid .collection-card{min-height:0;display:grid;grid-template-rows:minmax(70px,auto) 18px 23px 9px;justify-items:stretch}.collection-grid .collection-art{display:block;width:100%;height:auto;aspect-ratio:2/3;padding:5px;object-fit:contain;border-radius:7px;background:radial-gradient(ellipse,#654a27,#342315 70%,#21170f);mix-blend-mode:normal}.collection-grid .card-unit-art{display:block;width:100%;aspect-ratio:2/3;background-color:#382719;background-image:var(--card-sheet);background-size:400% 400%;background-position:0 0;background-repeat:no-repeat;border-radius:7px}.collection-grid .collection-card:has(.card-full-art){grid-template-rows:minmax(70px,auto) 18px 23px 9px}.collection-grid .card-full-art{display:block;width:100%;height:100%;aspect-ratio:2/3;padding:5px;object-fit:contain;border-radius:7px;background:radial-gradient(ellipse,#654a27,#342315 70%,#21170f)}.collection-card{min-width:0}.collection-card b,.collection-card small{padding-inline:4px;text-align:center}.collection-grid .collection-card progress{align-self:center}
.card-detail{background:linear-gradient(130deg,#895322,#573516);border:2px solid #e4a52c;border-radius:13px;box-shadow:0 4px 0 #211309,inset 0 1px #ffedaa66}.card-detail h3{color:#fff2d0}.card-detail h3 small,.card-detail>small{color:#ffdc78}.card-detail p{color:#ffedcb}
.card-actions button,.pack-shop button,.pack-reveal>button{border:2px solid #24160a;border-bottom-width:4px;border-radius:10px;background:linear-gradient(#fff05a,#ffb40f 63%,#ec710b);color:#251608;box-shadow:inset 0 1px #fff7b1,0 2px 0 #170d07}.card-actions button:disabled,.pack-shop button:disabled{background:linear-gradient(#70695b,#494135);color:#b3a994;border-color:#292017}
.collection-grid{gap:10px}.collection-card b{color:#fff0c6}.collection-card small{color:#ffe08b}.collection-card progress{accent-color:#ffba12}
.pack-inventory>button,.pack-shop article{border:2px solid #d2942c;border-radius:13px;background:linear-gradient(#74451d,#3c2414);box-shadow:0 4px 0 #1b1009,inset 0 1px #ffe09255;color:#fff0d0}.pack-inventory small,.pack-shop p{color:#f4dcae}.collection-panel h4{color:#ffdc79}.pack-rules{color:#f0daad}.pack-rules summary{color:#ffe17a}
.pack-reveal{border:2px solid #e4a52c;background:radial-gradient(at top,#a66a26,#603a19 80%);box-shadow:0 4px 0 #241409}.pack-reveal>span{color:#ffe36e}.pack-reveal h3{color:#fff1d0}.pack-reveal b{color:#ffe36e}.pack-reveal small{color:#ffe4b3}
.pack-reveal .reveal-art{width:100%;height:auto;aspect-ratio:2/3;padding:3px;object-fit:contain;border-radius:8px;background:radial-gradient(ellipse,#654a27,#342315 70%,#21170f);mix-blend-mode:normal}.pack-reveal .card-unit-art{display:block;width:100%;height:auto;aspect-ratio:2/3;background-color:#382719;background-image:var(--card-sheet);background-size:400% 400%;background-position:0 0;background-repeat:no-repeat;border-radius:8px}
.journey-shell #arenaLadder .stop-crowns{z-index:3}
.deck-slots .card-unit-art,.collection-grid .card-unit-art,.pack-reveal .card-unit-art{display:block}
.deck-slots .card-unit-art{background-position:0 66.666%}
.collection-grid .card-unit-art,.pack-reveal .card-unit-art{background-position:0 66.666%}
.deck-slots .card-full-art,.collection-grid .card-full-art{display:block;width:100%;height:100%;min-height:0;aspect-ratio:2/3;padding:3px;object-fit:contain;border-radius:7px;background:radial-gradient(ellipse,#49321b,#21170f 76%);mix-blend-mode:normal}
.collection-grid .card-full-art{height:auto}
.journey-shell #arenaLadder li{z-index:3}
.journey-shell #arenaLadder li .journey-stop{overflow:visible}
#trailPosts{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:visible}
.journey-map .journey-road{z-index:2}
.card-art-window .card-art-composite{position:absolute;inset:0;display:block;overflow:hidden;border-radius:inherit;isolation:isolate}
.card-art-window .card-character-art{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;min-height:0;padding:0;object-fit:cover;object-position:center;background:transparent;border:0;border-radius:0;mix-blend-mode:normal}
.card-art-window .card-frame-art{position:absolute;inset:0;z-index:3;display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}
.card-tile .card-cost{z-index:5}
.card-art-window::after{z-index:4;background:linear-gradient(180deg,#ffe99010,transparent 55%,#140d0830);pointer-events:none}
.card-art-window .card-art-composite.tier-OURO,.card-art-window .card-art-composite.tier-ESMERALDA{filter:drop-shadow(0 0 4px #ffcc4d66)}
.card-art-window .card-art-composite.tier-DIAMANTE{filter:drop-shadow(0 0 6px #54ceff99)}
.card-art-window .card-art-composite.tier-INFINITO{filter:drop-shadow(0 0 8px #d278ffcc);animation:infinite-card-glow 2.8s ease-in-out infinite alternate}
@keyframes infinite-card-glow{from{filter:drop-shadow(0 0 5px #9a62ff99)}to{filter:drop-shadow(0 0 10px #ffca56dd)}}
.pack-reveal .card-art-composite{position:relative;display:block;width:100%;aspect-ratio:2/3;overflow:hidden;border-radius:8px;background:#291b10}
.pack-reveal .card-character-art,.pack-reveal .card-frame-art{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.pack-reveal .card-character-art{z-index:1}.pack-reveal .card-frame-art{z-index:2;pointer-events:none}
.journey-shell .deck-card,.journey-shell .collection-card{height:clamp(205px,31vh,240px)}
.journey-shell .card-art-window{width:100%;height:auto;min-height:0;aspect-ratio:2/3;flex:0 0 auto;margin:0 0 3px;border-radius:9px}
.journey-shell .deck-card .card-art-window{min-height:0}
.journey-shell .collection-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.journey-shell .card-name{min-height:22px;max-height:24px}
@media(max-width:480px){.journey-shell .deck-card,.journey-shell .collection-card{height:clamp(190px,27vh,224px)}.journey-shell .collection-grid{gap:6px}}
.card-art-window .card-character-art{position:relative;z-index:1;display:block;width:100%;height:100%;min-height:0;padding:4px;object-fit:contain;background:transparent;border:0;border-radius:0;mix-blend-mode:normal}
.deck-card .card-art-window .card-character-art{padding:2px}
.collection-card .card-art-window .card-character-art{padding:3px}
.pack-reveal .card-character-art{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:contain;padding:5px;background:radial-gradient(ellipse,#654a27,#342315 70%,#21170f);border-radius:8px}
.journey-shell #arenaLadder .journey-stop>.stop-label strong{font-size:15px!important;line-height:1.08;color:#fff!important;-webkit-text-stroke:.7px #090604;text-shadow:0 2px 1px #090604,1px 0 #090604,-1px 0 #090604,0 -1px #090604,0 0 5px #090604!important}
.journey-shell input[type=range]{accent-color:#ffb910}.journey-shell #progressionStorage{color:#e4c99e}
@media(max-width:480px){.journey-shell{padding:9px 10px 7px}.journey-shell #arenaLadder li{width:61%;height:82px}.journey-shell #arenaLadder .journey-stop{padding-right:7px}.journey-shell #arenaLadder .stop-label strong{font-size:15px!important}.journey-shell #arenaLadder .stop-label small{font-size:7px}.journey-shell #arenaLadder .journey-stop>.stop-label{left:39px;right:4px;padding:4px 5px}.climb-post{width:68px;height:90px;left:calc(100% + 30%)}.climb-post .post-mast{left:27px;width:14px;height:64px}.climb-post .post-arm{width:64px}.climb-post .post-foot{width:52px}.journey-tabs button{font-size:9px;padding-inline:5px}#trailPlayer>img{width:56px;height:56px}}

/* Authored Farelo-value medallions: one source image per card cost (1-9). */
.journey-shell .card-tile .card-cost{position:absolute;z-index:7;top:1px;left:1px;display:block;width:40px;height:40px;min-width:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:transparent;font-size:0;filter:drop-shadow(0 2px 2px #120a08bb);pointer-events:none}
.journey-shell .card-tile .card-cost img{display:block;width:100%;height:100%;object-fit:contain;filter:none}
.journey-shell .deck-card .card-cost{width:45px;height:45px;top:1px;left:1px}
.journey-shell .collection-card .card-cost{width:37px;height:37px;top:1px;left:1px}
.journey-shell .card-tile .card-cost-fallback{display:grid;place-items:center;border:2px solid #38200b;border-radius:50%;background:linear-gradient(#ffe86a,#ed7910);color:#251307;font:1000 16px/1 system-ui;text-shadow:0 1px #fff5a1}
.journey-shell .collection-card.unowned .card-cost{filter:grayscale(.48) brightness(.84) drop-shadow(0 2px 2px #120a08bb)}

/* Keep the cost readable on the compact live-battle hand as well. */
.hud-hand-container .card-item{isolation:isolate}
.hud-hand-container .card-item .card-frame{position:absolute;inset:0;z-index:3;display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}
.hud-hand-container .card-item .card-cost{position:absolute;z-index:5;top:0;left:0;display:grid!important;place-items:center;width:29px;height:29px;min-width:0;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:transparent;font-size:0;filter:drop-shadow(0 2px 2px #100806);pointer-events:none}
.hud-hand-container .card-item .card-cost img{display:block;width:100%;height:100%;object-fit:contain}
.hud-hand-container .card-item .card-cost b{display:grid;place-items:center;width:25px;height:25px;border:2px solid #381d07;border-radius:50%;background:linear-gradient(#ffe86a,#ed7910);color:#261307;font:1000 15px/1 system-ui;text-shadow:0 1px #fff5a1}

/* Make the battle energy count feel like a deliberate UI asset, not a debug number. */
.hud-farelo-counter{gap:6px}
.hud-farelo-counter>img{display:block;width:25px;height:25px;object-fit:contain;filter:drop-shadow(0 2px 2px #170d05)}
.hud-farelo-counter>span{color:#fff7d7;font:1000 19px/1 system-ui;letter-spacing:.015em;-webkit-text-stroke:.55px #371b08;text-shadow:0 2px #291408,0 0 7px #1b0d04,0 0 12px #ffb51e99}

/* Focused, animated pack reveal with separate art and card-frame layers. */
.journey-shell .pack-opening{position:absolute;inset:0;z-index:8;display:grid;grid-template-rows:auto minmax(82px,13vh) minmax(0,1fr) auto;gap:4px;padding:clamp(12px,3vw,24px);overflow:hidden;border:2px solid #f2bf4d;border-radius:18px;background:radial-gradient(ellipse at 50% 28%,#8e5923ee 0,#3e291afa 42%,#17140ffa 100%);box-shadow:0 0 0 100vmax #090704c9,inset 0 1px #fff0ae88,0 14px 42px #000b;text-align:center;backdrop-filter:blur(9px);animation:pack-opening-enter .38s cubic-bezier(.18,.82,.28,1) both}
.pack-opening::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background:radial-gradient(ellipse at 50% 45%,#ffe57d2c,transparent 48%),linear-gradient(115deg,transparent 15%,#fff4b10b 50%,transparent 82%)}
.pack-opening>*{position:relative;z-index:1}.pack-opening-close{position:absolute!important;top:8px;right:8px;z-index:4!important;width:34px;height:34px;border:1px solid #ffdf86;border-radius:50%;background:#21150eea;color:#fff0c4;font:700 23px/1 system-ui;cursor:pointer}
.pack-opening-head{padding:4px 32px 0}.pack-opening-head>span{color:#ffd55c;font:900 9px/1 system-ui;letter-spacing:.2em;text-shadow:0 1px #321906}.pack-opening-head h2{margin:5px 0 2px;color:#fff6dd;font:1000 clamp(21px,5vw,31px)/1 system-ui;letter-spacing:-.04em;text-shadow:0 3px #40220d,0 0 13px #ffc64166}.pack-opening-head p{margin:0;color:#eed4a3;font:600 10px/1.25 system-ui}
.pack-open-stage{position:relative;display:grid;place-items:center;min-height:104px;isolation:isolate;overflow:hidden}
.pack-open-aura,.pack-open-burst{position:absolute;left:50%;top:52%;width:110px;height:110px;border:1px solid #ffdb6a88;border-radius:50%;transform:translate(-50%,-50%) scale(.55);animation:pack-aura 1.8s ease-out .2s infinite}
.pack-open-burst{width:80px;height:80px;border:2px dashed #fff1a7aa;animation:pack-burst 1.2s ease-out .32s infinite}
.pack-chest{position:absolute;left:50%;top:56%;display:grid;place-items:center;width:92px;height:58px;transform:translate(-50%,-25%);border:3px solid #241307;border-radius:7px 7px 12px 12px;background:linear-gradient(110deg,#a85012,#ffca37 24%,#e28114 57%,#8b3c0c);box-shadow:inset 0 5px #fff0a4aa,inset 0 -8px #6a2c0e99,0 8px 0 #211208,0 0 20px #ffb91e66;animation:pack-chest-pop .7s cubic-bezier(.2,.8,.3,1) .2s both}
.pack-chest::before{content:"";position:absolute;left:0;right:0;top:12px;height:8px;border-block:2px solid #452208;background:linear-gradient(#ffec81,#e79a14)}.pack-chest b{z-index:1;color:#fff09a;font:900 21px Georgia,serif;text-shadow:0 2px #65340e,0 0 9px #fff09a}
.pack-chest-lid{position:absolute;left:50%;top:calc(56% - 34px);width:98px;height:27px;transform:translateX(-50%);border:3px solid #241307;border-radius:8px 8px 4px 4px;background:linear-gradient(#ffe66a,#e99416 75%,#8e4210);box-shadow:inset 0 3px #fff4a3,0 0 12px #ffcf4b;transform-origin:12% 100%;animation:pack-lid-open .68s cubic-bezier(.16,.85,.25,1) .68s both}
.pack-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none}.pack-particles i{position:absolute;left:var(--particle-left);bottom:13%;width:7px;height:7px;border:1px solid #fff4a2;border-radius:50% 50% 3px 50%;background:linear-gradient(135deg,#fff6ad,#ffb318 65%,#da5a0b);opacity:0;box-shadow:0 0 10px #ffda51;animation:pack-crumb-fly .9s cubic-bezier(.1,.65,.25,1) var(--particle-delay) both}
.pack-reward-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;justify-items:center;align-items:start;gap:clamp(5px,1.5vw,10px);min-height:0;overflow:auto;padding:5px 3px;scrollbar-color:#e7ad38 #24170e}
.pack-reward-grid article{position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto auto;width:min(100%,104px);min-width:0;opacity:0;transform:perspective(600px) rotateY(82deg) scale(.72);animation:pack-card-reveal .64s cubic-bezier(.18,.85,.25,1.12) calc(.78s + var(--reveal-order)*.13s) both}
.pack-reward-grid .card-art-composite{position:relative;display:block;width:100%;aspect-ratio:2/3;overflow:hidden;border:2px solid #eac05b;border-radius:9px;background:radial-gradient(ellipse at 50% 38%,#69431f,#21170f 75%);box-shadow:0 3px 0 #190e06,0 0 13px #ffc53866}
.pack-reward-grid .new-card .card-art-composite{border-color:#fff08a;box-shadow:0 3px 0 #190e06,0 0 18px #ffe461aa}
.pack-reward-grid .card-character-art,.pack-reward-grid .card-frame-art{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}
.pack-reward-grid .card-character-art{z-index:1;padding:3px}.pack-reward-grid .card-frame-art{z-index:2;pointer-events:none}
.pack-reward-grid article>b{position:absolute;top:5px;right:5px;z-index:3;min-width:24px;padding:3px 5px;border:1px solid #2c1807;border-radius:8px;background:linear-gradient(#fff278,#ed8410);color:#261407;font:1000 11px/1 system-ui;box-shadow:0 2px 0 #130c07}
.pack-reward-grid article>small{display:block;margin-top:4px;color:#ffe7a6;font:900 7px/1.1 system-ui;letter-spacing:.08em;text-shadow:0 1px #201109}
.pack-reward-grid .duplicate-card .card-art-composite{filter:saturate(.78)}
.pack-opening-continue{min-height:42px;border:2px solid #2b1808;border-bottom-width:4px;border-radius:10px;background:linear-gradient(#fff06c,#ffb00f 65%,#e66b0b);color:#2b1808;font:1000 11px/1 system-ui;letter-spacing:.08em;text-shadow:0 1px #fff6a6;box-shadow:inset 0 1px #fff8b8,0 2px #100905;cursor:pointer}
@keyframes pack-opening-enter{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
@keyframes pack-aura{0%{opacity:.8;transform:translate(-50%,-50%) scale(.48)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.55)}}
@keyframes pack-burst{0%{opacity:.8;transform:translate(-50%,-50%) rotate(0) scale(.45)}100%{opacity:0;transform:translate(-50%,-50%) rotate(90deg) scale(1.7)}}
@keyframes pack-chest-pop{0%{transform:translate(-50%,10%) scale(.72)}70%{transform:translate(-50%,-35%) scale(1.08)}100%{transform:translate(-50%,-25%) scale(1)}}
@keyframes pack-lid-open{0%{transform:translateX(-50%) rotate(0)}65%{transform:translate(-50%,-25px) rotate(-24deg)}100%{transform:translate(-50%,-28px) rotate(-18deg)}}
@keyframes pack-crumb-fly{0%{opacity:0;transform:translate(0,0) scale(.4) rotate(0)}25%{opacity:1}100%{opacity:0;transform:translate(var(--particle-x,0px),-105px) scale(.2) rotate(150deg)}}
@keyframes pack-card-reveal{0%{opacity:0;transform:perspective(600px) rotateY(82deg) scale(.72);filter:brightness(1.8)}65%{opacity:1;transform:perspective(600px) rotateY(-7deg) scale(1.04);filter:brightness(1.2)}100%{opacity:1;transform:perspective(600px) rotateY(0) scale(1);filter:none}}
@media(max-width:480px){.journey-shell .collection-card .card-cost{width:34px;height:34px}.hud-hand-container .card-item .card-cost{width:25px;height:25px}.hud-farelo-counter>img{width:22px;height:22px}.hud-farelo-counter>span{font-size:17px}.pack-reward-grid{gap:4px}.pack-reward-grid article{width:min(100%,80px)}}
@media(prefers-reduced-motion:reduce){.pack-opening,.pack-open-aura,.pack-open-burst,.pack-chest,.pack-chest-lid,.pack-particles i,.pack-reward-grid article{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}}

/* Final sizing pass: cost medallions sit on the frame corner, not over the portrait. */
.journey-shell .deck-slots,.journey-shell .collection-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch}
.journey-shell .deck-card,.journey-shell .collection-card{display:grid!important;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 22px 9px 10px 5px 9px;align-content:stretch;justify-items:stretch;width:100%;height:clamp(190px,27vh,224px);min-width:0;box-sizing:border-box;gap:2px}
.journey-shell .card-art-window{display:block;width:100%;height:auto;min-width:0;min-height:0;aspect-ratio:2/3;flex:none}
.journey-shell .card-art-window .card-character-art{position:absolute;inset:0;width:100%;height:100%;padding:0;object-fit:cover;object-position:center 43%}
.journey-shell .deck-card .card-cost,.journey-shell .collection-card .card-cost{top:1px;left:1px;width:22px;height:22px}
.hud-hand-container .card-item .card-cost{top:0;left:0;width:18px;height:18px}
@media(max-width:480px){.journey-shell .deck-card .card-cost,.journey-shell .collection-card .card-cost{width:21px;height:21px}.hud-hand-container .card-item .card-cost{width:17px;height:17px}}

/* Portrait is clipped to the transparent opening; the frame is always the top layer. */
.journey-shell .card-art-composite{overflow:hidden;contain:paint}
.journey-shell .card-art-composite .card-face-window{position:absolute;inset:11% 10% 18%;z-index:1;display:block;overflow:hidden;border-radius:2px;isolation:isolate;background:#2a2118}
.journey-shell .card-art-composite .card-character-art{position:absolute;inset:0;z-index:0;width:100%;height:100%;padding:0;object-fit:cover;object-position:center 42%;border:0;border-radius:0}
.journey-shell .card-art-composite .card-frame-art{position:absolute;inset:0;z-index:2;width:100%;height:100%;object-fit:fill;pointer-events:none}
.journey-shell .pack-reward-grid .card-art-composite .card-face-window{inset:11% 10% 18%}
.hud-hand-container .card-item{overflow:hidden;contain:paint}
.hud-hand-container .card-item .card-face-window{position:absolute;inset:9.5% 8.5% 16.5%;z-index:1;display:block;overflow:hidden;border-radius:2px;background:#2a2118}
.hud-hand-container .card-item .card-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%;border-radius:0}
.hud-hand-container .card-item .card-frame{z-index:2}

/* Trail poles reuse the real insulator mast; the cable must meet an insulator, not the wooden shaft. */
.journey-map #trailPosts{z-index:1}
.journey-map #trailPosts .climb-post{width:144px;height:76px;overflow:hidden;background:none;filter:drop-shadow(0 4px 0 #321707) drop-shadow(0 6px 5px #0009)}
.journey-map #trailPosts .climb-post>img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0;pointer-events:none}
.journey-map #trailPosts .climb-post.current{filter:drop-shadow(0 0 10px #ffcf54) drop-shadow(0 4px 0 #321707) drop-shadow(0 6px 5px #0009)}
.journey-map #trailPosts .climb-post.locked{filter:grayscale(.75) brightness(.78) drop-shadow(0 4px 0 #321707) drop-shadow(0 6px 5px #0009)}
@media(max-width:480px){.journey-map #trailPosts .climb-post{width:120px;height:68px}}

/* Small square arena illustrations distinguish the seven plazas without using UI-heavy full battle posters. */
.journey-shell #arenaLadder .journey-stop{overflow:hidden}
.journey-shell #arenaLadder .journey-stop>img.journey-stop-art{inset:auto;top:7px;right:7px;bottom:auto;left:auto;width:52px;height:52px;object-fit:cover;object-position:center 50%;z-index:2;border:2px solid #29190b;border-radius:10px;box-shadow:0 2px 0 #120b07,0 0 0 1px #ffdc83aa;filter:saturate(1.08) brightness(.98)}
.journey-shell #arenaLadder .journey-stop>.stop-crowns{right:64px;top:7px;z-index:6}
.journey-shell #arenaLadder .journey-stop>.stop-label{z-index:6}
@media(max-width:480px){.journey-shell #arenaLadder .journey-stop>img.journey-stop-art{top:6px;right:6px;width:45px;height:45px}.journey-shell #arenaLadder .journey-stop>.stop-crowns{right:55px;top:5px}}

/* The cost medallion belongs to the whole tile, above the art frame. Only the
   portrait window clips; the information panel border must not crop the cost. */
.journey-shell .collection-panel{padding-inline:6px}
.journey-shell .card-tile{overflow:visible;isolation:isolate}
.journey-shell .card-tile>.card-art-window{overflow:hidden}
.journey-shell .card-tile>.card-cost{display:flex;position:absolute;top:-5px;left:-5px;width:29px;height:29px;min-width:0;padding:0;border:0;background:none;box-shadow:none;filter:drop-shadow(0 2px 2px #120a06);z-index:8;pointer-events:none}
.journey-shell .card-tile>.card-cost img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:contain}
@media(max-width:480px){.journey-shell .card-tile>.card-cost{width:28px;height:28px}}

/* Cleaner trail: one cable, one earned glow, no ruler clutter or fake side wires. */
.journey-map{background:radial-gradient(ellipse at 78% 48%,#523923 0,#3d2b1b 48%,#2a1d13 100%)}
.journey-map::before{background:radial-gradient(ellipse 42% 190px at 78% 50%,#ffd97a12,transparent 100%),linear-gradient(90deg,#140d0966,transparent 15%,transparent 94%,#140d0966)}
.journey-map::after{opacity:.18;background:radial-gradient(ellipse 42% 150px at 78% 50%,#ffc34b1d,transparent 100%)}
#trailRegions .trail-region{border-top:1px solid color-mix(in srgb,var(--realm-glow),transparent 82%);background:linear-gradient(90deg,transparent 4%,color-mix(in srgb,var(--realm-glow),transparent 96%) 78%,transparent 100%)}
.journey-map .journey-road{filter:none}
.journey-map .journey-road .wire-cable{stroke:#72502d;stroke-width:3.5;opacity:.78}
.journey-map .journey-road .wire-progress{stroke:#fff0a0;stroke-width:4;filter:drop-shadow(0 0 5px #ffd15c);opacity:.96;animation:trail-wire-glow 1.8s ease-in-out infinite alternate}
@keyframes trail-wire-glow{to{opacity:.68;filter:drop-shadow(0 0 2px #ffbd48)}}
.journey-shell #arenaLadder li{width:56%}
.journey-shell #arenaLadder li .journey-stop{overflow:hidden}
.journey-shell #arenaLadder li .journey-stop::before{content:'';position:absolute;inset:0;left:0;top:0;width:auto;height:auto;transform:none;border:0;background:linear-gradient(90deg,#1d110680 0%,#37200e55 42%,#27160822 72%,#24140766 100%);box-shadow:none;pointer-events:none}
#crownRuler{display:none}
#trailRewards .trail-pack{left:60%!important;width:64px;min-width:64px;max-width:64px;padding:2px;filter:drop-shadow(0 2px 3px #0008)}
#trailRewards .trail-pack .pack-object{width:38px;height:40px;margin:0 auto 3px;border-width:2px;border-radius:7px 7px 11px 11px;box-shadow:inset 0 4px #fff3a5aa,inset 0 -5px #73380c88,2px 3px 0 #211308}
#trailRewards .trail-pack .pack-object::before{inset:6px 4px;border-width:1px}
#trailRewards .trail-pack .pack-object i{inset:7px 0;font-size:19px}
#trailRewards .trail-pack strong,#trailRewards .trail-pack small{padding:2px 1px;border:0;border-radius:4px;background:#21150edb;box-shadow:none;font-size:7px;line-height:1.1;white-space:nowrap}
#trailRewards .trail-pack small{font-size:6px;color:#ffe28b}
.journey-map #trailPosts .climb-post{width:104px;height:64px;transform:translate(calc(-50% + 26px),-50%);filter:drop-shadow(0 3px 3px #0008)}
.journey-map #trailPosts .climb-post.current{filter:drop-shadow(0 0 7px #ffd36b) drop-shadow(0 3px 3px #0008)}
.journey-map #trailPosts .climb-post.locked{filter:drop-shadow(0 3px 3px #0008)}
@media(max-width:480px){
  .journey-shell #arenaLadder li{width:56%}
  #trailRewards .trail-pack{width:58px;min-width:58px;max-width:58px}
  .journey-map #trailPosts .climb-post{width:96px;height:60px;transform:translate(calc(-50% + 24px),-50%)}
}

/* Plaza stops: one readable crown/status line, with the arena art kept separate. */
.journey-shell #arenaLadder li{height:104px}
.journey-shell #arenaLadder .journey-stop{padding:8px 10px 8px 52px;border-radius:14px}
.journey-shell #arenaLadder .journey-stop>.stop-number{left:8px;width:34px;height:34px;font-size:15px}
.journey-shell #arenaLadder .journey-stop>img.journey-stop-art{inset:auto;top:50%;right:8px;bottom:auto;left:auto;width:58px;height:58px;transform:translateY(-50%);border-radius:10px}
.journey-shell #arenaLadder .journey-stop>.stop-label{position:absolute;left:52px;right:74px;top:5px;bottom:5px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;margin:0;padding:0;border:0;border-radius:0;background:transparent;text-align:left}
.journey-shell #arenaLadder .journey-stop>.stop-label strong{display:-webkit-box;max-height:38px;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;color:#fff!important;font-size:16px!important;line-height:1.08;letter-spacing:-.02em;white-space:normal;text-shadow:0 2px 2px #090604,1px 0 #090604,-1px 0 #090604!important}
.journey-shell #arenaLadder .journey-stop>.stop-label small{display:block;margin:0;color:#ffe391!important;font-size:10px!important;font-weight:900;line-height:1.15;letter-spacing:.025em;text-shadow:0 1px 2px #160d08}
@media(max-width:480px){.journey-shell #arenaLadder .journey-stop>img.journey-stop-art{top:50%;right:7px;width:54px;height:54px}.journey-shell #arenaLadder .journey-stop>.stop-label{left:50px;right:68px}.journey-shell #arenaLadder .journey-stop>.stop-label strong{font-size:15px!important}}

/* Battle hand uses the original high-resolution portraits at a larger CSS size. */
.hud-hand-container .card-item .card-thumb{image-rendering:auto}
.hud-hand-container .card-item .card-cost{display:grid!important;top:1px;left:1px;width:22px;height:22px;z-index:5}
.hud-hand-container .card-item.disabled{filter:brightness(.86) saturate(.82);opacity:1}
.hud-next-slot img{object-fit:cover;object-position:center 42%;image-rendering:auto}

/* A deck tile opens a large, readable card and an attack-rule vignette. */
.card-showcase[hidden]{display:none!important}
.card-showcase{position:absolute;inset:0;z-index:30;display:grid;place-items:center;padding:10px;background:#120b08db;backdrop-filter:blur(3px)}
.card-showcase-sheet{position:relative;width:100%;max-width:500px;max-height:100%;overflow:auto;padding:16px 16px 18px;border:3px solid #f3bf43;border-radius:19px;background:radial-gradient(circle at 75% 0,#8e561f,#503017 45%,#2d1c12 100%);box-shadow:0 0 0 3px #1b110c,0 20px 38px #000c,inset 0 2px #fff4a079;color:#fff3d2;scrollbar-color:#f0ae29 #352116}
.card-showcase-sheet>header{padding:0 38px 13px 2px;border-bottom:1px solid #ecb74a77}
.card-showcase-sheet>header span{color:#ffe17d;font:900 9px/1 system-ui;letter-spacing:.11em}
.card-showcase-sheet>header h2{margin:5px 0 3px;color:#fff;font:1000 24px/1.05 system-ui;text-shadow:0 3px #261107,1px 0 #261107,-1px 0 #261107}
.card-showcase-sheet>header p{margin:0;color:#ffe391;font:900 11px/1.2 system-ui;letter-spacing:.08em}
.card-showcase-close{position:absolute;top:13px;right:13px;z-index:2;width:34px;height:34px;border:2px solid #241608;border-bottom-width:4px;border-radius:9px;background:linear-gradient(#ffea5a,#ffad12 65%,#d9650b);color:#281909;font:900 19px/1 system-ui;cursor:pointer}
.card-showcase-top{display:grid;grid-template-columns:minmax(115px,36%) minmax(0,1fr);align-items:center;gap:16px;margin:18px 0 14px}
.card-showcase-art{position:relative;width:100%;aspect-ratio:2/3;max-height:235px;filter:drop-shadow(0 8px 6px #120a08a8)}
.card-showcase-art .card-art-composite{position:absolute;inset:0;width:100%;height:100%;border-radius:10px;overflow:hidden}
.card-showcase-art .card-cost{display:flex;position:absolute;top:-7px;left:-7px;z-index:8;width:39px;height:39px;min-width:0;padding:0;border:0;background:none;box-shadow:none;filter:drop-shadow(0 2px 3px #120906)}
.card-showcase-art .card-cost img{width:100%;height:100%;object-fit:contain}
.card-showcase-data h3{margin:0 0 7px;color:#ffe182;font:1000 17px/1.1 system-ui}
.card-showcase-data p{margin:0 0 12px;color:#fff1d3;font:700 12px/1.4 system-ui}
.card-showcase-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.card-showcase-stats span{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:7px 8px;border:1px solid #f5c76a6d;border-radius:8px;background:#1e140ccf}
.card-showcase-stats strong{color:#fff;font:1000 15px/1 system-ui}
.card-showcase-stats small{color:#ffdc75;font:900 8px/1 system-ui;letter-spacing:.06em}
.card-showcase-evolution{display:grid;grid-template-columns:1fr auto;gap:6px 10px;margin:0 0 13px;padding:10px 11px;border:1px solid #c78b35;border-radius:10px;background:#21160ead;font:900 9px/1.2 system-ui}
.card-showcase-evolution span{color:#ffdd83}.card-showcase-evolution strong{color:#fff1d0;text-align:right}
.journey-shell .card-showcase-evolution progress{grid-column:1/-1;width:100%;height:9px;margin:0;border:1px solid #170d08;background:#0f0b08;border-radius:8px}
.card-showcase-preview{padding:10px;border:1px solid #df9b35;border-radius:11px;background:linear-gradient(#67401d,#3c2817 80%)}
.card-showcase-preview-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.card-showcase-preview-head h3{margin:0;color:#fff1a9;font:1000 12px/1 system-ui;letter-spacing:.07em}
.card-showcase-preview-head span{color:#ffdf7c;font:900 8px/1 system-ui}
.card-showcase-preview p{margin:7px 0 2px;color:#fff3d3;font:800 10px/1.35 system-ui}
.card-showcase-preview>small{display:block;color:#dcc5a4;font:700 9px/1.3 system-ui}
.card-demo-stage{position:relative;height:147px;overflow:hidden;border:2px solid #22150c;border-radius:9px;background:radial-gradient(ellipse at 50% 72%,#dcb77a 0,#b48149 50%,#734b2b 100%);box-shadow:inset 0 0 0 2px #fff3bd55,inset 0 12px 25px #3a241587}
.card-demo-stage::before{content:'';position:absolute;inset:0;opacity:.22;background:linear-gradient(90deg,transparent 49%,#713e1d 50%,transparent 51%),repeating-linear-gradient(0deg,transparent 0 24px,#8e5b30 25px 26px)}
.card-demo-ground{position:absolute;left:8%;right:8%;bottom:18px;height:31px;border:3px solid #70502f;border-radius:50%;background:#e6c99688;box-shadow:0 0 0 4px #ffedb653,inset 0 2px 3px #3b231466}
.card-demo-wire{position:absolute;left:24%;right:21%;bottom:63px;border-top:3px solid #3b2a20;opacity:0}
.card-demo-actor{position:absolute;left:17%;bottom:30px;z-index:4;width:71px;height:71px;overflow:hidden;border:3px solid #ffe08b;border-radius:50%;background:#543823;box-shadow:0 4px 0 #382013,0 0 0 2px #271309,0 5px 12px #1e100a9c}
.card-demo-actor img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 39%;image-rendering:auto}
.card-demo-actor.has-sprite{overflow:visible;border:0;border-radius:0;background:none;box-shadow:none}
.card-demo-actor.has-sprite img{display:none}
.card-demo-sprite{display:none;width:100%;height:100%;object-fit:contain;image-rendering:auto;filter:drop-shadow(0 4px 2px #28150dcc)}
.card-demo-actor.has-sprite .card-demo-sprite{display:block}
.card-demo-target{position:absolute;right:16%;bottom:24px;z-index:3;width:69px;height:92px;filter:drop-shadow(0 5px 3px #29150b9c)}
.card-demo-target img{width:100%;height:100%;object-fit:contain}
.card-demo-projectile{position:absolute;left:31%;bottom:74px;z-index:6;width:16px;height:16px;border:2px solid #fff3ba;border-radius:50%;background:#ffd025;box-shadow:0 0 12px 5px #ffcd42a6;opacity:0}
.card-demo-impact{position:absolute;right:15%;bottom:44px;z-index:5;width:71px;height:71px;border:4px solid #ffdc58;border-radius:50%;box-shadow:0 0 12px #ffc638, inset 0 0 13px #fff3bd;opacity:0}
.card-demo-stage[data-demo="melee"] .card-demo-actor{animation:showcase-lunge 3s ease-in-out infinite}
.card-demo-stage[data-demo="ranged"] .card-demo-projectile{animation:showcase-shot 3s ease-in-out infinite}
.card-demo-stage[data-demo="area"] .card-demo-impact{animation:showcase-burst 3s ease-out infinite}
.card-demo-stage[data-demo="support"] .card-demo-impact{border-color:#b3f58f;box-shadow:0 0 18px #80ed85,inset 0 0 12px #d3ffbe;animation:showcase-burst 3s ease-out infinite}
.card-demo-stage[data-demo="wire"] .card-demo-wire{opacity:1;animation:showcase-wire 3s ease-in-out infinite}
.card-demo-stage[data-demo="wire"] .card-demo-impact{border-color:#aff7ff;box-shadow:0 0 18px #6fd7ff,inset 0 0 12px #dcfaff;animation:showcase-burst 3s ease-out infinite}
.card-demo-stage[data-demo="generator"] .card-demo-projectile{display:grid;place-items:center;border:0;background:none;box-shadow:none;color:#ffe380;font-size:24px;animation:showcase-farelo 3s ease-out infinite}
.card-demo-stage[data-demo="generator"] .card-demo-projectile::before{content:'🥖'}
.card-demo-stage[data-demo="melee"] .card-demo-impact,.card-demo-stage[data-demo="ranged"] .card-demo-impact{animation:showcase-hit 3s ease-in-out infinite}
.card-showcase-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.card-showcase-actions button{min-height:38px;padding:5px;border:2px solid #28170b;border-bottom-width:4px;border-radius:9px;background:linear-gradient(#ffeb5e,#ffb019 66%,#e5780d);color:#27170c;font:1000 10px/1.1 system-ui;cursor:pointer}
.card-showcase-actions button:disabled{background:linear-gradient(#837362,#554639);color:#d0c5b5;cursor:default}
@keyframes showcase-lunge{0%,22%,68%,100%{transform:translateX(0) rotate(0)}43%{transform:translateX(155%) rotate(-7deg)}53%{transform:translateX(142%) rotate(3deg)}}
@keyframes showcase-shot{0%,27%{opacity:0;transform:translateX(0) scale(.6)}32%{opacity:1}60%{opacity:1;transform:translateX(720%) scale(1.2)}62%,100%{opacity:0;transform:translateX(720%) scale(1.2)}}
@keyframes showcase-hit{0%,42%,65%,100%{opacity:0;transform:scale(.4)}50%{opacity:1;transform:scale(1.1)}}
@keyframes showcase-burst{0%,33%,100%{opacity:0;transform:scale(.25)}48%{opacity:1;transform:scale(1.55)}70%{opacity:0;transform:scale(2)}}
@keyframes showcase-wire{0%,32%,68%,100%{border-color:#3b2a20;box-shadow:none}42%,53%{border-color:#b7faff;box-shadow:0 0 8px 3px #78dbff}}
@keyframes showcase-farelo{0%,26%,100%{opacity:0;transform:translate(0,0) scale(.5)}43%{opacity:1;transform:translate(85px,-28px) scale(1.2)}68%{opacity:0;transform:translate(160px,-52px) scale(.8)}}
@media(max-width:480px){.card-showcase-sheet{padding:13px}.card-showcase-top{gap:11px;margin:14px 0 11px}.card-showcase-data h3{font-size:15px}.card-showcase-data p{font-size:11px}.card-showcase-stats{gap:4px}.card-showcase-stats span{padding:6px}.card-showcase-art .card-cost{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.card-demo-stage *{animation:none!important}.card-demo-stage .card-demo-impact{opacity:.7}.card-demo-stage[data-demo="wire"] .card-demo-wire{border-color:#b7faff}}

/* Brand-led evolution header: the character, not a generic crown, owns the title. */
.journey-shell{padding-top:12px}
.journey-header{align-items:flex-start;margin-bottom:4px}
.journey-brand{display:flex;align-items:center;gap:10px;min-width:0}
.journey-brand-mark{position:relative;display:block;flex:0 0 54px;width:54px;height:54px;overflow:hidden;border:3px solid #201106;border-radius:16px;background:radial-gradient(circle at 48% 30%,#ffe67c,#f8a715 65%,#9c4512);box-shadow:0 3px 0 #170c07,0 0 0 2px #edb22a,inset 0 2px #fff5bb}
.journey-brand-mark img{position:absolute;display:block;width:195%;height:195%;max-width:none;left:-45%;top:-42%;object-fit:contain;filter:drop-shadow(0 2px 1px #180d09)}
.journey-brand-copy{display:block;min-width:0}
.journey-brand-copy .journey-eyebrow{display:block;color:#ffbb37;font:1000 13px/1 system-ui;letter-spacing:-.035em;text-shadow:0 2px #1b1008}
.journey-brand-copy .journey-eyebrow b{color:#ffdd95;font:900 8px/1 system-ui;letter-spacing:.1em}
.journey-header .journey-brand-copy h2{margin-top:4px;color:#fff4d6;font:1000 clamp(19px,5vw,25px)/1.04 system-ui;letter-spacing:-.045em;text-shadow:0 2px 0 #211207,1px 0 #211207,-1px 0 #211207}
.journey-shell #closeProgression{margin-top:5px;flex:0 0 36px}
.journey-shell .journey-balance{align-items:center;min-height:36px;margin-top:5px}
.journey-shell #crownTotal{display:flex;align-items:center;gap:5px;margin:0;color:#fff0b2;font:1000 18px/1 system-ui;text-shadow:0 2px #2c1609}
.journey-shell #crownTotal img{display:block;width:31px;height:27px;object-fit:cover;object-position:center 66%;transform:scale(1.18);filter:drop-shadow(0 2px 2px #2a1105)}
.journey-shell #journeyRank{font-size:9px;letter-spacing:.05em}
.journey-shell #crownProgress{margin:3px 0 5px;height:9px}
.journey-shell #crownNext{margin:0 0 9px;font-size:10px}

/* Keep sound available, but do not let two sliders permanently consume the deck. */
.journey-footer{padding:5px 9px 5px}
.journey-footer .sound-bar{display:flex;align-items:center;gap:8px;min-height:33px}
.journey-footer .sound-bar>button{flex:0 0 31px;width:31px;height:31px;border:2px solid #241409;border-radius:50%;background:linear-gradient(#ffed59,#f6a616);box-shadow:0 2px #1b1008;color:#271707;font-size:17px;cursor:pointer}
.journey-footer .sound-settings{flex:1;min-width:0;margin:0}
.journey-footer .sound-settings>summary{display:flex;align-items:center;justify-content:space-between;padding:5px 2px;color:#ffe8b2;font:900 10px/1.2 system-ui;cursor:pointer;list-style:none}
.journey-footer .sound-settings>summary::-webkit-details-marker{display:none}
.journey-footer .sound-settings>summary span{padding:3px 5px;border:1px solid #c28d3a;border-radius:5px;color:#ffd365;font-size:8px;letter-spacing:.08em}
.journey-footer .sound-settings[open]>summary span{color:#fff3d0}
.journey-footer .sound-settings .sound-controls{padding:8px 2px 7px;gap:12px}
.journey-footer .sound-settings .sound-controls label{color:#ffe1a4;font-weight:800}
.journey-footer #journeyNotice:empty{display:none}
.journey-footer>details:not(.sound-settings){margin-top:1px}

/* A stronger crop improves recognition on hand-sized cards without resizing the source PNG. */
.journey-shell .card-face-window .card-character-art{inset:auto;left:50%;top:43%;width:var(--portrait-width,112%);height:var(--portrait-width,112%);translate:-50% -43%;transform:none;image-rendering:auto}
.hud-hand-container .card-item .card-thumb{inset:auto;left:50%;top:42%;width:var(--portrait-width,120%);height:var(--portrait-width,120%);translate:-50% -42%;transform:none;image-rendering:auto}
.hud-hand-container .card-item.selected{z-index:8;transform:translateY(-12px) scale(1.18)}

/* Actual oPombo expressions on the result card. */
.game-over-card #crownBanner{display:grid;place-items:center;width:96px;height:96px;margin:0 auto 9px;border:3px solid #281708;border-radius:50%;background:radial-gradient(circle at 50% 35%,#ffed98,#f5ac24 65%,#a55720);box-shadow:0 4px 0 #241309,0 0 0 3px #ffdc74;overflow:hidden;filter:drop-shadow(0 4px 5px #20130977)}
.game-over-card #resultEmote{width:135%;height:135%;object-fit:contain;transform:translateY(11%);animation:result-pombo-pop .55s cubic-bezier(.2,1.5,.3,1) both}
#gameOverModal[data-result="lose"] #crownBanner{background:radial-gradient(circle at 50% 35%,#ffca9b,#cc6543 65%,#743122);box-shadow:0 4px 0 #241309,0 0 0 3px #ec9d69}
#gameOverModal[data-result="draw"] #crownBanner{background:radial-gradient(circle at 50% 35%,#eee1af,#bba86b 65%,#685534)}
@keyframes result-pombo-pop{from{opacity:0;transform:translateY(24%) scale(.65)}to{opacity:1;transform:translateY(11%) scale(1)}}
@media(max-width:480px){.journey-brand-mark{flex-basis:49px;width:49px;height:49px}.journey-brand-copy .journey-eyebrow{font-size:12px}.journey-header .journey-brand-copy h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){.game-over-card #resultEmote{animation:none}}
#actionToast.with-emote{display:flex;align-items:center;gap:7px;max-width:min(85%,330px);min-height:47px;padding:4px 10px 4px 5px;border-color:#ffc945;color:#fff1c5;border-radius:13px;font-size:11px;line-height:1.15;text-align:left}
#actionToast.with-emote img{display:block;flex:0 0 38px;width:38px;height:38px;object-fit:cover;object-position:center 39%;border:1px solid #ffdd74;border-radius:10px;background:linear-gradient(#ffdf69,#ae631c)}
#actionToast.with-emote span{min-width:0}

/* Praça trail: the existing arena illustrations become the stage art. */
.journey-brand-mark img{width:175%;height:175%;left:-38%;top:-28%;object-fit:contain}
.journey-brand-line{display:flex;align-items:center;gap:10px;min-height:27px}
.journey-logo{position:relative;display:inline-block;color:#fffdf7;font:1000 25px/1 system-ui;letter-spacing:-.095em;-webkit-text-stroke:2px #17100b;paint-order:stroke fill;text-shadow:0 3px 0 #17100b,0 6px 0 #f87711,2px 7px 0 #f04910;transform:rotate(-2deg)}
.journey-logo::after{content:'♛';position:absolute;top:-11px;left:49%;color:#ffd241;font:19px/1 Georgia;-webkit-text-stroke:1px #211409;text-shadow:0 2px #a85612;transform:rotate(8deg)}
.journey-mode{padding:3px 5px;border:1px solid #b5884d;border-radius:5px;background:#291b12;color:#ffe09b;font:900 7px/1 system-ui;letter-spacing:.08em;white-space:nowrap}
.journey-header .journey-brand-copy h2{margin-top:4px;color:#fff0cb;font-size:19px;letter-spacing:-.025em}
.journey-shell #journeyScroll{border-color:#80bcbb66;scrollbar-color:#f2ba47 #173845;background:#102d3a}
.journey-map{background-image:linear-gradient(180deg,#08273dcc,#092638db),url('assets/image-quality/variants/crown_road_panorama-280c5cf3b912-512.webp');background-image:linear-gradient(180deg,#08273dcc,#092638db),image-set(url('assets/image-quality/variants/crown_road_panorama-280c5cf3b912-512.webp') 1x,url('assets/arena/crown_road_panorama.png') 2x);background-size:100% 100%,cover;background-position:center,center;background-repeat:no-repeat}
.journey-map{height:1700px}
.journey-map .journey-road{height:1700px}
.journey-map::before{background:radial-gradient(ellipse 55% 200px at 78% 50%,#9de6dd16,transparent 100%),linear-gradient(90deg,#071e2e99,transparent 18%,transparent 91%,#071e2e99)}
.journey-map::after{opacity:.28;background:repeating-linear-gradient(0deg,transparent 0 100px,#e5dfb116 101px,transparent 103px 200px),radial-gradient(ellipse at 80% 50%,#c5f4e619,transparent 46%)}
#trailRegions .trail-region{border-top:1px solid color-mix(in srgb,var(--realm-glow),transparent 73%);background:radial-gradient(ellipse at 22% 52%,color-mix(in srgb,var(--realm-glow),transparent 84%),transparent 62%)}
#trailRegions .trail-region{overflow:hidden}
.journey-map .journey-road .wire-cable{stroke:#32444b;stroke-width:4;opacity:1}
.journey-map .journey-road .wire-progress{stroke:#ffe78c;stroke-width:5}
.journey-shell #arenaLadder li{width:63%;height:116px}
.journey-shell #arenaLadder li .journey-stop{display:block;padding:0;border:2px solid color-mix(in srgb,var(--realm),#172d39 32%);border-left:2px solid color-mix(in srgb,var(--realm),#172d39 32%);border-radius:15px;overflow:hidden;background:#102b3a;box-shadow:0 4px 0 #071821,0 9px 17px #00162299;color:#fff}
.journey-shell #arenaLadder .journey-stop::before{z-index:1;background:linear-gradient(180deg,#061a2738 0%,transparent 35%,#06172233 50%,#061722d9 100%)}
.journey-shell #arenaLadder .journey-stop::after{inset:3px;border:1px solid #ffffff37;border-radius:11px;background:none;z-index:8}
.journey-shell #arenaLadder .journey-stop>img.journey-stop-art{position:absolute;inset:0;top:0;left:0;right:0;bottom:0;width:100%;height:100%;transform:none;object-fit:cover;object-position:center 39%;border:0;border-radius:0;box-shadow:none;filter:saturate(1.22) contrast(1.06)}
.journey-shell #arenaLadder .journey-stop>.stop-number{top:8px;left:8px;transform:none;width:29px;height:29px;z-index:7;font-size:14px;box-shadow:0 2px 0 #173142,0 0 0 2px #ffffff80}
.journey-shell #arenaLadder .journey-stop>.stop-label{position:absolute;z-index:7;left:0;right:0;top:auto;bottom:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px;min-height:53px;padding:4px 10px 6px;border:0;border-top:2px solid color-mix(in srgb,var(--realm),transparent 20%);border-radius:0 0 11px 11px;background:#0b2430;text-align:left;overflow:hidden}
.journey-shell #arenaLadder .stop-serial{color:var(--realm);font:1000 8px/1 system-ui;letter-spacing:.15em;text-shadow:0 1px #06151f}
.journey-shell #arenaLadder .journey-stop>.stop-label strong{display:-webkit-box;max-height:35px;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;color:#fff!important;font:1000 16px/1.06 system-ui!important;letter-spacing:-.045em;white-space:normal;-webkit-text-stroke:0;text-shadow:0 2px #08151d!important}
.journey-shell #arenaLadder .journey-stop>.stop-label small{display:block;margin:1px 0 0;color:#f9df9b!important;font:900 8px/1.15 system-ui!important;letter-spacing:0;text-shadow:0 1px #071823}
.journey-shell #arenaLadder .current .journey-stop{border-color:#ffe78e;border-left-color:#ffe78e;box-shadow:0 0 0 2px #172a31,0 0 21px #ffd56b88,0 4px 0 #0b1c24}
.journey-shell #arenaLadder .locked .journey-stop>img.journey-stop-art{filter:saturate(.9) brightness(.9)}
.journey-shell #arenaLadder .locked .stop-label{background:linear-gradient(105deg,#122d3ef5,#0d2838eb)}
.journey-shell #arenaLadder .journey-stop:focus-visible{outline:3px solid #74dbff;outline-offset:3px}
#trailRewards .trail-pack .pack-object i{inset:4px 0;display:grid;place-items:center}
#trailRewards .trail-pack .pack-object i img{display:block;width:25px;height:25px;object-fit:contain;filter:drop-shadow(0 1px #231707)}
#trailRewards .trail-pack strong,#trailRewards .trail-pack small{background:#0b2530ed}
#trailPlayer>img{object-fit:cover;object-position:center 50%}
@media(max-width:480px){.journey-shell #arenaLadder li{width:63%;height:108px}.journey-shell #arenaLadder .journey-stop>.stop-label{left:0;padding-left:9px}.journey-shell #arenaLadder .journey-stop>.stop-label strong{font-size:14px!important}.journey-shell #arenaLadder .journey-stop>img.journey-stop-art{width:100%}.journey-brand-line{gap:6px}.journey-logo{font-size:22px}.journey-mode{font-size:6px}.journey-header .journey-brand-copy h2{font-size:18px}}
@media(prefers-reduced-motion:reduce){.journey-map .journey-road .wire-progress{animation:none}}
