@font-face { font-family: 'Ssurround'; src:url('/shared/ui/fonts/Cafe24Ssurround.ttf') format('truetype'); font-weight:400 900; font-display:swap; }
@font-face { font-family: 'Hanna'; src:url('/shared/ui/fonts/BM-HANNA.ttf') format('truetype'); font-weight:400 900; font-display:swap; }
:root { --ui-navy:#0b1f4d; --ui-yellow:#ffc72c; --ui-stroke:#07172b; --ui-font:'Ssurround','Jua',sans-serif; --ui-heading:'Hanna','Ssurround',sans-serif; }
.game-logo { display:block; overflow:hidden; aspect-ratio:717/374; position:relative; }
.game-logo img { position:absolute; width:100%; height:100%; max-width:100%; inset:0; object-fit:contain; }
html:not(:lang(zh)) [data-art]:not([data-art=""]),
html:lang(zh) [data-art]:not([data-art=""],[data-art="clip"],[data-art="fall"]) { color:transparent!important; text-shadow:none!important; -webkit-text-stroke:0!important; }
[data-art]:not([data-art=""])::after { content:''; position:absolute; inset:0; background:var(--art-image) center/contain no-repeat; pointer-events:none; }
[data-art="3"] { --art-image:url('/shared/ui/count-3.png'); }
[data-art="2"] { --art-image:url('/shared/ui/count-2.png'); }
[data-art="1"] { --art-image:url('/shared/ui/count-1.png'); }
[data-art="start"] { --art-image:var(--ui-image-start,url('/shared/ui/localized/ko/start.png')); }
[data-art="finish"] { --art-image:var(--ui-image-finish,url('/shared/ui/localized/ko/finish.png')); }
[data-art="clear"] { --art-image:var(--ui-image-perfect,url('/shared/ui/localized/ko/perfect.png')); }
[data-art="clip"] { --art-image:var(--ui-image-clip,url('/shared/ui/localized/ko/clip.svg')); }
[data-art="fall"] { --art-image:var(--ui-image-fall,url('/shared/ui/localized/ko/fall.png')); }
/* Chinese keeps its translated clip/fall text until it has its own artwork. */
html:lang(zh) :is([data-art="clip"],[data-art="fall"])::after { content:none; }
.ui-icon { display:inline-block; width:1.2em; height:1.2em; vertical-align:middle; object-fit:contain; }
html:lang(ja),html:lang(zh) { --ui-font:system-ui,'Yu Gothic','Meiryo','Microsoft YaHei',sans-serif; --ui-heading:var(--ui-font); }
