/* Ink, ivory parchment and teal lacquer. All illustrations are the v5 set. */
:root{--gold:#edc37e;--muted:#b8c5bf;--ink:#10252b;--line:#527079;--heal:#93d5b5;--danger:#ee9574;color-scheme:dark}
html,body{background:#101c22;color:#f5e6c6;font-family:'Apple SD Gothic Neo','Malgun Gothic',system-ui,sans-serif}
#game{background:#132a32;border-color:#40585c;touch-action:none}#world,.portrait,.mercPortrait,.uiIcon,#screen,#screen:has(.titlebox),.townArt{image-rendering:auto}
button{border:1px solid #78918b;border-radius:10px;background:#203e43;box-shadow:inset 0 1px #ffffff16,0 3px 0 #0a1d23;color:#f5e6c6;font-weight:700}button:active{transform:translateY(2px);box-shadow:none}.primary{background:linear-gradient(130deg,#f5deb0,#dbb272);border-color:#fff0c7;color:#213b40;box-shadow:0 4px #836b47}.quiet{background:#173139b8;border-color:#587878;color:#c5d3ca}.danger{color:#ffd4b8;border-color:#b27a5d}
.title,.townName,.sectionhead h2{color:#fbe7bd;text-shadow:0 3px #0c222b;letter-spacing:-1.5px}.subtitle,.notice,.roles small,.help{color:#c3d0c7}.eyebrow{color:#afcdbf;letter-spacing:2px}.v3title{margin-top:3vh}.v3title .title{font-family:'Noto Serif KR',Georgia,serif;font-size:44px;color:#ffedc5;text-shadow:0 4px #132c34}.titleKicker{color:#c3dbca;letter-spacing:1px}.v3title .subtitle{color:#e4dec9}.homeMeta{color:#c0cfc2}.v3title .titleParty{height:135px;margin:8px 0}.titleParty .portrait{width:130px;height:130px;filter:drop-shadow(0 6px 7px #071d26aa)}.titleParty .dps{width:145px;height:145px;margin:0 -25px}.version,.homeLink{color:#b5c8bc}
#screen{background:linear-gradient(#142b32f5,#10262df8);scrollbar-color:#678379 #142b32}#screen:has(.v3title){background:linear-gradient(#142b3233,#10242b66 43%,#10252be8 78%,#10252bfa),url('assets/village-v5.webp') center/cover}#screen:has(.townName){background:#142c33f5}#screen:has(.titlebox){background:linear-gradient(#102b3280,#10252bf5),url('assets/village-v5.webp') center/cover}
.card,.mercCard,.roles button,.skillHero,.loadoutBar>div,.heroSummary,.townRunes,.statSummary,.setCard,.setBanner,.runeSlot,.runeBag button,.dialogue,.resultstats div{border:1px solid #6a837a;border-radius:12px;background:linear-gradient(130deg,#28464a,#19373e);box-shadow:inset 0 1px #ecdfb00b}.card.selected,.setCard.active,.runeSlot.selected{border-color:#eccb89;box-shadow:0 0 0 2px #d9b67722}.card h3,.mercCard h3,.heroSummary b,.townnav b,.setCard>b,.setBanner>b,.statSummary h3{color:#f5ddb0}.card p,.mercCard p,.setCard p,.setBanner p{color:#c7d2c5}.card small,.heroSummary small,.heroSummary p{color:#b9c7be}.roleMeters{border-color:#56756c}.marketBanner{background:linear-gradient(110deg,#425c51,#263d42);border:1px solid #a48d63;border-radius:14px}.marketBanner b{color:#f4dfb6}.marketBanner p,.marketTools,.mercCard strong,.rarity{color:#c4d6c8}
.v3town{background-image:url('assets/village-v5.webp');height:225px;background-position:center 72%;border-color:#8b9a83;box-shadow:inset 0 -45px 35px #10252ba0}.v3town>span{background:#10252b99;color:#efe1bf;border-radius:7px;letter-spacing:0}.floorSeal{border:1px solid #d8bd83;background:#203a3bd9;color:#f2d594;border-radius:12px}.wallet{border:1px solid #a1906b;background:#1b363b;border-radius:12px;color:#f8db9e}.townnav button{background:linear-gradient(130deg,#36534e,#203e43);border-color:#6b8980;border-radius:12px;padding:16px 10px 16px 43px}.townnav small,.townRunes>span,.partyStrip{color:#bacabd}.navGlyph{left:12px;top:15px}.embark{border-radius:12px}.rosterRow{border-color:#698275;background:#203e43;border-radius:10px}
.runeTile b{color:#21363b;text-shadow:none}.runeTile em{background:#132b30e8;color:#f3deb9;border-radius:3px;font-size:8px}.runeSlot{padding:12px 4px}.runeTile.empty{border-color:#79948b;background:#143038}.setEmblem{width:48px;height:48px}.statSummary{padding:13px}.statSummary small{color:#b8cec2}.statSummary b{color:#f8e3b9}.setBanner.active{border-color:#c9b177;background:linear-gradient(110deg,#3b574a,#263f42)}.bagRune{border-radius:10px}.setCard p{min-height:72px}.skillCard{border-radius:12px}.skillMeta{color:#d9d7b9}
#hud{padding:calc(9px + env(safe-area-inset-top)) 16px 6px;background:linear-gradient(#10252bfa,#10252bd8 65%,transparent)}.topline{color:#e6d4a4;letter-spacing:1px}.heroRow{margin-top:5px}.health{border:1px solid #799480;border-radius:5px;background:#10272c;height:19px}.health i{background:linear-gradient(90deg,#4b9a83,#b6dbad)}.health span{line-height:17px;color:#fff3d0}.partyMini{background:#193a3bcc!important;border:1px solid #627e73!important;border-radius:5px!important;padding:3px 5px!important}.partyMini b{font-size:9px}.partyMini.recalling{border-color:#f4d89e!important;box-shadow:0 0 8px #f4d89e66}.battleInfo{margin-top:3px;font-size:9px}#objective{font-size:10px;margin-top:4px}#heroBuffs{min-height:0;margin-top:2px}#heroBuffs>span{background:#15343be8;border-color:#5c7d79;border-radius:5px}#heroBuffs small{color:#d8e4d0}
#controls{height:252px;transform:none;left:0;width:100%;bottom:calc(8px + env(safe-area-inset-bottom));background:linear-gradient(transparent,#10252b22 40%,#10252bdd)}#joystick{left:18px;bottom:30px;width:116px;height:116px;border:1px solid #96b6a27a;background:#c3d8b31a;box-shadow:inset 0 0 24px #071e2766}#stick{left:34px;top:34px;width:46px;height:46px;background:radial-gradient(circle at 35% 25%,#e0e0b9,#829b8b);border:1px solid #ecedc7;box-shadow:0 3px 5px #081f2777}#joystick small{color:#bad0c2;bottom:-19px;font-size:10px}
#attackBtn{left:auto;right:16px;bottom:24px;width:82px;height:82px;border-radius:50%;border:2px solid #e8c185;background:radial-gradient(circle at 35% 25%,#45615a,#213d43);box-shadow:inset 0 0 0 4px #132d37,0 5px 0 #0a1d27}#attackBtn>.uiIcon{width:39px;height:39px}#attackBtn small{font-size:9px;color:#f2deb3}#attackBtn .comboPips{bottom:5px}#dodgeBtn{left:auto;right:110px;bottom:24px;width:66px;height:66px;border-radius:50%;border:2px solid #b9e1d9;background:radial-gradient(circle at 35% 25%,#5a8583,#264751);box-shadow:0 4px 0 #0a2632;padding:0;opacity:var(--ready,1)}#dodgeBtn>.uiIcon{width:34px;height:34px}#dodgeBtn small{font-size:10px;color:#e2f2d9}#dodgeBtn strong{font-size:22px}
#rallyBtn{position:absolute;left:150px;bottom:116px;width:64px;height:44px;pointer-events:auto;touch-action:none;border:1px solid #dec68d;border-radius:11px;background:#3c5548;box-shadow:0 3px #10262c;padding:2px}#rallyBtn .uiIcon{width:21px;height:21px;display:block;margin:auto}#rallyBtn small{font-size:9px;color:#f3dfb7;display:block;line-height:13px}#rallyBtn:disabled{opacity:.6}
#skillButtons{right:16px;bottom:122px;grid-template-columns:repeat(2,60px);gap:8px}.skillBtn{width:60px;height:60px;border:1px solid #879b83;border-radius:13px;background:linear-gradient(135deg,#3c5b54,#1b3941);box-shadow:0 3px #0a222c;overflow:hidden}.skillIcon{width:34px;height:34px;left:12px;top:5px}.skillBtn small{font-size:8px;bottom:5px;color:#f3e4c4}.skillBtn.bossSkill{background:linear-gradient(135deg,#6b5643,#383f3c);border-color:#c5a06a}.skillBtn.locked{opacity:.4}.skillBtn.aiming{background:#4b7568;border-color:#eff6cd}.skillBtn .cooldown{background:#102b33df;color:#efd7a7}.skillBtn.fired,#attackBtn.fired{animation:skillFire .17s ease-out}
#runeMeter{left:18px;bottom:184px;width:196px;border:1px solid #b4a67e;border-left:3px solid #e9d29a;border-radius:10px;background:#143139dd;padding:6px 8px}#runeMeter>b{font-size:10px;color:#f1deb6}#runeMeter>small{color:#bfd8ca}#runeMeter i{color:#b0c6bb;border-color:#5d7a70}#runeMeter .current{background:#e6cc95;color:#203d42;box-shadow:0 0 7px #e2cb8c55}
#toast{bottom:280px;background:#19363bed;border:1px solid #bda97c;border-radius:10px;box-shadow:0 4px 15px #081d2766;color:#f4e4c4}#landscape{background:#102931fa}.audioMix{margin-top:20px;display:grid;gap:13px;text-align:left}.audioMix label{display:flex;align-items:center;gap:10px;font-size:12px}.audioMix input{flex:1;min-width:0;accent-color:#ddca91;font-size:16px}.rewardDelta{border-top:1px solid #82917a66;margin:8px 0;padding-top:7px}.rewardDelta small{display:block;color:#c4d6c4;font-size:9px;line-height:1.6}.rewardDelta b{font-size:10px;color:#e6d292}.rewardActions{display:grid;gap:9px;margin:16px 0}.rewardActions button{font-size:11px}.runeReward{background:#25464a;border:1px solid #b6ab7e;border-radius:12px}.runeReward h3{color:#f6dfb4}
@media(max-width:370px){#joystick{left:16px;width:106px;height:106px}#stick{left:29px;top:29px}#attackBtn{right:12px;width:76px;height:76px}#dodgeBtn{right:100px;width:62px;height:62px}#skillButtons{right:12px;grid-template-columns:repeat(2,56px);gap:7px}.skillBtn{width:56px;height:58px}.skillIcon{left:10px}#rallyBtn{left:18px;bottom:165px}#runeMeter{left:18px;bottom:220px;width:138px}#runeMeter>div{gap:1px}#runeMeter i{font-size:8px}}
@media(max-height:720px){#controls{height:252px;transform:none;left:0;width:100%}#screen{padding:16px 18px 22px}.v3title{margin-top:0}.v3title .title{font-size:36px}.v3title .titleParty{height:105px}.titleParty .portrait{width:105px;height:105px}.titleParty .dps{width:118px;height:118px}.titleRuneRow{margin-bottom:15px}.v3title .stack button{min-height:43px}.v3town{height:170px}.titlebox{margin-top:2vh}#hud{padding-top:7px}.heroRow{font-size:10px}#partyHud{margin-top:4px}#heroBuffs small{font-size:8px}#heroBuffs .uiIcon{width:14px;height:14px}.partyMini{padding:2px 4px!important}.partyMini b{font-size:8px}#runeMeter{bottom:184px}#toast{bottom:273px}}
@media(max-width:370px) and (max-height:720px){#runeMeter{bottom:220px}}

/* The generated hero atlas has a taller boss row; crop each actor row explicitly. */
.portrait.tank{background-size:400% 418%;background-position:0 0}.portrait.dps{background-size:400% 447.857%;background-position:0 30.8008%}.portrait.heal{background-size:400% 447.857%;background-position:0 59.5483%}

.mercPortrait{background-size:451.892% 383.487%;background-position:calc(1.8433% + var(--mx)*32.1045%) .6472%}
.mercPortrait[style*="--my:1"]{background-size:451.892% 418%;background-position:calc(1.8433% + var(--mx)*32.1045%) 36.2683%}
.mercPortrait[style*="--my:2"]{background-size:451.892% 418%;background-position:calc(1.8433% + var(--mx)*32.1045%) 68.7631%}
.mercPortrait[style*="--my:3"]{background-size:451.892% 444.681%;background-position:calc(1.8433% + var(--mx)*32.1045%) 99.3827%}
.mercSkills .uiIcon{display:inline-block;border:0;padding:0;margin:0 3px 0 0;background-image:url('assets/icons-v5.webp');background-size:800% 800%;background-position:calc(var(--ux)*100%/7) calc(var(--uy)*100%/7)}
.mercCard.rare{background:linear-gradient(135deg,#31534e,#203d43);border-color:#9ebdb0}.mercCard.unique{background:linear-gradient(135deg,#4e5240,#2c4140);border-color:#ddc58d}

.partyMini.lowhp{border-color:#ed9c7c!important;box-shadow:inset 0 0 8px #d86c4533}.partyMini b small{font-size:8px;color:#dddbc1;font-weight:400}

#dodgeBtn.defending{border-color:#c9f5ff;box-shadow:0 0 22px #79d5ff88;background:#24495b} .iceLocked{filter:saturate(.2);opacity:.5}