/* Original spooky RPG interface, shared by desktop and Android. */
#battleDialog{width:min(720px,calc(100vw - 24px));padding:20px}
#battleDialog .dialog-head h2{overflow-wrap:anywhere;line-height:1.3}
#battleDialog .rpg-arena{position:relative;display:block;width:100%;max-width:100%;aspect-ratio:auto;height:340px;min-height:290px;padding:0;overflow:hidden;border:1px solid #53476d;border-radius:20px;background:radial-gradient(ellipse at 30% 90%,#56807140,transparent 50%),linear-gradient(160deg,#182934,#261d3c 65%,#344533)}
#battleDialog .rpg-arena .fighter{position:absolute;display:flex;align-items:center;justify-content:center;width:45%;height:52%;min-width:0;isolation:isolate}
#battleDialog .rpg-arena .rpg-player{left:0;bottom:0}
#battleDialog .rpg-arena .rpg-opponent{right:0;top:10%}
#battleDialog .rpg-arena .fighter::before{content:"";position:absolute;bottom:8%;width:85%;height:17%;border-radius:50%;background:#adc1a51a;border:1px solid #b1c9a533;z-index:-1}
#battleDialog .rpg-arena .battle-facing{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
#battleDialog .rpg-arena .fighter img{width:90%;height:100%;object-fit:contain;max-width:200px;filter:drop-shadow(0 10px 9px #0005)}
#battleDialog .battle-hud{position:absolute;width:53%;max-width:340px;padding:12px 14px;background:#191626eF;border:1px solid #776490;border-radius:14px;z-index:2;box-shadow:0 5px 18px #0003;min-width:0}
#battleDialog .enemy-hud{left:12px;top:12px}
#battleDialog .player-hud{right:12px;bottom:12px}
#battleDialog .battle-name{display:block;font-weight:800;color:#f6e9d4;overflow-wrap:anywhere;line-height:1.25}
#battleDialog .battle-role{display:block;font-size:11px;color:#bdb0cb;margin:3px 0 7px}
#battleDialog .battle-health{display:flex;align-items:center;gap:8px;font-size:11px;color:#b8f1cf}
#battleDialog .battle-health progress{display:block;flex:1;width:0;height:9px;border:0;appearance:none;background:#41364d;border-radius:8px;overflow:hidden}
#battleDialog progress::-webkit-progress-bar{background:#41364d;border-radius:8px}
#battleDialog progress::-webkit-progress-value{background:#b8f1cf;border-radius:8px}
#battleDialog progress[data-low="true"]::-webkit-progress-value{background:#ffa992}
#battleDialog progress::-moz-progress-bar{background:#b8f1cf}
#battleDialog .battle-hud>span:last-child{display:block;text-align:right;font-size:12px;margin-top:5px;font-variant-numeric:tabular-nums}
.battle-message{padding:14px;border:1px solid #776490;border-left:3px solid #b8f1cf;border-radius:10px;background:#1d192b;line-height:1.5;overflow-wrap:anywhere}
.rpg-commands{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.rpg-commands button,.rpg-powers button{display:flex;flex-direction:column;gap:5px;text-align:left;min-width:0;min-height:66px;padding:13px 15px;border:1px solid #655374;background:#30243f;border-radius:12px}
.rpg-commands button:first-child{background:#414133;border-color:#809a7b}
.rpg-commands strong,.rpg-powers strong{font-size:15px;overflow-wrap:anywhere}
.rpg-commands small,.rpg-powers small{line-height:1.45;color:#cbbbd7;white-space:normal;overflow-wrap:anywhere}
.rpg-powers{display:grid;gap:9px}.rpg-powers h3{margin:0 0 3px}
.battle-gear{padding:15px;border:1px solid #665674;border-radius:14px;background:#221c30}.battle-gear h3{margin-top:0}
.battle-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.battle-stat-grid p{padding:10px;background:#362a43;margin:0;border-radius:8px}
.battle-gear-list p{overflow-wrap:anywhere;line-height:1.5}
.battle-result{padding:12px;margin:12px 0;text-align:center;font-weight:800;font-size:24px;border:1px solid #8db6a0;border-radius:12px;color:#b8f1cf;background:#253932}
.battle-result[data-outcome="loss"]{background:#38292e;color:#ffc2ad;border-color:#a16b68}
.battle-result[data-outcome="draw"]{background:#322b42;color:#dfcdeb;border-color:#8b779f}
.battle-rules{margin-top:16px;font-size:12px;color:#bbacc9}.battle-rules summary{cursor:pointer;padding:8px}.battle-rules p{line-height:1.6}
.battle-return{margin-top:12px;width:100%;display:flex;justify-content:center;gap:10px;align-items:center;min-height:44px}.battle-return small{font-size:11px}
[hidden]{display:none!important}
#worldSidebar .resident{flex:0 0 100%;width:100%;min-width:0;display:grid;grid-template-columns:60px minmax(0,1fr);gap:4px 14px;padding:14px;background:#221c30;border:1px solid #594967;border-radius:14px;align-items:center}
#worldSidebar .resident img{grid-column:1;grid-row:1 / 4;width:60px;height:78px;object-fit:contain;margin:0}
#worldSidebar .resident h4,#worldSidebar .resident p{grid-column:2;min-width:0;margin:0;white-space:normal;overflow-wrap:anywhere;text-overflow:clip;height:auto;max-height:none;line-height:1.45}
#worldSidebar .resident h4{font-size:17px;color:#f5e5d0}
#worldSidebar .resident p{font-size:12px;color:#c6b4d1}
#worldSidebar .resident button{grid-column:2;width:100%;margin-top:6px;min-height:42px}
.equipment-dialog{width:min(720px,calc(100vw - 24px))}
.equipment-summary{line-height:1.6;color:#b8f1cf;padding:12px;border:1px solid #4f6b61;background:#21342b;border-radius:12px;overflow-wrap:anywhere}
.equipment-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
.equipment-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:18px}
.equipment-slots button{padding:12px 8px;display:flex;flex-direction:column;gap:6px;min-width:0;min-height:75px;overflow-wrap:anywhere}
.equipment-slots small{line-height:1.4;color:#c7b8d3;white-space:normal}
.equipment-tabs [aria-pressed="true"],.equipment-slots [aria-pressed="true"]{border-color:#b8f1cf;background:#2d463b;color:#d7ffe5}
.equipment-grid{display:grid;gap:12px}
.equipment-card{display:grid;grid-template-columns:56px minmax(0,1fr);gap:5px 14px;border:1px solid #655176;background:linear-gradient(145deg,#31243f,#231d2e);border-radius:16px;padding:16px;min-width:0}
.equipment-icon{grid-row:1 / 5;display:grid;place-items:center;width:56px;height:72px;border:1px solid #bda471;border-radius:16px;background:#a282291c;color:#ebd5a8;font-size:36px}
.equipment-card h3,.equipment-card p{grid-column:2;margin:0;line-height:1.5;min-width:0;overflow-wrap:anywhere}
.equipment-card h3{color:#f6e6ce;font-size:17px}
.equipment-card p{font-size:13px;color:#c9b8d5}
.equipment-card .equipment-bonus{color:#b8f1cf;font-weight:700}
.equipment-card .equipment-meta{font-size:12px}
.equipment-card button{grid-column:1 / -1;margin-top:10px;min-height:44px}
.equipment-note{line-height:1.6;overflow-wrap:anywhere}
#shopEquipment{width:100%;margin:0 0 16px;min-height:48px;border-color:#8dae93}
#shopGrid h3,#npcName,#shopTitle{white-space:normal;overflow-wrap:anywhere}
@media(max-width:520px){#battleDialog{padding:14px}#battleDialog .rpg-arena{height:300px}#battleDialog .battle-hud{padding:9px 10px;width:55%}#battleDialog .enemy-hud{left:8px;top:8px}#battleDialog .player-hud{right:8px;bottom:8px}#battleDialog .battle-name{font-size:13px}.rpg-commands{gap:8px}.rpg-commands button{padding:11px;min-height:72px}.rpg-commands strong{font-size:14px}.rpg-commands small{font-size:11px}.equipment-slots button{font-size:12px}.equipment-slots small{font-size:10px}.equipment-card{padding:12px;gap:5px 10px}.equipment-card h3{font-size:15px}}
@media(max-height:450px) and (min-width:520px){#battleDialog .rpg-arena{height:280px;min-height:280px}}

#battleDialog .battle-caption{top:auto;bottom:43%;left:5%;right:5%;font-size:11px}

/* Action motion is shared by every form, including evolved and pack familiars. */
.creature-button img[data-pose="eat"]:not(.sleeping){animation:eat .5s ease-in-out 4}
.creature-button img[data-pose="pose"]:not(.evolving):not(.sleeping){animation:petting .65s ease-in-out 3}
#worldFamiliar[data-pose="walk"]{animation:familiar-step .38s ease-in-out infinite}
@keyframes familiar-step{0%,100%{transform:translate(-50%,-100%) rotate(-2deg)}50%{transform:translate(-50%,calc(-100% - 5px)) rotate(2deg)}}
@media(prefers-reduced-motion:reduce){.creature-button img,#worldFamiliar,.fighter img{animation-duration:1ms!important;animation-iteration-count:1!important}}

#worldSidebar .resident .npc-delivery{margin-top:9px;color:#edd6ae;font-size:12px}
#worldSidebar .resident [data-deliver-npc]{margin-top:4px;border-color:#687c63;background:#293c30}

.arcade-directions{display:flex;justify-content:center;gap:10px;margin:12px 0;flex-wrap:wrap}.arcade-directions button{min-width:54px;min-height:50px;font-size:23px;touch-action:none;padding:8px 16px}#arcadeHelp{line-height:1.6}#arcadeStatus{line-height:1.5;overflow-wrap:anywhere}.arcade-controls button{min-width:0;flex:1 1 110px;font-size:14px;overflow-wrap:normal}

/* Snake: a spatial D-pad; the dodge game keeps its two horizontal arrows. */
.arcade-directions[data-layout="cross"]{display:grid;grid-template-columns:repeat(3,54px);grid-template-rows:repeat(3,50px);gap:8px;justify-content:center}
.arcade-directions[data-layout="cross"] button{width:54px;height:50px;padding:8px}
.arcade-directions[data-layout="cross"] [data-direction="3"]{grid-column:2;grid-row:1}
.arcade-directions[data-layout="cross"] [data-direction="2"]{grid-column:1;grid-row:2}
.arcade-directions[data-layout="cross"] [data-direction="0"]{grid-column:3;grid-row:2}
.arcade-directions[data-layout="cross"] [data-direction="1"]{grid-column:2;grid-row:3}

.arcade-directions[data-layout="horizontal"]{flex-wrap:nowrap;align-items:center}
#arcadeTouchRail{flex:1;min-width:0;width:100%;height:50px;margin:0;cursor:ew-resize;touch-action:none;accent-color:#b8f1cf}
.journey-dialog{width:min(640px,94vw)}.journey-dialog h3,.journey-dialog p{overflow-wrap:anywhere;line-height:1.5}.companion-card{text-align:center;border:1px solid #665476;border-radius:18px;padding:16px;background:#262033}.companion-card img{width:100px;height:100px;object-fit:contain}.companion-card progress{width:min(320px,100%);accent-color:#b8f1cf}.charm-card{border:1px solid #534660;border-radius:16px;padding:14px;margin:14px 0}.charm-symbol{float:right;font-size:30px;color:#d4b4ff}.boss-intent{padding:12px;border:1px solid #9f7286;border-radius:12px;color:#ffe0b1;line-height:1.5;overflow-wrap:anywhere;background:#302034}
#familiarCharm{position:absolute;left:72%;top:34%;pointer-events:none;font-size:26px;color:#d6c0ff;text-shadow:0 0 12px #af83ed;animation:charm-float 3s ease-in-out infinite;z-index:4}#familiarCharm[data-charm="3"]{left:46%;top:68%;font-size:48px;color:#b8f1cf}#familiarCharm[data-charm="4"]{left:48%;top:13%;font-size:32px}#familiarCharm[data-charm="5"]{color:#ffb5cc}#familiarCharm[data-charm="6"]{color:#ffdd99}#familiarCharm.resting{animation-duration:6s;opacity:.65}@keyframes charm-float{50%{transform:translateY(-8px) rotate(12deg)}}@media(prefers-reduced-motion:reduce){#familiarCharm{animation:none}}
.cave-room-note{border-left:3px solid #b8f1cf;padding:10px 14px;background:#242737;border-radius:8px;line-height:1.5}.cave-room-note strong{display:block;color:#e6c7ff}.arcade-bonus-help{font-size:13px;color:#b8f1cf}
