*{box-sizing:border-box}
html{overflow-x:hidden}
body{margin:0;color:#fff;background:#126cda;font-family:'Trebuchet MS',Arial,sans-serif;min-height:100dvh;overflow-x:hidden;overflow-y:auto}
body:before{content:'';position:fixed;inset:0;background:linear-gradient(#129aff30,#073b7b80),url('/shared/harbor.webp') center/cover no-repeat;filter:saturate(1.45) brightness(1.1);z-index:-1}
.adventure-hub{max-width:1060px;min-width:0;margin:auto;padding:max(28px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(32px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));text-align:center}
header .compass{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 14px;background:linear-gradient(#fff23a 0 52%,#ffce20 52%);border:4px solid #092747;border-radius:50%;color:#092747;font-size:37px;box-shadow:inset 0 2px #ffffa1,0 4px #092747}
header>p:first-of-type{font:700 clamp(20px,5vw,28px)/1.3 'Midgard Runes',fantasy;letter-spacing:3px;color:#74ffdf;margin:8px 0;text-shadow:1px 1px #092747,-1px -1px #092747,0 3px #092747}
h1{font:700 clamp(44px,11vw,104px)/1.15 'Midgard Runes',fantasy;letter-spacing:2px;margin:0;color:#fff23a;-webkit-text-stroke:2px #092747;paint-order:stroke fill;text-shadow:0 5px #092747,0 9px #09274770}
.tagline{font-size:clamp(16px,3.8vw,21px);font-weight:900;margin:20px 0 30px;color:#fffbd0;text-shadow:1px 1px #092747,-1px -1px #092747,0 2px #092747}
.game-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.game-card{min-width:0;display:flex;flex-direction:column;align-items:center;text-decoration:none;color:inherit;padding:28px 24px;background:linear-gradient(155deg,#167be9 0 48%,#1059c5 48% 100%);border:5px solid #092747;border-radius:28px;box-shadow:inset 0 0 0 3px #71eaff,0 8px #092747,0 16px 30px #00182c60;transition:transform .15s}
.game-card:hover{transform:translateY(-4px)}
.game-card:focus-visible{outline:4px solid #fff23a;outline-offset:6px}
.mode-label{font:700 clamp(15px,3.6vw,18px)/1.3 'Midgard Runes',fantasy;letter-spacing:1px;color:#74ffdf;text-shadow:1px 1px #092747,-1px -1px #092747,0 2px #092747}
.game-symbol{display:grid;place-items:center;border-radius:20px;border:4px solid #092747;background:linear-gradient(#fff23a 0 52%,#ffce20 52%);width:68px;height:68px;font-size:40px;color:#092747;margin:18px 0;box-shadow:inset 0 2px #ffffa1,0 5px #092747}
h2{font:700 clamp(30px,4vw,44px)/1.15 'Midgard Runes',fantasy;margin:0;color:#fff23a;letter-spacing:1px;-webkit-text-stroke:1.5px #092747;paint-order:stroke fill;text-shadow:0 4px #092747}
h2 small{display:block;font:700 17px/1.3 'Midgard Runes',fantasy;letter-spacing:3px;margin:8px 0;color:#74ffdf;-webkit-text-stroke:0;text-shadow:1px 1px #092747,-1px -1px #092747,0 2px #092747}
.game-card p{font-size:17px;line-height:1.55;font-weight:800;max-width:340px;margin:20px 0;color:#fffbd0;text-shadow:0 2px #092747}
.game-card ul{display:flex;justify-content:center;flex-wrap:wrap;list-style:none;margin:0 0 25px;padding:0;gap:9px}
.game-card li{border:2px solid #71eaff;border-radius:12px;padding:8px 10px;font-size:13px;font-weight:900;background:#073980;color:#d9f5ff}
.play-button{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:10px;min-width:0;min-height:86px;width:100%;padding:16px 12px;border:4px solid #092747;border-radius:18px;background:linear-gradient(#b8ff35 0 52%,#83e817 52%);color:#092747;font:700 clamp(20px,2.8vw,27px)/1.3 'Midgard Runes',fantasy;text-align:center;box-shadow:inset 0 3px #edffb1,0 6px #092747;text-shadow:0 1px #efffc1}
.play-button>.play-label{min-width:0;flex-shrink:1}
.play-button>[aria-hidden]{flex-shrink:0;font-size:30px}
.game-card:hover .play-button{background:linear-gradient(#d5ff63 0 52%,#a2f632 52%)}
footer{font-size:16px;font-weight:900;line-height:1.7;margin-top:32px;color:#fffbd0;text-shadow:1px 1px #092747,-1px -1px #092747,0 2px #092747}
footer span{font-size:13px;color:#d9f5ff}
@media(max-width:640px){.adventure-hub{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}.game-choices{grid-template-columns:1fr;gap:28px}.game-card{padding:24px 20px}.game-symbol{margin:16px 0;width:60px;height:60px;font-size:35px}.tagline{margin-bottom:27px}h2{font-size:34px}.game-card p{margin:18px 0}.play-button{font-size:24px;min-height:88px}}
@media(max-width:360px){.game-card{padding:22px 16px}.play-button{font-size:21px;gap:7px}h2{font-size:31px}}
@media(prefers-reduced-motion:reduce){.game-card{transition:none}}

/* Both adventures sit on shaded Viking shields, including on phones. */
.game-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,3vw,30px);max-width:900px;margin:0 auto}
.game-card,.race-card{padding:0 0 6px;border:0;border-radius:20px;box-shadow:none;background:none;gap:0}
.game-card:hover{transform:none}
.shield-choice{position:relative;width:100%;aspect-ratio:400/430;transition:transform .15s;filter:none}
.shield-choice img{display:block;width:100%;height:auto}
.shield-choice h2{position:absolute;top:38%;left:13%;right:13%;margin:0;font:700 clamp(15px,4.4vw,44px)/1.14 'Midgard Runes',fantasy;color:#fff23a;letter-spacing:0;-webkit-text-stroke:1px #092747;paint-order:stroke fill;text-shadow:0 3px #092747}
.shield-choice h2 small{font-size:clamp(10px,2.8vw,18px);line-height:1.1;letter-spacing:1px;margin:4px 0;color:#fffbd0;text-shadow:1px 1px #092747,-1px -1px #092747,0 2px #092747}
.game-card .shield-detail{margin:0 0 15px;font-size:clamp(12px,3.2vw,18px);line-height:1.5;color:#fffbd0;font-weight:900;text-shadow:1px 1px #092747,-1px -1px #092747,0 2px #092747}
.game-card .play-button{min-height:64px;aspect-ratio:auto;margin-top:auto;padding:12px 9px;gap:8px;border-width:3px;font-size:clamp(14px,3.7vw,25px);border-radius:15px;box-shadow:inset 0 2px #edffb1,0 5px #092747}
.game-card .play-button>[aria-hidden]{font-size:clamp(18px,4vw,28px)}
.game-card:hover .shield-choice{transform:translateY(-5px) rotate(-2deg)}
.race-card:hover .shield-choice{transform:translateY(-5px) rotate(2deg)}
.game-card:active .shield-choice{transform:translateY(2px)}
@media(max-width:640px){.game-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.game-card{padding:0 0 6px}.shield-choice h2{font-size:clamp(15px,4.4vw,28px)}.game-card .play-button{font-size:clamp(13px,3.7vw,22px);min-height:66px;gap:5px;padding:11px 7px}}
@media(prefers-reduced-motion:reduce){.shield-choice{transition:none}.game-card:hover .shield-choice{transform:none}}

.trading-card{grid-column:1/-1;width:calc((100% - clamp(10px,3vw,30px))/2);justify-self:center;margin-top:18px}.trading-card .shield-choice h2{font-size:clamp(15px,4vw,40px)}.trading-card .shield-choice h2 small{font-family:'Trebuchet MS',sans-serif;font-size:clamp(8px,1.7vw,15px);letter-spacing:0}@media(max-width:640px){.trading-card{width:calc((100% - 12px)/2)}.trading-card .shield-choice h2{font-size:clamp(14px,4vw,26px)}}

/* Visible player account entry on the adventure landing page. */
.player-account{max-width:650px;margin:0 auto 32px;padding:22px clamp(16px,4vw,30px);border:2px solid #8dc7d7;border-radius:20px;background:#102e43ed;color:#f6f4df;box-shadow:0 6px 20px #06243e44;text-align:center}
.player-account .account-rune{color:#ffe18b;font-size:30px}
.player-account h2{margin:6px 0 12px;font:700 clamp(23px,5vw,32px)/1.2 'Trebuchet MS',sans-serif;color:#ffe18b;text-shadow:none}
.player-account p{font:400 16px/1.55 'Trebuchet MS',sans-serif;margin:10px 0}
.player-account .account-note{font-size:13px;color:#c6e6ee}
.account-controls summary{cursor:pointer;font:700 17px/1.5 'Trebuchet MS',sans-serif}
.account-controls a,.account-controls button{display:block!important;box-sizing:border-box;width:100%;max-width:360px;margin:12px auto;padding:13px 18px!important;border:2px solid #ffe18b;border-radius:12px;font:700 17px/1.3 'Trebuchet MS',sans-serif;color:#122c3b!important;background:#ffe18b;text-decoration:none;cursor:pointer}
.account-controls a:focus-visible,.account-controls button:focus-visible{outline:3px solid white;outline-offset:4px}

.world-board-link{display:block;margin:18px auto 8px;padding:14px 18px;max-width:400px;border:2px solid #ffe09a;border-radius:12px;background:#264c62;color:#ffe09a;font:700 17px/1.4 "Trebuchet MS",sans-serif;text-decoration:none}.world-board-link:focus-visible{outline:3px solid white;outline-offset:3px}

/* Four shields form a balanced two-by-two adventure menu. */
.trading-card,.profile-card{grid-column:auto;width:100%;justify-self:stretch;margin-top:18px}
.profile-card .shield-choice h2{font-size:clamp(15px,4vw,40px)}.profile-card .shield-choice h2 small{font-family:'Trebuchet MS',sans-serif;font-size:clamp(8px,1.7vw,15px);letter-spacing:0}
.profile-card .play-button{background:linear-gradient(#ffd4bd,#ef8a75 52%,#d95b58);color:#fff5d6;text-shadow:0 2px #71333f;box-shadow:inset 0 2px #ffe4bc,0 5px #71333f}.profile-card:hover .play-button{background:linear-gradient(#ffe0c8,#f29d81 52%,#df6a63)}
@media(max-width:640px){.trading-card,.profile-card{width:100%}.profile-card .shield-choice h2{font-size:clamp(14px,4vw,26px)}}

/* Broad, dimensional wordmark: use the existing palette and rune font. */
.adventure-hub>.midgard-hero{display:block;position:relative;height:auto;min-height:0;width:100%;max-width:none;margin:0 0 28px;padding:0;background:none;text-align:center}
.midgard-hero .compass{width:clamp(54px,10vw,78px);height:clamp(54px,10vw,78px);font-size:clamp(34px,6vw,50px);margin:0 auto 18px}
.midgard-hero .hero-title{display:block;width:100%;margin:0;line-height:1;font-size:inherit;letter-spacing:0;-webkit-text-stroke:0;text-shadow:none}
.hero-title svg{display:block;width:100%;height:auto;overflow:visible}
.hero-title text{font-family:'Midgard Runes',fantasy;font-weight:900;paint-order:stroke fill;stroke-linejoin:round}
.hero-kicker text{font-size:81px;letter-spacing:0;fill:#74ffdf;stroke:#092747;stroke-width:9px}
.hero-kicker .hero-kicker-shadow{fill:#092747;stroke:#092747;stroke-width:10px}
.hero-name text{font-size:211px;letter-spacing:0;stroke:#092747;stroke-width:14px}
.hero-name .hero-deep-shadow{fill:#105177;stroke:#105177;stroke-width:17px}
.hero-name .hero-near-shadow{fill:#092747;stroke-width:18px}
.hero-name .hero-gold{fill:#fff23a}
.midgard-hero>.tagline{display:block;margin:12px auto 0;max-width:none;font-size:clamp(15px,3.8vw,29px);font-weight:900;line-height:1.35;letter-spacing:0;color:#fffbd0;text-shadow:2px 2px #092747,-1px -1px #092747,0 4px #092747}
@media(max-width:640px){.adventure-hub{padding-top:max(20px,env(safe-area-inset-top))}.adventure-hub>.midgard-hero{width:calc(100% + 12px);margin-left:-6px;margin-bottom:24px}.midgard-hero .compass{margin-bottom:12px}.midgard-hero>.tagline{font-size:clamp(13px,3.55vw,22px);margin-top:10px}}