/* Reference-inspired Gothic HUD; all controls remain real HTML buttons. */
#gameScreen{--ref-ring:url('/assets/ui/reference-ring.svg');--ref-panel:url('/assets/ui/reference-panel.svg')}
#gameScreen .hud{position:absolute;top:calc(10px + env(safe-area-inset-top));left:12px;right:12px;z-index:13;display:flex;align-items:flex-start;gap:9px;pointer-events:none}
#gameScreen .hud>*{pointer-events:auto}
#gameScreen .hall-status{width:min(35vw,440px);min-width:180px;gap:7px;margin-left:72px}
#gameScreen .status-frame{height:29px}
#gameScreen .hud:before{content:'☾';position:absolute;left:0;top:0;width:74px;height:74px;display:grid;place-items:center;background:var(--ref-ring) center/contain no-repeat;color:#d9e2f5;font-size:34px;text-shadow:0 0 16px #afc5ee}
#gameScreen .hud>.chip{margin-left:auto;background:#0b1323c9;border:1px solid #6b7d9a;color:#b7c8df;padding:7px}
#gameScreen #menuBtn{min-width:50px;min-height:50px;background:var(--ref-ring) center/contain no-repeat!important;border:0!important;font-size:24px}
#gameScreen .reference-nav{position:absolute;top:calc(12px + env(safe-area-inset-top));right:90px;z-index:14;display:flex;gap:8px}
#gameScreen .reference-nav button{border:0;background:var(--ref-ring) center/contain no-repeat;width:58px;height:66px;color:#e4e8f4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font:10px Georgia,serif;text-shadow:0 2px 3px #000;cursor:pointer;touch-action:manipulation}
#gameScreen .reference-nav button .ref-icon{font-size:24px}
#gameScreen .reference-nav button:disabled{opacity:.45}
#gameScreen .reference-quest{position:absolute;left:18px;top:calc(150px + env(safe-area-inset-top));z-index:7;width:min(27vw,300px);min-height:106px;padding:23px 25px;background:var(--ref-panel) center/100% 100% no-repeat;color:#e2e5f0;font:15px Georgia,serif;pointer-events:none;text-shadow:0 2px 3px #000}
#gameScreen .reference-quest strong{display:block;font-size:17px;margin-bottom:8px}
#gameScreen .reference-quest small{font-size:12px;color:#bcc9dc}
#gameScreen .reference-hotbar{position:absolute;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:9;width:310px;max-width:34vw;height:75px;background:var(--ref-panel) center/100% 100% no-repeat;display:flex;align-items:center;justify-content:center;gap:7px;padding:13px 25px;pointer-events:none}
#gameScreen .reference-hotbar span{flex:1;height:45px;border:1px solid #6d7d97;background:#080c16a8;display:grid;place-items:center;color:#a6b7d4;font-size:23px}
#gameScreen .reference-hotbar span:first-child{color:#d14b62}#gameScreen .reference-hotbar span:nth-child(2){color:#648fd8}
#gameScreen .joystick{background:var(--ref-ring) center/100% 100% no-repeat!important;border:0!important;box-shadow:none!important;width:180px;height:180px}
#gameScreen .nub{background:radial-gradient(circle,#56657f,#0a101b)!important}
#gameScreen .weapon-actions{display:flex;gap:8px;width:auto;right:20px;bottom:calc(35px + env(safe-area-inset-bottom));align-items:center}
#gameScreen .weapon-actions .skill{width:96px;height:96px;min-height:96px;border:0!important;background:var(--ref-ring) center/contain no-repeat!important;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px!important}
#gameScreen .weapon-actions .skill img{height:36px}
#gameScreen .actionline{right:14px;left:auto;top:calc(155px + env(safe-area-inset-top));bottom:auto;display:flex;flex-direction:column;gap:9px;z-index:9}
#gameScreen .actionline .orn{width:94px;min-height:65px;max-width:94px;background:var(--ref-ring) center/contain no-repeat!important;border:0!important;font-size:12px}
#gameScreen .bottom{bottom:calc(22px + env(safe-area-inset-bottom));left:24px;right:20px}
#gameScreen #skills{position:absolute;right:230px;bottom:0;display:flex;flex-wrap:wrap;justify-content:flex-end;max-width:210px;gap:4px}
#gameScreen #skills .skill{width:65px;min-width:65px;height:65px;min-height:65px;background:var(--ref-ring) center/contain no-repeat!important;border:0!important;padding:10px!important}
#gameScreen #inventoryBtn.rpg-bag{display:none}
#gameScreen #hallBuildVersion,#gameScreen #hallRuntimeStatus{display:none!important}
@media(max-width:750px) and (orientation:portrait){
 #gameScreen .hud{left:7px;right:7px;top:calc(8px + env(safe-area-inset-top))}
 #gameScreen .hud:before{width:48px;height:48px;font-size:22px}
 #gameScreen .hall-status{margin-left:48px;width:calc(100vw - 143px);min-width:0;gap:3px}
 #gameScreen .status-frame{height:24px}
 #gameScreen .hud>.chip{display:none}
 #gameScreen #menuBtn{width:44px;min-width:44px;height:44px;min-height:44px}
 #gameScreen .reference-nav{top:calc(77px + env(safe-area-inset-top));left:8px;right:8px;justify-content:space-between;gap:0}
 #gameScreen .reference-nav button{width:19%;height:59px;font-size:9px}
 #gameScreen .reference-nav button .ref-icon{font-size:21px}
 #gameScreen .reference-quest{top:calc(145px + env(safe-area-inset-top));left:7px;width:55vw;min-height:73px;padding:15px 20px;font-size:12px}
 #gameScreen .reference-quest strong{font-size:12px;margin-bottom:3px}
 #gameScreen .reference-quest small{font-size:10px}
 #gameScreen .hall-controls{top:calc(151px + env(safe-area-inset-top));right:9px}
 #gameScreen .actionline{top:auto;right:6px;left:auto;bottom:calc(270px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:1px}
 #gameScreen .actionline .orn{min-width:68px;width:68px;max-width:68px;min-height:57px;font-size:10px}
 #gameScreen .bottom{left:7px;right:7px;bottom:calc(23px + env(safe-area-inset-bottom))}
 #gameScreen .joystick{width:112px;height:112px}
 #gameScreen #skills{right:0;bottom:calc(118px + env(safe-area-inset-bottom));max-width:180px;gap:3px}
 #gameScreen #skills .skill{width:56px;min-width:56px;height:56px;min-height:56px}
 #gameScreen .weapon-actions{right:7px;bottom:calc(18px + env(safe-area-inset-bottom));gap:3px}
 #gameScreen .weapon-actions .skill{width:75px;height:75px;min-height:75px;padding:12px!important}
 #gameScreen .weapon-actions .skill img{height:25px}
 #gameScreen .reference-hotbar{bottom:calc(10px + env(safe-area-inset-bottom));width:155px;max-width:none;height:52px;padding:10px 17px;gap:2px}
 #gameScreen .reference-hotbar span{height:31px;font-size:14px}
 #gameScreen .hall-prompt{bottom:calc(350px + env(safe-area-inset-bottom))}
}
@media(max-height:500px) and (orientation:landscape){
 #gameScreen .reference-nav button{width:48px;height:53px;font-size:9px}
 #gameScreen .reference-quest{top:calc(105px + env(safe-area-inset-top))}
 #gameScreen .joystick{width:110px;height:110px}
 #gameScreen .actionline{top:calc(100px + env(safe-area-inset-top))}
 #gameScreen .actionline .orn{min-height:48px}
 #gameScreen .weapon-actions .skill{width:65px;height:65px;min-height:65px}
 #gameScreen #skills{right:160px}
}
