@font-face{font-family:Barlow;src:url('/vr/fonts/barlow-condensed-500.woff2')}@font-face{font-family:Barlow;src:url('/vr/fonts/barlow-condensed-700.woff2');font-weight:700}@font-face{font-family:Barlow;src:url('/vr/fonts/barlow-condensed-800.woff2');font-weight:800}
:root{color-scheme:dark;--ink:#16120e;--gold:#c9a66b;--mint:#9fcfc2;--white:#efe6d4}
/* Mythic realism: weathered bronze and dark iron frames, parchment text, slate and umber panels, restrained team colours.
   Cinzel names and titles; Barlow Condensed carries numbers and controls. Depth comes from inner shadows, not glows. */
:root{--mr-night:#0f0d0b;--mr-umber:#1c1712;--mr-panel:#1a1612ee;--mr-panel-solid:#1a1612;--mr-iron:#25221e;--mr-iron-hi:#3a352e;--mr-line:#4d4337;--mr-bronze:#9a7a4b;--mr-bronze-hi:#c9a66b;--mr-bronze-lo:#5c4630;--mr-gold:#dcb46e;--mr-parchment:#ecdfc4;--mr-text:#d9cfbc;--mr-muted:#aea38f;--mr-ally:#6aa99c;--mr-ally-text:#9fd0c3;--mr-enemy:#ad5446;--mr-enemy-text:#e5998a;--mr-mana:#4f7eae;--mr-life:#7c9c52;--mr-title:Cinzel,Barlow,serif;--mr-ui:Barlow,sans-serif;--mr-bevel:inset 0 1px 0 #ffffff14,inset 0 0 0 1px #0000008c,inset 0 -12px 18px #00000038;--mr-frame:0 0 0 1px #000000b3,0 6px 18px #000000a6;--mr-plate:linear-gradient(180deg,#2a251f,#1b1814 60%,#15120f)}
/* Hero colours are bright identity hues; frames use them toned down toward bronze. */
*{--hero-tone:color-mix(in oklab,var(--hero-color,#9a7a4b) 52%,#7d6a50)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink);color:var(--white);font-family:Barlow,sans-serif;overscroll-behavior:none}body{touch-action:none;-webkit-user-select:none;user-select:none}button{font:700 16px Barlow,sans-serif;color:inherit;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid var(--mr-gold);outline-offset:3px}button:disabled{cursor:default}button svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}button:active{filter:brightness(1.25)}[hidden]{display:none!important}#battle{position:fixed;inset:0;width:100%;height:100%}#hud{position:fixed;inset:0;pointer-events:none}#hud button,#joystick{pointer-events:auto}
header{height:calc(49px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 12px 0;display:flex;justify-content:space-between;align-items:center;background:#1b1712ed;border-bottom:1px solid #ae945e66}.wordmark{font-size:14px;letter-spacing:3px;color:#e7e3dc}.score{position:absolute;top:env(safe-area-inset-top);left:50%;transform:translateX(-50%);width:118px;height:64px;text-align:center;background:#251f19;clip-path:polygon(0 0,100% 0,86% 100%,14% 100%);font-size:27px;line-height:34px;border-bottom:1px solid var(--gold)}.score span:first-child{color:var(--mr-ally-text)}.score span:nth-of-type(2){color:var(--mr-enemy-text)}.score i{font-style:normal;font-size:20px;padding:0 10px;color:var(--gold)}.score time{display:block;font-size:14px;line-height:17px;letter-spacing:1px}.pause{background:none;border:0;width:44px;height:44px}.pause svg{width:21px;stroke-width:3}
#minimap{position:absolute;top:calc(64px + env(safe-area-inset-top));left:12px;width:82px;height:82px;border:1px solid var(--gold);border-radius:2px;background:#14100d}#objective{position:absolute;top:calc(77px + env(safe-area-inset-top));left:105px;right:10px;text-align:center;text-shadow:0 2px 5px #16130f}#objective b{font-size:18px;letter-spacing:.4px}#objective-sub{display:block;font-size:13px;color:#c7d5d2;margin-top:3px}.utility{position:absolute;right:12px;top:calc(136px + env(safe-area-inset-top));min-width:87px;min-height:47px;padding:6px 10px;background:#1c1813de;border:1px solid #b7a27275;font-size:16px;color:#f8e0ae}.utility small{display:block;font-size:11px;color:#cbd7d4;letter-spacing:.5px}#recall{top:calc(191px + env(safe-area-inset-top));font-size:13px;color:#e9e3d8}#shop.available{box-shadow:0 0 18px #dcbf6e40;border-color:#ddbe7c}#notice{position:absolute;top:30%;left:50%;transform:translateX(-50%);width:min(90%,420px);text-align:center;transition:opacity .4s;text-shadow:0 2px 5px #100d0b;pointer-events:none}#notice b{display:block;font-size:25px;color:#f0e7d4;letter-spacing:1px}#notice small{display:block;font-size:15px;margin-top:4px;color:#edebe6}#respawn{position:absolute;inset:40% 0 auto;text-align:center;font-size:24px;background:#1b1712d4;padding:20px}#respawn strong{display:block;font-size:50px;color:var(--gold)}
#controls{position:absolute;bottom:calc(18px + env(safe-area-inset-bottom));left:0;right:0;height:178px;background:linear-gradient(0deg,#1b17129e,transparent);pointer-events:none}#joystick{position:absolute;bottom:22px;left:18px;width:116px;height:116px;border:1px solid #d6b2718f;border-radius:50%;background:#1b17123b;box-shadow:inset 0 0 18px #74a39a20}#thumb{position:absolute;left:36px;top:36px;width:42px;height:42px;border-radius:50%;border:2px solid #bed4d0;background:#749ac670;box-shadow:0 0 12px #ded1b825}#joystick small{position:absolute;bottom:-20px;width:100%;text-align:center;font-size:11px;letter-spacing:2px;color:#c6d5d2}.abilities{position:absolute;bottom:10px;right:14px;width:186px;height:190px;pointer-events:none}.abilities button{pointer-events:auto;position:absolute;border:2px solid var(--gold);border-radius:50%;background:radial-gradient(circle at 35% 30%,#396259e0,#251f19eb 65%);box-shadow:0 2px 9px #0006;color:#f5efe4}.ability{width:56px;height:56px;padding:9px}.ability svg{width:100%;height:100%;stroke-width:2}.ability span{position:absolute;bottom:-18px;left:-5px;right:-5px;font-size:11px;letter-spacing:1px;text-shadow:0 1px 3px #000;background:#1b1712c9;border-radius:3px}.ability b{position:absolute;inset:0;display:grid;place-items:center;font-size:23px;color:white;text-shadow:0 2px 3px #000}.ability b:not(:empty){background:#181410c9;border-radius:50%}.ability b.locked{font-size:14px}.ability kbd{display:none}.dash{right:9px;top:0}.surge{left:20px;top:47px}.ult{left:6px;bottom:5px}#attack{right:0;bottom:0;width:96px;height:96px;padding:20px;color:#ece1ca;background:radial-gradient(circle at 35% 25%,#425b56c9,#251f19e8)}#attack svg{width:100%;height:100%;stroke-width:2.5}#attack span{position:absolute;bottom:8px;left:0;width:100%;font-size:10px;letter-spacing:1px}.health{position:absolute;bottom:-5px;left:50%;transform:translateX(-50%);width:144px;height:23px;display:flex;align-items:center;filter:drop-shadow(0 2px 2px #15110e)}.health strong{display:grid;place-items:center;flex:0 0 28px;height:28px;background:#231d17;border:1px solid var(--gold);transform:rotate(-5deg);font-size:18px}.health>div{position:relative;border:1px solid var(--gold);width:100%;height:17px;background:#2a2520}.health i{position:absolute;top:1px;bottom:1px;left:1px;background:#8ca26b;width:99%}.health span{position:absolute;inset:0;text-align:center;font:700 12px Barlow;line-height:14px;text-shadow:0 1px 2px #27231f}.health #xp-fill{top:auto;bottom:-5px;height:2px;background:#d8c49c;width:0}
#coach{position:absolute;left:12px;bottom:calc(228px + env(safe-area-inset-bottom));width:235px;display:flex;align-items:center;padding:8px 22px 8px 6px;background:#1b1712df;border-left:2px solid var(--gold);font-size:13px;line-height:1.35}#coach svg{width:54px;flex:none;fill:none;stroke:#cbb78f;stroke-width:1.5}.coach-thumb{fill:#e7d8ba;animation:coach 2.5s ease-in-out infinite}#coach button{position:absolute;right:2px;top:0;font-size:19px;border:0;background:none;padding:3px 6px;color:#bac6c4}@keyframes coach{50%{transform:translate(7px,-8px)}}
.overlay{position:fixed;inset:0;display:grid;place-items:center;background:linear-gradient(0deg,#181410 5%,#1f1a15c9 50%,#1a1612a1);overflow-y:auto;touch-action:pan-y;padding:max(18px,env(safe-area-inset-top)) 20px max(18px,env(safe-area-inset-bottom))}.intro{width:min(100%,430px);text-align:center}h1{font-size:clamp(40px,10vw,70px);line-height:1;letter-spacing:9px;margin:0;font-weight:700;color:#ebe2d0;text-shadow:0 3px 20px #cda65f33}.tagline{color:#bed0cc;font-size:18px;margin:10px 0 0;letter-spacing:.6px}.hero-stage{height:clamp(160px,30dvh,315px);margin:4px auto 0;position:relative}.hero-stage img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 28px #ba9e6633)}.hero-copy h2{font-size:33px;margin:0;color:#f9f6ef;line-height:1.1}.hero-copy>span{text-transform:uppercase;font-size:12px;letter-spacing:2px;color:#bba37c}.hero-copy p{margin:8px 0 15px;font-size:16px;color:#d0dbd9}.hero-picks{display:flex;justify-content:center;gap:8px}.hero-picks button{width:100px;min-height:42px;border:1px solid #88939169;background:#241e18c7;border-radius:3px;font-size:17px;color:#adbfbb}.hero-picks button[aria-pressed=true]{border-color:var(--gold);background:#393531;color:#eadfca;box-shadow:inset 0 -2px var(--gold)}.match-info{font-size:15px;color:#afbfbc;margin:16px 0 12px}.match-info span{padding:0 9px;color:var(--gold)}.primary{min-height:51px;width:100%;background:#cbb07e;color:#28221c;border:1px solid #f9dfb0;letter-spacing:2px;text-transform:uppercase;font-size:18px;box-shadow:0 4px 25px #c3a66e14}.primary:disabled{opacity:.5}.menu-links{display:flex;justify-content:center;gap:16px;margin-top:15px}.menu-links button{border:0;background:none;padding:7px 0;color:#b1c0bd;font-size:14px}.menu-links button:hover{color:#f2eadb}#load-error{color:#edc9b9;font-size:15px}#load-error button{background:none;border:0;text-decoration:underline;color:inherit}
dialog{width:min(92vw,450px);max-height:86dvh;border:1px solid var(--gold);background:#211c16f5;padding:29px 26px;color:var(--white);box-shadow:0 20px 90px #0008;touch-action:pan-y;overflow:auto}dialog::backdrop{background:#0f0c0abd;backdrop-filter:blur(5px)}dialog h2{font-size:32px;line-height:1.1;font-weight:700;color:#ebd4a0;margin:0 20px 16px 0}dialog p{font-size:18px;line-height:1.4;color:#c7d3d1}dialog ul{padding-left:20px;font-size:18px;line-height:1.5}dialog li{margin-bottom:10px}dialog .close{position:absolute;right:8px;top:5px;width:38px;height:38px;background:none;border:0;font-size:29px;color:#d0d8d6}dialog .row-btn{display:block;width:100%;padding:13px 16px;margin:9px 0;text-align:left;background:#2f2720;border:1px solid #4e5f5b;font-size:19px}dialog .row-btn small{display:block;font:15px Barlow;color:#b4c1bf;margin-top:3px}dialog .row-btn:disabled{opacity:.4}dialog .primary{margin-top:12px}dialog dl{display:grid;grid-template-columns:1fr auto;font-size:19px;gap:10px;margin:22px 0}dialog dd{color:var(--gold);margin:0}dialog .keyhint{font-size:14px;color:var(--mr-muted)}#sheet-content .result-score{font-size:38px;letter-spacing:10px;font-variant-numeric:tabular-nums;color:#e1d6bf}
@media(min-width:700px){.wordmark{font-size:17px;letter-spacing:4px}#minimap{width:125px;height:125px;top:72px;left:20px}#objective{left:160px;right:160px;top:82px}#objective b{font-size:23px}#objective-sub{font-size:16px}#controls{bottom:25px}#joystick{width:132px;height:132px;left:32px}#thumb{left:44px;top:44px}.abilities{right:28px;transform:scale(1.1);transform-origin:right bottom}.health{width:230px;height:30px;bottom:10px}.health>div{height:21px}.health span{line-height:18px}.health strong{height:34px;flex-basis:34px}#coach{left:25px;bottom:226px}.ability kbd{display:block;position:absolute;right:-8px;top:-4px;background:#1a1611;border:1px solid #a4916c;border-radius:3px;padding:0 3px;font:11px Barlow}.utility{right:22px}}
@media(max-height:520px) and (min-width:600px){.intro{width:620px;display:grid;grid-template-columns:240px 1fr;column-gap:25px}h1{grid-column:1/-1;font-size:45px}.tagline{grid-column:1/-1;margin-bottom:8px}.hero-stage{grid-column:1;grid-row:3/8;width:240px;height:225px;margin:0}.hero-copy{grid-column:2}.hero-copy h2{font-size:27px}.hero-copy p{margin-bottom:9px}.hero-picks{grid-column:2}.match-info{grid-column:2;margin:10px 0}.primary{grid-column:2}.menu-links{grid-column:2;margin-top:6px;gap:12px}#minimap{width:72px;height:72px;top:60px}#objective{top:72px}#objective b{font-size:18px}#objective-sub{font-size:13px}.utility{top:60px;right:12px;min-height:39px}#recall{top:105px}#controls{height:135px;bottom:12px}.abilities{transform:scale(.8)}#joystick{width:99px;height:99px;bottom:12px;left:18px}#thumb{left:28px;top:28px}#coach{bottom:160px;left:14px;transform:scale(.85);transform-origin:left bottom}.health{bottom:4px}#notice{top:38%}header{height:44px}.score{height:59px}#respawn{font-size:18px}#respawn strong{font-size:32px}}
@media(max-width:370px){.abilities{right:8px;transform:scale(.87);transform-origin:right bottom}#joystick{left:12px;width:105px;height:105px}#thumb{left:31px;top:31px}.wordmark{font-size:11px;letter-spacing:2px}.score{width:101px}.hero-stage{height:23dvh}h1{letter-spacing:6px}#coach{width:215px}.health{width:116px}}@media(prefers-reduced-motion:reduce){.coach-thumb{animation:none}*{scroll-behavior:auto!important}}
/* Folklore realm presentation. World art and live controls stay independent. */
:root{--ink:#16120e;--gold:#b59466;--mint:#9fcfc2;--white:#e9dfcc}header{background:#181411f0;border-color:#a89a8055}.wordmark{font-size:12px;line-height:12px;letter-spacing:2px;color:#e9e2d5}#map-button{position:absolute;left:12px;top:calc(65px + env(safe-area-inset-top));width:86px;height:103px;padding:0;border:1px solid #b0a28999;background:#181511d9;overflow:hidden}#map-button #minimap{position:static;display:block;width:84px;height:84px;border:0;border-radius:0}#map-button small{display:block;font-size:10px;letter-spacing:2px;color:#e7e0d2;line-height:17px}#objective{left:110px;right:13px;top:calc(80px + env(safe-area-inset-top));text-align:left}#objective b{font-size:19px;letter-spacing:1.1px;color:#e8e0cf}#realm-count{display:block;font-size:13px;color:#bec2b7;margin-top:2px}.realm-track{height:2px;background:#ddc79f20;margin:7px 0 6px;width:100%}.realm-track i{display:block;height:2px;background:#d9c091;width:100%;transition:width .15s linear}#objective-sub{font-size:12px;line-height:1.25;margin:0;color:#d4cfc5}#objective.shifting b,#objective.shifting #realm-count{color:#f1d095}.shifting .realm-track i{background:#f5d18a}.utility{right:12px;top:calc(183px + env(safe-area-inset-top));background:#181511db;min-width:90px;border-color:#b0a28966;color:#e3d6b1}#recall{top:calc(237px + env(safe-area-inset-top))}#portal{top:calc(291px + env(safe-area-inset-top));font-size:13px;color:#e8dfcc}#portal:disabled{color:#bfc2ba;border-color:#6574715e}#portal:not(:disabled){border-color:#e1cda7;box-shadow:0 0 18px #cad9b43b}#portal small{font-size:10px}#notice{top:36%;width:min(88%,460px)}#notice b{font-size:27px;letter-spacing:.6px}#notice small{font-size:14px;line-height:1.3;max-width:330px;margin:5px auto 0}#coach{background:#1e1a17ed;border-color:#d4ba8b}#coach svg{stroke:#d4ba8b}.coach-thumb{fill:#d4ba8b}.abilities button{border-color:#b5a68b;background:radial-gradient(circle at 35% 30%,#4a4642ed,#231f1aed 70%);color:#e5ddce}.ability span{background:#1d1915db;letter-spacing:.6px;font-size:10px}#attack{color:#e4d4b6;background:radial-gradient(circle at 35% 25%,#5e5749e8,#24211d 80%)}#joystick{border-color:#c8b99e80;background:#1d18143b}#thumb{background:#b5ac9b60;border-color:#cfc6b5}.health strong{background:#1e1b18}.health i{background:#c7af83}
.overlay{background:radial-gradient(ellipse at 50% 38%,#2a252055,transparent 48%),linear-gradient(0deg,#14110ef5 2%,#181512ce 35%,#14110ed0 78%,#14110eee);padding:20px 22px max(18px,env(safe-area-inset-bottom))}.intro{width:min(100%,430px)}.eyebrow{font-size:11px;letter-spacing:4px;color:#d6bd8d;margin:0 0 9px}h1{font-family:Cinzel,Barlow,serif;font-size:clamp(45px,12vw,64px);font-weight:900;letter-spacing:-1px;line-height:.86;color:#e7e1d6;transform:scaleX(.88);text-shadow:0 3px 30px #ceb99122}.tagline{font-size:15px;letter-spacing:.7px;color:#cacec5;margin:13px 0 0}.hero-stage{height:clamp(160px,28dvh,270px);margin:5px auto 0}.hero-stage:before{content:'';position:absolute;inset:18% 15%;background:#bfb09225;filter:blur(32px);border-radius:50%}.hero-stage img{position:relative;filter:drop-shadow(0 8px 19px #0f0c0aaa);width:100%;height:100%;object-fit:contain}.hero-copy h2{font-family:Cinzel,Barlow,serif;font-size:29px;letter-spacing:.5px;color:#ede7dc;line-height:1.1}.hero-copy>span{font-size:11px;color:#d8bc89;letter-spacing:2.4px;display:block;margin-top:5px}.hero-copy p{font-size:14px;color:#c6cac0;margin:7px 0 13px}.hero-picks{gap:7px}.hero-picks button{flex:1;min-width:0;height:94px;padding:4px 1px;border-radius:0;background:#201c18ce;border:1px solid #837a6f77;color:#bbbfb5;position:relative}.hero-picks img{display:block;width:100%;height:65px;object-fit:contain;filter:drop-shadow(0 3px 3px #0007)}.hero-picks span{display:block;font-size:13px;white-space:nowrap;line-height:18px}.hero-picks button[aria-pressed=true]{border-color:#d7bb88;background:#3e3b3780;color:#ede5d5;box-shadow:inset 0 -2px #d7bc8a,0 0 14px #ceb17c25}.match-info{font-size:13px;margin:14px 0 10px;color:#c1c5ba}.match-info span{padding:0 5px;color:#d6bd8e}.primary{background:#d5b986;border-color:#e3cea8;color:#221f1b;font-size:20px;letter-spacing:2.1px;box-shadow:0 6px 28px #d6b67c1b;min-height:54px}.menu-links{margin-top:10px;gap:18px}.menu-links button{font-size:13px;color:#c8ccc3}dialog{background:#1f1b18f7;border-color:#b1a58f}dialog h2{color:#e2d7c3}dialog p,dialog ul{color:var(--mr-text)}dialog .row-btn{background:linear-gradient(180deg,#2a251f,#1c1814);border-color:#4d4337;box-shadow:inset 0 1px 0 #ffffff0d;color:var(--mr-parchment)}dialog .row-btn:hover,dialog .row-btn:focus-visible{border-color:var(--mr-bronze-hi)}dialog .row-btn small{color:var(--mr-muted)}#tactical-map{display:block;width:100%;height:auto;border:1px solid #afa084;touch-action:none}.map-help{margin:0 0 10px!important;font-size:16px!important}.map-legend{font-size:13px!important;color:#ddcfb5!important}.map-legend em{font-style:normal;color:#e8b3a9}.map-destinations{display:flex;gap:6px}.map-destinations button{flex:1;font-size:13px;min-height:43px;padding:5px;border:1px solid #71766a;background:#2d2a27;color:#e3dac8}
@media(min-width:700px) and (min-height:521px){.wordmark{font-size:15px;line-height:15px}#map-button{width:122px;height:142px;left:20px;top:72px}#map-button #minimap{width:120px;height:120px}#map-button small{line-height:20px;font-size:11px}#objective{left:164px;right:auto;width:290px;top:83px}#objective b{font-size:23px}#realm-count{font-size:16px}#objective-sub{font-size:15px}.utility{top:83px}#recall{top:137px}#portal{top:191px}.hero-stage{height:min(29dvh,280px)}}
@media(max-height:520px) and (min-width:600px){.overlay{padding:14px 26px}.intro{width:740px;grid-template-columns:290px 1fr;gap:0 30px}.eyebrow{grid-column:2;margin:0 0 5px}h1{grid-column:2;font-size:39px;line-height:.9;transform:none}h1 br{display:none}h1 br:after{content:' '}.tagline{grid-column:2;font-size:13px;margin-top:5px;margin-bottom:8px}.hero-stage{grid-column:1;grid-row:1/9;width:290px;height:280px;align-self:center}.hero-copy h2{font-size:25px}.hero-copy>span{font-size:10px}.hero-copy p{font-size:12px;margin:5px 0 8px}.hero-picks button{height:64px}.hero-picks img{height:39px}.hero-picks span{font-size:11px}.match-info{font-size:12px;margin:8px 0}.primary{min-height:43px;font-size:16px}.menu-links{margin-top:4px}.menu-links button{font-size:12px}#map-button{width:74px;height:90px;top:59px}#map-button #minimap{width:72px;height:72px}#objective{left:108px;right:auto;width:220px;top:67px}#objective b{font-size:18px}#realm-count{font-size:12px}.realm-track{margin:4px 0}#objective-sub{font-size:11px}.utility{top:60px;min-height:36px}#recall{top:102px}#portal{top:144px}#notice{top:38%;left:54%;max-width:340px}#notice b{font-size:21px}#notice small{font-size:13px}}
@media(max-width:370px){.overlay{padding:13px 16px}.eyebrow{font-size:10px;margin-bottom:7px}h1{font-size:43px;letter-spacing:0}.tagline{font-size:13px;margin-top:9px}.hero-stage{height:clamp(100px,23dvh,155px);margin:0 auto}.hero-copy h2{font-size:25px}.hero-copy p{font-size:12px;margin:5px 0 9px}.hero-copy>span{font-size:10px}.hero-picks button{height:76px}.hero-picks img{height:48px}.hero-picks span{font-size:11px}.match-info{font-size:11px;margin:10px 0 8px}.primary{min-height:46px;font-size:18px}.menu-links{margin-top:6px}.menu-links button{font-size:12px}.wordmark{font-size:10px;line-height:10px}#objective{left:101px;right:10px}#objective b{font-size:16px}#realm-count{font-size:11px}#objective-sub{font-size:11px}.utility{min-height:39px;padding:4px 7px;font-size:13px;min-width:82px;top:174px}#recall{top:219px}#portal{top:264px}#notice{top:35%;left:46%;width:75%}#notice b{font-size:22px}#notice small{font-size:13px}#coach{bottom:216px}}
.overlay{grid-template-columns:minmax(0,1fr)}.intro{min-width:0;max-width:100%}.hero-picks button{width:auto;flex:1 1 0}
@media(max-width:600px){#notice{left:12px;right:112px;width:auto;transform:none;top:37%}#notice b{font-size:23px}#notice small{font-size:13px}}
/* The Night Market: native controls over an isometric world. */
#battle-overlay{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}#loadout{position:absolute;bottom:calc(214px + env(safe-area-inset-bottom));left:12px;width:208px;pointer-events:auto}#inventory,.market-inventory{display:flex;gap:5px}#quick-buy{width:100%;min-height:32px;background:#272320ed;color:#e0cca7;border:1px solid #c0ab8477;margin-bottom:5px;font-size:13px}#quick-buy:disabled{color:#bcb7b0;border-color:#5e625788}#inventory .inventory-slot{width:30px;height:32px}.inventory-slot{padding:0;border:1px solid #5c4630;background:#14110e;box-shadow:inset 0 3px 8px #0009;width:48px;height:48px;overflow:hidden;display:grid;place-items:center;color:#847b70;font-size:12px}.inventory-slot.filled{border-color:var(--mr-bronze-hi)}.item-icon{display:block;flex:none;width:48px;height:48px;background-image:url('./art/items.webp');background-size:600% 300%;background-position:calc(var(--ix)*20%) calc(var(--iy)*50%);border-radius:4px}.inventory-slot .item-icon{width:100%;height:100%}#coach{bottom:calc(298px + env(safe-area-inset-bottom))}dialog.market{width:min(94vw,820px);max-height:94dvh;padding:24px 18px 18px;background:linear-gradient(180deg,#221d17fb,#14110dfc);border-color:#7d6240;box-shadow:inset 0 1px 0 #ffffff12,inset 0 0 0 1px #000,0 0 0 1px #000,0 22px 80px #000b}dialog.market .close{z-index:2}.market-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;padding-right:25px}.market-heading h2{font-size:29px;margin:3px 0 0}.market-heading small{font:600 10px Cinzel,Barlow,serif;letter-spacing:2px;color:var(--mr-bronze-hi)}.market-heading strong{color:var(--mr-gold);font-size:26px;line-height:1;font-variant-numeric:tabular-nums}.market-heading strong small{display:block;font-size:10px;margin-top:5px;letter-spacing:1px}.market-builds{display:flex;flex-wrap:wrap;border-bottom:1px solid #7d624066;margin-top:19px;gap:0 4px}.market-builds button{flex:1 0 auto;padding:0 6px;background:none;border:0;border-bottom:2px solid transparent;min-height:37px;color:#a99f8e;font:600 15px Cinzel,Barlow,serif;letter-spacing:.6px}.market-builds button[aria-pressed=true]{color:var(--mr-parchment);border-color:var(--mr-gold)}.build-note{font-size:13px!important;margin:6px 0 14px!important;color:#c0baaf!important}.market-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:thin;padding-bottom:9px;touch-action:pan-x}.market-tabs button{white-space:nowrap;border:1px solid #4d4337;color:#c8bca6;background:linear-gradient(180deg,#2a251f,#1c1814);box-shadow:inset 0 1px 0 #ffffff0d;padding:8px 10px;font-size:13px}.market-tabs button[aria-pressed=true]{background:linear-gradient(180deg,#4a3a25,#2b2117);color:#f3dca6;border-color:var(--mr-gold);box-shadow:inset 0 1px 0 #ffe8b826}.market-detail{border:1px solid #5c4630;background:linear-gradient(160deg,#2a241d,#17140f);box-shadow:var(--mr-bevel);padding:14px}.item-title{display:flex;align-items:center;gap:12px}.item-title>.item-icon{width:72px;height:72px;border:1px solid #7d6240;box-shadow:0 0 0 1px #000}.item-title small{font-size:9px;color:#b4b9ad;letter-spacing:1px}.item-title h3{margin:4px 0 5px;font:600 23px/1.05 Cinzel,Barlow,serif;color:var(--mr-parchment)}.item-title p{font-size:13px!important;color:#dfcaa3!important;line-height:1.4!important;margin:0}.passive{font-size:15px!important;line-height:1.35!important;min-height:40px;margin:13px 0!important}.recipe-label{font-size:11px;letter-spacing:1px;border-top:1px solid #827b6f66;padding-top:10px;color:#c7b799}.recipe-label span{float:right;font-size:10px;letter-spacing:0;color:#adb0a8}.recipe{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}.recipe button{display:flex;gap:6px;align-items:center;flex:1;min-width:0;text-align:left;border:1px solid #4d4337;background:#1c1814;padding:5px;font-size:13px}.recipe .item-icon{width:35px;height:35px}.recipe small,.market-grid small{display:block;color:#d1bd99;font-size:11px;margin-top:3px}.recipe .owned{border-color:#dac49b}.combine-cost{width:100%;text-align:center;color:#b2ada2;font-size:11px}.market-actions{display:flex;gap:7px;margin-top:12px}.market-actions .primary{min-height:43px;font-size:16px;letter-spacing:1px}.market-actions>button:not(.primary){background:linear-gradient(180deg,#2a251f,#1c1814);border:1px solid var(--mr-bronze);min-width:78px;font-size:13px}.market-actions .primary{font-family:Barlow,sans-serif}.market-hint{font-size:11px!important;margin:8px 0 0!important;color:#b5aea2!important}.market-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:10px 0}.market-grid>button{display:flex;align-items:center;gap:8px;min-height:60px;padding:6px;background:linear-gradient(180deg,#25201b,#191612);border:1px solid #4d4337;box-shadow:inset 0 1px 0 #ffffff0a;text-align:left;font-size:15px}.market-grid>button[aria-pressed=true]{border-color:var(--mr-gold);background:linear-gradient(180deg,#3a2f22,#221b14)}.market-grid .item-icon{width:43px;height:43px}.market-inventory-label{display:flex;justify-content:space-between;letter-spacing:1.5px;font-size:11px;color:#c7b697;margin:13px 0 8px}.market-inventory{gap:6px}.market-inventory .inventory-slot{flex:1;height:auto;aspect-ratio:1}.sell-item{display:block;background:linear-gradient(180deg,#3a201b,#24130f);border:1px solid var(--mr-enemy);width:100%;min-height:39px;margin-top:8px;font-size:14px}.build-stats{display:flex;justify-content:space-between;text-align:center;margin:15px 0;font-size:19px;color:#e2dbce}.build-stats small{display:block;font-size:9px;letter-spacing:1px;color:#acb1a4}.market-back{min-height:43px;font-size:16px}#notice{pointer-events:none}.market button{touch-action:manipulation}
@media(min-width:650px){.market-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;align-items:start}.market-grid{margin:0;grid-template-columns:1fr}.market-inventory .inventory-slot{max-width:64px}#loadout{left:50%;transform:translateX(-50%);bottom:calc(80px + env(safe-area-inset-bottom));width:250px}#inventory .inventory-slot{width:38px;height:38px}#coach{bottom:240px}}
@media(max-height:520px) and (min-width:600px){#loadout{bottom:60px;width:214px}#inventory .inventory-slot{width:31px;height:31px}#quick-buy{min-height:27px;font-size:12px}dialog.market{max-height:94dvh}.market-heading h2{font-size:25px}}
@media(max-width:370px){#loadout{width:185px;bottom:206px}#inventory{gap:4px}#inventory .inventory-slot{width:27px;height:29px}#quick-buy{font-size:12px}dialog.market{padding:23px 12px 14px}.market-heading h2{font-size:24px}.market-heading strong{font-size:21px}.market-grid>button{font-size:13px;gap:6px}.market-grid .item-icon{width:36px;height:36px}.item-title h3{font-size:22px}.item-title>.item-icon{width:58px;height:58px}#coach{bottom:285px}}
/* Two thumbs: movement on the left, three abilities on the right. */
#hud header{background:linear-gradient(#181410dc,#18141080);border:0}
#map-button{left:auto;right:12px;top:calc(66px + env(safe-area-inset-top));width:88px;height:88px;border-radius:50%;box-shadow:0 2px 18px #0008;border-color:#b9ab86}
#map-button #minimap{width:86px;height:86px;border-radius:50%}#map-button small{display:none}
#objective{left:14px;right:112px;top:calc(77px + env(safe-area-inset-top));width:auto;max-width:280px}#objective b{font-size:17px}#objective-sub{font-size:12px}#realm-count{font-size:12px}
#recall{display:none}#portal{top:auto;bottom:calc(310px + env(safe-area-inset-bottom));right:16px;min-height:44px;border-radius:8px}
#loadout{left:50%;transform:translateX(-50%);bottom:calc(10px + env(safe-area-inset-bottom));width:204px;border:1px solid #ada18a88;background:#1a1611e8;box-shadow:0 6px 22px #0006;border-radius:8px;overflow:hidden}
#loadout #shop{position:static;width:100%;min-height:33px;border:0;box-shadow:none;background:none;font-size:15px;color:#ead9ac;padding:4px 8px}#shop small{display:inline;font-size:11px;margin-left:7px;color:#e1ded7}#inventory{display:none}#quick-buy{border:0;border-top:1px solid #ada18a44;margin:0;min-height:30px;background:#3e3a3780;font-size:13px}
#controls{bottom:calc(94px + env(safe-area-inset-bottom));height:190px;background:none}
#joystick{left:18px;bottom:12px;width:112px;height:112px;background:radial-gradient(#30292377,#1c171266);box-shadow:inset 0 0 28px #99bdb627,0 4px 20px #0003;border-color:#d1c8b777}
#thumb{left:34px;top:34px;width:42px;height:42px;background:radial-gradient(at 35% 25%,#dcd2bd88,#423a3399);border:1px solid #e4ded3;box-shadow:0 3px 12px #0007}#joystick.active{border-color:#e7dbc4}#joystick small{display:none}
.abilities{right:16px;bottom:0;width:168px;height:181px;transform:none}
.abilities .ability{width:66px;height:66px;padding:14px;border:1px solid #d0c39d;box-shadow:inset 0 0 0 4px #1c1712,0 4px 16px #0008;background:radial-gradient(at 35% 25%,#4a6d66,#2f271f 60%,#201a15);color:#e5d9c2}
.abilities .dash{left:0;right:auto;top:82px;bottom:auto}.abilities .surge{left:auto;right:0;top:auto;bottom:0}.abilities .ult{left:auto;right:0;top:0;bottom:auto;width:78px;height:78px;padding:17px;color:#e9dab0;border-color:#e7d5a4;background:radial-gradient(at 35% 25%,#5e736e,#332b23 60%,#26211c)}
.ability span{bottom:5px;font-size:9px;letter-spacing:.5px;background:none;left:0;right:0}.ability svg{padding-bottom:7px}.ability[aria-disabled=true]{filter:saturate(.5)}.ability b:not(:empty){background:#16120fb8}.ability kbd{display:none}
#auto-status{position:absolute;right:0;top:-31px;white-space:nowrap;max-width:168px;overflow:hidden;text-overflow:ellipsis;padding:5px 9px;color:#d4d9cd;border:1px solid #bfb39c66;background:#1a1612c9;border-radius:2px;font-size:11px;letter-spacing:.7px}#auto-status.engaged{color:#efd89e;border-color:#d8c283}
.health{bottom:-13px;width:178px;height:21px}.health strong{height:25px;flex-basis:25px;font-size:15px;transform:none;border-radius:50%}.health>div{height:16px}.health span{font-size:11px;line-height:14px}
#coach{bottom:calc(305px + env(safe-area-inset-bottom));left:14px;width:235px}#notice{top:25%;left:14px;right:14px;width:auto;max-width:none;transform:none}#notice b{font-size:21px}#notice small{font-size:13px}
.relic-icon{outline:1px solid #e4c2c7;box-shadow:inset 0 0 12px #cb9aa1;filter:hue-rotate(12deg)}.tradeoff{color:#e6c6a1!important;font-size:13px!important;border-left:2px solid #c09b76;padding-left:9px}.inherited{font-size:12px!important;color:#b0bbb9!important}.synergies{margin:12px 0;padding:12px;border:1px solid #697774;background:#282420}.synergies h3{margin:0 0 6px;font-size:16px;color:#e3d2b2}.synergies p{font-size:13px;margin:6px 0}.upgrade-path{display:flex;gap:6px;flex-wrap:wrap;margin:9px 0}.upgrade-path button{border:1px solid #a69396;background:#383431;font-size:13px;padding:7px 10px;min-height:36px}.recipe small{white-space:normal}.market-hint{line-height:1.5}
@media(min-width:700px){#map-button{width:110px;height:110px;right:20px}#map-button #minimap{width:108px;height:108px}#objective{left:20px;right:auto;width:270px}#controls{bottom:110px}.abilities{right:30px;transform:scale(1.13);transform-origin:right bottom}#joystick{left:30px;width:128px;height:128px}#thumb{left:42px;top:42px}.health{bottom:-16px;width:220px}#loadout{width:236px;bottom:16px}.ability kbd{display:block}#coach{bottom:310px}#notice{left:30%;right:30%;top:19%}}
@media(max-width:370px){#joystick{left:12px;width:100px;height:100px}#thumb{left:28px;top:28px}.abilities{right:10px;transform:scale(.89);transform-origin:right bottom}#controls{bottom:90px}#loadout{width:186px}#map-button{width:76px;height:76px;right:10px}#map-button #minimap{width:74px;height:74px}#objective{right:96px;left:12px}#objective b{font-size:15px}#coach{bottom:290px;width:216px}#notice{top:29%}#notice small{max-width:270px}}
@media(max-height:520px) and (min-width:600px){#controls{bottom:24px;height:172px}.abilities{right:24px;transform:scale(.86)}#joystick{left:22px;width:106px;height:106px;bottom:15px}#thumb{left:31px;top:31px}#loadout{bottom:12px;width:214px}.health{bottom:66px;width:200px}#map-button{width:80px;height:80px;top:55px}#map-button #minimap{width:78px;height:78px}#objective{top:58px;width:215px}#objective-sub{font-size:11px}#objective b{font-size:16px}#coach{left:155px;bottom:105px;transform:none;width:218px}#portal{bottom:215px;right:24px}#notice{top:30%;left:30%;right:27%}}
#auto-pause{position:absolute;inset:0;z-index:30;display:grid;place-content:center;gap:6px;border:0;background:#0e0c0aa8;color:#eae4d7;font:inherit;text-align:center;pointer-events:auto;backdrop-filter:blur(2px)}#auto-pause[hidden]{display:none}#auto-pause b{font-size:34px;letter-spacing:6px;text-transform:uppercase}#auto-pause small{font-size:14px;color:#d1d5cc;letter-spacing:.5px}
/* The build names are Cinzel, which runs wider than Barlow: narrow screens get a smaller size so all four fit. */
@media(max-width:430px){.market-builds button{font-size:12px;letter-spacing:0}}

/* A graphics outage must be readable above hero select, match HUD and dialogs. */
#graphics-error[open] { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; border: 0; z-index: 10000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 2rem; background: #101b25f5; color: #f3e8cf; text-align: center; }
#graphics-error p { max-width: 34rem; line-height: 1.6; }
#graphics-error button { padding: .8rem 1.4rem; color: #17202a; background: #e3cd92; border: 0; font: inherit; cursor: pointer; }