/* PEPЕЛЬНЫЙ ПУТЬ V2.0 — clean mobile cinematic combat UI.
   Overrides intentionally appended AFTER the legacy styles for safe save compatibility. */
:root{--bg:#080a10;--panel:#131722;--panel2:#191f2b;--text:#f1e9dd;--muted:#a3abb8;--gold:#edbf82;--red:#dd746e;--violet:#ad91de}
body{background:radial-gradient(ellipse 80% 40% at 50% -10%,#48312b2c,transparent 70%),#07090f;color:#f3eee6}
.app{max-width:680px;padding-left:12px;padding-right:12px;background:none}
.topbar{height:76px}
.brand-icon{border-radius:11px;width:41px;height:41px;background:linear-gradient(140deg,#382a26,#111a24);border:1px solid #77604b;color:#f0bb78;box-shadow:inset 0 1px #e7a96333}
.brand h1{font:700 18px Georgia,serif;letter-spacing:1.8px;text-shadow:none;color:#fff1dd}
.eyebrow{color:#cbaa8c;letter-spacing:1.5px;font-size:9px}
.hero-summary{margin:0 0 11px;gap:7px}
.summary-stat{background:#141824;border:1px solid #4c464780;border-radius:11px;padding:9px 11px;min-height:67px;box-shadow:inset 0 1px #ffffff0a}
.summary-label{color:#a7a8b1;font:800 8px system-ui;letter-spacing:1.1px}
.summary-stat strong{font-size:25px;margin-top:5px;font-weight:800;text-shadow:none;font-variant-numeric:tabular-nums}
.summary-stat .gold{color:#f1bf73}.summary-stat .essence{color:#be9aff}
.arena,.arena.zone-1,.arena.zone-2,.arena.zone-3,.arena.zone-4{height:525px;isolation:isolate;overflow:hidden;border-radius:16px;border:1px solid #866b5977;background-color:#080b14;box-shadow:0 0 0 1px #ebaa7225,0 25px 60px #000c;filter:none!important}
.arena.zone-1{background-image:linear-gradient(180deg,#080a16b5 0%,#0709105c 24%,#06091708 49%,#060810c2 100%),url('world_eclipse.webp')}
.arena.zone-2{background-image:linear-gradient(180deg,#070915bf 0%,#0b091453 29%,#0b0a1b21 55%,#070811d8 100%),url('world_void.webp')}
.arena.zone-3{background-image:linear-gradient(180deg,#090a16b5,#160b132d 37%,#07091606 54%,#050811d5),url('world_ember.webp')}
.arena.zone-4{background-image:linear-gradient(180deg,#07111ac2,#08111a48 37%,#050c1626 55%,#060913d7),url('world_frost.webp')}
.arena::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 85% 70% at 50% 51%,transparent 29%,#04060e99 100%)}
.arena::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;border:none;border-radius:inherit;box-shadow:inset 0 0 0 1px #eccb9c22,inset 0 0 35px #0006,inset 0 -30px 65px #070811a9}
.arena-grid,.arena-glow,.moon,.ruins,.embers,.world-vignette{display:none!important}
#arena3d,.arena-3d-active #arena3d{position:absolute;inset:0;width:100%;height:100%;z-index:2;filter:drop-shadow(0 11px 12px #000e) contrast(1.1) saturate(.92);opacity:1;pointer-events:none;transition:opacity .4s}
.arena-top{position:absolute;top:15px;left:17px;right:17px;display:flex;justify-content:space-between;align-items:flex-start;gap:8px;z-index:11;pointer-events:none}
.location-eyebrow{color:#ddbea0;font-size:9px;letter-spacing:2px;text-shadow:0 1px 6px #000b}
.arena h2{max-width:220px;font:700 25px/1.05 Georgia,serif;letter-spacing:.4px;text-shadow:0 3px 12px #000e;margin-top:6px;color:#f8e8d7}
.stage-pill{flex:none;font-size:10px;border:1px solid #9980679c;border-radius:10px;padding:9px 11px;color:#ffe0b2;box-shadow:0 3px 12px #000c;background:#120f18dd}
.scene-mode,.camera-mode,.quality-mode{position:absolute;right:14px;left:auto;min-width:105px;width:118px;padding:8px 9px;font-size:9px;line-height:1.1;font-weight:900;text-align:center;border:1px solid #a98a67;border-radius:9px;background:#15131dea;color:#fae9d3;backdrop-filter:blur(12px);box-shadow:0 3px 8px #0009;z-index:22}
.scene-mode{top:74px;color:#ffd69a;border-color:#c19368;background:#2c211de9}
.camera-mode{top:109px;color:#eee1ff;border-color:#756e9b;background:#201a30e9}
.quality-mode{top:144px;color:#d1f3eb;border-color:#638a8b;background:#13292beb}
.scene-mode:disabled{opacity:.75}
#rigStatus{display:block!important;z-index:21;position:absolute;bottom:46px;left:12px;right:auto;max-width:calc(100% - 24px);padding:7px 10px;background:#0c121bdc;border:1px solid #719c8a80;border-radius:7px;color:#b1dacb;font-size:9px;font-weight:850;letter-spacing:.5px;text-shadow:0 2px 5px #000;text-transform:uppercase;white-space:normal;pointer-events:none}
#rigStatus[data-error=true]{color:#ffd9bc;border-color:#f49f7388;background:#342024dc}
.motion-ribbon{display:none!important}
.arena .battle-scene{position:absolute;inset:178px 10px 39px;z-index:13;align-items:stretch;pointer-events:none}
.combatant{width:47%;height:100%;justify-content:flex-end}
.combatant-name,.arena-3d-active .combatant-name{top:0;font-size:10px;line-height:1.25;font-weight:850;letter-spacing:.6px;color:#ffead8;white-space:normal;text-align:center;text-shadow:0 2px 8px #000c}
.combatant-name small{font-size:8px;line-height:1.2;color:#d9b59a;display:block;margin-top:3px}
.monster-side .combatant-name{color:#ffdad2}
.combatant::before{bottom:34px;background:radial-gradient(ellipse,#000a,transparent 70%);filter:blur(6px);height:30px}
.arena-3d-active .character,.arena-3d-active .character-art,.arena-3d-active .character-shine{opacity:0!important;visibility:hidden!important;animation:none!important}
.arena-3d-active .hero-halo,.arena-3d-active .enemy-halo{display:none!important}
.arena-3d-active .combatant .health-track,.arena-3d-active .combatant .health-number{position:relative;z-index:14}
.arena-2d-active .character{opacity:1!important;visibility:visible!important;filter:drop-shadow(0 7px 14px #000c)!important;animation:none!important}
.arena-2d-active .character-art{opacity:1!important;visibility:visible!important;filter:drop-shadow(0 8px 12px #000a)!important}
.arena-2d-active #arena3d{display:none!important}
.arena-2d-active .character{height:225px;max-height:64%;width:100%}
.arena-2d-active .character-art{object-fit:contain;width:100%;height:100%}
.versus{display:none!important}
.health-track{height:10px;width:93%;background:#080c16f0;border:1px solid #8a80828f;box-shadow:0 2px 8px #0009;margin-top:7px}
.hero-health{background:linear-gradient(90deg,#448a79,#b3f5c2)}.enemy-health{background:linear-gradient(90deg,#95263b,#ff8890)}
.health-number{font-size:11px;letter-spacing:.5px;text-shadow:0 1px 6px #000;color:#e8ddd0;margin-bottom:12px}
.combat-feed{position:absolute;bottom:0;left:0;right:0;min-height:39px;z-index:24;display:flex;justify-content:center;align-items:center;gap:6px;padding:9px 11px;border-top:1px solid #8b6e63a5;background:linear-gradient(90deg,#090e18f7,#24202cfa,#0a0d17f7);color:#f0d3b3;font-size:10px;font-weight:700;letter-spacing:.1px}
.combat-feed .pulse{width:5px;height:5px;margin:0;box-shadow:0 0 9px #e6b688}
.boss-warning{top:194px;left:12px;right:12px;z-index:27;background:#561b25e8;border-color:#f08879;color:#ffe6d7}
.v2-hit .cinematic-cut{animation:v2Slash .3s ease-out forwards!important}
.v2-special .cinematic-cut{animation:v2Slash .55s ease-out forwards!important}
.cinematic-cut{position:absolute;inset:-10% -40%;z-index:8;opacity:0;pointer-events:none;mix-blend-mode:screen;background:linear-gradient(108deg,transparent 36%,#fff6dcca 48%,#ffc391a6 50%,transparent 61%)}
@keyframes v2Slash{0%{opacity:0;transform:translate(-65%,-15%) rotate(-19deg)}35%{opacity:.75}100%{opacity:0;transform:translate(63%,15%) rotate(-19deg)}}
.battle-flash,.blade-arc,.impact-ring{pointer-events:none;z-index:7}
.game-motto{color:#8b8594;letter-spacing:2px;font-size:9px}
.progress-card,.daily-card,.world-banner,.stats-card{border:1px solid #4c465285;background:linear-gradient(155deg,#191d2a,#121723);box-shadow:inset 0 1px #ffffff09;border-radius:12px}
.progress-head strong{color:#f0e4d7}
.progress-fill{background:linear-gradient(90deg,#a95e56,#e7b47d)}
.xp-fill{background:linear-gradient(90deg,#7c74b1,#c4b4e5)}
.skill-button{border:1px solid #d4a675b0;background:linear-gradient(135deg,#80513d,#50302c);box-shadow:0 8px 18px #0005;color:#fff1dc;border-radius:9px}
.auto-button{background:#1f2833;color:#d9e5ea;border-color:#526373;border-radius:9px}
.navtabs{border:1px solid #414659;background:#0e1420;border-radius:12px;margin-top:10px;gap:3px}
.navtab{background:transparent;border:0;color:#aab0c0}
.navtab.active{background:#342d36;border:1px solid #9e8065;color:#ffe0b1}
.quickdock{background:#0b1019f4;border:1px solid #73645495;border-radius:12px;box-shadow:0 9px 30px #000b}
.quickdock button{background:#242633;border-color:#555363;color:#e7ddd0;border-radius:8px;font-size:11px}
.quickdock button:first-child{background:#52332d;border-color:#a36f58}
/* Hide misleading old overlays when GLB is active */
.arena-3d-active .character:before,.arena-3d-active .character:after{display:none!important}
@media(max-width:375px){.arena,.arena.zone-1,.arena.zone-2,.arena.zone-3,.arena.zone-4{height:490px}.arena h2{font-size:20px;max-width:170px}.scene-mode,.camera-mode,.quality-mode{right:8px;width:105px;min-width:105px;font-size:8px}.arena .battle-scene{inset:166px 5px 39px}.combatant-name{font-size:9px}.summary-stat{padding:9px 7px}.summary-stat strong{font-size:21px}.app{padding-left:8px;padding-right:8px}.arena-2d-active .character{height:175px}}
@media(min-width:600px){.arena,.arena.zone-1,.arena.zone-2,.arena.zone-3,.arena.zone-4{height:570px}.arena h2{font-size:27px}.arena .battle-scene{inset:183px 15px 39px}}
@media(prefers-reduced-motion:reduce){.world-vignette,.v2-hit .cinematic-cut,.v2-special .cinematic-cut{animation:none!important}}
/* Final mobile composition: three controls on one row; names beside the HP area, not over heads. */
.scene-mode,.camera-mode,.quality-mode{top:85px;min-width:0;height:32px;display:grid;place-items:center;font-size:9px}
.scene-mode{left:13px;right:auto;width:118px}
.camera-mode{left:calc(50% - 50px);right:auto;width:100px}
.quality-mode{left:auto;right:13px;width:96px}
.arena .battle-scene{inset:126px 10px 38px}
.combatant-name,.arena-3d-active .combatant-name{top:auto!important;bottom:79px;left:3px;right:3px;z-index:18;background:linear-gradient(90deg,transparent,#090d17de 14%,#101322e9 50%,#090d17de 86%,transparent);padding:5px 0;text-shadow:0 2px 7px #000}
.combatant-name small{margin-top:1px}
.arena-2d-active .character-art{-webkit-mask-image:radial-gradient(ellipse 68% 71% at 50% 47%,#000 52%,transparent 98%);mask-image:radial-gradient(ellipse 68% 71% at 50% 47%,#000 52%,transparent 98%)}
@media(max-width:375px){.scene-mode,.camera-mode,.quality-mode{top:81px;height:29px;font-size:8px}.scene-mode{left:7px;width:103px}.camera-mode{left:calc(50% - 43px);width:86px}.quality-mode{right:7px;width:89px}.arena .battle-scene{inset:120px 6px 38px}.combatant-name{bottom:73px;font-size:9px}}

/* V2.0.1: actors remain visible until the first successful GLB frame. */
.arena-3d-preparing #arena3d{opacity:0!important;pointer-events:none}
.arena-3d-preparing .character,.arena-3d-preparing .character-art{opacity:1!important;visibility:visible!important}