.journey-page{background:#143f50;color:#fff}
.journey-page .site-header{background:#101a2c;box-shadow:0 2px 0 #061b27}
.journey-page .brand-copy strong,.journey-page .main-nav a{color:#eef8ff}
.journey-page .brand-copy small{color:#8bd8ed}
.journey-page .main-nav a:hover,.journey-page .main-nav a[aria-current=page]{color:#f8d447}
.journey-page .header-actions [data-user] button{background:#5268e9;box-shadow:0 4px 0 #273a95}
.world-map{min-height:100vh}
.map-hud{position:absolute;top:22px;left:max(24px,calc((100vw - 1250px)/2));right:max(24px,calc((100vw - 1250px)/2));z-index:24;display:flex;align-items:center;justify-content:space-between;gap:20px;pointer-events:none}
.map-hud>strong{font-size:20px;white-space:nowrap;letter-spacing:.02em;text-shadow:0 2px 8px #061b27}
.map-hud>strong small{font-size:11px;font-weight:650;color:#a8cddd;margin-left:10px}
.hud-right{display:flex;align-items:center;justify-content:flex-end;gap:13px;text-shadow:0 2px 8px #061b27}
.hud-score{font-size:12px;font-weight:750;color:#d6ebed;white-space:nowrap}
.hud-score b{font-size:18px;color:#f8d447;text-shadow:0 2px #052a32}
.hud-owner{font-size:11px;color:#a8cddd;white-space:nowrap}
#musicToggle{pointer-events:auto;background:#234e6a;border:1px solid #68a1b7;border-radius:7px;color:#eafaff;font-size:12px;font-weight:850;padding:9px 11px;white-space:nowrap}
#musicToggle:hover,#musicToggle[aria-pressed=true]{background:#e2f65b;color:#183648;border-color:#e2f65b}
.map-surface{position:relative;overflow:hidden;min-height:100vh;background:radial-gradient(circle at 50% 13%,#1d5868 0,transparent 28%),radial-gradient(circle at 50% 73%,#20677570 0,transparent 33%),linear-gradient(180deg,#174b5d,#123d4d 55%,#0e3546)}
.map-surface:before{content:"";position:absolute;inset:0;opacity:.32;pointer-events:none;background-image:linear-gradient(45deg,transparent 47%,#071d2965 48%,#071d2965 50%,transparent 51%),linear-gradient(-45deg,transparent 47%,#071d2965 48%,#071d2965 50%,transparent 51%);background-size:260px 260px}
.map-surface:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 0,transparent 40%,#071d2940 100%)}
.map-main-path{position:absolute;left:50%;top:70px;bottom:120px;width:4px;transform:translateX(-50%);background:repeating-linear-gradient(to bottom,#97e7de 0 18px,transparent 18px 34px);opacity:.55;filter:drop-shadow(0 0 5px #40dfd1)}
.map-destinations{position:relative;z-index:1;max-width:1280px;margin:auto;padding:18px 18px 95px}
.world-row{--lane-shift:clamp(150px,18vw,230px);position:relative;height:360px;scroll-margin-top:150px}
.world-row:first-child{height:500px}
.world-row:last-of-type{height:490px}
.world-row--left:before,.world-row--right:before{content:"";position:absolute;top:145px;width:var(--lane-shift);border-top:3px dashed #86e1da;opacity:.55}
.world-row--left:before{right:50%}
.world-row--right:before{left:50%}
.world-row:has(.side-world){--side-right:4%;--side-width:255px;--side-link-width:95px}
.world-row:has(.side-world):after{content:"";position:absolute;z-index:0;left:50%;top:145px;width:calc(50% - var(--side-right) - var(--side-width) - var(--side-link-width) + 18px);border-top:3px dashed #86e1da;opacity:.85;transform:rotate(7deg);transform-origin:left center;pointer-events:none}
.world-core{position:absolute;z-index:1;top:0;left:50%;translate:-50% 0;display:flex;align-items:center;flex-direction:column;width:min(430px,43vw)}
.world-row--left .world-core{transform:translateX(calc(-1 * var(--lane-shift)))}
.world-row--right .world-core{transform:translateX(var(--lane-shift))}
.world-art{display:block;width:100%;aspect-ratio:1312/1199;background-repeat:no-repeat;background-size:contain;background-position:center;filter:drop-shadow(0 20px 13px #051d2b7a);transition:transform .2s}
.world-row:hover .world-art{transform:translateY(-5px)}
.world-row.is-planned .world-art{filter:grayscale(.35) brightness(.9) drop-shadow(0 18px 12px #061c2b88)}
.world-row.is-locked .world-art{filter:grayscale(.25) brightness(.9) drop-shadow(0 18px 12px #061c2b88)}
.world-row.is-locked .world-action{background:#607282;color:#edf4f7;text-shadow:none}
.world-row.is-locked .world-code{color:#dce8ea}
.world-caption{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:-102px;max-width:420px}
.world-code{font:900 12px/1 ui-monospace,monospace;letter-spacing:.12em;color:#fff3a3;text-shadow:1px 2px #082a3c,0 0 9px #072637;background:#133950d9;border:1px solid #8dc5cb8a;border-radius:40px;padding:6px 10px}
.world-caption h2{font-size:clamp(28px,3vw,40px);font-weight:950;letter-spacing:-.045em;margin:5px 0 2px;color:#fff;text-shadow:0 3px 0 #071922,2px 0 0 #071922,-2px 0 0 #071922,0 0 10px #071922}
.world-progress{font-size:16px;font-weight:900;color:#f9f6d7;text-shadow:0 3px 3px #071b29,1px 1px #071b29,-1px -1px #071b29}
.world-progress .done-star{color:#f8d447}
.world-action{display:inline-block;min-width:100px;margin-top:10px;padding:9px 18px;background:#13b879;color:#fff;border:3px solid #062a30;border-radius:6px;box-shadow:0 5px 0 #071b25;font-size:17px;font-weight:950;line-height:1.2;text-shadow:0 1px #125942;cursor:pointer}
.world-action:hover{background:#22cd8a;transform:translateY(-2px);box-shadow:0 7px 0 #071b25}
.world-action:focus-visible{outline:3px solid #f5d34b;outline-offset:4px}
.is-planned .world-action{background:#547484;color:#e3edf0;text-shadow:none}
.is-planned .world-action:hover{background:#688b9b}
.world-hint{max-width:330px;margin:13px 0 0;padding:9px 17px;background:#eee4c5;color:#273548;font-size:12px;font-weight:750;line-height:1.5;border:2px solid #304250;box-shadow:0 4px 0 #092d3a;clip-path:polygon(0 0,98% 0,100% 13%,100% 100%,2% 100%,0 88%)}
.world-hint b{color:#1b5d7d}
.realm-marker{position:relative;z-index:2;width:max-content;max-width:calc(100vw - 34px);margin:1px auto 30px;padding:7px 19px;border:1px solid #78becc;border-radius:100px;background:#0c2b3d;color:#b5dbe4;font-size:12px;font-weight:900;letter-spacing:.12em;text-align:center}
.side-world{position:absolute;right:var(--side-right,4%);top:55px;width:var(--side-width,255px);z-index:3;text-align:center}
.side-world:before{content:"";position:absolute;right:calc(100% - 14px);top:107px;width:var(--side-link-width,95px);border-top:3px dashed #86e1da;transform:rotate(-15deg);opacity:.85}
.side-world .side-label{display:block;color:#b5eced;font-size:10px;letter-spacing:.14em;font-weight:900;margin-bottom:-8px}
.side-art{display:block;width:100%;aspect-ratio:1;background:url("/web/journey/assets/x-python-island-hd.png") center/contain no-repeat;filter:drop-shadow(0 13px 11px #041d2a99);transition:transform .2s}
.side-world:hover .side-art{transform:translateY(-5px)}
.side-world h3{font-size:23px;font-weight:950;margin:-39px 0 2px;position:relative;text-shadow:0 3px 0 #071b25,0 0 10px #071b25}
.side-world p{position:relative;margin:0;color:#d1edf0;font-size:11px;font-weight:750;text-shadow:0 2px #072534}
.side-world a{display:inline-block;position:relative;margin-top:9px;padding:8px 14px;background:#3a69d5;border:2px solid #0c2a44;border-radius:6px;box-shadow:0 4px 0 #071b25;color:#fff;font-size:12px;font-weight:900}
.side-world a:hover{background:#5281ed}
.side-world small{display:block;margin-top:9px;color:#b7d5dc;font-size:10px;line-height:1.4}
.side-world.is-locked .side-art{filter:grayscale(.35) brightness(.88) drop-shadow(0 13px 11px #041d2a99)}
.side-world.is-locked a{background:#647587}
.map-ending{max-width:390px;margin:3px auto 0;text-align:center;color:#b2d7dc;font-size:12px;line-height:1.7}
.module-dialog{width:min(480px,calc(100vw - 30px));border:2px solid #13335c;border-radius:20px;padding:32px;background:#f9fcff;color:#153153;box-shadow:0 20px 70px #07142f66}
.module-dialog::backdrop{background:#07172bbc;backdrop-filter:blur(3px)}
.dialog-close{position:absolute;right:17px;top:13px;border:0;background:transparent;color:#48617b;font-size:26px;cursor:pointer}
.dialog-code{display:inline-block;background:#d9fc5d;padding:7px 10px;border-radius:7px;font:900 13px ui-monospace,monospace}
.module-dialog h2{font-size:31px;margin:15px 0 5px}
.module-dialog>p{font-size:14px;line-height:1.7;color:#52677e}
.dialog-learn{background:#e8f3fa;border-radius:12px;padding:16px;margin:20px 0}
.dialog-learn strong{font-size:13px;color:#2457b9}
.dialog-learn p{font-size:14px;line-height:1.7;margin:5px 0 0}
.dialog-action{width:100%;border:0;border-radius:10px;background:#265ad5;color:#fff;font-size:14px;font-weight:850;padding:13px;cursor:pointer}
@media(max-width:1100px){.world-row:has(.side-world){--side-right:1%;--side-width:215px;--side-link-width:52px}.world-core{width:min(390px,39vw)}.world-row{--lane-shift:clamp(130px,16vw,185px)}}
@media(max-width:900px){.map-hud>strong small{display:none}.hud-right{flex-wrap:wrap;max-width:70%;gap:7px}.hud-owner{max-width:100%;overflow:hidden;text-overflow:ellipsis}.world-row--left:before,.world-row--right:before,.world-row:has(.side-world):after{display:none}.world-row--left .world-core,.world-row--right .world-core{transform:none}.world-core{width:min(430px,70vw)}.world-row{height:510px}.world-row:last-of-type{height:510px}.side-world{position:relative;top:500px;right:auto;width:220px;margin:-10px auto 35px}.side-world:before{right:auto;left:50%;top:-33px;width:0;height:35px;border-top:0;border-left:3px dashed #86e1da;transform:none}.world-row:has(.side-world){height:825px}}
@media(max-width:620px){.map-hud{top:14px;left:15px;right:15px;gap:7px;align-items:flex-start}.map-hud>strong{font-size:15px;padding-top:6px}.hud-right{max-width:230px;gap:5px 8px}.hud-score{font-size:10px}.hud-score b{font-size:13px}.hud-owner{order:3;width:100%;font-size:10px;text-align:right}#musicToggle{order:4;font-size:10px;padding:8px}.map-destinations{padding:66px 9px 75px}.world-row,.world-row:first-child{height:485px;scroll-margin-top:120px}.world-row:last-of-type{height:500px}.world-core{width:min(390px,92vw)}.world-caption{margin-top:-98px}.world-caption h2{font-size:29px}.world-progress{font-size:13px}.world-hint{max-width:min(300px,84vw);font-size:11px}.world-action{font-size:15px;padding:8px 14px}.world-row:has(.side-world){height:790px}.side-world{width:205px;top:475px;margin-top:-20px}.realm-marker{font-size:10px}.map-main-path{opacity:.4}}
@media(prefers-reduced-motion:reduce){.world-art,.side-art{transition:none}}
