/* Modern landscape phone with separate hardware rails. */
.game-phone{padding:12px 29px;border:2px solid #66666d;border-radius:42px;background:linear-gradient(130deg,#8b8c91 0,#25262c 4%,#060709 20%,#15161b 75%,#54555c);box-shadow:0 2px 0 #c1c1c655,inset 0 0 0 4px #090a0d,inset 0 0 0 5px #79798155,0 24px 60px #0009}
.game-phone:before{content:'';position:absolute;top:-5px;right:20%;width:13%;height:3px;border-radius:3px;background:#787982;box-shadow:-100px 0 0 #787982}
.game-phone:after{content:'';position:absolute;right:-5px;top:36%;width:3px;height:19%;background:linear-gradient(#55565e,#b5b5bc,#4c4d55);border-radius:3px}
.phone-screen{border:1px solid #000;border-radius:28px;box-shadow:0 0 0 2px #07080a;aspect-ratio:18/9}
.game-phone .phone-camera{left:8px;top:42%;height:16%;width:7px;border-radius:8px;background:#030305;box-shadow:inset 0 0 0 1px #484a51}
.game-phone .phone-home{width:3px;height:24%;top:38%;right:10px;background:#b6b6bc;opacity:.8}
.dungeon-switcher{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 24px}
.dungeon-switcher>span{color:#b7a08d;font-size:10px;letter-spacing:2px;margin-right:8px}
.dungeon-switcher button{border:1px solid #765b44;border-radius:4px;padding:10px 17px!important;background:#1c1514!important;color:#dbc4a2;font-size:12px}
.dungeon-switcher button[aria-pressed=true]{background:linear-gradient(#60352a,#281716)!important;border-color:#c39961;color:#ffdfaa;box-shadow:inset 0 0 0 2px #140e0b}
.game-joystick{width:15%;left:3.5%;bottom:7%;border:4px ridge #a57549;background:radial-gradient(circle at 50% 46%,#33302b 0,#111316 54%,#020406 76%);box-shadow:0 0 0 3px #070708,0 0 0 5px #77543b,inset 0 0 0 4px #1a1613,0 4px 14px #000b}
.game-joystick .joy-knob{border:3px ridge #b78d62!important;background:radial-gradient(#454039,#202123 65%,#0c0e11)!important;width:43%;height:43%;left:28.5%;top:28.5%;color:#ae9581;box-shadow:0 0 0 2px #09090a,0 3px 6px #000}
.joy-arrow{color:#aa9986;text-shadow:0 1px 2px #000}.north{top:3%}.south{bottom:3%}.west{left:4%}.east{right:4%}
.combat-wheel{width:22%;right:2.5%;bottom:4.5%;aspect-ratio:.94}
.combat-wheel button{border:3px ridge #a77e53;background:radial-gradient(circle at 40% 34%,#323333,#15181b 60%,#07090b);box-shadow:0 0 0 2px #07080a,0 0 0 3px #745039,inset 0 0 0 2px #0a0a0b;color:#d8c4a6}
.combat-wheel button svg{display:block;width:65%;height:65%;margin:auto;filter:drop-shadow(0 2px 2px #000)}
.combat-wheel button{display:flex;align-items:center;justify-content:center}
.combat-attack{width:48%;height:45%;right:0;bottom:11%;transform:rotate(-12deg)}
.combat-skill{width:25%;height:24%}.skill-a{left:40%;top:0}.skill-b{left:13%;top:17%}.skill-c{left:0;top:45%;bottom:auto}.skill-d{left:11%;bottom:0}
.combat-wheel button.active{box-shadow:0 0 12px #6eaeff,inset 0 0 10px #4073c3}
.minimap-panel{width:clamp(60px,11vw,112px);text-align:center;pointer-events:none;line-height:1.2}
.minimap-panel>b{display:block;font-size:10px;font-weight:400;margin-top:5px;padding:2px 6px;background:linear-gradient(90deg,transparent,#0a0808ce,transparent);color:#f4dfbb;text-shadow:0 1px 2px #000}
.minimap-rim{position:relative;border:4px ridge #aa7b41;border-radius:50%;box-shadow:0 0 0 2px #160f09,0 0 0 3px #865931,inset 0 0 8px #000;aspect-ratio:1;background:#131a10}
.phone-screen .minimap-rim canvas{width:100%;height:100%;border-radius:50%;object-fit:cover;pointer-events:none}
.minimap-north{position:absolute;top:1px;left:46%;font-size:8px;color:#ffdb94;text-shadow:0 1px #000}
.realm-hud{z-index:3}.realm-tools{top:clamp(94px,13vw,144px);right:12px;z-index:3}.realm-tools button{width:23px;height:23px;border-color:#9d754f}
.enemy-health{z-index:2}.combat-wheel,.game-joystick{z-index:3}.phone-loading{z-index:5}
.damage-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:2}
.damage-number{position:absolute;transform:translate(-50%,-50%);font:900 clamp(19px,3vw,36px)/1 Georgia,serif;color:#ffe78d;text-shadow:0 2px 0 #431e00,2px 0 #431e00,-2px 0 #431e00,0 -2px #431e00,0 0 8px #d36a00;white-space:nowrap}
.damage-number.hurt{color:#ff7272;text-shadow:0 2px #410000,2px 0 #410000,-2px 0 #410000,0 -2px #410000}.damage-number.heal{color:#a1ffb0;text-shadow:0 2px #00370d,2px 0 #00370d,-2px 0 #00370d}
.fps-readout{position:absolute;left:50%;bottom:9px;transform:translateX(-50%);font-size:9px;font-variant-numeric:tabular-nums;color:#c7d0b9;text-shadow:0 1px 2px #000;pointer-events:none}
.class-weapon-picker{position:absolute;top:14px;left:18px;right:18px;z-index:3;display:flex;gap:10px;align-items:center;justify-content:center}.class-weapon-picker>span{font-size:8px;letter-spacing:1.5px;color:#c8aa8c}.class-weapon-picker select{background:#1c1315ed;color:#f5dcc4;border:1px solid #8b6151;padding:7px 9px;border-radius:3px;font-size:11px;max-width:65%}
.stable-character{inset:44px 0 45px;background:radial-gradient(ellipse at 50% 45%,#895c4440,transparent 66%)}
.boss-portrait{isolation:isolate;border-radius:12px;background:radial-gradient(ellipse at 50% 85%,#b075503b,#17212b22 70%,transparent);overflow:hidden}
.boss-portrait:before{content:'';position:absolute;inset:0;background:url('assets/dungeons/hero-backdrop.png') center/cover;opacity:.72;mask-image:radial-gradient(ellipse at 50% 64%,#000 30%,transparent 80%);z-index:-1;pointer-events:none}
.boss-portrait[data-realm=owl]:before{background-image:url('assets/dungeons/spring-backdrop.png')}
.boss-portrait model-viewer{position:relative;z-index:1}.hero-art::before{opacity:.52}
@media(max-width:600px){.game-phone{padding:7px 17px;border-radius:25px}.phone-screen{border-radius:18px}.game-phone .phone-camera{left:5px;width:4px}.game-phone .phone-home{right:6px;width:2px}.game-joystick{width:20%;border-width:2px;box-shadow:0 0 0 2px #070708,0 0 0 3px #77543b,inset 0 0 0 2px #1a1613}.combat-wheel{width:27%;bottom:5%}.combat-wheel button{border-width:2px;box-shadow:0 0 0 1px #07080a,0 0 0 2px #745039}.realm-tools{top:66px;right:6px;gap:3px}.realm-tools button{width:17px;height:17px;font-size:10px}.minimap-panel{width:48px}.minimap-rim{border-width:2px}.minimap-panel>b{font-size:6px;margin-top:2px}.minimap-north{font-size:5px}.fps-readout{font-size:7px;bottom:5px}.dungeon-switcher{gap:7px;margin-bottom:16px}.dungeon-switcher button{font-size:10px;padding:8px 12px!important}.dungeon-switcher>span{font-size:8px}.class-weapon-picker{left:8px;right:8px}.class-weapon-picker select{font-size:10px}.damage-number{font-size:20px}}