/* Original EOS art and skill atlases. A separate action layout leaves Classic available. */
#actionPreferences{z-index:51;bottom:100px;right:24px;width:310px;max-height:70vh;overflow:auto}
#actionPreferences label{display:block;margin:14px 0 0;font-size:12px;color:#d6c9ad}
#actionPreferences select{width:100%;margin-top:5px;padding:9px;background:#111d25;color:#f3ead6;border:1px solid #647575}
#actionPreferences .action-check{display:flex;gap:9px;align-items:center;line-height:1.5}
#actionPreferences input[type=checkbox]{width:18px;height:18px;margin:0;accent-color:#bda36e}
#actionPreferences p{font-size:11px;line-height:1.8;color:#a4b5b9;margin:12px 0 0}
#actionResetCamera{margin-top:15px;min-height:40px;width:100%}
.action-settings-close{position:absolute;right:9px;top:7px;font-size:21px!important;width:30px;height:30px;padding:0!important}
#actionPrimary,#actionTargetNext,#actionControlHint{display:none}
/* Round 13 walk pad custom UI: --walk-pad-scale is set inline only when the player picks a size other than 100 %, so the default
   computes to exactly the breakpoint px below. The whole square and the label take the touch as before (corners must not fall through to a ground walk). */
#actionTouchPad{position:absolute;left:28px;bottom:95px;width:calc(136px*var(--walk-pad-scale,1));height:calc(136px*var(--walk-pad-scale,1));touch-action:none;user-select:none;pointer-events:auto;z-index:5}
.touch-pad-ring{position:absolute;inset:0;border-radius:50%;border:1px solid #e9e0c35c;background:radial-gradient(circle,#0b15153b 0 37%,#d4d2ba12 38% 39%,#0b151548 40%);box-shadow:inset 0 0 20px #0003,0 2px 15px #0003}
.touch-pad-thumb{position:absolute;top:50%;left:50%;width:calc(58px*var(--walk-pad-scale,1));height:calc(58px*var(--walk-pad-scale,1));border-radius:50%;transform:translate(-50%,-50%);border:1px solid #f7e5bdb3;background:radial-gradient(circle at 35% 25%,#91a49b70,#263c418c);box-shadow:0 3px 15px #0005;pointer-events:none}
.touch-pad-label{position:absolute;bottom:-23px;width:100%;text-align:center;font-size:11px;color:#e1e1d1;text-shadow:0 1px 4px #000}
#actionTouchPad.active .touch-pad-ring{border-color:#d0b16bc9}
#actionTouchPad.editing{outline:2px dashed #f0d38c;outline-offset:5px;cursor:move}
#actionTouchPad.editing .touch-pad-ring{border-color:#f0d38c;background:radial-gradient(circle,#2a3a2a66 0 37%,#f0d38c22 38% 39%,#1b2a1f80 40%)}
#actionTouchPad.editing .touch-pad-label{color:#ffe7a8;white-space:nowrap}
#actionPreferences .walk-pad-settings{margin-top:14px;padding-top:11px;border-top:1px solid #a4b5b938}
#actionPreferences .walk-pad-settings>b{font-size:12px;color:#e6c88c}
#actionPreferences .walk-pad-size{margin-top:8px}
.walk-pad-size output{float:right;color:#f3ead6;font-variant-numeric:tabular-nums}
.walk-pad-size input{display:block;width:100%;height:28px;margin:4px 0 0;accent-color:#bda36e}
.walk-pad-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.walk-pad-buttons button,#walkPadEditor button{min-height:40px}
#actionPreferences .walk-pad-off{margin-top:6px}
#walkPadUseTouch{display:block;margin-top:6px;min-height:40px;width:100%}
#walkPadEditor{position:absolute;z-index:79;top:12px;left:50%;transform:translateX(-50%);width:min(460px,calc(100vw - 24px));box-sizing:border-box;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:9px 12px;background:#111d25f5;border:1px solid #e2c389;border-radius:6px;box-shadow:0 4px 30px #0009;pointer-events:auto;font-size:12px;color:#d6c9ad}
#walkPadEditor[hidden]{display:none}
#walkPadEditor>b{flex:1 0 100%;color:#e6c88c;font-size:12px}
#walkPadEditor label{flex:1 1 150px}
#gameHud #walkPadEditor .walk-pad-done{border-color:#e2c389;color:#fff2d0}
body.touch-controls .walk-pad-buttons button,body.touch-controls #walkPadEditor button,body.touch-controls #walkPadUseTouch{min-height:44px}
body:not(.touch-controls) #actionTouchPad{display:none}
body.action-layout.exploring:before{background:linear-gradient(0deg,#050a0c66,transparent 22%,transparent 75%,#03070a28)}
body.action-layout #gameHud .player-frame{left:24px;top:24px;width:250px;padding:9px 11px;border:0;border-left:2px solid #c6b181;background:linear-gradient(90deg,#0b1723da,#14252b80,transparent);box-shadow:none}
body.action-layout .unit-meter{height:15px;border:0;box-shadow:0 1px 2px #0007}
body.action-layout .resource-meter{height:10px}
body.action-layout .resource-meter small{font-size:9px}
body.action-layout .target-frame{top:27px;width:290px;left:calc(50% - 145px);background:linear-gradient(90deg,transparent,#0b1723df 20% 80%,transparent);border:0;box-shadow:none;text-align:center;padding:5px 18px}
body.action-layout #targetHealth{height:8px;margin:4px 0}
body.action-layout #targetDistance{min-height:18px}
body.action-layout #targetPanel #attackButton{display:none}
body.action-layout #targetPanel #talkButton{position:fixed;bottom:210px;right:335px;min-width:136px;min-height:46px;border-radius:25px;border-color:#e2c389;background:#152a31e8;padding:8px 16px!important;box-shadow:0 3px 20px #0006;font-size:13px}
body.action-layout .quest-panel,body.action-layout.has-minimap .quest-panel{left:24px;right:auto;top:128px;width:260px;max-height:36vh;padding:10px 12px;border:0;border-left:2px solid #c9b88988;background:linear-gradient(90deg,#0a1625c4,#0a162560,transparent);mask-image:linear-gradient(#000 94%,transparent)}
body.action-layout .quest-panel .eyebrow{margin:0 0 10px;font-size:10px;letter-spacing:1.6px}
body.action-layout .quest-panel b{color:#edd8a2;font-size:12px}
body.action-layout .quest-goal{font-size:11px;padding:3px 0;line-height:1.5}
body.action-layout #questList .quest-goal{border:0;background:transparent;box-shadow:none;padding:3px 0;font-size:11px;line-height:1.5;color:#d9e1d6}
body.action-layout #questList .quest-goal:hover:enabled{color:#ffe5a4;background:#182d3459}
body.action-layout #eosMinimap{top:92px;right:25px;width:164px;height:164px;border-radius:10px;border:1px solid #c4ae7a8c;box-shadow:0 6px 24px #0006}
body.action-layout #eosMinimap canvas{width:164px;height:164px}
body.action-layout .location-frame{top:57px;right:24px;background:#0a1823b8;border:0;max-width:250px;font-size:10px}
body.action-layout .game-bottom{width:296px;height:282px;max-width:none;left:auto;right:24px;bottom:90px;transform:none;text-align:center;transform-origin:bottom right}
body.action-layout .hotbar-frame{display:block;position:relative;width:296px;height:282px;padding:0;border:0;background:none;box-shadow:none}
body.action-layout #skillBar{display:block;position:relative;width:296px;height:252px}
body.action-layout #skillBar .skill{position:absolute;width:56px;height:56px;min-height:56px;max-width:56px;padding:5px;display:grid;place-items:center;border-radius:50%;border:1px solid #b2b8a8a6;background:radial-gradient(circle at 35% 22%,#39505ad9,#06131bf0 75%);box-shadow:inset 0 0 0 3px #0b1729aa,0 3px 12px #0007;overflow:visible;transition:box-shadow .12s,border-color .12s}
body.action-layout #skillBar .skill-icon{border-radius:50%;overflow:hidden;max-width:44px;max-height:44px;transform:none;margin:0;pointer-events:none}
body.action-layout #skillBar .skill:nth-child(1){left:36px;top:132px}
body.action-layout #skillBar .skill:nth-child(2){left:3px;top:68px}
body.action-layout #skillBar .skill:nth-child(3){left:51px;top:12px}
body.action-layout #skillBar .skill:nth-child(4){left:119px;top:0}
body.action-layout #skillBar .skill:nth-child(5){left:187px;top:26px}
body.action-layout #skillBar .skill:nth-child(6){left:232px;top:90px}
body.action-layout #skillBar .skill:nth-child(7){left:198px;top:158px}
body.action-layout #skillBar .skill:nth-child(8){left:113px;top:194px}
body.action-layout #skillBar .skill-key{top:-4px;left:2px;width:19px;height:19px;display:grid;place-items:center;background:#0c1728eb;border:1px solid #a6b7b456;border-radius:50%;font:10px/1 system-ui;color:#f9efd1}
body.action-layout #skillBar .skill:active:enabled{transform:scale(.94)}
body.action-layout #skillBar .skill:hover:enabled{border-color:#ffe4a7;box-shadow:inset 0 0 0 3px #0b1729aa,0 0 13px #c8b48359}
body.action-layout #skillBar .empty-skill{opacity:.25}
body.action-layout #skillBar .skill[data-cooldown]:not([data-cooldown=""])::after{inset:3px;border-radius:50%;background:#020915bc;font-size:17px}
body.action-layout #actionPrimary{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;position:absolute;left:109px;top:93px;width:91px;height:91px;padding:9px;border-radius:50%;border:2px solid #d7c59b;background:radial-gradient(circle at 40% 30%,#396c7fe8,#0b2536ed 70%);box-shadow:inset 0 0 0 4px #071521bf,0 0 24px #6cb9d124,0 5px 16px #0008}
body.action-layout #actionPrimary .skill-icon{border-radius:50%;transform:scale(1.08)}
body.action-layout #actionPrimary kbd{position:absolute;right:5px;top:3px;font:10px system-ui;color:#fff0c9}
body.action-layout .action-primary-label{font-size:10px;line-height:15px;color:#fff2d0;pointer-events:none;z-index:1}
body.action-layout #actionPrimary:active:enabled{transform:scale(.96)}
body.action-layout #actionPrimary:disabled{filter:brightness(.55)}
body.action-layout #actionPrimary[data-cooldown]:not([data-cooldown=""])::after{content:attr(data-cooldown);position:absolute;inset:5px;border-radius:50%;display:grid;place-items:center;background:#08131dc9;color:white;font-size:22px}
body.action-layout #actionTargetNext{display:block;position:absolute;right:0;bottom:0;min-height:33px;padding:5px 10px!important;font-size:10px;border-radius:18px;background:#11242cc9}
body.action-layout .skill-pages{position:absolute;left:27px;bottom:0;flex-direction:row;gap:7px;min-height:33px;margin:0}
body.action-layout .skill-pages button{height:31px;width:31px;border-radius:50%;font-size:18px}
body.action-layout .game-bottom .hotbar-hint{position:absolute;right:0;bottom:-25px;font-size:9px;color:#d5dbc9;letter-spacing:.2px}
body.action-layout .game-menu{right:24px;bottom:18px}
body.action-layout .game-menu button{min-width:47px;min-height:45px;background:#0b1923c2;font-size:10px;border:1px solid #bbbdad55;border-radius:6px}
body.action-layout #soundToggle{right:130px;top:18px;bottom:auto;background:#0b19238a;border-color:#b7c4c544;opacity:.75}
body.action-layout #combatLog{left:24px;bottom:78px;width:260px;max-width:30vw;max-height:90px;font-size:10px;color:#d5d6c5}
body.action-layout #actionControlHint{display:flex;align-items:center;justify-content:center;gap:5px;position:absolute;bottom:24px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:10px;letter-spacing:.2px;color:#d7e0dc;text-shadow:0 1px 4px #000;pointer-events:none}
#actionControlHint kbd{padding:3px 5px;border:1px solid #c5cebd61;border-radius:3px;background:#081b2780;font:10px system-ui}
#actionControlHint i{height:10px;width:1px;background:#b0baab6b;margin:0 5px}
body.action-layout #npcDialog{top:65%;width:min(650px,calc(100vw - 56px));max-height:28vh;background:linear-gradient(90deg,#101c27f2,#152931ed);border-radius:5px;border-color:#c6b58a9e}
body.action-layout #npcDialog h2{font-size:16px;background:linear-gradient(90deg,#45636d66,transparent);padding-top:9px;padding-bottom:9px}
body.action-layout #dialogText{font-size:13px;line-height:1.65}
body.action-layout:has(#npcDialog:not([hidden])) .game-bottom{opacity:.3;pointer-events:none}
body.touch-controls #combatLog{bottom:270px;max-height:70px}
body.touch-controls .skill-key,body.touch-controls #actionPrimary kbd{opacity:.6}
body.touch-controls #actionControlHint{font-size:9px}
body.touch-controls.action-layout .skill-pages button{width:54px;height:54px}
body.touch-controls.action-layout #actionTargetNext{min-height:54px}
body.touch-controls.action-layout .game-bottom,body.touch-controls.action-layout .hotbar-frame{height:310px}
body.touch-controls.action-layout .game-bottom .hotbar-hint{display:none}
@media(max-width:1100px){
 body.action-layout .quest-panel,body.action-layout.has-minimap .quest-panel{width:220px;max-height:33vh}
 body.action-layout #actionControlHint{left:22px;transform:none;font-size:9px;gap:3px}
 body.action-layout .game-bottom{right:16px;bottom:83px;transform:scale(.9)}
 body.action-layout .game-menu{right:16px}
 body.action-layout #soundToggle{top:18px;bottom:auto;right:130px}
 body.action-layout #targetPanel #talkButton{right:298px;bottom:184px}
}
@media(max-width:720px){
 body.action-layout .player-frame{left:12px!important;top:16px!important;width:185px!important}
 body.action-layout .player-frame b{font-size:11px}
 body.action-layout .target-frame{top:90px;left:auto;right:10px;width:172px;padding:4px 8px}
 body.action-layout .quest-panel,body.action-layout.has-minimap .quest-panel{left:12px;top:112px;width:180px;max-height:24vh;padding:8px;z-index:1}
 body.action-layout .quest-panel .eyebrow{font-size:9px}
 body.action-layout .quest-panel b,body.action-layout .quest-goal{font-size:10px}
 body.action-layout #eosMinimap{display:block;top:18px;right:12px;width:98px;height:98px;border-radius:6px;opacity:.85}
 body.action-layout #eosMinimap canvas{width:98px;height:98px}
 body.action-layout .target-frame{top:130px;right:10px}
 body.action-layout .game-bottom{right:10px;bottom:83px;transform:scale(.81)}
 body.action-layout .game-menu{right:10px;bottom:15px}
 body.action-layout .game-menu button{min-width:43px;min-height:44px;font-size:9px;padding:4px!important;flex-shrink:0}
 body.action-layout.exploring #menuButton{display:block;position:fixed;left:12px;bottom:15px;top:auto;min-height:44px;width:125px;margin:0;font-size:10px;background:#0b1923c2}
 body.action-layout #soundToggle{right:12px;top:121px;bottom:auto;font-size:9px}
 body.action-layout #targetPanel #talkButton{bottom:330px;right:14px;min-height:44px;font-size:12px}
 body.action-layout .game-bottom .hotbar-hint{display:none}
 body.action-layout #actionControlHint{left:12px;bottom:67px;font-size:8px;max-width:90vw;white-space:normal}
 body.action-layout #combatLog{left:12px;bottom:272px;width:150px;max-width:43vw;font-size:9px;max-height:60px}
 #actionTouchPad{left:12px;bottom:120px;width:calc(112px*var(--walk-pad-scale,1));height:calc(112px*var(--walk-pad-scale,1))}
 .touch-pad-thumb{width:calc(48px*var(--walk-pad-scale,1));height:calc(48px*var(--walk-pad-scale,1))}
 #actionPreferences{width:calc(100vw - 24px);right:12px;bottom:75px;max-height:65vh}
 body.action-layout #npcDialog{width:calc(100vw - 24px);top:45%;max-height:36vh}
 body.action-layout #controlsHelp{bottom:76px;right:12px;width:calc(100vw - 24px);max-height:65vh;overflow:auto}
}
@media(max-height:560px) and (min-width:721px){
 body.action-layout .game-bottom{right:14px;bottom:63px;transform:scale(.8)}
 body.action-layout .quest-panel,body.action-layout.has-minimap .quest-panel{top:112px;max-height:26vh;width:205px}
 body.action-layout #eosMinimap{width:80px;height:80px;top:14px;right:14px}
 body.action-layout #eosMinimap canvas{width:80px;height:80px}
 body.action-layout .location-frame{display:none}
 body.action-layout #gameHud .player-frame{top:14px;width:205px}
 body.action-layout .game-bottom .hotbar-hint{display:none}
 body.action-layout #menuButton{margin-right:90px}
 body.action-layout #targetPanel #talkButton{bottom:150px;right:270px}
 #actionTouchPad{width:calc(110px*var(--walk-pad-scale,1));height:calc(110px*var(--walk-pad-scale,1));bottom:58px}
 body.action-layout #actionControlHint{bottom:12px;font-size:9px}
 body.action-layout .game-menu{bottom:9px}
 body.action-layout #soundToggle{top:18px;bottom:auto;right:230px}
}
@media(prefers-reduced-motion:reduce){body.action-layout #skillBar .skill{transition:none}}
