/* Shadow Ninja UI Polish 01
 * Only visual/interaction presentation. No character, level, save or enemy logic.
 * State is set on <body> by game/polish.js. Initial title state is in HTML.
 */
body.sn-title-active #hud,
body.sn-title-active #pause,
body.sn-title-active #snf-quick,
body.sn-title-active #joy,
body.sn-title-active #actions,
body.sn-title-active #bossbar,
body.sn-title-active #toast,
body.sn-title-active #snInteract,
body.sn-title-active #snOxygen,
body.sn-title-active #snf-target-hint,
body.sn-title-active #snf-hit-indicator,
body.sn-title-active #pauseMenu,
body.sn-title-active #snf-overlay,
body.sn-title-active #qualityBtn,
body.sn-title-active #soundBtn,
body.sn-end-active #hud,
body.sn-end-active #pause,
body.sn-end-active #snf-quick,
body.sn-end-active #joy,
body.sn-end-active #actions,
body.sn-end-active #bossbar,
body.sn-end-active #snInteract,
body.sn-end-active #snOxygen,
body.sn-end-active #snf-target-hint,
body.sn-end-active #snf-hit-indicator,
body.sn-end-active #snf-overlay,
body.sn-panel-active #hud,
body.sn-panel-active #pause,
body.sn-panel-active #snf-quick,
body.sn-panel-active #joy,
body.sn-panel-active #actions,
body.sn-panel-active #snInteract,
body.sn-panel-active #snOxygen,
body.sn-panel-active #snf-target-hint,
body.sn-panel-active #snf-hit-indicator,
body.sn-panel-active #bossbar {
 display:none!important;
 pointer-events:none!important;
}

/* Gameplay HUD: reduce visual noise without sacrificing readable text. */
body:not(.sn-title-active) #hud>div {
 backdrop-filter:blur(9px);
 -webkit-backdrop-filter:blur(9px);
 box-shadow:0 5px 15px #0008,0 1px 0 #ffd6dc22 inset!important;
}
body:not(.sn-title-active) #hud #snf-health-fill,
body:not(.sn-title-active) #hud #xpFill,
body:not(.sn-title-active) #bossfill {
 transition:width .18s ease-out;
}
body:not(.sn-title-active) #hud .right {
 max-width:min(36vw,290px);
}
#snf-quick.has-points .snf-point-badge {
 animation:snPolishBadge 2.6s ease-in-out infinite;
}
#snf-quick:focus-visible,#pause:focus-visible,
#actions button:focus-visible,#snInteract:focus-visible,
#snf-overlay button:focus-visible,#snMenuPanel button:focus-visible,
#menu .menuHotspot:focus-visible {
 outline:2px solid #ffe9ad!important;
 outline-offset:3px;
}

/* Fast, tactile controls. Keep touch regions unchanged. */
#actions button,#snf-quick,#pause,#snInteract {
 touch-action:manipulation;
 -webkit-tap-highlight-color:transparent;
}
#actions button:active,#snInteract:active,
#snf-quick:active,#pause:active {
 transition:transform .07s ease-out,filter .07s ease-out!important;
 transform:scale(.93);
 filter:brightness(1.18);
}
#joy,#nub{transition:box-shadow .15s ease-out}
#joy:active {box-shadow:0 0 0 4px #85d8ff66,inset 0 0 20px #9fe5ff66,0 4px 16px #0008!important}

/* Skill/settings menus animate only when opened. */
#snf-overlay:not([hidden]) {animation:snPolishBackdrop .18s ease-out both}
#snf-overlay:not([hidden]) #snf-shell {
 transform-origin:50% 52%;
 animation:snPolishPanel .22s cubic-bezier(.2,.75,.25,1) both;
}
#snf-overlay #snf-head,#snMenuPanel .sn-panel-head {border-bottom-color:#f0b2b548}
#snf-overlay .snf-skill,#snMenuPanel .sn-setting-card {
 transition:border-color .16s ease-out,background-color .16s ease-out;
}
#snf-overlay .snf-skill:focus-within,
#snf-overlay .snf-skill:hover {border-color:#f7bdca98}
#snf-overlay button:not(:disabled):active,
#snMenuPanel button:not(:disabled):active {
 filter:brightness(1.16);
}
#snf-target-hint {font-variant-numeric:tabular-nums;box-shadow:0 3px 10px #0007}
#snf-hit-indicator.show {filter:drop-shadow(0 0 7px #ffba78a9)}

/* Short, safe mobile-landscape layout. Keep the side thumb zones free. */
@media(orientation:landscape) and (max-height:440px){
 #hud>div:first-child{max-width:32vw;padding:6px 9px!important}
 #hud .right{min-width:115px;max-width:32vw;white-space:normal}
 #hud #stageName{font-size:clamp(9px,1.8vw,12px)!important}
 #snf-quick,#pause{border-radius:10px!important}
 #snf-overlay #snf-footer {padding:6px 10px}
 #snf-overlay #snf-body {scrollbar-width:thin}
 #snf-target-hint{bottom:calc(max(8px,env(safe-area-inset-bottom)) + 132px);font-size:9px}
}
@media(orientation:landscape) and (max-height:320px){
 #hud .right{max-width:28vw}
 #hud #snf-health-title{font-size:8px}
 #snf-overlay #snf-head{padding:6px 10px}
 #snf-overlay #snf-tabs button{min-height:30px}
 #snf-overlay .snf-skill-grid{gap:7px}
}
@keyframes snPolishBackdrop {from{opacity:0}to{opacity:1}}
@keyframes snPolishPanel {from{opacity:.75;transform:translateY(9px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes snPolishBadge {0%,100%{box-shadow:0 0 6px #ffc57966}50%{box-shadow:0 0 15px #ffc579dd}}
@media(prefers-reduced-motion:reduce){
 #snf-overlay,#snf-overlay #snf-shell,#snf-quick .snf-point-badge{animation:none!important}
 #snf-overlay .snf-skill,#snMenuPanel .sn-setting-card,
 #hud #snf-health-fill,#hud #xpFill,#bossfill{transition:none!important}
}
