/* Patch 0.5: compact combat and illustrated rewards. */
.bag-scene { background: linear-gradient(#000b,#000d), url("assets/locations/adventurer-backpack.webp") center / cover no-repeat; }
.bag-scene .filter-grid, .bag-scene .shop-links { background: #111827b3; border-radius: 12px; }
.equipped-title { font-size: .85rem; color: #f6d68e; margin: 6px 0 12px; }
.hero-portrait .equipped-title { text-shadow: 0 2px 7px black; }
.chat-launcher.has-unread { border-color: #60e7a1; box-shadow: 0 0 16px #51dc8880; color: #bbffcd; }
.chat-launcher.has-unread::after { content: ''; display: inline-block; width: 9px; height: 9px; margin-left: 7px; border-radius: 50%; background: #6affad; box-shadow: 0 0 9px #70ffaf; }
.people-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.people-grid .party-member { min-width: 0; width: auto; flex-direction: column; align-items: stretch; padding: 12px 9px; margin: 0 0 10px; background: #161c2dcc; border-radius: 12px; }
.people-grid .person-profile { min-width: 0; flex-direction: column; align-items: flex-start; gap: 8px; }
.people-grid .person-profile img { width: 46px; height: 56px; }
.people-grid .person-profile span { min-width: 0; }
.people-grid .person-profile strong { font-size: .84rem; }
.people-grid .person-profile small { line-height: 1.5; font-size: .65rem; }
.people-grid .person-actions { margin: 9px 0 0; flex-direction: column; gap: 6px; }
.in-combat-tag { color: #ffc88b !important; font-weight: bold; }
.stat-draft-row { grid-template-columns: 30px 1fr auto auto; }
.stat-draft-row em { display: block; color: #91efbb; font-size: .8rem; font-style: normal; }
.stat-adjust { display: flex; gap: 5px; }
.stat-adjust .stat-add { width: 30px; height: 32px; padding: 0; }
.allocation-review, .merchant-basket { padding: 14px; border: 1px solid #a78ad255; border-radius: 14px; background: #141a2a; margin: 16px 0; }
.allocation-review .primary-button, .merchant-basket .primary-button { width: 100%; margin: 10px 0; }
.title-picker { display: grid; gap: 8px; }
.achievement progress { width: 100%; height: 10px; accent-color: #c59c65; display: block; margin-bottom: 9px; }
.achievement > small { display: block; margin: 7px 0; }
.achievement.unlocked { border-color: #bdb07066; }
.merchant-choice { position: relative; display: grid; justify-items: center; text-align: center; gap: 7px; padding: 12px 6px; border: 1px solid #ffffff20; border-radius: 12px; background: #131929; cursor: pointer; }
.merchant-choice[hidden] { display: none !important; }
.merchant-choice.selected { border-color: #8bedb0; background: #1d352e; }
.merchant-choice input { width: 18px; height: 18px; accent-color: #82e8a4; }
.merchant-choice .item-art { width: 65px; height: 65px; }
.merchant-choice > span:not(.item-art) { font-size: .72rem; line-height: 1.4; }
.batch-sale-list { max-height: 35vh; overflow-y: auto; display: grid; gap: 9px; }
.batch-sale-list article { display: flex; align-items: center; gap: 12px; padding: 9px; border: 1px solid #ffffff20; border-radius: 9px; }
.batch-sale-list .item-art { width: 45px; height: 45px; flex: 0 0 45px; }
.batch-sale-list small { display: block; color: #e4c07d; }
.victory-xp { color: #ffe18e !important; font-weight: bold; }
.combat-scene { background-color: #0b1411; }
.combat-scene.combat-lumen {
 background-image: linear-gradient(#000b, #000c), url("assets/locations/lumen-combat.webp");
 background-position: center; background-size: cover; background-repeat: no-repeat;
}
.combat-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.combat-grid > .combatant { min-width: 0; margin: 0; padding: 10px; background: #101b22d9; }
.combat-grid > .combatant:only-child { grid-column: 1 / -1; }
.combat-grid .combat-profile { gap: 7px; text-align: left; }
.combat-grid .combat-profile img { width: 32px; height: 40px; flex: 0 0 32px; }
.combat-grid .combat-profile > span { min-width: 0; }
.combat-grid .combat-profile strong { overflow-wrap: anywhere; font-size: .78rem; }
.combat-grid .combat-profile small { font-size: .64rem; line-height: 1.4; }
.combat-grid .health-label { flex-wrap: wrap; margin-top: 8px; }
.combat-grid .health-label span { overflow-wrap: anywhere; }
.combat-grid .health-label b { margin-left: auto; white-space: nowrap; }
.combat-grid .combatant > small { font-size: .65rem; line-height: 1.4; }
.combat-scene .page-heading { margin-bottom: 12px; }
.combat-scene .battle-log { max-height: 110px; background: #080d13c9; }
.turn-clock { padding: 12px; background: #0e171fe6; border: 1px solid #ae8c48; border-radius: 12px; margin: 12px 0; }
.turn-clock label { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: .8rem; }
.turn-clock strong { color: #ffdc8a; font-variant-numeric: tabular-nums; font-size: 1.1rem; }
.turn-clock progress { display: block; width: 100%; height: 8px; margin-top: 8px; border: 0; border-radius: 10px; accent-color: #dfbd70; overflow: hidden; }
.turn-clock progress::-webkit-progress-bar { background: #29313c; }
.turn-clock progress::-webkit-progress-value { background: #dfbd70; transition: width .2s linear; }
.turn-clock progress.urgent::-webkit-progress-value { background: #f17c73; }
.flee-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 20px; }
.flee-choices > .small-button { background: #202331; color: #c6c8d1; border-color: #555b6d; box-shadow: none; }
.flee-choices > .primary-button { background: linear-gradient(120deg, #8465fa, #ab74ff); color: white; border: 0; }
.character-roster-card { margin: 16px 0; border: 1px solid #a688e655; border-radius: 18px; background: #151b2dde; overflow: hidden; }
.character-roster-card .character-slot { border: 0; margin: 0; background: transparent; }
.character-delete { display: block; margin: 0 12px 6px auto; color: #ffabab; }
#delete-character-word { width: 100%; margin-top: 8px; padding: 12px; color: #fff; background: #151b2d; border: 1px solid #78728d; border-radius: 8px; }
#delete-character-error { color: #ffabab; }
.critical-stat { color: #f1cb7c; }
.trade-return { margin: 0; border-radius: 0; flex-shrink: 0; text-align: center; }
.trade-return[hidden] { display: none; }
.mail-item { display: flex; gap: 15px; align-items: center; }
.mail-item .item-art { width: 68px; height: 68px; flex: 0 0 68px; }
.mail-item h3 { margin: 0 0 8px; }
.mail-item p { font-size: .78rem; }
.battle-result.victory {
 background-color: #0d1519;
 background-image: linear-gradient(#070e1480 0%, #060e101a 40%, #070c13ef 79%), url("assets/locations/victory-chest.webp");
 background-size: cover, auto max(100%, 850px); background-position: center, center 32%; background-repeat: no-repeat;
 animation: victory-reveal .65s ease-out both;
}
.victory .result-content { text-shadow: 0 2px 12px #000; }
.victory .result-content h1 { margin: 10px 0; }
.victory .result-loot { background: #101825ed; text-shadow: none; }
.treasure-window { height: clamp(150px,26vh,240px); }
@keyframes victory-reveal { from { opacity: 0; transform: translateY(14px) scale(1.015); } to { opacity: 1; transform: translateY(0) scale(1); } }
.battle-result.pvp-result{background-color:#0a1121;background-repeat:no-repeat;background-size:cover;background-position:center;animation:victory-reveal .65s ease-out both}
.battle-result.pvp-result.victory{background-image:linear-gradient(#070d2260 0%,#08102208 35%,#070d22ed 75%),url('assets/locations/pvp-victory.webp');background-position:center,center 35%}
.battle-result.pvp-result.defeat,.battle-result.pvp-result.draw{background-image:linear-gradient(180deg,#10152cd9,#2018368f 35%,#080f22f7 75%),url('assets/locations/ranked-arena.webp');background-position:center,48% center}
.pvp-result .result-content{text-shadow:0 2px 12px #000}.pvp-result .result-content h1{letter-spacing:.02em;color:#f5dca0}.pvp-result.defeat .result-content h1{color:#ddc7f1}.arena-result-window{height:clamp(175px,32vh,300px)}.pvp-encouragement{color:#c8c5d7!important;font-size:.85rem}.pvp-result .result-content>button{background-color:#141a30e8}
@media(prefers-reduced-motion:reduce){.battle-result.pvp-result{animation:none}}
@media (max-width: 420px) {
 .combat-scene > .page-pad { padding: 16px 12px; }
 .result-loot { padding: 14px; gap: 12px; margin: 16px 0; }
 .result-loot .item-art { width: 64px; height: 64px; flex-basis: 64px; }
 .battle-result { padding: 36px 18px; }
}
@media (prefers-reduced-motion: reduce) {
 .battle-result.victory { animation: none; }
 .turn-clock progress::-webkit-progress-value { transition: none; }
}

/* Regional battlefields. Darkness stays in CSS so the source art remains reusable. */
.combat-scene.combat-forest { background: linear-gradient(#000b,#000c), url("assets/locations/combat-brumas.webp") center / cover no-repeat; }
.combat-scene.combat-mines { background: linear-gradient(#000b,#000c), url("assets/locations/combat-minas.webp") center / cover no-repeat; }
.combat-scene.combat-citadel { background: linear-gradient(#000b,#000c), url("assets/locations/combat-citadel.webp") center / cover no-repeat; }
.merchant-rarity { display: grid; gap: 8px; margin-top: 16px; }
.merchant-rarity select { width: 100%; }

/* Shared reward gallery: exploration, dungeons, tower and World Boss. */
.result-rewards {
 margin: 18px 0;
 padding: 14px 12px;
 border: 1px solid #eec67745;
 border-radius: 16px;
 background: #080e18b8;
 backdrop-filter: blur(5px);
 text-shadow: none;
}
.result-rewards h2 { margin: 0 0 12px; color: #f6ddb1; font-size: .95rem; }
.result-loot-grid { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 10px; }
.result-loot-grid > .result-item,
.result-loot-grid > .result-resource { flex: 0 0 clamp(52px, 16vw, 78px); width: clamp(52px, 16vw, 78px); min-width: 0; margin: 0; }
.result-item { position: relative; padding: 0; border: 0; border-radius: 10px; background: transparent; cursor: pointer; }
.result-item .item-art { display: block; width: 100%; height: auto; aspect-ratio: 1; border: 2px solid var(--rarity, #adb4c2); border-radius: 10px; }
.result-item .item-art img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.result-item:hover { filter: brightness(1.2); }
.result-item:focus-visible { outline: 2px solid #ffe0a4; outline-offset: 3px; }
.result-resource > img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border: 1px solid var(--rarity, #aebfd366); border-radius: 10px; }
.result-resource > small { display: block; margin-top: 5px; color: #f6ddb1; font-size: .68rem; line-height: 1.3; }
.result-delivery { position: absolute; right: -3px; bottom: -3px; padding: 1px 5px; border: 1px solid #e7cf8f88; border-radius: 5px; background: #121726; color: #ffe0a4; font-size: .78rem; }
.result-rewards .result-loot-hint { margin: 12px 0 4px; font-size: .72rem; color: #ded7e8; }
.result-rewards .result-loot-delivery { margin: 0; font-size: .68rem; color: #b6c8d3; line-height: 1.45; }
:is(.people-grid,.guild-roster).friends-list{display:block;background:#070a12;border:1px solid #ffffff12;border-radius:22px;padding:8px 14px;overflow:hidden}.friend-row{padding:16px 0;border-bottom:1px solid #ffffff0d}.friend-row:last-child{border-bottom:0}.friend-profile{display:flex;align-items:center;gap:10px;padding:0;width:100%;border:0;background:none;color:#eef0f4;text-align:left;cursor:pointer}.friend-profile img{width:30px;height:36px;object-fit:cover;border-radius:6px;flex:none}.friend-presence-dot{width:13px;height:13px;border-radius:50%;background:#a3afbc;flex:none}.is-online .friend-presence-dot{background:#83f531;box-shadow:0 0 10px #78ff3e25}.friend-info{min-width:0;flex:1}.friend-headline{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 10px;font-size:.82rem;line-height:1.5}.friend-headline strong{font-size:.95rem;overflow-wrap:anywhere;color:#b5bdc8}.is-online .friend-headline strong{color:#92f74c}.friend-level{white-space:nowrap}.friend-info>small{display:block;color:#929bad;font-size:.7rem;margin-top:3px}.friend-combat{color:#ff656c;font-weight:700;font-size:.75rem}.friend-actions{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:10px 0 0 23px}.friend-actions button{width:auto;min-height:36px;font-size:.7rem;padding:6px 9px}.friend-actions small{color:#a9aabb;font-size:.7rem}.friend-profile:focus-visible{outline:2px solid #e6bc76;outline-offset:5px;border-radius:4px}@media(max-width:360px){:is(.people-grid,.guild-roster).friends-list{padding:6px 10px}.friend-profile{gap:7px}.friend-profile img{width:24px;height:30px}.friend-headline{gap:3px 7px;font-size:.75rem}.friend-headline strong{font-size:.84rem}.friend-actions{margin-left:20px;gap:5px}}
