/* Both skins keep the same menu geometry. Only their surfaces are themed. */
.start-screen .pause-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.pause-tools button{min-width:0;padding-inline:8px;white-space:nowrap}
/* Each option previews its own UI, independently of the active game skin. */
@font-face{font-family:'Galmuri11';src:url('fonts/Galmuri11.woff2?h=f467d1b10e6b88df') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Galmuri11';src:url('fonts/Galmuri11-Bold.woff2?h=8643094f395aa2db') format('woff2');font-weight:700;font-style:normal;font-display:swap}
#overlay .start-screen.graphics-choice{width:min(480px,100%);height:auto;min-height:0;padding:24px;max-height:100%;overflow:auto;text-align:center}
#overlay .graphics-choice .eyebrow{font-size:12px;line-height:1.4;margin:0 0 8px;letter-spacing:.16em}
#overlay .graphics-choice h2{font-size:clamp(20px,3vw,24px);line-height:1.4;margin:0;word-break:keep-all}
#overlay .graphics-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:22px 0 0;padding-bottom:4px}
#overlay .graphics-options button{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:88px;margin:0;padding:18px 10px;font-size:18px;font-weight:700;line-height:1.4;letter-spacing:0;white-space:nowrap;transition:background .15s,border-color .15s,transform .15s}
#overlay #graphicsOriginal{font-family:'Noto Sans KR',sans-serif;border:1px solid #a7b8c36b;border-radius:8px;background:linear-gradient(145deg,#26343f,#14212b);color:#e7eae2;box-shadow:0 5px 14px #0003,inset 0 1px 0 #ffffff12;text-shadow:none}
#overlay #graphicsPixel{font-family:'Galmuri11','Noto Sans KR',sans-serif;border:2px solid #819994;border-radius:0;background:#1a2c36;color:#f0eee0;box-shadow:inset 0 2px 0 #f2efce20,0 4px 0 #050c12;text-shadow:none}
#overlay #graphicsOriginal[aria-pressed="true"]{border-color:#e7c887;background:linear-gradient(145deg,#3e3b2e,#252b2b);box-shadow:0 5px 14px #0003,inset 0 0 0 1px #e7c88755}
#overlay #graphicsPixel[aria-pressed="true"]{border-color:#e7c887;background:#30382e;box-shadow:inset 0 2px 0 #fff3c62e,0 4px 0 #050c12}
@media (hover:hover){#overlay #graphicsOriginal:hover{border-color:#f2d395;background:linear-gradient(145deg,#39434a,#202e36)}#overlay #graphicsPixel:hover{border-color:#f2d395;background:#29434b}}
#overlay .graphics-options button:focus-visible{outline:2px solid #8adacb;outline-offset:4px}
#overlay .graphics-options button:active{transform:translateY(2px)}
.graphics-choice #graphicsBack{margin-top:18px}
@media (max-width:480px){#overlay .start-screen.graphics-choice{padding:20px 16px}#overlay .graphics-options{gap:10px;margin-top:18px}#overlay .graphics-options button{min-height:76px;font-size:16px;padding:14px 8px}}
@media (max-height:440px){#overlay .start-screen.graphics-choice{width:min(440px,100%);padding:16px 20px}#overlay .graphics-choice .eyebrow{margin-bottom:4px}#overlay .graphics-choice h2{font-size:20px}#overlay .graphics-options{margin-top:14px;gap:12px}#overlay .graphics-options button{min-height:66px;padding:12px 8px;font-size:17px}.graphics-choice #graphicsBack{margin-top:12px}}
.tutorial-prompt .tutorial-decisions{margin-bottom:0}
#graphicsLoading{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:rgba(6,13,20,.96);color:#eee8d8;text-align:center;padding:20px}
#graphicsLoading[hidden]{display:none}
#graphicsLoading>div{max-width:420px;font:inherit;line-height:1.6}
#graphicsLoading button{padding:10px 20px;margin:12px 5px}
html[data-graphics="pixel"] #graphicsLoading{font-family:'Galmuri11',sans-serif}
/* Include every scrollable in-game descendant, in Firefox and Chromium/WebView. */
html[data-graphics="original"] body{scrollbar-color:#a69770 #101b23;scrollbar-width:thin}
html[data-graphics="pixel"] body{scrollbar-color:#b8ae88 #14222b;scrollbar-width:thin}
html[data-graphics] body *{scrollbar-color:inherit;scrollbar-width:thin}
html[data-graphics="original"] ::-webkit-scrollbar{width:9px;height:9px}
html[data-graphics="original"] ::-webkit-scrollbar-track{background:#101b23;border-radius:5px}
html[data-graphics="original"] ::-webkit-scrollbar-thumb{background:#a69770;border:2px solid #101b23;border-radius:5px}
html[data-graphics="pixel"] ::-webkit-scrollbar{width:12px;height:12px}
html[data-graphics="pixel"] ::-webkit-scrollbar-track{background:#14222b;border:2px solid #08121a;border-radius:0}
html[data-graphics="pixel"] ::-webkit-scrollbar-thumb{background:#aa9e7d;border:2px solid #14222b;border-radius:0;box-shadow:inset 2px 2px #e2d5ac,inset -2px -2px #6d6858}
html[data-graphics="pixel"] ::-webkit-scrollbar-thumb:hover{background:#cebd8e}
html[data-graphics="pixel"] ::-webkit-scrollbar-corner{background:#14222b}
@media (pointer:coarse),(max-width:800px),(max-width:1000px) and (max-height:500px){
 .pause-tools{gap:8px}.pause-tools button{font-size:12px;padding:10px 4px}

}

/* The pendant is clipped to its existing atlas cell, with each preview fixed to its own skin. */
#overlay .start-screen.graphics-choice{width:min(560px,100%)}
#overlay .graphics-options button{gap:12px;min-height:104px;white-space:normal;word-break:keep-all}
#overlay .graphics-preview{display:block;flex:0 0 44px;width:44px;height:72px;background-repeat:no-repeat;background-size:240.42px 160.28px;background-position:-129.91px -84.52px;pointer-events:none}
#overlay .graphics-preview-pixel{image-rendering:pixelated}
@media(max-width:480px){#overlay .graphics-options{gap:10px}#overlay .graphics-options button{gap:8px;padding:12px 8px;font-size:16px}#overlay .graphics-preview{flex-basis:34px;width:34px;height:56px;background-size:186.99px 124.66px;background-position:-101.04px -65.74px}}
@media(max-width:350px){#overlay .graphics-options button{gap:5px;font-size:14px}}
@media(max-height:440px){#overlay .start-screen.graphics-choice{width:min(520px,100%)}#overlay .graphics-options button{min-height:80px;padding:8px}}

/* Fill each pause-menu grid column instead of centering narrow intrinsic buttons. */
#overlay .start-screen .pause-tools{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#overlay .start-screen .pause-tools button{width:100%;min-width:0;margin:0;padding:10px 12px;white-space:nowrap}
#graphics .graphics-symbol{font-size:1.15em;line-height:1;vertical-align:baseline}
@media(max-width:480px){#overlay .start-screen .pause-tools{gap:6px}#overlay .start-screen .pause-tools button{font-size:12px;padding:10px 5px}#overlay .pause-tools span{margin-right:3px}}

#overlay .graphics-choice .graphics-tutorial-note{margin:16px 0 0;font:inherit;font-size:14px;line-height:1.6;color:#b9c8c5;word-break:keep-all}
.mobile-tools #mobileWeapon.has-mastery{display:flex;align-items:center;justify-content:center;gap:2px;padding-inline:4px}
#mobileWeapon .mobile-weapon-name{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#mobileWeapon .mobile-weapon-mastery{flex:none;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:0}

#assetRecovery{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:24px;background:#06101cf5;color:#ede5d0;text-align:center}#assetRecovery[hidden]{display:none!important}#assetRecovery>div{max-width:440px}#assetRecovery p{font-size:16px;line-height:1.65}#assetRecovery button{min-height:44px;margin-top:12px;padding:10px 22px}html[data-graphics="pixel"] #assetRecovery{font-family:'Galmuri11',sans-serif}html[data-graphics="original"] #assetRecovery{font-family:'Ashen Cartoon',serif}

.pixel-control-rim{display:none}
