/* The camera shows a subregion of a larger, server-simulated field. */
.v011-layout .scene{height:620px;cursor:crosshair;touch-action:pan-y}
.v011-layout .scene-top{z-index:500;pointer-events:none}
.v011-layout .scene-top button{pointer-events:auto}
.v011-layout .field-status,.v011-layout .scene-caption{z-index:500;pointer-events:none}
.v011-layout .hero-actor{width:90px;pointer-events:none;transform:translate(-50%,-76%)}
.v011-layout .hero-actor .hero-art{height:105px;width:80px}
.v011-layout .spatial-enemy{transform:translate(-50%,-60%);width:86px}
.v011-layout .spatial-enemy[hidden]{display:none!important}
.v011-layout .spatial-enemy .monster-art,.v011-layout .spatial-enemy .ro-asset{width:59px;height:61px}
.v011-layout #landscape{width:100%;height:100%;will-change:transform}
#v11-move-hint{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);background:#23384bdd;color:#fff;border:1px solid #a5c2db55;border-radius:6px;padding:7px 12px;font-size:10px;z-index:520;max-width:90%;text-align:center;pointer-events:none}
.v011-layout .scene-caption{bottom:50px;font-size:9px}
#v11-destination{position:absolute;width:34px;height:22px;color:#fbdd80;text-align:center;transform:translate(-50%,-50%);border:2px solid #e5ce87;border-radius:50%;font-size:25px;line-height:13px;z-index:10;pointer-events:none;box-shadow:0 0 12px #fbf3b9}
.v011-layout .battle-hotbar{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;padding:10px}
.v011-layout .hotbar-skill{flex-direction:column;min-height:68px;padding:8px 2px 5px;gap:4px;min-width:0}
.v011-layout .hotbar-skill strong{font-size:9px;overflow:hidden;text-overflow:ellipsis;max-width:75px;white-space:nowrap}
.v011-layout .hotbar-skill small{font-size:8px}
.v011-layout .loadout-editor{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.v011-layout .minimap{background:#24475bad;overflow:hidden;width:72px;height:72px}
.v011-layout .minimap:before,.v011-layout .minimap:after{display:none}
.v11-mini-view{position:absolute;border:1px solid #e9e9e3;background:#ffffff17}
.v11-mini-self{position:absolute;border-radius:50%;width:5px;height:5px;transform:translate(-50%,-50%);background:#fff6a8}
.v011-layout .minimap b{position:absolute;bottom:1px;left:9px;color:#d9e3ee;font:8px monospace}
.v011-layout .v10-field-tools{flex-wrap:wrap;gap:4px}
.v011-layout .v10-field-tools button{padding:5px 7px;font-size:10px}

@media(max-width:760px){.v011-layout .scene{height:495px}.v011-layout .battle-hotbar{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:8px}.v011-layout .hotbar-skill{flex-direction:row;min-height:49px}.v011-layout .hotbar-skill strong{max-width:53px;font-size:8px}.v011-layout .hotbar-skill .icon{width:20px}.v011-layout .hero-actor .hero-art{height:85px;width:66px}.v011-layout .hero-actor{width:74px}.v011-layout .spatial-enemy{width:71px}.v011-layout .spatial-enemy .monster-art,.v011-layout .spatial-enemy .ro-asset{width:49px;height:52px}.v011-layout .v10-field-heading{align-items:flex-start;gap:5px}.v011-layout .v10-field-heading>span{display:none}#v11-move-hint{font-size:9px;min-width:240px}.v011-layout .loadout-editor{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Preserve actual official pixels when browser refuses CORS canvas access.
   White blending is a fallback, not a claim of lossless transparent sprites. */
.ro11-crop{display:none;position:absolute;left:0;top:0;width:70px;height:102px;overflow:hidden;transform:scale(1.36);transform-origin:top left;background:transparent;border:0;box-shadow:none;filter:none}
.ro11-crop img{position:absolute!important;width:300px!important;height:210px!important;max-width:none!important;left:-70px!important;top:-75px!important;object-fit:fill!important;image-rendering:pixelated;border:0;filter:none}
.ro09-hero.ro11-ready:not(.alpha-ready) .ro11-crop{display:block}
.ro09-hero.ro11-ready:not(.alpha-ready) .ro09-hero-fallback{display:none!important}
.ro09-hero.alpha-ready .ro11-crop{display:none}
#hero-actor.v11-blended .actor-art{mix-blend-mode:multiply;isolation:auto}
#hero-actor:has(.alpha-ready) .actor-art{mix-blend-mode:normal}

#hero-actor .ro09-hero{width:77px!important;height:112px!important}#hero-actor .ro09-alpha{width:77px!important;height:112px!important}#hero-actor .ro11-crop{transform:scale(1.1)}
@media(max-width:760px){#hero-actor .ro09-hero{width:63px!important;height:92px!important}#hero-actor .ro09-alpha{width:63px!important;height:92px!important}#hero-actor .ro11-crop{transform:scale(.9)}}
