/* 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}

/* 0.5.2: floating touch glyphs; the floor continues underneath the controls. */
#game{--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
#hud{display:grid;grid-template-columns:1fr auto;grid-template-areas:'title actions' 'hp actions' 'party meta' 'status status';grid-template-rows:20px 20px 18px 14px;gap:0 8px;padding:calc(6px + env(safe-area-inset-top)) 10px 4px;background:linear-gradient(#081c25db,#081c2566 68%,transparent)}
#hud[hidden]{display:none}#hud>.topline{display:contents}#stageLabel{grid-area:title;align-self:center;font-size:10px;letter-spacing:.3px;color:#f7e7c5;white-space:nowrap}.hudButtons{grid-area:actions;display:flex;align-items:center;gap:0}.hudButtons button,#pauseBtn,#soundBtn,#autoBtn{width:44px;height:44px;min-width:44px;padding:0;border:0;border-radius:50%;background:transparent;box-shadow:none;font-size:15px;color:#d5e8e6;pointer-events:auto}#autoBtn{font-size:10px}.hudButtons button.active{background:#c6edd921;color:#c6ffe4}
#hud>.heroRow{display:none}#hud>.health{grid-area:hp;height:13px;margin:1px 0 0;border:0;border-radius:9px;background:#05202bb0;align-self:start}#hud>.health span{font-size:9px;line-height:13px}#hud>.health i{border-radius:9px}#partyHud{grid-area:party;align-self:center;gap:9px;margin:0;height:17px}#partyHud .partyMini{flex:0 1 42px;min-width:0;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}#partyHud .partyMini b{display:flex;justify-content:space-between;font-size:8px;line-height:10px;color:#d6e4d8}#partyHud .partyMini small{font-size:8px}#partyHud .partyMini i{height:2px;margin-top:2px;border-radius:2px;background:#183943}#partyHud .partyMini.lowhp em{background:#ff9b85}#partyHud .partyMini.recalling em{background:#f5d6a0}
#hud>.battleInfo{grid-area:meta;align-self:center;justify-content:flex-end;gap:6px;margin:0;font-size:8px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#hud>#objective{grid-area:status;margin:0;font-size:9px;line-height:14px;color:#bdcfca;text-align:left}#hud>#heroBuffs{position:absolute;left:10px;top:calc(82px + env(safe-area-inset-top));margin:0;display:flex;gap:3px;max-width:65%;flex-wrap:wrap}#heroBuffs>span{padding:1px 3px;border:0;background:#0b233b55}#heroBuffs small{font-size:8px}#heroBuffs .uiIcon{width:13px;height:13px}#bossHud{position:absolute;left:24%;right:24%;top:calc(82px + env(safe-area-inset-top));margin:0;font-size:9px}#bossHud .health{height:4px;margin-top:3px}#comboLabel{top:calc(112px + env(safe-area-inset-top));right:12px;font-size:15px}
#controls{height:172px;bottom:calc(8px + env(safe-area-inset-bottom));left:0;right:0;width:100%;transform:none;background:none}
#joystick{left:14px;bottom:16px;width:90px;height:90px;border:1px solid #d0eeea40;background:#0b243e12;box-shadow:none}#stick{left:28px;top:28px;width:32px;height:32px;border:1px solid #e7fff482;background:#c5eee53b;box-shadow:0 0 14px #b6e9df13}#joystick small{display:none}
#controls button{padding:0;border-radius:50%;border:1px solid #d9eee66b;background:#09233035;box-shadow:inset 0 0 0 3px #d6f0e608;backdrop-filter:none;color:#e3f5e8;touch-action:none}#controls button:active,#controls button.aiming{transform:scale(.94);background:#b2f0d42b;border-color:#e5fff2}#controls .controlGlyph{width:25px;height:25px;display:block;margin:auto;filter:drop-shadow(0 1px 2px #001a28)}
#attackBtn{right:16px;left:auto;bottom:16px;width:62px;height:62px;border:1.5px solid #f6dca8!important;color:#ffedc8!important;background:#273c442b!important}#attackBtn>.controlGlyph{position:static;width:29px;height:29px;top:auto;left:auto}#attackBtn>small{display:none}#attackBtn .comboPips{left:21px;bottom:6px;gap:3px}#attackBtn .comboPips i{width:4px;height:3px;border:0;background:#f6dca83b;border-radius:2px}#attackBtn .comboPips i.lit{background:#ffedc8}
#dodgeBtn{left:auto;right:88px;bottom:16px;width:52px;height:52px;border:1px solid #c0f2ed9c!important;background:#16465329!important;box-shadow:none;opacity:var(--ready,1)}#dodgeBtn .controlGlyph{width:24px;height:24px}#dodgeBtn small{font-size:7px;line-height:9px;display:block;color:#d9f8ee;white-space:nowrap}#dodgeBtn strong{display:block;font-size:16px;line-height:25px}#dodgeBtn.defending{box-shadow:0 0 16px #8ee6ed70;border-color:#dcffff!important;background:#438f9e40!important}
#skillButtons{display:contents;right:auto;bottom:auto}.skillBtn{position:absolute;width:44px;height:44px;overflow:visible}.skillBtn:nth-child(1){right:164px;bottom:94px}.skillBtn:nth-child(2){right:114px;bottom:109px}.skillBtn:nth-child(3){right:64px;bottom:104px}.skillBtn:nth-child(4){right:14px;bottom:88px}.skillBtn .skillIcon{position:static;width:26px;height:26px;margin:auto}.skillBtn .skillIcon .controlGlyph{width:24px;height:24px}.skillBtn>small{display:none}.skillBtn kbd{position:absolute;left:1px;top:0;right:auto;font:8px system-ui;color:#cce8dda0}.skillBtn .cooldown{border-radius:50%;font-size:15px;background:#061e32bc;pointer-events:none}.skillBtn.bossSkill{border-color:#f2cda47a!important;color:#f3d4b0!important;background:#60413c1a!important}.skillBtn.locked{opacity:.3}
#rallyBtn{left:14px;right:auto;bottom:118px;width:44px;height:44px;border-color:#f3dfa97a!important;background:#43513b22!important;color:#f3dfa9!important}#rallyBtn small{font-size:7px;line-height:9px;white-space:nowrap}#rallyBtn .controlGlyph{width:21px;height:21px}
#runeMeter{left:14px;right:auto;bottom:172px;width:auto;max-width:160px;min-height:18px;border:0;border-radius:0;background:#09253129;padding:2px 4px;box-shadow:none;opacity:.85}#runeMeter>.uiIcon{width:15px;height:15px;margin-right:3px}#runeMeter>b{font-size:9px}#runeMeter>small,#runeMeter>div{display:none}#toast{bottom:auto;top:calc(112px + env(safe-area-inset-top));max-width:80%;border:0;border-radius:20px;padding:6px 12px;background:#0a2835b0;font-size:10px;box-shadow:none}
@media(max-width:340px){#hud{grid-template-columns:1fr 132px;gap:0 5px}#stageLabel{font-size:9px}#hud>.battleInfo{font-size:7px;gap:3px}.skillBtn:nth-child(1){right:164px}.skillBtn:nth-child(2){right:114px}.skillBtn:nth-child(3){right:64px}.skillBtn:nth-child(4){right:14px}#rallyBtn{left:14px;bottom:118px}}

#joystick:before{top:44px;left:16px;right:16px}#joystick:after{left:44px;top:16px;bottom:16px}

#bossHud{border:0;background:none;padding:0}.skillBtn.aiming>small{display:block;position:absolute;bottom:calc(100% + 6px);left:50%;right:auto;transform:translateX(-50%);background:#0c2934e6;border-radius:8px;padding:3px 6px;font-size:9px;white-space:nowrap;pointer-events:none;z-index:3}