:root {
  --blue: #087bd6;
  --deep: #082f55;
  --ink: #14324d;
  --muted: #628097;
  --cream: #fffdf7;
  --line: #cadde9;
  --yellow: #ffc928;
  --green: #62c63d;
  --location-accent: #72c63d;
  color-scheme: light;
  font-family: Inter, ui-rounded, "Segoe UI", system-ui, sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { width: 100%; height: 100%; min-height: 100%; margin: 0; overflow: hidden; background: #071e35; }
body { position: fixed; inset: 0; width: 100%; height: 100%; min-height: 100%; margin: 0; overflow: hidden; overscroll-behavior: none; background: #071e35; color: var(--ink); }
button, input { font: inherit; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible { outline: 3px solid rgba(16,143,235,.35); outline-offset: 2px; }
#app { position: fixed; inset: 0; width: 100%; height: 100%; height: 100dvh; max-height: 100dvh; min-height: 0; overflow: clip; contain: strict; background: #071e35; }
.home-screen, .game-screen { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; }
#app[data-screen="home"] .game-screen, #app[data-screen="game"] .home-screen { visibility: hidden; pointer-events: none; }
.atlas-cell { display: block; background-image: var(--atlas); background-repeat: no-repeat; background-size: var(--atlas-size); background-position: var(--atlas-x) var(--atlas-y); }
.ui-icon { display: block; width: 1em; height: 1em; overflow: visible; fill: none; color: currentColor; }
.icon-slot { display: inline-grid; place-items: center; flex: 0 0 auto; }

/* Home */
.home-screen { isolation: isolate; overflow: hidden; background: #2f8f51; }
.home-backdrop { position: absolute; inset: -3%; z-index: -3; background: url('/assets/v2.6/maps/trainer-grove-v269.png') 50% 52% / cover no-repeat; transform: scale(1.03); filter: saturate(1.08) contrast(1.03); }
.home-vignette { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg,rgba(2,31,52,.74) 0%,rgba(2,42,60,.22) 45%,rgba(2,28,51,.2) 100%),linear-gradient(0deg,rgba(1,20,38,.65),transparent 42%); }
.home-topbar { position: absolute; z-index: 3; top: max(22px,env(safe-area-inset-top)); left: max(28px,env(safe-area-inset-left)); right: max(28px,env(safe-area-inset-right)); display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.brand { display: flex; align-items: center; gap: 10px; color: white; text-shadow: 0 3px 10px rgba(0,25,48,.32); }
.brand-mark { display: grid; place-items: center; width: 49px; height: 49px; border: 0; border-radius: 16px; background: transparent; box-shadow: 0 8px 22px rgba(0,30,60,.3); color: #ffda3a; font-size: 26px; }
.brand-mark .ui-icon { width: 30px; height: 30px; }
.brand-mark img { display: block; width: calc(100% + 6px); height: calc(100% + 6px); max-width: none; margin: -3px; object-fit: contain; }
.brand b { display: block; font-size: clamp(24px,3vw,39px); font-weight: 1000; letter-spacing: -2.5px; line-height: .9; }
.brand b span { color: #ffcf27; }
.brand small { display: block; margin-top: 5px; font-size: 8px; font-weight: 900; letter-spacing: 2px; }
.home-resources { display: flex; gap: 8px; }
.home-resources span { display: flex; align-items: center; gap: 5px; padding: 11px 15px; border: 1px solid rgba(255,255,255,.8); border-radius: 16px; background: rgba(255,253,247,.91); box-shadow: 0 8px 25px rgba(0,31,58,.2); color: #17466e; font-size: 12px; backdrop-filter: blur(12px); }
.home-resources .ui-icon { width: 18px; height: 18px; }
.home-resources span:first-child { color: #c28700; }

.hero-card { position: absolute; z-index: 2; left: max(5vw,env(safe-area-inset-left)); top: 50%; width: min(430px,42vw); padding: 24px; transform: translateY(-46%); border: 1px solid rgba(255,255,255,.85); border-radius: 28px; background: rgba(255,253,247,.93); box-shadow: 0 26px 75px rgba(0,28,50,.4); backdrop-filter: blur(16px); }
.hero-card-head { display: flex; align-items: center; gap: 14px; }
.avatar-ring { position: relative; flex: 0 0 76px; height: 76px; overflow: hidden; border: 4px solid #80ccff; border-radius: 22px; background: #e6f6ff; box-shadow: inset 0 0 0 2px white; }
.hero-card-head small { display: block; color: var(--blue); font-size: 8px; font-weight: 950; letter-spacing: 1.4px; }
.hero-card-head strong { display: block; margin: 1px 0; font-size: 27px; letter-spacing: -.8px; }
.hero-card-head em { color: #627f95; font-size: 10px; font-style: normal; font-weight: 700; }
.xp-row { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; margin: 15px 0; }
.xp-row > span { height: 10px; overflow: hidden; border-radius: 8px; background: #d3e2eb; }
.xp-row i { display: block; width: 58%; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#08a5ff,#086bce); }
.xp-row b { color: #41627b; font-size: 9px; }
.hero-card > p { margin: 0 0 17px; color: #4d6c82; font-size: 11px; line-height: 1.5; }
.name-field { display: grid; grid-template-columns: 102px 1fr; align-items: center; gap: 8px; color: #59748a; font-size: 10px; font-weight: 850; }
.name-field input { width: 100%; height: 42px; padding: 0 13px; border: 1px solid #bfd5e3; border-radius: 12px; background: white; color: var(--ink); font-weight: 850; }
.skin-picker { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 11px 0; }
.skin-picker button { display: grid; grid-template-columns: 35px 1fr; align-items: center; gap: 6px; min-height: 45px; padding: 4px 8px; overflow: hidden; border: 1px solid #c8dbe7; border-radius: 13px; background: white; color: #577389; text-align: left; font-size: 8px; font-weight: 900; }
.skin-picker button.is-active { border: 2px solid var(--blue); background: #e9f6ff; color: #075ea8; }
.trainer-mini { width: 34px; height: 38px; background-image: url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png'); background-repeat: no-repeat; background-size: 600% 800%; background-position: 0 0; }
.trainer-mini.female { background-image: url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png'); }
.primary-cta { display: flex; align-items: center; justify-content: center; gap: 18px; width: 100%; min-height: 54px; border: 0; border-bottom: 4px solid #064c96; border-radius: 15px; background: linear-gradient(180deg,#149cf3,#0872c9); color: white; box-shadow: 0 10px 24px rgba(4,111,195,.28); font-size: 12px; font-weight: 1000; letter-spacing: .6px; }
.primary-cta span { font-size: 20px; }
.primary-cta .ui-icon { width: 20px; height: 20px; }
.foundation-status { display: flex; align-items: center; gap: 9px; margin-top: 13px; padding-top: 12px; border-top: 1px solid #d8e4eb; }
.foundation-status > i { width: 9px; height: 9px; border-radius: 50%; background: #5dca3d; box-shadow: 0 0 0 4px #daf4d2; }
.foundation-status b, .foundation-status small { display: block; }
.foundation-status b { font-size: 9px; }
.foundation-status small { margin-top: 2px; color: #6d8496; font-size: 8px; }

.home-showcase { position: absolute; z-index: 1; right: 6vw; top: 14%; bottom: 4%; width: min(47vw,690px); pointer-events: none; }
.trainer-showcase { position: absolute; left: 6%; bottom: 0; width: min(27vw,390px); aspect-ratio: 3/4; background: url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png') 0 0 / 600% 800% no-repeat; filter: drop-shadow(0 22px 14px rgba(0,23,42,.35)); }
.home-showcase > span { position: absolute; right: 2%; top: 12%; min-width: 180px; padding: 12px 15px; border: 1px solid rgba(255,255,255,.7); border-radius: 17px; background: rgba(4,47,78,.76); color: white; backdrop-filter: blur(10px); }
.home-showcase small, .home-showcase b, .home-showcase em { display: block; }
.home-showcase small { color: #8fe9ff; font-size: 7px; font-weight: 950; letter-spacing: 1px; }
.home-showcase b { margin: 3px 0; font-size: 20px; }
.home-showcase em { color: #d8effa; font-size: 9px; font-style: normal; }
.prototype-note { position: absolute; z-index: 3; left: 50%; bottom: max(10px,env(safe-area-inset-bottom)); transform: translateX(-50%); color: rgba(255,255,255,.78); font-size: 7px; font-weight: 800; letter-spacing: .8px; text-shadow: 0 2px 7px #001c34; }

/* World */
.game-screen { contain: strict; isolation: isolate; overflow: hidden; background: #76b84b; }
#gameCanvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; max-height: none; touch-action: none; }
.world-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg,rgba(3,25,44,.27),transparent 18%,transparent 76%,rgba(2,27,47,.18)); }
.world-topbar { position: absolute; z-index: 15; top: max(16px,env(safe-area-inset-top)); left: max(18px,env(safe-area-inset-left)); right: max(18px,env(safe-area-inset-right)); display: grid; grid-template-columns: minmax(190px,1fr) auto minmax(190px,1fr); align-items: start; gap: 12px; pointer-events: none; }
.player-chip, .world-location, .instance-chip { border: 1px solid rgba(255,255,255,.85); background: rgba(255,253,247,.92); box-shadow: 0 12px 34px rgba(0,30,55,.25); backdrop-filter: blur(12px); pointer-events: auto; }
.player-chip { justify-self: start; display: flex; align-items: center; gap: 9px; min-width: 205px; min-height: 55px; padding: 7px 11px 7px 7px; border-radius: 17px; }
.player-chip-avatar { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 13px; background: linear-gradient(145deg,#1a9bf0,#075cad); color: white; font-weight: 1000; }
.player-chip b, .player-chip small { display: block; }
.player-chip b { font-size: 11px; }
.player-chip small { margin-top: 3px; color: #648095; font-size: 8px; }
#connectionDot { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: #e7a72e; }
#connectionDot.is-online { background: #58c638; box-shadow: 0 0 0 3px rgba(88,198,56,.18); }
.world-location { display: grid; grid-template-columns: 32px 1fr 14px; align-items: center; gap: 8px; min-width: 235px; min-height: 55px; padding: 7px 12px; border-radius: 17px; color: var(--ink); text-align: left; }
.location-pin { display: grid; place-items: center; width: 32px; height: 38px; border-radius: 11px; background: color-mix(in srgb,var(--location-accent) 17%,white); color: var(--location-accent); font-size: 21px; }
.location-pin .ui-icon { width: 22px; height: 22px; }
.world-location small, .world-location b { display: block; }
.world-location small { color: var(--location-accent); font-size: 7px; font-weight: 950; letter-spacing: 1.1px; }
.world-location b { margin-top: 2px; font-size: 13px; }
.world-location > i { color: #7890a2; font-style: normal; }
.world-location > i .ui-icon { width: 14px; height: 14px; }
.instance-chip { justify-self: end; display: flex; align-items: center; gap: 8px; min-width: 210px; min-height: 55px; padding: 8px 12px; border-radius: 17px; }
.signal-bars { color: var(--blue); font-size: 23px; }
.signal-bars .ui-icon { width: 23px; height: 23px; }
.instance-chip b, .instance-chip small { display: block; }
.instance-chip b { font-size: 10px; }
.instance-chip small { margin-top: 2px; color: #648095; font-size: 7px; }

.world-rail { position: absolute; z-index: 18; left: max(18px,env(safe-area-inset-left)); top: 50%; display: grid; gap: 4px; width: 78px; padding: 8px; transform: translateY(-47%); border: 1px solid rgba(211,226,235,.95); border-radius: 24px; background: rgba(255,253,248,.96); box-shadow: 0 20px 48px rgba(0,31,54,.24); backdrop-filter: blur(16px); }
.world-rail button { position: relative; display: grid; place-items: center; align-content: center; gap: 3px; min-height: 56px; border: 1px solid transparent; border-radius: 16px; background: transparent; color: #315d7d; transition: transform .15s ease,background .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease; }
.world-rail button:hover { transform: translateY(-1px); border-color: #d8e8f1; background: #f4faff; color: #0877c9; box-shadow: 0 7px 16px rgba(19,92,135,.09); }
.world-rail button.is-active { border-color: #c8e3f5; background: #e4f3fc; color: var(--blue); box-shadow: inset 0 0 0 1px rgba(11,143,224,.06); }
.world-rail button span { font-size: 24px; line-height: 1; }
.world-rail button span .ui-icon { width: 23px; height: 23px; }
.world-rail button span .art-icon { width: 31px; height: 31px; object-fit: contain; filter: drop-shadow(0 2px 2px rgba(0,48,77,.12)); }
.world-rail button b { max-width: 62px; overflow: hidden; color: currentColor; font-size: 7px; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
.world-rail button[data-panel="chat"], .world-rail button[data-panel="home"] { margin-top: 4px; }
.world-rail button > i { position: absolute; top: 4px; right: 4px; display: grid; place-items: center; min-width: 16px; height: 16px; padding: 0 4px; border: 2px solid #fffdf8; border-radius: 9px; background: #ef4f45; color: white; font-size: 7px; font-style: normal; box-shadow: 0 3px 8px rgba(130,28,22,.2); }
.movement-zone { display: none; }
.joystick { position: fixed; z-index: 30; display: none; width: 94px; height: 94px; transform: translate(-50%,-50%); border: 2px solid rgba(255,255,255,.72); border-radius: 50%; background: rgba(5,47,77,.38); box-shadow: inset 0 0 0 12px rgba(255,255,255,.06); pointer-events: none; }
.joystick > span { position: absolute; inset: 23px; border: 1px dashed rgba(255,255,255,.3); border-radius: 50%; }
.joystick > i { position: absolute; left: 50%; top: 50%; width: 42px; height: 42px; transform: translate(-50%,-50%); border: 2px solid rgba(255,255,255,.82); border-radius: 50%; background: linear-gradient(145deg,#1da6f2,#0768bb); box-shadow: 0 8px 19px rgba(0,27,49,.33); }
.mobile-actions { display: none; }
.context-action { position: absolute; z-index: 19; right: max(22px,env(safe-area-inset-right)); bottom: max(24px,env(safe-area-inset-bottom)); display: grid; grid-template-columns: 56px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; column-gap: 12px; min-width: 252px; min-height: 78px; padding: 9px 16px 9px 9px; transform: translateY(12px) scale(.96); border: 1px solid #d6e4ec; border-bottom: 4px solid #efbe2f; border-radius: 22px; background: rgba(255,253,248,.98); color: #183f5a; box-shadow: 0 18px 44px rgba(0,31,54,.24); opacity: 0; pointer-events: none; transition: opacity .18s,transform .18s,border-color .18s,box-shadow .18s; backdrop-filter: blur(14px); }
.context-action.is-ready { transform: none; border-color: #f0c332; opacity: 1; pointer-events: auto; animation: actionPulse 1.8s ease-in-out infinite; }
.context-action > span { grid-row: 1 / 3; display: grid; place-items: center; width: 56px; height: 56px; border: 1px solid #e5b51d; border-radius: 18px; background: linear-gradient(145deg,#ffdc52,#f4b91d); color: #6b4300; font-size: 24px; font-weight: 1000; box-shadow: inset 0 1px 0 rgba(255,255,255,.55),0 5px 12px rgba(158,104,0,.14); }
.context-action > span .ui-icon { width: 25px; height: 25px; }
.context-action > span .context-art-icon { width: 38px; height: 38px; object-fit: contain; filter: drop-shadow(0 2px 2px rgba(89,50,0,.14)); }
.context-action b, .context-action small { display: block; min-width: 0; text-align: left; }
.context-action b { align-self: end; font-size: 13px; line-height: 1.1; font-weight: 900; }
.context-action small { align-self: start; max-width: 170px; overflow: hidden; color: #688399; font-size: 9px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.context-action.is-battle-action { border-bottom-color: #e99328; box-shadow: 0 16px 38px rgba(0,31,54,.24),0 0 0 1px rgba(239,164,47,.12); }
.context-action.is-battle-action > span { border-color: #eb9827; background: linear-gradient(145deg,#ffd24a,#f4a624); }
.context-action.is-quest-target { border-color:#80c6ff; border-bottom-color:#2990f3; box-shadow:0 18px 44px rgba(0,31,54,.24),0 0 0 3px rgba(88,175,255,.15); }
.context-action.is-quest-target > span { border-color:#4aaeff; background:linear-gradient(145deg,#c8eeff,#69baff); color:#0b4f8b; }
.context-action small kbd { display:inline-grid; place-items:center; min-width:26px; height:20px; margin-left:4px; padding:0 6px; border:1px solid #bdd6e6; border-bottom:2px solid #9bb9cc; border-radius:7px; background:linear-gradient(#fff,#edf5f8); color:#143b5a; font:900 10px/1 system-ui; vertical-align:middle; }
@keyframes actionPulse { 50% { transform: translateY(-2px); box-shadow: 0 18px 40px rgba(0,31,54,.28),0 0 0 4px rgba(255,210,62,.13); } }
.quick-hint { position: absolute; z-index: 12; left: 50%; bottom: 18px; padding: 7px 12px; transform: translateX(-50%); border-radius: 10px; background: rgba(3,39,66,.66); color: #e6f5fc; font-size: 8px; backdrop-filter: blur(8px); }
.loot-feed { position: absolute; z-index: 16; left: 106px; bottom: 24px; display: grid; grid-template-columns: 36px auto; align-items: center; gap: 8px; min-width: 245px; padding: 9px 12px; transform: translateY(20px); border: 1px solid rgba(255,255,255,.65); border-radius: 15px; background: rgba(4,45,73,.75); color: white; opacity: .72; transition: .24s; backdrop-filter: blur(10px); }
.loot-feed.is-active { transform: none; border-color: #ffe162; background: rgba(4,45,73,.94); opacity: 1; }
.loot-feed > span { grid-row: 1/3; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: #f8c82b; color: #634500; font-size: 19px; }
.loot-feed > span .ui-icon, .loot-item-icon { width: 25px; height: 25px; }
.loot-feed b, .loot-feed small { display: block; }
.loot-feed b { font-size: 9px; }
.loot-feed small { color: #c7dfeb; font-size: 7px; }

/* Panels */
.side-panel, .editor-panel, .chat-panel { position: absolute; z-index: 40; border: 1px solid rgba(255,255,255,.9); background: rgba(255,253,248,.97); box-shadow: 0 26px 70px rgba(0,25,47,.4); backdrop-filter: blur(17px); }
.side-panel { top: 86px; right: 18px; bottom: 18px; width: min(480px,calc(100vw - 120px)); padding: 25px; overflow: hidden auto; transform: translateX(calc(100% + 35px)); border-radius: 26px; transition: transform .25s cubic-bezier(.2,.82,.24,1); }
.side-panel.is-open { transform: none; }
.panel-close { position: sticky; z-index: 4; top: 0; float: right; width: 36px; height: 36px; border: 0; border-radius: 11px; background: #e9f4fa; color: #365f7c; font-size: 22px; }
.panel-close .ui-icon, .editor-head button .ui-icon, .chat-head button .ui-icon, .starter-close .ui-icon { width: 18px; height: 18px; margin: auto; }
.sheet-handle { display: none; }
.panel-eyebrow { color: var(--location-accent); font-size: 8px; font-weight: 1000; letter-spacing: 1.4px; }
.panel-title { margin: 4px 42px 5px 0; font-size: 28px; letter-spacing: -.8px; }
.panel-lead { margin: 0 0 18px; color: #57758b; font-size: 11px; line-height: 1.5; }

.region-grid { display: grid; gap: 12px; }
.region-card { overflow: hidden; border: 1px solid #c9dce7; border-radius: 19px; background: white; box-shadow: 0 7px 18px rgba(12,62,94,.08); }
.region-card.is-current { border: 2px solid var(--region-accent); }
.region-preview { position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: 136px; padding: 13px; overflow: hidden; background-position: center; background-size: cover; color: white; }
.region-preview span { position: absolute; top: 10px; left: 10px; padding: 5px 7px; border-radius: 8px; background: var(--region-accent); font-size: 7px; font-weight: 1000; letter-spacing: .8px; }
.region-preview b { font-size: 20px; text-shadow: 0 2px 8px #001f36; }
.region-preview small { font-size: 8px; }
.region-card > p { min-height: 35px; margin: 10px 12px 5px; color: #58758a; font-size: 9px; line-height: 1.4; }
.region-drops { display: flex; align-items: center; gap: 7px; margin: 5px 12px 10px; }
.region-drops > i { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 9px; background: #fff5cb; color: #b37c00; font-style: normal; }
.region-drops > i .ui-icon { width: 17px; height: 17px; }
.region-card > button span .ui-icon { width: 15px; height: 15px; }
.region-drops b, .region-drops small { display: block; }
.region-drops b { font-size: 8px; }
.region-drops small { color: #668096; font-size: 7px; }
.region-card > button { display: flex; justify-content: space-between; align-items: center; width: calc(100% - 20px); min-height: 39px; margin: 0 10px 10px; padding: 0 13px; border: 0; border-bottom: 3px solid color-mix(in srgb,var(--region-accent) 70%,#17466e); border-radius: 11px; background: var(--region-accent); color: white; font-size: 9px; font-weight: 1000; }
.region-card > button:disabled { border-bottom-color: #9eb0bd; background: #c8d5dc; color: #657d8e; cursor: default; }

/* Kanto atlas: every regional location is visible as a connected map node. */
.side-panel.is-regions-panel { width: min(760px,calc(100% - 128px)); }
.kanto-atlas-shell,
.kanto-directory { margin-top: 14px; overflow: hidden; border: 1px solid #cbdfe9; border-radius: 22px; background: rgba(251,254,255,.98); box-shadow: 0 12px 30px rgba(9,55,82,.09); }
.kanto-atlas-shell > header,
.kanto-directory > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px 11px; }
.kanto-atlas-shell > header small,
.kanto-directory > header small { display: block; color: #1689c8; font-size: 8px; font-weight: 1000; letter-spacing: .1em; }
.kanto-atlas-shell > header b,
.kanto-directory > header b { display: block; margin-top: 2px; color: #173e58; font-size: 16px; line-height: 1.15; }
.kanto-atlas-shell > header em,
.kanto-directory > header em { flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; background: #e7f7ee; color: #168c55; font-size: 9px; font-style: normal; font-weight: 950; }
.kanto-atlas-legend { display: flex; align-items: center; gap: 12px; padding: 0 16px 10px; color: #6e8798; font-size: 8px; font-weight: 850; }
.kanto-atlas-legend span { display: inline-flex; align-items: center; gap: 5px; }
.kanto-atlas-legend span::before { width: 9px; height: 9px; border-radius: 50%; background: #9eafba; content: ''; }
.kanto-atlas-legend span.is-current::before { background: #ffbd2e; box-shadow: 0 0 0 3px rgba(255,189,46,.22); }
.kanto-atlas-legend span.is-open::before { background: #22b879; }
.kanto-atlas-legend small { margin-left: auto; color: #8ca0ae; font-size: 8px; }
.kanto-atlas-scroll { overflow: auto hidden; border-block: 1px solid rgba(172,205,220,.75); background: #8ed2b1; scrollbar-color: #46a38b #d9eee7; scrollbar-width: thin; overscroll-behavior-inline: contain; }
.kanto-atlas-scroll:focus-visible { outline: 3px solid rgba(40,151,225,.3); outline-offset: -3px; }
.kanto-atlas-canvas { position: relative; width: 1000px; height: 530px; overflow: hidden; background:
  radial-gradient(ellipse at 14% 20%,rgba(255,255,255,.7) 0 3%,transparent 3.5%),
  radial-gradient(ellipse at 78% 72%,rgba(255,255,255,.4) 0 4%,transparent 4.5%),
  repeating-radial-gradient(ellipse at 46% 44%,transparent 0 30px,rgba(21,113,78,.08) 31px 33px,transparent 34px 58px),
  linear-gradient(145deg,#bde8bc 0%,#82cfa1 46%,#7abf91 100%); }
.kanto-atlas-canvas::before { position: absolute; inset: 0; background:
  radial-gradient(ellipse at 13% 78%,rgba(255,232,151,.65) 0 8%,transparent 8.5%),
  radial-gradient(ellipse at 70% 20%,rgba(65,146,84,.3) 0 11%,transparent 11.5%),
  radial-gradient(ellipse at 40% 72%,rgba(58,139,80,.25) 0 12%,transparent 12.5%); content: ''; pointer-events: none; }
.kanto-atlas-water { position: absolute; right: -45px; bottom: -80px; width: 410px; height: 255px; transform: rotate(-8deg); border: 8px solid rgba(255,255,255,.3); border-radius: 50%; background: repeating-radial-gradient(ellipse at 40% 30%,#68c7e8 0 14px,#74d0eb 16px 28px); opacity: .82; pointer-events: none; }
.kanto-atlas-canvas > svg { position: absolute; z-index: 1; inset: 0; width: 1000px; height: 530px; overflow: visible; pointer-events: none; }
.kanto-atlas-canvas line { stroke: rgba(55,85,78,.3); stroke-width: 6; stroke-linecap: round; stroke-dasharray: 5 10; }
.kanto-atlas-canvas line.is-open { stroke: rgba(255,255,255,.96); stroke-width: 8; stroke-dasharray: none; filter: drop-shadow(0 2px 1px rgba(23,97,73,.22)); }
.kanto-atlas-node { position: absolute; z-index: 3; left: var(--node-x); top: var(--node-y); display: grid; justify-items: center; gap: 4px; width: 88px; min-height: 64px; padding: 4px 3px; transform: translate(-50%,-50%); border: 0; background: transparent; color: #23485c; cursor: pointer; }
.kanto-atlas-node > i { display: grid; place-items: center; width: 31px; height: 31px; border: 3px solid rgba(255,255,255,.96); border-radius: 50%; background: #7e929c; color: white; box-shadow: 0 4px 9px rgba(11,65,69,.24); font-size: 9px; font-style: normal; font-weight: 1000; transition: transform .16s,box-shadow .16s; }
.kanto-atlas-node > i .ui-icon { width: 15px; height: 15px; }
.kanto-atlas-node > span { display: block; max-width: 86px; padding: 3px 5px; overflow: hidden; border-radius: 7px; background: rgba(250,254,251,.9); box-shadow: 0 2px 7px rgba(16,71,64,.12); font-size: 7px; font-weight: 950; line-height: 1.08; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.kanto-atlas-node.is-open > i { background: var(--node-accent,#20aa73); }
.kanto-atlas-node.is-city > i { width: 37px; height: 37px; border-radius: 12px; background: #168fd3; }
.kanto-atlas-node.is-special > i { border-radius: 10px; background: #7855c7; }
.kanto-atlas-node.is-current > i { background: #ffb51e; color: #5e4100; box-shadow: 0 0 0 7px rgba(255,189,46,.25),0 7px 15px rgba(90,64,5,.3); animation: kantoCurrentPulse 1.8s ease-in-out infinite; }
.kanto-atlas-node:not(:disabled):hover > i { transform: translateY(-3px) scale(1.1); box-shadow: 0 8px 15px rgba(11,65,69,.3); }
.kanto-atlas-node:disabled { cursor: default; }
.kanto-atlas-node.is-locked { opacity: .78; }
.kanto-atlas-node.is-locked > span { color: #647d89; }
@keyframes kantoCurrentPulse { 50% { transform: translateY(-2px) scale(1.06); } }
.kanto-atlas-shell > footer { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 11px 13px 13px; }
.kanto-atlas-shell > footer > span { display: grid; grid-template-columns: 28px 1fr; column-gap: 8px; align-items: center; min-width: 0; padding: 8px; border-radius: 12px; background: #eef7fa; color: #39728f; }
.kanto-atlas-shell > footer .ui-icon { grid-row: 1/3; width: 21px; height: 21px; }
.kanto-atlas-shell > footer b,
.kanto-atlas-shell > footer small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kanto-atlas-shell > footer b { color: #224e68; font-size: 9px; }
.kanto-atlas-shell > footer small { font-size: 8px; }
.kanto-directory { margin-bottom: 14px; }
.kanto-chapter-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; padding: 0 12px 13px; }
.kanto-chapter { min-width: 0; padding: 9px; border: 1px solid #d7e6ed; border-radius: 15px; background: #f7fbfd; }
.kanto-chapter > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 7px; }
.kanto-chapter > header small { display: block; color: #188ccc; font-size: 7px; font-weight: 1000; letter-spacing: .09em; }
.kanto-chapter > header b { display: block; max-width: 210px; overflow: hidden; color: #31556c; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.kanto-chapter > header em { padding: 3px 6px; border-radius: 8px; background: #e4f2f7; color: #47768e; font-size: 8px; font-style: normal; font-weight: 950; }
.kanto-chapter > div { display: grid; gap: 4px; }
.kanto-location-row { display: grid; grid-template-columns: 25px minmax(0,1fr) auto; align-items: center; gap: 7px; min-height: 39px; padding: 5px 7px; border: 1px solid transparent; border-radius: 10px; background: #fff; color: #31566d; text-align: left; }
.kanto-location-row > i { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 8px; background: #e4edf2; color: #8095a2; font-style: normal; }
.kanto-location-row > i .ui-icon { width: 14px; height: 14px; }
.kanto-location-row > span { min-width: 0; }
.kanto-location-row b,
.kanto-location-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kanto-location-row b { font-size: 9px; }
.kanto-location-row small { margin-top: 1px; color: #7c93a1; font-size: 7px; }
.kanto-location-row em { color: #879ba7; font-size: 6px; font-style: normal; font-weight: 1000; letter-spacing: .04em; }
.kanto-location-row.is-open { border-color: #cde8dd; cursor: pointer; }
.kanto-location-row.is-open > i { background: #dff5e9; color: #179b60; }
.kanto-location-row.is-current { border-color: #efc763; background: #fff9e6; }
.kanto-location-row:disabled { cursor: default; }
.service-location-list { margin-top: 12px; }
.service-location-list > summary { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border: 1px solid #d2e2e9; border-radius: 14px; background: #f4f9fb; color: #436b82; cursor: pointer; font-size: 10px; font-weight: 900; list-style: none; }
.service-location-list > summary::-webkit-details-marker { display: none; }
.service-location-list > summary em { padding: 3px 7px; border-radius: 9px; background: #dcecf3; font-size: 8px; font-style: normal; }
.service-location-list[open] > summary { margin-bottom: 10px; }
.kanto-atlas-empty { margin-top: 14px; padding: 28px; border: 1px dashed #bdced8; border-radius: 18px; color: #6b8494; text-align: center; }

@media (max-width:800px) {
  .side-panel.is-regions-panel { width: auto; }
  .kanto-atlas-shell > header,
  .kanto-directory > header { align-items: flex-start; padding-inline: 12px; }
  .kanto-atlas-legend { flex-wrap: wrap; gap: 7px 11px; padding-inline: 12px; }
  .kanto-atlas-legend small { width: 100%; margin-left: 0; }
  .kanto-chapter-grid { grid-template-columns: 1fr; }
  .kanto-atlas-shell > footer { grid-template-columns: 1fr; }
}

.collection-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
.creature-card { position: relative; display: grid; grid-template-columns: 82px 1fr; align-items: center; min-height: 101px; padding: 8px; overflow: hidden; border: 1px solid #cbdde8; border-radius: 17px; background: #f6fbfe; }
.creature-card.is-lead { border: 2px solid #eebc1d; background: #fff9df; }
.creature-card.is-locked { filter: grayscale(1); opacity: .52; }
.creature-portrait { width: 78px; height: 78px; border-radius: 14px; background-color: white; }
.creature-card b, .creature-card small, .creature-card .mini-stat { display: block; }
.creature-card b { font-size: 11px; }
.creature-card small { margin-top: 3px; color: #617e93; font-size: 8px; }
.creature-card .mini-stat { margin-top: 6px; color: #8aa0b0; font-size: 6px; font-style: normal; }
.creature-card > em { position: absolute; top: 6px; right: 6px; padding: 4px 6px; border-radius: 7px; background: #f2c425; color: #634900; font-size: 6px; font-style: normal; font-weight: 1000; }

.team-stack { display: grid; gap: 9px; }
.team-card { display: grid; grid-template-columns: 31px 82px 1fr 20px; align-items: center; gap: 8px; width: 100%; min-height: 96px; padding: 8px; border: 1px solid #c8dce7; border-radius: 18px; background: white; color: var(--ink); text-align: left; }
.team-card.is-lead { border: 2px solid var(--location-accent); background: color-mix(in srgb,var(--location-accent) 7%,white); }
.team-card.is-empty { border-style: dashed; color: #8aa0af; }
.team-index { color: #91a8b7; font-size: 9px; font-weight: 1000; }
.team-portrait { width: 78px; height: 78px; border-radius: 14px; background-color: #f1f7fa; }
.team-card small, .team-card b, .team-card em { display: block; }
.team-card small { color: var(--location-accent); font-size: 7px; font-weight: 1000; letter-spacing: .7px; }
.team-card b { margin: 2px 0; font-size: 14px; }
.team-card em { color: #658095; font-size: 8px; font-style: normal; }

.inventory-grid { display: grid; gap: 8px; }
.inventory-card { position: relative; display: grid; grid-template-columns: 56px 1fr auto; align-items: center; gap: 10px; min-height: 76px; padding: 9px; border: 1px solid #d0dfe8; border-left: 4px solid #8eabbc; border-radius: 15px; background: white; }
.inventory-card.rarity-uncommon { border-left-color: #20a9d1; }
.inventory-card.rarity-rare { border-left-color: #a563d7; }
.inventory-card.rarity-epic { border-left-color: #efb51f; }
.item-icon, .item-glyph { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 14px; background-color: #eaf5fb; }
.item-icon { padding: 4px; overflow: visible; }
.type-icon { display: inline-block; width: 1.15em; height: 1.15em; margin-right: .2em; vertical-align: -.22em; }
.item-glyph { background: linear-gradient(145deg,#edf8fc,#d4ebf5); color: var(--blue); font-size: 27px; font-style: normal; }
.inventory-card b, .inventory-card small { display: block; }
.inventory-card b { font-size: 10px; }
.inventory-card small { margin-top: 4px; color: #6c8497; font-size: 8px; line-height: 1.3; }
.inventory-card > em { padding: 5px 8px; border-radius: 9px; background: #edf5f9; color: #365e79; font-size: 10px; font-style: normal; font-weight: 1000; }
.discovery-score { display: grid; grid-template-columns: 62px 1fr; align-items: center; margin-bottom: 13px; padding: 13px; border-radius: 18px; background: linear-gradient(135deg,#0b7dd2,#13a6e4); color: white; }
.discovery-score > span { grid-row: 1/3; font-size: 36px; }
.discovery-score > span .ui-icon { width: 42px; height: 42px; }
.discovery-score strong { font-size: 29px; line-height: 1; }
.discovery-score small { color: #d3f2ff; font-size: 8px; }
.discovery-list { display: grid; gap: 8px; }
.discovery-list article { display: grid; grid-template-columns: 34px 1fr; align-items: center; gap: 9px; padding: 11px; border: 1px solid #d2e0e8; border-radius: 14px; background: white; }
.discovery-list article > i { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: #e8f1f6; color: #8097a7; font-style: normal; font-weight: 1000; }
.discovery-list article.is-done > i { background: #dcf5d5; color: #43a528; }
.discovery-list article > i .ui-icon { width: 18px; height: 18px; }
.center-card i .ui-icon { display: inline-block; width: 1.15em; height: 1.15em; margin-right: .25em; vertical-align: -.22em; }
.discovery-list b, .discovery-list small { display: block; }
.discovery-list b { font-size: 10px; }
.discovery-list small { margin-top: 3px; color: #6e8698; font-size: 7px; }
.discovery-list article.quest-feature { border-color: #f2cf57; background: linear-gradient(135deg,#fffbed,#fff); }
.binding-list { display: grid; gap: 8px; }
.binding-row { display: grid; grid-template-columns: minmax(130px,1fr) auto; align-items: center; gap: 10px; padding: 10px; border: 1px solid #cfdee7; border-radius: 14px; background: white; }
.binding-row > span b, .binding-row > span small { display: block; }
.binding-row > span b { font-size: 9px; }
.binding-row > span small { margin-top: 3px; color: #728a9b; font-size: 6px; }
.binding-row > div { display: flex; gap: 5px; }
.binding-row button { min-width: 70px; min-height: 34px; padding: 0 8px; border: 1px solid #bcd2df; border-bottom: 3px solid #8ba9ba; border-radius: 10px; background: #edf7fc; color: #245e82; font-size: 8px; font-weight: 1000; }
.binding-row button.is-listening { border-color: #e9b622; background: #fff4b8; color: #7a5200; animation: bindingListen .8s ease-in-out infinite alternate; }
@keyframes bindingListen { to { box-shadow: 0 0 0 4px rgba(244,197,47,.2); } }
.settings-reset { width: 100%; min-height: 39px; margin-top: 10px; border: 1px solid #bcd3e0; border-radius: 12px; background: #eef7fb; color: #38647f; font-size: 7px; font-weight: 1000; }
.battle-setting { display: grid; grid-template-columns: 40px 1fr; align-items: center; gap: 9px; margin-top: 12px; padding: 12px; border: 1px solid #c9dce7; border-radius: 15px; background: #f7fbfd; }
.battle-setting input { width: 22px; height: 22px; margin: auto; accent-color: #54bd35; }
.battle-setting b, .battle-setting small { display: block; }
.battle-setting b { font-size: 10px; }
.battle-setting small { margin-top: 3px; color: #688297; font-size: 7px; line-height: 1.4; }
.settings-footnote { margin: 10px 2px 0; color: #70889a; font-size: 7px; line-height: 1.5; }

.editor-panel { top: 86px; right: 18px; width: min(390px,calc(100vw - 36px)); max-height: calc(100% - 104px); padding: 20px; overflow: hidden auto; transform: translateX(calc(100% + 35px)); border-radius: 24px; transition: transform .23s; }
.editor-panel.is-open { transform: none; }
.editor-head, .chat-head, .battle-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.editor-head small, .chat-head small, .battle-status small { display: block; color: var(--blue); font-size: 7px; font-weight: 1000; letter-spacing: 1.2px; }
.editor-head b, .chat-head b { font-size: 17px; }
.editor-head button, .chat-head button { width: 34px; height: 34px; border: 0; border-radius: 10px; background: #e8f3f9; color: #41647c; font-size: 20px; }
.editor-panel > p { margin: 11px 0; color: #607b90; font-size: 10px; line-height: 1.45; }
.editor-modes, .editor-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.editor-modes button, .editor-actions button { min-height: 38px; border: 1px solid #c9dce7; border-radius: 10px; background: white; color: #426983; font-size: 9px; font-weight: 900; }
.editor-modes button { display: flex; align-items: center; justify-content: center; gap: 6px; }
.editor-modes button i .ui-icon { width: 15px; height: 15px; }
.editor-modes button.is-active { border-color: var(--blue); background: var(--blue); color: white; }
.object-catalog { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; margin: 10px 0; }
.object-catalog button { min-width: 0; padding: 4px; border: 1px solid #cbdde8; border-radius: 12px; background: #f9fcfe; }
.object-catalog button.is-active { border: 2px solid var(--blue); background: #e8f6ff; }
.object-thumb { width: 100%; aspect-ratio: 1; border-radius: 8px; background-color: white; }
.object-catalog small { display: block; height: 17px; overflow: hidden; color: #496a80; font-size: 6px; font-weight: 850; }
.editor-toggle { display: flex; align-items: center; gap: 8px; padding: 9px; border-radius: 10px; background: #edf6fb; font-size: 9px; font-weight: 800; }
.editor-actions { margin-top: 9px; }
.editor-tip { display: block; margin-top: 9px; color: #6c8394; font-size: 8px; }

.chat-panel { left: 104px; bottom: 20px; width: min(430px,calc(100vw - 130px)); height: min(500px,calc(100% - 115px)); padding: 17px; transform: translateY(calc(100% + 35px)); border-radius: 24px; transition: transform .23s; }
.chat-panel.is-open { transform: none; }
.chat-tabs { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin: 13px 0 9px; }
.chat-tabs button { min-height: 34px; border: 0; border-radius: 9px; background: #eaf3f8; color: #5c788d; font-size: 8px; font-weight: 900; }
.chat-tabs button.is-active { background: var(--blue); color: white; }
.chat-log { height: calc(100% - 112px); overflow-y: auto; }
.chat-message { display: grid; grid-template-columns: 30px 1fr; gap: 8px; margin: 8px 0; }
.chat-message > i { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; background: #dff1fc; color: var(--blue); font-size: 10px; font-style: normal; font-weight: 1000; }
.chat-message b { display: block; font-size: 9px; }
.chat-message p { margin: 2px 0 0; color: #4d6d84; font-size: 9px; line-height: 1.35; }
#chatForm { display: grid; grid-template-columns: 1fr 42px; gap: 7px; }
#chatForm input { min-width: 0; height: 41px; padding: 0 12px; border: 1px solid #c7dbe6; border-radius: 11px; background: white; font-size: 10px; }
#chatForm button { border: 0; border-radius: 11px; background: var(--blue); color: white; }
#chatForm button .ui-icon { width: 20px; height: 20px; margin: auto; }

/* Battle */
.battle-hud { position: absolute; z-index: 35; left: 50%; bottom: max(18px,env(safe-area-inset-bottom)); width: min(790px,calc(100vw - 38px)); padding: 13px; transform: translate(-50%,calc(100% + 45px)); border: 1px solid rgba(255,255,255,.88); border-radius: 23px; background: rgba(255,253,248,.96); box-shadow: 0 22px 60px rgba(0,20,42,.43); transition: transform .28s cubic-bezier(.2,.84,.22,1); backdrop-filter: blur(14px); }
.battle-hud.is-open { transform: translate(-50%,0); }
.battle-status b { display: block; max-width: 580px; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.battle-controls { display: flex; gap: 6px; }
#autoBattle { min-width: 76px; height: 34px; border: 1px solid #b8d0df; border-radius: 10px; background: #dbe8ef; color: #617889; font-size: 8px; font-weight: 1000; }
#autoBattle.is-active { border-color: #5ab838; background: #5fc63b; color: white; }
#cancelBattle { min-width: 64px; height: 34px; border: 1px solid #e4b6b2; border-radius: 10px; background: #fff0ef; color: #aa453e; font-size: 7px; font-weight: 1000; }
#cancelBattle:disabled { opacity: .45; cursor: default; }
.battle-skills { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin-top: 9px; }
.battle-skills.is-hidden { display: none; }
.battle-skills button { position: relative; display: grid; grid-template-columns: 43px 1fr auto; align-items: center; gap: 8px; min-height: 57px; padding: 6px 9px 6px 6px; overflow: hidden; border: 1px solid #c7dae6; border-bottom: 3px solid #8daabd; border-radius: 14px; background: #f8fbfd; color: var(--ink); text-align: left; }
.battle-skills button.is-queued { border-color: #10a5eb; background: #e6f7ff; box-shadow: inset 0 0 0 1px #10a5eb; }
.battle-skills button:disabled { filter: grayscale(.45); opacity: .65; cursor: wait; }
.skill-icon { width: 43px; height: 43px; border-radius: 50%; background-color: white; }
.battle-skills b, .battle-skills small { display: block; }
.battle-skills b { font-size: 9px; }
.battle-skills small { margin-top: 3px; color: #6e8597; font-size: 7px; }
.battle-skills em { padding: 4px 6px; border-radius: 7px; background: #e7f0f5; color: #45677e; font-size: 6px; font-style: normal; font-weight: 1000; }
.battle-skills .is-queued em { background: #0d93df; color: white; }
.capture-panel { display: none; grid-template-columns: minmax(190px,1fr) minmax(220px,1.35fr) 92px; align-items: center; gap: 12px; min-height: 98px; margin-top: 9px; padding: 11px; border: 1px solid #b9d9e9; border-radius: 19px; background: linear-gradient(135deg,#eaf8ff,#fff8e4); box-shadow: inset 0 1px 0 rgba(255,255,255,.55),0 10px 24px rgba(18,88,134,.12); }
.capture-panel.is-open { display: grid; }
.capture-copy small, .capture-copy b { display: block; }
.capture-copy small { color: #087bc9; font-size: 7px; font-weight: 1000; letter-spacing: .8px; }
.capture-copy b { margin-top: 4px; font-size: 10px; line-height: 1.35; }
.capture-balls { display: flex; gap: 6px; min-width: 0; overflow-x: auto; }
.capture-balls > button { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 5px; min-width: 126px; min-height: 48px; padding: 4px 7px 4px 4px; border: 1px solid #bdd2dd; border-radius: 13px; background: rgba(255,255,255,.82); color: #31566e; text-align: left; }
.capture-balls > button.is-selected { border: 2px solid #0d91dc; background: #e5f6ff; color: #075d9b; }
.capture-ball-icon { width: 34px; height: 34px; }
.capture-balls b, .capture-balls small { display: block; }
.capture-balls b { overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.capture-balls small { font-size: 7px; font-weight: 1000; }
.capture-empty { color: #9b554e; font-size: 8px; line-height: 1.35; }
.capture-throw { position: relative; display: grid; place-items: center; align-content: center; justify-self: end; width: 76px; height: 76px; padding: 2px; transform: translate(var(--throw-x,0),var(--throw-y,0)) rotate(var(--throw-rotate,0)); border: 2px solid #fff; border-radius: 24px; background: linear-gradient(145deg,#ffffff,#dff2fb); box-shadow: 0 8px 20px rgba(10,72,106,.22); color: #17445f; touch-action: none; transition: transform .16s ease,box-shadow .16s; user-select: none; }
.capture-throw.is-aiming { z-index: 4; transition: none; box-shadow: 0 15px 28px rgba(6,67,103,.34); }
.capture-throw:disabled { filter: grayscale(.8); opacity: .48; cursor: default; }
.capture-throw-icon { width: 49px; height: 49px; pointer-events: none; }
.capture-throw em { margin-top: -5px; font-size: 5px; font-style: normal; font-weight: 1000; pointer-events: none; }
#battleHint { margin: 7px 0 0; color: #698196; font-size: 8px; text-align: center; }
.is-battling .context-action, .is-battling .mobile-actions, .is-battling .loot-feed { opacity: 0; pointer-events: none; }

.mobile-dock { display: none; }
.loading-screen { position: fixed; z-index: 100; inset: 0; display: grid; place-content: center; justify-items: center; background: radial-gradient(circle at 50% 44%,#18a4e9,#0753a5 70%); color: white; opacity: 0; pointer-events: none; transition: opacity .22s; }
.loading-screen.is-open { opacity: 1; pointer-events: auto; }
.loading-screen b { margin-top: 17px; font-size: 19px; }
.loading-screen small { margin-top: 5px; color: #cceeff; font-size: 9px; }
.loading-orbit { position: relative; width: 68px; height: 68px; border: 5px solid rgba(255,255,255,.24); border-top-color: white; border-radius: 50%; animation: spin .8s linear infinite; }
.loading-orbit i { position: absolute; inset: 17px; border-radius: 10px; background: #ffd23b; transform: rotate(45deg); }
.loading-screen.is-session-conflict { background: linear-gradient(rgba(4,32,52,.82),rgba(4,32,52,.86)),radial-gradient(circle at 50% 44%,#18a4e9,#0753a5 70%); backdrop-filter: blur(7px); }
.loading-screen.is-session-conflict .loading-orbit { border-color: rgba(255,255,255,.2); border-top-color: #ffd348; }
.loading-screen.is-session-conflict .loading-orbit i { background: #fffdf8; box-shadow: 0 0 0 6px rgba(255,211,72,.14); }
.loading-screen.is-session-conflict b { max-width: min(520px,calc(100vw - 36px)); text-align: center; }
.loading-screen.is-session-conflict small { max-width: min(560px,calc(100vw - 44px)); color: #e5f4fb; text-align: center; line-height: 1.55; }
@keyframes spin { to { transform: rotate(1turn); } }
.toast { position: fixed; z-index: 130; left: 50%; top: max(20px,env(safe-area-inset-top)); max-width: min(520px,calc(100vw - 24px)); padding: 11px 16px; transform: translate(-50%,-28px); border: 1px solid rgba(255,255,255,.7); border-radius: 13px; background: rgba(3,38,65,.92); color: white; box-shadow: 0 13px 35px rgba(0,21,42,.32); font-size: 10px; font-weight: 850; opacity: 0; pointer-events: none; transition: .2s; }
.toast.is-open { transform: translate(-50%,0); opacity: 1; }

/* Dedicated phone HUD */
@media (max-width: 800px) {
  .home-topbar { top: max(10px,env(safe-area-inset-top)); left: max(11px,env(safe-area-inset-left)); right: max(11px,env(safe-area-inset-right)); }
  .brand-mark { width: 37px; height: 37px; border-radius: 12px; font-size: 19px; }
  .brand b { font-size: 23px; letter-spacing: -1.6px; }
  .brand small, .home-resources span:nth-child(n+2) { display: none; }
  .home-resources span { padding: 8px 10px; border-radius: 12px; font-size: 9px; }
  .home-backdrop { background-position: 58% center; }
  .home-vignette { background: linear-gradient(0deg,rgba(2,25,45,.9) 0%,rgba(2,36,60,.28) 65%,rgba(3,38,63,.25)); }
  .home-showcase { left: 9%; right: 2%; top: 11%; bottom: 38%; width: auto; }
  .trainer-showcase { left: 4%; width: min(49vw,250px); }
  .home-showcase > span { display: none; }
  .hero-card { left: max(10px,env(safe-area-inset-left)); right: max(10px,env(safe-area-inset-right)); top: auto; bottom: max(18px,calc(env(safe-area-inset-bottom) + 8px)); width: auto; padding: 15px; transform: none; border-radius: 22px; }
  .hero-card-head { gap: 9px; }
  .avatar-ring { flex-basis: 56px; height: 56px; border-radius: 17px; border-width: 3px; }
  .hero-card-head strong { font-size: 20px; }
  .hero-card > p, .xp-row, .foundation-status, .prototype-note { display: none; }
  .name-field { grid-template-columns: 80px 1fr; margin-top: 9px; }
  .name-field input { height: 37px; }
  .skin-picker { margin: 8px 0; }
  .skin-picker button { min-height: 38px; grid-template-columns: 28px 1fr; font-size: 7px; }
  .trainer-mini { width: 27px; height: 31px; }
  .primary-cta { min-height: 47px; border-bottom-width: 3px; }

  .world-topbar { top: max(7px,env(safe-area-inset-top)); left: max(7px,env(safe-area-inset-left)); right: max(7px,env(safe-area-inset-right)); display: grid; grid-template-columns: 1fr auto; gap: 6px; }
  .player-chip { min-width: 0; min-height: 47px; padding: 5px 8px 5px 5px; border-radius: 14px; }
  .player-chip-avatar { width: 35px; height: 35px; border-radius: 11px; }
  .player-chip b { max-width: 42vw; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
  .player-chip small { font-size: 6px; }
  .world-location { display: none; }
  .instance-chip { min-width: 0; min-height: 47px; padding: 6px 8px; border-radius: 14px; }
  .signal-bars { font-size: 18px; }
  .instance-chip b { font-size: 7px; }
  .instance-chip small { max-width: 118px; overflow: hidden; font-size: 5px; text-overflow: ellipsis; white-space: nowrap; }
  .world-rail { display: none; }
  .movement-zone { position: absolute; z-index: 8; left: 0; bottom: calc(74px + env(safe-area-inset-bottom)); display: block; width: 58%; height: 62%; touch-action: none; }
  .quick-hint { display: none; }
  .mobile-actions { position: absolute; z-index: 18; right: max(15px,env(safe-area-inset-right)); bottom: calc(158px + env(safe-area-inset-bottom)); display: grid; gap: 8px; }
  .round-quick { display: grid; place-items: center; width: 43px; height: 43px; border: 2px solid rgba(255,255,255,.78); border-radius: 15px; background: rgba(4,52,85,.83); color: white; box-shadow: 0 9px 22px rgba(0,28,50,.28); font-size: 18px; backdrop-filter: blur(8px); }
  .round-quick .ui-icon { width: 21px; height: 21px; }
  .context-action { right: max(13px,env(safe-area-inset-right)); bottom: calc(82px + env(safe-area-inset-bottom)); grid-template-columns: 52px minmax(0,1fr); width: min(190px,calc(100vw - 98px)); min-width: 0; min-height: 66px; padding: 5px 10px 5px 5px; border-radius: 22px; }
  .context-action > span { width: 52px; height: 52px; border-radius: 18px; }
  .context-action b, .context-action small { display: block; min-width: 0; }
  .context-action b { font-size: 10px; }
  .context-action small { max-width: 112px; font-size: 6px; }
  .loot-feed { left: max(8px,env(safe-area-inset-left)); right: 92px; bottom: calc(82px + env(safe-area-inset-bottom)); min-width: 0; padding: 7px 9px; border-radius: 13px; transform: translateY(16px); }
  .loot-feed > span { width: 32px; height: 32px; border-radius: 10px; }
  .loot-feed b { font-size: 8px; }
  .loot-feed small { font-size: 6px; }
  .mobile-dock { position: absolute; z-index: 23; left: max(7px,env(safe-area-inset-left)); right: max(7px,env(safe-area-inset-right)); bottom: max(6px,env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(5,1fr); height: 67px; padding: 5px; border: 1px solid rgba(255,255,255,.9); border-radius: 22px; background: rgba(255,253,248,.95); box-shadow: 0 13px 35px rgba(0,27,49,.34); backdrop-filter: blur(14px); }
  .mobile-dock button { display: grid; place-items: center; align-content: center; gap: 2px; min-width: 0; border: 0; border-radius: 15px; background: transparent; color: #315d7d; }
  .mobile-dock button.is-active { background: #e4f3fc; color: var(--blue); }
  .mobile-dock span { font-size: 20px; line-height: 1; }
  .mobile-dock span .ui-icon { width: 20px; height: 20px; }
  .mobile-dock b { font-size: 6px; text-transform: uppercase; }
  .side-panel, .editor-panel, .chat-panel { inset: auto max(7px,env(safe-area-inset-right)) calc(79px + env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left)); width: auto; max-height: min(72%,610px); padding: 9px 15px 17px; transform: translateY(calc(100% + 105px)); border-radius: 23px; }
  .side-panel.is-open, .editor-panel.is-open, .chat-panel.is-open { transform: none; }
  .sheet-handle { display: block; width: 42px; height: 4px; margin: 2px auto 7px; border-radius: 3px; background: #c4d4de; }
  .panel-close { position: absolute; top: 12px; right: 12px; float: none; }
  .panel-title { font-size: 24px; }
  .panel-lead { font-size: 9px; }
  .region-grid { grid-template-columns: 1fr; }
  .region-preview { height: 118px; }
  .collection-grid { grid-template-columns: repeat(2,1fr); }
  .creature-card { grid-template-columns: 62px 1fr; min-height: 80px; padding: 6px; }
  .creature-portrait { width: 59px; height: 59px; }
  .creature-card b { font-size: 9px; }
  .creature-card small { font-size: 6px; }
  .creature-card .mini-stat { display: none; }
  .team-card { grid-template-columns: 24px 66px 1fr 14px; min-height: 80px; }
  .team-portrait { width: 62px; height: 62px; }
  .inventory-card { grid-template-columns: 50px 1fr auto; min-height: 68px; }
  .item-icon, .item-glyph { width: 47px; height: 47px; }
  .object-catalog { grid-template-columns: repeat(6,1fr); max-height: 190px; overflow-y: auto; }
  .chat-panel { height: min(67%,520px); }
  .chat-log { height: calc(100% - 116px); }
  .battle-hud { bottom: calc(79px + env(safe-area-inset-bottom)); width: calc(100vw - 14px); padding: 9px; border-radius: 20px; }
  .battle-status b { max-width: 63vw; font-size: 10px; }
  .battle-skills { gap: 5px; }
  .battle-skills button { grid-template-columns: 37px 1fr; min-height: 49px; padding: 5px; }
  .skill-icon { width: 37px; height: 37px; }
  .battle-skills b { font-size: 7px; }
  .battle-skills small { font-size: 5px; }
  .battle-skills em { display: none; }
  .capture-panel { grid-template-columns: 1fr 72px; min-height: 82px; gap: 6px; padding: 6px; }
  .capture-copy { grid-column: 1/2; }
  .capture-copy small { font-size: 5px; }
  .capture-copy b { font-size: 8px; }
  .capture-balls { grid-column: 1/2; }
  .capture-balls > button { grid-template-columns: 28px 1fr auto; min-width: 108px; min-height: 40px; }
  .capture-ball-icon { width: 28px; height: 28px; }
  .capture-throw { grid-column: 2; grid-row: 1/3; width: 66px; height: 66px; border-radius: 21px; }
  .capture-throw-icon { width: 43px; height: 43px; }
  #battleHint { font-size: 6px; }
}

@media (max-width: 370px), (max-width: 800px) and (max-height: 640px) {
  .home-showcase { display: none; }
  .hero-card { bottom: max(9px,env(safe-area-inset-bottom)); }
  .hero-card-head, .skin-picker { margin-bottom: 4px; }
  .skin-picker button { min-height: 34px; }
  .mobile-dock { height: 59px; }
  .context-action { bottom: calc(72px + env(safe-area-inset-bottom)); width: min(174px,calc(100vw - 90px)); min-width: 0; min-height: 58px; }
  .context-action > span { width: 46px; height: 46px; }
  .mobile-actions { bottom: calc(139px + env(safe-area-inset-bottom)); }
  .side-panel, .editor-panel, .chat-panel, .battle-hud { bottom: calc(70px + env(safe-area-inset-bottom)); }
  .loot-feed { bottom: calc(71px + env(safe-area-inset-bottom)); }
}

/* Compact desktop HUD for ultrawide or browser windows with little vertical space. */
@media (min-width: 801px) and (max-height: 650px) and (pointer: fine) {
  .world-topbar { top: 7px; left: 125px; right: 8px; grid-template-columns: minmax(180px,1fr) auto minmax(180px,1fr); gap: 7px; }
  .player-chip, .world-location, .instance-chip { min-height: 44px; border-radius: 14px; }
  .player-chip { min-width: 184px; padding: 4px 8px 4px 4px; }
  .player-chip-avatar { width: 34px; height: 34px; border-radius: 10px; }
  .world-location { min-width: 214px; padding: 4px 9px; }
  .location-pin { width: 29px; height: 32px; }
  .instance-chip { min-width: 190px; padding: 5px 9px; }
  .world-rail { left: 8px; top: 50%; grid-template-columns: repeat(2,1fr); gap: 3px; width: 108px; padding: 5px; transform: translateY(-50%); border-radius: 17px; }
  .world-rail button { min-height: 39px; border-radius: 11px; }
  .world-rail button span { font-size: 17px; }
  .world-rail button b { font-size: 5px; }
  .world-rail button > i { top: 2px; right: 2px; min-width: 12px; height: 12px; font-size: 5px; }
  .side-panel { top: 58px; right: 8px; bottom: 8px; width: min(455px,calc(100vw - 140px)); padding: 17px; border-radius: 20px; }
  .editor-panel { top: 58px; right: 8px; max-height: calc(100% - 66px); padding: 14px; border-radius: 19px; }
  .chat-panel { left: 124px; top: 58px; bottom: 8px; width: min(420px,calc(100vw - 140px)); height: auto; padding: 13px; border-radius: 20px; }
  .chat-log { height: calc(100% - 112px); }
  .battle-hud { left: 124px; right: 8px; bottom: 8px; width: auto; padding: 9px; transform: translateY(calc(100% + 42px)); border-radius: 18px; }
  .battle-hud.is-open { transform: none; }
  .battle-status { min-height: 29px; }
  .battle-skills button { min-height: 45px; }
  #battleHint { display: none; }
  .context-action { right: 8px; bottom: 8px; min-width: 132px; min-height: 49px; border-radius: 16px; }
  .context-action > span { width: 37px; height: 37px; border-radius: 12px; }
  .quick-hint { bottom: 7px; }
  .loot-feed { left: 124px; bottom: 8px; }
  .home-topbar { top: 8px; left: 14px; right: 14px; }
  .brand-mark { width: 39px; height: 39px; border-radius: 12px; }
  .brand b { font-size: 25px; }
  .hero-card { left: 5vw; top: 57px; bottom: 8px; width: min(390px,40vw); padding: 13px; transform: none; overflow: auto; border-radius: 20px; }
  .hero-card > p, .foundation-status, .prototype-note { display: none; }
  .avatar-ring { flex-basis: 55px; height: 55px; border-radius: 16px; }
  .hero-card-head strong { font-size: 20px; }
  .xp-row { margin: 7px 0; }
  .name-field input { height: 35px; }
  .skin-picker { margin: 7px 0; }
  .skin-picker button { min-height: 37px; }
  .primary-cta { min-height: 42px; }
}

@media (min-width: 1450px) {
  .hero-card { left: 6vw; width: 470px; padding: 28px; }
  .world-rail { left: 24px; }
  .side-panel { width: 520px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Pokémon Trainer Hub v1.4 */
.home-backdrop { background-image: url('/assets/v2.0/maps/arrival-plaza.webp'); background-position: 50% 62%; }
.pikachu-avatar { position: absolute; inset: -6px; background: url('/assets/v1.2/pokemon/static/025.png') center / contain no-repeat; image-rendering: auto; }
.pikachu-showcase { position: absolute; right: 2%; bottom: 1%; width: min(20vw,270px); aspect-ratio: 1; background: url('/assets/v1.2/pokemon/static/025.png') center / contain no-repeat; filter: drop-shadow(0 18px 12px rgba(0,22,45,.35)); }
.pokemon-portrait { display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle,#fff 38%,#eaf6fc 100%); }
.pokemon-portrait img { display: block; width: 100%; height: 100%; object-fit: contain; image-rendering: auto; }
.creature-card.is-locked { filter: none; opacity: .68; }
.creature-card.is-owned { border-color: #78c553; background: #f3ffef; }
.creature-card > em { background: #66c944; color: #174d0b; }
.creature-card.is-lead > em { background: #f2c425; color: #634900; }
.pokedex-grid .creature-card { grid-template-columns: 72px 1fr; min-height: 92px; }
.pokedex-grid .creature-portrait { width: 68px; height: 68px; }
.team-card:not(.is-empty) { display: block; padding: 7px; }
.team-card-main { display: grid; grid-template-columns: 31px 82px 1fr; align-items: center; gap: 8px; width: 100%; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; }
.team-remove { display: block; min-height: 29px; margin: 5px 0 0 auto; padding: 0 10px; border: 1px solid #c7dce8; border-radius: 9px; background: #eef6fa; color: #4f7187; font-size: 7px; font-weight: 900; }
.kit-preview { display: block; max-width: 260px; margin-top: 4px; overflow: hidden; color: #8a9fac; font-size: 6px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.panel-primary { width: 100%; min-height: 44px; margin-top: 12px; border: 0; border-bottom: 3px solid #07569f; border-radius: 13px; background: linear-gradient(#149cf3,#0872c9); color: white; font-size: 9px; font-weight: 1000; }
.center-list { display: grid; gap: 9px; }
.center-card { display: grid; grid-template-columns: 84px 1fr; gap: 10px; padding: 9px; border: 1px solid #cbdde8; border-radius: 17px; background: white; }
.center-card.is-lead { border: 2px solid var(--location-accent); background: color-mix(in srgb,var(--location-accent) 7%,white); }
.center-portrait { grid-row: 1/3; width: 80px; height: 80px; border-radius: 15px; }
.center-card small, .center-card b, .center-card em, .center-card i { display: block; }
.center-card small { color: var(--location-accent); font-size: 7px; font-weight: 1000; }
.center-card b { margin: 2px 0; font-size: 14px; }
.center-card em { color: #607d91; font-size: 8px; font-style: normal; }
.center-card i { margin-top: 5px; color: #849aa9; font-size: 6px; font-style: normal; line-height: 1.35; }
.center-actions { grid-column: 1/-1; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.center-actions button { min-height: 31px; padding: 0 10px; border: 1px solid #bcd6e5; border-radius: 9px; background: #eaf6fd; color: #146da9; font-size: 7px; font-weight: 1000; }
.center-actions button:disabled { opacity: .45; cursor: default; }
.center-actions button.danger { border-color: #efc0bc; background: #fff0ef; color: #b63d35; }
.empty-center { padding: 25px; border: 2px dashed #bdd5e3; border-radius: 18px; background: #f6fbfe; text-align: center; }
.empty-center b { font-size: 16px; }
.empty-center p { color: #678398; font-size: 9px; line-height: 1.5; }
.object-thumb.direct { display: grid; place-items: center; overflow: hidden; }
.object-thumb.direct img { width: 100%; height: 100%; object-fit: contain; }
.battle-skills button.skill-kind-passive { border-color: #d0c0e8; background: #f5effc; cursor: default; }

.starter-dialog { position: fixed; z-index: 120; inset: 0; display: grid; place-items: center; padding: 24px; opacity: 0; pointer-events: none; transition: opacity .22s; }
.starter-dialog.is-open { opacity: 1; pointer-events: auto; }
.starter-backdrop { position: absolute; inset: 0; background: rgba(2,25,45,.72); backdrop-filter: blur(8px); }
.starter-card { position: relative; width: min(980px,calc(100vw - 28px)); max-height: min(780px,calc(100vh - 28px)); padding: 28px; overflow: auto; border: 1px solid rgba(255,255,255,.95); border-radius: 28px; background: rgba(255,253,248,.98); box-shadow: 0 35px 90px rgba(0,18,35,.55); }
.starter-card h2 { margin: 4px 45px 6px 0; font-size: clamp(25px,4vw,39px); }
.starter-card > p { margin: 0 0 18px; color: #5f7a8e; font-size: 11px; }
.starter-card > small { display: block; margin-top: 14px; color: #698399; font-size: 8px; text-align: center; }
.starter-close { position: absolute; top: 18px; right: 18px; width: 38px; height: 38px; border: 0; border-radius: 12px; background: #e7f2f8; color: #365e79; font-size: 23px; }
.starter-options { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.starter-option { display: grid; grid-template-rows: 180px auto; gap: 8px; min-width: 0; padding: 12px; border: 2px solid #cae0ea; border-bottom-width: 5px; border-radius: 21px; background: linear-gradient(#fff,#edf8fd); color: var(--ink); text-align: left; }
.starter-option:hover { transform: translateY(-3px); border-color: var(--blue); box-shadow: 0 12px 27px rgba(7,91,145,.17); }
.starter-grass { --starter-color:#5fb947; }
.starter-fire { --starter-color:#ee6c35; }
.starter-water { --starter-color:#2b9ed6; }
.starter-option { border-bottom-color: var(--starter-color); }
.starter-portrait { width: 100%; height: 180px; border-radius: 16px; }
.starter-option small, .starter-option b, .starter-option em, .starter-option i { display: block; }
.starter-option small { color: var(--starter-color); font-size: 8px; font-weight: 1000; }
.starter-option b { margin: 3px 0; font-size: 21px; }
.starter-option em { color: #5c778b; font-size: 8px; font-style: normal; }
.starter-option i { margin-top: 7px; color: #8095a4; font-size: 7px; font-style: normal; line-height: 1.4; }

@media (max-width: 800px) {
  .pikachu-showcase { right: 0; width: min(34vw,190px); }
  .mobile-dock { grid-template-columns: repeat(7,1fr); }
  .mobile-dock span { font-size: 17px; }
  .mobile-dock b { font-size: 5px; }
  .pokedex-grid { grid-template-columns: repeat(2,1fr); }
  .pokedex-grid .creature-card { grid-template-columns: 53px 1fr; min-height: 68px; }
  .pokedex-grid .creature-portrait { width: 50px; height: 50px; }
  .team-card-main { grid-template-columns: 24px 66px 1fr; }
  .center-card { grid-template-columns: 67px 1fr; }
  .center-portrait { width: 64px; height: 64px; }
  .starter-dialog { padding: 7px; }
  .starter-card { width: 100%; max-height: calc(100vh - 14px); padding: 20px 14px; border-radius: 23px; }
  .starter-card > p { font-size: 9px; }
  .starter-options { grid-template-columns: 1fr; }
  .starter-option { grid-template-columns: 108px 1fr; grid-template-rows: auto; align-items: center; min-height: 124px; }
  .starter-portrait { width: 106px; height: 106px; }
  .starter-option b { font-size: 17px; }
}

@media (max-width: 420px) {
  .binding-row { grid-template-columns: 1fr; }
  .binding-row > div { width: 100%; }
  .binding-row button { flex: 1; }
  .mobile-dock b { font-size: 4.5px; }
}

/* Unified Account Edition v2.0 — password, Telegram/VK identities and immutable onboarding. */
.gate-screen {
  position: absolute;
  inset: 0;
  isolation: isolate;
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  padding: 80px 18px 24px;
  overflow: hidden;
  background: #166248;
}
#app[data-screen="gate"] .auth-screen,
#app[data-screen="gate"] .home-screen,
#app[data-screen="gate"] .game-screen,
#app[data-screen="auth"] .gate-screen,
#app[data-screen="home"] .gate-screen,
#app[data-screen="game"] .gate-screen {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
#app[data-screen="gate"] .gate-screen {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
.gate-card { width: min(460px,calc(100vw - 28px)); }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 0 0 15px; padding: 4px; border-radius: 14px; background: #e8f2f7; }
.auth-tabs button { min-height: 40px; border: 0; border-radius: 11px; background: transparent; color: #688397; font-size: 11px; font-weight: 1000; }
.auth-tabs button.is-active { background: white; color: #087bd2; box-shadow: 0 5px 14px rgba(12,77,117,.13); }
.account-form { display: none; gap: 11px; }
.account-form.is-active { display: grid; }
.auth-field { display: grid; gap: 5px; color: #31556d; font-size: 11px; font-weight: 900; }
.auth-field input { box-sizing: border-box; width: 100%; min-height: 48px; padding: 0 14px; border: 1px solid #bfd6e4; border-radius: 13px; outline: 0; background: white; color: #153a55; font-size: 14px; font-weight: 700; transition: border-color .16s,box-shadow .16s; }
.auth-field input:focus { border-color: #118bdd; box-shadow: 0 0 0 3px rgba(17,139,221,.13); }
.auth-field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.field-caption { color: #31556d; font-size: 11px; font-weight: 900; }
.register-skin-picker { margin: 0; }
.account-form .primary-cta, .gate-card .primary-cta { margin-top: 2px; }
.form-error { display: none; min-height: 18px; padding: 8px 10px; border-radius: 10px; background: #fff0ef; color: #b63e37; font-size: 10px; font-weight: 800; line-height: 1.35; text-align: center; }
.form-error:not(:empty) { display: block; }
.auth-card:has(#registerForm.is-active) { width: min(590px,calc(100vw - 28px)); }
button.is-busy { opacity: .65; pointer-events: none; }

@media (max-width: 800px) {
  .gate-screen { padding: 70px 7px 7px; }
  .auth-field-grid { grid-template-columns: 1fr; }
  .auth-card:has(#registerForm.is-active) { max-height: calc(100% - 72px); overflow-y: auto; }
}

/* First Journey v1.6: every interactive window is clipped inside the world. */
.auth-screen, .home-screen, .game-screen {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
#app[data-screen="auth"] .home-screen,
#app[data-screen="auth"] .game-screen,
#app[data-screen="home"] .auth-screen,
#app[data-screen="home"] .game-screen,
#app[data-screen="game"] .auth-screen,
#app[data-screen="game"] .home-screen {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
#app[data-screen="auth"] .auth-screen,
#app[data-screen="home"] .home-screen,
#app[data-screen="game"] .game-screen {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
.game-screen { position: absolute; inset: 0; contain: strict; isolation: isolate; overflow: clip; background: #183c32; }
#gameCanvas { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; min-width: 100% !important; min-height: 100% !important; }

/* Local social authentication. */
.auth-screen { isolation: isolate; display: grid; place-items: center; padding: 80px 18px 24px; background: #166248; }
.auth-backdrop { position: absolute; inset: -3%; z-index: -3; background: url('/assets/v2.0/maps/arrival-plaza.webp') 50% 54% / cover no-repeat; filter: saturate(1.08) contrast(1.03); transform: scale(1.03); }
.auth-vignette { position: absolute; inset: 0; z-index: -2; background: radial-gradient(circle at 66% 44%,rgba(6,53,72,.1),rgba(2,25,45,.76) 78%),linear-gradient(90deg,rgba(2,27,47,.76),rgba(2,32,49,.28)); }
.auth-brand { position: absolute; top: max(22px,env(safe-area-inset-top)); left: max(28px,env(safe-area-inset-left)); }
.auth-card { width: min(470px,calc(100vw - 28px)); padding: 28px; border: 1px solid rgba(255,255,255,.9); border-radius: 28px; background: rgba(255,253,248,.96); box-shadow: 0 30px 90px rgba(0,20,36,.5); backdrop-filter: blur(18px); }
.auth-step { display: block; color: var(--blue); font-size: 8px; font-weight: 1000; letter-spacing: 1.4px; }
.auth-card h1 { margin: 5px 0 8px; font-size: clamp(28px,5vw,42px); letter-spacing: -1.4px; }
.auth-card > p { margin: 0 0 19px; color: #58758a; font-size: 11px; line-height: 1.55; }
.auth-providers { display: grid; gap: 9px; }
.auth-provider { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 11px; min-height: 62px; padding: 7px 12px 7px 7px; border: 1px solid #c8dce8; border-bottom-width: 4px; border-radius: 16px; background: white; color: var(--ink); text-align: left; }
.auth-provider > i { display: grid; place-items: center; width: 47px; height: 47px; border-radius: 13px; background: #e7f4fc; color: #0878d3; font-size: 12px; font-style: normal; font-weight: 1000; }
.auth-provider b, .auth-provider small { display: block; }
.auth-provider b { font-size: 10px; }
.auth-provider small { margin-top: 3px; color: #71899a; font-size: 7px; }
.provider-vk { border-bottom-color: #2787f5; }
.provider-vk > i { background: #2787f5; color: white; }
.provider-telegram { border-bottom-color: #2aabee; }
.provider-telegram > i { background: #2aabee; color: white; font-size: 20px; }
.provider-local { border-bottom-color: #72c744; }
.provider-local > i { background: #e9f8df; color: #3f9223; }
.auth-security { display: block; margin-top: 14px; color: #7890a1; font-size: 7px; line-height: 1.45; text-align: center; }
.auth-admin-link { display: block; margin-top: 8px; color: #477087; font-size: 7px; font-weight: 850; text-align: center; }
.account-chip { display: flex; align-items: center; gap: 8px; min-height: 49px; padding: 6px 11px 6px 6px; border: 1px solid rgba(255,255,255,.82); border-radius: 16px; background: rgba(255,253,248,.92); color: var(--ink); box-shadow: 0 8px 25px rgba(0,31,58,.2); text-align: left; backdrop-filter: blur(12px); }
.account-chip > i { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 11px; background: #e4f3fc; color: var(--blue); font-size: 8px; font-style: normal; font-weight: 1000; }
.account-chip b, .account-chip small { display: block; }
.account-chip b { font-size: 8px; }
.account-chip small { color: #7890a2; font-size: 6px; }
.trainer-avatar-preview { position: absolute; inset: 0; background: url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png') 0 0 / 600% 800% no-repeat; }
body[data-skin-preview="female"] .trainer-avatar-preview { background-image: url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png'); }

/* Window contract: visibility changes, world size never does. */
.hud-window { position: absolute !important; box-sizing: border-box; max-width: calc(100% - 16px); max-height: calc(100% - 16px); visibility: hidden; opacity: 0; pointer-events: none; transform: scale(.975) !important; transform-origin: center; transition: opacity .18s,transform .18s !important; }
.hud-window.is-open { visibility: visible; opacity: 1; pointer-events: auto; transform: none !important; }
.side-panel { top: 86px; right: 18px; bottom: 18px; left: auto; width: min(480px,calc(100% - 128px)); }
.editor-panel { top: 86px; right: 18px; bottom: auto; left: auto; width: min(420px,calc(100% - 128px)); max-height: calc(100% - 104px); }

/* Movable, resizable, per-player chat. */
.chat-panel { --chat-opacity:.94; --chat-font-size:11px; z-index: 48; left: 104px; top: 82px; bottom: auto; width: 440px; height: 450px; min-width: 320px; min-height: 260px; display: grid; grid-template-rows: auto auto auto minmax(0,1fr) auto; padding: 14px; overflow: hidden; border-radius: 22px; background: rgba(255,253,248,var(--chat-opacity)); font-size: var(--chat-font-size); backdrop-filter: blur(17px); }
.chat-panel.chat-no-blur { backdrop-filter: none; }
.chat-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 43px; cursor: grab; touch-action: none; user-select: none; }
.chat-panel.is-adjusting .chat-head { cursor: grabbing; }
.chat-head small, .chat-head b { display: block; }
.chat-head small { color: var(--blue); font-size: .63em; font-weight: 1000; letter-spacing: .9px; }
.chat-head b { margin-top: 2px; font-size: 1.3em; }
.chat-head-actions { display: flex; gap: 5px; }
.chat-head-actions button { display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 10px; background: #e8f3f9; color: #3d637d; }
.chat-head-actions .ui-icon { width: 17px; height: 17px; }
.chat-config { display: none; grid-template-columns: 1fr 1fr; gap: 7px 12px; margin: 5px 0 8px; padding: 10px; border: 1px solid #c9dce8; border-radius: 13px; background: rgba(239,248,253,.92); }
.chat-config.is-open { display: grid; }
.chat-config > label { color: #58758a; font-size: .72em; font-weight: 850; }
.chat-config label > span { display: flex; justify-content: space-between; gap: 7px; }
.chat-config input[type="range"] { width: 100%; margin-top: 5px; accent-color: var(--blue); }
.chat-config .chat-check { display: flex; align-items: center; gap: 6px; }
.chat-config .chat-check > span { display: block; }
.chat-config > button { grid-column: 1/-1; min-height: 28px; border: 1px solid #bdd5e3; border-radius: 8px; background: white; color: #41718f; font-size: .65em; font-weight: 1000; }
.chat-tabs { margin: 3px 0 8px; }
.chat-log { min-height: 0; height: auto; overflow: hidden auto; }
.chat-message { font-size: 1em; }
.chat-message b { display: inline; font-size: .82em; }
.chat-message p { font-size: .82em; }
.chat-message time { display: inline; margin-left: 6px; color: #91a4b1; font-size: .72em; font-weight: 700; }
.chat-panel[data-timestamps="hide"] .chat-message time { display: none; }
#chatForm { align-self: end; }
.chat-resize { position: absolute; right: 3px; bottom: 3px; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 0 0 14px 0; background: linear-gradient(135deg,transparent 47%,#7fa6bd 49%,#7fa6bd 57%,transparent 59%,transparent 68%,#7fa6bd 70%,#7fa6bd 78%,transparent 80%); cursor: nwse-resize; touch-action: none; }

/* Compact battle console in the world HUD, never below the canvas. */
.battle-panel { z-index: 46; top: 86px; right: 18px; bottom: auto; left: auto; width: min(410px,calc(100% - 128px)); max-height: calc(100% - 104px); padding: 12px; overflow: hidden auto; border: 1px solid rgba(255,255,255,.9); border-radius: 21px; background: rgba(255,253,248,.96); box-shadow: 0 24px 64px rgba(0,20,42,.45); backdrop-filter: blur(15px); }
.battle-status { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 34px; }
.battle-status small, .battle-status b { display: block; }
.battle-status small { color: var(--blue); font-size: 6px; font-weight: 1000; letter-spacing: .9px; }
.battle-status b { max-width: 220px; margin-top: 2px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.battle-controls { display: flex; gap: 5px; }
.battle-controls button { min-height: 31px; padding: 0 9px; border: 1px solid #c4d9e5; border-radius: 9px; background: #eff7fb; color: #527389; font-size: 6px; font-weight: 1000; }
.battle-controls #cancelBattle { border-color: #efc0bc; background: #fff1f0; color: #b7443d; }
.battle-controls .is-active { border-color: #62c63d; background: #62c63d; color: white; }
.battle-health { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 9px 0; }
.battle-health article { padding: 7px; border: 1px solid #cbdde7; border-radius: 11px; background: #f6fbfd; }
.battle-health article > span { display: flex; justify-content: space-between; gap: 5px; }
.battle-health b { max-width: 105px; overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.battle-health small { color: #6e8799; font-size: 6px; }
.battle-health article > i { display: block; height: 7px; margin-top: 5px; overflow: hidden; border-radius: 5px; background: #d7e4ea; }
.battle-health em { display: block; width: 0; height: 100%; border-radius: inherit; background: #62c637; transition: width .2s; }
.enemy-health em { background: #ef694e; }
.battle-skills { grid-template-columns: repeat(2,1fr); gap: 6px; }
.battle-skills button { grid-template-columns: 35px 1fr; min-height: 47px; padding: 5px; }
.skill-icon { width: 35px; height: 35px; }
.battle-decision { display: none; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 6px; padding: 8px; border: 1px solid #efd070; border-radius: 12px; background: #fff8dc; }
.battle-decision.is-open { display: grid; }
.battle-decision small, .battle-decision b { display: block; }
.battle-decision small { color: #aa7300; font-size: 5px; font-weight: 1000; }
.battle-decision b { margin-top: 2px; font-size: 7px; }
.battle-decision button { min-height: 34px; padding: 0 9px; border: 0; border-radius: 9px; background: #147fd4; color: white; font-size: 6px; font-weight: 1000; }
.battle-decision #beginCapture { background: #e14e43; }
.battle-decision button:disabled { background: #aebdc6; opacity: .72; cursor: default; }
.capture-panel { grid-template-columns: minmax(0,1fr) 67px; min-height: 82px; padding: 7px; }
.capture-balls { max-width: 100%; overflow-x: auto; }
.capture-balls > button { min-width: 104px; }
.capture-throw { width: 62px; height: 62px; }
#battleHint { margin: 7px 2px 0; font-size: 6px; }

/* Dialogue and starter selection are overlays of game-screen, not pages below it. */
.dialogue-layer, .starter-dialog { position: absolute; z-index: 70; inset: 0; width: 100%; height: 100%; display: grid; place-items: end center; padding: 18px 18px 22px 112px; overflow: hidden; visibility: hidden; opacity: 0; pointer-events: none; transition: opacity .18s; }
.dialogue-layer.is-open, .starter-dialog.is-open { visibility: visible; opacity: 1; pointer-events: auto; }
.dialogue-shade, .starter-backdrop { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(2,25,45,.08),rgba(2,25,45,.72)); backdrop-filter: blur(2px); }
.dialogue-card { position: relative; display: grid; grid-template-columns: 92px minmax(0,1fr) auto; align-items: center; gap: 14px; width: min(960px,100%); min-height: 152px; padding: 14px; border: 1px solid rgba(255,255,255,.95); border-radius: 23px; background: rgba(255,253,248,.98); box-shadow: 0 25px 75px rgba(0,18,35,.52); }
.dialogue-portrait { display: grid; place-items: center; width: 92px; height: 116px; overflow: hidden; border-radius: 17px; background: radial-gradient(circle,#dff5ff,#72c9ef); }
.dialogue-portrait > i { width: 78px; height: 106px; background: url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png') 0 0 / 600% 800% no-repeat; }
.dialogue-copy small { color: var(--blue); font-size: 6px; font-weight: 1000; letter-spacing: .9px; }
.dialogue-copy h2 { margin: 3px 0 6px; font-size: 20px; }
.dialogue-copy p { min-height: 43px; margin: 0; color: #496b82; font-size: 11px; line-height: 1.5; }
.dialogue-actions { display: grid; gap: 6px; }
.dialogue-actions button { min-width: 92px; min-height: 40px; border: 1px solid #c6dae6; border-radius: 11px; background: #eef6fa; color: #55768c; font-size: 7px; font-weight: 1000; }
.dialogue-actions #dialogueNext { border: 0; border-bottom: 3px solid #07549e; background: #1189df; color: white; }
.starter-dialog { place-items: center; padding: 18px 18px 18px 112px; }
.starter-card { width: min(980px,100%); max-height: calc(100% - 10px); }

/* Quest-chain cards used by the training zone. */
.quest-chain { display: grid; gap: 9px; }
.quest-card { display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 9px; padding: 10px; border: 1px solid #cadde8; border-radius: 15px; background: white; opacity: .62; }
.quest-card.is-active { border: 2px solid var(--location-accent); background: color-mix(in srgb,var(--location-accent) 7%,white); opacity: 1; }
.quest-card.is-done { border-color: #83ce66; background: #f1fdec; opacity: 1; }
.quest-card > i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; background: #eaf4f9; color: #54778e; font-size: 11px; font-style: normal; font-weight: 1000; }
.quest-card.is-done > i { background: #68c94a; color: white; }
.quest-card b, .quest-card small, .quest-card em { display: block; }
.quest-card b { font-size: 10px; }
.quest-card small { margin-top: 3px; color: #5e7b90; font-size: 8px; line-height: 1.4; }
.quest-card em { margin-top: 6px; color: var(--location-accent); font-size: 7px; font-style: normal; font-weight: 1000; }

@media (max-width: 800px) {
  .auth-screen { padding: 70px 7px 7px; }
  .auth-brand { top: max(10px,env(safe-area-inset-top)); left: max(12px,env(safe-area-inset-left)); }
  .auth-card { max-height: calc(100% - 72px); padding: 18px 14px; overflow: auto; border-radius: 22px; }
  .home-topbar { top: max(8px,env(safe-area-inset-top)); }
  .account-chip span { display: none; }
  .hud-window { max-width: none; max-height: none; }
  .side-panel, .editor-panel, .chat-panel, .battle-panel {
    inset: max(61px,calc(env(safe-area-inset-top) + 55px)) max(7px,env(safe-area-inset-right)) calc(79px + env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left));
    width: auto;
    height: auto;
    min-width: 0;
    min-height: 0;
    max-width: none;
    max-height: none;
    border-radius: 21px;
  }
  .chat-panel { display: grid; padding: 10px 12px 13px; }
  .chat-head { cursor: default; }
  .chat-head small { font-size: 5px; }
  .chat-config { grid-template-columns: 1fr; max-height: 44%; overflow-y: auto; }
  .chat-config > button { grid-column: 1; }
  .chat-resize { display: none; }
  .battle-panel { left: auto; width: min(390px,calc(100% - 14px)); overflow-y: auto; }
  .battle-decision { grid-template-columns: 1fr 1fr; }
  .battle-decision > span { grid-column: 1/-1; }
  .dialogue-layer, .starter-dialog { padding: 7px 7px calc(79px + env(safe-area-inset-bottom)); }
  .dialogue-card { grid-template-columns: 67px minmax(0,1fr); gap: 9px; width: 100%; min-height: 132px; padding: 9px; border-radius: 19px; }
  .dialogue-portrait { width: 67px; height: 88px; }
  .dialogue-portrait > i { width: 60px; height: 82px; }
  .dialogue-copy h2 { font-size: 16px; }
  .dialogue-copy p { font-size: 9px; }
  .dialogue-actions { grid-column: 1/-1; grid-template-columns: 1fr 1fr; }
  .dialogue-actions button { min-height: 36px; }
  .starter-card { width: 100%; max-height: 100%; }
}

@media (min-width: 801px) and (max-height: 650px) and (pointer: fine) {
  .auth-card { max-height: calc(100% - 72px); padding: 16px; overflow-y: auto; }
  .auth-provider { min-height: 49px; }
  .auth-provider > i { width: 39px; height: 39px; }
  .side-panel, .editor-panel, .chat-panel, .battle-panel { top: 58px; bottom: 8px; max-height: calc(100% - 66px); }
  .chat-panel { left: 124px; bottom: 8px; height: auto; }
  .battle-panel { right: 8px; left: auto; width: min(390px,calc(100% - 140px)); }
  .dialogue-layer { padding: 8px 8px 8px 124px; }
  .dialogue-card { min-height: 125px; }
  .starter-dialog { padding: 8px 8px 8px 124px; }
}

@media (max-height: 540px) {
  .battle-health { display: none; }
  .battle-panel { overflow-y: auto; }
  .dialogue-card { min-height: 110px; }
  .dialogue-portrait { height: 80px; }
}

/* Living Guides v1.7 — one modern white UI system on desktop and mobile. */
:root {
  --panel-bg: rgba(255,255,255,.975);
  --panel-border: #c9e0ee;
  --panel-shadow: 0 24px 68px rgba(5,31,54,.34);
  --panel-radius: 24px;
  --text-main: #143b5d;
  --text-muted: #55758b;
  font-family: "Segoe UI Variable", "Segoe UI", Inter, ui-rounded, system-ui, sans-serif;
  font-size: 16px;
}
button, input, select, textarea { font-family: inherit; }
.art-icon, .panel-art-icon, .quest-art-icon { display: block; object-fit: contain; user-select: none; pointer-events: none; }
.auth-step { font-size: 10px; }
.auth-card > p { font-size: 14px; }
.auth-provider b { font-size: 14px; }
.auth-provider small { font-size: 11px; }
.auth-security, .auth-admin-link { font-size: 10px; }
.hero-card-head small { font-size: 10px; }
.hero-card-head em { font-size: 12px; }
.hero-card > p { font-size: 14px; }
.name-field { font-size: 12px; }
.name-field input { font-size: 15px; }
.skin-picker button { font-size: 11px; }
.player-chip b { font-size: 13px; }
.player-chip small { font-size: 10px; }
.world-location small { font-size: 9px; }
.world-location b { font-size: 15px; }
.instance-chip b { font-size: 12px; }
.instance-chip small { font-size: 9px; }
.world-rail { width: 84px; padding: 8px; gap: 4px; border: 1px solid rgba(207,224,235,.96); border-radius: 24px; background: rgba(255,255,255,.965); box-shadow: 0 20px 48px rgba(0,31,54,.22); backdrop-filter: blur(18px) saturate(1.08); }
.world-rail button { min-height: 59px; gap: 1px; border: 1px solid transparent; border-radius: 17px; color:#315d7d; }
.world-rail button span { display: grid; place-items: center; width: 38px; height: 38px; }
.world-rail button .art-icon { width: 38px; height: 38px; filter: drop-shadow(0 3px 5px rgba(0,24,45,.25)); }
.world-rail button b { color:#315d7d; font-size: 8px; font-weight: 900; letter-spacing: .1px; }
.world-rail button:hover { background:#f0f8fd; border-color:#cfe4f1; color:#0878ca; }
.world-rail button:hover b, .world-rail button.is-active b { color:#0878ca; }
.world-rail button.is-active { background:#e7f5fd; border-color:#bcdff2; box-shadow: inset 0 0 0 1px rgba(11,143,224,.05); }
.mobile-dock .art-icon, .round-quick .art-icon { width: 32px; height: 32px; filter: drop-shadow(0 3px 4px rgba(0,27,50,.2)); }
.round-quick .art-icon { width: 38px; height: 38px; }

.hud-window, .side-panel, .editor-panel, .chat-panel, .battle-panel {
  border: 1px solid var(--panel-border);
  border-radius: var(--panel-radius);
  background: var(--panel-bg);
  color: var(--text-main);
  box-shadow: var(--panel-shadow);
  backdrop-filter: blur(18px) saturate(1.08);
}
.side-panel { padding: 27px; }
.panel-eyebrow { font-size: 10px; letter-spacing: 1.2px; }
.panel-title { margin-top: 5px; font-size: clamp(27px,2.4vw,34px); line-height: 1.08; }
.panel-lead { color: var(--text-muted); font-size: 13px; line-height: 1.55; }
.panel-close { width: 40px; height: 40px; border: 1px solid #d3e5ef; border-radius: 13px; background: #f1f8fc; }
.region-card > p, .region-drops small, .creature-card small, .team-card small, .inventory-card small, .center-card small { font-size: 11px; }
.region-drops b, .creature-card b, .team-card b, .inventory-card b, .center-card b { font-size: 13px; }

.chat-panel { --chat-font-size:14px; padding: 16px; border-radius: var(--panel-radius); background: rgba(255,255,255,var(--chat-opacity)); }
.chat-head small { font-size: .7em; }
.chat-head b { font-size: 1.42em; color: var(--text-main); }
.chat-head-actions button { width: 38px; height: 38px; border: 1px solid #d5e5ee; border-radius: 12px; background: #f2f8fb; }
.chat-tabs button { min-height: 38px; font-size: .78em; }
.chat-message b { font-size: .92em; }
.chat-message p { margin-top: 4px; color: #46677d; font-size: .92em; line-height: 1.45; }
.chat-message time { font-size: .74em; }
#chatForm input { min-height: 44px; font-size: .92em; }

.battle-panel { padding: 15px; }
.battle-status small { font-size: 8px; }
.battle-status b { max-width: 245px; font-size: 14px; }
.battle-controls button { min-height: 36px; padding: 0 12px; font-size: 8px; }
.battle-health article { padding: 9px; }
.battle-health b { max-width: 140px; font-size: 10px; }
.battle-health small { font-size: 9px; }
.battle-skills button { min-height: 56px; }
.battle-skills button b { font-size: 10px; }
.battle-skills button small, .battle-skills button em { font-size: 7px; }
.battle-decision small { font-size: 7px; }
.battle-decision b { font-size: 10px; line-height: 1.35; }
.battle-decision button { min-height: 38px; font-size: 8px; }
#battleHint { font-size: 9px; line-height: 1.4; }

.dialogue-layer { padding: 18px 22px 25px 118px; }
.dialogue-shade { background: linear-gradient(180deg,rgba(4,26,44,.12),rgba(4,24,42,.7)); backdrop-filter: blur(2px) saturate(.9); }
.dialogue-card {
  grid-template-columns: 158px minmax(0,1fr) 112px;
  grid-template-rows: minmax(168px,auto) auto;
  align-items: stretch;
  gap: 0 20px;
  width: min(1120px,100%);
  min-height: 224px;
  padding: 16px 18px 14px;
  border: 1px solid rgba(255,255,255,.98);
  border-top: 4px solid #1596e8;
  border-radius: 27px;
  background: rgba(255,255,255,.985);
  box-shadow: 0 28px 86px rgba(0,18,34,.5);
}
.dialogue-portrait { position: relative; grid-row: 1 / 3; width: 158px; height: 198px; align-self: end; overflow: hidden; border: 1px solid #cbe4f2; border-radius: 21px; background: linear-gradient(160deg,#e8f7ff,#d7edfb); }
.dialogue-portrait > i { width: 100%; height: 100%; background-repeat: no-repeat; }
.dialogue-portrait > span { position: absolute; left: 8px; right: 8px; bottom: 8px; padding: 6px 5px; border-radius: 9px; background: rgba(9,70,108,.84); color: white; font-size: 8px; font-weight: 900; letter-spacing: .6px; text-align: center; backdrop-filter: blur(6px); }
.dialogue-copy { min-width: 0; padding: 7px 0 4px; }
.dialogue-copy > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.dialogue-copy > header > span { min-width: 0; }
.dialogue-copy small { font-size: 9px; letter-spacing: 1px; }
.dialogue-copy h2 { margin: 4px 0 13px; color: #0a78ca; font-size: clamp(22px,2.3vw,30px); line-height: 1; }
.dialogue-copy p { min-height: 78px; margin: 0; color: #254d69; font-size: clamp(16px,1.45vw,19px); font-weight: 560; line-height: 1.52; }
.dialogue-hint { display: block; margin-top: 12px; color: #7893a5 !important; font-size: 10px !important; font-weight: 700 !important; letter-spacing: 0 !important; }
#dialogueSound { display: flex; align-items: center; gap: 5px; min-height: 34px; padding: 0 9px; border: 1px solid #cce0ec; border-radius: 11px; background: #f2f8fc; color: #36718f; }
#dialogueSound i, #dialogueSound .ui-icon { width: 15px; height: 15px; }
#dialogueSound b { font-size: 8px; }
#dialogueSound.is-muted { opacity: .48; }
.dialogue-listener { display: flex; align-items: end; justify-content: center; overflow: hidden; opacity: .42; pointer-events: none; }
.dialogue-listener > i { width: 100px; height: 150px; background-repeat: no-repeat; background-size: 600% 800%; background-position: 0 0; filter: saturate(.78); }
.dialogue-actions { grid-column: 2 / 4; grid-row: 2; display: flex; justify-content: flex-end; align-items: end; gap: 8px; padding-top: 8px; }
.dialogue-actions button { min-width: 118px; min-height: 43px; padding: 0 14px; border-radius: 12px; font-size: 9px; }
.dialogue-actions #dialogueNext { min-width: 168px; border-bottom-width: 3px; background: linear-gradient(180deg,#1aa2f1,#0875cb); }

.journey-transition { position: absolute; z-index: 82; inset: 0; display: grid; grid-template-columns: minmax(230px,38vw) minmax(280px,460px); place-content: center; align-items: center; gap: clamp(16px,5vw,74px); padding: 24px; overflow: hidden; visibility: hidden; opacity: 0; pointer-events: none; transition: opacity .25s; }
.journey-transition.is-open { visibility: visible; opacity: 1; pointer-events: auto; }
.journey-transition-shade { position: absolute; inset: 0; z-index: -2; background: radial-gradient(circle at 38% 54%,rgba(234,65,75,.34),rgba(4,25,49,.94) 68%); backdrop-filter: blur(7px); }
.journey-portal { width: min(30vw,300px); aspect-ratio: 1; justify-self: end; border-radius: 50%; background: url('/assets/v2.9.11/items/poke-ball.png') center / contain no-repeat; filter: drop-shadow(0 18px 26px rgba(0,16,34,.48)); animation: pokeballRouteFloat 1.05s ease-in-out infinite alternate; }
.journey-copy { color: white; text-shadow: 0 3px 14px rgba(0,18,36,.65); }
.journey-copy small { color: #78e8ff; font-size: 11px; font-weight: 950; letter-spacing: 1.8px; }
.journey-copy h2 { max-width: 430px; margin: 8px 0 12px; font-size: clamp(32px,4.6vw,58px); line-height: .98; letter-spacing: -1.8px; }
.journey-copy p { max-width: 400px; margin: 0; color: #dff7ff; font-size: 15px; line-height: 1.55; }
.journey-copy > i { display: block; width: 86px; height: 4px; margin-top: 22px; overflow: hidden; border-radius: 3px; background: rgba(255,255,255,.24); }
.journey-copy > i::after { content: ""; display: block; width: 34px; height: 100%; border-radius: inherit; background: #70e4ff; animation: journeyProgress 1s linear infinite; }
@keyframes pokeballRouteFloat { to { transform: translateY(-10px) rotate(8deg) scale(1.025); } }
@keyframes journeyProgress { from { transform: translateX(-38px); } to { transform: translateX(90px); } }

.quest-prologue { display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 10px; margin: 0 0 10px; padding: 11px; border: 1px solid #d2e2eb; border-radius: 16px; background: #f5fafd; }
.quest-prologue.is-done { border-color: #8bd36d; background: #f2fceb; }
.quest-prologue > i { display: grid; place-items: center; width: 38px; height: 38px; font-style: normal; }
.quest-prologue .quest-art-icon { width: 38px; height: 38px; }
.quest-prologue b { display: block; font-size: 12px; }
.quest-prologue small { display: block; margin-top: 3px; color: #5b788c; font-size: 10px; line-height: 1.4; }
.professor-quest-chain .quest-card { grid-template-columns: 48px minmax(0,1fr); padding: 13px; }
.professor-quest-chain .quest-card > i { width: 44px; height: 44px; background: #eef7fc; }
.professor-quest-chain .quest-card > i .quest-art-icon { width: 44px; height: 44px; }
.professor-quest-chain .quest-card b { font-size: 13px; }
.professor-quest-chain .quest-card small { font-size: 10px; line-height: 1.5; }
.professor-quest-chain .quest-card strong { display: block; margin-top: 8px; color: #0878ca; font-size: 9px; letter-spacing: .4px; }
.quest-subtasks { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.quest-subtasks em { margin: 0; padding: 5px 7px; border-radius: 8px; background: #eef4f7; color: #6a8292; font-size: 9px; }
.quest-subtasks em.is-done { background: #e1f7d8; color: #3c8b28; }
.panel-art-icon { width: 44px; height: 44px; }

@media (max-width: 800px) {
  :root { font-size: 16px; }
  .world-rail { display: none; }
  .mobile-dock { border-color: var(--panel-border); background: rgba(255,255,255,.97); box-shadow: 0 -12px 35px rgba(4,31,54,.22); }
  .mobile-dock button { color: #52728a; }
  .mobile-dock button.is-active { color: #0879d1; }
  .mobile-dock b { font-size: 8px; }
  .mobile-dock .art-icon { width: 31px; height: 31px; }
  .side-panel, .editor-panel, .chat-panel, .battle-panel { border-radius: 22px; background: rgba(255,255,255,.985); }
  .side-panel { padding: 20px 17px; }
  .panel-eyebrow { font-size: 9px; }
  .panel-lead { font-size: 13px; }
  .chat-panel { --chat-font-size:14px; padding: 13px; }
  .auth-card > p { font-size: 13px; }
  .auth-provider b { font-size: 13px; }
  .auth-provider small { font-size: 10px; }
  .hero-card-head small { font-size: 9px; }
  .name-field { font-size: 11px; }
  .skin-picker button { font-size: 10px; }
  .player-chip b { max-width: 44vw; font-size: 11px; }
  .player-chip small { font-size: 8px; }
  .instance-chip b { font-size: 9px; }
  .instance-chip small { max-width: 125px; font-size: 8px; }
  .battle-panel { width: min(430px,calc(100% - 14px)); padding: 13px; }
  .dialogue-layer { padding: 7px 7px calc(82px + env(safe-area-inset-bottom)); }
  .dialogue-card { grid-template-columns: 92px minmax(0,1fr); grid-template-rows: minmax(142px,auto) auto; gap: 0 11px; width: 100%; min-height: 205px; max-height: calc(100dvh - 96px - env(safe-area-inset-bottom)); padding: 10px 11px; overflow: auto; border-radius: 22px; }
  .dialogue-portrait { grid-row: 1; width: 92px; height: 132px; align-self: start; border-radius: 16px; }
  .dialogue-portrait > span { left: 4px; right: 4px; bottom: 4px; padding: 4px 2px; font-size: 6px; }
  .dialogue-copy { padding-top: 3px; }
  .dialogue-copy h2 { margin-bottom: 8px; font-size: 21px; }
  .dialogue-copy p { min-height: 60px; font-size: 14px; line-height: 1.48; }
  .dialogue-copy small { font-size: 7px; }
  .dialogue-hint { margin-top: 7px; font-size: 8px !important; }
  #dialogueSound b { display: none; }
  #dialogueSound { min-width: 32px; padding: 0 8px; }
  .dialogue-listener { display: none; }
  .dialogue-actions { grid-column: 1 / 3; grid-row: 2; display: grid; grid-template-columns: .7fr 1.3fr; gap: 7px; padding-top: 8px; }
  .dialogue-actions button, .dialogue-actions #dialogueNext { min-width: 0; min-height: 40px; }
  .journey-transition { grid-template-columns: 1fr; grid-template-rows: minmax(210px,48vh) auto; gap: 2px; place-content: center; padding: 14px 18px calc(78px + env(safe-area-inset-bottom)); text-align: center; }
  .journey-portal { width: min(58vw,260px); align-self: end; justify-self: center; }
  .journey-copy h2 { margin-inline: auto; font-size: clamp(30px,10vw,45px); }
  .journey-copy p { margin-inline: auto; font-size: 13px; }
  .journey-copy > i { margin: 17px auto 0; }
}

@media (max-height: 560px) and (orientation: landscape) {
  .dialogue-card { grid-template-columns: 112px minmax(0,1fr) 78px; grid-template-rows: minmax(112px,auto) auto; min-height: 150px; }
  .dialogue-portrait { width: 112px; height: 134px; }
  .dialogue-copy p { min-height: 42px; font-size: 14px; }
  .dialogue-listener > i { width: 70px; height: 105px; }
  .dialogue-actions { grid-column: 2 / 4; }
}

/* v2.0.3 · server-owned personal airship transit */
.airship-transition { position:absolute; z-index:96; inset:0; overflow:hidden; visibility:hidden; opacity:0; pointer-events:none; background:#80ccf4; transition:opacity .35s ease; }
.airship-transition.is-open { visibility:visible; opacity:1; pointer-events:auto; }
.airship-sky { position:absolute; inset:-3%; background:url('/assets/v2.1/transit/airship-sky.png') center/cover no-repeat; transform:scale(1.06); animation:airshipSkyDrift 15s linear both; }
.airship-sky::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(44,135,198,.08) 56%,rgba(5,43,78,.2)); }
.airship-cloud { position:absolute; width:38vw; min-width:330px; aspect-ratio:2.8; border-radius:50%; opacity:.34; filter:blur(18px); background:radial-gradient(ellipse at center,rgba(255,255,255,.94),rgba(255,255,255,0) 70%); pointer-events:none; }
.airship-cloud.cloud-a { left:-15%; bottom:2%; animation:airshipCloudA 13s linear infinite; }
.airship-cloud.cloud-b { right:-18%; top:11%; transform:scale(.72); animation:airshipCloudB 11s linear infinite; }
.airship-flight-hud { position:absolute; z-index:5; top:clamp(14px,2.4vw,32px); left:clamp(14px,2.4vw,32px); right:clamp(14px,2.4vw,32px); display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 15px; border:1px solid rgba(255,255,255,.75); border-radius:18px; background:rgba(255,255,255,.82); box-shadow:0 13px 35px rgba(11,75,121,.22); backdrop-filter:blur(13px); color:#174d70; }
.airship-flight-hud span { display:grid; gap:2px; }
.airship-flight-hud small { color:#3b9bcf; font-size:9px; font-weight:1000; letter-spacing:1.35px; }
.airship-flight-hud b { font-size:15px; line-height:1.15; }
.airship-flight-clock { display:grid !important; justify-items:end; gap:1px !important; min-width:96px; }
.airship-flight-clock small { color:#5d8da9; font-size:7px; letter-spacing:.8px; }
.airship-flight-hud strong { min-width:82px; color:#0a6fae; font-size:28px; font-variant-numeric:tabular-nums; letter-spacing:-1px; text-align:right; }
.airship-flight-vehicle { position:absolute; z-index:3; left:50%; top:48%; width:min(58vw,820px); max-height:76vh; object-fit:contain; filter:drop-shadow(0 28px 30px rgba(17,64,97,.28)); transform-origin:center; will-change:transform,opacity,filter; opacity:0; }
.airship-transition.is-open .airship-flight-vehicle { animation:airshipApproach 14.45s cubic-bezier(.22,.7,.22,1) both; animation-delay:var(--airship-offset,0ms); }
.airship-kanto-mark { position:absolute; z-index:4; left:50%; top:50%; width:min(54vw,690px); transform:translate(-50%,-50%) scale(.66); opacity:0; filter:drop-shadow(0 16px 22px rgba(36,80,124,.26)); transition:opacity .5s ease,transform .7s cubic-bezier(.2,.8,.2,1); }
.airship-transition.phase-kanto .airship-kanto-mark,
.airship-transition.phase-arrival .airship-kanto-mark { opacity:1; transform:translate(-50%,-50%) scale(1); }
.airship-transition.phase-arrival .airship-flight-vehicle { opacity:0 !important; transition:opacity .42s; }
.airship-arrival-copy { position:absolute; z-index:5; left:50%; bottom:clamp(70px,10vh,110px); display:grid; justify-items:center; gap:4px; width:min(90%,560px); padding:12px 18px; border-radius:17px; background:rgba(255,255,255,.82); box-shadow:0 12px 34px rgba(20,71,109,.18); backdrop-filter:blur(11px); color:#234f6b; text-align:center; opacity:0; transform:translate(-50%,16px); transition:.45s ease; }
.airship-transition.phase-kanto .airship-arrival-copy,
.airship-transition.phase-arrival .airship-arrival-copy { opacity:1; transform:translate(-50%,0); }
.airship-arrival-copy span { color:#3c9bd0; font-size:8px; font-weight:1000; letter-spacing:1.4px; }
.airship-arrival-copy b { font-size:19px; }
.airship-arrival-copy small { color:#6f8b9e; font-size:10px; }
.airship-flight-progress { position:absolute; z-index:6; left:clamp(18px,3vw,45px); right:clamp(18px,3vw,45px); bottom:clamp(18px,3vw,36px); height:5px; overflow:hidden; border:1px solid rgba(255,255,255,.7); border-radius:10px; background:rgba(23,92,132,.24); box-shadow:0 4px 15px rgba(13,68,103,.15); }
.airship-flight-progress i { display:block; width:100%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#fff2a5,#ffc83d,#ff9e2a); transform-origin:left; transform:scaleX(var(--airship-progress,0)); transition:transform .12s linear; }
.airship-transition.phase-arrival::after { content:""; position:absolute; z-index:10; inset:0; pointer-events:none; background:white; opacity:0; animation:airshipArrivalFlash 1.3s ease-in-out infinite alternate; }
@keyframes airshipSkyDrift { from { transform:scale(1.08) translate3d(-1.2%,0,0); } to { transform:scale(1.13) translate3d(1.5%,-1%,0); } }
@keyframes airshipCloudA { from { transform:translateX(-10%); } to { transform:translateX(250%); } }
@keyframes airshipCloudB { from { transform:translateX(15%) scale(.72); } to { transform:translateX(-260%) scale(.72); } }
@keyframes airshipApproach {
  0% { opacity:0; transform:translate(-50%,-48%) translate3d(240px,-140px,0) scale(.16) rotate(-2deg); filter:blur(1.3px) drop-shadow(0 10px 16px rgba(17,64,97,.14)); }
  7% { opacity:1; }
  26% { opacity:1; transform:translate(-50%,-48%) translate3d(105px,-72px,0) scale(.36) rotate(1deg); filter:blur(.5px) drop-shadow(0 16px 22px rgba(17,64,97,.2)); }
  55% { opacity:1; transform:translate(-50%,-48%) translate3d(-20px,-12px,0) scale(.72) rotate(-.6deg); filter:blur(0) drop-shadow(0 23px 29px rgba(17,64,97,.25)); }
  78% { opacity:1; transform:translate(-50%,-48%) translate3d(0,15px,0) scale(1.02) rotate(.3deg); }
  91% { opacity:1; transform:translate(-50%,-48%) translate3d(-22px,24px,0) scale(1.13) rotate(-.2deg); }
  96% { opacity:1; transform:translate(-50%,-48%) translate3d(-52px,30px,0) scale(1.22) rotate(-.5deg); }
  100% { opacity:.15; transform:translate(-50%,-48%) translate3d(-120px,54px,0) scale(1.42) rotate(-1.5deg); filter:blur(1.6px) drop-shadow(0 32px 42px rgba(17,64,97,.3)); }
}

.airship-world-loader { position:absolute; z-index:7; left:50%; top:68%; display:flex; align-items:center; gap:11px; min-width:min(88vw,330px); padding:10px 14px; transform:translate(-50%,18px); border:1px solid rgba(255,255,255,.78); border-radius:16px; background:rgba(255,255,255,.9); color:#234f6b; box-shadow:0 14px 34px rgba(20,71,109,.2); opacity:0; transition:.35s ease; }
.airship-transition.phase-arrival .airship-world-loader { opacity:1; transform:translate(-50%,0); }
.airship-world-loader > i { width:27px; height:27px; border:3px solid #c8e7f7; border-top-color:#1599df; border-radius:50%; animation:airshipLoaderSpin .75s linear infinite; }
.airship-world-loader span { display:grid; gap:2px; }
.airship-world-loader b { font-size:10px; }
.airship-world-loader small { color:#6d899c; font-size:8px; }
@keyframes airshipLoaderSpin { to { transform:rotate(360deg); } }
@keyframes airshipArrivalFlash { from { opacity:0; } to { opacity:.2; } }

.audio-settings { display:grid; gap:10px; margin:12px 0; padding:12px; border:1px solid #d3e2ea; border-radius:16px; background:#f7fbfd; }
.audio-setting-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(110px,42%); align-items:center; gap:12px; }
.audio-setting-row span { display:grid; gap:2px; }
.audio-setting-row b { color:#214d69; font-size:11px; }
.audio-setting-row small { color:#7991a1; font-size:8px; line-height:1.35; }
.audio-setting-control { display:grid; grid-template-columns:1fr 38px; align-items:center; gap:8px; }
.audio-setting-control input[type="range"] { width:100%; accent-color:#1497df; }
.audio-setting-control output { min-width:36px; color:#197bad; font-size:9px; font-weight:1000; text-align:right; font-variant-numeric:tabular-nums; }
.region-card .instance-badge { display:inline-flex; width:max-content; margin:8px 0 0; padding:4px 7px; border-radius:999px; background:#e8f7ff; color:#0b7cb7; font-size:8px; font-weight:1000; letter-spacing:.45px; }
.region-card .instance-badge.is-private { background:#fff1ca; color:#a96d00; }

@media (max-width:800px) {
  .airship-flight-hud { top:10px; left:10px; right:10px; padding:10px 12px; border-radius:15px; }
  .airship-flight-hud small { font-size:7px; }
  .airship-flight-hud b { font-size:12px; }
  .airship-flight-hud strong { min-width:62px; font-size:22px; }
  .airship-flight-vehicle { width:min(104vw,760px); }
  .airship-kanto-mark { width:min(86vw,560px); }
  .airship-arrival-copy { bottom:58px; width:calc(100% - 24px); padding:10px 12px; }
  .airship-arrival-copy b { font-size:16px; }
  .audio-setting-row { grid-template-columns:1fr; gap:7px; }
}

@media (min-width:801px) and (pointer:fine) {
  .quick-hint { border:1px solid rgba(205,224,235,.96); background:rgba(255,255,255,.93); color:#315d7d; box-shadow:0 9px 25px rgba(0,31,54,.16); }
  .loot-feed { border-color:#d3e3ec; background:rgba(255,255,255,.94); color:#214c68; box-shadow:0 12px 30px rgba(0,31,54,.18); }
  .loot-feed.is-active { border-color:#f0ca48; background:rgba(255,255,255,.98); }
  .loot-feed small { color:#6d8799; }
}


/* v2.0.5 — inventory categories + Oak research questline */
.bag-tabs { display:flex; flex-wrap:wrap; gap:7px; margin:12px 0 14px; }
.bag-tabs button { display:inline-flex; align-items:center; gap:6px; min-height:31px; padding:7px 10px; border:1px solid #d3e3ec; border-radius:999px; background:#f7fbfd; color:#45677d; font:800 9px/1 system-ui,sans-serif; cursor:pointer; transition:.16s ease; }
.bag-tabs button small { display:grid; place-items:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:#e8f3f8; color:#5a7f96; font-size:8px; }
.bag-tabs button:hover { transform:translateY(-1px); border-color:#9fd4ec; background:#fff; }
.bag-tabs button.is-active { border-color:#37b88a; background:#ecfbf5; color:#16845f; box-shadow:0 5px 14px rgba(37,166,120,.11); }
.bag-tabs button.is-active small { background:#d6f4e8; color:#147554; }
.bag-empty { display:grid; place-items:center; min-height:150px; margin-top:10px; padding:24px; border:1px dashed #cbdde7; border-radius:17px; background:#f9fcfd; color:#718b9b; font-size:10px; text-align:center; }
.inventory-item-icon { width:42px; height:42px; flex:0 0 auto; border-radius:12px; background:#eef7fb; filter:drop-shadow(0 4px 6px rgba(25,78,109,.08)); }
.quest-section-title { margin:15px 0 8px; color:#2a607c; font-size:10px; font-weight:1000; letter-spacing:.7px; text-transform:uppercase; }
.quest-section-title:first-of-type { margin-top:8px; }
.oak-research-chain { border-top:1px solid #e1edf3; padding-top:10px; }
@media (max-width:800px) {
  .bag-tabs { gap:6px; margin:9px 0 12px; }
  .bag-tabs button { min-height:34px; padding:8px 10px; font-size:8px; }
}

/* v2.6.1 — unique Pokémon detail + Oak research board */
.pokemon-detail-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.pokemon-detail-head>span{font-size:11px;font-weight:900;letter-spacing:.08em;color:#0a78c8;background:#eaf6ff;border:1px solid #cbe7fb;border-radius:999px;padding:7px 10px}.pokemon-back{border:0;background:transparent;color:#486b84;font-weight:900;cursor:pointer;padding:6px 0}.pokemon-detail-hero{display:grid;grid-template-columns:118px 1fr;gap:16px;align-items:center;padding:16px;border:1px solid #dce8ef;border-radius:20px;background:linear-gradient(145deg,#fff,#f4f9fc);box-shadow:0 12px 35px rgba(20,73,102,.08)}.pokemon-detail-portrait{width:112px;height:112px;border-radius:18px;background:radial-gradient(circle,#faffef 0,#e4f4d0 55%,#d4e8c1 100%);display:grid;place-items:center;overflow:hidden}.pokemon-detail-portrait img{width:100%;height:100%;object-fit:contain}.pokemon-detail-hero small{display:block;color:#648096;font-weight:800;font-size:10px;letter-spacing:.05em}.pokemon-detail-hero h2{margin:3px 0 4px;font-size:25px;color:#153d5b}.pokemon-detail-hero p{margin:0;color:#4d6c82;font-size:12px;font-weight:700}.pokemon-detail-hero em{display:block;margin-top:6px;color:#6d8799;font-size:10px;font-style:normal}.pokemon-exp-track{height:8px;margin-top:12px;border-radius:999px;background:#dce9f2;overflow:hidden}.pokemon-exp-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#55a8ff,#77d3ff)}.pokemon-trait-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:12px 0}.pokemon-trait-grid article{padding:12px;border:1px solid #dce8ef;border-radius:15px;background:#fff}.pokemon-trait-grid small{display:block;font-size:8px;font-weight:900;letter-spacing:.08em;color:#7892a4}.pokemon-trait-grid b{display:block;margin-top:3px;color:#163f5d;font-size:14px}.pokemon-trait-grid span{display:block;margin-top:4px;color:#72899a;font-size:9px;line-height:1.35}.pokemon-detail-section{margin-top:11px;padding:14px;border:1px solid #dce8ef;border-radius:17px;background:#fff}.pokemon-section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}.pokemon-section-title small{display:block;color:#7892a4;font-size:8px;font-weight:900;letter-spacing:.08em}.pokemon-section-title b{display:block;color:#173e5c;font-size:14px}.pokemon-section-title strong{display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:#eaf6ff;color:#0877c7;font-size:15px}.pokemon-gene-list{display:grid;gap:8px}.pokemon-gene-row{display:grid;grid-template-columns:76px 1fr 48px;align-items:center;gap:9px;color:#46667d;font-size:10px;font-weight:800}.pokemon-gene-row>div{height:7px;border-radius:999px;background:#e2ebf1;overflow:hidden}.pokemon-gene-row>div i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#66c44a,#37a9da)}.pokemon-gene-row b{text-align:right;color:#183e5a}.pokemon-gene-row b small{font-size:8px;color:#88a0b0}.pokemon-move-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.pokemon-move-card{padding:10px;border-radius:12px;background:#f3f8fb;border:1px solid #e1ebf1}.pokemon-move-card b{display:block;color:#173e5c;font-size:11px}.pokemon-move-card span{display:block;margin-top:3px;color:#6b8496;font-size:9px}.pokemon-evolution-box{display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(135deg,#f9f4ff,#eef7ff)}.pokemon-evolution-box>div{display:grid;gap:3px}.pokemon-evolution-box small{color:#7d6aa9;font-size:8px;font-weight:900;letter-spacing:.08em}.pokemon-evolution-box b{color:#2d3f63;font-size:13px}.pokemon-evolution-box span{color:#687c94;font-size:9px}.pokemon-evolution-box button{border:0;border-radius:12px;padding:10px 12px;background:#6f42db;color:#fff;font-size:9px;font-weight:900;cursor:pointer}.pokemon-evolution-box button:disabled{background:#d6d9e3;color:#7d8695;cursor:not-allowed}.pokemon-detail-actions{margin-top:12px}.oak-board-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}.oak-board-summary article{padding:11px;border:1px solid #dce8ef;border-radius:14px;background:#f8fbfd;text-align:center}.oak-board-summary small{display:block;font-size:8px;font-weight:900;color:#7892a4;letter-spacing:.08em}.oak-board-summary b{display:block;margin-top:2px;color:#173e5c;font-size:18px}.oak-program-list{display:grid;gap:11px}.oak-program-card{padding:14px;border:1px solid #dce8ef;border-radius:18px;background:#fff;box-shadow:0 8px 24px rgba(24,75,104,.05)}.oak-program-card.is-ready{border-color:#8dcc69;box-shadow:0 8px 26px rgba(80,158,61,.12)}.oak-program-card.is-complete{background:#f7fbf5}.oak-program-top{display:grid;grid-template-columns:48px 1fr;gap:11px;align-items:start}.oak-program-icon{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:#f1f7fb;border:1px solid #dce8ef}.oak-program-item,.oak-reward-icon{width:28px;height:28px;display:inline-grid;place-items:center}.oak-program-top small{display:block;color:#7892a4;font-size:8px;font-weight:900;letter-spacing:.08em}.oak-program-top b{display:block;margin-top:2px;color:#173e5c;font-size:13px}.oak-program-top p{margin:4px 0 0;color:#6b8395;font-size:9px;line-height:1.4}.oak-progress-label{display:flex;justify-content:space-between;margin-top:12px;color:#617b8e;font-size:9px;font-weight:800}.oak-progress-track{height:8px;border-radius:999px;background:#e2ebf1;overflow:hidden;margin-top:5px}.oak-progress-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4da9f3,#6ed05a)}.oak-rewards{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:11px 0}.oak-rewards>small{width:100%;font-size:8px;font-weight:900;letter-spacing:.08em;color:#8399a9}.oak-reward-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 7px;border-radius:9px;background:#f4f8fb;color:#48677d;font-size:8px;font-weight:800}.oak-program-card>button{width:100%;border:0;border-radius:11px;padding:10px 12px;background:#0e8ed8;color:#fff;font-size:9px;font-weight:900;cursor:pointer}.oak-program-card.is-ready>button{background:#53ae43}.oak-program-card>button:disabled{background:#e5ebef;color:#8a9dab;cursor:not-allowed}
@media(max-width:760px){.pokemon-detail-hero{grid-template-columns:86px 1fr;padding:12px}.pokemon-detail-portrait{width:82px;height:82px}.pokemon-detail-hero h2{font-size:20px}.pokemon-trait-grid{grid-template-columns:1fr}.pokemon-move-grid{grid-template-columns:1fr}.pokemon-evolution-box{align-items:stretch;flex-direction:column}.oak-board-summary{grid-template-columns:repeat(3,1fr)}}
.pokemon-effective-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.pokemon-effective-stats article{padding:9px;border-radius:11px;background:#f3f8fb;border:1px solid #e0ebf1}.pokemon-effective-stats small{display:block;color:#718a9d;font-size:8px;font-weight:900}.pokemon-effective-stats b{display:block;margin-top:2px;color:#153d5b;font-size:16px}.pokemon-effective-stats span{display:block;margin-top:2px;color:#8aa0af;font-size:7px}@media(max-width:760px){.pokemon-effective-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v2.6.3 — first-step tutorial + in-battle EXP */
.quick-hint[hidden],.loot-feed[hidden]{display:none!important}
.controls-tutorial{position:fixed;z-index:72;left:50%;bottom:28px;transform:translate(-50%,18px);width:min(390px,calc(100vw - 28px));opacity:0;pointer-events:none;transition:.22s ease}.controls-tutorial.is-open{opacity:1;transform:translate(-50%,0);pointer-events:auto}.controls-tutorial-card{padding:14px 15px;border:1px solid rgba(214,232,242,.96);border-radius:20px;background:rgba(255,255,255,.94);box-shadow:0 18px 52px rgba(7,42,65,.22);backdrop-filter:blur(15px);color:#173f5b}.controls-tutorial-card header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.controls-tutorial-card header small{display:block;color:#208ac5;font-size:8px;font-weight:1000;letter-spacing:.1em}.controls-tutorial-card header b{display:block;margin-top:2px;font-size:17px}.controls-tutorial-card header button{width:30px;height:30px;border:0;border-radius:10px;background:#edf5f9;color:#607f92;font-size:18px;cursor:pointer}.controls-tutorial-card p{margin:7px 0 10px;color:#6b8596;font-size:10px;font-weight:700}.controls-keyboard{display:grid;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,38px);justify-content:center;gap:5px}.controls-keyboard kbd,.controls-tutorial-extra kbd,.controls-tutorial-extra b{display:grid;place-items:center;min-width:40px;height:34px;border:1px solid #cbdce6;border-bottom:3px solid #aec4d1;border-radius:9px;background:linear-gradient(#fff,#edf5f8);color:#214f6d;font:900 13px/1 system-ui;box-shadow:0 4px 10px rgba(25,70,97,.08)}.controls-tutorial-extra{display:flex;justify-content:center;gap:16px;margin-top:10px}.controls-tutorial-extra span{display:flex;align-items:center;gap:7px;color:#607d90;font-size:9px;font-weight:800}.controls-tutorial-extra b{font-size:9px}.controls-tutorial-card>small{display:block;margin-top:10px;color:#8ba0ae;font-size:8px;text-align:center}.battle-exp{margin-top:7px}.battle-exp>span{display:flex;justify-content:space-between;align-items:center;margin-bottom:3px;color:#7291a7}.battle-exp>span b{font-size:8px;letter-spacing:.08em;color:#4c9cde}.battle-exp>span small{font-size:8px;font-weight:850}.battle-exp>i{display:block;height:6px!important;border-radius:999px;background:rgba(98,149,184,.22)!important;overflow:hidden}.battle-exp>i>em{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#4e9fff,#78d8ff)!important;transition:width .25s ease}
@media(max-width:760px){.controls-tutorial{bottom:112px}.controls-tutorial-card{padding:12px}.controls-tutorial-card p{font-size:9px}.controls-keyboard{display:none}.controls-tutorial-extra{gap:8px}.controls-tutorial-extra span:first-child:before{content:'Джойстик · ';font-weight:900;color:#2b84b8}}

.guidance-pill{position:absolute;z-index:19;left:18px;bottom:22px;display:flex;align-items:center;gap:12px;min-width:240px;max-width:min(420px,calc(100vw - 130px));padding:10px 14px;border:1px solid rgba(214,232,242,.96);border-radius:18px;background:rgba(255,255,255,.95);box-shadow:0 14px 38px rgba(7,42,65,.18);backdrop-filter:blur(14px);opacity:0;transform:translateY(12px);pointer-events:none;transition:.22s ease}.guidance-pill.is-open{opacity:1;transform:none}.guidance-pill>span{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:linear-gradient(145deg,#c7ebff,#76bfff);color:#0b5b98}.guidance-pill>span .ui-icon{width:20px;height:20px}.guidance-pill b{display:block;color:#124469;font-size:12px;font-weight:950;line-height:1.1}.guidance-pill small{display:block;margin-top:3px;color:#6a8698;font-size:9px;font-weight:750;line-height:1.25}
.progress-pulse{position:absolute;z-index:21;left:50%;bottom:94px;transform:translate(-50%,18px);min-width:250px;max-width:min(420px,calc(100vw - 40px));padding:10px 14px;border:1px solid rgba(188,222,244,.95);border-radius:18px;background:rgba(255,255,255,.96);box-shadow:0 14px 34px rgba(10,50,84,.18);opacity:0;pointer-events:none;transition:.22s ease}.progress-pulse.is-open{opacity:1;transform:translate(-50%,0)}.progress-pulse b{display:block;color:#0e5f9e;font-size:11px;font-weight:950}.progress-pulse small{display:block;margin-top:3px;color:#5b7689;font-size:9px;font-weight:800}
.professor-transfer-dialog{position:fixed;inset:0;z-index:140;display:grid;place-items:center;opacity:0;pointer-events:none;transition:.2s ease}.professor-transfer-dialog.is-open{opacity:1;pointer-events:auto}.professor-transfer-card-shell{position:relative;z-index:1;width:min(640px,calc(100vw - 28px));max-height:min(82vh,760px);overflow:auto;padding:16px;border:1px solid #d4e6f0;border-radius:24px;background:rgba(255,255,255,.97);box-shadow:0 32px 80px rgba(0,20,41,.3)}.professor-transfer-card-shell header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.professor-transfer-card-shell header small{display:block;color:#2c95d4;font-size:8px;font-weight:1000;letter-spacing:.08em}.professor-transfer-card-shell header h2{margin:3px 0 0;color:#143e5f;font-size:22px}.professor-transfer-card-shell header button{width:36px;height:36px;border:0;border-radius:12px;background:#edf5f9;color:#5b7b8e;cursor:pointer}.professor-transfer-card-shell>p{margin:8px 0 14px;color:#678497;font-size:10px;font-weight:750}.professor-transfer-list{display:grid;gap:10px}.professor-transfer-card{display:grid;grid-template-columns:20px minmax(0,1fr);align-items:center;gap:12px;padding:10px 12px;border:1px solid #d9e9f1;border-radius:18px;background:#fbfdff;cursor:pointer}.professor-transfer-card.is-selected{border-color:#59b0ff;box-shadow:0 0 0 3px rgba(95,177,255,.12)}.professor-transfer-card input{margin:0}.professor-transfer-card span{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;align-items:center}.professor-transfer-card b{display:block;color:#173f5c;font-size:14px}.professor-transfer-card small{display:block;margin-top:4px;color:#718b9c;font-size:9px;font-weight:800}.professor-transfer-card .center-portrait{width:56px;height:56px}.professor-transfer-empty{padding:18px;border:1px dashed #cadbe5;border-radius:18px;color:#6b8598;text-align:center;font-weight:850}.professor-transfer-card-shell footer{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}.professor-transfer-card-shell footer button{min-height:42px;padding:0 18px;border:0;border-radius:12px;background:linear-gradient(135deg,#1da2ff,#2f73ff);color:#fff;font-weight:950;cursor:pointer}.professor-transfer-card-shell footer .secondary{background:#edf4f8;color:#557387}.dialogue-shade{position:absolute;inset:0;background:rgba(5,23,41,.5)}
@media (max-width: 760px){.guidance-pill{left:10px;right:10px;bottom:calc(146px + env(safe-area-inset-bottom));min-width:0;max-width:none}.progress-pulse{bottom:calc(154px + env(safe-area-inset-bottom));width:min(360px,calc(100vw - 24px))}.professor-transfer-card-shell{width:min(96vw,560px);padding:14px}.professor-transfer-card span{grid-template-columns:48px minmax(0,1fr)}.professor-transfer-card .center-portrait{width:48px;height:48px}}

/* v2.6.4 dialogue refresh + capture polish */
.dialogue-card { overflow: visible; }
.dialogue-portrait { background: transparent; border: none; overflow: visible; width: 184px; height: 240px; align-self: end; }
.dialogue-portrait > i { background-size: 500% 200%; background-position: 0 0; filter: drop-shadow(0 10px 16px rgba(4,35,57,.22)); }
.dialogue-portrait > span { left: 14px; right: 14px; bottom: 10px; border-radius: 12px; background: rgba(13,90,138,.88); }
.dialogue-listener { opacity: .9; align-self: end; }
.dialogue-listener > i { width: 128px; height: 180px; filter: saturate(1) drop-shadow(0 8px 14px rgba(7,36,63,.18)); }
.capture-panel { position: relative; overflow: hidden; padding-top: 86px; }
.capture-panel::before { content: ''; position: absolute; top: 12px; left: 50%; width: 150px; height: 150px; transform: translateX(-50%); border-radius: 50%; border: 4px solid rgba(255,255,255,.85); box-shadow: 0 0 0 10px rgba(67,181,255,.14), 0 0 0 22px rgba(67,181,255,.08); }
.capture-panel::after { content: 'ЗОНА БРОСКА'; position: absolute; top: 62px; left: 50%; transform: translateX(-50%); color: #e9f9ff; font-size: 11px; font-weight: 900; letter-spacing: 1.6px; }
.capture-balls { position: relative; z-index: 1; }
@media (max-width: 900px) { .dialogue-portrait { width: 112px; height: 156px; } .dialogue-listener > i { width: 74px; height: 106px; } .capture-panel { padding-top: 74px; } .capture-panel::before { width: 116px; height: 116px; top: 10px; } .capture-panel::after { top: 44px; font-size: 9px; } }


/* v2.6.6 dialogue layout refinement */
.dialogue-card {
  position: relative;
  overflow: visible;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px;
  grid-template-rows: minmax(196px, auto) auto;
  gap: 0 18px;
  width: min(1180px, 100%);
  min-height: 302px;
  padding: 20px 24px 16px 286px;
}
.dialogue-portrait {
  position: absolute;
  left: 14px;
  bottom: 0;
  width: 254px;
  height: 304px;
  margin: 0;
  align-self: end;
  justify-self: start;
  background: transparent;
  border: none;
  overflow: visible;
  pointer-events: none;
}
.dialogue-portrait > i {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: 500% 200%;
  background-position: 0 0;
  filter: drop-shadow(0 12px 20px rgba(4, 35, 57, 0.22));
}
.dialogue-portrait > span {
  left: 18px;
  right: 18px;
  bottom: 12px;
  padding: 8px 12px;
  border-radius: 14px;
  background: rgba(13, 90, 138, 0.94);
  font-size: 9px;
  letter-spacing: .8px;
}
.dialogue-copy {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  padding-top: 8px;
}
.dialogue-copy > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.dialogue-copy > header > span {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
}
.dialogue-copy small {
  font-size: 9px;
  letter-spacing: 1.1px;
}
.dialogue-copy h2 {
  margin: 5px 0 12px;
  color: #0a78ca;
  font-size: clamp(22px, 2.2vw, 31px);
  line-height: 1.04;
}
.dialogue-copy p {
  min-height: 122px;
  margin: 0;
  padding-right: 4px;
  color: #254d69;
  font-size: clamp(17px, 1.35vw, 20px);
  font-weight: 560;
  line-height: 1.55;
}
.dialogue-hint {
  margin-top: 10px;
  font-size: 10px !important;
}
#dialogueSound {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 11px;
  border-radius: 12px;
}
.dialogue-listener {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  justify-self: end;
  opacity: .84;
  padding: 0 8px 12px 0;
}
.dialogue-listener > i {
  width: 92px;
  height: 138px;
  background-repeat: no-repeat;
  background-size: 600% 800%;
  background-position: 0 0;
  filter: saturate(.94) drop-shadow(0 7px 14px rgba(7,36,63,.14));
}
.dialogue-actions {
  grid-column: 1 / 3;
  grid-row: 2;
  display: flex;
  justify-content: flex-end;
  align-items: end;
  gap: 10px;
  padding-top: 12px;
  margin-left: 18px;
}
.dialogue-actions button {
  min-width: 132px;
  min-height: 46px;
  padding: 0 16px;
  border-radius: 14px;
}
.dialogue-actions #dialogueNext {
  min-width: 188px;
}
@media (max-width: 900px) {
  .dialogue-layer {
    padding: 7px 7px calc(82px + env(safe-area-inset-bottom));
  }
  .dialogue-card {
    width: 100%;
    min-height: 276px;
    max-height: calc(100dvh - 96px - env(safe-area-inset-bottom));
    padding: 12px 12px 12px 132px;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(150px, auto) auto;
    gap: 0;
    overflow: auto;
    border-radius: 22px;
  }
  .dialogue-portrait {
    left: 8px;
    bottom: 0;
    width: 118px;
    height: 174px;
  }
  .dialogue-portrait > span {
    left: 6px;
    right: 6px;
    bottom: 6px;
    padding: 5px 5px;
    font-size: 6px;
    border-radius: 10px;
  }
  .dialogue-copy {
    grid-column: 1;
    grid-row: 1;
    padding-top: 2px;
  }
  .dialogue-copy > header {
    gap: 10px;
  }
  .dialogue-copy h2 {
    margin-bottom: 8px;
    font-size: 20px;
  }
  .dialogue-copy p {
    min-height: 72px;
    font-size: 14px;
    line-height: 1.5;
  }
  .dialogue-copy small {
    font-size: 7px;
  }
  .dialogue-hint {
    margin-top: 8px;
    font-size: 8px !important;
  }
  #dialogueSound b {
    display: none;
  }
  #dialogueSound {
    min-width: 32px;
    min-height: 34px;
    padding: 0 8px;
  }
  .dialogue-listener {
    display: none;
  }
  .dialogue-actions {
    grid-column: 1;
    grid-row: 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding-top: 10px;
    margin-left: 0;
  }
  .dialogue-actions button,
  .dialogue-actions #dialogueNext {
    min-width: 0;
    min-height: 42px;
  }
}


/* v2.6.9 HUD refresh */
.world-topbar { gap: 10px; }
.player-chip, .world-location, .instance-chip { border-color: rgba(255,255,255,.82); background: linear-gradient(180deg,rgba(255,255,255,.94),rgba(245,251,255,.9)); box-shadow: 0 16px 36px rgba(0,35,61,.2); }
.quest-widget { position: absolute; z-index: 15; top: max(82px, calc(env(safe-area-inset-top) + 66px)); left: max(18px, env(safe-area-inset-left)); width: min(320px, calc(100vw - 136px)); display: grid; gap: 6px; padding: 14px 15px 12px; border: 1px solid rgba(255,255,255,.82); border-radius: 20px; background: linear-gradient(180deg,rgba(9,44,73,.84),rgba(10,58,89,.72)); box-shadow: 0 18px 38px rgba(0,24,46,.24); backdrop-filter: blur(16px) saturate(1.06); color: #fff; }
.quest-widget small { color: #8ce2ff; font-size: 9px; font-weight: 1000; letter-spacing: 1.3px; }
.quest-widget b { font-size: 23px; line-height: 1; letter-spacing: -.5px; }
.quest-widget p { margin: 0; color: rgba(234,246,255,.9); font-size: 12px; line-height: 1.42; }
.quest-widget-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
.quest-widget-meta span { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; padding: 0 10px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(255,255,255,.08); color: #eaf7ff; font-size: 11px; font-weight: 850; }
.instance-chip { display: none !important; }
.world-minimap { position: absolute; z-index: 16; top: max(18px, env(safe-area-inset-top)); right: max(18px, env(safe-area-inset-right)); display: inline-flex; align-items: center; justify-content: center; width: 124px; height: 124px; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: none; color: #123a5d; }
.world-minimap-frame { position: relative; flex: 0 0 124px; width: 124px; height: 124px; overflow: hidden; border: 3px solid rgba(255,255,255,.94); border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(11,110,184,.16), 0 14px 32px rgba(0,31,54,.24); background: radial-gradient(circle at 50% 50%, #203345 0, #121d2b 68%, #08111b 100%); }
.world-minimap-preview { position: absolute; inset: 0; display: block; background-image: var(--minimap-image, none); background-repeat: no-repeat; background-position: center; background-size: cover; filter: saturate(1.02) contrast(1.01); }
.world-minimap-preview::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 50% 45%, transparent 58%, rgba(0,28,45,.18) 100%); }
.world-minimap-preview::after { content: ''; position: absolute; inset: 8px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.world-minimap-player { position: absolute; left: var(--minimap-player-x, 50%); top: var(--minimap-player-y, 50%); width: 11px; height: 11px; border: 2px solid white; border-radius: 50%; background: linear-gradient(180deg,#29b8ff,#0b6dc3); box-shadow: 0 0 0 4px rgba(18,161,255,.18), 0 4px 10px rgba(2,76,140,.3); transform: translate(-50%, -50%); }
.world-minimap .world-minimap-frame { pointer-events: none; }
@media (max-width: 1040px) {
  .world-topbar { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .instance-chip { display: none; }
}
@media (max-width: 760px) {
  .world-topbar { left: max(10px, env(safe-area-inset-left)); right: max(10px, env(safe-area-inset-right)); grid-template-columns: minmax(0,1fr) auto; gap: 8px; }
  .world-location { justify-self: start; min-width: 0; max-width: calc(100vw - 122px); }
  .quest-widget { top: max(64px, calc(env(safe-area-inset-top) + 54px)); left: max(10px, env(safe-area-inset-left)); width: calc(100vw - 108px); padding: 10px 12px; border-radius: 17px; gap: 4px; }
  .quest-widget small { font-size: 7px; }
  .quest-widget b { font-size: 16px; }
  .quest-widget p { font-size: 10px; }
  .quest-widget-meta span { min-height: 24px; padding: 0 8px; font-size: 9px; }
  .world-minimap { top: max(10px, env(safe-area-inset-top)); right: max(10px, env(safe-area-inset-right)); width: 94px; height: 94px; }
  .world-minimap-frame { flex-basis: 94px; width: 94px; height: 94px; }
}

/* v2.6.16 custom Item Studio icons */
.custom-item-icon{display:inline-flex;align-items:center;justify-content:center;overflow:hidden}.custom-item-icon img{display:block;width:100%;height:100%;object-fit:contain}

/* v2.7 — returning-player home and one reusable Pokémon type language */
.home-screen[data-mode="returning"] .home-setup-card,
.home-screen[data-mode="returning"] .home-showcase { display: none; }
.home-screen[data-mode="setup"] .adventure-home { display: none; }
.adventure-home {
  position: absolute;
  z-index: 2;
  inset: max(94px, calc(env(safe-area-inset-top) + 76px)) max(5vw, env(safe-area-inset-right)) max(42px, calc(env(safe-area-inset-bottom) + 24px)) max(5vw, env(safe-area-inset-left));
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  align-items: stretch;
  gap: 18px;
  max-width: 1380px;
  margin: auto;
}
.adventure-hero,
.adventure-card {
  border: 1px solid rgba(255,255,255,.78);
  background: linear-gradient(145deg,rgba(255,255,255,.96),rgba(241,249,253,.91));
  box-shadow: 0 24px 70px rgba(0,27,49,.34);
  backdrop-filter: blur(18px) saturate(1.08);
}
.adventure-hero {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 0;
  padding: clamp(26px, 4vw, 58px);
  overflow: hidden;
  border-radius: 34px;
}
.adventure-hero::after {
  content: '';
  position: absolute;
  z-index: -1;
  right: -96px;
  top: -124px;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  background: radial-gradient(circle,rgba(61,183,244,.22),rgba(61,183,244,0) 68%);
}
.adventure-eyebrow {
  color: #087bd0;
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: 1.55px;
}
.adventure-hero h1 {
  max-width: 760px;
  margin: 8px 0 10px;
  color: #123a59;
  font-size: clamp(34px, 4.3vw, 64px);
  line-height: .98;
  letter-spacing: -2px;
}
.adventure-hero h1 span { color: #0a86dc; }
.adventure-hero > p {
  max-width: 680px;
  margin: 0;
  color: #56758b;
  font-size: clamp(12px, 1.2vw, 16px);
  line-height: 1.55;
}
.adventure-profile-strip {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 9px;
  margin: clamp(20px, 3.2vh, 34px) 0 16px;
}
.adventure-profile-strip article {
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid #d6e6ef;
  border-radius: 17px;
  background: rgba(255,255,255,.72);
}
.adventure-profile-strip small,
.adventure-profile-strip b,
.adventure-profile-strip span { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adventure-profile-strip small { color: #7590a3; font-size: 7px; font-weight: 1000; letter-spacing: 1.15px; }
.adventure-profile-strip b { margin: 4px 0 2px; color: #173d5b; font-size: 13px; }
.adventure-profile-strip span { color: #7690a1; font-size: 8px; }
.adventure-continue { max-width: 520px; min-height: 62px; font-size: 13px; }
.adventure-sync-note { display: flex; align-items: center; gap: 7px; margin-top: 11px; color: #6d8798; font-size: 8px; }
.adventure-sync-note i { width: 8px; height: 8px; border-radius: 50%; background: #57c33b; box-shadow: 0 0 0 4px rgba(87,195,59,.14); }
.adventure-cards { display: grid; grid-template-rows: 1.22fr 1fr 1fr; gap: 12px; min-height: 0; }
.adventure-card { display: flex; flex-direction: column; justify-content: center; min-height: 0; padding: 20px; overflow: hidden; border-radius: 24px; }
.adventure-card.is-featured { border-color: rgba(255,224,110,.84); background: linear-gradient(145deg,rgba(255,253,232,.97),rgba(255,244,191,.91)); }
.adventure-card small { color: #1681c8; font-size: 8px; font-weight: 1000; letter-spacing: 1.25px; }
.adventure-card.is-featured small { color: #b87d00; }
.adventure-card b { margin-top: 5px; color: #153c5a; font-size: clamp(17px, 1.6vw, 23px); }
.adventure-card p { margin: 7px 0 0; color: #627f92; font-size: 10px; line-height: 1.45; }
.adventure-card > span { margin-top: 13px; color: #0a79ca; font-size: 8px; font-weight: 1000; letter-spacing: .8px; }

.pokemon-type-list { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.pokemon-type-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 25px;
  padding: 2px 8px 2px 4px;
  border: 1px solid color-mix(in srgb,var(--type-color) 34%,white);
  border-radius: 999px;
  background: color-mix(in srgb,var(--type-color) 11%,white);
  color: color-mix(in srgb,var(--type-color) 75%,#18374e);
  vertical-align: middle;
}
.pokemon-type-badge .type-icon { width: 20px; height: 20px; margin: 0; object-fit: contain; }
.pokemon-type-badge b { color: currentColor; font-size: 8px; font-weight: 950; white-space: nowrap; }
.pokemon-type-badge.is-compact { min-height: 20px; padding: 1px 6px 1px 2px; }
.pokemon-type-badge.is-compact .type-icon { width: 17px; height: 17px; }
.pokemon-type-badge.is-compact b { font-size: 7px; }
.pokemon-type-badge.is-icon-only { width: 22px; min-width: 22px; height: 22px; min-height: 22px; padding: 1px; justify-content: center; }
.pokemon-type-row,
.pokemon-meta-row,
.pokemon-detail-types { display: flex !important; align-items: center; flex-wrap: wrap; gap: 6px; }
.pokemon-type-row > span:last-child,
.pokemon-meta-row > span:last-child,
.pokemon-detail-types > span:last-child { color: #617e93; }
.pokemon-detail-types { margin: 6px 0 8px; color: #617e93; font-size: 9px; font-weight: 800; }
.pokemon-type-empty { color: #7890a2; font-size: 8px; }
.pokemon-portrait img { transform: scale(var(--profile-scale,1)); transform-origin: center bottom; transition: transform .16s ease; }

@media (max-width: 900px) {
  .adventure-home {
    inset: max(66px, calc(env(safe-area-inset-top) + 55px)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0,1fr) auto;
    gap: 9px;
  }
  .adventure-hero { padding: clamp(18px, 5vw, 28px); border-radius: 25px; }
  .adventure-hero h1 { margin-top: 6px; font-size: clamp(30px, 9.5vw, 46px); }
  .adventure-profile-strip { grid-template-columns: 1fr 1fr; margin: 16px 0 12px; }
  .adventure-profile-strip article:last-child { display: none; }
  .adventure-continue { min-height: 56px; }
  .adventure-cards { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: none; gap: 7px; }
  .adventure-card { min-height: 92px; padding: 12px; border-radius: 18px; }
  .adventure-card p, .adventure-card > span { display: none; }
  .adventure-card b { font-size: 13px; }
}

@media (max-width: 430px), (max-height: 720px) {
  .adventure-profile-strip { margin: 12px 0 10px; }
  .adventure-profile-strip article { padding: 9px 10px; }
  .adventure-sync-note { display: none; }
  .adventure-cards { display: none; }
  .adventure-home { grid-template-rows: 1fr; }
  .adventure-hero > p { font-size: 11px; }
}

/* v2.7.1 — unified glass HUD, revision-safe minimap and adaptive game windows */
.game-screen {
  --hud-deep: rgba(5, 28, 41, .9);
  --hud-deeper: rgba(3, 21, 32, .95);
  --hud-line: rgba(208, 239, 255, .34);
  --hud-muted: rgba(218, 238, 248, .72);
  --hud-blue: #168ee8;
  --hud-radius: 18px;
  font-family: "Segoe UI Variable", Inter, system-ui, sans-serif;
}
.game-screen .world-shade {
  background: linear-gradient(90deg, rgba(1, 19, 29, .2), transparent 18%, transparent 82%, rgba(1, 19, 29, .14));
  pointer-events: none;
}
.world-topbar {
  top: max(12px, env(safe-area-inset-top));
  left: max(10px, env(safe-area-inset-left));
  right: max(10px, env(safe-area-inset-right));
  grid-template-columns: 230px minmax(240px, 1fr) 230px;
  align-items: start;
}
.player-chip,
.world-location {
  border: 1px solid var(--hud-line);
  background: linear-gradient(145deg, rgba(4, 29, 42, .94), rgba(8, 45, 61, .86));
  color: #fff;
  box-shadow: 0 14px 34px rgba(0, 19, 31, .3), inset 0 1px 0 rgba(255, 255, 255, .08);
  backdrop-filter: blur(18px) saturate(1.08);
}
.player-chip {
  min-width: 218px;
  min-height: 62px;
  padding: 7px 12px 7px 7px;
  border-radius: 19px;
}
.player-chip-avatar {
  width: 46px;
  height: 46px;
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, .72);
  border-radius: 50%;
  background-color: #143f56;
  background-image: url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png');
  background-position: 0 0;
  background-size: 600% 800%;
  color: transparent;
  text-indent: -999px;
  box-shadow: 0 0 0 3px rgba(27, 155, 236, .22);
}
.player-chip-avatar[data-skin="female"] { background-image: url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png'); }
.player-chip b { color: #fff; font-size: 13px; }
.player-chip small { color: var(--hud-muted); font-size: 9px; }
.player-chip #connectionDot { box-shadow: 0 0 0 3px rgba(93, 230, 113, .12); }
.world-location {
  justify-self: center;
  min-width: 262px;
  min-height: 50px;
  padding: 7px 15px;
  border-radius: 16px;
}
.world-location .location-pin { color: #7bdb57; }
.world-location small { color: #8dd8ff; font-size: 7px; letter-spacing: 1px; }
.world-location b { color: #fff; font-size: 13px; }
.world-location > i { color: #b5d3e3; }
.instance-chip { display: none !important; }

.quest-widget {
  top: max(86px, calc(env(safe-area-inset-top) + 74px));
  left: max(10px, env(safe-area-inset-left));
  width: 300px;
  gap: 7px;
  padding: 15px 17px 17px;
  overflow: hidden;
  border: 1px solid var(--hud-line);
  border-radius: var(--hud-radius);
  background: linear-gradient(150deg, rgba(5, 31, 44, .94), rgba(6, 42, 57, .84));
  box-shadow: 0 16px 36px rgba(0, 18, 29, .3), inset 0 1px 0 rgba(255, 255, 255, .06);
}
.quest-widget::before,
.quest-widget::after {
  content: '';
  position: absolute;
  left: 17px;
  bottom: 8px;
  height: 4px;
  border-radius: 2px;
}
.quest-widget::before { right: 17px; background: rgba(255, 255, 255, .12); }
.quest-widget::after { width: var(--quest-progress, 0%); max-width: calc(100% - 34px); background: linear-gradient(90deg, #148fe8, #3bc0ff); box-shadow: 0 0 10px rgba(42, 174, 255, .35); }
.quest-widget > small { color: #87d9ff; font-size: 8px; letter-spacing: 1.4px; }
.quest-widget > b { font-size: 18px; line-height: 1.1; }
.quest-widget > p { font-size: 10px; line-height: 1.4; }
.quest-widget-meta { gap: 6px; margin-top: 1px; }
.quest-widget-meta span { min-height: 24px; padding: 0 8px; border-color: rgba(255, 255, 255, .13); background: rgba(255, 255, 255, .06); font-size: 8px; }

.world-rail {
  top: 266px;
  bottom: max(14px, env(safe-area-inset-bottom));
  left: max(10px, env(safe-area-inset-left));
  display: flex;
  width: 132px;
  max-height: calc(100% - 280px);
  padding: 7px;
  gap: 2px;
  overflow: hidden auto;
  transform: none;
  border: 1px solid var(--hud-line);
  border-radius: var(--hud-radius);
  background: linear-gradient(160deg, rgba(5, 31, 44, .93), rgba(4, 39, 54, .84));
  box-shadow: 0 18px 40px rgba(0, 18, 29, .28), inset 0 1px 0 rgba(255, 255, 255, .06);
  backdrop-filter: blur(18px) saturate(1.08);
  scrollbar-width: none;
  flex-direction: column;
}
.world-rail::-webkit-scrollbar { display: none; }
.world-rail button {
  display: flex;
  flex: 0 0 auto;
  min-height: 36px;
  padding: 0 9px;
  gap: 9px;
  justify-content: flex-start;
  border-radius: 11px;
  color: #e8f7ff;
}
.world-rail button:hover,
.world-rail button.is-active {
  transform: none;
  border-color: rgba(105, 199, 255, .28);
  background: rgba(24, 134, 201, .2);
  color: #fff;
  box-shadow: inset 3px 0 0 #24a9fa;
}
.world-rail button span { display: grid; place-items: center; width: 24px; height: 24px; color: #e8f7ff; }
.world-rail button span .ui-icon { width: 19px; height: 19px; }
.world-rail button b,
.world-rail button:hover b,
.world-rail button.is-active b { max-width: none; color: inherit; font-size: 8px; text-align: left; }
.world-rail button[data-panel="chat"],
.world-rail button[data-panel="home"] { margin-top: 2px; border-top: 1px solid rgba(255, 255, 255, .08); }
.world-rail button > i { top: 7px; right: 7px; border-color: #0a3448; }

.world-minimap {
  top: max(14px, env(safe-area-inset-top));
  right: max(14px, env(safe-area-inset-right));
  width: 196px;
  height: 196px;
}
.world-minimap-frame {
  flex-basis: 196px;
  width: 196px;
  height: 196px;
  border: 3px solid rgba(255, 255, 255, .92);
  background: radial-gradient(circle at 50% 45%, #31586c, #0d2635 70%, #06131c);
  box-shadow: inset 0 0 0 2px rgba(0, 28, 44, .32), 0 16px 38px rgba(0, 18, 29, .35);
}
.world-minimap-frame::after {
  content: '';
  position: absolute;
  z-index: 2;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle, transparent 55%, rgba(0, 20, 31, .38) 100%);
  box-shadow: inset 0 0 0 8px rgba(255, 255, 255, .04);
  pointer-events: none;
}
.world-minimap-preview {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.06) contrast(1.03);
  transition: opacity .18s ease;
}
.world-minimap-preview.is-loading { opacity: .42; }
.world-minimap-preview.is-empty { opacity: 0; }
.world-minimap-grid {
  position: absolute;
  z-index: 3;
  inset: 15%;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 50%;
  background: linear-gradient(90deg, transparent 49.5%, rgba(255,255,255,.11) 50%, transparent 50.5%), linear-gradient(transparent 49.5%, rgba(255,255,255,.11) 50%, transparent 50.5%);
}
.world-minimap-north,
.world-minimap-revision {
  position: absolute;
  z-index: 5;
  color: #fff;
  font-style: normal;
  font-weight: 1000;
  text-shadow: 0 2px 5px rgba(0,0,0,.65);
}
.world-minimap-north { top: 9px; left: 50%; transform: translateX(-50%); font-size: 11px; }
.world-minimap-revision { right: 18px; bottom: 13px; padding: 2px 5px; border-radius: 6px; background: rgba(2,25,37,.66); color: #a9dff9; font-size: 6px; letter-spacing: .6px; }
.world-minimap-player { z-index: 6; width: 14px; height: 14px; border-width: 3px; box-shadow: 0 0 0 5px rgba(18, 161, 255, .2), 0 4px 12px rgba(2, 29, 45, .5); }

.context-action {
  right: auto;
  left: 50%;
  bottom: max(22px, env(safe-area-inset-bottom));
  grid-template-columns: 64px minmax(0, 1fr);
  min-width: 380px;
  min-height: 86px;
  padding: 10px 18px 10px 10px;
  transform: translate(-50%, 12px) scale(.97);
  border: 1px solid var(--hud-line);
  border-bottom: 1px solid var(--hud-line);
  border-radius: 23px;
  background: linear-gradient(145deg, rgba(4, 29, 42, .96), rgba(7, 45, 60, .92));
  color: #fff;
  box-shadow: 0 18px 42px rgba(0, 18, 29, .38), inset 0 1px 0 rgba(255,255,255,.07);
}
.context-action.is-ready { transform: translateX(-50%); border-color: rgba(105, 199, 255, .48); animation: none; }
.context-action > span {
  width: 64px;
  height: 64px;
  overflow: hidden;
  border: 1px solid rgba(132, 212, 255, .44);
  border-radius: 50%;
  background: radial-gradient(circle at 50% 38%, #214f67, #082838);
  color: #bde9ff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 6px 14px rgba(0, 15, 25, .3);
}
.context-action > span .ui-icon { width: 27px; height: 27px; }
.context-pokemon-portrait { display: grid; place-items: center; width: 100%; height: 100%; overflow: hidden; }
.context-pokemon-portrait img { width: 78%; height: 78%; object-fit: contain; transform: scale(var(--profile-scale, 1)); transform-origin: center; }
.context-action b { color: #fff; font-size: 14px; }
.context-action small { max-width: 260px; color: var(--hud-muted); font-size: 9px; }
.context-action small kbd { border-color: #4eabeb; border-bottom-color: #0872c1; background: linear-gradient(#299ff0,#0874ca); color: #fff; }
.context-action.is-battle-action,
.context-action.is-quest-target { border-color: rgba(88, 184, 246, .54); box-shadow: 0 18px 42px rgba(0,18,29,.38), 0 0 0 3px rgba(42, 164, 240, .12); }
.context-action.is-battle-action > span,
.context-action.is-quest-target > span { border-color: rgba(132, 212, 255, .55); background: radial-gradient(circle at 50% 38%, #245c76, #092a3a); }

.hud-window,
.side-panel,
.editor-panel,
.chat-panel,
.battle-panel {
  border: 1px solid rgba(184, 218, 236, .9);
  border-radius: 24px;
  background: rgba(247, 252, 255, .975);
  box-shadow: 0 28px 74px rgba(0, 19, 31, .4);
  backdrop-filter: blur(22px) saturate(1.05);
}
.side-panel { top: 82px; right: 18px; bottom: 18px; padding: 25px; }
.panel-eyebrow { color: #087fce; letter-spacing: 1.25px; }
.game-screen button { font-family: inherit; }

.mobile-dock {
  border: 1px solid var(--hud-line);
  background: linear-gradient(145deg, rgba(4, 29, 42, .96), rgba(7, 45, 60, .94));
  box-shadow: 0 -10px 30px rgba(0, 18, 29, .3);
}
.mobile-dock button { color: #cce8f6; }
.mobile-dock button.is-active { background: rgba(27, 146, 217, .22); color: #fff; }
.mobile-dock span .ui-icon { color: currentColor; }

@media (max-width: 1180px) and (min-width: 761px) {
  .world-minimap { width: 168px; height: 168px; }
  .world-minimap-frame { flex-basis: 168px; width: 168px; height: 168px; }
  .world-topbar { grid-template-columns: 220px 1fr 190px; }
  .world-rail { top: 260px; width: 122px; }
}

@media (max-width: 760px) {
  .game-screen .world-shade { background: linear-gradient(180deg, rgba(1,19,29,.18), transparent 22%, transparent 76%, rgba(1,19,29,.18)); }
  .world-topbar { top: max(8px, env(safe-area-inset-top)); left: max(8px, env(safe-area-inset-left)); right: max(116px, calc(env(safe-area-inset-right) + 106px)); display: block; }
  .player-chip { width: min(174px, calc(100vw - 132px)); min-width: 0; min-height: 48px; padding: 5px 8px 5px 5px; border-radius: 15px; }
  .player-chip-avatar { width: 36px; height: 36px; }
  .player-chip b { max-width: 112px; font-size: 10px; }
  .player-chip small { font-size: 7px; }
  .world-location { position: absolute; top: 55px; left: 0; justify-content: flex-start; width: min(210px, calc(100vw - 132px)); min-width: 0; min-height: 39px; padding: 5px 9px; border-radius: 13px; }
  .world-location b { max-width: 150px; overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
  .world-location small { font-size: 5px; }
  .world-minimap { top: max(8px, env(safe-area-inset-top)); right: max(8px, env(safe-area-inset-right)); width: 102px; height: 102px; }
  .world-minimap-frame { flex-basis: 102px; width: 102px; height: 102px; border-width: 2px; }
  .world-minimap-north { top: 5px; font-size: 8px; }
  .world-minimap-revision { right: 8px; bottom: 7px; font-size: 5px; }
  .world-minimap-player { width: 11px; height: 11px; border-width: 2px; }
  .quest-widget { top: max(112px, calc(env(safe-area-inset-top) + 104px)); left: max(8px, env(safe-area-inset-left)); width: calc(100vw - 16px - env(safe-area-inset-left) - env(safe-area-inset-right)); padding: 10px 12px 14px; gap: 3px; border-radius: 15px; }
  .quest-widget::before, .quest-widget::after { left: 12px; bottom: 7px; }
  .quest-widget::before { right: 12px; }
  .quest-widget > small { font-size: 6px; }
  .quest-widget > b { font-size: 13px; }
  .quest-widget > p { max-width: calc(100% - 2px); overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
  .quest-widget-meta { position: absolute; top: 9px; right: 10px; }
  .quest-widget-meta span { min-height: 18px; padding: 0 6px; font-size: 6px; }
  #questWidgetReward { display: none; }
  .world-rail { display: none; }
  .context-action { left: 50%; right: auto; bottom: calc(78px + env(safe-area-inset-bottom)); grid-template-columns: 48px minmax(0,1fr); width: min(250px, calc(100vw - 32px)); min-width: 0; min-height: 62px; padding: 6px 11px 6px 6px; border-radius: 18px; }
  .context-action > span { width: 48px; height: 48px; }
  .context-action b { font-size: 10px; }
  .context-action small { max-width: 170px; font-size: 7px; }
  .mobile-dock { left: max(6px, env(safe-area-inset-left)); right: max(6px, env(safe-area-inset-right)); bottom: max(6px, env(safe-area-inset-bottom)); grid-template-columns: repeat(7, minmax(0,1fr)); height: 64px; padding: 5px; border-radius: 20px; }
  .mobile-dock button { min-width: 0; gap: 1px; border-radius: 13px; }
  .mobile-dock span { width: auto; height: auto; }
  .mobile-dock span .ui-icon { width: 18px; height: 18px; }
  .mobile-dock b { max-width: 100%; overflow: hidden; font-size: 5px; text-overflow: ellipsis; }
  .side-panel, .editor-panel, .chat-panel, .battle-panel { inset: auto max(6px, env(safe-area-inset-right)) calc(76px + env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left)); width: auto; max-height: calc(100% - 88px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); padding: 16px 14px; border-radius: 21px; }
}

@media (max-width:800px) and (max-height:610px) {
  .quest-widget { top: max(101px, calc(env(safe-area-inset-top) + 94px)); padding-top: 8px; }
  .quest-widget > p, .quest-widget-meta { display: none; }
  .world-location { top: 50px; }
  .world-minimap, .world-minimap-frame { width: 88px; height: 88px; }
  .world-minimap-frame { flex-basis: 88px; }
  .world-topbar { right: 104px; }
  .mobile-dock { height: 56px; }
  .context-action { bottom: calc(67px + env(safe-area-inset-bottom)); min-height: 54px; }
  .context-action > span { width: 42px; height: 42px; }
  .side-panel, .editor-panel, .chat-panel, .battle-panel { bottom: calc(67px + env(safe-area-inset-bottom)); max-height: calc(100% - 76px); }
}

/* v2.7.2 — two complete in-game themes */
html[data-game-theme="dark"] #app {
  --theme-surface: rgba(6, 29, 42, .97);
  --theme-surface-soft: rgba(12, 43, 58, .92);
  --theme-card: rgba(15, 50, 66, .9);
  --theme-card-hover: rgba(22, 67, 86, .94);
  --theme-border: rgba(151, 207, 235, .26);
  --theme-text: #eef9ff;
  --theme-muted: #9cbacb;
  --theme-accent: #38adf3;
  --theme-input: rgba(4, 24, 35, .78);
}
html[data-game-theme="light"] #app {
  --theme-surface: rgba(249, 253, 255, .98);
  --theme-surface-soft: rgba(240, 248, 252, .96);
  --theme-card: rgba(255, 255, 255, .96);
  --theme-card-hover: #eef8fd;
  --theme-border: #cadde8;
  --theme-text: #153b56;
  --theme-muted: #668397;
  --theme-accent: #087fd2;
  --theme-input: #f7fbfd;
}

.theme-settings { display: grid; gap: 10px; margin: 12px 0; padding: 12px; border: 1px solid var(--theme-border); border-radius: 17px; background: var(--theme-surface-soft); }
.theme-settings > header { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; }
.theme-settings > header b, .theme-settings > header small { display: block; }
.theme-settings > header b { color: var(--theme-text); font-size: 10px; }
.theme-settings > header small { color: var(--theme-muted); font-size: 7px; text-align: right; }
.theme-settings > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.theme-option { position: relative; display: grid !important; grid-template-columns: 54px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; gap: 2px 9px; min-width: 0; padding: 8px !important; border: 1px solid var(--theme-border) !important; border-radius: 14px !important; background: var(--theme-card) !important; cursor: pointer; }
.theme-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.theme-option > i { grid-row: 1 / 3; position: relative; display: block; width: 54px; height: 38px; overflow: hidden; border: 2px solid rgba(121,169,195,.4); border-radius: 10px; background: #f8fcff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.theme-option.is-dark > i { background: #082636; }
.theme-option > i span { position: absolute; left: 5px; top: 5px; bottom: 5px; width: 12px; border-radius: 4px; background: #168fd4; }
.theme-option > i em { position: absolute; left: 21px; right: 5px; top: 6px; height: 7px; border-radius: 4px; background: currentColor; color: #9fc6d8; box-shadow: 0 11px 0 color-mix(in srgb,currentColor 55%,transparent); }
.theme-option.is-dark > i em { color: #80bdd8; }
.theme-option > b { align-self: end; color: var(--theme-text); font-size: 9px; }
.theme-option > small { align-self: start; color: var(--theme-muted); font-size: 6px; }
.theme-option:has(input:checked) { border-color: var(--theme-accent) !important; box-shadow: 0 0 0 3px color-mix(in srgb,var(--theme-accent) 16%,transparent); }
.theme-option:has(input:checked)::after { content: '✓'; position: absolute; top: 5px; right: 6px; display: grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; background: var(--theme-accent); color: white; font-size: 9px; font-weight: 1000; }

html[data-game-theme] .game-screen :is(.side-panel,.editor-panel,.chat-panel,.battle-panel,.starter-card,.dialogue-card,.controls-tutorial-card,.professor-transfer-card-shell) {
  border-color: var(--theme-border) !important;
  background: var(--theme-surface) !important;
  color: var(--theme-text) !important;
}
html[data-game-theme] #app[data-screen="game"] .professor-transfer-card-shell {
  border-color: var(--theme-border) !important;
  background: var(--theme-surface) !important;
  color: var(--theme-text) !important;
}
html[data-game-theme] #app[data-screen="game"] .professor-transfer-card-shell :is(h2,b) { color: var(--theme-text) !important; }
html[data-game-theme] #app[data-screen="game"] .professor-transfer-card-shell :is(p,small) { color: var(--theme-muted) !important; }
html[data-game-theme] #app[data-screen="game"] .professor-transfer-card-shell header small { color: var(--theme-accent) !important; }
html[data-game-theme] #app[data-screen="game"] .professor-transfer-card {
  border-color: var(--theme-border) !important;
  background: var(--theme-card) !important;
}
html[data-game-theme] #app[data-screen="game"] .professor-transfer-card-shell :is(header button,footer .secondary) {
  border-color: var(--theme-border) !important;
  background: var(--theme-surface-soft) !important;
  color: var(--theme-text) !important;
}
html[data-game-theme] .game-screen :is(.panel-title,.editor-head b,.chat-head b,.battle-status b,.starter-card h2,.dialogue-copy h2,.professor-transfer-card-shell h2) { color: var(--theme-text) !important; }
html[data-game-theme] .game-screen :is(.panel-lead,.editor-panel > p,.starter-card > p,.starter-card > small,.dialogue-copy p,.dialogue-hint,.professor-transfer-card-shell > p,.settings-footnote) { color: var(--theme-muted) !important; }
html[data-game-theme] .game-screen :is(.panel-eyebrow,.editor-head small,.chat-head small,.battle-status small,.dialogue-copy header small,.professor-transfer-card-shell header small) { color: var(--theme-accent) !important; }
html[data-game-theme] .game-screen :is(input:not([type="range"]),textarea,select) { border-color: var(--theme-border) !important; background: var(--theme-input) !important; color: var(--theme-text) !important; }
html[data-game-theme] .game-screen ::placeholder { color: color-mix(in srgb,var(--theme-muted) 72%,transparent); }

html[data-game-theme] .game-screen :is(.audio-settings,.binding-row,.battle-setting,.chat-config,.battle-health article,.pokemon-detail-hero,.pokemon-trait-grid article,.pokemon-detail-section,.pokemon-move-card,.pokemon-effective-stats article,.oak-board-summary article,.oak-program-card,.inventory-card,.region-card,.team-card,.center-card,.quest-card,.discovery-list article,.professor-transfer-card,.bag-empty) {
  border-color: var(--theme-border) !important;
  background: var(--theme-card) !important;
  color: var(--theme-text) !important;
}
html[data-game-theme] .game-screen :is(.audio-settings,.binding-row,.battle-setting,.chat-config,.pokemon-detail-hero,.pokemon-detail-section,.oak-program-card,.professor-transfer-card) :is(b,strong,h2,h3) { color: var(--theme-text) !important; }
html[data-game-theme] .game-screen :is(.audio-settings,.binding-row,.battle-setting,.chat-config,.pokemon-detail-hero,.pokemon-detail-section,.oak-program-card,.professor-transfer-card) :is(small,p,span,em) { color: var(--theme-muted); }
html[data-game-theme] .game-screen :is(.settings-reset,.binding-row button,.chat-head-actions button,.chat-config > button,.panel-close,.professor-transfer-card-shell header button,.dialogue-actions #dialogueClose) { border-color: var(--theme-border) !important; background: var(--theme-surface-soft) !important; color: var(--theme-text) !important; }
html[data-game-theme] .game-screen :is(.bag-tabs button,.chat-tabs button,.editor-modes button) { border-color: var(--theme-border); background: var(--theme-card); color: var(--theme-muted); }
html[data-game-theme] .game-screen :is(.bag-tabs button,.chat-tabs button,.editor-modes button).is-active { border-color: var(--theme-accent); background: color-mix(in srgb,var(--theme-accent) 17%,var(--theme-card)); color: var(--theme-text); }

html[data-game-theme="dark"] .game-screen .chat-panel { background: rgba(6,29,42,var(--chat-opacity)) !important; }
html[data-game-theme="light"] .game-screen .chat-panel { background: rgba(249,253,255,var(--chat-opacity)) !important; }
html[data-game-theme] .game-screen :is(.chat-message p,.chat-message time,.battle-health small,#battleHint) { color: var(--theme-muted) !important; }
html[data-game-theme] .game-screen #chatForm { border-color: var(--theme-border); background: var(--theme-input); }
html[data-game-theme] .game-screen #chatForm input { background: transparent !important; }
html[data-game-theme="dark"] .game-screen .battle-decision { border-color: rgba(255,205,78,.38); background: rgba(92,68,14,.52); color: #fff5d0; }
html[data-game-theme] .game-screen .capture-panel { border-color: var(--theme-border); background: color-mix(in srgb,var(--theme-accent) 10%,var(--theme-surface-soft)); }

html[data-game-theme] .game-screen :is(.guidance-pill,.progress-pulse,.loot-feed,.quick-hint) { border-color: var(--theme-border) !important; background: var(--theme-surface) !important; color: var(--theme-text) !important; }
html[data-game-theme] .game-screen :is(.guidance-pill,.progress-pulse,.loot-feed) b { color: var(--theme-text) !important; }
html[data-game-theme] .game-screen :is(.guidance-pill,.progress-pulse,.loot-feed) small { color: var(--theme-muted) !important; }

html[data-game-theme="light"] .game-screen :is(.player-chip,.world-location,.instance-chip,.quest-widget,.world-rail,.context-action,.mobile-dock) {
  border-color: rgba(190,215,229,.94);
  background: rgba(250,253,255,.94);
  color: #153b56;
  box-shadow: 0 14px 34px rgba(0,31,50,.2), inset 0 1px 0 #fff;
}
html[data-game-theme="light"] .game-screen :is(.player-chip,.world-location,.instance-chip,.quest-widget,.context-action) :is(b,small,p) { color: #153b56; }
html[data-game-theme="light"] .game-screen .quest-widget > small,
html[data-game-theme="light"] .game-screen .world-location small { color: #087fcf; }
html[data-game-theme="light"] .game-screen .quest-widget-meta span { border-color: #d2e3ec; background: #edf6fa; color: #315d77; }
html[data-game-theme="light"] .game-screen .world-rail button { color: #315d77; }
html[data-game-theme="light"] .game-screen .world-rail button:hover,
html[data-game-theme="light"] .game-screen .world-rail button.is-active { border-color: #b9def2; background: #e8f6fd; color: #087dcc; }
html[data-game-theme="light"] .game-screen .context-action > span { border-color: #a9d4ea; background: radial-gradient(circle at 50% 38%,#fafdff,#d9edf7); color: #087dcc; }
html[data-game-theme="light"] .game-screen .context-action small { color: #607e91; }
html[data-game-theme="light"] .game-screen .mobile-dock button { color: #426a82; }
html[data-game-theme="light"] .game-screen .mobile-dock button.is-active { background: #e4f4fb; color: #087dcc; }

html[data-game-theme] #app[data-screen="game"] .toast {
  border-color: var(--theme-border);
  background: var(--theme-surface);
  color: var(--theme-text);
}
html[data-game-theme="dark"] #app[data-screen="game"] .loading-screen {
  background: radial-gradient(circle at 50% 44%,#164e67,#061d2a 72%);
  color: var(--theme-text);
}
html[data-game-theme="light"] #app[data-screen="game"] .loading-screen {
  background: radial-gradient(circle at 50% 44%,#ffffff,#d8eef8 72%);
  color: var(--theme-text);
}
html[data-game-theme="light"] #app[data-screen="game"] .loading-screen small { color: var(--theme-muted); }

/* v2.9.11: the world bootstrap must end in the game or in an actionable error. */
.loading-screen.is-error {
  background: radial-gradient(circle at 50% 42%,#173f61,#071b2d 72%);
}
.loading-screen.is-error .loading-orbit {
  width: 58px;
  height: 58px;
  border-color: rgba(255,255,255,.16);
  border-top-color: #ffcf4a;
  animation: none;
}
.loading-screen.is-error .loading-orbit i {
  inset: 15px;
  background: #ffcf4a;
  box-shadow: 0 0 0 7px rgba(255,207,74,.1);
}
.loading-screen.is-error > b {
  max-width: min(520px,calc(100vw - 36px));
  font-size: clamp(20px,3.4vw,28px);
  text-align: center;
}
.loading-screen.is-error > small {
  max-width: min(560px,calc(100vw - 40px));
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}
.loading-recovery {
  width: min(520px,calc(100vw - 32px));
  margin-top: 17px;
  padding: 13px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 16px;
  background: rgba(4,24,39,.48);
  text-align: center;
}
.loading-recovery[hidden] { display: none !important; }
.loading-recovery p {
  min-height: 18px;
  margin: 0 0 11px;
  color: #b8d1df;
  font-size: 11px;
  line-height: 1.45;
}
.loading-recovery nav { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.loading-recovery button {
  min-height: 43px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 12px;
  background: rgba(255,255,255,.08);
  color: white;
  font: 800 11px/1 inherit;
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
}
.loading-recovery button:first-child {
  border-color: #29a9ec;
  background: linear-gradient(180deg,#2eb6f5,#118bd3);
}
.loading-recovery button:focus-visible { outline: 3px solid rgba(255,207,74,.42); outline-offset: 2px; }
@media(max-width:520px) {
  .loading-recovery nav { grid-template-columns: 1fr; }
}

@media (max-width: 540px) {
  .theme-settings > header { display: grid; }
  .theme-settings > header small { text-align: left; }
  .theme-option { grid-template-columns: 44px minmax(0,1fr); }
  .theme-option > i { width: 44px; }
}

/* v2.7.3 — role-aware world labels and action language; home/auth stay untouched */
.game-screen .player-chip { border-color: color-mix(in srgb,var(--role-color,#39aef4) 42%,var(--theme-border)); }
.game-screen .player-chip-avatar { box-shadow: 0 0 0 2px color-mix(in srgb,var(--role-color,#39aef4) 45%,transparent); }
.game-screen .player-chip-copy { display:grid; align-content:center; min-width:0; }
.game-screen .player-community-role { display:flex; align-items:center; gap:4px; width:max-content; max-width:145px; margin-top:2px; padding:2px 6px; border-radius:7px; background:color-mix(in srgb,var(--role-color) 14%,transparent); color:var(--role-color) !important; font-size:6px !important; font-weight:1000; letter-spacing:.04em; text-transform:uppercase; }
.game-screen .player-community-role[hidden] { display:none; }
.game-screen .player-community-role svg { width:10px; height:10px; flex:0 0 auto; }
.game-screen .player-community-role .player-community-role-raster { width:12px; height:12px; flex:0 0 auto; object-fit:contain; filter:drop-shadow(0 1px 2px rgba(5,35,54,.24)); }
.game-screen .player-community-role span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.game-screen .player-connection { margin-top:2px; }

.game-screen .context-action {
  display:grid;
  grid-template-columns:60px minmax(132px,1fr) auto;
  grid-template-rows:1fr;
  align-items:center;
  gap:12px;
  width:min(492px,calc(100vw - 34px));
  min-width:0;
  min-height:82px;
  padding:8px 9px;
  border:1px solid rgba(123,191,226,.24);
  border-radius:24px;
  background:linear-gradient(160deg,rgba(7,39,53,.96),rgba(6,28,39,.92));
  color:#f4fbff;
  box-shadow:0 18px 44px rgba(0,18,29,.38),inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(12px);
}
.game-screen .context-action.is-ready {
  border-color:rgba(99,198,255,.44);
  box-shadow:0 18px 44px rgba(0,18,29,.38),0 0 0 1px rgba(88,173,233,.1),inset 0 1px 0 rgba(255,255,255,.06);
}
.game-screen .context-action > .context-action-visual {
  grid-column:1;
  grid-row:1;
  display:grid;
  place-items:center;
  width:60px;
  height:60px;
  overflow:hidden;
  border:1px solid rgba(212,174,72,.75);
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(241,247,250,.95));
  color:#d9a23a;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 3px 9px rgba(0,0,0,.12);
}
.game-screen .context-action > .context-action-visual .ui-icon { width:25px; height:25px; }
.game-screen .context-pokemon-emoji {
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
}
.game-screen .context-pokemon-emoji img {
  width:76%;
  height:76%;
  object-fit:contain;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.08));
}
.game-screen .context-pokemon-emoji.is-placeholder,
.game-screen .context-pokemon-emoji.is-fallback {
  font-size:28px;
}
.game-screen .context-action > .context-action-copy {
  grid-column:2;
  grid-row:1;
  display:grid;
  align-content:center;
  gap:3px;
  width:auto;
  height:auto;
  min-width:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  color:inherit;
  text-align:left;
}
.game-screen .context-action-copy b {
  overflow:hidden;
  color:#f7fbff;
  font-size:14px;
  line-height:1.1;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-screen .context-action-copy small {
  overflow:hidden;
  max-width:none;
  color:rgba(214,232,242,.82);
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-screen .context-action > .context-action-cta {
  grid-column:3;
  grid-row:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:auto;
  min-width:122px;
  height:48px;
  padding:0 15px;
  border:1px solid rgba(125,199,255,.65);
  border-bottom:2px solid rgba(28,118,187,.85);
  border-radius:16px;
  background:linear-gradient(180deg,rgba(95,177,240,.35),rgba(17,109,181,.72));
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 18px rgba(5,103,178,.18);
}
.game-screen .context-action.is-ready > .context-action-cta {
  animation:contextActionCtaPulse 1.35s ease-in-out infinite;
}
@keyframes contextActionCtaPulse {
  0%,100% { transform:translateY(0); box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 18px rgba(5,103,178,.18); }
  50% { transform:translateY(-1px); box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 11px 24px rgba(42,150,230,.3); }
}
.game-screen .context-action-cta kbd {
  display:grid;
  place-items:center;
  min-width:28px;
  height:28px;
  padding:0 7px;
  border:1px solid rgba(255,255,255,.76);
  border-bottom:2px solid rgba(3,80,143,.72);
  border-radius:9px;
  background:rgba(255,255,255,.96);
  color:#0a72c5;
  font:1000 11px/1 system-ui;
}
.game-screen .context-action-cta i { display:grid; place-items:center; }
.game-screen .context-action-cta i svg { width:16px; height:16px; }
.game-screen .context-action-cta b { color:#fff; font-size:11px; white-space:nowrap; }
.game-screen .context-action.has-creature-emoji .context-action-cta i { display:none; }
.game-screen .context-action.is-battle-action > .context-action-visual { border-color:rgba(212,174,72,.75); color:#d8a544; }
.game-screen .context-action.is-quest-target > .context-action-visual { border-color:#7bcbff; color:#319bec; }
html[data-game-theme="light"] .game-screen .context-action {
  background:linear-gradient(160deg,rgba(10,51,69,.93),rgba(7,38,51,.9));
  box-shadow:0 18px 42px rgba(23,78,107,.22),inset 0 1px 0 rgba(255,255,255,.08);
}
html[data-game-theme="light"] .game-screen .context-action > .context-action-visual {
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(242,247,251,.95));
}

html[data-game-theme] .game-screen :is(.side-panel,.editor-panel,.chat-panel,.battle-panel) :is(button:not(.primary-cta),.inventory-card,.team-card,.quest-card,.region-card,.center-card,.pokemon-move-card) { transition:border-color .16s,background .16s,color .16s,transform .16s; }
html[data-game-theme="dark"] .game-screen :is(.side-panel,.editor-panel,.chat-panel,.battle-panel) :is(hr,.panel-divider) { border-color:var(--theme-border); }
html[data-game-theme="light"] .game-screen .dialogue-shade { background:rgba(20,55,76,.36); }
html[data-game-theme="dark"] .game-screen .dialogue-shade { background:rgba(1,14,22,.66); }

@media (max-width:760px) {
  .game-screen .context-action { bottom:calc(76px + env(safe-area-inset-bottom)); grid-template-columns:48px minmax(78px,1fr) auto; gap:8px; width:min(372px,calc(100vw - 18px)); min-height:62px; padding:6px; border-radius:18px; }
  .game-screen .context-action > .context-action-visual { width:48px; height:48px; }
  .game-screen .context-action-copy b { font-size:10px; }
  .game-screen .context-action-copy small { font-size:6px; }
  .game-screen .context-action > .context-action-cta { min-width:84px; height:42px; gap:5px; padding:0 8px; border-radius:12px; }
  .game-screen .context-action-cta i { display:none; }
  .game-screen .context-action-cta b { font-size:8px; }
  .game-screen .context-action-cta kbd { min-width:24px; height:24px; font-size:9px; }
}

/* v2.9.53 · world entry is an asset gate, not a green-canvas timeout. */
#app .loading-screen {
  position:fixed;
  z-index:160;
  inset:0;
  display:grid;
  place-items:center;
  padding:max(22px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(22px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));
  overflow:hidden;
  background:#153e37;
  color:#fff;
  isolation:isolate;
}
#app .loading-scene {
  position:absolute;
  z-index:-2;
  inset:-3%;
  background-image:linear-gradient(180deg,rgba(6,28,35,.08) 18%,rgba(5,30,27,.54) 82%,rgba(4,23,23,.82)),url('/assets/v2.9.53/loading/world-entry-valley-v1.webp');
  background-position:center;
  background-size:cover;
  transform:scale(1.03);
  animation:loading-scene-breathe 12s ease-in-out infinite alternate;
}
#app .loading-screen::after {
  position:absolute;
  z-index:-1;
  inset:0;
  content:'';
  background:radial-gradient(circle at 50% 45%,transparent 15%,rgba(3,23,24,.18) 68%,rgba(3,19,22,.52));
}
#app .loading-card {
  display:flex;
  width:min(460px,calc(100vw - 36px));
  padding:30px 32px 25px;
  flex-direction:column;
  align-items:center;
  border:1px solid rgba(255,255,255,.5);
  border-radius:30px;
  background:linear-gradient(145deg,rgba(13,46,52,.78),rgba(7,31,35,.7));
  box-shadow:0 24px 80px rgba(0,17,21,.35),inset 0 1px rgba(255,255,255,.18);
  text-align:center;
  backdrop-filter:blur(18px) saturate(1.15);
}
#app .loading-compass {
  position:relative;
  width:68px;
  height:68px;
  margin-bottom:14px;
  border:3px solid rgba(255,255,255,.34);
  border-top-color:#fff;
  border-radius:50%;
  box-shadow:0 0 0 8px rgba(255,255,255,.08);
  animation:spin 1.35s linear infinite;
}
#app .loading-compass i { position:absolute; inset:13px; border:1px solid rgba(255,255,255,.48); border-radius:50%; }
#app .loading-compass span { position:absolute; left:50%; top:10px; width:12px; height:26px; border-radius:10px 10px 4px 4px; background:linear-gradient(#ffd963 50%,#eefcff 50%); clip-path:polygon(50% 0,100% 100%,50% 78%,0 100%); transform:translateX(-50%); }
#app .loading-kicker { margin:0 0 8px; color:#aee7d0; font-size:10px; font-weight:950; letter-spacing:.16em; }
#app .loading-card > b { margin:0; font-size:clamp(24px,4vw,34px); line-height:1.1; letter-spacing:-.035em; }
#app .loading-card > #loadingSubtitle { max-width:390px; margin:9px 0 20px; color:#e6f7f3; font-size:13px; line-height:1.45; }
#app .loading-progress { width:100%; height:8px; overflow:hidden; border:1px solid rgba(255,255,255,.22); border-radius:99px; background:rgba(0,17,20,.38); }
#app .loading-progress i { display:block; width:8%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#5ee0a3,#ffe064); box-shadow:0 0 18px rgba(94,224,163,.55); transition:width .35s ease; }
#app .loading-meta { display:flex; width:100%; margin-top:9px; justify-content:space-between; gap:12px; color:#dff6ef; font-size:10px; font-weight:850; }
#app .loading-meta time { color:#a9c9c4; font-variant-numeric:tabular-nums; }
#app .loading-tip { min-height:32px; margin:15px 0 0; color:#c9e2de; font-size:11px; line-height:1.45; }
#app .loading-recovery { width:100%; margin-top:16px; }
#app .loading-screen.is-error .loading-compass { animation:none; border-color:rgba(255,255,255,.24); border-top-color:#ffd460; }
#app .loading-screen.is-error .loading-progress i { background:linear-gradient(90deg,#ffb953,#ffdc6c); }
#app .loading-screen.is-channel-switch { background:rgba(4,23,33,.58); }
#app .loading-screen.is-channel-switch .loading-scene { opacity:.35; filter:blur(5px); }
@keyframes loading-scene-breathe { to { transform:scale(1.075) translate3d(-.5%,.25%,0); } }
@media (max-width:600px) {
  #app .loading-screen { align-items:end; }
  #app .loading-scene { background-position:58% center; }
  #app .loading-card { width:min(100%,420px); padding:24px 21px calc(22px + env(safe-area-inset-bottom)); border-radius:26px; }
  #app .loading-compass { width:58px; height:58px; }
  #app .loading-card > b { font-size:26px; }
}
@media (prefers-reduced-motion:reduce) {
  #app .loading-scene,#app .loading-compass { animation:none; }
}

/* ========================================================================== 
   V36.2 — first-step keyboard card repair.
   This layer only owns the desktop tutorial; touch onboarding stays native.
   ========================================================================== */

@media (min-width:761px) {
  .controls-tutorial[data-controls-polish="v36-2"] {
    width:min(620px,calc(100vw - 32px));
  }

  .controls-tutorial[data-controls-polish="v36-2"] .controls-tutorial-card {
    padding:17px 19px 15px;
  }

  .controls-tutorial[data-controls-polish="v36-2"] .controls-tutorial-extra {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-top:12px;
  }

  .controls-tutorial[data-controls-polish="v36-2"] .controls-tutorial-extra > span {
    min-width:0;
    min-height:50px;
    padding:7px 9px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:8px;
    overflow:hidden;
    border:1px solid #d6e5ed;
    border-radius:13px;
    background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(240,247,250,.94));
    color:#567589;
    font-size:9px;
    font-weight:850;
    line-height:1.18;
  }

  .controls-tutorial[data-controls-polish="v36-2"] .controls-tutorial-extra :is(kbd,b) {
    min-width:48px;
    width:auto;
    height:34px;
    padding:0 9px;
    box-sizing:border-box;
    white-space:nowrap;
  }

  .controls-tutorial[data-controls-polish="v36-2"] .controls-tutorial-extra [data-tutorial-key="sprint"] {
    min-width:82px;
  }
}
@media (max-width:420px) {
  .game-screen .context-action { grid-template-columns:44px minmax(68px,1fr) auto; width:calc(100vw - 12px); gap:6px; }
  .game-screen .context-action > .context-action-visual { width:44px; height:44px; }
  .game-screen .context-action > .context-action-cta { min-width:73px; padding:0 6px; }
  .game-screen .context-action-cta b { max-width:47px; overflow:hidden; text-overflow:ellipsis; }
}

/* v2.7.4 — compact world UI: one-line labels, SVG actions and no duplicate objective */
.game-screen .guidance-pill { display:none !important; }
.game-screen .player-chip {
  min-width:198px;
  min-height:54px;
  padding:5px 10px 5px 5px;
  border-color:var(--theme-border);
  border-radius:16px;
}
.game-screen .player-chip-avatar { width:40px; height:40px; border-width:1px; }
.game-screen .player-chip-copy {
  grid-template-columns:minmax(0,auto) minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:6px;
  row-gap:2px;
}
.game-screen #worldPlayerName { grid-column:1 / -1; overflow:hidden; max-width:148px; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.game-screen .player-community-role {
  align-self:center;
  max-width:82px;
  margin:0;
  padding:1px 4px;
  border-radius:5px;
  font-size:5px !important;
  letter-spacing:.02em;
}
.game-screen .player-community-role svg { width:8px; height:8px; }
.game-screen .player-connection { align-self:center; margin:0; overflow:hidden; font-size:6px !important; text-overflow:ellipsis; white-space:nowrap; }

.game-screen .world-location { min-width:236px; min-height:46px; padding:6px 12px; border-radius:14px; }
.game-screen .world-location .location-pin { width:28px; height:28px; border-radius:9px; }
.game-screen .world-location .location-pin .ui-icon { width:16px; height:16px; }
.game-screen .world-location small { font-size:6px; }
.game-screen .world-location b { font-size:11px; }

.game-screen .quest-widget {
  top:max(76px,calc(env(safe-area-inset-top) + 65px));
  width:264px;
  gap:4px;
  padding:12px 14px 15px;
  border-radius:15px;
}
.game-screen .quest-widget > small { font-size:6px; letter-spacing:1.1px; }
.game-screen .quest-widget > b { font-size:14px; line-height:1.15; }
.game-screen .quest-widget > p { display:-webkit-box; overflow:hidden; font-size:8px; line-height:1.35; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.game-screen .quest-widget-meta span { min-height:19px; padding:0 6px; font-size:6px; }
.game-screen .quest-widget::before,
.game-screen .quest-widget::after { left:14px; bottom:6px; height:3px; }
.game-screen .quest-widget::before { right:14px; }

.game-screen .world-rail {
  top:218px;
  bottom:max(12px,env(safe-area-inset-bottom));
  width:116px;
  max-height:calc(100% - 230px);
  padding:6px;
  border-radius:15px;
}
.game-screen .world-rail button { min-height:33px; padding:0 8px; gap:7px; border-radius:9px; }
.game-screen .world-rail button span { width:21px; height:21px; }
.game-screen .world-rail button span .ui-icon { width:17px; height:17px; }
.game-screen .world-rail button b,
.game-screen .world-rail button:hover b,
.game-screen .world-rail button.is-active b { font-size:7px; }

.game-screen .round-quick { border-width:1px; border-radius:13px; }
.game-screen .round-quick .ui-icon { width:20px; height:20px; }

.game-screen .context-action {
  grid-template-columns:48px minmax(112px,1fr) auto;
  gap:9px;
  width:min(402px,calc(100vw - 28px));
  min-height:66px;
  padding:7px;
  border-radius:17px;
  box-shadow:0 14px 34px rgba(0,18,29,.3),inset 0 1px 0 rgba(255,255,255,.07);
}
.game-screen .context-action > .context-action-visual { width:48px; height:48px; border-width:1px; }
.game-screen .context-action > .context-action-visual .ui-icon { width:21px; height:21px; }
.game-screen .context-action-copy { gap:3px; }
.game-screen .context-action-copy b { font-size:11px; }
.game-screen .context-action-copy small { font-size:7px; }
.game-screen .context-action > .context-action-cta { min-width:102px; height:42px; padding:0 10px; border-radius:12px; }
.game-screen .context-action-cta kbd { min-width:25px; height:25px; font-size:10px; }
.game-screen .context-action-cta i svg { width:14px; height:14px; }
.game-screen .context-action-cta b { font-size:8px; }

.game-screen :is(.panel-close,.chat-head-actions button,.editor-head button,.dialogue-actions button) .ui-icon { width:16px; height:16px; }
.game-screen :is(.quest-prologue,.quest-card) > i .ui-icon { width:22px; height:22px; }
.game-screen .discovery-score .panel-ui-icon { width:30px; height:30px; }
.game-screen button:focus-visible { outline:2px solid color-mix(in srgb,var(--theme-accent) 78%,white); outline-offset:2px; }

@media (max-width:760px) {
  .game-screen .player-chip { width:min(164px,calc(100vw - 126px)); min-height:43px; padding:4px 7px 4px 4px; border-radius:13px; }
  .game-screen .player-chip-avatar { width:33px; height:33px; }
  .game-screen #worldPlayerName { max-width:116px; font-size:9px; }
  .game-screen .player-community-role { max-width:65px; font-size:4.5px !important; }
  .game-screen .player-connection { font-size:5px !important; }
  .game-screen .world-location { top:49px; width:min(194px,calc(100vw - 126px)); min-height:36px; padding:4px 7px; }
  .game-screen .world-location .location-pin { width:25px; height:25px; }
  .game-screen .quest-widget { top:max(100px,calc(env(safe-area-inset-top) + 92px)); padding:8px 10px 11px; }
  .game-screen .quest-widget > b { font-size:11px; }
  .game-screen .quest-widget > p { font-size:7px; -webkit-line-clamp:1; }
  .game-screen .context-action { bottom:calc(69px + env(safe-area-inset-bottom)); grid-template-columns:42px minmax(70px,1fr) auto; width:min(334px,calc(100vw - 14px)); min-height:54px; gap:6px; padding:5px; border-radius:15px; }
  .game-screen .context-action > .context-action-visual { width:42px; height:42px; }
  .game-screen .context-action-copy b { font-size:9px; }
  .game-screen .context-action-copy small { font-size:6px; }
  .game-screen .context-action > .context-action-cta { min-width:84px; height:36px; padding:0 7px; }
  .game-screen .context-action-cta kbd { min-width:22px; height:22px; font-size:8px; }
  .game-screen .context-action-cta b { max-width:42px; font-size:7px; }
  .game-screen .mobile-dock { height:58px; border-radius:17px; }
  .game-screen .mobile-dock span .ui-icon { width:17px; height:17px; }
}


/* v2.7.7 — compact world labels, refreshed context CTA and Pokémon emoji hooks */
.game-screen .quest-widget {
  left:auto;
  right:max(14px,env(safe-area-inset-right));
  top:max(218px,calc(env(safe-area-inset-top) + 218px));
  width:196px;
  background:linear-gradient(150deg,rgba(5,31,44,.91),rgba(6,42,57,.79));
}
.game-screen .quest-widget > #questWidgetState { color:#67d58c; }
.game-screen .quest-widget.is-ready > #questWidgetState { color:#ffd34d; }
.game-screen .quest-widget.is-free > #questWidgetState { color:#9aaeb9; }
.game-screen .quest-widget:not(.is-free):not(.is-ready)::after { animation:questProgressPulse 1.8s ease-in-out infinite; }
@keyframes questProgressPulse { 50% { filter:brightness(1.28); } }
.game-screen .world-rail { width:138px; }
.game-screen .world-rail button { min-height:40px; }
.game-screen .world-rail button span { width:25px; height:25px; }
.game-screen .world-rail button span .ui-icon { width:20px; height:20px; }
.game-screen .world-rail button b,
.game-screen .world-rail button:hover b,
.game-screen .world-rail button.is-active b { font-size:9px; font-weight:650; }
html[data-game-theme="dark"] .game-screen .world-rail { background:linear-gradient(160deg,rgba(5,31,44,.93),rgba(4,39,54,.84)); }
html[data-game-theme="dark"] .game-screen .world-rail button span .ui-icon { color:#87d9ff; }
html[data-game-theme="light"] .game-screen .world-rail { background:rgba(248,252,255,.94); }
html[data-game-theme="light"] .game-screen .world-rail button span .ui-icon { color:#1388d2; }
.game-screen .context-action { width:min(438px,calc(100vw - 28px)); min-height:78px; }
.game-screen .context-action > .context-action-visual .ui-icon { width:27px; height:27px; }
.game-screen .context-action-copy b { font-size:13px; }
.game-screen .context-action-copy small { font-size:8px; }
@media (max-width:1180px) and (min-width:761px) {
  .game-screen .quest-widget { right:max(14px,env(safe-area-inset-right)); top:max(190px,calc(env(safe-area-inset-top) + 190px)); width:168px; }
}
@media (max-width:760px) {
  .game-screen .quest-widget { left:auto; right:max(8px,env(safe-area-inset-right)); top:max(116px,calc(env(safe-area-inset-top) + 108px)); width:102px; padding:8px 8px 11px; }
  .game-screen .quest-widget > b { font-size:10px; }
  .game-screen .quest-widget > p { display:none; }
  .game-screen .quest-widget-meta { position:static; }
  .game-screen .quest-widget-meta span { max-width:86px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .game-screen .context-action { width:min(358px,calc(100vw - 14px)); min-height:64px; }
}

/* v2.7.9 — refined context action CTA for battle, talk and utility interactions */
.game-screen .context-action {
  --context-surface: linear-gradient(160deg,rgba(6,38,52,.94),rgba(7,29,40,.9));
  --context-border: rgba(108,186,230,.28);
  --context-title: #f4fbff;
  --context-meta: rgba(212,231,241,.82);
  --context-visual-surface: linear-gradient(180deg,rgba(255,255,255,.98),rgba(236,244,249,.94));
  --context-visual-border: rgba(212,174,72,.78);
  --context-visual-color: #d8a341;
  --context-cta-surface: linear-gradient(180deg,rgba(76,169,242,.92),rgba(16,108,191,.96));
  --context-cta-border: rgba(136,207,255,.66);
  --context-cta-bottom: rgba(13,84,151,.84);
  width: min(432px, calc(100vw - 28px));
  min-height: 76px;
  gap: 12px;
  padding: 8px 10px;
  border: 1px solid var(--context-border);
  border-radius: 22px;
  background: var(--context-surface);
  box-shadow: 0 18px 44px rgba(0,18,29,.33), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter: blur(12px);
}
.game-screen .context-action.is-ready {
  border-color: color-mix(in srgb, var(--context-cta-border) 82%, var(--context-border));
  box-shadow: 0 18px 44px rgba(0,18,29,.33), 0 0 0 1px rgba(83,173,233,.12), inset 0 1px 0 rgba(255,255,255,.08);
}
.game-screen .context-action > .context-action-visual {
  width: 58px;
  height: 58px;
  border: 1px solid var(--context-visual-border);
  border-radius: 50%;
  background: var(--context-visual-surface);
  color: var(--context-visual-color);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88), 0 4px 10px rgba(0,0,0,.11);
}
.game-screen .context-action > .context-action-visual .ui-icon {
  width: 24px;
  height: 24px;
}
.game-screen .context-action-copy {
  gap: 2px;
}
.game-screen .context-action-copy b {
  color: var(--context-title);
  font-size: 13px;
  font-weight: 850;
}
.game-screen .context-action-copy small {
  color: var(--context-meta);
  font-size: 8px;
}
.game-screen .context-action > .context-action-cta {
  display: grid;
  grid-template-columns: 34px auto;
  grid-template-rows: 1fr 1fr;
  align-items: center;
  justify-content: start;
  column-gap: 10px;
  row-gap: 1px;
  min-width: 136px;
  height: 50px;
  padding: 0 14px;
  border: 1px solid var(--context-cta-border);
  border-bottom: 2px solid var(--context-cta-bottom);
  border-radius: 16px;
  background: var(--context-cta-surface);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.26), 0 8px 18px rgba(6,93,165,.18);
  backdrop-filter: blur(10px);
}
.game-screen .context-action.is-ready > .context-action-cta {
  animation: contextActionCtaPulse 1.45s ease-in-out infinite;
}
.game-screen .context-action-cta kbd {
  grid-column: 1;
  grid-row: 1 / 3;
  width: 34px;
  min-width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.78);
  border-bottom: 2px solid rgba(4,82,145,.78);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(238,246,252,.96));
  color: #0a73c4;
  font: 1000 12px/1 system-ui;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92);
}
.game-screen .context-action-cta i {
  grid-column: 2;
  grid-row: 1;
  display: grid;
  place-items: center start;
  opacity: .88;
  color: #f6fbff;
}
.game-screen .context-action-cta i svg {
  width: 13px;
  height: 13px;
}
.game-screen .context-action-cta b {
  grid-column: 2;
  grid-row: 2;
  justify-self: start;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.game-screen .context-action.has-creature-emoji > .context-action-cta {
  grid-template-rows: 1fr;
}
.game-screen .context-action.has-creature-emoji .context-action-cta i {
  display: none;
}
.game-screen .context-action.has-creature-emoji .context-action-cta b {
  grid-row: 1;
}
.game-screen .context-action.is-talk-action {
  --context-visual-border: rgba(118,199,255,.72);
  --context-visual-color: #2f9de9;
  --context-cta-surface: linear-gradient(180deg,rgba(92,178,243,.5),rgba(22,114,187,.78));
  --context-cta-border: rgba(152,220,255,.62);
  --context-cta-bottom: rgba(12,89,155,.74);
}
.game-screen .context-action.is-break-action {
  --context-visual-border: rgba(244,172,90,.8);
  --context-visual-color: #f0a149;
  --context-cta-surface: linear-gradient(180deg,rgba(255,191,111,.72),rgba(233,135,38,.9));
  --context-cta-border: rgba(255,218,166,.68);
  --context-cta-bottom: rgba(176,93,18,.82);
}
.game-screen .context-action.is-break-action .context-action-cta kbd {
  color: #b85f13;
}
.game-screen .context-action.is-quest-target {
  box-shadow: 0 18px 44px rgba(0,18,29,.33), 0 0 0 2px rgba(96,188,255,.13), inset 0 1px 0 rgba(255,255,255,.08);
}
.game-screen .context-action.is-quest-target::after {
  content: 'КВЕСТ';
  position: absolute;
  top: -8px;
  left: 18px;
  padding: 3px 8px;
  border: 1px solid rgba(152,214,255,.52);
  border-radius: 999px;
  background: rgba(237,248,255,.96);
  color: #157acc;
  font: 900 8px/1 system-ui;
  letter-spacing: .06em;
}
html[data-game-theme="light"] .game-screen .context-action {
  --context-surface: linear-gradient(160deg,rgba(247,252,255,.9),rgba(230,241,248,.86));
  --context-border: rgba(104,178,219,.34);
  --context-title: #173b54;
  --context-meta: rgba(63,105,133,.82);
  --context-visual-surface: linear-gradient(180deg,rgba(255,255,255,.98),rgba(240,246,250,.95));
  box-shadow: 0 16px 36px rgba(42,101,140,.15), inset 0 1px 0 rgba(255,255,255,.9);
}
html[data-game-theme="light"] .game-screen .context-action > .context-action-visual {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.96), 0 4px 10px rgba(28,73,100,.08);
}
html[data-game-theme="light"] .game-screen .context-action > .context-action-cta {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.32), 0 8px 16px rgba(44,128,188,.14);
}
@media (max-width:760px) {
  .game-screen .context-action {
    width: min(350px, calc(100vw - 14px));
    min-height: 62px;
    gap: 8px;
    padding: 6px;
    border-radius: 18px;
  }
  .game-screen .context-action > .context-action-visual {
    width: 46px;
    height: 46px;
  }
  .game-screen .context-action-copy b {
    font-size: 10px;
  }
  .game-screen .context-action-copy small {
    font-size: 7px;
  }
  .game-screen .context-action > .context-action-cta {
    min-width: 112px;
    height: 42px;
    padding: 0 10px;
    column-gap: 8px;
    border-radius: 13px;
  }
  .game-screen .context-action-cta kbd {
    width: 28px;
    min-width: 28px;
    height: 28px;
    font-size: 10px;
  }
  .game-screen .context-action-cta i svg {
    width: 12px;
    height: 12px;
  }
  .game-screen .context-action-cta b {
    font-size: 8px;
  }
  .game-screen .context-action.is-quest-target::after {
    top: -7px;
    left: 14px;
    font-size: 7px;
  }
}

/* v2.7.10 — rebuilt context action cards to match the compact glass CTA reference */
.game-screen .context-action {
  --ctx-surface: linear-gradient(165deg, rgba(11,59,66,.88), rgba(18,37,47,.92));
  --ctx-border: rgba(112,200,219,.22);
  --ctx-outline: rgba(255,255,255,.08);
  --ctx-title: #f7fbfe;
  --ctx-meta: rgba(218,233,240,.84);
  --ctx-visual-surface: radial-gradient(circle at 35% 30%, rgba(31,95,81,.54), rgba(9,32,40,.72));
  --ctx-visual-border: rgba(255,255,255,.1);
  --ctx-cta-surface: linear-gradient(180deg, rgba(43,145,238,.96), rgba(15,104,210,.97));
  --ctx-cta-top: rgba(255,255,255,.28);
  --ctx-cta-border: rgba(139,211,255,.62);
  --ctx-cta-shadow: rgba(5,95,173,.28);
  --ctx-key-bg: linear-gradient(180deg, rgba(248,251,255,.97), rgba(234,242,249,.96));
  --ctx-key-border: rgba(255,255,255,.82);
  --ctx-key-bottom: rgba(7,83,151,.62);
  --ctx-key-text: #1174cb;
  width: min(348px, calc(100vw - 26px));
  min-height: 68px;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--ctx-border);
  border-radius: 18px;
  background: var(--ctx-surface);
  color: var(--ctx-title);
  box-shadow: 0 14px 30px rgba(0,22,34,.22), inset 0 1px 0 var(--ctx-outline);
  backdrop-filter: blur(10px);
}
.game-screen .context-action.is-ready {
  border-color: rgba(124,211,240,.32);
  box-shadow: 0 16px 34px rgba(0,22,34,.24), 0 0 0 1px rgba(255,255,255,.04), inset 0 1px 0 rgba(255,255,255,.08);
}
.game-screen .context-action > .context-action-visual {
  width: 52px;
  height: 52px;
  border: 1px solid var(--ctx-visual-border);
  border-radius: 16px;
  background: var(--ctx-visual-surface);
  color: #f3c364;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.game-screen .context-action > .context-action-visual .ui-icon {
  width: 22px;
  height: 22px;
}
.game-screen .context-pokemon-emoji {
  width: 100%;
  height: 100%;
}
.game-screen .context-pokemon-emoji img {
  width: 82%;
  height: 82%;
  object-fit: contain;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.18));
}
.game-screen .context-action > .context-action-copy {
  gap: 2px;
}
.game-screen .context-action-copy b {
  color: var(--ctx-title);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.08;
}
.game-screen .context-action-copy small {
  color: var(--ctx-meta);
  font-size: 8px;
  line-height: 1.15;
}
.game-screen .context-action > .context-action-cta {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  min-width: 118px;
  height: 44px;
  padding: 0 14px 0 9px;
  border: 1px solid var(--ctx-cta-border);
  border-radius: 14px;
  background: var(--ctx-cta-surface);
  box-shadow: inset 0 1px 0 var(--ctx-cta-top), 0 8px 16px var(--ctx-cta-shadow);
}
.game-screen .context-action.is-ready > .context-action-cta {
  animation: contextActionCtaPulse 1.45s ease-in-out infinite;
}
.game-screen .context-action-cta kbd {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 34px;
  min-width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid var(--ctx-key-border);
  border-bottom: 2px solid var(--ctx-key-bottom);
  border-radius: 10px;
  background: var(--ctx-key-bg);
  color: var(--ctx-key-text);
  font: 1000 12px/1 system-ui;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92);
}
.game-screen .context-action-cta i {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  color: #f3fbff;
  opacity: .95;
}
.game-screen .context-action-cta i svg {
  width: 14px;
  height: 14px;
}
.game-screen .context-action-cta b {
  display: block;
  flex: 1 1 auto;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  text-align: left;
  white-space: nowrap;
}
.game-screen .context-action.has-creature-emoji .context-action-cta {
  min-width: 106px;
}
.game-screen .context-action.has-creature-emoji .context-action-cta i {
  display: none;
}
.game-screen .context-action.is-talk-action {
  --ctx-visual-surface: radial-gradient(circle at 35% 30%, rgba(70,143,203,.34), rgba(9,38,55,.7));
  --ctx-cta-surface: linear-gradient(180deg, rgba(79,174,241,.88), rgba(27,117,193,.82));
  --ctx-cta-border: rgba(171,226,255,.58);
  --ctx-cta-shadow: rgba(7,83,151,.2);
}
.game-screen .context-action.is-break-action {
  --ctx-visual-surface: radial-gradient(circle at 35% 30%, rgba(205,145,66,.36), rgba(57,33,18,.72));
  --ctx-cta-surface: linear-gradient(180deg, rgba(246,175,91,.95), rgba(223,124,38,.94));
  --ctx-cta-border: rgba(255,218,171,.64);
  --ctx-cta-shadow: rgba(156,83,21,.22);
  --ctx-key-text: #b86114;
}
.game-screen .context-action.is-battle-action {
  --ctx-visual-surface: radial-gradient(circle at 35% 30%, rgba(66,163,94,.35), rgba(9,33,40,.72));
}
.game-screen .context-action.is-quest-target::after {
  content: 'КВЕСТ';
  position: absolute;
  top: -7px;
  left: 14px;
  padding: 3px 8px;
  border: 1px solid rgba(148,211,255,.48);
  border-radius: 999px;
  background: rgba(244,250,255,.96);
  color: #1780d4;
  font: 900 8px/1 system-ui;
  letter-spacing: .05em;
}
html[data-game-theme="light"] .game-screen .context-action {
  --ctx-surface: linear-gradient(165deg, rgba(239,249,252,.88), rgba(222,238,244,.82));
  --ctx-border: rgba(97,160,190,.24);
  --ctx-outline: rgba(255,255,255,.8);
  --ctx-title: #1e445b;
  --ctx-meta: rgba(72,104,124,.88);
  --ctx-visual-surface: radial-gradient(circle at 35% 30%, rgba(176,212,198,.68), rgba(223,238,242,.92));
  box-shadow: 0 12px 24px rgba(35,92,123,.14), inset 0 1px 0 rgba(255,255,255,.92);
}
html[data-game-theme="light"] .game-screen .context-action > .context-action-visual {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 2px 6px rgba(53,102,131,.08);
}
html[data-game-theme="light"] .game-screen .context-action.is-talk-action {
  --ctx-visual-surface: radial-gradient(circle at 35% 30%, rgba(178,219,242,.78), rgba(221,238,247,.95));
  --ctx-cta-surface: linear-gradient(180deg, rgba(83,178,244,.84), rgba(31,123,204,.82));
}
html[data-game-theme="light"] .game-screen .context-action.is-break-action {
  --ctx-visual-surface: radial-gradient(circle at 35% 30%, rgba(240,212,175,.78), rgba(246,234,222,.95));
}
@media (max-width:760px) {
  .game-screen .context-action {
    width: min(332px, calc(100vw - 14px));
    min-height: 62px;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 16px;
  }
  .game-screen .context-action > .context-action-visual {
    width: 46px;
    height: 46px;
    border-radius: 14px;
  }
  .game-screen .context-action-copy b {
    font-size: 11px;
  }
  .game-screen .context-action-copy small {
    font-size: 7px;
  }
  .game-screen .context-action > .context-action-cta {
    min-width: 104px;
    height: 40px;
    gap: 7px;
    padding: 0 11px 0 7px;
    border-radius: 12px;
  }
  .game-screen .context-action-cta kbd {
    width: 30px;
    min-width: 30px;
    height: 30px;
    font-size: 10px;
  }
  .game-screen .context-action-cta i svg {
    width: 12px;
    height: 12px;
  }
  .game-screen .context-action-cta b {
    font-size: 9px;
  }
}

/* v2.7.13 — interaction polish: larger desktop CTA + simpler mobile attention */
.interaction-card {
  --ic-bg:linear-gradient(145deg,rgba(8,42,48,.90),rgba(13,28,37,.93));
  --ic-border:rgba(121,199,214,.22);
  --ic-title:rgba(255,255,255,.97);
  --ic-meta:rgba(211,228,235,.76);
  --ic-visual-bg:radial-gradient(circle at 35% 30%,rgba(43,95,78,.50),rgba(8,29,37,.72));
  --ic-visual-border:rgba(255,255,255,.10);
  --ic-cta-bg:linear-gradient(180deg,rgba(42,150,240,.96),rgba(12,99,207,.97));
  --ic-cta-border:rgba(132,205,255,.58);
  --ic-cta-bottom:rgba(4,74,145,.76);
  --ic-cta-shadow:rgba(4,87,164,.24);
  --ic-key-bg:linear-gradient(180deg,rgba(252,254,255,.98),rgba(234,243,249,.97));
  --ic-key-text:#1173c7;
  --ic-key-border:rgba(255,255,255,.84);
  --ic-key-bottom:rgba(5,74,140,.58);

  position:absolute;
  z-index:19;
  left:50%;
  right:auto;
  bottom:max(24px,env(safe-area-inset-bottom));
  display:grid;
  grid-template-columns:64px minmax(0,1fr) auto;
  grid-template-rows:1fr;
  align-items:center;
  gap:14px;
  width:min(440px,calc(100vw - 36px));
  min-width:0;
  min-height:84px;
  padding:10px 12px;
  transform:translate(-50%,10px) scale(.97);
  border:1px solid var(--ic-border);
  border-radius:20px;
  background:var(--ic-bg);
  color:var(--ic-title);
  box-shadow:0 15px 34px rgba(0,20,30,.27),inset 0 1px 0 rgba(255,255,255,.06);
  opacity:0;
  pointer-events:none;
  transition:opacity .16s ease,transform .16s ease,border-color .16s ease,box-shadow .16s ease;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  isolation:isolate;
}
.interaction-card.is-ready {
  transform:translateX(-50%);
  opacity:1;
  pointer-events:auto;
}
.interaction-card:hover > .interaction-card__cta {
  filter:brightness(1.06);
  transform:translateY(-1px);
}
.interaction-card:active > .interaction-card__cta {
  filter:brightness(.99);
  transform:translateY(1px) scale(.99);
}

.interaction-card__visual {
  grid-column:1;
  grid-row:1;
  display:grid;
  place-items:center;
  width:60px;
  height:60px;
  overflow:hidden;
  border:1px solid var(--ic-visual-border);
  border-radius:50%;
  background:var(--ic-visual-bg);
  color:#f3c55f;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.interaction-card__visual .ui-icon {
  width:24px;
  height:24px;
}
.interaction-card__visual .context-pokemon-emoji {
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
}
.interaction-card__visual .context-pokemon-emoji img {
  width:82%;
  height:82%;
  object-fit:contain;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.18));
}
.interaction-card__visual .interaction-fallback-badge {
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  font-style:normal;
}
.interaction-card__visual .interaction-fallback-badge span {
  display:block;
  font-size:27px;
  line-height:1;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.14));
}

.interaction-card__copy {
  grid-column:2;
  grid-row:1;
  display:grid;
  align-content:center;
  gap:4px;
  min-width:0;
  background:none;
  border:0;
  box-shadow:none;
  text-align:left;
}
.interaction-card__title {
  display:block;
  min-width:0;
  overflow:hidden;
  color:var(--ic-title);
  font-size:15px;
  font-weight:800;
  line-height:1.05;
  text-align:left;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.interaction-card__meta {
  display:block;
  min-width:0;
  overflow:hidden;
  color:var(--ic-meta);
  font-size:10px;
  font-weight:600;
  line-height:1.1;
  text-align:left;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.interaction-card__cta {
  grid-column:3;
  grid-row:1;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  min-width:156px;
  height:54px;
  padding:0 17px 0 9px;
  border:1px solid var(--ic-cta-border);
  border-bottom:2px solid var(--ic-cta-bottom);
  border-radius:15px;
  background:var(--ic-cta-bg);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 8px 17px var(--ic-cta-shadow);
  transition:transform .14s ease,filter .14s ease,box-shadow .14s ease;
}
.interaction-card.is-ready > .interaction-card__cta {
  animation:interactionCtaPulse 1.6s ease-in-out infinite;
}
.interaction-card__key {
  flex:0 0 auto;
  display:grid;
  place-items:center;
  width:38px;
  min-width:38px;
  height:38px;
  margin:0;
  padding:0;
  border:1px solid var(--ic-key-border);
  border-bottom:2px solid var(--ic-key-bottom);
  border-radius:10px;
  background:var(--ic-key-bg);
  color:var(--ic-key-text);
  font:1000 13px/1 system-ui;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92);
}
.interaction-card__action-icon {
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  width:15px;
  height:15px;
  color:#f5fbff;
  opacity:.94;
}
.interaction-card__action-icon .ui-icon {
  width:15px;
  height:15px;
}
.interaction-card__action-label {
  display:block;
  flex:1 1 auto;
  min-width:0;
  color:#fff;
  font-size:12px;
  font-weight:800;
  line-height:1;
  text-align:left;
  white-space:nowrap;
}
.interaction-card.has-creature-emoji .interaction-card__action-icon {
  display:none;
}
.interaction-card.has-creature-emoji .interaction-card__cta {
  min-width:138px;
}

.interaction-card.is-talk-action {
  --ic-visual-bg:radial-gradient(circle at 35% 30%,rgba(59,133,191,.34),rgba(8,35,50,.70));
  --ic-cta-bg:linear-gradient(180deg,rgba(73,169,239,.88),rgba(23,113,193,.84));
  --ic-cta-border:rgba(159,220,255,.56);
  --ic-cta-shadow:rgba(6,79,146,.18);
}
.interaction-card.is-break-action {
  --ic-visual-bg:radial-gradient(circle at 35% 30%,rgba(202,137,55,.36),rgba(53,31,17,.72));
  --ic-cta-bg:linear-gradient(180deg,rgba(244,173,88,.95),rgba(218,120,35,.94));
  --ic-cta-border:rgba(255,216,165,.62);
  --ic-cta-bottom:rgba(162,82,16,.82);
  --ic-cta-shadow:rgba(145,73,15,.20);
  --ic-key-text:#b75e14;
}
.interaction-card.is-battle-action {
  --ic-visual-bg:radial-gradient(circle at 35% 30%,rgba(180,74,67,.26),rgba(8,31,38,.72));
  --ic-cta-bg:linear-gradient(180deg,rgba(239,78,70,.97),rgba(190,40,45,.98));
  --ic-cta-border:rgba(255,151,143,.68);
  --ic-cta-bottom:rgba(119,19,29,.82);
  --ic-cta-shadow:rgba(171,34,41,.26);
  --ic-key-text:#c52f36;
  --ic-key-bottom:rgba(138,24,33,.58);
}
.interaction-card.is-quest-target::after {
  content:'КВЕСТ';
  position:absolute;
  z-index:2;
  top:-7px;
  left:15px;
  padding:2px 7px 3px;
  border:1px solid rgba(110,190,240,.52);
  border-radius:999px;
  background:rgba(27,124,197,.92);
  color:#fff;
  font:900 7px/1 system-ui;
  letter-spacing:.05em;
  box-shadow:0 3px 8px rgba(0,58,100,.12);
}

html[data-game-theme="light"] .interaction-card {
  --ic-bg:linear-gradient(145deg,rgba(239,249,252,.90),rgba(217,235,242,.85));
  --ic-border:rgba(84,150,181,.24);
  --ic-title:#173c53;
  --ic-meta:rgba(55,91,111,.75);
  --ic-visual-bg:radial-gradient(circle at 35% 30%,rgba(181,217,203,.70),rgba(222,238,243,.92));
  --ic-visual-border:rgba(75,137,166,.18);
  box-shadow:0 13px 28px rgba(38,93,121,.14),inset 0 1px 0 rgba(255,255,255,.90);
}
html[data-game-theme="light"] .interaction-card.is-talk-action {
  --ic-visual-bg:radial-gradient(circle at 35% 30%,rgba(174,218,241,.80),rgba(222,239,247,.95));
  --ic-cta-bg:linear-gradient(180deg,rgba(74,171,240,.88),rgba(24,116,199,.86));
}
html[data-game-theme="light"] .interaction-card.is-break-action {
  --ic-visual-bg:radial-gradient(circle at 35% 30%,rgba(239,211,173,.82),rgba(246,234,222,.96));
}

.is-battling .interaction-card {
  opacity:0 !important;
  pointer-events:none !important;
}

@keyframes interactionCtaPulse {
  0%,100% { filter:brightness(1); box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 8px 17px var(--ic-cta-shadow); }
  50% { filter:brightness(1.07); box-shadow:inset 0 1px 0 rgba(255,255,255,.31),0 10px 21px color-mix(in srgb,var(--ic-cta-shadow) 82%,transparent); }
}

@keyframes interactionMobileAttention {
  0%,100% { transform:scale(1); filter:brightness(1); }
  18% { transform:scale(1.025); filter:brightness(1.09); }
  36% { transform:scale(1); filter:brightness(1.02); }
}

@media (prefers-reduced-motion: reduce) {
  .interaction-card,
  .interaction-card__cta {
    transition:none !important;
    animation:none !important;
  }
}

/* Touch preset intentionally differs from desktop: right anchored, smaller, no keyboard keycap. */
@media (max-width:760px) {
  .interaction-card {
    left:auto;
    right:max(10px,env(safe-area-inset-right));
    bottom:calc(70px + env(safe-area-inset-bottom));
    grid-template-columns:40px minmax(0,1fr) auto;
    gap:8px;
    width:min(304px,calc(100vw - 16px));
    min-height:58px;
    padding:6px 8px;
    transform:translateY(8px) scale(.98);
    border-radius:15px;
    box-shadow:0 10px 22px rgba(0,20,30,.20),inset 0 1px 0 rgba(255,255,255,.05);
  }
  .interaction-card.is-ready {
    transform:none;
  }
  .interaction-card:hover > .interaction-card__cta,
  .interaction-card:active > .interaction-card__cta {
    transform:none;
  }
  .interaction-card__visual {
    width:40px;
    height:40px;
  }
  .interaction-card__visual .ui-icon {
    width:19px;
    height:19px;
  }
  .interaction-card__visual .interaction-fallback-badge span {
    font-size:22px;
  }
  .interaction-card__copy {
    gap:2px;
  }
  .interaction-card__title {
    font-size:11px;
  }
  .interaction-card__meta {
    font-size:7px;
  }
  .interaction-card__cta,
  .interaction-card.has-creature-emoji .interaction-card__cta {
    justify-content:center;
    min-width:100px;
    height:42px;
    gap:0;
    padding:0 11px;
    border-radius:11px;
  }
  .interaction-card__key,
  .interaction-card__action-icon {
    display:none;
  }
  .interaction-card__action-label {
    flex:0 1 auto;
    font-size:10px;
    text-align:center;
  }
  .interaction-card.is-ready > .interaction-card__cta {
    animation:interactionMobileAttention 1.65s ease-in-out infinite;
  }
  .interaction-card.is-quest-target::after {
    top:-6px;
    left:10px;
    padding:2px 6px;
    font-size:6px;
  }
}

@media (max-width:390px) {
  .interaction-card {
    width:min(286px,calc(100vw - 14px));
    grid-template-columns:38px minmax(0,1fr) auto;
    gap:6px;
    padding:5px 6px;
  }
  .interaction-card__visual {
    width:38px;
    height:38px;
  }
  .interaction-card__cta,
  .interaction-card.has-creature-emoji .interaction-card__cta {
    min-width:92px;
    height:40px;
    padding:0 9px;
  }
  .interaction-card__action-label {
    font-size:8px;
  }
}

@media (max-width:800px) and (max-height:610px) {
  .interaction-card {
    bottom:calc(62px + env(safe-area-inset-bottom));
  }
}

/* v2.7.13 — clearer adaptive quest objective with explicit remaining progress */
.game-screen .quest-widget {
  --qw-surface:linear-gradient(155deg,rgba(7,40,49,.93),rgba(10,50,57,.88));
  --qw-border:rgba(107,198,190,.28);
  --qw-title:#f7fbfc;
  --qw-copy:rgba(226,239,241,.86);
  --qw-muted:rgba(187,214,218,.76);
  --qw-accent:#6dd7a0;
  --qw-track:rgba(255,255,255,.11);
  --qw-progress:linear-gradient(90deg,#39bff0,#64d999);
  left:auto;
  right:max(18px,env(safe-area-inset-right));
  top:max(164px,calc(env(safe-area-inset-top) + 150px));
  width:clamp(286px,25vw,360px);
  display:grid;
  gap:7px;
  padding:14px 16px 15px;
  border:1px solid var(--qw-border);
  border-radius:18px;
  background:var(--qw-surface);
  color:var(--qw-title);
  box-shadow:0 16px 34px rgba(0,23,31,.24),inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.game-screen .quest-widget::before,
.game-screen .quest-widget::after {
  display:none;
}
.game-screen .quest-widget > #questWidgetState {
  color:var(--qw-accent);
  font-size:8px;
  font-weight:950;
  line-height:1;
  letter-spacing:1.15px;
}
.game-screen .quest-widget > #questWidgetTitle {
  color:var(--qw-title);
  font-size:clamp(17px,1.35vw,21px);
  font-weight:850;
  line-height:1.08;
  letter-spacing:-.25px;
}
.game-screen .quest-widget > #questWidgetDescription {
  display:-webkit-box;
  margin:0;
  overflow:hidden;
  color:var(--qw-copy);
  font-size:10px;
  line-height:1.35;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.game-screen .quest-widget-progress {
  display:grid;
  gap:5px;
  margin-top:2px;
}
.game-screen .quest-widget-progress-copy {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
}
.game-screen .quest-widget-progress-copy strong {
  color:var(--qw-title);
  font-size:9px;
  font-weight:850;
  line-height:1;
  white-space:nowrap;
}
.game-screen .quest-widget-progress-copy em {
  min-width:0;
  overflow:hidden;
  color:var(--qw-muted);
  font-size:8px;
  font-style:normal;
  font-weight:700;
  line-height:1;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-screen .quest-widget-progress-track {
  position:relative;
  height:6px;
  overflow:hidden;
  border-radius:999px;
  background:var(--qw-track);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.13);
}
.game-screen .quest-widget-progress-track > i {
  position:absolute;
  inset:0 auto 0 0;
  display:block;
  width:0;
  max-width:100%;
  border-radius:inherit;
  background:var(--qw-progress);
  box-shadow:0 0 10px rgba(73,196,198,.22);
  transition:width .24s ease;
}
.game-screen .quest-widget-progress.is-indeterminate .quest-widget-progress-track > i {
  width:28% !important;
  animation:questIndeterminate 1.8s ease-in-out infinite alternate;
}
.game-screen .quest-widget-progress.is-complete .quest-widget-progress-track > i {
  background:linear-gradient(90deg,#55d88b,#8be36c);
}
.game-screen .quest-widget-meta {
  position:static;
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:0;
}
.game-screen .quest-widget-meta span {
  min-height:20px;
  padding:0 7px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:var(--qw-muted);
  font-size:7px;
  font-weight:750;
}
.game-screen .quest-widget.is-ready {
  --qw-accent:#ffd56b;
  --qw-progress:linear-gradient(90deg,#58d48f,#b4e65f);
}
.game-screen .quest-widget.is-free {
  --qw-accent:#a6bdc4;
}
@keyframes questIndeterminate {
  from { transform:translateX(0); opacity:.62; }
  to { transform:translateX(245%); opacity:1; }
}
html[data-game-theme="light"] .game-screen .quest-widget {
  --qw-surface:linear-gradient(155deg,rgba(241,249,250,.92),rgba(222,239,241,.88));
  --qw-border:rgba(83,157,166,.25);
  --qw-title:#173f4d;
  --qw-copy:rgba(45,78,88,.84);
  --qw-muted:rgba(67,104,113,.74);
  --qw-accent:#16886d;
  --qw-track:rgba(64,122,135,.12);
  box-shadow:0 14px 30px rgba(39,91,103,.14),inset 0 1px 0 rgba(255,255,255,.9);
}
html[data-game-theme="light"] .game-screen .quest-widget-meta span {
  border-color:rgba(80,145,158,.16);
  background:rgba(255,255,255,.44);
}
@media (max-width:1180px) and (min-width:761px) {
  .game-screen .quest-widget {
    top:max(194px,calc(env(safe-area-inset-top) + 182px));
    width:clamp(278px,30vw,330px);
  }
}
@media (max-width:760px) {
  .game-screen .quest-widget {
    left:auto;
    right:max(8px,env(safe-area-inset-right));
    top:max(118px,calc(env(safe-area-inset-top) + 108px));
    width:min(268px,calc(100vw - 18px));
    gap:5px;
    padding:10px 11px 11px;
    border-radius:15px;
  }
  .game-screen .quest-widget > #questWidgetState {
    font-size:6px;
    letter-spacing:.85px;
  }
  .game-screen .quest-widget > #questWidgetTitle {
    font-size:14px;
    line-height:1.08;
  }
  .game-screen .quest-widget > #questWidgetDescription {
    display:-webkit-box;
    font-size:8px;
    line-height:1.3;
    -webkit-line-clamp:2;
  }
  .game-screen .quest-widget-progress {
    gap:4px;
  }
  .game-screen .quest-widget-progress-copy strong {
    font-size:8px;
  }
  .game-screen .quest-widget-progress-copy em {
    font-size:7px;
  }
  .game-screen .quest-widget-progress-track {
    height:4px;
  }
  .game-screen .quest-widget-meta {
    display:none;
  }
}
@media (max-width:390px) {
  .game-screen .quest-widget {
    width:min(250px,calc(100vw - 16px));
    padding:9px 10px 10px;
  }
  .game-screen .quest-widget > #questWidgetTitle {
    font-size:13px;
  }
  .game-screen .quest-widget > #questWidgetDescription {
    font-size:7.5px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .game-screen .quest-widget-progress-track > i {
    transition:none !important;
    animation:none !important;
  }
}

/* v2.7.14 — quest HUD hierarchy, touch action simplification and mobile chat previews */
.game-screen .quest-widget {
  --quest-card-width:clamp(304px,22vw,356px);
  right:max(24px,env(safe-area-inset-right));
  top:calc(max(18px,env(safe-area-inset-top)) + 188px);
  width:var(--quest-card-width);
  gap:8px;
  padding:15px 16px 14px;
  border-radius:19px;
  cursor:pointer;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease;
}
.game-screen .quest-widget:hover {
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--qw-accent) 34%,var(--qw-border));
  box-shadow:0 18px 38px rgba(0,23,31,.28),inset 0 1px 0 rgba(255,255,255,.07);
}
.game-screen .quest-widget-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
}
.game-screen .quest-widget-head > #questWidgetState {
  overflow:hidden;
  color:var(--qw-accent);
  font-size:8px;
  font-weight:950;
  line-height:1;
  letter-spacing:1.15px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-screen #questWidgetCounter {
  flex:0 0 auto;
  min-width:34px;
  padding:4px 7px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:var(--qw-muted);
  font:850 8px/1 system-ui;
  text-align:center;
}
.game-screen .quest-widget > #questWidgetTitle {
  font-size:clamp(19px,1.45vw,23px);
  line-height:1.06;
}
.game-screen .quest-widget > #questWidgetDescription {
  font-size:10px;
  line-height:1.38;
  -webkit-line-clamp:2;
}
.game-screen .quest-widget-target {
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:9px;
  min-width:0;
  padding:7px 9px 7px 7px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:13px;
  background:rgba(255,255,255,.045);
}
.game-screen .quest-widget-target-icon {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  overflow:hidden;
  border:1px solid rgba(113,204,213,.18);
  border-radius:11px;
  background:linear-gradient(145deg,rgba(54,135,139,.20),rgba(12,54,64,.34));
  color:#7dd6e8;
}
.game-screen .quest-widget-target-icon .quest-target-svg,
.game-screen .quest-widget-target-icon .quest-target-pokemon {
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
}
.game-screen .quest-widget-target-icon .ui-icon {
  width:19px;
  height:19px;
}
.game-screen .quest-widget-target-icon .quest-target-pokemon img {
  width:80%;
  height:80%;
  object-fit:contain;
}
.game-screen .quest-widget-target > span:last-child {
  display:grid;
  gap:3px;
  min-width:0;
}
.game-screen .quest-widget-target small {
  color:var(--qw-accent);
  font-size:6px;
  font-weight:900;
  letter-spacing:.75px;
}
.game-screen .quest-widget-target b {
  overflow:hidden;
  color:var(--qw-title);
  font-size:10px;
  font-weight:800;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-screen .quest-widget-progress-track {
  height:7px;
}
.game-screen .quest-widget-progress-copy strong {
  font-size:10px;
}
.game-screen .quest-widget-progress-copy em {
  font-size:8px;
}
.game-screen .quest-widget.is-progress-updated .quest-widget-progress-copy strong {
  animation:questProgressNumber 620ms ease;
}
.game-screen .quest-widget.is-progress-updated .quest-widget-progress-track > i {
  filter:brightness(1.16);
  box-shadow:0 0 14px rgba(91,218,177,.35);
}
.game-screen .quest-widget.is-new-objective {
  animation:questObjectiveArrive 360ms cubic-bezier(.2,.8,.2,1);
}
.game-screen .quest-widget.is-ready .quest-widget-target {
  border-color:rgba(136,216,127,.16);
  background:rgba(91,187,112,.07);
}
@keyframes questObjectiveArrive {
  from { opacity:.3; transform:translateY(-7px) scale(.985); }
  to { opacity:1; transform:none; }
}
@keyframes questProgressNumber {
  0%,100% { transform:scale(1); color:var(--qw-title); }
  45% { transform:scale(1.08); color:#8ce3b0; }
}
html[data-game-theme="light"] .game-screen #questWidgetCounter {
  border-color:rgba(80,145,158,.16);
  background:rgba(255,255,255,.48);
}
html[data-game-theme="light"] .game-screen .quest-widget-target {
  border-color:rgba(80,145,158,.14);
  background:rgba(255,255,255,.36);
}
html[data-game-theme="light"] .game-screen .quest-widget-target-icon {
  border-color:rgba(70,143,159,.16);
  background:linear-gradient(145deg,rgba(192,229,229,.72),rgba(228,242,245,.9));
  color:#187f99;
}

/* Mobile chat is a secondary HUD layer: quiet button + maximum three transient messages. */
.mobile-chat-feed {
  display:none;
}
@media (max-width:800px) {
  .game-screen .mobile-actions {
    right:max(11px,env(safe-area-inset-right));
    bottom:calc(148px + env(safe-area-inset-bottom));
    z-index:21;
  }
  .game-screen .mobile-chat-button {
    position:relative;
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    border:1px solid rgba(135,201,231,.24);
    border-radius:15px;
    background:linear-gradient(145deg,rgba(8,51,68,.78),rgba(8,35,49,.84));
    color:rgba(235,248,253,.92);
    box-shadow:0 9px 20px rgba(0,26,39,.20),inset 0 1px 0 rgba(255,255,255,.06);
    backdrop-filter:blur(9px);
    -webkit-backdrop-filter:blur(9px);
  }
  .game-screen .mobile-chat-button > span {
    display:grid;
    place-items:center;
  }
  .game-screen .mobile-chat-button .ui-icon {
    width:20px;
    height:20px;
  }
  .game-screen #mobileChatBadge {
    position:absolute;
    top:-5px;
    right:-4px;
    display:grid;
    place-items:center;
    min-width:17px;
    height:17px;
    padding:0 4px;
    border:2px solid rgba(8,39,52,.92);
    border-radius:999px;
    background:#28a9ec;
    color:#fff;
    font:900 8px/1 system-ui;
  }
  .game-screen #mobileChatBadge:empty,
  .game-screen #mobileChatBadge:is([data-empty="true"]),
  .game-screen #mobileChatBadge:not(:where(:has(*))) {
    /* text content controls visibility below through a zero-value selector fallback */
  }
  .game-screen .mobile-chat-feed {
    position:absolute;
    z-index:20;
    right:max(11px,env(safe-area-inset-right));
    bottom:calc(204px + env(safe-area-inset-bottom));
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:6px;
    width:min(258px,calc(100vw - 28px));
    pointer-events:none;
  }
  .game-screen .mobile-chat-preview {
    display:grid;
    grid-template-columns:30px minmax(0,1fr);
    align-items:center;
    gap:7px;
    width:min(246px,100%);
    padding:6px 9px 6px 6px;
    transform:translateX(9px) scale(.985);
    border:1px solid rgba(126,195,222,.18);
    border-radius:12px;
    background:linear-gradient(145deg,rgba(5,37,50,.84),rgba(7,28,40,.80));
    box-shadow:0 8px 18px rgba(0,24,36,.16),inset 0 1px 0 rgba(255,255,255,.05);
    opacity:0;
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    transition:opacity .2s ease,transform .2s ease;
  }
  .game-screen .mobile-chat-preview.is-visible {
    transform:none;
    opacity:1;
  }
  .game-screen .mobile-chat-preview.is-leaving {
    transform:translateY(-5px);
    opacity:0;
  }
  .game-screen .mobile-chat-preview > i {
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    overflow:hidden;
    border-radius:9px;
    background:rgba(72,151,184,.14);
    color:#dff5ff;
    font:850 10px/1 system-ui;
  }
  .game-screen .mobile-chat-preview > i img {
    width:18px;
    height:18px;
    object-fit:contain;
  }
  .game-screen .mobile-chat-preview > span {
    display:grid;
    gap:2px;
    min-width:0;
  }
  .game-screen .mobile-chat-preview b {
    overflow:hidden;
    color:#eaf8fd;
    font-size:8px;
    line-height:1;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .game-screen .mobile-chat-preview p {
    display:-webkit-box;
    margin:0;
    overflow:hidden;
    color:rgba(216,234,241,.82);
    font-size:8px;
    line-height:1.25;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }
  html[data-game-theme="light"] .game-screen .mobile-chat-button {
    border-color:rgba(87,158,190,.22);
    background:linear-gradient(145deg,rgba(239,249,252,.86),rgba(218,237,244,.82));
    color:#21617e;
    box-shadow:0 8px 18px rgba(45,99,126,.12),inset 0 1px 0 rgba(255,255,255,.8);
  }
  html[data-game-theme="light"] .game-screen #mobileChatBadge {
    border-color:rgba(232,245,250,.96);
  }
  html[data-game-theme="light"] .game-screen .mobile-chat-preview {
    border-color:rgba(88,159,190,.18);
    background:linear-gradient(145deg,rgba(239,249,252,.90),rgba(222,239,245,.86));
    box-shadow:0 8px 17px rgba(48,100,126,.10),inset 0 1px 0 rgba(255,255,255,.82);
  }
  html[data-game-theme="light"] .game-screen .mobile-chat-preview b { color:#17425a; }
  html[data-game-theme="light"] .game-screen .mobile-chat-preview p { color:rgba(54,91,111,.78); }

  /* Touch interaction intentionally removes descriptive copy: icon + one obvious action. */
  .game-screen .interaction-card {
    left:auto;
    right:max(11px,env(safe-area-inset-right));
    bottom:calc(72px + env(safe-area-inset-bottom));
    grid-template-columns:44px auto;
    gap:8px;
    width:max-content;
    max-width:calc(100vw - 18px);
    min-height:58px;
    padding:6px 7px;
    border-radius:16px;
  }
  .game-screen .interaction-card__copy {
    display:none;
  }
  .game-screen .interaction-card__visual {
    grid-column:1;
    width:44px;
    height:44px;
  }
  .game-screen .interaction-card__cta,
  .game-screen .interaction-card.has-creature-emoji .interaction-card__cta {
    grid-column:2;
    justify-content:center;
    min-width:116px;
    height:46px;
    padding:0 14px;
    border-radius:13px;
  }
  .game-screen .interaction-card__action-label {
    font-size:12px;
    font-weight:850;
    text-align:center;
  }
  .game-screen .interaction-card.is-ready > .interaction-card__cta {
    animation:interactionMobileAttention 1.75s ease-in-out infinite;
  }

  /* Phone quest tracker is a compact summary below the minimap; tap opens the full quest panel. */
  .game-screen .quest-widget {
    right:max(8px,env(safe-area-inset-right));
    top:calc(max(8px,env(safe-area-inset-top)) + 110px);
    width:min(248px,calc(100vw - 18px));
    gap:5px;
    padding:9px 10px 10px;
    border-radius:15px;
  }
  .game-screen .quest-widget:hover {
    transform:none;
  }
  .game-screen .quest-widget-head > #questWidgetState {
    font-size:6px;
    letter-spacing:.75px;
  }
  .game-screen #questWidgetCounter {
    min-width:28px;
    padding:3px 6px;
    font-size:7px;
  }
  .game-screen .quest-widget > #questWidgetTitle {
    font-size:13px;
    line-height:1.06;
  }
  .game-screen .quest-widget > #questWidgetDescription,
  .game-screen .quest-widget-meta {
    display:none;
  }
  .game-screen .quest-widget-target {
    grid-template-columns:27px minmax(0,1fr);
    gap:6px;
    padding:4px 6px 4px 4px;
    border-radius:10px;
  }
  .game-screen .quest-widget-target-icon {
    width:26px;
    height:26px;
    border-radius:8px;
  }
  .game-screen .quest-widget-target-icon .ui-icon {
    width:14px;
    height:14px;
  }
  .game-screen .quest-widget-target small {
    display:none;
  }
  .game-screen .quest-widget-target b {
    font-size:8px;
  }
  .game-screen .quest-widget-progress {
    gap:3px;
    margin:0;
  }
  .game-screen .quest-widget-progress-copy strong {
    font-size:8px;
  }
  .game-screen .quest-widget-progress-copy em {
    max-width:125px;
    font-size:7px;
  }
  .game-screen .quest-widget-progress-track {
    height:4px;
  }
}

@media (max-width:390px) {
  .game-screen .quest-widget {
    width:min(226px,calc(100vw - 14px));
  }
  .game-screen .interaction-card__cta,
  .game-screen .interaction-card.has-creature-emoji .interaction-card__cta {
    min-width:106px;
  }
  .game-screen .mobile-chat-feed {
    width:min(224px,calc(100vw - 22px));
  }
}

@media (max-width:800px) and (max-height:610px) {
  .game-screen .quest-widget-target {
    display:none;
  }
  .game-screen .mobile-chat-feed {
    bottom:calc(190px + env(safe-area-inset-bottom));
  }
  .game-screen .mobile-chat-feed .mobile-chat-preview:nth-last-child(n+2) {
    display:none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .game-screen .quest-widget,
  .game-screen .quest-widget *,
  .game-screen .mobile-chat-preview,
  .game-screen .interaction-card__cta {
    animation:none !important;
    transition:none !important;
  }
}

/* v2.7.15 — readable quest tracker, safe minimap spacing and touch-native tutorial */
.game-screen .quest-widget {
  --quest-card-width:clamp(292px,21vw,332px);
  right:max(22px,env(safe-area-inset-right));
  top:calc(max(14px,env(safe-area-inset-top)) + 222px);
  width:var(--quest-card-width);
  gap:7px;
  padding:13px 14px 12px;
  border-radius:18px;
  box-shadow:0 16px 34px rgba(0,23,31,.24),inset 0 1px 0 rgba(255,255,255,.065);
}
.game-screen .quest-widget-head > #questWidgetState {
  font-size:7.5px;
  letter-spacing:.95px;
}
.game-screen #questWidgetCounter {
  min-width:36px;
  padding:4px 7px;
  font-size:8px;
}
.game-screen .quest-widget > #questWidgetTitle {
  font-size:clamp(18px,1.3vw,21px);
  line-height:1.08;
  text-wrap:balance;
}
.game-screen .quest-widget > #questWidgetDescription {
  display:-webkit-box;
  margin:0;
  overflow:hidden;
  color:var(--qw-muted);
  font-size:10px;
  font-weight:650;
  line-height:1.34;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.game-screen .quest-widget-target {
  grid-template-columns:40px minmax(0,1fr);
  gap:9px;
  padding:7px 9px 7px 7px;
  border-radius:13px;
}
.game-screen .quest-widget-target-icon {
  width:38px;
  height:38px;
  border-radius:11px;
}
.game-screen .quest-widget-target-icon .quest-target-emoji {
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  font-size:20px;
  line-height:1;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.13));
}
.game-screen .quest-widget-target small {
  font-size:6.5px;
  letter-spacing:.7px;
}
.game-screen .quest-widget-target b {
  display:-webkit-box;
  overflow:hidden;
  font-size:11px;
  line-height:1.22;
  white-space:normal;
  text-overflow:clip;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.game-screen .quest-widget-progress {
  gap:5px;
  margin:0;
}
.game-screen .quest-widget-progress-copy {
  gap:10px;
}
.game-screen .quest-widget-progress-copy strong {
  flex:0 0 auto;
  font-size:9px;
}
.game-screen .quest-widget-progress-copy em {
  min-width:0;
  max-width:65%;
  overflow:hidden;
  font-size:8px;
  line-height:1.15;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-screen .quest-widget.is-step .quest-widget-progress-copy strong {
  color:var(--qw-accent);
}
.game-screen .quest-widget-progress-track {
  height:6px;
}
.game-screen .quest-widget-meta {
  margin-top:1px;
}
.game-screen .quest-widget-meta span {
  min-height:22px;
  padding:0 8px;
  font-size:7px;
}

/* Mid-size desktop/laptop: keep a real gap below the 168px minimap. */
@media (max-width:1180px) and (min-width:761px) and (pointer:fine) {
  .game-screen .quest-widget {
    right:max(18px,env(safe-area-inset-right));
    top:calc(max(14px,env(safe-area-inset-top)) + 190px);
    width:clamp(274px,27vw,306px);
  }
  .game-screen .quest-widget > #questWidgetTitle { font-size:18px; }
  .game-screen .quest-widget-target b { font-size:10px; }
}

/* Touch tutorial has its own truthful controls; no keyboard labels are exposed on phones/tablets. */
.controls-tutorial-desktop { display:block; }
.controls-tutorial-mobile { display:none; }
.controls-tutorial-dismiss { display:block; margin-top:10px; }
.controls-tutorial-card {
  width:100%;
}

@media (max-width:760px) {
  .controls-tutorial {
    left:max(10px,env(safe-area-inset-left));
    bottom:calc(78px + env(safe-area-inset-bottom));
    width:min(342px,calc(100vw - 20px - env(safe-area-inset-left) - env(safe-area-inset-right)));
    transform:translateY(12px);
  }
  .controls-tutorial.is-open { transform:none; }
  .controls-tutorial-card {
    padding:13px;
    border-radius:18px;
  }
  .controls-tutorial-card header b {
    margin-top:3px;
    font-size:16px;
    line-height:1.08;
  }
  .controls-tutorial-card header small {
    font-size:7px;
  }
  .controls-tutorial-card header button {
    width:32px;
    height:32px;
    flex:0 0 auto;
  }
  .controls-tutorial-desktop { display:none; }
  .controls-tutorial-mobile {
    display:grid;
    gap:8px;
    margin-top:10px;
  }
  .controls-tutorial-mobile article {
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    align-items:center;
    gap:9px;
    padding:8px;
    border:1px solid color-mix(in srgb,var(--theme-border) 72%,transparent);
    border-radius:13px;
    background:color-mix(in srgb,var(--theme-surface-soft) 78%,transparent);
  }
  .controls-tutorial-mobile article > i {
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    border-radius:12px;
    background:color-mix(in srgb,var(--theme-accent) 12%,var(--theme-surface-soft));
    font-size:21px;
    font-style:normal;
  }
  .controls-tutorial-mobile article > span {
    display:grid;
    gap:3px;
    min-width:0;
  }
  .controls-tutorial-mobile article b {
    color:var(--theme-text);
    font-size:11px;
    font-weight:900;
    line-height:1.1;
  }
  .controls-tutorial-mobile article small {
    color:var(--theme-muted);
    font-size:9px;
    font-weight:650;
    line-height:1.3;
  }
  .controls-tutorial-dismiss {
    margin-top:9px !important;
    color:var(--theme-muted) !important;
    font-size:8px !important;
    line-height:1.25;
  }

  /* Compact quest summary lives below the 102px minimap instead of competing with it. */
  .game-screen .quest-widget {
    right:max(8px,env(safe-area-inset-right));
    top:calc(max(8px,env(safe-area-inset-top)) + 116px);
    width:min(222px,calc(100vw - 20px));
    gap:5px;
    padding:9px 10px 9px;
    border-radius:15px;
  }
  .game-screen .quest-widget-head > #questWidgetState {
    font-size:7px;
    letter-spacing:.6px;
  }
  .game-screen #questWidgetCounter {
    min-width:29px;
    padding:3px 6px;
    font-size:7px;
  }
  .game-screen .quest-widget > #questWidgetTitle {
    font-size:13px;
    line-height:1.1;
    -webkit-line-clamp:2;
  }
  .game-screen .quest-widget > #questWidgetDescription,
  .game-screen .quest-widget-meta {
    display:none;
  }
  .game-screen .quest-widget-target {
    grid-template-columns:30px minmax(0,1fr);
    gap:7px;
    padding:5px 6px 5px 5px;
    border-radius:11px;
  }
  .game-screen .quest-widget-target-icon {
    width:30px;
    height:30px;
    border-radius:9px;
  }
  .game-screen .quest-widget-target-icon .quest-target-emoji {
    font-size:17px;
  }
  .game-screen .quest-widget-target small {
    display:none;
  }
  .game-screen .quest-widget-target b {
    font-size:9px;
    line-height:1.18;
    -webkit-line-clamp:2;
  }
  .game-screen .quest-widget-progress {
    gap:4px;
  }
  .game-screen .quest-widget-progress-copy strong {
    font-size:8px;
  }
  .game-screen .quest-widget-progress-copy em {
    max-width:128px;
    font-size:7.5px;
  }
  .game-screen .quest-widget-progress-track {
    height:4px;
  }
}

@media (max-width:390px) {
  .game-screen .quest-widget {
    width:min(206px,calc(100vw - 16px));
  }
  .controls-tutorial {
    width:calc(100vw - 16px - env(safe-area-inset-left) - env(safe-area-inset-right));
    left:max(8px,env(safe-area-inset-left));
  }
}

@media (max-width:800px) and (max-height:610px) {
  .controls-tutorial-mobile { gap:5px; }
  .controls-tutorial-mobile article { padding:6px; }
  .controls-tutorial-mobile article small { -webkit-line-clamp:2; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; }
  .game-screen .quest-widget-target { display:grid; }
}

@media (prefers-reduced-motion:reduce) {
  .controls-tutorial,
  .controls-tutorial * { animation:none !important; transition:none !important; }
}

/* Research City / Genetics Lab v33 */
.game-screen .side-panel.is-genetics-lab-panel {
  width:min(760px,calc(100vw - 64px));
  padding:14px;
  overflow:hidden;
  background:linear-gradient(145deg,rgba(248,253,255,.985),rgba(238,248,250,.98));
  border-color:rgba(102,193,218,.52);
}
.is-genetics-lab-panel #sidePanelContent { height:100%;min-width:0;overflow:hidden; }
.genetics-lab-window { --lab-blue:#168fca;--lab-cyan:#54d8dc;--lab-ink:#12384a;--lab-soft:#eaf7f9;height:100%;min-width:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:10px;color:var(--lab-ink); }
.genetics-lab-hero { position:relative;min-width:0;display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:13px;align-items:center;padding:14px 16px;border-radius:20px;color:white;overflow:hidden;background:linear-gradient(120deg,#087bb9,#2eb4cc 56%,#62d6bd);box-shadow:0 13px 30px rgba(12,101,142,.22); }
.genetics-lab-hero::after { content:"";position:absolute;inset:-90px -40px auto 43%;height:170px;border:1px solid rgba(255,255,255,.22);border-radius:50%;transform:rotate(-12deg); }
.genetics-lab-mark { position:relative;z-index:1;width:58px;height:58px;display:grid;place-items:center;border-radius:17px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.38);box-shadow:inset 0 1px rgba(255,255,255,.35); }
.genetics-lab-mark .ui-icon { width:34px;height:34px; }
.genetics-lab-hero > div { position:relative;z-index:1;min-width:0; }
.genetics-lab-hero small { display:block;font-size:10px;font-weight:900;letter-spacing:.14em;opacity:.83; }
.genetics-lab-hero h2 { margin:2px 0 1px;font-size:27px;line-height:1;font-weight:950;letter-spacing:-.035em; }
.genetics-lab-hero p { margin:4px 0 0;font-size:12px;font-weight:700;opacity:.88; }
.genetics-lab-hero > strong { position:relative;z-index:1;display:flex;align-items:center;gap:6px;padding:9px 12px;border-radius:13px;background:rgba(6,61,89,.25);font-size:14px;white-space:nowrap; }
.genetics-lab-hero > strong .ui-icon { width:18px;height:18px; }
.genetics-lab-tabs { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;padding:4px;border-radius:16px;background:rgba(142,201,215,.17);border:1px solid rgba(91,166,188,.22); }
.genetics-lab-tabs button { min-width:0;min-height:46px;display:flex;align-items:center;justify-content:center;gap:7px;border:0;border-radius:12px;background:transparent;color:#557687;font:850 11px/1 inherit;cursor:pointer; }
.genetics-lab-tabs button:hover { background:rgba(255,255,255,.72);color:#167eaf; }
.genetics-lab-tabs button.is-active { color:#087caf;background:white;box-shadow:0 5px 14px rgba(22,92,124,.13); }
.genetics-lab-tabs .ui-icon { width:19px;height:19px;flex:0 0 auto; }
.lab-service-panel { min-width:0;min-height:0;overflow:hidden auto;padding:15px;border:1px solid rgba(94,169,190,.27);border-radius:18px;background:rgba(255,255,255,.82);box-shadow:inset 0 1px rgba(255,255,255,.85);scrollbar-width:thin;scrollbar-color:#9dd6df transparent; }
.lab-section-heading { min-width:0;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:5px; }
.lab-section-heading > span { min-width:0; }
.lab-section-heading small { display:block;font-size:9px;font-weight:950;letter-spacing:.15em;color:#30a1ba; }
.lab-section-heading h3 { margin:2px 0 0;font-size:20px;line-height:1.1;letter-spacing:-.02em; }
.lab-section-heading > em { display:flex;align-items:center;gap:5px;padding:6px 9px;border-radius:10px;background:#e9f7fa;color:#1687a5;font-style:normal;font-size:12px;font-weight:950;white-space:nowrap; }
.lab-section-heading > em .ui-icon { width:15px;height:15px; }
.lab-section-heading > button,.lab-primary-action { min-height:40px;padding:0 13px;border:1px solid #7fc8da;border-radius:12px;background:linear-gradient(#f7fdff,#daf3f8);color:#087cab;font:900 11px/1 inherit;cursor:pointer; }
.lab-section-heading > button:disabled,.lab-primary-action:disabled { opacity:.48;cursor:not-allowed;filter:grayscale(.35); }
.lab-section-note { margin:4px 0 12px;color:#6b8794;font-size:11px;font-weight:650;line-height:1.4; }
.lab-clinic-list,.lab-reserve-list,.lab-incubator-list { display:grid;gap:8px; }
.lab-clinic-card { min-width:0;display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 10px;border:1px solid #d2e8ed;border-radius:15px;background:linear-gradient(100deg,#fff,#f5fbfc); }
.lab-clinic-card.needs-care { border-color:#a7dce5;box-shadow:0 5px 14px rgba(43,122,148,.07); }
.lab-pokemon-portrait { width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#e8f7fa;border:1px solid #b9dfe8;overflow:hidden; }
.lab-pokemon-portrait img { width:88%;height:88%;object-fit:contain;transform:scale(var(--profile-scale,1)); }
.lab-clinic-copy { min-width:0;display:grid;gap:5px; }
.lab-clinic-copy > span { min-width:0;display:flex;align-items:baseline;justify-content:space-between;gap:8px; }
.lab-clinic-copy b { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px; }
.lab-clinic-copy small { color:#76909b;font-size:9px;font-weight:850;white-space:nowrap; }
.lab-condition-row { display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:6px; }
.lab-condition-row > small { color:#299b70;font-weight:950; }
.lab-condition-row > i { height:7px;overflow:hidden;border-radius:99px;background:#d7e9e7;box-shadow:inset 0 1px 2px rgba(23,79,87,.15); }
.lab-condition-row > i > em { display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#47d18d,#77df8d); }
.lab-condition-meta { display:flex;gap:10px;color:#6f8790;font-size:9px;font-weight:750; }
.lab-condition-meta .has-status { color:#db6b56; }
.lab-clinic-card > button { min-width:76px;min-height:38px;display:flex;align-items:center;justify-content:center;gap:4px;border:1px solid #9bd2df;border-radius:11px;background:white;color:#1384a5;font:950 11px/1 inherit; }
.lab-clinic-card > button .ui-icon { width:15px;height:15px; }
.lab-clinic-card > button:disabled { color:#6f9998;background:#edf6f5;border-color:#d8e9e6; }
.lab-team-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:11px; }
.lab-team-slot { min-width:0;display:grid;grid-template-columns:30px 48px minmax(0,1fr) auto;align-items:center;gap:7px;padding:8px;border:1px solid #d4e8ed;border-radius:14px;background:#fbfeff; }
.lab-team-slot.is-lead { border-color:#5fc9db;box-shadow:inset 3px 0 #29b8ce; }
.lab-team-slot > strong { color:#a0b7bf;font-size:11px; }
.lab-team-portrait,.lab-reserve-portrait { width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:#eaf7f9;border:1px solid #c6e3e9;overflow:hidden; }
.lab-team-portrait img,.lab-reserve-portrait img { width:88%;height:88%;object-fit:contain;transform:scale(var(--profile-scale,1)); }
.lab-team-slot > span,.lab-reserve-card > span { min-width:0;display:grid; }
.lab-team-slot b,.lab-reserve-card b { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px; }
.lab-team-slot small,.lab-reserve-card small { color:#748d98;font-size:9px;font-weight:750; }
.lab-team-slot > div { display:grid;gap:3px; }
.lab-team-slot button,.lab-reserve-card button { min-height:28px;padding:0 7px;border:1px solid #b7dbe4;border-radius:8px;background:#f3fbfd;color:#2185a0;font:850 9px/1 inherit; }
.lab-team-slot.is-empty { min-height:63px;grid-template-columns:30px 28px 1fr;color:#8aa1aa;border-style:dashed;background:rgba(238,248,249,.65); }
.lab-team-slot.is-empty .ui-icon { width:22px;height:22px; }
.lab-subheading { display:flex;justify-content:space-between;margin:14px 2px 7px;color:#4e727f; }
.lab-subheading b { font-size:12px; }.lab-subheading small { font-size:10px;font-weight:800; }
.lab-reserve-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
.lab-reserve-card { min-width:0;display:grid;grid-template-columns:44px minmax(0,1fr) auto 34px;align-items:center;gap:7px;padding:7px;border:1px solid #d9e9ed;border-radius:13px;background:#fff; }
.lab-reserve-card > button:last-child { width:34px;padding:0;display:grid;place-items:center; }
.lab-reserve-card > button:last-child .ui-icon { width:17px;height:17px; }
.lab-gene-rule { display:grid;grid-template-columns:50px 1fr;gap:10px;align-items:center;margin:10px 0 14px;padding:11px;border-radius:15px;color:#225d70;background:linear-gradient(120deg,#e8f8fb,#f1fbf6);border:1px solid #bde5e5; }
.lab-gene-rule > span { width:46px;height:46px;display:grid;place-items:center;border-radius:14px;color:#16a1bd;background:white;box-shadow:0 5px 13px rgba(20,116,139,.11); }
.lab-gene-rule .ui-icon { width:27px;height:27px; }
.lab-gene-rule b { font-size:12px; }.lab-gene-rule p { margin:3px 0 0;font-size:10px;line-height:1.35;color:#65838d;font-weight:650; }
.lab-parent-grid { display:grid;grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr);align-items:end;gap:8px; }
.lab-parent-grid label { min-width:0;display:grid;gap:5px; }
.lab-parent-grid label > span { font-size:9px;font-weight:950;letter-spacing:.12em;color:#6f909c; }
.lab-parent-grid select { width:100%;height:43px;padding:0 10px;border:1px solid #afd8e2;border-radius:11px;background:white;color:#244d5d;font:800 11px/1 inherit;outline:none; }
.lab-parent-grid select:focus { border-color:#36afd0;box-shadow:0 0 0 3px rgba(54,175,208,.13); }
.lab-parent-grid > i { width:38px;height:38px;display:grid;place-items:center;border-radius:50%;color:#ef7085;background:#fff0f3;border:1px solid #f5bec8; }
.lab-parent-grid > i .ui-icon { width:21px;height:21px; }
.lab-compatibility { display:grid;grid-template-columns:38px 1fr;gap:9px;align-items:center;margin:11px 0;padding:10px;border:1px solid #d9e6e9;border-radius:13px;background:#f8fbfc; }
.lab-compatibility > span { width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:white;color:#7997a1; }
.lab-compatibility .ui-icon { width:20px;height:20px; }
.lab-compatibility b { font-size:12px; }.lab-compatibility p { margin:2px 0 0;color:#718993;font-size:10px;font-weight:650; }
.lab-compatibility.is-good,.lab-compatibility.is-excellent { border-color:#a9e1cd;background:#effaf5; }.lab-compatibility.is-good > span,.lab-compatibility.is-excellent > span { color:#1fa878; }.lab-compatibility.is-blocked { border-color:#f0c4c4;background:#fff4f3; }.lab-compatibility.is-blocked > span { color:#de6262; }
.lab-breeding-facts { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:10px 0; }
.lab-breeding-facts > span { min-width:0;padding:9px;border-radius:11px;background:#f1f8fa;border:1px solid #d9e9ed; }
.lab-breeding-facts small { display:block;color:#78919b;font-size:8px;font-weight:900;letter-spacing:.1em; }.lab-breeding-facts b { display:block;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px; }
.lab-primary-action { width:100%;min-height:46px;display:flex;align-items:center;justify-content:center;gap:8px;color:white;border-color:#168db8;background:linear-gradient(100deg,#168fc7,#3dc4bd);box-shadow:0 8px 18px rgba(21,137,173,.18); }
.lab-primary-action .ui-icon { width:20px;height:20px; }
.lab-incubator-list { grid-template-columns:repeat(3,minmax(0,1fr)); }
.lab-incubator-slot { min-width:0;min-height:230px;display:grid;grid-template-rows:72px minmax(0,1fr) 38px;gap:8px;padding:12px;border:1px solid #bfe0e7;border-radius:17px;background:linear-gradient(155deg,#f8fdff,#eef9f7);overflow:hidden; }
.lab-incubator-slot.is-ready { border-color:#62cba4;box-shadow:0 8px 22px rgba(26,152,112,.14),inset 0 0 24px rgba(100,225,172,.11); }
.lab-egg-visual,.lab-empty-cradle { width:66px;height:66px;display:grid;place-items:center;margin:auto;border-radius:50%;color:#38a7bf;background:radial-gradient(circle at 35% 30%,#fff,#dff5f2 65%,#bfe5e7);border:1px solid #b3dce3;box-shadow:0 8px 18px rgba(27,112,139,.13); }
.lab-egg-visual .ui-icon,.lab-empty-cradle .ui-icon { width:38px;height:38px; }
.lab-incubator-slot.is-ready .lab-egg-visual { color:#20a873;animation:labEggReady 1.8s ease-in-out infinite; }
.lab-egg-copy { min-width:0;text-align:center; }
.lab-egg-copy > small,.lab-incubator-slot.is-empty small { color:#73909a;font-size:8px;font-weight:950;letter-spacing:.09em; }
.lab-egg-copy > b,.lab-incubator-slot.is-empty b { display:block;margin-top:3px;font-size:12px; }
.lab-egg-copy > p,.lab-incubator-slot.is-empty p { margin:3px 0;color:#7a919a;font-size:9px;line-height:1.3;font-weight:650; }
.lab-egg-meta { display:flex;justify-content:center;gap:5px;margin:7px 0;flex-wrap:wrap; }
.lab-egg-meta span { padding:3px 6px;border-radius:7px;background:white;border:1px solid #d4e9ed;color:#62818d;font-size:8px;font-weight:900;text-transform:uppercase; }
.lab-egg-meta span.is-excellent { color:#168f67;border-color:#a8dcc9; }.lab-egg-meta span.is-good { color:#1688a5;border-color:#addce6; }
.lab-egg-copy time { display:block;color:#137f9d;font-size:11px;font-weight:950; }.lab-egg-copy time.is-ready { color:#149864; }
.lab-incubator-slot > button { min-height:38px;border:1px solid #8acddd;border-radius:11px;background:white;color:#1386a7;font:950 10px/1 inherit; }.lab-incubator-slot > button:disabled { opacity:.52; }
.lab-incubator-slot.is-empty { display:grid;grid-template-rows:72px 1fr;text-align:center;border-style:dashed; }.lab-incubator-slot.is-empty > div { align-self:center; }
.lab-empty-state { grid-column:1/-1;padding:18px;border:1px dashed #c8e0e5;border-radius:13px;text-align:center;color:#78919a;font-size:11px;font-weight:750; }
.lab-shop-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px; }
.lab-shop-card { min-width:0;display:grid;grid-template-columns:58px minmax(0,1fr) 76px;align-items:center;gap:9px;padding:10px;border:1px solid #d3e8ed;border-radius:15px;background:linear-gradient(120deg,#fff,#f4fbfc); }
.lab-shop-item { width:54px;height:54px;display:grid;place-items:center;border-radius:14px;background:#eaf8fa;border:1px solid #c8e5ea;overflow:hidden; }
.lab-shop-item svg { width:42px;height:42px; }.lab-shop-item img { width:88%;height:88%;object-fit:contain; }
.lab-shop-card > div { min-width:0; }.lab-shop-card > div > small { display:block;color:#36a0b6;font-size:7px;font-weight:950;letter-spacing:.1em;text-transform:uppercase; }.lab-shop-card > div > b { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px; }.lab-shop-card > div > p { margin:2px 0;color:#718b95;font-size:8px;line-height:1.25;font-weight:650; }.lab-shop-card > div > span { color:#5b7c88;font-size:8px;font-weight:850; }
.lab-shop-card > button { min-height:50px;display:grid;place-items:center;border:1px solid #87cfda;border-radius:11px;background:white;color:#1385a2;font:900 9px/1 inherit; }.lab-shop-card > button small { display:flex;align-items:center;gap:3px;font-size:9px; }.lab-shop-card > button small .ui-icon { width:13px;height:13px; }.lab-shop-card > button:disabled { opacity:.48; }
.genetics-lab-footer { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 4px;color:#66838e;font-size:9px;font-weight:800; }
.genetics-lab-footer > span { display:flex;align-items:center;gap:5px; }.genetics-lab-footer .ui-icon { width:14px;height:14px;color:#29a586; }
@keyframes labEggReady { 0%,100%{transform:rotate(-2deg) translateY(0)} 45%{transform:rotate(2deg) translateY(-3px)} 65%{transform:rotate(-1deg) translateY(-1px)} }

.pokemon-genome-card { position:relative;min-width:0;display:grid;grid-template-columns:116px minmax(0,1fr) auto;align-items:center;gap:14px;margin:12px 0;padding:13px;border:1px solid rgba(81,187,207,.38);border-radius:18px;overflow:hidden;background:linear-gradient(120deg,#e9f9fb,#f6fcfa); }
.pokemon-genome-card::after { content:"";position:absolute;inset:auto -60px -80px auto;width:180px;height:180px;border:1px solid rgba(55,180,199,.15);border-radius:50%; }
.pokemon-genome-helix { position:relative;width:110px;height:66px;overflow:hidden; }
.pokemon-genome-helix::before,.pokemon-genome-helix::after { content:"";position:absolute;left:5px;right:5px;top:50%;height:20px;border-top:3px solid #1ca7ca;border-bottom:3px solid #51c7a1;border-radius:50%;animation:genomeWave 2.7s ease-in-out infinite; }
.pokemon-genome-helix::after { transform:scaleY(-1);animation-delay:-1.35s; }
.pokemon-genome-helix > i { --x:calc(var(--gene-index) * 8.5px);position:absolute;left:calc(7px + var(--x));top:31px;width:3px;height:3px;border-radius:50%;background:#fff;box-shadow:0 0 7px #2bbbd1; }
.pokemon-genome-card > span { position:relative;z-index:1;min-width:0; }.pokemon-genome-card small { display:block;color:#2a9db5;font-size:9px;font-weight:950;letter-spacing:.14em; }.pokemon-genome-card b { display:block;margin-top:2px;font-size:17px;letter-spacing:.06em; }.pokemon-genome-card p { margin:3px 0 0;color:#6d8994;font-size:10px;font-weight:700; }
.pokemon-genome-card > strong { position:relative;z-index:1;width:42px;height:42px;display:grid;place-items:center;border-radius:13px;color:white;background:linear-gradient(145deg,#21a7c3,#4cc797);box-shadow:0 7px 16px rgba(26,145,157,.2); }
@keyframes genomeWave { 0%,100%{transform:translateY(-10px) scaleY(.75)} 50%{transform:translateY(10px) scaleY(.75)} }

html[data-game-theme="dark"] .game-screen .side-panel.is-genetics-lab-panel { background:linear-gradient(145deg,rgba(10,33,46,.985),rgba(11,48,55,.985));border-color:rgba(79,183,207,.36); }
html[data-game-theme="dark"] .genetics-lab-window { color:#e7f7fb; }
html[data-game-theme="dark"] :is(.lab-service-panel,.lab-clinic-card,.lab-team-slot,.lab-reserve-card,.lab-parent-grid select,.lab-incubator-slot,.pokemon-genome-card) { background:#102f3b;border-color:#2c5967;color:#e7f7fb; }
html[data-game-theme="dark"] :is(.lab-section-note,.lab-clinic-copy small,.lab-team-slot small,.lab-reserve-card small,.lab-gene-rule p,.lab-compatibility p,.lab-egg-copy p,.pokemon-genome-card p) { color:#9ab8c2; }
html[data-game-theme="dark"] .genetics-lab-tabs { background:#0b2936;border-color:#28505e; }
html[data-game-theme="dark"] .genetics-lab-tabs button.is-active { background:#194353;color:#77ddf1; }

@media (max-width:760px) {
  .game-screen .side-panel.is-genetics-lab-panel { inset:max(6px,env(safe-area-inset-top)) 5px calc(67px + env(safe-area-inset-bottom)) 5px;width:auto;max-height:none;padding:8px;border-radius:19px; }
  .genetics-lab-window { gap:7px; }
  .genetics-lab-hero { grid-template-columns:46px minmax(0,1fr) auto;gap:8px;padding:9px 10px;border-radius:15px; }
  .genetics-lab-mark { width:43px;height:43px;border-radius:12px; }.genetics-lab-mark .ui-icon { width:25px;height:25px; }
  .genetics-lab-hero small { font-size:7px;letter-spacing:.1em; }.genetics-lab-hero h2 { font-size:19px; }.genetics-lab-hero p { display:none; }
  .genetics-lab-hero > strong { padding:7px 8px;font-size:11px; }.genetics-lab-hero > strong .ui-icon { width:14px;height:14px; }
  .genetics-lab-tabs { gap:3px;padding:3px;border-radius:13px; }
  .genetics-lab-tabs button { min-height:43px;display:grid;grid-template-rows:18px auto;gap:2px;padding:4px 2px;font-size:8px;border-radius:10px; }
  .genetics-lab-tabs .ui-icon { width:18px;height:18px;margin:auto; }
  .lab-service-panel { padding:10px;border-radius:14px; }
  .lab-section-heading h3 { font-size:16px; }.lab-section-heading small { font-size:7px; }.lab-section-heading > button { min-height:36px;padding:0 9px;font-size:9px; }
  .lab-section-note { margin-bottom:8px;font-size:9px; }
  .lab-clinic-card { grid-template-columns:44px minmax(0,1fr) 64px;gap:7px;padding:7px; }.lab-pokemon-portrait { width:42px;height:42px; }.lab-clinic-copy b { font-size:11px; }.lab-clinic-copy small { font-size:7px; }.lab-condition-meta { font-size:7px; }.lab-clinic-card > button { min-width:60px;min-height:36px;font-size:9px; }
  .lab-team-grid,.lab-reserve-list { grid-template-columns:1fr; }.lab-team-slot { grid-template-columns:25px 42px minmax(0,1fr) auto; }.lab-team-portrait,.lab-reserve-portrait { width:40px;height:40px; }
  .lab-parent-grid { grid-template-columns:1fr;align-items:center; }.lab-parent-grid > i { width:32px;height:32px;margin:-1px auto; }.lab-parent-grid > i .ui-icon { width:18px;height:18px; }.lab-parent-grid select { height:42px;font-size:10px; }
  .lab-gene-rule { grid-template-columns:42px 1fr;margin:7px 0 9px;padding:8px; }.lab-gene-rule > span { width:38px;height:38px; }.lab-gene-rule .ui-icon { width:22px;height:22px; }
  .lab-breeding-facts { grid-template-columns:repeat(3,minmax(0,1fr));gap:4px; }.lab-breeding-facts > span { padding:7px 5px; }.lab-breeding-facts b { font-size:8px; }
  .lab-primary-action { min-height:43px;font-size:10px; }
  .lab-incubator-list { grid-template-columns:1fr; }.lab-incubator-slot { min-height:116px;grid-template-columns:62px minmax(0,1fr) 78px;grid-template-rows:1fr;align-items:center;padding:8px; }.lab-incubator-slot.is-empty { min-height:92px;grid-template-columns:62px 1fr;grid-template-rows:1fr;text-align:left; }.lab-egg-visual,.lab-empty-cradle { width:56px;height:56px; }.lab-egg-visual .ui-icon,.lab-empty-cradle .ui-icon { width:31px;height:31px; }.lab-egg-copy { text-align:left; }.lab-egg-meta { justify-content:flex-start;margin:4px 0; }.lab-incubator-slot > button { min-height:40px;font-size:8px; }
  .lab-shop-grid { grid-template-columns:1fr; }.lab-shop-card { grid-template-columns:50px minmax(0,1fr) 68px;padding:8px; }.lab-shop-item { width:46px;height:46px; }.lab-shop-card > button { min-height:44px; }
  .genetics-lab-footer { font-size:7px; }.genetics-lab-footer small { text-align:right; }
  .pokemon-genome-card { grid-template-columns:78px minmax(0,1fr) 36px;gap:8px;padding:10px; }.pokemon-genome-helix { width:74px;height:56px;transform:scale(.78);transform-origin:left center; }.pokemon-genome-card b { font-size:13px; }.pokemon-genome-card p { font-size:8px; }.pokemon-genome-card > strong { width:36px;height:36px; }
}

@media (max-width:390px) {
  .genetics-lab-hero > strong { display:none; }
  .genetics-lab-hero { grid-template-columns:42px minmax(0,1fr); }
  .lab-section-heading { align-items:flex-start; }.lab-section-heading > button { max-width:126px;white-space:normal;line-height:1.1; }
  .lab-clinic-card { grid-template-columns:40px minmax(0,1fr); }.lab-clinic-card > button { grid-column:2;width:100%;min-height:34px; }
  .lab-reserve-card { grid-template-columns:40px minmax(0,1fr) auto 32px;gap:5px; }
  .genetics-lab-footer small { display:none; }
}

@media (prefers-reduced-motion:reduce) {
  .lab-incubator-slot.is-ready .lab-egg-visual,.pokemon-genome-helix::before,.pokemon-genome-helix::after { animation:none!important; }
}

/* v2.8.0 — in-game "Как работают функции" combat reference */
.combat-guide-intro { display:grid;grid-template-columns:58px minmax(0,1fr);gap:12px;align-items:center;padding:14px;border:1px solid rgba(81,193,239,.2);border-radius:18px;background:linear-gradient(135deg,rgba(57,173,224,.12),rgba(145,105,239,.08)); }
.combat-guide-intro > span { width:56px;height:56px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(145deg,#278fc2,#7159c9);color:#fff;box-shadow:0 10px 24px rgba(25,96,139,.24); }
.combat-guide-intro svg { width:30px;height:30px; }.combat-guide-intro > div { display:grid;gap:3px; }.combat-guide-intro small,.combat-guide-lead small,.combat-type-chart header small { color:#48bfe9;font-size:8px;font-weight:900;letter-spacing:.1em; }.combat-guide-intro b { font-size:15px; }.combat-guide-intro p { margin:2px 0 0;color:var(--muted,#78909c);font-size:10px;line-height:1.5; }
.combat-guide-lead { display:grid;gap:10px;padding:13px;border:1px solid rgba(83,200,243,.18);border-radius:18px;background:rgba(18,83,111,.055); }.combat-guide-lead.status-prototype { border-color:rgba(234,176,72,.22); }
.combat-guide-lead > header { display:flex;align-items:center;gap:10px; }.combat-guide-lead > header > span { display:grid;gap:2px; }.combat-guide-lead > header b { font-size:13px; }
.combat-guide-lead > div { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px; }.combat-guide-lead > div article { min-width:0;display:grid;grid-template-columns:26px minmax(0,1fr);gap:8px;padding:9px;border:1px solid rgba(70,142,172,.12);border-radius:12px;background:rgba(255,255,255,.035); }.combat-guide-lead > div svg { width:24px;height:24px;color:#45bae8; }.combat-guide-lead > div span { display:grid;gap:2px; }.combat-guide-lead > div b { font-size:10px; }.combat-guide-lead > div p { margin:0;color:var(--muted,#78909c);font-size:8px;line-height:1.4; }
.combat-guide-lead > ol { margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px; }.combat-guide-lead > ol li { position:relative;min-width:0;display:grid;grid-template-columns:38px minmax(0,1fr);gap:8px;align-items:center;padding:6px;border:1px solid rgba(70,142,172,.11);border-radius:11px;background:rgba(255,255,255,.025); }.combat-guide-lead > ol .skill-icon { width:38px;height:38px;display:block;overflow:hidden;border-radius:9px; }.combat-guide-lead > ol .skill-icon img { width:100%;height:100%;object-fit:cover; }.combat-guide-lead > ol kbd { position:absolute;left:3px;top:3px;padding:2px 4px;border:0;border-radius:4px;background:rgba(2,28,42,.86);color:#fff;font:900 7px/1 inherit;box-shadow:none; }.combat-guide-lead > ol span { min-width:0;display:grid;gap:2px; }.combat-guide-lead > ol b { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px; }.combat-guide-lead > ol small { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted,#78909c);font-size:7px;letter-spacing:0; }
.combat-type-chart { display:grid;gap:9px;padding:12px;border:1px solid rgba(70,142,172,.13);border-radius:18px;background:rgba(255,255,255,.025); }.combat-type-chart > header { display:flex;align-items:end;justify-content:space-between;gap:10px; }.combat-type-chart > header span { display:grid;gap:2px; }.combat-type-chart > header b { font-size:13px; }.combat-type-chart > header em { color:var(--muted,#78909c);font-size:8px;font-style:normal; }.combat-type-chart > div { overflow:auto;border:1px solid rgba(70,142,172,.12);border-radius:11px;scrollbar-width:thin; }.combat-type-chart table { width:max-content;min-width:100%;border-collapse:collapse;font-size:7px;text-align:center; }.combat-type-chart th,.combat-type-chart td { width:25px;height:25px;padding:2px;border:1px solid rgba(94,147,168,.09); }.combat-type-chart thead th,.combat-type-chart tbody th { position:sticky;z-index:2;background:rgba(9,48,65,.96); }.combat-type-chart thead th { top:0; }.combat-type-chart tbody th { left:0;min-width:94px;text-align:left;white-space:nowrap; }.combat-type-chart th b { margin-left:3px;font-size:7px; }.combat-type-chart .effect-2 { background:rgba(71,205,112,.22);color:#43cf73;font-weight:1000; }.combat-type-chart .effect-0-5 { background:rgba(255,184,66,.17);color:#e8a938;font-weight:1000; }.combat-type-chart .effect-0 { background:rgba(232,84,90,.18);color:#e55c64;font-weight:1000; }.combat-type-chart .effect-1 { color:rgba(151,177,188,.36); }
body[data-ui-theme="light"] .combat-type-chart thead th,body[data-ui-theme="light"] .combat-type-chart tbody th { background:rgba(235,247,251,.98); }
@media (max-width:760px) { .combat-guide-lead > div,.combat-guide-lead > ol { grid-template-columns:1fr; }.combat-type-chart > header { align-items:flex-start;flex-direction:column; }.combat-guide-intro { grid-template-columns:44px minmax(0,1fr);padding:10px; }.combat-guide-intro > span { width:42px;height:42px;border-radius:12px; }.combat-guide-intro svg { width:24px;height:24px; } }
.dex-skill-card mark { margin-left:4px;padding:2px 4px;border-radius:4px;background:rgba(232,169,60,.14);color:#d99a2f;font-size:6px;vertical-align:middle; }
.dex-skill-card.status-prototype { border-style:dashed; }.dex-skill-detail.status-prototype { border-color:rgba(231,168,62,.25); }
.dex-combat-passives { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px; }.dex-combat-passives > article { display:grid;grid-template-columns:28px minmax(0,1fr);gap:8px;padding:9px;border:1px solid rgba(69,144,174,.13);border-radius:12px;background:rgba(255,255,255,.03); }.dex-combat-passives svg { width:26px;height:26px;color:#41b8e4; }.dex-combat-passives span { display:grid;gap:2px; }.dex-combat-passives small { color:#3aaad6;font-size:7px;font-weight:900;letter-spacing:.08em; }.dex-combat-passives b { font-size:10px; }.dex-combat-passives p { margin:0;color:var(--muted,#78909c);font-size:8px;line-height:1.4; }
@media (max-width:620px) { .dex-combat-passives { grid-template-columns:1fr; } }

/* v2.7.16 — cinematic starter selection, card flip, skill inspection and partner reveal */
.starter-dialog {
  place-items:center;
  padding:clamp(10px,2vw,24px) clamp(10px,2vw,24px) clamp(10px,2vw,24px) max(112px,calc(env(safe-area-inset-left) + 18px));
}
.starter-dialog .starter-backdrop {
  background:
    radial-gradient(circle at 50% 28%,rgba(47,126,161,.18),transparent 42%),
    linear-gradient(180deg,rgba(2,20,31,.48),rgba(2,15,24,.84));
  backdrop-filter:blur(7px) saturate(.9);
}
.starter-experience {
  --starter-panel:linear-gradient(160deg,rgba(7,35,47,.97),rgba(5,24,34,.98));
  --starter-panel-soft:rgba(255,255,255,.055);
  --starter-border:rgba(143,207,231,.2);
  --starter-text:#f4fbff;
  --starter-muted:rgba(210,231,240,.72);
  position:relative;
  z-index:2;
  width:min(1080px,100%);
  max-height:min(820px,calc(100vh - 36px));
  overflow:hidden;
  border:1px solid var(--starter-border);
  border-radius:28px;
  background:var(--starter-panel);
  color:var(--starter-text);
  box-shadow:0 36px 100px rgba(0,8,14,.62),inset 0 1px 0 rgba(255,255,255,.08);
}
.starter-flow-header {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 40px;
  align-items:center;
  gap:18px;
  min-height:82px;
  padding:14px 18px 12px 22px;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0));
}
.starter-flow-header > span { display:grid; gap:3px; min-width:0; }
.starter-flow-header small { color:#77d9ff; font-size:7px; font-weight:900; letter-spacing:.12em; }
.starter-flow-header b { overflow:hidden; color:var(--starter-text); font-size:clamp(18px,2.2vw,28px); line-height:1.05; text-overflow:ellipsis; white-space:nowrap; }
.starter-flow-close {
  width:38px;
  height:38px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:12px;
  background:rgba(255,255,255,.07);
  color:rgba(237,248,253,.78);
  font:500 23px/1 system-ui;
}
.starter-flow-close:hover { background:rgba(255,255,255,.12); color:#fff; }
.starter-experience[data-stage="sending"] .starter-flow-close,
.starter-experience[data-stage="reveal"] .starter-flow-close,
.starter-experience[data-stage="partner"] .starter-flow-close { visibility:hidden; }
.starter-flow-steps { display:flex; align-items:center; gap:5px; }
.starter-flow-steps i {
  display:grid;
  place-items:center;
  width:23px;
  height:23px;
  border:1px solid rgba(153,200,221,.26);
  border-radius:50%;
  background:rgba(255,255,255,.04);
  color:rgba(206,228,237,.52);
  font:900 7px/1 system-ui;
  font-style:normal;
}
.starter-flow-steps em { width:18px; height:1px; background:rgba(160,204,222,.16); }
.starter-flow-steps i.is-active { border-color:#6fd8ff; background:#0b7fbc; color:white; box-shadow:0 0 0 4px rgba(67,183,239,.1); }
.starter-flow-steps i.is-done { border-color:#7dd75c; background:#2b8b3e; color:white; }
.starter-flow-content {
  max-height:calc(min(820px,100vh - 36px) - 82px);
  padding:20px 22px 22px;
  overflow:auto;
}
.starter-flow-lead { margin:0 0 16px; color:var(--starter-muted); font-size:11px; text-align:center; }
.starter-flow-hint { display:block; margin:14px 0 0; color:rgba(202,224,234,.52); font-size:7px; text-align:center; }

/* Selection cards */
.starter-choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.starter-choice-card {
  position:relative;
  display:grid;
  grid-template-rows:auto minmax(190px,1fr) auto auto auto auto;
  min-width:0;
  min-height:470px;
  padding:12px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--starter-accent) 72%,white 12%);
  border-radius:24px;
  background:
    radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--starter-accent) 24%,transparent),transparent 46%),
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
  color:var(--starter-text);
  text-align:left;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 35px rgba(0,10,18,.22);
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,filter .2s ease;
}
.starter-choice-card::before {
  content:'';
  position:absolute;
  inset:-35% -30% auto;
  height:58%;
  background:radial-gradient(circle,color-mix(in srgb,var(--starter-accent) 28%,transparent),transparent 65%);
  opacity:.5;
  pointer-events:none;
}
.starter-choice-card:hover,
.starter-choice-card:focus-visible {
  transform:translateY(-5px) scale(1.012);
  border-color:color-mix(in srgb,var(--starter-accent) 88%,white 16%);
  box-shadow:0 20px 46px rgba(0,10,18,.32),0 0 0 2px color-mix(in srgb,var(--starter-accent) 20%,transparent),inset 0 1px 0 rgba(255,255,255,.12);
  filter:brightness(1.05);
}
.starter-card-element {
  position:relative;
  z-index:2;
  justify-self:center;
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:30px;
  padding:0 11px;
  border:1px solid color-mix(in srgb,var(--starter-accent) 62%,white 8%);
  border-radius:999px;
  background:rgba(2,22,31,.68);
  color:#fff;
  font-size:14px;
}
.starter-card-element b { font-size:8px; }
.starter-card-art { display:grid; place-items:center; min-height:0; }
.starter-card-portrait {
  width:100%;
  height:100%;
  min-height:205px;
  border-radius:19px;
  background:
    radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--starter-accent) 26%,white 6%),transparent 56%),
    linear-gradient(160deg,rgba(255,255,255,.08),rgba(0,0,0,.12));
}
.starter-card-portrait img { width:88%; height:88%; filter:drop-shadow(0 15px 10px rgba(0,0,0,.22)); }
.starter-card-name { display:grid; justify-items:center; gap:3px; padding:8px 6px 5px; }
.starter-card-name b { font-size:20px; line-height:1; }
.starter-card-name small { color:var(--starter-accent); font-size:8px; font-weight:900; text-transform:uppercase; }
.starter-card-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; }
.starter-card-stats i { padding:5px 2px; border-radius:8px; background:rgba(255,255,255,.055); color:rgba(235,247,251,.82); font:700 7px/1 system-ui; font-style:normal; text-align:center; }
.starter-card-skills { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; padding:6px 0 2px; }
.starter-card-skills > i { display:grid; place-items:center; aspect-ratio:1; border:1px solid color-mix(in srgb,var(--starter-accent) 45%,rgba(255,255,255,.12)); border-radius:50%; background:rgba(0,18,26,.48); }
.starter-card-skill-dot { width:70%; height:70%; border-radius:50%; }
.starter-choice-card > em { color:rgba(211,231,239,.54); font:700 7px/1.2 system-ui; font-style:normal; text-align:center; }

/* Details / card flip */
.starter-details-view { display:grid; grid-template-columns:minmax(260px,.78fr) minmax(0,1.35fr); gap:22px; align-items:stretch; }
.starter-flip-shell { min-height:500px; perspective:1100px; }
.starter-flip-inner { position:relative; width:100%; height:100%; min-height:500px; transform-style:preserve-3d; transition:transform .72s cubic-bezier(.2,.75,.2,1); }
.starter-flip-shell.is-flipped .starter-flip-inner { transform:rotateY(180deg); }
.starter-flip-face {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--starter-accent) 68%,white 12%);
  border-radius:26px;
  backface-visibility:hidden;
  box-shadow:0 22px 48px rgba(0,10,18,.3),inset 0 1px 0 rgba(255,255,255,.1);
}
.starter-flip-back {
  align-content:center;
  gap:10px;
  background:
    radial-gradient(circle,color-mix(in srgb,var(--starter-accent) 18%,transparent),transparent 50%),
    linear-gradient(150deg,#092d3c,#041922);
}
.starter-flip-back > span { display:grid; place-items:center; width:116px; height:116px; border:2px solid rgba(255,255,255,.22); border-radius:50%; background:rgba(255,255,255,.05); color:#fff; font:900 62px/1 system-ui; }
.starter-flip-back small { color:rgba(223,239,246,.65); font-size:7px; letter-spacing:.12em; }
.starter-flip-front {
  grid-template-rows:auto 1fr auto;
  gap:10px;
  padding:14px;
  transform:rotateY(180deg);
  background:
    radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--starter-accent) 29%,transparent),transparent 52%),
    linear-gradient(165deg,rgba(255,255,255,.085),rgba(0,0,0,.14));
}
.starter-detail-element { justify-self:start; padding:5px 9px; border-radius:999px; background:rgba(0,22,30,.58); color:#fff; font-size:8px; font-weight:900; }
.starter-detail-portrait { width:100%; height:100%; min-height:320px; border-radius:21px; background:transparent; }
.starter-detail-portrait img { width:92%; height:92%; filter:drop-shadow(0 18px 13px rgba(0,0,0,.25)); }
.starter-flip-front > div { display:grid; gap:4px; justify-items:center; width:100%; padding:8px; }
.starter-flip-front > div b { font-size:24px; }
.starter-flip-front > div small { color:var(--starter-muted); font-size:8px; text-align:center; }
.starter-details-copy { display:grid; align-content:start; gap:12px; padding:4px 0; }
.starter-details-eyebrow { color:var(--starter-accent); font-size:7px; font-weight:900; letter-spacing:.08em; }
.starter-details-copy h3 { margin:0; color:var(--starter-text); font-size:18px; line-height:1.2; }
.starter-skill-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.starter-skill-chip {
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:8px;
  min-width:0;
  min-height:56px;
  padding:6px 8px;
  border:1px solid rgba(151,204,225,.16);
  border-radius:14px;
  background:rgba(255,255,255,.04);
  color:var(--starter-text);
  text-align:left;
  transition:background .16s,border-color .16s,transform .16s;
}
.starter-skill-chip:hover,.starter-skill-chip:focus-visible,.starter-skill-chip.is-active { border-color:color-mix(in srgb,var(--starter-accent) 62%,rgba(255,255,255,.16)); background:color-mix(in srgb,var(--starter-accent) 10%,rgba(255,255,255,.045)); transform:translateY(-1px); }
.starter-skill-chip-icon { width:40px; height:40px; border-radius:50%; box-shadow:0 4px 10px rgba(0,0,0,.18); }
.starter-skill-chip span { display:grid; gap:3px; min-width:0; }
.starter-skill-chip b { overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.starter-skill-chip small { color:var(--starter-muted); font-size:6px; }
.starter-skill-detail {
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  gap:12px;
  min-height:116px;
  padding:12px;
  border:1px solid color-mix(in srgb,var(--starter-accent) 32%,rgba(255,255,255,.1));
  border-radius:17px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--starter-accent) 8%,transparent),rgba(255,255,255,.035));
}
.starter-skill-detail-icon { display:grid; place-items:center; width:64px; height:64px; border-radius:18px; background:rgba(0,16,23,.5); }
.starter-skill-detail-atlas { width:54px; height:54px; border-radius:50%; }
.starter-skill-detail > span { display:grid; align-content:start; gap:4px; }
.starter-skill-detail small { color:var(--starter-accent); font-size:6px; font-weight:900; text-transform:uppercase; }
.starter-skill-detail b { font-size:14px; }
.starter-skill-detail p { margin:0; color:var(--starter-muted); font-size:9px; line-height:1.45; }
.starter-skill-detail em { color:rgba(217,235,242,.56); font-size:6px; font-style:normal; }
.starter-flow-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:auto; padding-top:4px; }
.starter-flow-actions button,.starter-continue {
  min-height:44px;
  padding:0 16px;
  border-radius:13px;
  font-size:8px;
  font-weight:900;
}
.starter-secondary { border:1px solid rgba(155,202,220,.22); background:rgba(255,255,255,.055); color:var(--starter-muted); }
.starter-primary { border:1px solid color-mix(in srgb,var(--starter-accent) 68%,white 14%); background:linear-gradient(180deg,color-mix(in srgb,var(--starter-accent) 92%,white 5%),color-mix(in srgb,var(--starter-accent) 72%,black 18%)); color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 8px 18px color-mix(in srgb,var(--starter-accent) 18%,transparent); }
.starter-primary:hover { filter:brightness(1.08); transform:translateY(-1px); }

/* Confirmation */
.starter-confirm-view { display:grid; grid-template-columns:minmax(250px,.72fr) minmax(0,1fr); gap:26px; align-items:center; min-height:470px; padding:18px 28px; }
.starter-confirm-orbit { position:relative; display:grid; place-items:center; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,color-mix(in srgb,var(--starter-accent) 22%,transparent),transparent 66%); }
.starter-confirm-orbit::before,.starter-confirm-orbit::after { content:''; position:absolute; inset:12%; border:1px solid color-mix(in srgb,var(--starter-accent) 45%,transparent); border-radius:50%; animation:starterOrbit 8s linear infinite; }
.starter-confirm-orbit::after { inset:22%; animation-direction:reverse; animation-duration:5.5s; }
@keyframes starterOrbit { to { transform:rotate(360deg); } }
.starter-confirm-portrait { width:82%; height:82%; border-radius:50%; background:transparent; }
.starter-confirm-portrait img { filter:drop-shadow(0 18px 14px rgba(0,0,0,.24)); }
.starter-confirm-copy { display:grid; gap:10px; }
.starter-confirm-copy > small { color:var(--starter-accent); font-size:7px; font-weight:900; }
.starter-confirm-copy h3 { margin:0; font-size:clamp(28px,4vw,46px); }
.starter-confirm-copy p { margin:0; color:var(--starter-muted); font-size:10px; line-height:1.5; }
.starter-confirm-skills { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.starter-confirm-skills span { display:flex; align-items:center; gap:7px; min-height:43px; padding:5px 8px; border:1px solid rgba(255,255,255,.09); border-radius:12px; background:rgba(255,255,255,.035); }
.starter-confirm-skill-icon { width:32px; height:32px; border-radius:50%; }
.starter-confirm-skills b { font-size:7px; }
.starter-confirm-note { padding:8px 10px; border-left:2px solid var(--starter-accent); background:rgba(255,255,255,.035); color:rgba(214,231,238,.58)!important; font-size:7px!important; }
.starter-button-spinner { display:inline-block; width:12px; height:12px; margin-right:5px; border:2px solid rgba(255,255,255,.38); border-top-color:white; border-radius:50%; animation:starterSpin .8s linear infinite; vertical-align:middle; }
@keyframes starterSpin { to { transform:rotate(360deg); } }

/* Reveal ceremony */
.starter-reveal-view { display:grid; align-content:center; justify-items:center; min-height:560px; overflow:hidden; }
.starter-reveal-stage { position:relative; display:grid; place-items:center; width:min(620px,88vw); height:420px; }
.starter-reveal-beam { position:absolute; bottom:32px; width:42%; height:330px; background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--starter-accent) 24%,transparent),color-mix(in srgb,var(--starter-accent) 52%,transparent)); clip-path:polygon(42% 0,58% 0,100% 100%,0 100%); filter:blur(3px); animation:starterBeam 1.9s ease both; }
.starter-reveal-ring { position:absolute; bottom:22px; width:68%; height:96px; border:2px solid color-mix(in srgb,var(--starter-accent) 78%,white 10%); border-radius:50%; box-shadow:0 0 28px color-mix(in srgb,var(--starter-accent) 45%,transparent),inset 0 0 26px color-mix(in srgb,var(--starter-accent) 26%,transparent); animation:starterRing 1.3s ease-in-out infinite alternate; }
@keyframes starterBeam { from { opacity:0; transform:scaleY(.08); transform-origin:bottom; } to { opacity:1; transform:scaleY(1); } }
@keyframes starterRing { to { transform:scale(1.05); filter:brightness(1.2); } }
.starter-reveal-creature { position:relative; z-index:3; width:310px; height:310px; transform:translateY(30px) scale(.4); opacity:0; animation:starterMaterialize 1.45s .35s cubic-bezier(.12,.8,.22,1.18) forwards; }
.starter-reveal-portrait { width:100%; height:100%; background:transparent; }
.starter-reveal-portrait img { filter:drop-shadow(0 20px 14px rgba(0,0,0,.25)); }
@keyframes starterMaterialize { 55% { opacity:1; transform:translateY(3px) scale(1.08); } 100% { opacity:1; transform:translateY(0) scale(1); } }
.starter-reveal-particles { position:absolute; inset:0; pointer-events:none; }
.starter-reveal-particles i { position:absolute; left:50%; top:50%; width:7px; height:14px; border-radius:70% 10% 70% 10%; background:var(--starter-accent); opacity:0; transform:rotate(calc(var(--i) * 37deg)) translateY(-40px); animation:starterParticle 1.8s calc(var(--i) * 45ms) ease-out infinite; }
@keyframes starterParticle { 0% { opacity:0; transform:rotate(calc(var(--i) * 37deg)) translateY(-30px) scale(.4); } 25% { opacity:.9; } 100% { opacity:0; transform:rotate(calc(var(--i) * 37deg)) translateY(-190px) scale(1.05); } }
.starter-reveal-caption { position:relative; z-index:5; display:grid; justify-items:center; gap:4px; margin-top:-18px; text-align:center; }
.starter-reveal-caption small { color:var(--starter-accent); font-size:8px; font-weight:900; letter-spacing:.1em; }
.starter-reveal-caption b { font-size:30px; }
.starter-reveal-caption span { color:var(--starter-muted); font-size:9px; }

/* Final partner screen */
.starter-partner-view { display:grid; grid-template-columns:minmax(300px,.9fr) minmax(0,1.25fr); gap:24px; min-height:520px; align-items:center; }
.starter-partner-art { position:relative; display:grid; place-items:center; min-height:500px; overflow:hidden; border:1px solid color-mix(in srgb,var(--starter-accent) 32%,rgba(255,255,255,.08)); border-radius:24px; background:radial-gradient(circle at 50% 52%,color-mix(in srgb,var(--starter-accent) 29%,transparent),transparent 54%),linear-gradient(160deg,rgba(255,255,255,.04),rgba(0,0,0,.1)); }
.starter-partner-portrait { width:92%; height:92%; background:transparent; animation:starterPartnerBounce 2.4s ease-in-out infinite; }
.starter-partner-portrait img { filter:drop-shadow(0 22px 14px rgba(0,0,0,.24)); }
@keyframes starterPartnerBounce { 50% { transform:translateY(-6px); } }
.starter-partner-art > span { position:absolute; color:color-mix(in srgb,var(--starter-accent) 60%,white); font-size:28px; animation:starterSparkle 1.5s ease-in-out infinite alternate; }
.starter-partner-art > span:nth-of-type(1) { top:18%; left:15%; }
.starter-partner-art > span:nth-of-type(2) { top:11%; right:18%; animation-delay:.35s; }
.starter-partner-art > span:nth-of-type(3) { bottom:18%; right:12%; animation-delay:.7s; }
@keyframes starterSparkle { to { transform:scale(1.25) rotate(12deg); filter:brightness(1.35); } }
.starter-partner-copy { display:grid; gap:11px; }
.starter-partner-copy > small { color:var(--starter-accent); font-size:8px; font-weight:900; }
.starter-partner-copy h3 { margin:0; font-size:clamp(26px,3.6vw,42px); line-height:1.06; }
.starter-partner-copy > p { margin:0; color:var(--starter-muted); font-size:10px; line-height:1.5; }
.starter-partner-kit { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.starter-continue { justify-self:start; min-width:220px; margin-top:2px; }

/* Light theme */
html[data-game-theme="light"] .starter-experience {
  --starter-panel:linear-gradient(160deg,rgba(244,251,253,.98),rgba(225,240,247,.97));
  --starter-panel-soft:rgba(32,94,120,.05);
  --starter-border:rgba(73,145,177,.24);
  --starter-text:#153d55;
  --starter-muted:rgba(55,92,113,.72);
  box-shadow:0 30px 80px rgba(20,69,96,.28),inset 0 1px 0 white;
}
html[data-game-theme="light"] .starter-flow-header { border-bottom-color:rgba(47,112,142,.12); }
html[data-game-theme="light"] .starter-flow-header small { color:#087db7; }
html[data-game-theme="light"] .starter-flow-close { border-color:rgba(58,126,156,.15); background:rgba(47,118,151,.07); color:#2a647e; }
html[data-game-theme="light"] .starter-choice-card,
html[data-game-theme="light"] .starter-flip-face,
html[data-game-theme="light"] .starter-partner-art { box-shadow:0 15px 34px rgba(41,91,116,.12),inset 0 1px 0 rgba(255,255,255,.8); }
html[data-game-theme="light"] .starter-choice-card { background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--starter-accent) 20%,transparent),transparent 46%),linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.34)); }
html[data-game-theme="light"] .starter-card-element,
html[data-game-theme="light"] .starter-detail-element { background:rgba(247,252,254,.76); color:#234b60; }
html[data-game-theme="light"] .starter-card-stats i,
html[data-game-theme="light"] .starter-skill-chip,
html[data-game-theme="light"] .starter-confirm-skills span { background:rgba(255,255,255,.52); }
html[data-game-theme="light"] .starter-skill-detail { background:linear-gradient(145deg,color-mix(in srgb,var(--starter-accent) 9%,transparent),rgba(255,255,255,.48)); }
html[data-game-theme="light"] .starter-flip-back { background:linear-gradient(150deg,#dceef5,#bfdce8); }
html[data-game-theme="light"] .starter-flip-back > span { color:#245d78; border-color:rgba(46,119,151,.22); background:rgba(255,255,255,.52); }

@media (max-width:800px) {
  .starter-dialog { padding:max(7px,env(safe-area-inset-top)) 7px calc(72px + env(safe-area-inset-bottom)); }
  .starter-experience { width:100%; max-height:100%; border-radius:20px; }
  .starter-flow-header { grid-template-columns:minmax(0,1fr) 34px; min-height:66px; gap:8px; padding:10px 10px 8px 14px; }
  .starter-flow-header b { font-size:18px; white-space:normal; }
  .starter-flow-header small { font-size:6px; }
  .starter-flow-steps { display:none; }
  .starter-flow-close { width:34px; height:34px; }
  .starter-flow-content { max-height:calc(100vh - 145px); padding:12px; }
  .starter-flow-lead { margin-bottom:10px; font-size:9px; }
  .starter-choice-grid { grid-template-columns:1fr; gap:9px; }
  .starter-choice-card { grid-template-columns:110px minmax(0,1fr); grid-template-rows:auto auto auto auto; min-height:152px; padding:8px; border-radius:17px; }
  .starter-card-element { position:absolute; top:8px; left:8px; min-height:23px; z-index:4; font-size:11px; }
  .starter-card-element b { font-size:6px; }
  .starter-card-art { grid-column:1; grid-row:1/5; }
  .starter-card-portrait { min-height:132px; height:132px; border-radius:13px; }
  .starter-card-name { grid-column:2; justify-items:start; padding:5px 2px 2px; }
  .starter-card-name b { font-size:17px; }
  .starter-card-stats { grid-column:2; }
  .starter-card-skills { grid-column:2; padding:3px 0; }
  .starter-choice-card > em { grid-column:2; text-align:left; }
  .starter-details-view,.starter-confirm-view,.starter-partner-view { grid-template-columns:1fr; gap:12px; }
  .starter-flip-shell,.starter-flip-inner { min-height:285px; }
  .starter-flip-front { grid-template-columns:132px 1fr; grid-template-rows:auto 1fr auto; padding:9px; }
  .starter-detail-element { grid-column:1/-1; justify-self:start; }
  .starter-detail-portrait { grid-column:1; grid-row:2/4; min-height:210px; }
  .starter-flip-front > div { grid-column:2; grid-row:2; justify-items:start; align-self:center; }
  .starter-flip-front > div b { font-size:20px; }
  .starter-details-copy { gap:8px; }
  .starter-details-copy h3 { font-size:15px; }
  .starter-skill-list { gap:6px; }
  .starter-skill-chip { grid-template-columns:34px minmax(0,1fr); min-height:48px; padding:5px; }
  .starter-skill-chip-icon { width:32px; height:32px; }
  .starter-skill-chip b { font-size:8px; }
  .starter-skill-detail { grid-template-columns:50px minmax(0,1fr); min-height:94px; padding:8px; }
  .starter-skill-detail-icon { width:50px; height:50px; }
  .starter-skill-detail-atlas { width:43px; height:43px; }
  .starter-skill-detail p { font-size:8px; }
  .starter-flow-actions { position:sticky; bottom:-12px; margin:0 -12px -12px; padding:9px 12px calc(9px + env(safe-area-inset-bottom)); background:linear-gradient(180deg,rgba(4,24,34,0),rgba(4,24,34,.96) 28%); }
  html[data-game-theme="light"] .starter-flow-actions { background:linear-gradient(180deg,rgba(231,243,248,0),rgba(231,243,248,.97) 28%); }
  .starter-flow-actions button { flex:1; padding:0 9px; font-size:7px; }
  .starter-confirm-view { min-height:0; padding:4px; }
  .starter-confirm-orbit { justify-self:center; width:170px; }
  .starter-confirm-copy { gap:7px; }
  .starter-confirm-copy h3 { font-size:28px; }
  .starter-confirm-copy p { font-size:8px; }
  .starter-confirm-skills { grid-template-columns:repeat(2,1fr); }
  .starter-reveal-view { min-height:460px; }
  .starter-reveal-stage { height:330px; }
  .starter-reveal-creature { width:230px; height:230px; }
  .starter-reveal-caption b { font-size:25px; }
  .starter-partner-art { min-height:260px; }
  .starter-partner-portrait { width:260px; height:260px; }
  .starter-partner-copy h3 { font-size:27px; }
  .starter-partner-copy > p { font-size:9px; }
  .starter-partner-kit { grid-template-columns:repeat(2,1fr); }
  .starter-continue { width:100%; min-width:0; }
}

@media (max-width:480px) {
  .starter-skill-list,.starter-partner-kit,.starter-confirm-skills { grid-template-columns:1fr; }
  .starter-choice-card { grid-template-columns:96px minmax(0,1fr); }
  .starter-card-portrait { min-height:116px; height:116px; }
  .starter-flow-actions { flex-direction:column-reverse; }
}

@media (prefers-reduced-motion:reduce) {
  .starter-choice-card,.starter-flip-inner,.starter-confirm-orbit::before,.starter-confirm-orbit::after,.starter-reveal-beam,.starter-reveal-ring,.starter-reveal-creature,.starter-reveal-particles i,.starter-partner-portrait,.starter-partner-art > span { animation:none!important; transition:none!important; }
  .starter-flip-shell.is-flipped .starter-flip-inner { transform:rotateY(180deg); }
  .starter-reveal-creature { opacity:1; transform:none; }
}

/* v2.7.17 — partner handoff, reusable skill orbs and richer move cards */
.pokemon-skill-strip,
.team-skill-strip,
.partner-acquired-skills {
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.team-skill-strip { margin-top:6px; }
.pokemon-skill-orb {
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:30px;
  height:30px;
  border:1px solid color-mix(in srgb,var(--theme-accent,#3eb5ef) 34%,rgba(255,255,255,.14));
  border-radius:50%;
  background:rgba(5,26,37,.52);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 4px 10px rgba(0,0,0,.12);
  transition:transform .16s,border-color .16s,filter .16s;
}
.pokemon-skill-orb:hover { transform:translateY(-2px) scale(1.04); border-color:rgba(112,211,255,.64); filter:brightness(1.12); }
.pokemon-skill-orb-icon { width:26px; height:26px; border-radius:50%; }
.pokemon-skill-orb::after {
  content:attr(data-skill-tooltip);
  position:absolute;
  z-index:40;
  left:50%;
  bottom:calc(100% + 9px);
  width:210px;
  padding:8px 10px;
  border:1px solid rgba(132,207,236,.24);
  border-radius:11px;
  background:rgba(5,27,38,.96);
  color:#eaf8ff;
  box-shadow:0 12px 26px rgba(0,0,0,.28);
  font:650 8px/1.4 "Segoe UI Variable",Inter,system-ui;
  white-space:normal;
  text-align:left;
  transform:translate(-50%,5px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .14s,transform .14s,visibility .14s;
}
.pokemon-skill-orb:hover::after { opacity:1; visibility:visible; transform:translate(-50%,0); }
html[data-game-theme="light"] .game-screen .pokemon-skill-orb { background:rgba(235,247,252,.88); border-color:rgba(64,143,180,.24); }
html[data-game-theme="light"] .game-screen .pokemon-skill-orb::after { background:rgba(247,252,254,.98); color:#21465c; border-color:rgba(64,143,180,.2); box-shadow:0 12px 24px rgba(45,90,115,.16); }

.game-screen .pokemon-move-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.game-screen .pokemon-move-card {
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:9px;
  align-items:start;
  min-height:112px;
  padding:10px;
}
.game-screen .pokemon-move-card-icon {
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:14px;
  background:color-mix(in srgb,var(--theme-accent,#48aef0) 9%,var(--theme-surface-soft,#eef7fb));
}
.game-screen .pokemon-move-card-atlas { width:39px; height:39px; border-radius:50%; }
.game-screen .pokemon-move-card > span { display:grid; gap:3px; min-width:0; }
.game-screen .pokemon-move-card small { color:var(--theme-accent,#1689d5); font-size:7px; font-weight:900; text-transform:uppercase; }
.game-screen .pokemon-move-card b { font-size:11px; }
.game-screen .pokemon-move-card p { margin:1px 0 0; color:var(--theme-muted,#6b8496); font-size:8px; line-height:1.4; }
.game-screen .pokemon-move-card em { margin-top:2px; color:color-mix(in srgb,var(--theme-muted,#6b8496) 82%,transparent); font-size:7px; font-style:normal; }

.partner-acquired-toast {
  position:absolute;
  z-index:32;
  right:max(22px,env(safe-area-inset-right));
  bottom:max(28px,env(safe-area-inset-bottom));
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  align-items:center;
  gap:11px;
  width:min(390px,calc(100vw - 32px));
  min-height:86px;
  padding:10px 12px;
  border:1px solid color-mix(in srgb,var(--partner-accent,#65cf55) 46%,rgba(145,211,236,.18));
  border-radius:20px;
  background:linear-gradient(150deg,rgba(7,38,48,.96),rgba(5,25,35,.96));
  color:#f5fbff;
  box-shadow:0 18px 44px rgba(0,19,28,.32),inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(12px);
  opacity:0;
  visibility:hidden;
  transform:translateY(14px) scale(.97);
  pointer-events:none;
}
.partner-acquired-toast.is-open { visibility:visible; opacity:1; transform:translateY(0) scale(1); animation:partnerToastIn .32s cubic-bezier(.16,.8,.26,1.12) both; }
.partner-acquired-toast.is-leaving { opacity:0; transform:translateY(7px) scale(.985); transition:opacity .24s,transform .24s; }
@keyframes partnerToastIn { from { opacity:0; transform:translateY(14px) scale(.97); } to { opacity:1; transform:translateY(0) scale(1); } }
.partner-acquired-visual {
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--partner-accent,#65cf55) 70%,white 10%);
  border-radius:17px;
  background:radial-gradient(circle,color-mix(in srgb,var(--partner-accent,#65cf55) 24%,transparent),rgba(255,255,255,.035));
}
.partner-acquired-emoji,.partner-acquired-emoji img { width:100%; height:100%; }
.partner-acquired-emoji { display:grid; place-items:center; }
.partner-acquired-emoji img { object-fit:contain; padding:5px; }
.partner-acquired-copy { display:grid; gap:3px; min-width:0; }
.partner-acquired-copy > small { color:var(--partner-accent,#78dd66); font-size:7px; font-weight:900; letter-spacing:.08em; }
.partner-acquired-copy > b { overflow:hidden; font-size:13px; line-height:1.1; text-overflow:ellipsis; white-space:nowrap; }
.partner-acquired-copy > em { color:rgba(218,234,242,.7); font-size:8px; font-style:normal; }
.partner-acquired-skills { margin-top:3px; }
.partner-acquired-skills .pokemon-skill-orb { width:25px; height:25px; }
.partner-acquired-skills .pokemon-skill-orb-icon { width:22px; height:22px; }
.partner-acquired-skills .pokemon-skill-orb::after { display:none; }
html[data-game-theme="light"] .game-screen .partner-acquired-toast { background:linear-gradient(150deg,rgba(242,250,252,.97),rgba(225,240,247,.96)); color:#173f55; box-shadow:0 16px 34px rgba(47,92,116,.18),inset 0 1px 0 #fff; }
html[data-game-theme="light"] .game-screen .partner-acquired-copy > em { color:rgba(62,95,114,.72); }

@media (max-width:760px) {
  .team-skill-strip { gap:4px; }
  .team-skill-strip .pokemon-skill-orb { width:26px; height:26px; }
  .team-skill-strip .pokemon-skill-orb-icon { width:22px; height:22px; }
  .pokemon-skill-orb::after { display:none; }
  .game-screen .pokemon-move-grid { grid-template-columns:1fr; }
  .partner-acquired-toast {
    right:8px;
    bottom:calc(74px + env(safe-area-inset-bottom));
    grid-template-columns:46px minmax(0,1fr);
    width:min(310px,calc(100vw - 16px));
    min-height:68px;
    gap:8px;
    padding:8px 9px;
    border-radius:16px;
  }
  .partner-acquired-visual { width:46px; height:46px; border-radius:13px; }
  .partner-acquired-copy > small { font-size:6px; }
  .partner-acquired-copy > b { font-size:10px; }
  .partner-acquired-copy > em { font-size:7px; }
  .partner-acquired-skills { gap:3px; }
  .partner-acquired-skills .pokemon-skill-orb { width:21px; height:21px; }
  .partner-acquired-skills .pokemon-skill-orb-icon { width:18px; height:18px; }
}
@media (prefers-reduced-motion:reduce) {
  .partner-acquired-toast.is-open { animation:none; }
  .pokemon-skill-orb { transition:none; }
}

/* v2.7.19 — starter cards rebuilt: hero + four skills first, readable profile stats, sticker motion and clean acquisition */
.starter-asset-portrait {
  display:grid;
  place-items:center;
  overflow:visible;
  background:transparent;
}
.starter-asset-portrait img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  image-rendering:auto;
  filter:drop-shadow(0 16px 12px rgba(0,0,0,.22)) drop-shadow(0 0 1px rgba(255,255,255,.38));
  transform-origin:50% 82%;
}
.starter-skill-art { display:grid; place-items:center; overflow:hidden; background:none!important; }
.starter-skill-art img { display:block; width:100%; height:100%; object-fit:contain; border-radius:inherit; }

.starter-experience {
  width:min(1160px,100%);
  max-height:min(820px,calc(100vh - 34px));
  border-radius:25px;
}
.starter-flow-header {
  min-height:82px;
  grid-template-columns:minmax(0,1fr) auto 42px;
  padding:14px 18px 12px 22px;
}
.starter-flow-header small { font-size:8px; }
.starter-flow-header b { font-size:clamp(23px,2.35vw,32px); }
.starter-flow-steps { gap:7px; }
.starter-flow-steps i {
  width:31px;
  height:31px;
  font-size:10px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .2s,background .2s,border-color .2s,box-shadow .2s;
}
.starter-flow-steps em { width:20px; }
.starter-flow-steps i.is-active { transform:scale(1.08); box-shadow:0 0 0 5px rgba(67,183,239,.1),inset 0 1px 0 rgba(255,255,255,.14); }
.starter-flow-content {
  max-height:calc(min(820px,100vh - 34px) - 82px);
  padding:22px 24px 24px;
}
.starter-flow-lead,.starter-flow-hint { display:none!important; }

/* Stage 1: a clean hero card and exactly four abilities. */
.starter-choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.starter-choice-card {
  position:relative;
  display:grid;
  grid-template-rows:auto minmax(245px,1fr) auto 76px;
  min-width:0;
  min-height:455px;
  padding:14px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--starter-accent) 70%,white 10%);
  border-radius:23px;
  background:
    radial-gradient(circle at 50% 34%,color-mix(in srgb,var(--starter-accent) 24%,transparent),transparent 48%),
    linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
  color:var(--starter-text);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 34px rgba(0,10,18,.21);
  animation:starterChoiceIn .46s calc(var(--starter-index,0) * 80ms) cubic-bezier(.2,.8,.2,1) both;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,filter .22s ease;
}
@keyframes starterChoiceIn { from { opacity:0; transform:translateY(14px) scale(.985); } to { opacity:1; transform:none; } }
.starter-choice-card::before {
  content:'';
  position:absolute;
  inset:-32% -24% auto;
  height:54%;
  background:radial-gradient(circle,color-mix(in srgb,var(--starter-accent) 28%,transparent),transparent 65%);
  opacity:.46;
  pointer-events:none;
}
.starter-choice-card:hover,.starter-choice-card:focus-visible {
  transform:translateY(-6px) scale(1.012);
  border-color:color-mix(in srgb,var(--starter-accent) 90%,white 14%);
  box-shadow:0 22px 48px rgba(0,10,18,.3),0 0 0 2px color-mix(in srgb,var(--starter-accent) 20%,transparent),inset 0 1px 0 rgba(255,255,255,.13);
  filter:brightness(1.055);
}
.starter-choice-card:active { transform:translateY(-2px) scale(.995); }
.starter-card-element {
  position:relative;
  z-index:3;
  justify-self:center;
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:30px;
  padding:0 12px;
  border:1px solid color-mix(in srgb,var(--starter-accent) 62%,white 8%);
  border-radius:999px;
  background:rgba(2,22,31,.64);
  color:#fff;
  font-size:14px;
}
.starter-card-element b { font-size:9px; }
.starter-card-art { position:relative; display:grid; place-items:center; min-height:0; }
.starter-card-art::after {
  content:'';
  position:absolute;
  left:18%; right:18%; bottom:8%; height:12%;
  border-radius:50%;
  background:color-mix(in srgb,var(--starter-accent) 24%,transparent);
  filter:blur(12px);
  opacity:.65;
}
.starter-card-portrait {
  position:relative;
  z-index:2;
  width:100%;
  height:255px;
  padding:6px;
  border-radius:18px;
  background:transparent;
}
.starter-card-portrait img { width:98%; height:98%; animation:starterStickerFloat 2.8s ease-in-out infinite; }
@keyframes starterStickerFloat { 50% { transform:translateY(-5px) rotate(.4deg); } }
.starter-card-name { display:grid; justify-items:center; gap:4px; padding:5px 4px 2px; }
.starter-card-name b { font-size:25px; line-height:1; }
.starter-card-name small { color:rgba(226,241,248,.7); font-size:10px; font-weight:750; text-transform:none; }
.starter-card-skills { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; padding:7px 5px 2px; }
.starter-card-skills > i {
  position:relative;
  display:grid;
  place-items:center;
  aspect-ratio:1;
  padding:4px;
  border:1px solid color-mix(in srgb,var(--starter-accent) 48%,rgba(255,255,255,.12));
  border-radius:50%;
  background:rgba(0,18,26,.56);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 5px 12px rgba(0,0,0,.14);
  transition:transform .18s,filter .18s,border-color .18s;
}
.starter-card-skills > i:hover { transform:translateY(-2px) scale(1.06); filter:brightness(1.12); border-color:var(--starter-accent); }
.starter-card-skills > i > small {
  position:absolute;
  top:-3px;
  left:-3px;
  z-index:2;
  display:grid;
  place-items:center;
  width:18px;
  height:18px;
  border-radius:50%;
  background:color-mix(in srgb,var(--starter-accent) 72%,#092532 28%);
  color:#fff;
  font:900 8px/1 system-ui;
}
.starter-card-skill-dot { width:100%; height:100%; border-radius:50%; }
.starter-choice-card > .starter-stat-grid,.starter-choice-card > em { display:none!important; }

/* Stage 2: stable profile card with readable bars. */
.starter-details-view { display:grid; grid-template-columns:minmax(360px,.92fr) minmax(0,1.22fr); gap:24px; align-items:start; }
.starter-profile-card,.starter-flip-shell,.starter-flip-inner { min-height:575px; }
.starter-flip-inner { transition:transform .62s cubic-bezier(.18,.78,.2,1); }
.starter-flip-face { border-radius:24px; }
.starter-flip-back { gap:10px; }
.starter-flip-back > span { width:108px; height:108px; font-size:56px; }
.starter-flip-back small { font-size:12px; font-weight:850; letter-spacing:.04em; }
.starter-flip-front {
  grid-template-rows:auto 235px auto auto;
  align-content:start;
  gap:9px;
  padding:15px;
  overflow:hidden;
}
.starter-profile-head { display:flex!important; align-items:center; justify-content:space-between; gap:10px; width:100%; padding:0!important; }
.starter-detail-element { flex:0 0 auto; padding:6px 10px; font-size:9px; }
.starter-profile-physical { margin-left:auto; }
.starter-vitals { display:flex!important; gap:6px!important; width:auto!important; padding:0!important; }
.starter-vitals > span {
  display:grid;
  gap:1px;
  min-width:66px;
  padding:5px 7px;
  border:1px solid rgba(154,207,226,.12);
  border-radius:9px;
  background:rgba(255,255,255,.035);
  text-align:left;
}
.starter-vitals small { color:rgba(207,229,238,.56); font-size:7px; font-weight:900; letter-spacing:.05em; }
.starter-vitals b { font-size:10px; }
.starter-profile-hero { display:grid; place-items:center; min-height:0; overflow:visible; }
.starter-detail-portrait { width:100%; height:230px; min-height:0; padding:2px; background:transparent; }
.starter-detail-portrait img { width:98%; height:98%; animation:starterStickerFloat 2.8s ease-in-out infinite; }
.starter-flip-front > .starter-detail-identity {
  display:grid;
  justify-items:start;
  gap:5px;
  width:100%;
  padding:0!important;
}
.starter-detail-identity b { font-size:27px!important; line-height:1; }
.starter-detail-identity > small { color:rgba(223,238,245,.7)!important; font-size:10px!important; text-align:left!important; }
.starter-detail-identity .pokemon-type-list { justify-content:flex-start; }
.starter-profile-stats { display:grid!important; gap:7px!important; width:100%!important; padding:5px 0 0!important; }
.starter-profile-stats > b { font-size:11px; color:rgba(238,249,253,.92); }
.starter-stat-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  width:100%;
}
.starter-stat {
  display:grid;
  gap:4px;
  min-width:0;
  padding:6px 8px;
  border:1px solid rgba(152,205,225,.12);
  border-radius:10px;
  background:rgba(255,255,255,.04);
}
.starter-stat > span { display:grid; grid-template-columns:16px minmax(0,1fr) auto; align-items:center; gap:5px; min-width:0; }
.starter-stat > span > i { font-size:10px; font-style:normal; }
.starter-stat small { overflow:hidden; color:rgba(216,233,241,.72); font-size:8px; font-weight:750; text-overflow:ellipsis; white-space:nowrap; }
.starter-stat b { color:#fff; font-size:11px; }
.starter-stat > em { display:block; height:4px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.075); }
.starter-stat > em > i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,color-mix(in srgb,var(--starter-accent) 74%,white 2%),var(--starter-accent)); box-shadow:0 0 8px color-mix(in srgb,var(--starter-accent) 28%,transparent); }
.starter-stat-grid.is-compact { grid-template-columns:repeat(3,minmax(0,1fr)); }

.starter-details-copy { display:grid; align-content:start; gap:12px; padding:3px 0; }
.starter-details-title { display:grid; gap:3px; }
.starter-details-title > small { color:var(--starter-accent); font-size:10px; font-weight:850; }
.starter-details-title h3 { margin:0; color:var(--starter-text); font-size:26px; line-height:1.08; }
.starter-details-title p { margin:0; color:var(--starter-muted); font-size:11px; line-height:1.4; }
.starter-details-eyebrow,.starter-details-intro { display:none!important; }
.starter-skill-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.starter-skill-chip {
  display:grid;
  grid-template-columns:56px minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-width:0;
  min-height:72px;
  padding:7px 10px;
  border:1px solid rgba(151,204,225,.16);
  border-radius:15px;
  background:rgba(255,255,255,.04);
  color:var(--starter-text);
  text-align:left;
  transition:background .18s,border-color .18s,transform .18s,box-shadow .18s;
}
.starter-skill-chip:hover,.starter-skill-chip:focus-visible,.starter-skill-chip.is-active {
  border-color:color-mix(in srgb,var(--starter-accent) 66%,rgba(255,255,255,.16));
  background:color-mix(in srgb,var(--starter-accent) 11%,rgba(255,255,255,.045));
  transform:translateY(-2px);
  box-shadow:0 8px 18px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.06);
}
.starter-skill-chip-icon { width:54px; height:54px; border-radius:50%; box-shadow:0 5px 12px rgba(0,0,0,.17); }
.starter-skill-chip span { display:grid; gap:4px; min-width:0; }
.starter-skill-chip b { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.starter-skill-chip small { color:var(--starter-muted); font-size:8px; }
.starter-skill-detail {
  display:grid;
  grid-template-columns:82px minmax(0,1fr);
  gap:13px;
  min-height:158px;
  padding:12px;
  border:1px solid color-mix(in srgb,var(--starter-accent) 34%,rgba(255,255,255,.1));
  border-radius:18px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--starter-accent) 9%,transparent),rgba(255,255,255,.035));
  animation:starterDetailIn .2s ease both;
}
@keyframes starterDetailIn { from { opacity:.35; transform:translateY(3px); } }
.starter-skill-detail-icon { display:grid; place-items:center; width:80px; height:80px; border-radius:18px; background:rgba(0,16,23,.5); }
.starter-skill-detail-atlas { width:76px; height:76px; border-radius:50%; }
.starter-skill-detail-copy { display:grid; align-content:start; gap:4px; min-width:0; }
.starter-skill-detail-copy > small { color:var(--starter-accent); font-size:8px; font-weight:900; }
.starter-skill-detail-copy > b { font-size:18px; }
.starter-skill-detail-copy > p { margin:1px 0 4px; color:var(--starter-muted); font-size:10px; line-height:1.45; }
.starter-skill-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; margin-top:3px; }
.starter-skill-metrics > i { display:grid; gap:2px; min-width:0; padding:6px 7px; border-radius:9px; background:rgba(255,255,255,.045); font-style:normal; }
.starter-skill-metrics small { color:rgba(211,230,239,.54); font-size:6.5px; font-weight:900; }
.starter-skill-metrics b { overflow:hidden; font-size:8.5px; text-overflow:ellipsis; white-space:nowrap; }
.starter-flow-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:auto; padding-top:4px; }
.starter-flow-actions button,.starter-continue { min-height:48px; padding:0 18px; border-radius:13px; font-size:10px; font-weight:900; }

/* Confirmation is concise: identity, four skills, real sprite poses. */
.starter-confirm-view { display:grid; grid-template-columns:minmax(260px,.72fr) minmax(0,1fr); gap:30px; align-items:center; min-height:470px; padding:16px 30px; }
.starter-confirm-orbit { width:min(330px,42vw); }
.starter-confirm-portrait { width:285px; height:235px; }
.starter-confirm-copy { display:grid; gap:12px; max-width:610px; }
.starter-confirm-copy > small { color:var(--starter-accent); font-size:10px; font-weight:900; }
.starter-confirm-copy h3 { margin:0; font-size:clamp(36px,4vw,52px); }
.starter-confirm-copy > p { margin:0; color:var(--starter-muted); font-size:12px; line-height:1.45; }
.starter-confirm-skills { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.starter-confirm-skills span { display:flex; align-items:center; gap:8px; min-height:54px; padding:7px 9px; border:1px solid rgba(255,255,255,.09); border-radius:13px; background:rgba(255,255,255,.035); }
.starter-confirm-skill-icon { width:40px; height:40px; border-radius:50%; }
.starter-confirm-skills b { font-size:10px; }
.starter-confirm-note { display:none!important; }
.starter-emote-strip { display:flex; align-items:center; gap:10px; }
.starter-emote-strip > i {
  display:grid;
  place-items:center;
  width:62px;
  height:62px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--starter-accent) 34%,rgba(255,255,255,.12));
  border-radius:18px;
  background:radial-gradient(circle,color-mix(in srgb,var(--starter-accent) 16%,transparent),rgba(255,255,255,.035));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
  animation:starterEmotePop 2.6s ease-in-out infinite;
}
.starter-emote-strip > i:nth-child(2) { animation-delay:.32s; }
.starter-emote-strip > i:nth-child(3) { animation-delay:.64s; }
.starter-emote-strip img { width:92%; height:92%; object-fit:contain; filter:drop-shadow(0 7px 6px rgba(0,0,0,.16)); }
@keyframes starterEmotePop { 50% { transform:translateY(-3px) scale(1.035); filter:brightness(1.07); } }

/* Reveal: use the real animated in-project sprite as the focus, not an empty stage. */
.starter-reveal-view { display:grid; align-content:center; justify-items:center; min-height:565px; overflow:hidden; }
.starter-reveal-stage { position:relative; display:grid; place-items:center; width:min(620px,88vw); height:405px; }
.starter-reveal-aura { position:absolute; left:50%; bottom:56px; width:min(520px,72%); height:210px; border-radius:50%; background:radial-gradient(ellipse,color-mix(in srgb,var(--starter-accent) 34%,transparent),transparent 68%); filter:blur(16px); transform:translateX(-50%); animation:starterAuraBreath 1.35s ease-in-out infinite alternate; }
@keyframes starterAuraBreath { from { opacity:.45; transform:translateX(-50%) scale(.94); } to { opacity:.94; transform:translateX(-50%) scale(1.055); } }
.starter-reveal-beam { height:320px; }
.starter-reveal-ring { bottom:20px; }
.starter-reveal-ring.is-secondary { width:390px; height:84px; opacity:.42; animation-delay:.34s; }
.starter-reveal-creature { width:390px; height:330px; }
.starter-reveal-portrait { width:100%; height:100%; }
.starter-reveal-caption { gap:4px; margin-top:-10px; }
.starter-reveal-caption small { font-size:10px; }
.starter-reveal-caption b { font-size:44px; }
.starter-reveal-caption span { font-size:11px; }
.starter-reveal-view[data-starter-element="fire"] .starter-reveal-particles i { box-shadow:0 0 12px #ff8c35; }
.starter-reveal-view[data-starter-element="water"] .starter-reveal-particles i { border-radius:50%; box-shadow:0 0 12px #56c8ff; }
.starter-reveal-view[data-starter-element="grass"] .starter-reveal-particles i { border-radius:70% 20% 70% 20%; box-shadow:0 0 10px #83e85e; }

/* Final partner handoff: one hero, three sticker poses, four skills, no repeated stat wall. */
.starter-partner-view { display:grid; grid-template-columns:minmax(360px,.9fr) minmax(0,1.2fr); gap:26px; min-height:520px; align-items:center; }
.starter-partner-art { min-height:500px; border-radius:25px; background:radial-gradient(circle at 50% 52%,color-mix(in srgb,var(--starter-accent) 30%,transparent),transparent 48%),linear-gradient(160deg,rgba(255,255,255,.055),rgba(0,0,0,.1)); }
.starter-partner-portrait { width:400px; height:340px; animation:starterPartnerBounce 2.3s ease-in-out infinite; }
.starter-partner-copy { display:grid; gap:11px; }
.starter-partner-copy > small { color:var(--starter-accent); font-size:10px; font-weight:900; }
.starter-partner-copy h3 { margin:0; font-size:clamp(32px,3.4vw,48px); line-height:1.04; }
.starter-partner-copy > p { max-width:640px; margin:0; color:var(--starter-muted); font-size:12px; line-height:1.48; }
.starter-partner-kit { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.starter-continue { justify-self:start; min-width:230px; min-height:52px; font-size:11px; }

/* Theme tuning. */
html[data-game-theme="light"] .game-screen .starter-stat,
html[data-game-theme="light"] .game-screen .starter-vitals > span,
html[data-game-theme="light"] .game-screen .starter-skill-metrics > i { background:rgba(255,255,255,.46); border-color:rgba(65,139,171,.13); }
html[data-game-theme="light"] .game-screen .starter-stat small,
html[data-game-theme="light"] .game-screen .starter-details-title p,
html[data-game-theme="light"] .game-screen .starter-detail-identity > small { color:rgba(45,83,105,.72)!important; }
html[data-game-theme="light"] .game-screen .starter-stat b,
html[data-game-theme="light"] .game-screen .starter-vitals b,
html[data-game-theme="light"] .game-screen .starter-skill-metrics b { color:#173c52; }
html[data-game-theme="light"] .game-screen .starter-card-name small { color:rgba(44,79,99,.72); }

/* Mobile/tablet: one card per swipe, no micro text, details stack cleanly. */
@media (max-width:900px) {
  .starter-experience { max-height:calc(100vh - 88px); border-radius:21px; }
  .starter-flow-header { min-height:68px; grid-template-columns:minmax(0,1fr) 36px; padding:9px 10px 8px 13px; gap:7px; }
  .starter-flow-header small { font-size:6.5px; }
  .starter-flow-header b { font-size:20px; white-space:normal; }
  .starter-flow-steps { display:none; }
  .starter-flow-content { max-height:calc(100vh - 156px); padding:11px; }
  .starter-choice-grid { display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; padding:2px 7vw 8px; }
  .starter-choice-card {
    flex:0 0 min(82vw,330px);
    grid-template-columns:112px minmax(0,1fr);
    grid-template-rows:auto 1fr 78px;
    min-height:245px;
    padding:9px;
    scroll-snap-align:center;
  }
  .starter-card-element { position:absolute; top:9px; left:9px; z-index:4; min-height:25px; font-size:11px; }
  .starter-card-element b { font-size:7px; }
  .starter-card-art { grid-column:1; grid-row:1/4; }
  .starter-card-portrait { width:112px; height:178px; padding:0; }
  .starter-card-name { grid-column:2; grid-row:1/3; align-content:end; justify-items:start; padding:14px 3px 8px; }
  .starter-card-name b { font-size:21px; }
  .starter-card-name small { font-size:8px; }
  .starter-card-skills { grid-column:2; grid-row:3; gap:5px; padding:3px 0; }
  .starter-card-skills > i > small { width:15px; height:15px; font-size:7px; }

  .starter-details-view,.starter-confirm-view,.starter-partner-view { grid-template-columns:1fr; gap:12px; }
  .starter-profile-card,.starter-flip-shell,.starter-flip-inner { min-height:500px; }
  .starter-flip-front { grid-template-rows:auto 190px auto auto; padding:11px; }
  .starter-detail-portrait { height:186px; }
  .starter-detail-identity b { font-size:23px!important; }
  .starter-detail-identity > small { font-size:9px!important; }
  .starter-vitals > span { min-width:58px; }
  .starter-profile-stats > b { font-size:10px; }
  .starter-stat { padding:5px 6px; }
  .starter-stat small { font-size:7px; }
  .starter-stat b { font-size:10px; }
  .starter-details-title h3 { font-size:22px; }
  .starter-details-title p { font-size:9px; }
  .starter-skill-list { gap:6px; }
  .starter-skill-chip { grid-template-columns:46px minmax(0,1fr); min-height:60px; padding:5px 7px; }
  .starter-skill-chip-icon { width:44px; height:44px; }
  .starter-skill-chip b { font-size:10px; }
  .starter-skill-chip small { font-size:7px; }
  .starter-skill-detail { grid-template-columns:62px minmax(0,1fr); min-height:138px; padding:9px; }
  .starter-skill-detail-icon { width:60px; height:60px; }
  .starter-skill-detail-atlas { width:58px; height:58px; }
  .starter-skill-detail-copy > b { font-size:15px; }
  .starter-skill-detail-copy > p { font-size:9px; }
  .starter-skill-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .starter-flow-actions { position:sticky; bottom:-11px; margin:0 -11px -11px; padding:9px 11px calc(9px + env(safe-area-inset-bottom)); background:linear-gradient(180deg,rgba(4,24,34,0),rgba(4,24,34,.96) 28%); }
  html[data-game-theme="light"] .starter-flow-actions { background:linear-gradient(180deg,rgba(231,243,248,0),rgba(231,243,248,.97) 28%); }
  .starter-flow-actions button { flex:1; min-height:46px; font-size:9px; }

  .starter-confirm-view { min-height:0; padding:5px; }
  .starter-confirm-orbit { justify-self:center; width:220px; }
  .starter-confirm-portrait { width:210px; height:170px; }
  .starter-confirm-copy h3 { font-size:32px; }
  .starter-confirm-copy > p { font-size:10px; }
  .starter-confirm-skills { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .starter-emote-strip > i { width:52px; height:52px; border-radius:15px; }

  .starter-reveal-view { min-height:470px; }
  .starter-reveal-stage { height:335px; }
  .starter-reveal-creature { width:280px; height:240px; }
  .starter-reveal-caption b { font-size:31px; }

  .starter-partner-art { min-height:280px; }
  .starter-partner-portrait { width:285px; height:238px; }
  .starter-partner-copy h3 { font-size:29px; }
  .starter-partner-copy > p { font-size:10px; }
  .starter-partner-kit { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .starter-continue { width:100%; min-width:0; }
}

@media (max-width:520px) {
  .starter-choice-grid { padding-inline:3vw; }
  .starter-choice-card { flex-basis:92vw; grid-template-columns:100px minmax(0,1fr); }
  .starter-card-portrait { width:100px; height:165px; }
  .starter-skill-list,.starter-partner-kit,.starter-confirm-skills { grid-template-columns:1fr; }
  .starter-profile-card,.starter-flip-shell,.starter-flip-inner { min-height:520px; }
  .starter-stat-grid { grid-template-columns:1fr 1fr; }
  .starter-flow-actions { flex-direction:column-reverse; }
}

@media (prefers-reduced-motion:reduce) {
  .starter-choice-card,.starter-card-portrait img,.starter-detail-portrait img,.starter-emote-strip > i,.starter-reveal-aura,.starter-asset-portrait img { animation:none!important; transition:none!important; }
}

/* v2.7.20 — starter UI cleanup: three clear steps, clean light theme, rebuilt profile and new skill art */
.starter-flow-steps i {
  width:36px;
  height:36px;
  border-width:1.5px;
  font-size:12px;
  font-weight:950;
}
.starter-flow-steps em { width:24px; }
.starter-flow-steps i.is-active { transform:scale(1.08); }

/* Step 1: hero + four skills, no secondary micro-copy. */
.starter-choice-card-v2720 {
  grid-template-rows:auto minmax(250px,1fr) auto 86px;
  min-height:470px;
  padding:15px;
}
.starter-choice-card-v2720 .starter-card-name { padding:6px 4px 4px; }
.starter-choice-card-v2720 .starter-card-name b { font-size:26px; letter-spacing:-.45px; }
.starter-choice-card-v2720 .starter-card-name small { display:none!important; }
.starter-choice-card-v2720 .starter-card-skills {
  align-self:end;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
  padding:7px 2px 1px;
}
.starter-choice-card-v2720 .starter-card-skills > i {
  position:relative;
  aspect-ratio:1;
  padding:3px;
  overflow:visible;
  border-radius:15px;
  background:rgba(2,20,28,.5);
}
.starter-choice-card-v2720 .starter-card-skills > i > small { display:none!important; }
.starter-choice-card-v2720 .starter-card-skill-dot,
.starter-choice-card-v2720 .starter-card-skill-dot img {
  width:100%;
  height:100%;
  border-radius:12px!important;
  object-fit:cover;
}
.starter-card-skill::after {
  content:attr(data-skill-name);
  position:absolute;
  z-index:15;
  left:50%;
  bottom:calc(100% + 7px);
  width:max-content;
  max-width:155px;
  padding:6px 8px;
  border:1px solid rgba(132,203,229,.24);
  border-radius:9px;
  background:rgba(5,26,36,.96);
  color:#fff;
  box-shadow:0 8px 20px rgba(0,0,0,.25);
  font:800 8px/1.2 system-ui;
  text-align:center;
  opacity:0;
  pointer-events:none;
  transform:translate(-50%,4px);
  transition:opacity .15s,transform .15s;
}
.starter-card-skill:hover::after { opacity:1; transform:translate(-50%,0); }

/* Step 2: no flip shell. One stable information card and one skill inspector. */
.starter-details-v2720 {
  grid-template-columns:minmax(390px,.92fr) minmax(0,1.25fr);
  gap:24px;
  align-items:stretch;
}
.starter-profile-v2720 {
  display:grid;
  grid-template-rows:auto 235px auto 1fr;
  gap:10px;
  min-width:0;
  min-height:600px;
  padding:16px;
  border:1px solid color-mix(in srgb,var(--starter-accent) 62%,rgba(255,255,255,.13));
  border-radius:24px;
  background:
    radial-gradient(circle at 50% 28%,color-mix(in srgb,var(--starter-accent) 18%,transparent),transparent 47%),
    linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 38px rgba(0,13,20,.16);
  overflow:hidden;
}
.starter-profile-v2720-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.starter-profile-v2720-head .starter-vitals { margin-left:auto; }
.starter-profile-v2720-hero {
  position:relative;
  display:grid;
  place-items:center;
  min-height:0;
}
.starter-profile-v2720-hero::after {
  content:'';
  position:absolute;
  left:22%;
  right:22%;
  bottom:5%;
  height:17%;
  border-radius:50%;
  background:color-mix(in srgb,var(--starter-accent) 22%,transparent);
  filter:blur(16px);
  opacity:.7;
}
.starter-profile-v2720-hero .starter-detail-portrait {
  position:relative;
  z-index:2;
  width:100%;
  height:230px;
  min-height:0;
}
.starter-profile-v2720-hero .starter-detail-portrait img { width:100%; height:100%; object-fit:contain; }
.starter-profile-v2720-identity {
  display:grid;
  justify-items:start;
  gap:5px;
}
.starter-profile-v2720-identity > b { font-size:30px; line-height:1; letter-spacing:-.55px; }
.starter-profile-v2720-identity > small { color:var(--starter-muted); font-size:10px; line-height:1.35; }
.starter-profile-v2720-identity .pokemon-type-list { justify-content:flex-start; }
.starter-profile-v2720-stats {
  display:grid;
  align-content:start;
  gap:9px;
  min-height:0;
}
.starter-profile-v2720-stats > header { display:grid; gap:2px; }
.starter-profile-v2720-stats > header b { font-size:13px; }
.starter-profile-v2720-stats > header small { color:var(--starter-muted); font-size:8px; }
.starter-profile-v2720 .starter-stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.starter-profile-v2720 .starter-stat {
  padding:8px 9px;
  border-radius:11px;
}
.starter-profile-v2720 .starter-stat > span { grid-template-columns:18px minmax(0,1fr) auto; gap:6px; }
.starter-profile-v2720 .starter-stat small { font-size:8px; }
.starter-profile-v2720 .starter-stat b { font-size:14px; }
.starter-profile-v2720 .starter-stat > em { height:5px; }

.starter-details-copy-v2720 {
  display:grid;
  grid-template-rows:auto auto auto auto;
  align-content:start;
  gap:12px;
  min-width:0;
  padding:3px 0;
}
.starter-details-copy-v2720 .starter-details-title { display:grid; gap:3px; }
.starter-details-copy-v2720 .starter-details-title small { font-size:8px; }
.starter-details-copy-v2720 .starter-details-title h3 { margin:0; font-size:27px; }
.starter-details-copy-v2720 .starter-details-title p { margin:0; color:var(--starter-muted); font-size:10px; }
.starter-skill-list-v2720 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.starter-skill-list-v2720 .starter-skill-chip {
  position:relative;
  grid-template-columns:54px minmax(0,1fr);
  min-height:102px;
  gap:10px;
  padding:9px 10px;
  border-radius:16px;
  text-align:left;
  overflow:hidden;
}
.starter-skill-list-v2720 .starter-skill-slot {
  position:absolute;
  top:6px;
  right:7px;
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border-radius:7px;
  background:color-mix(in srgb,var(--starter-accent) 18%,rgba(255,255,255,.05));
  color:var(--starter-accent);
  font:950 8px/1 system-ui;
}
.starter-skill-list-v2720 .starter-skill-chip-icon {
  width:54px;
  height:54px;
  border-radius:13px;
  box-shadow:0 5px 14px rgba(0,0,0,.2);
}
.starter-skill-chip-copy { display:grid!important; align-content:center; gap:3px!important; min-width:0; }
.starter-skill-chip-copy b { padding-right:20px; font-size:11px!important; }
.starter-skill-chip-copy small { color:var(--starter-accent)!important; font-size:7px!important; font-weight:800; }
.starter-skill-chip-copy p {
  display:-webkit-box;
  overflow:hidden;
  margin:0;
  color:var(--starter-muted);
  font-size:8px;
  line-height:1.28;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.starter-skill-chip-copy em { color:var(--starter-muted); font-size:7px; font-style:normal; font-weight:750; }
.starter-details-v2720 .starter-skill-detail {
  grid-template-columns:78px minmax(0,1fr);
  min-height:154px;
  padding:13px;
  border-radius:20px;
}
.starter-details-v2720 .starter-skill-detail-icon { width:76px; height:76px; border-radius:17px; overflow:hidden; }
.starter-details-v2720 .starter-skill-detail-atlas { width:76px; height:76px; border-radius:15px; }
.starter-details-v2720 .starter-skill-detail-copy > small { font-size:7px; }
.starter-details-v2720 .starter-skill-detail-copy > b { font-size:18px; }
.starter-details-v2720 .starter-skill-detail-copy > p { font-size:10px; line-height:1.4; }
.starter-details-v2720 .starter-skill-metrics { margin-top:4px; }
.starter-details-v2720 .starter-skill-metrics i { min-height:40px; }
.starter-details-v2720 .starter-flow-actions { margin-top:2px; }

/* Light theme must stay bright and readable, never gray-on-gray. */
html[data-game-theme="light"] .starter-experience {
  --starter-panel:linear-gradient(160deg,#fbfdff,#eef8fc);
  --starter-panel-soft:#f3f9fc;
  --starter-border:rgba(44,131,171,.26);
  --starter-text:#153f58;
  --starter-muted:#587b8f;
  background:var(--starter-panel);
}
html[data-game-theme="light"] .starter-flow-header {
  background:linear-gradient(180deg,#ffffff,#f4fafc);
  border-bottom-color:#d8e9f1;
}
html[data-game-theme="light"] .starter-flow-steps i {
  border-color:#9fcbdc;
  background:#fff;
  color:#41738a;
  box-shadow:0 2px 8px rgba(34,101,132,.08),inset 0 1px 0 #fff;
}
html[data-game-theme="light"] .starter-flow-steps em { background:#b8d6e3; }
html[data-game-theme="light"] .starter-flow-steps i.is-active {
  border-color:#078dcc;
  background:#078dcc;
  color:#fff;
  box-shadow:0 0 0 5px rgba(7,141,204,.12);
}
html[data-game-theme="light"] .starter-flow-steps i.is-done { border-color:#48a943; background:#48a943; color:#fff; }
html[data-game-theme="light"] .starter-choice-card-v2720 {
  background:
    radial-gradient(circle at 50% 32%,color-mix(in srgb,var(--starter-accent) 15%,white),transparent 52%),
    linear-gradient(180deg,#fff,#f7fbfd);
  box-shadow:0 15px 32px rgba(40,93,118,.1),inset 0 1px 0 #fff;
}
html[data-game-theme="light"] .starter-card-element {
  background:#fff;
  color:#204b62;
  box-shadow:0 3px 10px rgba(31,87,112,.08);
}
html[data-game-theme="light"] .starter-choice-card-v2720 .starter-card-skills > i {
  background:#fff;
  border-color:color-mix(in srgb,var(--starter-accent) 48%,#c7dce6);
  box-shadow:0 5px 12px rgba(38,91,116,.12),inset 0 1px 0 #fff;
}
html[data-game-theme="light"] .starter-card-skill::after { background:#173e52; }
html[data-game-theme="light"] .starter-profile-v2720 {
  background:
    radial-gradient(circle at 50% 27%,color-mix(in srgb,var(--starter-accent) 11%,white),transparent 48%),
    linear-gradient(160deg,#fff,#f7fbfd);
  box-shadow:0 15px 32px rgba(40,93,118,.09),inset 0 1px 0 #fff;
}
html[data-game-theme="light"] .starter-profile-v2720 .starter-vitals > span,
html[data-game-theme="light"] .starter-profile-v2720 .starter-stat,
html[data-game-theme="light"] .starter-skill-list-v2720 .starter-skill-chip,
html[data-game-theme="light"] .starter-details-v2720 .starter-skill-detail,
html[data-game-theme="light"] .starter-details-v2720 .starter-skill-metrics > i {
  border-color:#d6e7ee;
  background:#fff;
  color:#173f56;
  box-shadow:0 4px 12px rgba(38,91,116,.05);
}
html[data-game-theme="light"] .starter-skill-list-v2720 .starter-skill-chip.is-active {
  border-color:color-mix(in srgb,var(--starter-accent) 70%,#b7d5e2);
  background:color-mix(in srgb,var(--starter-accent) 7%,#fff);
}
html[data-game-theme="light"] .starter-profile-v2720-identity > small,
html[data-game-theme="light"] .starter-profile-v2720-stats > header small,
html[data-game-theme="light"] .starter-skill-chip-copy p,
html[data-game-theme="light"] .starter-skill-chip-copy em,
html[data-game-theme="light"] .starter-details-copy-v2720 .starter-details-title p,
html[data-game-theme="light"] .starter-details-v2720 .starter-skill-detail-copy > p { color:#5c7d8f!important; }
html[data-game-theme="light"] .starter-profile-v2720 .starter-stat small { color:#5c7d8f; }
html[data-game-theme="light"] .starter-profile-v2720 .starter-stat b,
html[data-game-theme="light"] .starter-profile-v2720 .starter-vitals b,
html[data-game-theme="light"] .starter-details-v2720 .starter-skill-detail-copy > b,
html[data-game-theme="light"] .starter-details-v2720 .starter-skill-metrics b { color:#173f56; }

@media (max-width:900px) {
  .starter-choice-card-v2720 {
    flex-basis:min(86vw,340px);
    grid-template-columns:112px minmax(0,1fr);
    grid-template-rows:auto 1fr 70px;
    min-height:238px;
  }
  .starter-choice-card-v2720 .starter-card-name { align-content:end; justify-items:start; }
  .starter-choice-card-v2720 .starter-card-name b { font-size:22px; }
  .starter-choice-card-v2720 .starter-card-skills { gap:5px; }
  .starter-choice-card-v2720 .starter-card-skills > i { border-radius:11px; }
  .starter-choice-card-v2720 .starter-card-skill-dot,
  .starter-choice-card-v2720 .starter-card-skill-dot img { border-radius:9px!important; }
  .starter-card-skill::after { display:none; }

  .starter-details-v2720 { grid-template-columns:1fr; gap:12px; }
  .starter-profile-v2720 {
    grid-template-columns:132px minmax(0,1fr);
    grid-template-rows:auto 150px auto;
    min-height:0;
    padding:11px;
  }
  .starter-profile-v2720-head { grid-column:1/-1; }
  .starter-profile-v2720-hero { grid-column:1; grid-row:2/4; }
  .starter-profile-v2720-hero .starter-detail-portrait { height:170px; }
  .starter-profile-v2720-identity { grid-column:2; grid-row:2; align-self:center; }
  .starter-profile-v2720-identity > b { font-size:24px; }
  .starter-profile-v2720-stats { grid-column:1/-1; grid-row:4; }
  .starter-profile-v2720 .starter-stat-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .starter-skill-list-v2720 .starter-skill-chip { min-height:88px; }
  .starter-details-v2720 .starter-skill-detail { min-height:132px; }
}

@media (max-width:560px) {
  .starter-profile-v2720 { grid-template-columns:105px minmax(0,1fr); }
  .starter-profile-v2720-head .starter-vitals { display:none!important; }
  .starter-profile-v2720-hero .starter-detail-portrait { height:145px; }
  .starter-profile-v2720 .starter-stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .starter-skill-list-v2720 { grid-template-columns:1fr; }
  .starter-skill-list-v2720 .starter-skill-chip { min-height:78px; }
}

@media (prefers-reduced-motion:reduce) {
  .starter-card-skill::after { transition:none; }
}

/* v2.7.21 — modern Pokédex species cards and full Kanto dossier */
.side-panel.is-pokedex-detail {
  width:min(760px,calc(100vw - 118px));
  padding:20px;
}
.pokedex-grid-v2721 .pokedex-species-card {
  width:100%;
  border:1px solid color-mix(in srgb,var(--theme-border,#b9d4e2) 78%,transparent);
  background:color-mix(in srgb,var(--theme-surface,#f7fbfd) 94%,transparent);
  color:var(--theme-text,#173c55);
  text-align:left;
  cursor:pointer;
  transition:transform .16s,border-color .16s,box-shadow .16s,background .16s;
}
.pokedex-grid-v2721 .pokedex-species-card:hover {
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--theme-accent,#148fd3) 50%,var(--theme-border,#b9d4e2));
  box-shadow:0 10px 22px rgba(14,66,96,.12);
}
.pokedex-grid-v2721 .pokedex-species-card.is-locked { filter:none; opacity:.78; }
.pokedex-grid-v2721 .pokedex-species-card .creature-portrait { background:color-mix(in srgb,var(--theme-surface-soft,#edf6fa) 92%,transparent); }

.dex-detail-shell { display:grid; gap:14px; color:var(--theme-text,#173c55); }
.dex-detail-head {
  position:sticky; z-index:5; top:-20px;
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px;
  margin:-20px -20px 0; padding:16px 20px 13px;
  border-bottom:1px solid var(--theme-border,#c5dce8);
  background:color-mix(in srgb,var(--theme-surface,#f7fbfd) 92%,transparent);
  backdrop-filter:blur(14px);
}
.dex-detail-head > button,.dex-detail-head > div button {
  min-height:34px; padding:0 11px; border:1px solid var(--theme-border,#c3d9e5); border-radius:10px;
  background:var(--theme-surface-soft,#eaf4f8); color:var(--theme-text,#173c55); font-size:9px; font-weight:850;
}
.dex-detail-head > span small { display:block; color:var(--theme-accent,#168fd4); font-size:7px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.dex-detail-head h2 { margin:2px 0 0; font-size:28px; line-height:1; letter-spacing:-.7px; }
.dex-detail-head > div { display:flex; gap:5px; }
.dex-detail-head > div button { width:34px; padding:0; font-size:20px; }

.dex-hero-grid { display:grid; grid-template-columns:minmax(245px,.92fr) minmax(300px,1.08fr); gap:12px; }
.dex-hero-card,.dex-stats-card,.dex-section {
  overflow:hidden; border:1px solid var(--theme-border,#c9dde7); border-radius:18px;
  background:color-mix(in srgb,var(--theme-surface,#f8fcfe) 95%,transparent);
  box-shadow:0 8px 20px rgba(12,61,90,.07);
}
.dex-hero-card { padding:11px; }
.dex-visual-tabs { display:flex; gap:5px; margin-bottom:8px; }
.dex-visual-tabs button {
  min-height:28px; padding:0 10px; border:1px solid var(--theme-border,#c9dde7); border-radius:9px;
  background:var(--theme-surface-soft,#edf6fa); color:var(--theme-muted,#648398); font-size:8px; font-weight:850;
}
.dex-visual-tabs button.is-active { border-color:var(--theme-accent,#1590d5); background:color-mix(in srgb,var(--theme-accent,#1590d5) 12%,var(--theme-surface,#fff)); color:var(--theme-accent,#1590d5); }
.dex-visual {
  position:relative; display:grid; place-items:center; min-height:242px; overflow:hidden;
  border-radius:16px; background:radial-gradient(circle at 50% 48%,color-mix(in srgb,var(--theme-accent,#1c9ce1) 12%,transparent),transparent 58%),var(--theme-surface-soft,#edf6fa);
}
.dex-main-portrait { display:grid; place-items:center; width:220px; height:220px; background:transparent !important; }
.dex-main-portrait img { width:100%; height:100%; object-fit:contain; image-rendering:auto; filter:drop-shadow(0 10px 12px rgba(0,22,34,.12)); }
.dex-visual > span { position:absolute; left:10px; bottom:10px; padding:4px 8px; border-radius:999px; background:rgba(9,42,57,.78); color:#fff; font-size:7px; font-weight:900; }
.dex-visual-shiny-pending::after { content:'✦'; position:absolute; right:18px; top:14px; color:#f1c849; font-size:24px; animation:dexShinyPulse 2.4s ease-in-out infinite; }
.dex-visual-shiny-pending > small { position:absolute; right:10px; bottom:10px; max-width:155px; padding:5px 7px; border-radius:8px; background:rgba(9,42,57,.72); color:#e9f5fb; font-size:6px; line-height:1.25; text-align:right; }
@keyframes dexShinyPulse { 50% { transform:scale(1.18) rotate(8deg); filter:brightness(1.25); } }
.dex-identity { display:grid; gap:7px; padding:10px 2px 2px; }
.dex-identity > div { display:flex; flex-wrap:wrap; gap:5px; }
.dex-identity p { margin:0; color:var(--theme-muted,#638296); font-size:8px; line-height:1.35; }
.dex-physical { display:grid; grid-template-columns:repeat(2,1fr); gap:6px; margin-top:8px; }
.dex-physical span { padding:8px 9px; border:1px solid var(--theme-border,#d1e1e9); border-radius:11px; background:var(--theme-surface-soft,#eef6f9); }
.dex-physical small,.dex-physical b { display:block; }
.dex-physical small { color:var(--theme-muted,#7190a2); font-size:6px; font-weight:900; letter-spacing:.07em; }
.dex-physical b { margin-top:2px; font-size:13px; }

.dex-stats-card { padding:14px; }
.dex-stats-card > header { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:10px; }
.dex-stats-card > header small,.dex-stats-card > header b { display:block; }
.dex-stats-card > header small { color:var(--theme-accent,#178fd1); font-size:7px; font-weight:900; letter-spacing:.09em; }
.dex-stats-card > header b { margin-top:3px; font-size:20px; }
.dex-stats-card > header em { max-width:145px; color:var(--theme-muted,#708b9b); font-size:6px; font-style:normal; line-height:1.3; text-align:right; }
.dex-stat-row { display:grid; grid-template-columns:minmax(118px,1fr) 34px; gap:7px; align-items:center; margin:8px 0; }
.dex-stat-row > span { display:flex; align-items:center; gap:7px; min-width:0; }
.dex-stat-row > span i { width:19px; color:var(--theme-accent,#168fd4); font-size:12px; font-style:normal; text-align:center; }
.dex-stat-row > span b { overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.dex-stat-row > strong { font-size:13px; text-align:right; }
.dex-stat-row > em { grid-column:1/-1; display:block; height:5px; overflow:hidden; border-radius:99px; background:color-mix(in srgb,var(--theme-border,#c8dde7) 72%,transparent); }
.dex-stat-row > em > i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--theme-accent,#168fd4),#63d578); }
.dex-stats-card > footer { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-top:13px; }
.dex-stats-card > footer span { padding:8px; border-radius:10px; background:var(--theme-surface-soft,#eef6f9); }
.dex-stats-card > footer small,.dex-stats-card > footer b { display:block; }
.dex-stats-card > footer small { color:var(--theme-muted,#7590a1); font-size:5.8px; font-weight:900; }
.dex-stats-card > footer b { margin-top:3px; overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }

.dex-section { padding:14px; }
.dex-section > header { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:11px; }
.dex-section > header small { color:var(--theme-accent,#168fd4); font-size:7px; font-weight:900; letter-spacing:.09em; }
.dex-section > header h3 { margin:2px 0 0; font-size:18px; }
.dex-section > header em { max-width:285px; color:var(--theme-muted,#718b9b); font-size:6.5px; font-style:normal; line-height:1.3; text-align:right; }
.dex-evolution-chain { display:flex; align-items:stretch; gap:6px; overflow:auto hidden; padding-bottom:3px; }
.dex-evolution-chain > i { align-self:center; color:var(--theme-muted,#7e99a8); font-size:18px; font-style:normal; }
.dex-evolution-chain button { display:grid; grid-template-columns:54px minmax(82px,1fr); align-items:center; gap:7px; min-width:148px; padding:7px; border:1px solid var(--theme-border,#c9dde7); border-radius:13px; background:var(--theme-surface-soft,#eef6f9); color:var(--theme-text,#173c55); text-align:left; }
.dex-evolution-chain button.is-current { border-color:#6ad054; background:color-mix(in srgb,#6ad054 9%,var(--theme-surface,#fff)); }
.dex-evo-portrait { width:52px; height:52px; border-radius:11px; background:transparent; }
.dex-evolution-chain button span small,.dex-evolution-chain button span b,.dex-evolution-chain button span em { display:block; }
.dex-evolution-chain button span small { color:var(--theme-muted,#7390a1); font-size:6px; }
.dex-evolution-chain button span b { margin:2px 0; font-size:9px; }
.dex-evolution-chain button span em { color:var(--theme-accent,#168fd4); font-size:6.5px; font-style:normal; font-weight:800; }
.dex-evolution-branches,.dex-form-list { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.dex-evolution-branches button,.dex-form-list span { padding:6px 9px; border:1px solid var(--theme-border,#c9dde7); border-radius:9px; background:var(--theme-surface-soft,#eef6f9); color:var(--theme-text,#173c55); }
.dex-evolution-branches b,.dex-evolution-branches small { display:block; }
.dex-evolution-branches b { font-size:8px; }.dex-evolution-branches small { color:var(--theme-muted,#728c9d); font-size:6px; }
.dex-form-list > small { width:100%; color:#8a62c6; font-size:6px; font-weight:900; letter-spacing:.08em; }
.dex-form-list span { border-color:color-mix(in srgb,#9b6adb 45%,var(--theme-border,#c9dde7)); color:#8052bb; font-size:7px; font-weight:800; }

.dex-skills-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:7px; }
.dex-skill-card { display:grid; grid-template-columns:54px minmax(0,1fr); align-items:center; gap:8px; min-height:70px; padding:8px; border:1px solid var(--theme-border,#cadde7); border-radius:13px; background:var(--theme-surface-soft,#eef6f9); color:var(--theme-text,#173c55); text-align:left; transition:border-color .16s,transform .16s,background .16s; }
.dex-skill-card:hover { transform:translateY(-1px); }
.dex-skill-card.is-active { border-color:var(--theme-accent,#168fd4); background:color-mix(in srgb,var(--theme-accent,#168fd4) 8%,var(--theme-surface,#fff)); }
.dex-skill-card > span { display:grid; place-items:center; width:52px; height:52px; overflow:hidden; border-radius:13px; background:rgba(5,32,44,.86); }
.dex-skill-icon { width:100%; height:100%; object-fit:cover; }
.dex-skill-card i { min-width:0; font-style:normal; }
.dex-skill-card small,.dex-skill-card b,.dex-skill-card em { display:block; }
.dex-skill-card small { overflow:hidden; color:var(--theme-muted,#718d9d); font-size:6px; text-overflow:ellipsis; white-space:nowrap; }
.dex-skill-card b { margin:3px 0; overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.dex-skill-card em { color:var(--theme-accent,#168fd4); font-size:6.5px; font-style:normal; font-weight:800; }
.dex-skill-detail { display:grid; grid-template-columns:78px minmax(0,1fr); gap:11px; margin-top:9px; padding:11px; border:1px solid color-mix(in srgb,var(--theme-accent,#168fd4) 45%,var(--theme-border,#cadde7)); border-radius:15px; background:color-mix(in srgb,var(--theme-accent,#168fd4) 6%,var(--theme-surface,#fff)); }
.dex-skill-detail > div { display:grid; place-items:center; width:78px; height:78px; overflow:hidden; border-radius:16px; background:rgba(5,32,44,.88); }
.dex-skill-detail-icon { width:100%; height:100%; object-fit:cover; }
.dex-skill-detail > span small,.dex-skill-detail > span b { display:block; }
.dex-skill-detail > span > small { color:var(--theme-accent,#168fd4); font-size:6px; font-weight:900; letter-spacing:.07em; }
.dex-skill-detail > span > b { margin-top:2px; font-size:15px; }
.dex-skill-detail p { margin:5px 0 8px; color:var(--theme-muted,#617f91); font-size:8px; line-height:1.42; }
.dex-skill-detail section { display:grid; grid-template-columns:repeat(4,1fr); gap:5px; }
.dex-skill-detail section i { padding:6px; border-radius:8px; background:var(--theme-surface-soft,#eef6f9); font-style:normal; }
.dex-skill-detail section small,.dex-skill-detail section strong { display:block; }
.dex-skill-detail section small { color:var(--theme-muted,#7792a2); font-size:5px; font-weight:900; }
.dex-skill-detail section strong { margin-top:2px; font-size:8px; }

.dex-source-section { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; }
.dex-source-section small,.dex-source-section b { display:block; }
.dex-source-section small { color:var(--theme-accent,#168fd4); font-size:6px; font-weight:900; letter-spacing:.08em; }
.dex-source-section b { margin-top:2px; font-size:11px; }
.dex-source-section p { margin:4px 0 0; color:var(--theme-muted,#6d899a); font-size:7px; line-height:1.4; }
.dex-source-section a { padding:8px 10px; border:1px solid var(--theme-border,#c9dde7); border-radius:10px; background:var(--theme-surface-soft,#eef6f9); color:var(--theme-accent,#168fd4); font-size:7px; font-weight:900; text-decoration:none; white-space:nowrap; }

html[data-game-theme="dark"] .side-panel.is-pokedex-detail .dex-hero-card,
html[data-game-theme="dark"] .side-panel.is-pokedex-detail .dex-stats-card,
html[data-game-theme="dark"] .side-panel.is-pokedex-detail .dex-section,
html[data-game-theme="dark"] .side-panel.is-pokedex-detail .pokedex-species-card {
  box-shadow:0 10px 24px rgba(0,12,20,.18);
}

@media (max-width:980px) {
  .side-panel.is-pokedex-detail { width:min(660px,calc(100vw - 28px)); }
  .dex-hero-grid { grid-template-columns:1fr; }
  .dex-main-portrait { width:190px; height:190px; }
  .dex-visual { min-height:210px; }
}
@media (max-width:760px) {
  .side-panel.is-pokedex-detail { top:8px; right:6px; bottom:72px; width:calc(100vw - 12px); padding:12px; border-radius:18px; }
  .dex-detail-head { top:-12px; margin:-12px -12px 0; padding:11px 12px 10px; }
  .dex-detail-head h2 { font-size:21px; }
  .dex-detail-head > button { font-size:8px; }
  .dex-hero-grid { grid-template-columns:1fr; }
  .dex-visual { min-height:185px; }
  .dex-main-portrait { width:170px; height:170px; }
  .dex-stats-card > footer { grid-template-columns:1fr 1fr; }
  .dex-skills-grid { grid-template-columns:1fr; }
  .dex-skill-detail { grid-template-columns:58px minmax(0,1fr); gap:8px; }
  .dex-skill-detail > div { width:58px; height:58px; }
  .dex-skill-detail section { grid-template-columns:1fr 1fr; }
  .dex-section > header { align-items:start; flex-direction:column; gap:4px; }
  .dex-section > header em { max-width:none; text-align:left; }
  .dex-source-section { grid-template-columns:1fr; }
  .dex-source-section a { width:max-content; }
}
@media (prefers-reduced-motion:reduce) {
  .pokedex-grid-v2721 .pokedex-species-card,.dex-skill-card,.dex-visual-shiny-pending::after { transition:none !important; animation:none !important; }
}

/* v2.7.22 — living Pokémon size system + in-game mechanics guide */
.mechanics-shell { display:grid; gap:14px; }
.mechanics-live-card {
  display:grid;
  grid-template-columns:74px minmax(0,1fr);
  align-items:center;
  gap:12px;
  padding:13px;
  border:1px solid color-mix(in srgb,var(--theme-accent,#168fd4) 42%,var(--theme-border,#c9dde7));
  border-radius:18px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--theme-accent,#168fd4) 8%,var(--theme-surface,#fff)),var(--theme-surface-soft,#eef6f9));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.mechanics-live-card > span { display:grid; place-items:center; width:74px; height:74px; border-radius:18px; background:color-mix(in srgb,var(--theme-accent,#168fd4) 9%,var(--theme-surface,#fff)); }
.mechanics-live-emoji { display:grid; place-items:center; width:62px; height:62px; }
.mechanics-live-emoji img { width:100%; height:100%; object-fit:contain; }
.mechanics-live-card small,.mechanics-live-card b,.mechanics-live-card p,.mechanics-live-card em { display:block; }
.mechanics-live-card small { color:var(--theme-accent,#168fd4); font-size:7px; font-weight:900; letter-spacing:.08em; }
.mechanics-live-card b { margin-top:3px; color:var(--theme-text,#173c55); font-size:15px; }
.mechanics-live-card p { margin:4px 0 1px; color:var(--theme-text,#173c55); font-size:11px; font-weight:800; }
.mechanics-live-card em { color:var(--theme-muted,#6d899a); font-size:8px; font-style:normal; line-height:1.35; }
.mechanics-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.mechanics-card { min-width:0; padding:13px; border:1px solid var(--theme-border,#c9dde7); border-radius:17px; background:var(--theme-surface-soft,#eef6f9); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
.mechanics-card header { display:flex; align-items:center; gap:9px; }
.mechanics-card header > i { display:grid; place-items:center; width:39px; height:39px; flex:0 0 auto; border-radius:12px; background:color-mix(in srgb,var(--theme-accent,#168fd4) 10%,var(--theme-surface,#fff)); font-size:21px; font-style:normal; }
.mechanics-card header span { min-width:0; }
.mechanics-card header small,.mechanics-card header b { display:block; }
.mechanics-card header small { color:#5fbe74; font-size:6px; font-weight:1000; letter-spacing:.08em; }
.mechanics-card header b { margin-top:2px; overflow:hidden; color:var(--theme-text,#173c55); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.mechanics-card > p { margin:9px 0 8px; color:var(--theme-text,#173c55); font-size:9px; font-weight:750; line-height:1.35; }
.mechanics-card ul { display:grid; gap:5px; margin:0; padding:0; list-style:none; }
.mechanics-card li { position:relative; padding-left:14px; color:var(--theme-muted,#6d899a); font-size:7.5px; line-height:1.35; }
.mechanics-card li::before { content:'•'; position:absolute; left:2px; color:var(--theme-accent,#168fd4); font-weight:1000; }
.dex-physical span em { display:block; margin-top:2px; color:var(--theme-muted,#7892a1); font-size:5.5px; font-style:normal; font-weight:700; }
html[data-game-theme="dark"] .mechanics-card,
html[data-game-theme="dark"] .mechanics-live-card { box-shadow:0 10px 24px rgba(0,12,20,.16),inset 0 1px 0 rgba(255,255,255,.05); }
@media (max-width:760px) {
  .mobile-dock { grid-template-columns:repeat(8,minmax(0,1fr)) !important; }
  .mobile-dock b { font-size:4.5px !important; }
  .mechanics-grid { grid-template-columns:1fr; }
  .mechanics-live-card { grid-template-columns:56px minmax(0,1fr); padding:10px; }
  .mechanics-live-card > span { width:56px; height:56px; border-radius:14px; }
  .mechanics-live-emoji { width:48px; height:48px; }
  .mechanics-live-card b { font-size:12px; }
  .mechanics-card { padding:11px; }
}

/* v2.7.23 — species-specific size ecology in the Pokédex */
.dex-physical-profile { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:9px; }
.dex-physical-profile > article {
  display:grid; grid-template-columns:34px minmax(0,1fr); align-items:center; gap:8px;
  min-height:64px; padding:9px; border:1px solid var(--theme-border,#d1e1e9); border-radius:13px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--theme-surface-soft,#eef6f9) 96%,transparent),color-mix(in srgb,var(--theme-accent,#168fd4) 4%,var(--theme-surface,#fff)));
}
.dex-physical-profile > article > img,.dex-size-frequency-card header img {
  width:30px; height:30px; padding:5px; border-radius:10px;
  background:color-mix(in srgb,var(--theme-accent,#168fd4) 10%,var(--theme-surface,#fff));
  color:var(--theme-accent,#168fd4);
}
.dex-physical-profile article span { min-width:0; }
.dex-physical-profile article small,.dex-physical-profile article b,.dex-physical-profile article em { display:block; }
.dex-physical-profile article small { color:var(--theme-muted,#7190a2); font-size:5.8px; font-weight:900; letter-spacing:.07em; }
.dex-physical-profile article b { margin-top:2px; font-size:13px; }
.dex-physical-profile article em { margin-top:2px; color:var(--theme-muted,#678597); font-size:6.5px; font-style:normal; line-height:1.3; }
.dex-physical-profile .dex-size-range-card { grid-column:1/-1; grid-template-columns:34px minmax(0,1fr); }
.dex-physical-profile .dex-size-frequency-card { grid-column:1/-1; display:block; min-height:0; padding:10px; }
.dex-size-frequency-card > header { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.dex-size-frequency-card > header img { flex:0 0 auto; }
.dex-size-distribution { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; height:76px; }
.dex-size-frequency { display:grid; grid-template-rows:auto 1fr auto; justify-items:center; gap:3px; min-width:0; }
.dex-size-frequency > b { color:var(--theme-text,#173c55); font-size:6.5px; }
.dex-size-frequency > i { position:relative; display:flex; align-items:end; width:100%; max-width:25px; min-height:43px; overflow:hidden; border-radius:6px; background:color-mix(in srgb,var(--theme-border,#c9dde7) 60%,transparent); }
.dex-size-frequency > i > em { display:block; width:100%; min-height:2px; border-radius:5px 5px 0 0; background:linear-gradient(180deg,#66db77,var(--theme-accent,#168fd4)); }
.dex-size-frequency > small { color:var(--theme-muted,#738f9f); font-size:5.5px; font-weight:800; }
.dex-size-frequency.is-impossible { opacity:.28; }
.dex-physical-secondary { margin-top:7px; }
.dex-physical-secondary span { min-height:45px; }
html[data-game-theme="dark"] .dex-physical-profile > article { background:linear-gradient(145deg,rgba(15,47,60,.88),rgba(12,39,53,.78)); }
html[data-game-theme="dark"] .dex-physical-profile > article > img,
html[data-game-theme="dark"] .dex-size-frequency-card header img { background:rgba(44,135,181,.14); }
@media (max-width:760px) {
  .dex-physical-profile { grid-template-columns:1fr; }
  .dex-physical-profile .dex-size-range-card,.dex-physical-profile .dex-size-frequency-card { grid-column:auto; }
  .dex-size-distribution { height:68px; gap:3px; }
  .dex-size-frequency > i { min-height:38px; }
}


/* v2.7.24 — real Pokémon emoji pack, red battle CTA and smaller Bug encounters */
.interaction-card.is-battle-action > .interaction-card__cta {
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 18px var(--ic-cta-shadow),0 0 0 1px rgba(255,88,88,.08);
}
html[data-game-theme="light"] .interaction-card.is-battle-action {
  --ic-visual-bg:radial-gradient(circle at 35% 30%,rgba(255,211,207,.82),rgba(235,242,244,.96));
  --ic-cta-bg:linear-gradient(180deg,rgba(244,82,74,.96),rgba(197,43,48,.97));
  --ic-cta-border:rgba(255,145,136,.68);
  --ic-cta-shadow:rgba(176,39,43,.18);
}

/* v2.7.25 — player interaction wheel and manual PvP */
.player-action-wheel {
  position:fixed;
  z-index:74;
  left:var(--player-wheel-x,50vw);
  top:var(--player-wheel-y,50vh);
  width:238px;
  height:238px;
  transform:translate(-50%,-50%) scale(.86);
  opacity:0;
  pointer-events:none;
  transition:opacity .16s ease,transform .18s cubic-bezier(.2,.8,.2,1);
  filter:drop-shadow(0 18px 34px rgba(0,20,32,.28));
}
.player-action-wheel.is-open { opacity:1; transform:translate(-50%,-50%) scale(1); pointer-events:auto; }
.player-action-wheel__center {
  position:absolute;
  left:50%; top:50%;
  display:grid;
  justify-items:center;
  align-content:center;
  width:112px; height:112px;
  padding:8px;
  transform:translate(-50%,-50%);
  border:1px solid rgba(125,203,237,.34);
  border-radius:50%;
  background:linear-gradient(160deg,rgba(7,39,52,.96),rgba(4,25,35,.96));
  color:#f6fbff;
  box-shadow:inset 0 1px rgba(255,255,255,.08),0 10px 22px rgba(0,18,29,.24);
  text-align:center;
}
.player-action-wheel__avatar { display:grid; place-items:center; width:34px; height:34px; margin-bottom:4px; border-radius:50%; background:rgba(92,190,238,.14); color:#76d5ff; }
.player-action-wheel__avatar .ui-icon { width:21px; height:21px; }
.player-action-wheel__center b { max-width:92px; overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.player-action-wheel__center small { max-width:92px; margin-top:2px; overflow:hidden; color:rgba(210,232,242,.68); font-size:6px; text-overflow:ellipsis; white-space:nowrap; }
.player-action-wheel__item {
  position:absolute;
  display:grid;
  place-items:center;
  gap:2px;
  width:62px; height:62px;
  padding:5px;
  border:1px solid rgba(125,200,236,.34);
  border-radius:50%;
  background:linear-gradient(155deg,rgba(13,58,75,.96),rgba(6,34,47,.96));
  color:#eaf8ff;
  box-shadow:inset 0 1px rgba(255,255,255,.09),0 8px 18px rgba(0,19,31,.22);
  transition:transform .14s,border-color .14s,filter .14s;
}
.player-action-wheel__item:hover { transform:scale(1.08); border-color:rgba(145,220,255,.75); filter:brightness(1.08); }
.player-action-wheel__item .ui-icon { width:20px; height:20px; }
.player-action-wheel__item > span:last-child { font-size:6px; font-weight:850; }
.player-action-wheel__item.is-profile { left:88px; top:0; }
.player-action-wheel__item.is-battle { right:0; top:58px; border-color:rgba(245,99,90,.54); color:#ff9c94; }
.player-action-wheel__item.is-trade { right:23px; bottom:8px; }
.player-action-wheel__item.is-friend { left:23px; bottom:8px; }
.player-action-wheel__item.is-wave { left:0; top:58px; font-size:19px; }
html[data-game-theme="light"] .player-action-wheel__center,
html[data-game-theme="light"] .player-action-wheel__item { background:linear-gradient(155deg,rgba(246,252,255,.98),rgba(222,239,247,.96)); color:#173f59; border-color:rgba(73,151,191,.3); }
html[data-game-theme="light"] .player-action-wheel__center small { color:#66869a; }
html[data-game-theme="light"] .player-action-wheel__item.is-battle { color:#c83c3b; border-color:rgba(209,67,63,.35); }

.pvp-invite { position:fixed; z-index:95; inset:0; display:grid; place-items:center; padding:18px; background:rgba(1,14,22,.34); opacity:0; pointer-events:none; transition:opacity .16s; backdrop-filter:blur(3px); }
.pvp-invite.is-open { opacity:1; pointer-events:auto; }
.pvp-invite__card { width:min(390px,calc(100vw - 28px)); padding:20px; border:1px solid rgba(115,201,239,.4); border-radius:22px; background:linear-gradient(160deg,rgba(6,42,56,.98),rgba(4,26,37,.98)); color:#f4fbff; box-shadow:0 24px 62px rgba(0,15,27,.42),inset 0 1px rgba(255,255,255,.08); }
.pvp-invite__card > small { color:#70d6ff; font-size:7px; font-weight:950; letter-spacing:.12em; }
.pvp-invite__card > b { display:block; margin-top:6px; font-size:20px; }
.pvp-invite__card > p { margin:8px 0 16px; color:rgba(219,235,243,.76); font-size:10px; line-height:1.5; }
.pvp-invite__actions { display:grid; grid-template-columns:1fr 1.2fr; gap:8px; }
.pvp-invite__actions button { min-height:44px; border:1px solid rgba(135,185,207,.28); border-radius:13px; background:rgba(255,255,255,.06); color:#dcecf4; font-weight:850; }
.pvp-invite__actions .is-accept { border-color:rgba(245,103,93,.54); background:linear-gradient(180deg,#ef5b53,#c83238); color:#fff; box-shadow:0 7px 16px rgba(173,37,42,.22); }
html[data-game-theme="light"] .pvp-invite { background:rgba(23,55,74,.22); }
html[data-game-theme="light"] .pvp-invite__card { background:linear-gradient(160deg,#f7fcff,#e3f1f7); color:#173f59; border-color:#b8ddeb; }
html[data-game-theme="light"] .pvp-invite__card > p { color:#617f91; }
html[data-game-theme="light"] .pvp-invite__actions button:not(.is-accept) { background:#fff; color:#30546a; }

.player-profile-pvp { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:16px 0; }
.player-profile-pvp article { padding:12px 8px; border:1px solid var(--theme-border); border-radius:14px; background:var(--theme-surface-soft); text-align:center; }
.player-profile-pvp small { display:block; color:var(--theme-muted); font-size:7px; }
.player-profile-pvp b { display:block; margin-top:4px; color:var(--theme-text); font-size:19px; }
.player-profile-lead { display:grid; grid-template-columns:62px 1fr; align-items:center; gap:12px; padding:12px; border:1px solid var(--theme-border); border-radius:16px; background:var(--theme-surface-soft); }
.player-profile-lead > span { display:grid; place-items:center; width:62px; height:62px; border-radius:50%; background:rgba(72,178,226,.1); }
.player-profile-pokemon-emoji { display:grid; place-items:center; width:100%; height:100%; }
.player-profile-pokemon-emoji img { width:78%; height:78%; object-fit:contain; }
.player-profile-lead small { color:var(--theme-muted); font-size:7px; font-weight:900; }
.player-profile-lead b { display:block; margin-top:3px; color:var(--theme-text); font-size:14px; }
.player-profile-lead p { margin:3px 0 0; color:var(--theme-muted); font-size:8px; }
.player-profile-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:12px; }
.player-profile-actions button { min-height:42px; border:1px solid var(--theme-border); border-radius:13px; background:var(--theme-surface-soft); color:var(--theme-text); font-weight:800; }
.player-profile-actions button:first-child { border-color:rgba(233,80,75,.38); background:color-mix(in srgb,#e84743 14%,var(--theme-surface-soft)); }

.game-screen .battle-panel.is-pvp { border-color:rgba(232,78,73,.4); box-shadow:0 22px 60px rgba(42,10,15,.34),inset 0 1px rgba(255,255,255,.08); }
.game-screen .battle-panel.is-pvp .battle-status small { color:#ff8f87; }
.game-screen .battle-panel.is-pvp #cancelBattle { border-color:rgba(235,93,83,.45); color:#ffb0aa; }
.game-screen .battle-panel.is-pvp .battle-skills button:not(:disabled):hover { border-color:#e95450; box-shadow:inset 0 0 0 1px rgba(233,84,80,.32); }

@media (max-width:760px) {
  .player-action-wheel { left:50% !important; top:auto !important; bottom:86px; width:min(340px,calc(100vw - 18px)); height:164px; transform:translate(-50%,14px) scale(.96); }
  .player-action-wheel.is-open { transform:translate(-50%,0) scale(1); }
  .player-action-wheel__center { width:116px; height:100px; border-radius:24px; }
  .player-action-wheel__item { width:54px; height:54px; }
  .player-action-wheel__item.is-profile { left:calc(50% - 27px); top:0; }
  .player-action-wheel__item.is-battle { right:4px; top:54px; }
  .player-action-wheel__item.is-trade { right:62px; bottom:0; }
  .player-action-wheel__item.is-friend { left:62px; bottom:0; }
  .player-action-wheel__item.is-wave { left:4px; top:54px; }
}

@media (prefers-reduced-motion: reduce) {
  .player-action-wheel,.player-action-wheel__item,.pvp-invite { transition:none !important; }
}
.social-prototype-card { display:grid; grid-template-columns:48px 1fr; gap:12px; align-items:center; margin-top:16px; padding:14px; border:1px solid var(--theme-border); border-radius:16px; background:var(--theme-surface-soft); }
.social-prototype-card > span { display:grid; place-items:center; width:48px; height:48px; border-radius:14px; background:rgba(75,172,219,.12); font-size:24px; }
.social-prototype-card > span .social-prototype-raster { width:38px; height:38px; object-fit:contain; filter:drop-shadow(0 3px 5px rgba(22,69,94,.2)); }
.social-prototype-card b { color:var(--theme-text); font-size:12px; }
.social-prototype-card p { margin:5px 0 0; color:var(--theme-muted); font-size:8px; line-height:1.5; }
.panel-note { display:block; margin-top:12px; color:var(--theme-muted); font-size:7px; line-height:1.5; }

/* v2.7.26 — persistent friends, three-trainer squads and richer player profiles */
.game-screen #playerProfileButton { cursor:pointer; transition:transform .14s,border-color .14s,box-shadow .14s; }
.game-screen #playerProfileButton:hover { transform:translateY(-1px); border-color:color-mix(in srgb,var(--role-color,#39aef4) 68%,var(--theme-border)); box-shadow:0 16px 34px rgba(0,22,35,.28),0 0 0 2px color-mix(in srgb,var(--role-color,#39aef4) 13%,transparent); }
.game-screen #playerProfileButton:focus-visible { outline:2px solid color-mix(in srgb,var(--role-color,#39aef4) 78%,white); outline-offset:3px; }

.party-hud {
  position:fixed;
  z-index:31;
  top:max(82px,calc(env(safe-area-inset-top) + 78px));
  left:max(12px,env(safe-area-inset-left));
  display:flex;
  gap:6px;
  max-width:430px;
  pointer-events:auto;
}
.party-hud[hidden] { display:none; }
.party-hud-member {
  display:grid;
  grid-template-columns:26px minmax(0,1fr);
  gap:7px;
  align-items:center;
  min-width:132px;
  max-width:196px;
  min-height:42px;
  padding:5px 9px 5px 6px;
  border:1px solid rgba(82,214,196,.34);
  border-radius:13px;
  background:linear-gradient(155deg,rgba(5,43,52,.92),rgba(5,29,39,.9));
  color:#effdff;
  box-shadow:0 8px 19px rgba(0,18,28,.22),inset 0 1px rgba(255,255,255,.06);
  backdrop-filter:blur(10px);
  text-align:left;
}
.party-hud-member > span { display:grid; place-items:center; width:26px; height:26px; border-radius:9px; background:rgba(73,222,201,.12); font-size:14px; }
.party-hud-member div { min-width:0; }
.party-hud-member b,.party-hud-member small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.party-hud-member b { font-size:8px; }
.party-hud-member small { margin-top:2px; color:rgba(207,236,237,.65); font-size:5.5px; }
.party-hud-member.is-online { border-color:rgba(91,231,208,.54); }
.party-hud-member:disabled { opacity:.58; }
html[data-game-theme="light"] .party-hud-member { background:linear-gradient(155deg,rgba(245,253,253,.95),rgba(224,243,244,.92)); color:#194b54; border-color:rgba(39,159,146,.28); box-shadow:0 8px 18px rgba(48,92,102,.12),inset 0 1px #fff; }
html[data-game-theme="light"] .party-hud-member small { color:#62858c; }

.world-minimap-party-markers { position:absolute; inset:0; pointer-events:none; }
.world-minimap-party-marker {
  position:absolute;
  width:10px;
  height:10px;
  transform:translate(-50%,-50%);
  border:2px solid rgba(238,255,252,.94);
  border-radius:50%;
  background:#40dac6;
  box-shadow:0 0 0 3px rgba(64,218,198,.2),0 0 9px rgba(64,218,198,.72);
}
.world-minimap-party-marker.is-leader { background:#ffd24d; box-shadow:0 0 0 3px rgba(255,210,77,.2),0 0 9px rgba(255,210,77,.74); }

/* More readable radial menu on desktop. */
.player-action-wheel { width:270px; height:270px; }
.player-action-wheel__center { width:106px; height:106px; }
.player-action-wheel__avatar { width:39px; height:39px; background:rgba(80,188,235,.13); overflow:hidden; }
.player-wheel-trainer { display:block; width:36px; height:36px; border-radius:50%; background:#143f56 url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png') 0 0/600% 800% no-repeat; }
.player-wheel-trainer[data-skin="female"] { background-image:url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png'); }
.player-action-wheel__item { width:66px; height:66px; gap:3px; font-weight:800; }
.player-action-wheel__item > span:first-child { display:grid; place-items:center; min-height:25px; font-size:20px; }
.player-action-wheel__item > span:last-child { font-size:7px; font-weight:900; }
.player-action-wheel__item.is-profile { left:102px; top:0; }
.player-action-wheel__item.is-battle { right:4px; top:47px; }
.player-action-wheel__item.is-trade { right:4px; bottom:47px; }
.player-action-wheel__item.is-party { left:102px; bottom:0; border-color:rgba(87,222,201,.46); color:#8cf0df; }
.player-action-wheel__item.is-friend { left:4px; bottom:47px; border-color:rgba(107,211,105,.4); }
.player-action-wheel__item.is-wave { left:4px; top:47px; }
.player-action-wheel__item.is-active-relation { border-color:rgba(89,224,135,.7); box-shadow:inset 0 1px rgba(255,255,255,.1),0 0 0 2px rgba(89,224,135,.1),0 8px 18px rgba(0,19,31,.22); }
.player-action-wheel__item.is-locked-relation { opacity:.58; }
html[data-game-theme="light"] .player-action-wheel__item.is-party { color:#168d80; }

.social-invite { position:fixed; z-index:96; inset:0; display:grid; place-items:center; padding:18px; background:rgba(1,14,22,.3); opacity:0; pointer-events:none; transition:opacity .16s; backdrop-filter:blur(3px); }
.social-invite.is-open { opacity:1; pointer-events:auto; }
.social-invite__card { position:relative; width:min(390px,calc(100vw - 28px)); padding:22px 20px 19px 84px; border:1px solid rgba(93,218,197,.38); border-radius:22px; background:linear-gradient(160deg,rgba(6,43,53,.98),rgba(4,27,37,.98)); color:#f4fbff; box-shadow:0 24px 62px rgba(0,15,27,.4),inset 0 1px rgba(255,255,255,.08); }
.social-invite__emoji { position:absolute; left:20px; top:22px; display:grid; place-items:center; width:48px; height:48px; border:1px solid rgba(95,221,201,.34); border-radius:15px; background:rgba(72,218,195,.1); font-size:25px; }
.social-invite__card > small { color:#6fe0ce; font-size:7px; font-weight:950; letter-spacing:.12em; }
.social-invite__card > b { display:block; margin-top:6px; font-size:19px; }
.social-invite__card > p { margin:8px 0 16px; color:rgba(219,235,243,.76); font-size:9px; line-height:1.5; }
.social-invite__actions { display:grid; grid-template-columns:1fr 1.35fr; gap:8px; margin-left:-64px; }
.social-invite__actions button { min-height:43px; border:1px solid rgba(135,185,207,.28); border-radius:13px; background:rgba(255,255,255,.06); color:#dcecf4; font-weight:850; }
.social-invite__actions .is-accept { border-color:rgba(87,222,201,.52); background:linear-gradient(180deg,#31c8b1,#168e88); color:#fff; box-shadow:0 7px 16px rgba(24,137,125,.22); }
html[data-game-theme="light"] .social-invite { background:rgba(23,55,74,.2); }
html[data-game-theme="light"] .social-invite__card { background:linear-gradient(160deg,rgba(248,253,255,.99),rgba(229,243,247,.98)); color:#173e55; border-color:rgba(38,158,147,.27); box-shadow:0 24px 54px rgba(35,79,104,.2),inset 0 1px #fff; }
html[data-game-theme="light"] .social-invite__card > p { color:#668394; }
html[data-game-theme="light"] .social-invite__actions button { color:#31586e; background:rgba(255,255,255,.65); }
html[data-game-theme="light"] .social-invite__actions .is-accept { color:#fff; }

.side-panel.is-social-profile { width:min(470px,calc(100vw - 24px)); }
.social-profile-shell { display:grid; gap:12px; padding-bottom:22px; }
.social-profile-hero {
  display:grid;
  grid-template-columns:82px 1fr;
  gap:14px;
  align-items:center;
  padding:14px;
  border:1px solid var(--theme-border);
  border-radius:20px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--theme-accent) 9%,var(--theme-surface)),var(--theme-surface-soft));
}
.social-profile-trainer { display:block; width:82px; height:82px; border:2px solid color-mix(in srgb,var(--theme-accent) 54%,white); border-radius:22px; background:#143f56 url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png') 0 0/600% 800% no-repeat; box-shadow:0 9px 20px rgba(0,24,38,.16); }
.social-profile-trainer[data-skin="female"] { background-image:url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png'); }
.social-profile-hero small { color:var(--theme-accent); font-size:7px; font-weight:950; letter-spacing:.08em; }
.social-profile-hero h2 { margin:3px 0 4px; color:var(--theme-text); font-size:24px; line-height:1.04; }
.social-profile-hero p { margin:0; color:var(--theme-muted); font-size:9px; }
.social-profile-section { display:grid; gap:9px; padding:13px; border:1px solid var(--theme-border); border-radius:17px; background:var(--theme-surface-soft); }
.social-profile-section.is-soft { border-style:dashed; }
.social-profile-section > header { display:flex; justify-content:space-between; gap:10px; align-items:center; }
.social-profile-section > header span small,.social-profile-section > header span b { display:block; }
.social-profile-section > header small { color:var(--theme-muted); font-size:6.5px; font-weight:900; letter-spacing:.08em; }
.social-profile-section > header b { margin-top:2px; color:var(--theme-text); font-size:12px; }
.social-profile-section > header em { padding:4px 7px; border-radius:999px; background:color-mix(in srgb,var(--theme-accent) 10%,transparent); color:var(--theme-accent); font-size:7px; font-style:normal; font-weight:900; }
.social-profile-section > p,.social-profile-empty { margin:0; color:var(--theme-muted); font-size:8px; line-height:1.5; }
.social-team-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.social-team-pokemon { display:grid; grid-template-columns:42px 1fr; gap:8px; align-items:center; min-width:0; padding:7px; border:1px solid var(--theme-border); border-radius:13px; background:var(--theme-surface); }
.social-team-pokemon.is-lead { border-color:color-mix(in srgb,var(--theme-accent) 55%,var(--theme-border)); }
.social-team-pokemon > span { display:grid; place-items:center; width:42px; height:42px; border-radius:11px; background:color-mix(in srgb,var(--theme-accent) 8%,transparent); }
.social-team-emoji,.social-team-emoji img { width:100%; height:100%; object-fit:contain; }
.social-team-pokemon div { min-width:0; }
.social-team-pokemon small,.social-team-pokemon b,.social-team-pokemon em { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.social-team-pokemon small { color:var(--theme-accent); font-size:5.5px; font-weight:900; }
.social-team-pokemon b { margin-top:2px; color:var(--theme-text); font-size:8px; }
.social-team-pokemon em { margin-top:2px; color:var(--theme-muted); font-size:6px; font-style:normal; }
.social-reward-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.social-reward { display:flex; align-items:center; gap:7px; min-height:38px; padding:7px 9px; border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-surface); opacity:.48; }
.social-reward.is-unlocked { opacity:1; border-color:color-mix(in srgb,#f0c447 38%,var(--theme-border)); }
.social-reward i { font-size:17px; font-style:normal; }
.social-reward b { color:var(--theme-text); font-size:7px; }
.social-friend-list,.social-party-list { display:grid; gap:6px; }
.social-friend-list button,.social-party-list button { display:grid; grid-template-columns:20px 1fr auto; gap:7px; align-items:center; min-height:38px; padding:6px 8px; border:1px solid var(--theme-border); border-radius:11px; background:var(--theme-surface); color:var(--theme-text); text-align:left; }
.social-friend-list button > b,.social-party-list button > b { overflow:hidden; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.social-friend-list button > small,.social-party-list button > small { color:var(--theme-muted); font-size:6px; }
.social-status-dot { width:8px; height:8px; margin-left:5px; border-radius:50%; background:#81919a; }
.social-status-dot.is-online { background:#57d86a; box-shadow:0 0 0 3px rgba(87,216,106,.12); }
.social-danger-button { min-height:36px; border:1px solid color-mix(in srgb,#e65a55 36%,var(--theme-border)); border-radius:11px; background:color-mix(in srgb,#e65a55 7%,var(--theme-surface)); color:#d95450; font-size:7px; font-weight:850; }
.player-profile-actions-v2726 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.player-profile-actions-v2726 button { min-height:40px; border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-surface-soft); color:var(--theme-text); font-size:7px; font-weight:850; }
.player-profile-actions-v2726 button.is-battle { border-color:rgba(224,77,71,.35); color:#e35a55; }
.player-profile-actions-v2726 button:disabled { opacity:.45; }

@media (max-width:760px) {
  .party-hud { top:max(59px,calc(env(safe-area-inset-top) + 56px)); left:max(7px,env(safe-area-inset-left)); max-width:calc(100vw - 100px); gap:4px; }
  .party-hud-member { min-width:0; width:116px; min-height:35px; grid-template-columns:22px minmax(0,1fr); padding:4px 6px 4px 4px; border-radius:11px; }
  .party-hud-member > span { width:22px; height:22px; border-radius:8px; font-size:12px; }
  .party-hud-member b { font-size:7px; }
  .party-hud-member small { font-size:5px; }

  /* On phones the radial wheel becomes a thumb-friendly bottom action sheet. */
  .player-action-wheel {
    left:50% !important;
    top:auto !important;
    bottom:calc(72px + env(safe-area-inset-bottom));
    width:min(356px,calc(100vw - 16px));
    height:auto;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    padding:62px 8px 8px;
    transform:translate(-50%,12px) scale(.98);
    border:1px solid rgba(113,202,233,.3);
    border-radius:20px;
    background:linear-gradient(155deg,rgba(5,39,52,.96),rgba(4,26,36,.96));
    filter:drop-shadow(0 16px 28px rgba(0,18,28,.32));
  }
  .player-action-wheel.is-open { transform:translate(-50%,0) scale(1); }
  .player-action-wheel__center { left:8px; right:8px; top:8px; width:auto; height:46px; transform:none; display:grid; grid-template-columns:36px 1fr; grid-template-rows:1fr 1fr; justify-items:start; align-content:center; border-radius:13px; text-align:left; }
  .player-action-wheel__avatar { grid-row:1/3; width:34px; height:34px; margin:0 7px 0 0; }
  .player-wheel-trainer { width:31px; height:31px; }
  .player-action-wheel__center b,.player-action-wheel__center small { max-width:230px; }
  .player-action-wheel__center b { font-size:9px; }
  .player-action-wheel__center small { font-size:6px; }
  .player-action-wheel__item { position:static; width:auto; height:48px; border-radius:13px; display:flex; justify-content:center; gap:6px; }
  .player-action-wheel__item > span:first-child { min-height:0; font-size:17px; }
  .player-action-wheel__item > span:last-child { font-size:7px; }
  html[data-game-theme="light"] .player-action-wheel { background:linear-gradient(155deg,rgba(247,252,255,.98),rgba(226,241,248,.98)); border-color:rgba(67,151,191,.28); }

  .side-panel.is-social-profile { width:calc(100vw - 12px); }
  .social-profile-hero { grid-template-columns:62px 1fr; gap:10px; padding:10px; }
  .social-profile-trainer { width:62px; height:62px; border-radius:18px; }
  .social-profile-hero h2 { font-size:20px; }
  .social-team-grid,.social-reward-grid { grid-template-columns:1fr 1fr; }
  .social-profile-section { padding:10px; }
  .social-invite__card { padding-left:72px; }
  .social-invite__emoji { left:15px; width:43px; height:43px; }
  .social-invite__actions { margin-left:-52px; }
}

@media (prefers-reduced-motion:reduce) {
  #playerProfileButton,.social-invite,.player-action-wheel,.player-action-wheel__item { transition:none!important; animation:none!important; }
}
.player-action-wheel__item:disabled { opacity:.5; cursor:default; filter:saturate(.65); }
.player-action-wheel__item:disabled:hover { transform:none; filter:saturate(.65); }

/* v2.7.27 — social UI polish: animated invites, left-side profiles and teammate identity highlights */
.social-invite {
  background:rgba(4,20,30,.26);
  backdrop-filter:blur(7px);
}
.social-invite.is-open .social-invite__card {
  animation:socialInviteCardIn .32s cubic-bezier(.18,.84,.24,1.08) both;
}
.social-invite__card {
  display:grid;
  grid-template-columns:62px minmax(0,1fr);
  grid-template-areas:
    "emoji eyebrow"
    "emoji title"
    "actions actions";
  column-gap:14px;
  width:min(430px,calc(100vw - 28px));
  padding:20px;
  border-radius:24px;
  overflow:visible;
}
.social-invite__emoji {
  position:relative;
  left:auto;
  top:auto;
  grid-area:emoji;
  align-self:center;
  width:58px;
  height:58px;
  border-radius:18px;
  font-size:30px;
  transform-origin:50% 70%;
}
.social-invite.is-open .social-invite__emoji { animation:socialInviteEmoji .78s cubic-bezier(.2,.75,.25,1.15) .06s both; }
.social-invite__emoji::before,
.social-invite__emoji::after {
  content:'✦';
  position:absolute;
  color:#77ead8;
  font-size:11px;
  opacity:0;
}
.social-invite__emoji::before { right:-8px; top:-8px; }
.social-invite__emoji::after { left:-7px; bottom:-5px; font-size:8px; }
.social-invite.is-open .social-invite__emoji::before { animation:socialInviteSpark .9s ease .24s both; }
.social-invite.is-open .social-invite__emoji::after { animation:socialInviteSpark .9s ease .4s both; }
.social-invite__card > small {
  grid-area:eyebrow;
  align-self:end;
  font-size:7px;
}
.social-invite__card > b {
  grid-area:title;
  align-self:start;
  min-width:0;
  margin-top:4px;
  overflow-wrap:anywhere;
  font-size:20px;
  line-height:1.12;
}
.social-invite__card > p { display:none!important; }
.social-invite__actions {
  grid-area:actions;
  grid-template-columns:1fr 1.2fr;
  gap:10px;
  margin:18px 0 0;
}
.social-invite__actions button {
  min-height:46px;
  padding:0 14px;
  border-radius:14px;
  font-size:10px;
}
.social-invite__actions .is-accept {
  border-color:#42c9b4!important;
  background:linear-gradient(180deg,#35cdb4,#158d85)!important;
  color:#fff!important;
  text-shadow:0 1px 1px rgba(0,0,0,.12);
  box-shadow:0 8px 18px rgba(24,137,125,.24),inset 0 1px rgba(255,255,255,.28)!important;
}
.social-invite__actions .is-accept:hover { transform:translateY(-1px); filter:brightness(1.05); }
.social-invite[data-invite-type="party"] .social-invite__emoji { border-color:rgba(255,210,77,.46); background:rgba(255,210,77,.11); }
.social-invite[data-invite-type="party"] .social-invite__emoji::before,
.social-invite[data-invite-type="party"] .social-invite__emoji::after { color:#ffd24d; }
@keyframes socialInviteCardIn {
  from { opacity:0; transform:translateY(14px) scale(.96); }
  to { opacity:1; transform:translateY(0) scale(1); }
}
@keyframes socialInviteEmoji {
  0% { opacity:0; transform:scale(.65) rotate(-10deg); }
  56% { opacity:1; transform:scale(1.12) rotate(7deg); }
  76% { transform:scale(.96) rotate(-3deg); }
  100% { opacity:1; transform:scale(1) rotate(0); }
}
@keyframes socialInviteSpark {
  0% { opacity:0; transform:scale(.3) rotate(0); }
  45% { opacity:1; transform:scale(1.25) rotate(80deg); }
  100% { opacity:0; transform:scale(.65) rotate(140deg); }
}

/* Social profile is a dedicated left drawer on desktop. */
@media (min-width:761px) and (pointer:fine) {
  .game-screen .side-panel.is-social-profile {
    left:max(18px,env(safe-area-inset-left));
    right:auto;
    top:max(78px,calc(env(safe-area-inset-top) + 74px));
    bottom:18px;
    width:min(540px,calc(100vw - 130px));
    padding:20px;
    transform:translateX(calc(-100% - 44px));
    border-radius:24px;
  }
  .game-screen .side-panel.is-social-profile.is-open { transform:none; }
}
.social-profile-shell-v2727 { gap:10px; padding:0 0 12px; }
.social-profile-hero-v2727 {
  grid-template-columns:84px minmax(0,1fr);
  min-height:112px;
  padding:13px;
  overflow:hidden;
}
.social-profile-hero-v2727 > div { min-width:0; }
.social-profile-hero-v2727 h2 {
  max-width:100%;
  margin:3px 0 5px;
  overflow:hidden;
  font-size:clamp(21px,2vw,28px);
  line-height:1.05;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.social-profile-hero-v2727.is-party-profile {
  border-color:rgba(74,218,199,.56);
  box-shadow:inset 3px 0 #4adac7,0 8px 18px rgba(23,129,120,.08);
}
.social-profile-hero-v2727.is-friend-profile { border-color:rgba(91,203,104,.38); }
.social-profile-tabs {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  position:sticky;
  top:-1px;
  z-index:3;
  padding:4px 0 6px;
  background:linear-gradient(180deg,var(--theme-surface) 65%,transparent);
}
.social-profile-tabs button {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:38px;
  padding:0 8px;
  border:1px solid var(--theme-border);
  border-radius:12px;
  background:var(--theme-surface-soft);
  color:var(--theme-muted);
}
.social-profile-tabs button span { font-size:14px; }
.social-profile-tabs button b { font-size:8px; }
.social-profile-tabs button.is-active {
  border-color:color-mix(in srgb,var(--theme-accent) 58%,var(--theme-border));
  background:color-mix(in srgb,var(--theme-accent) 11%,var(--theme-surface));
  color:var(--theme-text);
  box-shadow:inset 0 1px rgba(255,255,255,.08);
}
.social-profile-tab-body { display:grid; gap:10px; animation:socialProfileTabIn .18s ease both; }
@keyframes socialProfileTabIn { from { opacity:.25; transform:translateY(3px); } to { opacity:1; transform:none; } }
.player-profile-pvp-v2727 {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
  margin:0;
}
.player-profile-pvp-v2727 article {
  min-height:58px;
  padding:9px 6px;
  border-radius:14px;
}
.player-profile-pvp-v2727 article small { font-size:6px; }
.player-profile-pvp-v2727 article b { margin-top:4px; font-size:18px; }
.social-profile-tab-card { min-height:0; }
.social-party-card { min-height:0; }
.player-profile-actions-v2727 {
  grid-template-columns:repeat(2,minmax(0,1fr));
  margin:0;
}
.player-profile-actions-v2727 button { min-height:46px; font-size:8px; }

/* Teammates are identified by their nameplates, not floor circles. */
.party-hud {
  top:max(16px,env(safe-area-inset-top));
  left:max(235px,calc(env(safe-area-inset-left) + 225px));
  gap:7px;
}
.party-hud-member {
  min-width:142px;
  min-height:48px;
  border-width:2px;
  border-color:#4adac7;
  box-shadow:0 8px 20px rgba(0,18,28,.22),0 0 0 2px rgba(74,218,199,.08),inset 0 1px rgba(255,255,255,.07);
}
.party-hud-member.is-online { border-color:#56e1cf; }
.party-hud-member > span { background:rgba(86,225,207,.17); }

/* Minimap party markers stay above every map layer and are visible to both sides. */
.world-minimap-party-markers { z-index:8; }
.world-minimap-party-marker {
  z-index:9;
  display:grid;
  place-items:center;
  width:16px;
  height:16px;
  border:2px solid #f5fffd;
  background:#34d5c2;
  box-shadow:0 0 0 4px rgba(52,213,194,.22),0 0 13px rgba(52,213,194,.9);
  animation:minimapPartyPulse 1.65s ease-in-out infinite;
}
.world-minimap-party-marker > span {
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  color:#073c3a;
  font:950 7px/1 system-ui;
}
.world-minimap-party-marker.is-leader { background:#ffd24d; border-color:#fffdf0; }
.world-minimap-party-marker.is-leader > span { font-size:8px; }
@keyframes minimapPartyPulse { 50% { transform:translate(-50%,-50%) scale(1.12); filter:brightness(1.08); } }

@media (max-width:760px) {
  .social-invite__card { grid-template-columns:52px minmax(0,1fr); width:min(360px,calc(100vw - 18px)); padding:16px; border-radius:20px; }
  .social-invite__emoji { width:48px; height:48px; border-radius:15px; font-size:26px; }
  .social-invite__card > b { font-size:17px; }
  .social-invite__actions { margin-top:14px; gap:7px; }
  .social-invite__actions button { min-height:44px; font-size:9px; }
  .social-profile-hero-v2727 { grid-template-columns:62px minmax(0,1fr); min-height:86px; }
  .social-profile-hero-v2727 h2 { font-size:20px; }
  .social-profile-tabs button { min-height:36px; padding:0 5px; }
  .social-profile-tabs button span { font-size:12px; }
  .social-profile-tabs button b { font-size:7px; }
  .player-profile-pvp-v2727 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .party-hud { top:max(58px,calc(env(safe-area-inset-top) + 55px)); left:max(7px,env(safe-area-inset-left)); }
  .party-hud-member { width:118px; min-width:0; min-height:36px; border-width:1px; }
  .world-minimap-party-marker { width:13px; height:13px; border-width:2px; }
  .world-minimap-party-marker > span { font-size:6px; }
}

@media (prefers-reduced-motion:reduce) {
  .social-invite.is-open .social-invite__card,
  .social-invite.is-open .social-invite__emoji,
  .social-invite.is-open .social-invite__emoji::before,
  .social-invite.is-open .social-invite__emoji::after,
  .social-profile-tab-body,
  .world-minimap-party-marker { animation:none!important; }
}
@media (max-width:1180px) and (min-width:761px) {
  .party-hud { top:max(76px,calc(env(safe-area-inset-top) + 72px)); left:max(14px,env(safe-area-inset-left)); }
  .party-hud-member { min-width:132px; }
}

/* v2.7.28 — friend yellow identity, purple teammates, stacked partner HUD and clearer minimap relations */
.party-hud {
  top:max(82px,calc(env(safe-area-inset-top) + 78px));
  left:max(18px,env(safe-area-inset-left));
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
  width:236px;
  max-width:236px;
}
.party-hud-member {
  grid-template-columns:38px minmax(0,1fr);
  width:100%;
  min-width:0;
  max-width:none;
  min-height:48px;
  padding:5px 9px 5px 5px;
  border:2px solid rgba(183,124,255,.82);
  border-radius:14px;
  background:linear-gradient(155deg,rgba(62,29,96,.96),rgba(38,18,67,.94));
  color:#fff8ff;
  box-shadow:0 9px 22px rgba(70,30,122,.32),0 0 0 2px rgba(183,124,255,.1),inset 0 1px rgba(255,255,255,.09);
}
.party-hud-member.is-online { border-color:#b77cff; }
.party-hud-member.is-leader { border-color:#d7a7ff; box-shadow:0 9px 22px rgba(70,30,122,.34),0 0 0 2px rgba(255,210,77,.12),inset 0 1px rgba(255,255,255,.09); }
.party-hud-avatar,
.social-party-avatar {
  position:relative;
  display:block;
  overflow:hidden;
  border:1px solid rgba(226,201,255,.62);
  background:#1d3150 url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png') 0 0/600% 800% no-repeat;
}
.party-hud-avatar { width:36px; height:36px; border-radius:11px; }
.social-party-avatar { width:30px; height:30px; border-radius:9px; }
.party-hud-avatar[data-skin="female"],.social-party-avatar[data-skin="female"] { background-image:url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png'); }
.party-hud-avatar img,.social-party-avatar img { position:absolute; right:-2px; bottom:-2px; width:16px; height:16px; filter:drop-shadow(0 1px 2px rgba(28,10,49,.45)); }
.party-hud-avatar i,.social-party-avatar i { position:absolute; left:1px; top:0; font-size:8px; font-style:normal; }
.party-hud-member > div { min-width:0; }
.party-hud-member .party-hud-relation { margin:0 0 1px; color:#d8b6ff; font-size:5px; font-weight:950; letter-spacing:.08em; }
.party-hud-member b { color:#fff; font-size:8.5px; }
.party-hud-member b em { margin-left:3px; color:#8fe990; font-size:7px; font-style:normal; }
.party-hud-member > div > small:last-child { color:rgba(239,224,255,.7); font-size:5.5px; }
html[data-game-theme="light"] .party-hud-member {
  border-color:#a56cf1;
  background:linear-gradient(155deg,rgba(245,235,255,.98),rgba(229,211,251,.96));
  color:#462367;
  box-shadow:0 8px 18px rgba(92,55,135,.18),0 0 0 2px rgba(164,108,241,.08),inset 0 1px #fff;
}
html[data-game-theme="light"] .party-hud-member .party-hud-relation { color:#7c45bd; }
html[data-game-theme="light"] .party-hud-member b { color:#40205e; }
html[data-game-theme="light"] .party-hud-member > div > small:last-child { color:#765f88; }

/* Friend and teammate identity inside social profiles. */
.social-friend-list button,.social-party-list button { grid-template-columns:32px minmax(0,1fr) auto; min-height:44px; }
.social-friend-icon { position:relative; display:grid; place-items:center; width:30px; height:30px; border:1px solid rgba(238,193,57,.48); border-radius:10px; background:rgba(255,210,77,.13); }
.social-friend-icon > img { width:24px; height:24px; }
.social-friend-icon .social-status-dot { position:absolute; right:-2px; bottom:-2px; width:7px; height:7px; margin:0; border:2px solid var(--theme-surface); }
.social-party-list .social-party-avatar { background-color:#39225d; }
.social-profile-relation { display:inline-flex; align-items:center; gap:5px; width:max-content; margin-top:6px; padding:4px 8px 4px 5px; border-radius:999px; font-size:7px; font-weight:900; }
.social-profile-relation img { width:18px; height:18px; }
.social-profile-relation.is-friend { border:1px solid rgba(232,188,49,.48); background:rgba(255,210,77,.13); color:#b8890b; }
.social-profile-relation.is-party { border:1px solid rgba(166,105,242,.55); background:rgba(151,86,231,.13); color:#b57cff; }
.social-profile-hero-v2727.is-friend-profile { border-color:rgba(232,188,49,.58); box-shadow:inset 3px 0 #e8bc31,0 8px 18px rgba(152,111,14,.08); }
.social-profile-hero-v2727.is-party-profile { border-color:rgba(171,110,247,.66); box-shadow:inset 3px 0 #a96df3,0 8px 18px rgba(91,46,145,.12); }
html[data-game-theme="light"] .social-profile-relation.is-friend { color:#765607; background:rgba(255,224,111,.3); }
html[data-game-theme="light"] .social-profile-relation.is-party { color:#6c35a8; background:rgba(172,117,239,.18); }

/* Minimap: friends are warm yellow; teammates are intentionally much stronger purple. */
.world-minimap-friend-markers,.world-minimap-party-markers { position:absolute; inset:0; pointer-events:none; }
.world-minimap-friend-markers { z-index:7; }
.world-minimap-party-markers { z-index:9; }
.world-minimap-friend-marker,.world-minimap-party-marker { position:absolute; display:grid; place-items:center; transform:translate(-50%,-50%); border-radius:50%; }
.world-minimap-friend-marker {
  width:13px;
  height:13px;
  border:2px solid #fffdf0;
  background:#ffd24d;
  box-shadow:0 0 0 3px rgba(255,210,77,.2),0 0 10px rgba(255,196,48,.78);
}
.world-minimap-friend-marker img { width:10px; height:10px; }
.world-minimap-party-marker {
  z-index:10;
  width:18px;
  height:18px;
  border:2px solid #fbf6ff;
  background:#9658ed;
  box-shadow:0 0 0 4px rgba(150,88,237,.26),0 0 15px rgba(150,88,237,.95);
  animation:minimapPartyPulse 1.65s ease-in-out infinite;
}
.world-minimap-party-marker img { width:14px; height:14px; }
.world-minimap-party-marker > span { position:absolute; top:-8px; right:-7px; width:auto; height:auto; color:#ffd24d; font-size:8px; filter:drop-shadow(0 1px 2px #3c1b56); }
.world-minimap-party-marker > span .world-minimap-leader-raster { display:block; width:10px; height:10px; object-fit:contain; }
.world-minimap-party-marker.is-leader { background:#8f50e8; border-color:#fff7dc; box-shadow:0 0 0 4px rgba(150,88,237,.26),0 0 0 6px rgba(255,210,77,.13),0 0 16px rgba(150,88,237,.95); }

@media (max-width:760px) {
  .party-hud {
    top:max(60px,calc(env(safe-area-inset-top) + 57px));
    left:max(8px,env(safe-area-inset-left));
    width:168px;
    max-width:168px;
    gap:4px;
  }
  .party-hud-member { grid-template-columns:31px minmax(0,1fr); min-height:40px; padding:4px 6px 4px 4px; border-radius:12px; }
  .party-hud-avatar { width:29px; height:29px; border-radius:9px; }
  .party-hud-avatar img { width:13px; height:13px; }
  .party-hud-member .party-hud-relation { font-size:4.5px; }
  .party-hud-member b { font-size:7px; }
  .party-hud-member b em { font-size:6px; }
  .party-hud-member > div > small:last-child { display:none; }
  .world-minimap-friend-marker { width:11px; height:11px; }
  .world-minimap-party-marker { width:16px; height:16px; }
}

/* v2.7.31 — referral program, rich rewards and profile invite tracking */
.referral-auth-field > span { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.referral-auth-field > span em { color:#7993a5; font-size:8px; font-style:normal; font-weight:700; text-transform:none; letter-spacing:0; }
.referral-program-card { overflow:hidden; }
.referral-program-card > header em { min-width:42px; color:#8359df; font-size:10px; font-weight:900; text-align:right; }
.referral-reward-summary {
  display:grid; grid-template-columns:48px minmax(0,1fr) auto; align-items:center; gap:11px;
  margin-top:10px; padding:11px; border:1px solid color-mix(in srgb,#8d63ec 34%,var(--theme-border));
  border-radius:15px; background:linear-gradient(135deg,color-mix(in srgb,#8d63ec 10%,var(--theme-surface)),var(--theme-surface));
}
.referral-gem-mark { display:grid; place-items:center; width:46px; height:46px; border-radius:14px; background:linear-gradient(145deg,#f4eaff,#e3d2ff); font-size:24px; box-shadow:inset 0 1px 0 #fff,0 6px 16px rgba(105,70,170,.12); }
.referral-reward-summary b { display:block; color:var(--theme-text); font-size:10px; }
.referral-reward-summary p { margin:3px 0 0; color:var(--theme-muted); font-size:8px; line-height:1.4; }
.referral-reward-summary > strong { color:#7e50d9; font-size:13px; white-space:nowrap; }
.referral-link-box { display:grid; gap:7px; margin-top:10px; padding:11px; border:1px dashed color-mix(in srgb,#5baee1 45%,var(--theme-border)); border-radius:14px; background:color-mix(in srgb,#5baee1 5%,var(--theme-surface)); }
.referral-link-box > small,.referral-progress-list > small { color:var(--theme-muted); font-size:7px; font-weight:900; letter-spacing:.08em; }
.referral-link-box code { display:block; overflow:hidden; padding:8px 9px; border-radius:10px; background:color-mix(in srgb,var(--theme-text) 6%,transparent); color:var(--theme-text); font:700 8px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace; text-overflow:ellipsis; white-space:nowrap; }
.referral-link-box > div { display:flex; gap:7px; }
.referral-link-box button { flex:1; min-height:32px; border:1px solid var(--theme-border); border-radius:10px; background:var(--theme-surface); color:var(--theme-text); font-size:8px; font-weight:850; cursor:pointer; }
.referral-link-box button:last-child { border-color:#8b65df; background:linear-gradient(145deg,#8e67e9,#7450ce); color:#fff; }
.referral-link-box > span { color:var(--theme-muted); font-size:8px; }
.referral-link-box > span b { color:#8257db; letter-spacing:.08em; }
.referral-progress-list { display:grid; gap:7px; margin-top:12px; }
.referral-invite-row { display:grid; grid-template-columns:34px minmax(0,1fr) 38px; align-items:center; gap:8px; min-height:50px; padding:7px 8px; border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-surface); }
.referral-invite-avatar { display:grid; place-items:center; width:32px; height:32px; border-radius:10px; background:color-mix(in srgb,#8d63ec 10%,var(--theme-surface)); font-size:17px; }
.referral-invite-row b { display:block; overflow:hidden; color:var(--theme-text); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.referral-invite-row small { display:block; margin-top:2px; color:var(--theme-muted); font-size:7px; }
.referral-invite-row i { display:block; height:5px; margin-top:5px; overflow:hidden; border-radius:999px; background:color-mix(in srgb,var(--theme-text) 8%,transparent); }
.referral-invite-row i em { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#69bdea,#8b5cf6); }
.referral-invite-row strong { color:#6b8293; font-size:9px; text-align:right; }
.referral-invite-row.is-complete { border-color:color-mix(in srgb,#9b6aef 48%,var(--theme-border)); background:linear-gradient(135deg,color-mix(in srgb,#8d63ec 8%,var(--theme-surface)),var(--theme-surface)); }
.referral-invite-row.is-complete strong { color:#8557db; }
.referral-debug-button { width:100%; margin-top:11px; min-height:35px; border:1px dashed color-mix(in srgb,#ef9b42 55%,var(--theme-border)); border-radius:11px; background:color-mix(in srgb,#ef9b42 7%,var(--theme-surface)); color:#a46624; font-size:8px; font-weight:900; cursor:pointer; }

.reward-celebration {
  position:fixed; z-index:190; top:max(22px,env(safe-area-inset-top)); left:50%;
  display:grid; grid-template-columns:64px minmax(0,1fr); align-items:center; gap:14px;
  width:min(470px,calc(100vw - 28px)); min-height:104px; padding:14px 16px;
  transform:translate(-50%,-24px) scale(.96); visibility:hidden; opacity:0; pointer-events:none;
  border:1px solid rgba(178,139,255,.56); border-radius:21px;
  background:linear-gradient(145deg,rgba(11,39,55,.97),rgba(22,33,54,.97)); color:#fff;
  box-shadow:0 24px 60px rgba(0,17,32,.38),0 0 0 1px rgba(255,255,255,.05),inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter:blur(18px); transition:opacity .24s,transform .24s,visibility .24s;
}
.reward-celebration.is-open { visibility:visible; opacity:1; transform:translate(-50%,0) scale(1); animation:rewardCelebrationOpen .42s cubic-bezier(.17,.85,.3,1.15) both; }
.reward-celebration.is-leaving { opacity:0; transform:translate(-50%,-7px) scale(.985); }
.reward-celebration-burst { display:grid; place-items:center; width:62px; height:62px; border-radius:19px; background:radial-gradient(circle at 35% 30%,#f7eaff,#8c5ce7 65%,#5631a8); font-size:31px; box-shadow:0 0 24px rgba(153,104,244,.36),inset 0 1px 0 rgba(255,255,255,.55); animation:rewardGemFloat 1.8s ease-in-out infinite; }
.reward-celebration small { display:block; color:#b99af8; font-size:7px; font-weight:950; letter-spacing:.13em; }
.reward-celebration h3 { margin:3px 0 2px; color:#fff; font-size:17px; line-height:1.08; }
.reward-celebration p { margin:0; color:rgba(223,235,244,.82); font-size:9px; line-height:1.4; }
.reward-celebration-items { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.reward-celebration-item { display:inline-flex; align-items:center; gap:5px; padding:5px 8px 5px 5px; border:1px solid rgba(255,255,255,.12); border-radius:10px; background:rgba(255,255,255,.07); }
.reward-celebration-icon { width:26px; height:26px; }
.reward-celebration-item b { color:#fff; font-size:8px; }
.reward-celebration-item strong { color:#e6d2ff; font-size:9px; }
@keyframes rewardCelebrationOpen { 0%{transform:translate(-50%,-26px) scale(.94);filter:brightness(.85)} 65%{transform:translate(-50%,3px) scale(1.012);filter:brightness(1.08)} 100%{transform:translate(-50%,0) scale(1);filter:none} }
@keyframes rewardGemFloat { 50%{transform:translateY(-2px) rotate(2deg);filter:brightness(1.08)} }
html[data-game-theme="light"] .reward-celebration { background:linear-gradient(145deg,rgba(248,252,255,.98),rgba(237,242,252,.98)); color:#173f56; border-color:rgba(135,95,216,.34); box-shadow:0 20px 46px rgba(44,79,105,.2),inset 0 1px 0 #fff; }
html[data-game-theme="light"] .reward-celebration h3,html[data-game-theme="light"] .reward-celebration-item b { color:#173f56; }
html[data-game-theme="light"] .reward-celebration p { color:#648094; }
html[data-game-theme="light"] .reward-celebration-item { border-color:#d8e3ee; background:#fff; }
html[data-game-theme="light"] .reward-celebration-item strong { color:#7950c7; }
@media (max-width:760px) {
  .reward-celebration { grid-template-columns:50px minmax(0,1fr); width:calc(100vw - 18px); min-height:86px; padding:10px 11px; border-radius:17px; }
  .reward-celebration-burst { width:48px; height:48px; border-radius:15px; font-size:24px; }
  .reward-celebration h3 { font-size:14px; }
  .reward-celebration p { font-size:8px; }
  .referral-reward-summary { grid-template-columns:42px minmax(0,1fr); }
  .referral-reward-summary > strong { grid-column:2; }
}
@media (prefers-reduced-motion:reduce) { .reward-celebration.is-open,.reward-celebration-burst { animation:none !important; } }

/* v2.7.32 — full inventory + protected lots + live secure trading */
.game-screen .side-panel.is-inventory-panel {
  width:min(820px,calc(100vw - 40px));
  padding:20px;
}
.inventory-shell-v2732 { display:grid; gap:14px; min-height:100%; }
.inventory-header-v2732 { display:grid; grid-template-columns:minmax(0,1fr) minmax(210px,300px); gap:18px; align-items:end; }
.inventory-header-v2732 .panel-title { margin:2px 0 4px; }
.inventory-header-v2732 p { margin:0; color:var(--theme-muted,#668499); font-size:12px; }
.inventory-search { display:flex; align-items:center; gap:8px; min-height:42px; padding:0 12px; border:1px solid var(--theme-border,#c8dce7); border-radius:14px; background:var(--theme-card,#f7fbfd); }
.inventory-search span { font-size:18px; opacity:.72; }
.inventory-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:var(--theme-text,#183d55); font:700 12px/1 system-ui; }
.inventory-tabs-v2732 { display:flex; gap:7px; overflow:auto hidden; padding:2px 1px 6px; scrollbar-width:thin; }
.inventory-tabs-v2732 button { flex:0 0 auto; display:flex; align-items:center; gap:6px; min-height:38px; padding:0 10px; border:1px solid var(--theme-border,#cbdde7); border-radius:13px; background:var(--theme-card,#f7fbfd); color:var(--theme-muted,#58788d); }
.inventory-tabs-v2732 button i { font-style:normal; font-size:15px; }
.inventory-tabs-v2732 button b { font-size:9px; }
.inventory-tabs-v2732 button small { display:grid; place-items:center; min-width:19px; height:19px; padding:0 5px; border-radius:999px; background:color-mix(in srgb,var(--theme-accent,#36a9ea) 10%,transparent); font-size:8px; }
.inventory-tabs-v2732 button.is-active { border-color:var(--theme-accent,#2b9fe9); color:var(--theme-text,#163f5b); box-shadow:0 5px 15px color-mix(in srgb,var(--theme-accent,#2b9fe9) 14%,transparent); }
.inventory-layout-v2732 { display:grid; grid-template-columns:minmax(260px,.92fr) minmax(310px,1.08fr); gap:14px; min-height:0; }
.inventory-list-v2732 { display:grid; align-content:start; gap:8px; max-height:calc(100vh - 270px); overflow:auto; padding-right:4px; }
.inventory-card-v2732 { display:grid; grid-template-columns:52px minmax(0,1fr) auto; gap:11px; align-items:center; min-height:72px; padding:9px 11px; border:1px solid var(--theme-border,#d1e1ea); border-radius:16px; background:color-mix(in srgb,var(--theme-card,#fff) 94%,transparent); color:var(--theme-text,#173e58); text-align:left; cursor:pointer; }
.inventory-card-v2732:hover { transform:translateY(-1px); border-color:color-mix(in srgb,var(--theme-accent,#2d9de3) 55%,var(--theme-border,#d1e1ea)); }
.inventory-card-v2732.is-selected { border-color:var(--theme-accent,#269ce3); box-shadow:0 0 0 2px color-mix(in srgb,var(--theme-accent,#269ce3) 11%,transparent); }
.inventory-card-icon { display:grid; place-items:center; width:52px; height:52px; border-radius:14px; background:color-mix(in srgb,var(--theme-accent,#2d9de3) 7%,var(--theme-card,#fff)); }
.inventory-card-icon .item-icon { width:42px; height:42px; }
.inventory-card-copy { display:grid; gap:3px; min-width:0; }
.inventory-card-copy b { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.inventory-card-copy small { overflow:hidden; color:var(--theme-muted,#698397); font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.inventory-card-copy i { color:color-mix(in srgb,var(--theme-accent,#269ce3) 72%,var(--theme-text,#173e58)); font-size:7px; font-style:normal; font-weight:800; }
.inventory-card-v2732 > em { padding:5px 8px; border-radius:999px; background:color-mix(in srgb,var(--theme-text,#173e58) 6%,transparent); font-size:10px; font-style:normal; font-weight:900; }
.inventory-detail-v2732 { min-width:0; }
.inventory-detail-card,.inventory-detail-empty { min-height:360px; padding:17px; border:1px solid var(--theme-border,#d1e1ea); border-radius:20px; background:color-mix(in srgb,var(--theme-card,#fff) 96%,transparent); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.inventory-detail-empty { display:grid; place-items:center; align-content:center; gap:8px; color:var(--theme-muted,#698397); text-align:center; }
.inventory-detail-empty span { font-size:42px; }
.inventory-detail-hero { display:grid; grid-template-columns:72px minmax(0,1fr) auto; gap:13px; align-items:start; }
.inventory-detail-hero > span { display:grid; place-items:center; width:72px; height:72px; border-radius:18px; background:color-mix(in srgb,var(--theme-accent,#269ce3) 8%,var(--theme-card,#fff)); }
.inventory-detail-hero .item-icon { width:58px; height:58px; }
.inventory-detail-hero small { color:var(--theme-accent,#269ce3); font-size:8px; font-weight:900; letter-spacing:.07em; }
.inventory-detail-hero h3 { margin:3px 0 5px; font-size:20px; }
.inventory-detail-hero p { margin:0; color:var(--theme-muted,#698397); font-size:10px; line-height:1.45; }
.inventory-detail-hero > strong { font-size:15px; }
.inventory-policy-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; margin-top:17px; }
.inventory-policy-grid span { display:grid; grid-template-columns:24px 1fr; grid-template-rows:auto auto; gap:1px 6px; min-height:51px; padding:8px; border:1px solid var(--theme-border,#d4e2ea); border-radius:13px; }
.inventory-policy-grid span i { grid-row:1/3; display:grid; place-items:center; font-style:normal; font-size:17px; }
.inventory-policy-grid span b { font-size:8px; }
.inventory-policy-grid span small { color:var(--theme-muted,#718a9a); font-size:8px; }
.inventory-policy-grid .is-ok { border-color:color-mix(in srgb,#42c788 42%,var(--theme-border,#d4e2ea)); }
.inventory-policy-grid .is-lock { opacity:.56; }
.inventory-protected-note { display:grid; grid-template-columns:36px 1fr; gap:10px; align-items:center; margin-top:12px; padding:10px; border:1px solid color-mix(in srgb,#e3a334 34%,var(--theme-border,#d4e2ea)); border-radius:14px; background:color-mix(in srgb,#ffd86a 8%,transparent); }
.inventory-protected-note > span { font-size:22px; text-align:center; }
.inventory-protected-note b { display:block; font-size:10px; }
.inventory-protected-note small { color:var(--theme-muted,#6a8496); font-size:8px; line-height:1.35; }
.inventory-detail-actions { display:grid; grid-template-columns:minmax(100px,.8fr) 1fr 1fr; gap:8px; margin-top:14px; }
.inventory-detail-actions label { display:grid; gap:4px; color:var(--theme-muted,#698397); font-size:8px; font-weight:800; }
.inventory-detail-actions input { min-width:0; height:38px; padding:0 9px; border:1px solid var(--theme-border,#d1e1ea); border-radius:11px; background:var(--theme-card,#fff); color:var(--theme-text,#173e58); font-weight:800; }
.inventory-detail-actions button { min-height:42px; border:1px solid color-mix(in srgb,var(--theme-accent,#269ce3) 55%,var(--theme-border,#d1e1ea)); border-radius:12px; background:color-mix(in srgb,var(--theme-accent,#269ce3) 12%,var(--theme-card,#fff)); color:var(--theme-text,#173e58); font-size:9px; font-weight:900; }
.inventory-detail-actions button.is-danger { border-color:rgba(227,92,90,.38); color:#d75250; background:rgba(227,92,90,.07); }
.inventory-detail-actions button:disabled { opacity:.38; cursor:not-allowed; }
.inventory-debug-card p { color:var(--theme-muted,#6c8799); font-size:9px; line-height:1.4; }

.trade-dialog { position:fixed; inset:0; z-index:160; display:grid; place-items:center; padding:24px; opacity:0; pointer-events:none; transition:opacity .18s ease; }
.trade-dialog.is-open { opacity:1; pointer-events:auto; }
.trade-dialog__backdrop { position:absolute; inset:0; background:rgba(3,16,25,.58); backdrop-filter:blur(7px); }
.trade-dialog__content { position:relative; z-index:1; width:min(900px,calc(100vw - 36px)); max-height:min(780px,calc(100vh - 36px)); overflow:auto; }
.trade-request-card,.trade-window-v2732 { border:1px solid rgba(127,202,239,.34); border-radius:24px; background:var(--theme-panel,#f5fbfe); color:var(--theme-text,#173e58); box-shadow:0 28px 80px rgba(0,18,31,.38); }
.trade-request-card { width:min(470px,100%); margin:auto; padding:28px; text-align:center; }
.trade-request-card > span { display:grid; place-items:center; width:72px; height:72px; margin:0 auto 12px; border-radius:22px; background:color-mix(in srgb,#5ac7ff 14%,transparent); font-size:38px; }
.trade-request-card small { color:#31a7e4; font-size:9px; font-weight:900; letter-spacing:.08em; }
.trade-request-card h2 { margin:8px 0; font-size:24px; }
.trade-request-card p { color:var(--theme-muted,#6b8495); font-size:11px; line-height:1.45; }
.trade-request-card > div { display:grid; grid-template-columns:1fr 1.25fr; gap:9px; margin-top:18px; }
.trade-request-card button,.trade-window-v2732 button { min-height:44px; border:1px solid var(--theme-border,#cbdde7); border-radius:13px; background:var(--theme-card,#fff); color:var(--theme-text,#173e58); font-weight:900; }
.trade-request-card button.is-primary,.trade-window-v2732 .is-confirm { border-color:#42b8ee; background:linear-gradient(180deg,#45baf2,#218fd2); color:#fff; }
.trade-window-v2732 { overflow:hidden; }
.trade-window-v2732 > header { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; padding:18px 20px; border-bottom:1px solid var(--theme-border,#d0e0e9); }
.trade-window-v2732 > header small { color:#35a9e4; font-size:8px; font-weight:900; }
.trade-window-v2732 > header h2 { margin:3px 0; font-size:22px; }
.trade-window-v2732 > header p { margin:0; color:var(--theme-muted,#698397); font-size:9px; }
.trade-window-v2732 > header button { width:42px; min-height:42px; font-size:22px; }
.trade-columns { display:grid; grid-template-columns:1fr 1fr; }
.trade-side { min-width:0; padding:16px; }
.trade-side + .trade-side { border-left:1px solid var(--theme-border,#d0e0e9); }
.trade-side h3 { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0 0 10px; font-size:14px; }
.trade-side h3 span { color:var(--theme-muted,#698397); font-size:8px; font-weight:800; }
.trade-offer-list { display:grid; gap:6px; min-height:108px; padding:8px; border:1px dashed var(--theme-border,#cbdde7); border-radius:14px; }
.trade-empty { display:grid; place-items:center; margin:0; color:var(--theme-muted,#7b929f); font-size:9px; }
.trade-offer-row,.trade-money-row { display:grid; grid-template-columns:38px minmax(0,1fr) auto auto; gap:8px; align-items:center; min-height:42px; padding:5px 7px; border-radius:11px; background:color-mix(in srgb,var(--theme-card,#fff) 92%,transparent); }
.trade-offer-row > span { display:grid; place-items:center; width:38px; height:38px; }
.trade-offer-row .item-icon { width:34px; height:34px; }
.trade-offer-row b,.trade-money-row b { font-size:9px; }
.trade-offer-row em,.trade-money-row em { font-size:9px; font-style:normal; font-weight:900; }
.trade-offer-row button { width:30px; min-height:30px; border-radius:9px; }
.trade-money-input { display:flex; align-items:center; gap:8px; margin-top:8px; }
.trade-money-input span { font-size:9px; font-weight:900; }
.trade-money-input input { min-width:0; flex:1; height:38px; padding:0 10px; border:1px solid var(--theme-border,#cbdde7); border-radius:11px; background:var(--theme-card,#fff); color:var(--theme-text,#173e58); font-weight:800; }
.trade-inventory-picker { display:grid; gap:5px; max-height:260px; margin-top:12px; overflow:auto; }
.trade-inventory-picker > small { color:var(--theme-muted,#698397); font-size:8px; font-weight:900; }
.trade-inventory-picker button { display:grid; grid-template-columns:38px minmax(0,1fr) auto 24px; gap:7px; align-items:center; min-height:48px; padding:5px 8px; text-align:left; }
.trade-inventory-picker button > span { width:38px; height:38px; }
.trade-inventory-picker button .item-icon { width:34px; height:34px; }
.trade-inventory-picker button b { font-size:9px; }
.trade-inventory-picker button small { color:var(--theme-muted,#698397); font-size:7px; }
.trade-inventory-picker button i { font-size:16px; font-style:normal; }
.trade-safety { display:grid; grid-template-columns:36px 1fr; gap:8px; margin-top:12px; padding:11px; border:1px solid color-mix(in srgb,#50c98f 32%,var(--theme-border,#cbdde7)); border-radius:13px; background:color-mix(in srgb,#50c98f 7%,transparent); }
.trade-safety > span { font-size:23px; }
.trade-safety b { display:block; font-size:9px; }
.trade-safety small { color:var(--theme-muted,#698397); font-size:8px; line-height:1.35; }
.trade-window-v2732 > footer { display:flex; justify-content:flex-end; gap:9px; padding:13px 17px; border-top:1px solid var(--theme-border,#d0e0e9); }
.trade-window-v2732 > footer button { min-width:150px; padding:0 15px; }
.trade-window-v2732 .is-confirm.is-locked { background:#48b980; border-color:#48b980; }
html[data-game-theme="dark"] .trade-request-card,html[data-game-theme="dark"] .trade-window-v2732 { --theme-panel:rgba(8,38,51,.98); }


/* v2.7.33 — visual inventory & trade polish */
.inventory-shell-v2733 { gap:16px; }
.inventory-header-v2733 { align-items:center; }
.inventory-header-v2733 .inventory-search { height:48px; border-radius:16px; background:linear-gradient(180deg,color-mix(in srgb,var(--theme-card,#fff) 95%,transparent),color-mix(in srgb,var(--theme-card,#fff) 88%,transparent)); box-shadow:inset 0 1px 0 rgba(255,255,255,.6); }
.inventory-summary-v2733 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.inventory-summary-v2733 article { display:grid; grid-template-columns:38px minmax(0,1fr); gap:4px 10px; align-items:center; min-height:70px; padding:12px; border:1px solid var(--theme-border,#d7e4ec); border-radius:18px; background:linear-gradient(180deg,color-mix(in srgb,var(--theme-card,#fff) 98%,transparent),color-mix(in srgb,var(--theme-accent,#2399dd) 3%,var(--theme-card,#fff))); box-shadow:0 10px 24px rgba(26,72,102,.08); }
.inventory-summary-v2733 article i { grid-row:1 / 4; display:grid; place-items:center; width:38px; height:38px; border-radius:13px; background:color-mix(in srgb,var(--theme-accent,#2399dd) 12%,transparent); font-style:normal; font-size:20px; }
.inventory-summary-v2733 article b { font-size:20px; line-height:1; }
.inventory-summary-v2733 article small { color:var(--theme-text,#173e58); font-size:9px; font-weight:900; }
.inventory-summary-v2733 article span { color:var(--theme-muted,#6f889a); font-size:8px; }
.inventory-tabs-v2733 button { gap:10px; min-height:44px; padding:0 12px; border-radius:15px; }
.inventory-tabs-v2733 button > span { display:grid; gap:1px; }
.inventory-tabs-v2733 button b { font-size:10px; }
.inventory-tabs-v2733 button small { justify-self:start; min-width:0; height:auto; padding:0; background:none; font-size:8px; }
.inventory-layout-v2733 { grid-template-columns:minmax(0,.95fr) minmax(360px,1.05fr); gap:16px; }
.inventory-list-v2733 { gap:10px; }
.inventory-card-v2733 { grid-template-columns:58px minmax(0,1fr); gap:12px; min-height:88px; padding:11px 12px; border-radius:18px; box-shadow:0 8px 18px rgba(19,57,82,.05); }
.inventory-card-v2733:hover { box-shadow:0 14px 28px rgba(29,95,135,.12); }
.inventory-card-v2733 .inventory-card-icon { width:58px; height:58px; border-radius:16px; background:linear-gradient(180deg,color-mix(in srgb,var(--theme-card,#fff) 94%,transparent),color-mix(in srgb,var(--theme-accent,#2d9de3) 8%,var(--theme-card,#fff))); }
.inventory-card-v2733 .inventory-card-icon .item-icon { width:46px; height:46px; }
.inventory-card-topline { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.inventory-card-v2733 .inventory-card-copy { gap:5px; }
.inventory-card-v2733 .inventory-card-copy b { font-size:13px; }
.inventory-card-v2733 .inventory-card-copy small { font-size:8px; }
.inventory-card-topline em { flex:0 0 auto; padding:5px 8px; border-radius:999px; background:color-mix(in srgb,var(--theme-accent,#269ce3) 10%,transparent); color:var(--theme-text,#173e58); font-size:10px; font-style:normal; font-weight:900; }
.inventory-card-tags { display:flex; flex-wrap:wrap; gap:5px; }
.inventory-card-tags i { display:inline-flex; align-items:center; min-height:20px; padding:0 8px; border-radius:999px; background:color-mix(in srgb,var(--theme-text,#173e58) 5%,transparent); color:var(--theme-text,#173e58); font-size:7px; font-style:normal; font-weight:900; letter-spacing:.02em; }
.inventory-card-tags .is-trade { background:rgba(68,172,220,.12); color:#1a82ba; }
.inventory-card-tags .is-protected,.inventory-card-tags .is-lock { background:rgba(228,173,75,.13); color:#98660f; }
.inventory-card-tags .is-usable { background:rgba(75,195,135,.12); color:#2f8d5d; }
.inventory-card-tags .is-mixed { background:rgba(137,112,232,.12); color:#6f50c9; }
.inventory-card-tags .is-common { background:rgba(114,132,146,.10); color:#4d6679; }
.inventory-card-tags .is-uncommon { background:rgba(89,184,113,.12); color:#327d48; }
.inventory-card-tags .is-rare { background:rgba(79,148,235,.12); color:#2e6fc8; }
.inventory-card-tags .is-epic { background:rgba(142,96,229,.14); color:#7046cb; }
.inventory-card-tags .is-legendary { background:rgba(241,172,71,.16); color:#b06d06; }
.item-graphic-shell { position:relative; display:grid; place-items:center; width:100%; height:100%; border-radius:inherit; isolation:isolate; }
.item-graphic-shell::before { content:''; position:absolute; inset:10%; border-radius:inherit; background:radial-gradient(circle at 50% 38%, rgba(255,255,255,.55), transparent 58%); opacity:.65; z-index:-1; }
.item-graphic-shell > img,.item-graphic-shell > svg { width:100%; height:100%; }
.item-graphic-base { width:100%; height:100%; }
.item-species-badge { position:absolute; right:-2px; bottom:-2px; display:grid; place-items:center; width:20px; height:20px; border:2px solid var(--theme-card,#fff); border-radius:999px; background:#fff; box-shadow:0 4px 10px rgba(18,53,80,.18); overflow:hidden; }
.item-species-badge img { width:100%; height:100%; object-fit:cover; }
.inventory-detail-v2733 .inventory-detail-card { padding:18px; border-radius:22px; box-shadow:0 16px 36px rgba(21,65,92,.08); }
.inventory-detail-hero-v2733 { gap:15px; }
.inventory-detail-hero-v2733 > span { width:84px; height:84px; border-radius:22px; }
.inventory-detail-hero-v2733 .item-icon { width:68px; height:68px; }
.inventory-detail-headline { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.rarity-pill { display:inline-flex; align-items:center; min-height:20px; padding:0 8px; border-radius:999px; background:rgba(92,115,132,.1); color:#4a6479; font-size:7px; font-style:normal; font-weight:900; text-transform:uppercase; letter-spacing:.06em; }
.rarity-pill.rarity-uncommon { background:rgba(81,181,112,.13); color:#327d48; }
.rarity-pill.rarity-rare { background:rgba(84,149,238,.13); color:#2f6fc4; }
.rarity-pill.rarity-epic { background:rgba(140,98,231,.14); color:#6c46c8; }
.rarity-pill.rarity-legendary { background:rgba(241,177,76,.16); color:#aa6907; }
.inventory-detail-submeta { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.inventory-detail-submeta span { display:inline-flex; align-items:center; min-height:22px; padding:0 9px; border-radius:999px; background:color-mix(in srgb,var(--theme-text,#173e58) 5%,transparent); color:var(--theme-muted,#617d91); font-size:8px; font-weight:800; }
.inventory-policy-grid-v2733 { margin-top:16px; }
.inventory-detail-section { margin-top:14px; }
.inventory-detail-section > header { display:flex; justify-content:space-between; gap:8px; align-items:flex-end; margin-bottom:8px; }
.inventory-detail-section > header b { font-size:11px; }
.inventory-detail-section > header small { color:var(--theme-muted,#6a8396); font-size:8px; }
.inventory-lot-list { display:grid; gap:8px; }
.inventory-lot-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; min-height:58px; padding:10px 12px; border:1px solid var(--theme-border,#d4e3ea); border-radius:15px; background:linear-gradient(180deg,color-mix(in srgb,var(--theme-card,#fff) 97%,transparent),color-mix(in srgb,var(--theme-accent,#289bde) 4%,var(--theme-card,#fff))); }
.inventory-lot-row b { display:block; font-size:10px; }
.inventory-lot-row small { color:var(--theme-muted,#698397); font-size:8px; line-height:1.45; }
.inventory-lot-row em { padding:6px 9px; border-radius:999px; background:color-mix(in srgb,var(--theme-text,#173e58) 5%,transparent); font-size:10px; font-style:normal; font-weight:900; }
.inventory-detail-actions-v2733 { grid-template-columns:minmax(100px,.75fr) 1fr 1fr 1fr; align-items:end; }
.inventory-detail-actions-v2733 button { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:2px; }
.inventory-detail-actions-v2733 button span { font-size:16px; }
.inventory-detail-actions-v2733 button b { font-size:8px; }
.inventory-detail-actions-v2733 button.is-secondary { border-color:var(--theme-border,#cbdde7); background:var(--theme-card,#fff); color:var(--theme-muted,#6f8798); }
.inventory-detail-footnote { margin-top:11px; color:var(--theme-muted,#6d8697); font-size:8px; line-height:1.45; }
.trade-window-v2733 { border-radius:28px; }
.trade-window-v2733 > header { padding:20px 22px 16px; }
.trade-window-v2733 > header small { letter-spacing:.08em; }
.trade-flow-v2733 { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:0 20px 16px; }
.trade-flow-v2733 article { display:flex; align-items:center; gap:9px; min-height:46px; padding:0 12px; border:1px solid var(--theme-border,#d0e0e9); border-radius:16px; background:color-mix(in srgb,var(--theme-card,#fff) 96%,transparent); color:var(--theme-muted,#688396); }
.trade-flow-v2733 article b { display:grid; place-items:center; width:24px; height:24px; border-radius:999px; background:color-mix(in srgb,var(--theme-accent,#269ce3) 9%,transparent); font-size:10px; }
.trade-flow-v2733 article span { font-size:9px; font-weight:900; }
.trade-flow-v2733 article.is-active,.trade-flow-v2733 article.is-done { border-color:color-mix(in srgb,var(--theme-accent,#2d9de3) 45%,var(--theme-border,#d0e0e9)); color:var(--theme-text,#173e58); }
.trade-flow-v2733 article.is-done { background:color-mix(in srgb,#4ec988 8%,var(--theme-card,#fff)); }
.trade-columns-v2733 { border-top:1px solid var(--theme-border,#d0e0e9); }
.trade-side-head { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; margin-bottom:10px; }
.trade-side-meta { display:flex; gap:6px; flex-wrap:wrap; }
.trade-side-meta i { display:inline-flex; align-items:center; min-height:22px; padding:0 8px; border-radius:999px; background:color-mix(in srgb,var(--theme-text,#173e58) 6%,transparent); font-size:8px; font-style:normal; font-weight:900; }
.trade-offer-row-v2733,.trade-money-row-v2733 { grid-template-columns:42px minmax(0,1fr) auto auto; min-height:48px; padding:6px 8px; border-radius:13px; }
.trade-offer-row-v2733 > span,.trade-money-row-v2733 > span { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; background:color-mix(in srgb,var(--theme-accent,#269ce3) 8%,transparent); }
.trade-offer-row-v2733 .item-icon { width:34px; height:34px; }
.trade-offer-row-v2733 div,.trade-money-row-v2733 div { display:grid; gap:2px; }
.trade-offer-row-v2733 small,.trade-money-row-v2733 small { color:var(--theme-muted,#6e8698); font-size:7px; }
.trade-money-input { margin-top:10px; }
.trade-inventory-picker { gap:7px; margin-top:14px; }
.trade-inventory-picker button { grid-template-columns:42px minmax(0,1fr) 24px; min-height:54px; border-radius:14px; }
.trade-inventory-picker button > span { width:42px; height:42px; border-radius:13px; background:color-mix(in srgb,var(--theme-accent,#269ce3) 8%,transparent); display:grid; place-items:center; }
.trade-inventory-picker button div { display:grid; gap:2px; min-width:0; }
.trade-inventory-picker button b { font-size:10px; }
.trade-inventory-picker button small { font-size:7px; }
.trade-tip-card { display:grid; grid-template-columns:36px 1fr; gap:8px; margin-top:10px; padding:11px; border:1px solid color-mix(in srgb,#7b9ee8 28%,var(--theme-border,#cbdde7)); border-radius:13px; background:color-mix(in srgb,#7b9ee8 7%,transparent); }
.trade-tip-card > span { font-size:22px; }
.trade-tip-card b { display:block; font-size:9px; }
.trade-tip-card small { color:var(--theme-muted,#698397); font-size:8px; line-height:1.35; }
html[data-game-theme="dark"] .inventory-summary-v2733 article,
html[data-game-theme="dark"] .inventory-lot-row,
html[data-game-theme="dark"] .trade-flow-v2733 article { box-shadow:none; }


@media (max-width:760px) {
  .game-screen .side-panel.is-inventory-panel { width:calc(100vw - 12px); padding:12px; }
  .inventory-header-v2732 { grid-template-columns:1fr; gap:9px; }
  .inventory-header-v2732 p { display:none; }
  .inventory-layout-v2732 { grid-template-columns:1fr; }
  .inventory-list-v2732 { max-height:260px; }
  .inventory-detail-card { min-height:auto; }
  .inventory-policy-grid { grid-template-columns:1fr 1fr; }
  .inventory-detail-actions { grid-template-columns:1fr 1fr; }
  .inventory-detail-actions label { grid-column:1/-1; }
  .trade-dialog { padding:7px; }
  .trade-dialog__content { width:100%; max-height:calc(100vh - 14px); }
  .trade-window-v2732 { border-radius:18px; }
  .trade-columns { grid-template-columns:1fr; }
  .trade-side + .trade-side { border-left:0; border-top:1px solid var(--theme-border,#d0e0e9); }
  .trade-inventory-picker { max-height:170px; }
  .trade-window-v2732 > footer { position:sticky; bottom:0; background:var(--theme-panel,#fff); }
  .trade-window-v2732 > footer button { min-width:0; flex:1; }

  .inventory-summary-v2733 { grid-template-columns:1fr 1fr; }
  .inventory-tabs-v2733 button { min-height:42px; }
  .inventory-layout-v2733 { grid-template-columns:1fr; }
  .inventory-card-v2733 { min-height:82px; }
  .inventory-detail-v2733 .inventory-detail-card { padding:14px; }
  .inventory-detail-actions-v2733 { grid-template-columns:1fr 1fr; }
  .inventory-detail-actions-v2733 label { grid-column:1 / -1; }
  .inventory-detail-actions-v2733 button.is-secondary { grid-column:1 / -1; }
  .trade-flow-v2733 { grid-template-columns:1fr; padding:0 14px 12px; }
  .trade-side-head { flex-direction:column; align-items:flex-start; }
}

/* v2.7.34 — compact visual inventory: fixed categories, item grid, mobile item sheet */
.game-screen .side-panel.is-inventory-panel {
  top: 72px;
  right: 18px;
  bottom: 18px;
  width: min(980px, calc(100vw - 92px));
  padding: 18px;
  overflow: hidden;
}
.inventory-shell-v2734 {
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr);
  gap:12px;
  height:100%;
  min-height:0;
}
.inventory-header-v2734 {
  display:grid;
  grid-template-columns:minmax(240px,1fr) minmax(320px,.9fr);
  gap:18px;
  align-items:center;
}
.inventory-header-v2734 .panel-eyebrow { font-size:8px; letter-spacing:.09em; }
.inventory-header-v2734 h2 { margin:3px 0 0; font-size:29px; line-height:1; }
.inventory-header-tools-v2734 { display:flex; justify-content:flex-end; align-items:center; gap:9px; min-width:0; }
.inventory-count-pills-v2734 { display:flex; gap:6px; flex:0 0 auto; }
.inventory-count-pills-v2734 span { display:flex; align-items:center; gap:4px; min-height:34px; padding:0 9px; border:1px solid var(--theme-border,#d2e1e9); border-radius:12px; background:color-mix(in srgb,var(--theme-card,#fff) 94%,transparent); color:var(--theme-muted,#658195); font-size:8px; font-weight:800; white-space:nowrap; }
.inventory-count-pills-v2734 b { color:#2587bd; font-size:11px; }
.inventory-count-pills-v2734 .is-locked b { color:#b57a16; }
.inventory-header-v2734 .inventory-search { flex:1 1 230px; width:auto; min-width:190px; max-width:310px; height:40px; min-height:40px; }
.inventory-header-v2734 .inventory-search > span { display:grid; place-items:center; width:20px; height:20px; }
.inventory-header-v2734 .inventory-search .ui-icon { width:16px; height:16px; }
.inventory-tabs-v2734 {
  display:grid;
  grid-template-columns:repeat(9,minmax(0,1fr));
  gap:7px;
  min-width:0;
}
.inventory-tabs-v2734 button {
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:7px;
  align-items:center;
  min-width:0;
  min-height:48px;
  padding:6px 8px;
  border:1px solid var(--theme-border,#cfdee7);
  border-radius:14px;
  background:color-mix(in srgb,var(--theme-card,#fff) 95%,transparent);
  color:var(--theme-muted,#638095);
  text-align:left;
  cursor:pointer;
  transition:.16s ease;
}
.inventory-tabs-v2734 button:hover { transform:translateY(-1px); border-color:color-mix(in srgb,var(--theme-accent,#289ce0) 45%,var(--theme-border,#cfdee7)); }
.inventory-tabs-v2734 button.is-active { color:var(--theme-text,#173e58); border-color:var(--theme-accent,#279ce2); background:color-mix(in srgb,var(--theme-accent,#279ce2) 8%,var(--theme-card,#fff)); box-shadow:0 6px 14px color-mix(in srgb,var(--theme-accent,#279ce2) 10%,transparent); }
.inventory-tabs-v2734 .inventory-category-icon { width:28px; height:28px; }
.inventory-tabs-v2734 button > span { display:grid; min-width:0; }
.inventory-tabs-v2734 button b { overflow:hidden; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.inventory-tabs-v2734 button small { color:var(--theme-muted,#6f8799); font-size:7px; }
.inventory-body-v2734 { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:12px; min-height:0; }
.inventory-browser-v2734 { min-width:0; min-height:0; overflow:auto; padding:1px 4px 4px 1px; }
.inventory-grid-v2734 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; align-content:start; }
.inventory-grid-v2734 .bag-empty { grid-column:1/-1; min-height:180px; display:grid; place-items:center; align-content:center; gap:5px; color:var(--theme-muted,#698397); }
.inventory-card-v2734 {
  position:relative;
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  gap:10px;
  align-items:center;
  min-width:0;
  min-height:94px;
  padding:10px;
  border:1px solid var(--theme-border,#d1e1e9);
  border-radius:17px;
  background:color-mix(in srgb,var(--theme-card,#fff) 96%,transparent);
  color:var(--theme-text,#173e58);
  text-align:left;
  cursor:pointer;
  box-shadow:0 6px 16px rgba(22,67,95,.045);
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.inventory-card-v2734:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--theme-accent,#269ce3) 45%,var(--theme-border,#d1e1e9)); box-shadow:0 10px 22px rgba(30,88,122,.09); }
.inventory-card-v2734.is-selected { border-color:var(--theme-accent,#269ce3); box-shadow:0 0 0 2px color-mix(in srgb,var(--theme-accent,#269ce3) 10%,transparent),0 10px 22px rgba(30,88,122,.1); }
.inventory-card-art-v2734 { display:grid; place-items:center; width:58px; height:58px; border-radius:16px; background:linear-gradient(180deg,color-mix(in srgb,var(--theme-card,#fff) 95%,transparent),color-mix(in srgb,var(--theme-accent,#269ce3) 7%,var(--theme-card,#fff))); overflow:visible; }
.inventory-card-art-v2734 .item-icon { width:48px; height:48px; }
.inventory-card-info-v2734 { display:grid; gap:4px; min-width:0; }
.inventory-card-info-v2734 > b { overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.inventory-card-info-v2734 > small { overflow:hidden; color:var(--theme-muted,#6b8597); font-size:7px; text-overflow:ellipsis; white-space:nowrap; }
.inventory-card-info-v2734 > i { justify-self:start; display:inline-flex; align-items:center; min-height:19px; max-width:100%; padding:0 7px; border-radius:999px; background:rgba(76,171,218,.1); color:#227cad; font-size:7px; font-style:normal; font-weight:900; white-space:nowrap; }
.inventory-card-info-v2734 > i.state-locked { color:#9a6813; background:rgba(224,170,65,.12); }
.inventory-card-info-v2734 > i.state-mixed { color:#7352c6; background:rgba(132,99,221,.12); }
.inventory-card-info-v2734 > i.state-usable { color:#2e8959; background:rgba(67,187,124,.12); }
.inventory-card-v2734 > em { position:absolute; top:8px; right:8px; display:grid; place-items:center; min-width:27px; height:24px; padding:0 7px; border-radius:999px; background:color-mix(in srgb,var(--theme-text,#173e58) 6%,var(--theme-card,#fff)); font-size:9px; font-style:normal; font-weight:900; }
.inventory-detail-v2734 { min-width:0; min-height:0; }
.inventory-item-sheet-v2734 { display:grid; align-content:start; gap:12px; height:100%; min-height:0; padding:14px; border:1px solid var(--theme-border,#d0e0e9); border-radius:20px; background:color-mix(in srgb,var(--theme-card,#fff) 96%,transparent); box-shadow:0 14px 34px rgba(24,70,96,.08); overflow:auto; }
.inventory-mobile-detail-close-v2734 { display:none; }
.inventory-item-sheet-v2734 > header { display:grid; grid-template-columns:72px minmax(0,1fr) auto; gap:12px; align-items:start; }
.inventory-item-sheet-v2734 > header > span { display:grid; place-items:center; width:72px; height:72px; border-radius:18px; background:linear-gradient(180deg,color-mix(in srgb,var(--theme-card,#fff) 96%,transparent),color-mix(in srgb,var(--theme-accent,#269ce3) 8%,var(--theme-card,#fff))); }
.inventory-item-sheet-v2734 > header .item-icon { width:58px; height:58px; }
.inventory-item-sheet-v2734 > header small { color:var(--theme-accent,#269ce3); font-size:7px; font-weight:900; letter-spacing:.08em; }
.inventory-item-sheet-v2734 > header h3 { margin:3px 0 5px; font-size:18px; line-height:1.05; }
.inventory-item-sheet-v2734 > header p { margin:0; color:var(--theme-muted,#668397); font-size:9px; line-height:1.4; }
.inventory-item-sheet-v2734 > header strong { padding:5px 7px; border-radius:999px; background:color-mix(in srgb,var(--theme-text,#173e58) 6%,transparent); font-size:10px; }
.inventory-availability-v2734 { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.inventory-availability-v2734 article { display:grid; gap:2px; min-width:0; padding:9px 7px; border:1px solid var(--theme-border,#d3e1e9); border-radius:13px; text-align:center; }
.inventory-availability-v2734 article b { font-size:16px; }
.inventory-availability-v2734 article span { color:var(--theme-muted,#6d8698); font-size:7px; font-weight:800; }
.inventory-availability-v2734 article.is-ok { border-color:rgba(68,187,127,.34); background:rgba(68,187,127,.055); }
.inventory-availability-v2734 article.is-warn { border-color:rgba(226,171,66,.35); background:rgba(226,171,66,.06); }
.inventory-mixed-note-v2734 { display:grid; gap:3px; padding:9px 10px; border:1px solid rgba(219,164,67,.31); border-radius:13px; background:rgba(229,181,80,.065); }
.inventory-mixed-note-v2734 b { font-size:9px; }
.inventory-mixed-note-v2734 span { color:var(--theme-muted,#698397); font-size:7px; line-height:1.35; }
.inventory-lots-v2734 { border:1px solid var(--theme-border,#d3e1e9); border-radius:13px; overflow:hidden; }
.inventory-lots-v2734 summary { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:40px; padding:0 10px; cursor:pointer; font-size:8px; font-weight:900; list-style:none; }
.inventory-lots-v2734 summary::-webkit-details-marker { display:none; }
.inventory-lots-v2734 summary span { display:grid; place-items:center; min-width:20px; height:20px; padding:0 5px; border-radius:999px; background:color-mix(in srgb,var(--theme-accent,#269ce3) 10%,transparent); }
.inventory-lots-v2734 > div { display:grid; gap:5px; padding:0 8px 8px; }
.inventory-lots-v2734 article { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:center; min-height:43px; padding:6px 8px; border-radius:10px; background:color-mix(in srgb,var(--theme-text,#173e58) 3%,transparent); }
.inventory-lots-v2734 article b { display:block; font-size:8px; }
.inventory-lots-v2734 article small { color:var(--theme-muted,#6b8495); font-size:7px; }
.inventory-lots-v2734 article em { font-size:9px; font-style:normal; font-weight:900; }
.inventory-actions-v2734 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:7px; margin-top:auto; }
.inventory-actions-v2734 label { grid-column:1/-1; display:grid; grid-template-columns:1fr 72px; gap:8px; align-items:center; min-height:36px; color:var(--theme-muted,#698397); font-size:8px; font-weight:900; }
.inventory-actions-v2734 input { width:72px; height:34px; padding:0 8px; border:1px solid var(--theme-border,#d1e1ea); border-radius:10px; background:var(--theme-card,#fff); color:var(--theme-text,#173e58); font-weight:900; }
.inventory-actions-v2734 button { display:flex; align-items:center; justify-content:center; gap:5px; min-width:0; min-height:40px; padding:0 8px; border:1px solid var(--theme-border,#cfdfe8); border-radius:12px; background:var(--theme-card,#fff); color:var(--theme-text,#173e58); font-size:8px; font-weight:900; }
.inventory-actions-v2734 button .ui-icon { width:15px; height:15px; }
.inventory-actions-v2734 button.is-use { border-color:rgba(55,157,225,.36); background:rgba(55,157,225,.07); }
.inventory-actions-v2734 button.is-trade { border-color:rgba(76,184,139,.36); background:rgba(76,184,139,.07); }
.inventory-actions-v2734 button.is-sell { border-color:rgba(226,171,66,.36); background:rgba(226,171,66,.07); }
.inventory-actions-v2734 button.is-danger { grid-column:1/-1; color:#d55454; border-color:rgba(224,90,90,.3); background:rgba(224,90,90,.055); }
.inventory-actions-v2734 button:disabled { opacity:.34; cursor:not-allowed; }
.item-species-badge { width:21px; height:21px; }

/* Trade window polish follows the same visual language. */
.trade-window-v2733 { width:100%; }
.trade-window-v2733 .trade-flow-v2733 article { min-height:42px; }
.trade-window-v2733 .trade-inventory-picker button { min-height:50px; }
.trade-window-v2733 .trade-offer-list { min-height:92px; }

html[data-game-theme="dark"] .inventory-card-v2734,
html[data-game-theme="dark"] .inventory-item-sheet-v2734,
html[data-game-theme="dark"] .inventory-tabs-v2734 button,
html[data-game-theme="dark"] .inventory-count-pills-v2734 span { box-shadow:none; }
html[data-game-theme="dark"] .inventory-card-info-v2734 > i.state-locked { color:#f0be58; }
html[data-game-theme="dark"] .inventory-card-info-v2734 > i.state-mixed { color:#b89cff; }
html[data-game-theme="dark"] .inventory-card-info-v2734 > i.state-tradable { color:#73cbf2; }

@media (max-width:1100px) and (pointer:fine) {
  .game-screen .side-panel.is-inventory-panel { width:min(860px,calc(100vw - 56px)); }
  .inventory-tabs-v2734 { grid-template-columns:repeat(5,minmax(0,1fr)); }
  .inventory-grid-v2734 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .inventory-body-v2734 { grid-template-columns:minmax(0,1fr) 300px; }
  .inventory-count-pills-v2734 { display:none; }
}

@media (max-width:760px) {
  .game-screen .side-panel.is-inventory-panel { inset:auto 6px calc(68px + env(safe-area-inset-bottom)) 6px; width:auto; max-height:calc(100% - 78px - env(safe-area-inset-top)); padding:10px; border-radius:20px; overflow:hidden; }
  .inventory-shell-v2734 { gap:9px; }
  .inventory-header-v2734 { grid-template-columns:1fr; gap:8px; }
  .inventory-header-v2734 h2 { font-size:21px; }
  .inventory-header-tools-v2734 { justify-content:stretch; }
  .inventory-count-pills-v2734 { display:none; }
  .inventory-header-v2734 .inventory-search { max-width:none; flex:1; height:38px; }
  .inventory-tabs-v2734 { display:flex; gap:6px; overflow:auto hidden; padding-bottom:3px; scrollbar-width:none; }
  .inventory-tabs-v2734::-webkit-scrollbar { display:none; }
  .inventory-tabs-v2734 button { flex:0 0 72px; grid-template-columns:1fr; justify-items:center; gap:3px; min-height:54px; padding:5px; text-align:center; }
  .inventory-tabs-v2734 .inventory-category-icon { width:24px; height:24px; }
  .inventory-tabs-v2734 button b { font-size:7px; }
  .inventory-tabs-v2734 button small { justify-self:center; font-size:7px; }
  .inventory-body-v2734 { grid-template-columns:1fr; min-height:0; }
  .inventory-browser-v2734 { padding-right:1px; }
  .inventory-grid-v2734 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
  .inventory-card-v2734 { grid-template-columns:48px minmax(0,1fr); min-height:79px; padding:8px; border-radius:15px; }
  .inventory-card-art-v2734 { width:48px; height:48px; border-radius:13px; }
  .inventory-card-art-v2734 .item-icon { width:40px; height:40px; }
  .inventory-card-info-v2734 > b { font-size:9px; }
  .inventory-card-info-v2734 > small { display:none; }
  .inventory-card-info-v2734 > i { max-width:92px; overflow:hidden; font-size:6px; text-overflow:ellipsis; }
  .inventory-card-v2734 > em { top:5px; right:5px; height:20px; min-width:23px; font-size:7px; }
  .inventory-detail-v2734 { display:none; }
  .inventory-shell-v2734.is-detail-open .inventory-detail-v2734 { position:fixed; z-index:82; inset:auto 6px calc(68px + env(safe-area-inset-bottom)) 6px; display:block; max-height:min(72vh,640px); }
  .inventory-shell-v2734.is-detail-open .inventory-item-sheet-v2734 { max-height:min(72vh,640px); padding:13px; border-radius:20px 20px 16px 16px; box-shadow:0 -18px 50px rgba(3,20,32,.28); }
  .inventory-shell-v2734.is-detail-open::after { content:''; position:fixed; z-index:81; inset:0; background:rgba(2,15,24,.28); backdrop-filter:blur(2px); pointer-events:none; }
  .inventory-mobile-detail-close-v2734 { position:sticky; top:0; z-index:2; display:grid; place-items:center; justify-self:start; width:36px; height:30px; margin:-5px 0 -5px; border:0; border-radius:10px; background:color-mix(in srgb,var(--theme-text,#173e58) 7%,var(--theme-card,#fff)); color:var(--theme-text,#173e58); font-size:25px; }
  .inventory-item-sheet-v2734 > header { grid-template-columns:64px minmax(0,1fr) auto; }
  .inventory-item-sheet-v2734 > header > span { width:64px; height:64px; }
  .inventory-item-sheet-v2734 > header .item-icon { width:52px; height:52px; }
  .inventory-item-sheet-v2734 > header h3 { font-size:16px; }
  .inventory-item-sheet-v2734 > header p { font-size:8px; }
  .inventory-availability-v2734 { grid-template-columns:1fr 1fr; }
  .inventory-actions-v2734 { grid-template-columns:1fr 1fr; position:sticky; bottom:-13px; padding:9px 0 4px; background:linear-gradient(180deg,transparent,var(--theme-card,#fff) 24%); }
  .inventory-actions-v2734 label { grid-column:1/-1; }
  .inventory-actions-v2734 button.is-danger { grid-column:auto; }
  .trade-dialog__content { max-height:calc(100vh - 14px); }
  .trade-window-v2733 > header p { display:none; }
  .trade-flow-v2733 { grid-template-columns:repeat(3,1fr); padding:0 10px 10px; }
  .trade-flow-v2733 article { display:grid; justify-items:center; gap:3px; min-height:48px; padding:5px; text-align:center; }
  .trade-flow-v2733 article span { font-size:6px; }
}

/* v2.7.35 — modal inventory details + cleaner responsive categories */
.game-screen .side-panel.is-inventory-panel {
  width: min(1080px, calc(100vw - 72px));
}
.inventory-shell-v2735 {
  position: relative;
  min-height: 0;
}
.inventory-header-v2735 {
  grid-template-columns: minmax(220px,1fr) minmax(420px,1.15fr);
}
.inventory-header-tools-v2735 {
  gap: 10px;
}
.inventory-close-v2735 {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--theme-border,#cfdee7);
  border-radius: 14px;
  background: color-mix(in srgb,var(--theme-card,#fff) 95%,transparent);
  color: var(--theme-text,#173e58);
  font-size: 26px;
  line-height: 1;
}
.inventory-tabs-v2735 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-content: start;
}
.inventory-tabs-v2735 button {
  min-height: 56px;
  padding: 8px 10px;
}
.inventory-tabs-v2735 button span {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.inventory-tabs-v2735 button b {
  font-size: 10px;
  line-height: 1.1;
  white-space: normal;
}
.inventory-tabs-v2735 button small {
  font-size: 8px;
}
.inventory-body-v2735 {
  grid-template-columns: 1fr;
  position: relative;
}
.inventory-grid-v2735 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-right: 2px;
}
.inventory-card-v2735 {
  grid-template-columns: 56px minmax(0,1fr);
  min-height: 94px;
}
.inventory-card-v2735 .inventory-card-info-v2734 {
  align-content: start;
}
.inventory-card-v2735 .inventory-card-info-v2734 > b {
  white-space: normal;
  line-height: 1.15;
}
.inventory-card-v2735 .inventory-card-info-v2734 > i {
  margin-top: 2px;
  white-space: normal;
  line-height: 1.2;
}
.inventory-modal-v2735 {
  position: absolute;
  inset: 0;
  z-index: 12;
  display: grid;
  place-items: center;
  padding: 18px;
}
.inventory-modal-scrim-v2735 {
  position: absolute;
  inset: 0;
  border-radius: 28px;
  background: rgba(14,34,49,.22);
  backdrop-filter: blur(5px);
}
.inventory-item-sheet-v2735 {
  position: relative;
  z-index: 1;
  width: min(500px, calc(100% - 16px));
  max-height: calc(100% - 10px);
  border-radius: 24px;
  padding: 18px;
  overflow: auto;
}
.inventory-detail-close-v2735 {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--theme-border,#d0e0e9);
  border-radius: 14px;
  background: color-mix(in srgb,var(--theme-card,#fff) 96%,transparent);
  color: var(--theme-text,#173e58);
  font-size: 24px;
  line-height: 1;
}
.inventory-item-sheet-v2735 > header {
  grid-template-columns: 78px minmax(0,1fr) auto;
  padding-right: 42px;
}
.inventory-item-sheet-v2735 > header p {
  margin-top: 6px;
  font-size: 10px;
}
.inventory-inline-hint-v2735 {
  margin: -2px 0 0;
  color: var(--theme-muted,#698397);
  font-size: 8px;
  line-height: 1.5;
}
.inventory-actions-v2735 button span {
  white-space: nowrap;
}
.inventory-shell-v2734.is-detail-open .inventory-grid-v2735 {
  pointer-events: none;
}
.inventory-shell-v2734.is-detail-open .inventory-browser-v2734 {
  overflow: hidden;
}
html[data-game-theme="dark"] .inventory-modal-scrim-v2735 {
  background: rgba(0,0,0,.42);
}

@media (max-width: 1200px) and (pointer:fine) {
  .inventory-grid-v2735 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 920px) and (pointer:fine) {
  .game-screen .side-panel.is-inventory-panel {
    width: min(940px, calc(100vw - 36px));
  }
  .inventory-header-v2735 {
    grid-template-columns: 1fr;
  }
  .inventory-tabs-v2735 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width:760px) {
  .game-screen .side-panel.is-inventory-panel {
    top: max(6px, env(safe-area-inset-top));
    right: 0;
    left: 0;
    bottom: calc(62px + env(safe-area-inset-bottom));
    width: auto;
    max-height: none;
    padding: 10px;
    border-radius: 24px 24px 0 0;
  }
  .inventory-shell-v2735 {
    grid-template-rows: auto auto minmax(0,1fr);
  }
  .inventory-header-v2735 {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .inventory-header-v2735 .panel-eyebrow {
    font-size: 8px;
  }
  .inventory-header-v2735 h2 {
    font-size: 22px;
  }
  .inventory-header-tools-v2735 {
    display: grid;
    grid-template-columns: 1fr 44px;
    gap: 8px;
  }
  .inventory-header-tools-v2735 .inventory-search {
    min-width: 0;
    max-width: none;
    height: 42px;
  }
  .inventory-tabs-v2735 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    overflow: visible;
    padding-bottom: 0;
  }
  .inventory-tabs-v2735 button {
    grid-template-columns: 24px minmax(0, 1fr);
    justify-items: start;
    gap: 6px;
    min-height: 52px;
    padding: 7px 8px;
    text-align: left;
  }
  .inventory-tabs-v2735 .inventory-category-icon {
    width: 22px;
    height: 22px;
  }
  .inventory-tabs-v2735 button b {
    font-size: 9px;
    white-space: normal;
  }
  .inventory-tabs-v2735 button small {
    justify-self: start;
    font-size: 8px;
  }
  .inventory-browser-v2734 {
    overflow: auto;
  }
  .inventory-grid-v2735 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .inventory-card-v2735 {
    min-height: 88px;
  }
  .inventory-card-v2735 .inventory-card-info-v2734 > b {
    font-size: 10px;
  }
  .inventory-card-v2735 .inventory-card-info-v2734 > i {
    font-size: 7px;
  }
  .inventory-modal-v2735 {
    position: absolute;
    inset: 0;
    padding: 0;
    place-items: stretch;
  }
  .inventory-modal-scrim-v2735 {
    inset: 0;
    border-radius: 20px 20px 0 0;
  }
  .inventory-item-sheet-v2735 {
    width: 100%;
    max-height: 100%;
    min-height: 100%;
    border-radius: 20px 20px 0 0;
    padding: 16px 14px calc(20px + env(safe-area-inset-bottom));
    background: var(--theme-panel,#fff);
  }
  .inventory-detail-close-v2735 {
    top: 12px;
    right: 12px;
  }
  .inventory-item-sheet-v2735 > header {
    grid-template-columns: 64px minmax(0,1fr) auto;
    gap: 10px;
    padding-right: 42px;
  }
  .inventory-item-sheet-v2735 > header > span {
    width: 64px;
    height: 64px;
  }
  .inventory-item-sheet-v2735 > header .item-icon {
    width: 50px;
    height: 50px;
  }
  .inventory-item-sheet-v2735 > header h3 {
    font-size: 18px;
  }
  .inventory-item-sheet-v2735 > header p {
    font-size: 10px;
  }
  .inventory-availability-v2734 {
    grid-template-columns: repeat(2, 1fr);
  }
  .inventory-actions-v2735 {
    grid-template-columns: 1fr 1fr;
  }
  .inventory-actions-v2735 label,
  .inventory-actions-v2735 button.is-danger {
    grid-column: 1 / -1;
  }
  .inventory-actions-v2735 button {
    min-height: 46px;
  }
}

/* v2.7.36 — stable window contract: compact desktop drawers, width-based mobile layout */
@media (min-width: 801px) {
  .game-screen .side-panel {
    top: 86px;
    right: 18px;
    bottom: auto;
    left: auto;
    width: min(500px, calc(100vw - 140px));
    height: min(700px, calc(100vh - 118px));
    max-width: calc(100vw - 140px);
    max-height: calc(100vh - 118px);
    padding: 20px;
    overflow: hidden auto;
    border-radius: 24px;
  }
  .game-screen .side-panel.is-social-profile {
    left: 18px;
    right: auto;
    width: min(520px, calc(100vw - 140px));
    height: min(720px, calc(100vh - 118px));
    transform: translateX(calc(-100% - 44px));
  }
  .game-screen .side-panel.is-social-profile.is-open { transform: none; }
  .game-screen .side-panel.is-pokedex-detail {
    width: min(700px, calc(100vw - 140px));
    height: min(720px, calc(100vh - 118px));
  }
  .game-screen .side-panel.is-inventory-panel {
    right: 18px;
    left: auto;
    width: min(860px, calc(100vw - 140px));
    height: min(680px, calc(100vh - 118px));
    max-height: calc(100vh - 118px);
    padding: 16px;
  }
  .trade-dialog__content {
    width: min(820px, calc(100vw - 72px));
    max-height: min(700px, calc(100vh - 72px));
  }
  .professor-transfer-card-shell {
    width: min(560px, calc(100vw - 72px));
    max-height: min(680px, calc(100vh - 72px));
  }
  .starter-card {
    width: min(900px, calc(100vw - 72px));
    max-height: min(720px, calc(100vh - 72px));
  }
}

/* Keep long profile sections scrollable inside the drawer instead of stretching the window. */
.social-profile-shell-v2727 {
  min-width: 0;
}
.social-profile-tab-body,
.social-profile-section,
.referral-program-card,
.referral-link-box {
  min-width: 0;
}
.social-profile-section code,
.referral-link-box code {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Inventory detail is a compact action modal; the inventory itself never becomes a split layout. */
.inventory-modal-v2736 {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  padding: 14px;
}
.inventory-item-sheet-v2736 {
  width: min(460px, calc(100% - 20px));
  max-height: min(560px, calc(100% - 18px));
  gap: 10px;
  padding: 16px;
  overflow: auto;
  overscroll-behavior: contain;
}
.inventory-item-sheet-v2736 > header {
  grid-template-columns: 68px minmax(0,1fr) auto;
  gap: 10px;
  padding-right: 42px;
}
.inventory-item-sheet-v2736 > header > span {
  width: 68px;
  height: 68px;
}
.inventory-item-sheet-v2736 > header .item-icon {
  width: 54px;
  height: 54px;
}
.inventory-item-sheet-v2736 > header h3 {
  margin: 2px 0 4px;
  font-size: 18px;
}
.inventory-item-sheet-v2736 > header p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  font-size: 9px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.inventory-availability-v2736 {
  grid-template-columns: repeat(4, minmax(0,1fr));
}
.inventory-availability-v2736 article {
  min-height: 56px;
  padding: 7px 5px;
}
.inventory-availability-v2736 article b { font-size: 15px; }
.inventory-availability-v2736 article span { font-size: 7px; }
.inventory-actions-v2736 {
  grid-template-columns: 92px repeat(4, minmax(0,1fr));
  gap: 6px;
  margin: 0;
}
.inventory-actions-v2736 label {
  grid-column: auto;
  grid-template-columns: 1fr;
  gap: 3px;
  min-width: 0;
}
.inventory-actions-v2736 label span { font-size: 7px; }
.inventory-actions-v2736 input {
  width: 100%;
  height: 38px;
}
.inventory-actions-v2736 button,
.inventory-actions-v2736 button.is-danger {
  grid-column: auto;
  min-height: 48px;
  flex-direction: column;
  gap: 2px;
  padding: 4px 5px;
}
.inventory-actions-v2736 button span { font-size: 7px; }
.inventory-actions-v2736 button .ui-icon { width: 16px; height: 16px; }
.inventory-mixed-note-v2736 {
  padding: 8px 10px;
}
.inventory-mixed-note-v2736 span { font-size: 7px; }
.inventory-lots-v2736 summary { min-height: 36px; }
.inventory-lots-v2736 article { min-height: 38px; }

/* Buttons and interactive elements stay above decorative layers. */
.side-panel.is-open,
.trade-dialog.is-open,
.professor-transfer-dialog.is-open,
.social-invite.is-open,
.starter-dialog.is-open { pointer-events: auto; }
.side-panel button,
.side-panel input,
.side-panel summary,
.trade-dialog button,
.trade-dialog input,
.professor-transfer-dialog button,
.social-invite button,
.starter-dialog button { position: relative; z-index: 2; }

@media (max-width: 800px) {
  .game-screen .side-panel,
  .game-screen .side-panel.is-social-profile,
  .game-screen .side-panel.is-pokedex-detail,
  .game-screen .side-panel.is-inventory-panel {
    top: max(58px, calc(env(safe-area-inset-top) + 54px));
    right: max(6px, env(safe-area-inset-right));
    bottom: calc(72px + env(safe-area-inset-bottom));
    left: max(6px, env(safe-area-inset-left));
    width: auto;
    height: auto;
    max-width: none;
    max-height: none;
    padding: 12px;
    border-radius: 20px;
    transform: translateY(calc(100% + 100px));
  }
  .game-screen .side-panel.is-open,
  .game-screen .side-panel.is-social-profile.is-open { transform: none; }
  .social-profile-hero-v2727 h2 {
    font-size: 19px;
  }
  .trade-dialog {
    padding: 8px;
  }
  .trade-dialog__content {
    width: 100%;
    max-height: calc(100dvh - 16px);
  }
  .professor-transfer-card-shell {
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 24px);
  }
  .inventory-modal-v2736 {
    padding: 8px;
  }
  .inventory-item-sheet-v2736 {
    width: 100%;
    max-height: 100%;
    min-height: 0;
    border-radius: 18px;
    padding: 14px;
  }
  .inventory-item-sheet-v2736 > header {
    grid-template-columns: 58px minmax(0,1fr) auto;
  }
  .inventory-item-sheet-v2736 > header > span {
    width: 58px;
    height: 58px;
  }
  .inventory-item-sheet-v2736 > header .item-icon {
    width: 46px;
    height: 46px;
  }
  .inventory-availability-v2736 {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .inventory-actions-v2736 {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .inventory-actions-v2736 label {
    grid-column: 1 / -1;
    grid-template-columns: 1fr 84px;
    align-items: center;
  }
  .inventory-actions-v2736 button,
  .inventory-actions-v2736 button.is-danger {
    min-height: 48px;
  }
  .inventory-lots-v2736 {
    max-height: 150px;
    overflow: auto;
  }
}

/* Coarse pointers keep touch affordances only; layout still follows viewport width. */
@media (pointer: coarse) {
  button, [role="button"], summary { touch-action: manipulation; }
}
@media (pointer:coarse) { .game-screen button { -webkit-tap-highlight-color: transparent; } }

/* v2.7.37 — unified adaptive window system */
:root {
  --game-window-radius: 22px;
  --game-window-shadow: 0 18px 48px rgba(14,48,70,.22);
  --game-window-pad: 16px;
  --game-window-gap: 10px;
}

.game-screen .side-panel,
.game-screen .chat-panel,
.game-screen .editor-panel,
.game-screen .battle-panel,
.trade-dialog__content,
.professor-transfer-card-shell {
  border-radius: var(--game-window-radius);
  box-shadow: var(--game-window-shadow);
}

.game-screen .side-panel {
  overflow: hidden;
}
.game-screen .side-panel > .panel-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 80;
  float: none;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  box-shadow: 0 6px 16px rgba(27,75,102,.10);
}
#sidePanelContent {
  min-width: 0;
  max-width: 100%;
}
.panel-title {
  margin: 3px 50px 6px 0;
  font-size: clamp(22px,2vw,28px);
  line-height: 1.04;
  letter-spacing: -.035em;
}
.panel-lead {
  display: -webkit-box;
  margin: 0 0 12px;
  overflow: hidden;
  font-size: 10px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.panel-eyebrow { font-size: 7px; letter-spacing: .1em; }
.panel-primary { min-height: 42px; border-radius: 13px; font-size: 9px; }

@media (min-width:801px) {
  .game-screen .side-panel {
    top: 86px;
    right: 18px;
    bottom: auto;
    left: auto;
    width: min(470px,calc(100vw - 130px));
    height: auto;
    max-height: min(74vh,700px);
    padding: var(--game-window-pad);
    overflow: hidden;
  }
  .game-screen .side-panel.is-open { transform: none; }
  #sidePanelContent {
    max-height: calc(min(74vh,700px) - 32px);
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: color-mix(in srgb,var(--theme-muted) 32%,transparent) transparent;
    padding-right: 2px;
  }
  #sidePanelContent::-webkit-scrollbar { width: 5px; }
  #sidePanelContent::-webkit-scrollbar-thumb { border-radius: 999px; background: color-mix(in srgb,var(--theme-muted) 28%,transparent); }
  .game-screen .side-panel.is-social-profile {
    left: 18px;
    right: auto;
    width: min(500px,calc(100vw - 130px));
    height: auto;
    max-height: min(76vh,700px);
  }
  .game-screen .side-panel.is-inventory-panel {
    width: min(790px,calc(100vw - 120px));
    height: auto;
    max-height: min(76vh,700px);
    padding: 16px;
  }
  .game-screen .side-panel.is-team-panel { width:min(520px,calc(100vw - 130px)); }
  .game-screen .side-panel.is-center-panel { width:min(620px,calc(100vw - 130px)); }
  .game-screen .side-panel.is-pokedex-detail { width:min(720px,calc(100vw - 110px)); }
}

/* A panel mode can never leak into the next panel. */
.game-screen .side-panel:not(.is-social-profile) .social-profile-shell { display:none; }
.game-screen .side-panel:not(.is-inventory-panel) .inventory-shell-v2735,
.game-screen .side-panel:not(.is-inventory-panel) .inventory-shell-v2736 { display:none; }

/* Modern compact profile */
.social-profile-shell-v2727 {
  display:grid;
  gap:9px;
  padding:0;
}
.social-profile-hero-v2727 {
  grid-template-columns:68px minmax(0,1fr);
  min-height:88px;
  padding:10px 52px 10px 10px;
  border-radius:18px;
}
.social-profile-trainer { width:64px; height:64px; border-radius:17px; }
.social-profile-hero-v2727 h2 {
  margin:2px 0 3px;
  font-size:22px;
}
.social-profile-hero-v2727 p { font-size:8px; }
.social-profile-tabs {
  position: static;
  grid-template-columns: repeat(auto-fit,minmax(80px,1fr));
  gap:6px;
  padding:0;
  background:none;
}
.social-profile-tabs button {
  min-height:38px;
  padding:0 7px;
  border-radius:12px;
}
.social-profile-tabs button span { font-size:13px; }
.social-profile-tabs button b { font-size:8px; }
.social-profile-tab-body { gap:8px; }
.player-profile-pvp-v2727 { gap:6px; }
.player-profile-pvp-v2727 article {
  min-height:56px;
  padding:8px 6px;
  border:1px solid var(--theme-border);
  background:var(--theme-card);
}
.player-profile-pvp-v2727 article small { font-size:6px; }
.player-profile-pvp-v2727 article b { margin:2px 0 0; font-size:17px; }
.player-profile-pvp-v2727 article em { display:block; color:var(--theme-muted); font-size:6px; font-style:normal; }
.social-profile-section {
  gap:7px;
  padding:10px;
  border-radius:15px;
}
.social-reward-grid { gap:6px; }
.social-reward { min-height:38px; padding:6px 8px; }
.social-reward i { font-size:15px; }
.social-reward b { font-size:7px; }
.social-party-list.is-compact { grid-template-columns:1fr 1fr; }
.social-party-summary-v2737 > p { margin:0; font-size:8px; color:var(--theme-muted); }
.referral-program-card-v2737 { gap:8px; }
.referral-program-card-v2737 .referral-reward-summary { min-height:58px; padding:8px; }
.referral-program-card-v2737 .referral-reward-summary p { margin:2px 0 0; font-size:7px; }
.referral-program-card-v2737 .referral-link-box { padding:9px; }
.referral-program-card-v2737 .referral-link-box code { font-size:7px; }
.referral-program-card-v2737 .referral-progress-list { max-height:190px; overflow:auto; }
.profile-debug-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.is-compact-debug .referral-debug-button { min-height:38px; margin:0; font-size:8px; }

/* Team: one glance, six slots, no overlapping strips. */
.team-window-v2737,
.center-window-v2737 { display:grid; gap:10px; min-width:0; }
.panel-section-head-v2737 {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-right:48px;
}
.panel-section-head-v2737 > span { display:flex; align-items:center; gap:10px; min-width:0; }
.panel-section-head-v2737 .panel-ui-icon { width:34px; height:34px; padding:7px; border-radius:12px; background:color-mix(in srgb,var(--theme-accent) 10%,var(--theme-card)); }
.panel-section-head-v2737 small { display:block; color:var(--theme-accent); font-size:6px; font-weight:950; letter-spacing:.1em; }
.panel-section-head-v2737 h2 { margin:2px 0 0; font-size:20px; line-height:1; }
.panel-section-head-v2737 > em { display:grid; place-items:center; min-width:40px; height:30px; padding:0 8px; border-radius:999px; background:color-mix(in srgb,var(--theme-accent) 10%,transparent); font-size:9px; font-style:normal; font-weight:950; }
.team-roster-v2737 { display:grid; gap:7px; }
.team-roster-card-v2737 {
  position:relative;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) auto;
  align-items:center;
  min-height:72px;
  border:1px solid var(--theme-border);
  border-radius:15px;
  background:var(--theme-card);
  overflow:hidden;
}
.team-roster-card-v2737.is-lead { border-color:color-mix(in srgb,var(--theme-accent) 65%,var(--theme-border)); box-shadow:inset 3px 0 var(--theme-accent); }
.team-roster-index-v2737 { display:grid; place-items:center; align-self:stretch; background:color-mix(in srgb,var(--theme-text) 4%,transparent); color:var(--theme-muted); font-size:9px; font-weight:950; }
.team-roster-main-v2737 {
  display:grid;
  grid-template-columns:64px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  min-width:0;
  padding:5px 8px;
  border:0!important;
  background:transparent!important;
  color:var(--theme-text)!important;
  text-align:left;
}
.team-roster-portrait-v2737 { width:60px; height:60px; }
.team-roster-copy-v2737 { display:grid; gap:4px; min-width:0; }
.team-roster-copy-v2737 > span { display:flex; align-items:center; gap:5px; }
.team-roster-copy-v2737 > span b { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.team-roster-copy-v2737 > span i { color:#f5b51d; font-size:10px; font-style:normal; }
.team-roster-copy-v2737 > em { display:flex; align-items:center; flex-wrap:wrap; gap:5px; color:var(--theme-muted); font-size:7px; font-style:normal; }
.team-roster-copy-v2737 .pokemon-type-badges { display:inline-flex; }
.team-roster-level-v2737 { height:5px; overflow:hidden; border-radius:99px; background:color-mix(in srgb,var(--theme-text) 7%,transparent); }
.team-roster-level-v2737 i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--theme-accent),#67c6f3); }
.team-roster-main-v2737 > strong { min-width:42px; color:var(--theme-accent); font-size:13px; text-align:right; }
.team-roster-main-v2737 > strong small { display:block; color:var(--theme-muted); font-size:6px; }
.team-roster-actions-v2737 { display:grid; gap:4px; align-content:center; padding:5px 6px 5px 0; }
.team-roster-actions-v2737 button,
.team-roster-actions-v2737 span { display:grid; place-items:center; min-width:56px; min-height:25px; padding:0 6px; border:1px solid var(--theme-border); border-radius:9px; background:var(--theme-surface-soft); color:var(--theme-muted); font-size:6px; font-weight:900; }
.team-roster-actions-v2737 span { color:var(--theme-accent); }
.team-roster-card-v2737.is-empty { grid-template-columns:32px 42px 1fr; min-height:54px; border-style:dashed; color:var(--theme-muted); }
.team-roster-card-v2737.is-empty > i { display:grid; place-items:center; width:32px; height:32px; border:1px dashed var(--theme-border); border-radius:50%; }
.team-roster-card-v2737.is-empty > div b { display:block; font-size:9px; }
.team-roster-card-v2737.is-empty > div small { font-size:7px; }
.team-summary-v2737 { display:grid; grid-template-columns:1fr 1fr 1.5fr; gap:7px; }
.team-summary-v2737 > span { display:grid; place-items:center; min-height:45px; border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-surface-soft); }
.team-summary-v2737 small { color:var(--theme-muted); font-size:6px; }
.team-summary-v2737 b { font-size:14px; }
.team-summary-v2737 .panel-primary { min-height:45px; }

/* Pokécenter is a compact storage list, not a wall of text. */
.center-list-v2737 { display:grid; grid-template-columns:1fr 1fr; gap:7px; max-height:min(58vh,520px); overflow:auto; padding-right:2px; }
.center-card-v2737 { grid-template-columns:62px minmax(0,1fr); gap:8px; padding:8px; min-width:0; }
.center-card-v2737 .center-portrait { width:58px; height:58px; }
.center-card-copy-v2737 { min-width:0; }
.center-card-copy-v2737 > span b { display:block; overflow:hidden; margin:2px 0; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.center-card-copy-v2737 > span small { font-size:6px; }
.center-card-copy-v2737 > em { display:flex; flex-wrap:wrap; gap:5px; align-items:center; color:var(--theme-muted); font-size:7px; font-style:normal; }
.center-actions-v2737 { grid-column:1/-1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.center-actions-v2737 button { min-height:30px; padding:0 6px; border-radius:9px; font-size:7px; }
.center-actions-v2737 .is-evolve { color:#7b52d6; border-color:rgba(128,85,218,.28); background:rgba(128,85,218,.07); }

/* Inventory: compact browser; modal never creates a second giant window. */
.game-screen .side-panel.is-inventory-panel #sidePanelContent { overflow:hidden; }
.inventory-shell-v2735,
.inventory-shell-v2736 { height:auto; min-height:0; }
.inventory-header-v2735 { grid-template-columns:minmax(200px,.8fr) minmax(340px,1.2fr); }
.inventory-header-v2735 h2 { margin-right:45px; font-size:24px; }
.inventory-tabs-v2735 { grid-template-columns:repeat(5,minmax(0,1fr)); }
.inventory-tabs-v2735 button { min-height:48px; padding:6px 8px; }
.inventory-tabs-v2735 button b { font-size:8px; }
.inventory-grid-v2735 { grid-template-columns:repeat(3,minmax(0,1fr)); max-height:min(48vh,420px); overflow:auto; }
.inventory-card-v2735 { min-height:82px; }
.inventory-modal-v2735,
.inventory-modal-v2736 { position:absolute; inset:0; padding:10px; }
.inventory-modal-scrim-v2735 { border-radius:20px; background:rgba(15,34,49,.22); backdrop-filter:blur(4px); }
.inventory-item-sheet-v2735,
.inventory-item-sheet-v2736 {
  width:min(480px,calc(100% - 14px));
  max-height:calc(100% - 14px);
  padding:14px;
  border-radius:20px;
}
.inventory-item-sheet-v2736 > header p { -webkit-line-clamp:1; }
.inventory-lots-v2736 { max-height:116px; }
.inventory-actions-v2736 { grid-template-columns:80px repeat(4,minmax(0,1fr)); }

/* Quest, settings and mechanics stay compact and use the same typography. */
.game-screen .side-panel.is-quest-panel,
.game-screen .side-panel.is-settings-panel,
.game-screen .side-panel.is-mechanics-panel { width:min(500px,calc(100vw - 130px)); }
.discovery-list,
.settings-grid,
.mechanics-grid { gap:7px; }
.quest-card,
.discovery-list article,
.audio-settings,
.binding-row,
.theme-settings { border-radius:14px; }

/* Dialogue and transfer windows are bounded, with one obvious close action. */
.dialogue-card { width:min(760px,calc(100vw - 48px)); max-height:min(72vh,560px); }
.professor-transfer-card-shell { width:min(540px,calc(100vw - 48px)); max-height:min(72vh,580px); }
.professor-transfer-list { max-height:min(42vh,330px); overflow:auto; }

/* Battle HUD follows the same compact card language. */
.game-screen .battle-panel {
  width:min(620px,calc(100vw - 36px));
  padding:12px;
  border-radius:20px;
}
.battle-status { gap:10px; }
.battle-status small { font-size:6px; letter-spacing:.08em; }
.battle-status b { font-size:16px; }
.battle-controls button { min-height:32px; border-radius:10px; font-size:7px; }
.battle-health { gap:7px; }
.battle-health article { padding:8px; border-radius:13px; }
.battle-skills { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.battle-skills button { min-height:54px; border-radius:13px; }
.capture-panel { border-radius:14px; }

/* Chat remains resizable on desktop, but uses the same compact controls. */
.chat-panel { border-radius:20px; }
.chat-head-actions button { width:34px; height:34px; border-radius:10px; }

@media (max-width:800px) {
  .game-screen .side-panel,
  .game-screen .side-panel.is-social-profile,
  .game-screen .side-panel.is-inventory-panel,
  .game-screen .side-panel.is-team-panel,
  .game-screen .side-panel.is-center-panel,
  .game-screen .side-panel.is-pokedex-detail,
  .game-screen .side-panel.is-quest-panel,
  .game-screen .side-panel.is-settings-panel,
  .game-screen .side-panel.is-mechanics-panel {
    top:max(54px,calc(env(safe-area-inset-top) + 50px));
    right:max(6px,env(safe-area-inset-right));
    bottom:calc(70px + env(safe-area-inset-bottom));
    left:max(6px,env(safe-area-inset-left));
    width:auto;
    height:auto;
    max-width:none;
    max-height:none;
    padding:12px;
    border-radius:20px;
    overflow:hidden;
  }
  #sidePanelContent {
    max-height:100%;
    overflow:auto;
    padding-right:0;
  }
  .game-screen .side-panel > .panel-close { top:10px; right:10px; width:40px; height:40px; }
  .panel-title { font-size:22px; margin-right:48px; }
  .panel-lead { font-size:9px; }
  .social-profile-hero-v2727 { grid-template-columns:58px minmax(0,1fr); min-height:76px; padding:9px 46px 9px 9px; }
  .social-profile-trainer { width:54px; height:54px; }
  .social-profile-hero-v2727 h2 { font-size:18px; }
  .social-profile-tabs { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .social-profile-tabs button { min-height:36px; gap:3px; padding:0 4px; }
  .social-profile-tabs button span { font-size:11px; }
  .social-profile-tabs button b { font-size:6.5px; }
  .player-profile-pvp-v2727 { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .player-profile-pvp-v2727 article { min-height:50px; }
  .player-profile-pvp-v2727 article b { font-size:15px; }
  .social-reward-grid { grid-template-columns:1fr 1fr; }
  .social-party-list.is-compact { grid-template-columns:1fr; }
  .team-roster-main-v2737 { grid-template-columns:54px minmax(0,1fr) auto; }
  .team-roster-portrait-v2737 { width:50px; height:50px; }
  .team-roster-actions-v2737 button,
  .team-roster-actions-v2737 span { min-width:48px; }
  .team-summary-v2737 { grid-template-columns:1fr 1fr; }
  .team-summary-v2737 .panel-primary { grid-column:1/-1; }
  .center-list-v2737 { grid-template-columns:1fr; max-height:none; overflow:visible; }
  .inventory-header-v2735 { grid-template-columns:1fr; }
  .inventory-header-tools-v2735 { grid-template-columns:1fr 42px; }
  .inventory-count-pills-v2734 { display:none; }
  .inventory-tabs-v2735 { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .inventory-tabs-v2735 button { min-height:46px; }
  .inventory-grid-v2735 { grid-template-columns:repeat(2,minmax(0,1fr)); max-height:none; overflow:visible; }
  .inventory-item-sheet-v2735,
  .inventory-item-sheet-v2736 { width:100%; max-height:100%; }
  .inventory-actions-v2736 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .inventory-actions-v2736 label { grid-column:1/-1; grid-template-columns:1fr 82px; }
  .game-screen .battle-panel {
    right:6px;
    bottom:calc(74px + env(safe-area-inset-bottom));
    left:6px;
    width:auto;
    max-height:54vh;
    overflow:auto;
  }
  .battle-skills { grid-template-columns:1fr 1fr; }
  .dialogue-card { width:calc(100vw - 12px); max-height:calc(100dvh - 90px); }
  .professor-transfer-card-shell { width:calc(100vw - 12px); max-height:calc(100dvh - 90px); }
}

/* v2.7.38 — Inventory rebuilt as a compact desktop window + independent item dialog */
.game-screen .side-panel.is-inventory-panel {
  top: 78px;
  right: 24px;
  bottom: auto;
  width: min(900px, calc(100vw - 116px));
  height: min(660px, calc(100vh - 118px));
  max-height: none;
  padding: 18px;
  overflow: hidden;
  border-radius: 24px;
}
.game-screen .side-panel.is-inventory-panel > .panel-close {
  top: 14px;
  right: 14px;
  z-index: 8;
  width: 42px;
  height: 42px;
  border-radius: 14px;
}
.inventory-v2738 {
  display: grid;
  grid-template-rows: auto auto minmax(0,1fr);
  gap: 12px;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  color: var(--theme-text);
}
.inventory-v2738__header {
  display: grid;
  grid-template-columns: minmax(200px,.7fr) minmax(420px,1.3fr);
  gap: 18px;
  align-items: center;
  padding-right: 50px;
}
.inventory-v2738__title {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}
.inventory-v2738__title > span {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  border: 1px solid var(--theme-border);
  border-radius: 15px;
  background: color-mix(in srgb,var(--theme-accent) 9%,var(--theme-card));
}
.inventory-v2738__title-icon { width: 28px; height: 28px; }
.inventory-v2738__title small {
  display: block;
  color: var(--theme-accent);
  font-size: 7px;
  font-weight: 950;
  letter-spacing: .11em;
}
.inventory-v2738__title h2 {
  margin: 2px 0 1px;
  color: var(--theme-text);
  font-size: 23px;
  line-height: 1;
}
.inventory-v2738__title p {
  margin: 0;
  color: var(--theme-muted);
  font-size: 8px;
}
.inventory-v2738__tools {
  display: grid;
  grid-template-columns: minmax(190px,1fr) 150px 72px;
  gap: 8px;
  min-width: 0;
}
.inventory-v2738__search,
.inventory-v2738__sort {
  display: flex;
  align-items: center;
  min-width: 0;
  height: 40px;
  border: 1px solid var(--theme-border);
  border-radius: 13px;
  background: var(--theme-input);
}
.inventory-v2738__search { gap: 7px; padding: 0 10px; }
.inventory-v2738__search .ui-icon { width: 16px; height: 16px; color: var(--theme-muted); }
.inventory-v2738__search input,
.inventory-v2738__sort select {
  min-width: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0 !important;
  outline: 0;
  background: transparent !important;
  color: var(--theme-text) !important;
  font-size: 9px;
  font-weight: 800;
}
.inventory-v2738__sort { position: relative; padding: 0 8px; }
.inventory-v2738__sort > span {
  position: absolute;
  top: 4px;
  left: 9px;
  color: var(--theme-muted);
  font-size: 5px;
  font-weight: 900;
  pointer-events: none;
}
.inventory-v2738__sort select { padding-top: 8px; }
.inventory-v2738__view {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--theme-border);
  border-radius: 13px;
  background: var(--theme-input);
}
.inventory-v2738__view button {
  display: grid;
  place-items: center;
  min-width: 0;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--theme-muted);
  cursor: pointer;
}
.inventory-v2738__view button.is-active {
  background: color-mix(in srgb,var(--theme-accent) 14%,var(--theme-card));
  color: var(--theme-accent);
}
.inventory-v2738__view .ui-icon { width: 15px; height: 15px; }
.inventory-v2738__summary {
  position: absolute;
  top: 18px;
  right: 72px;
  display: none;
}
.inventory-v2738__categories {
  display: grid;
  grid-template-columns: repeat(9,minmax(0,1fr));
  gap: 6px;
}
.inventory-v2738__categories button {
  display: grid;
  grid-template-columns: 26px minmax(0,1fr);
  align-items: center;
  gap: 7px;
  min-width: 0;
  min-height: 48px;
  padding: 7px 8px;
  border: 1px solid var(--theme-border);
  border-radius: 13px;
  background: var(--theme-card);
  color: var(--theme-muted);
  text-align: left;
  cursor: pointer;
  transition: border-color .15s,background .15s,transform .15s;
}
.inventory-v2738__categories button:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb,var(--theme-accent) 48%,var(--theme-border));
}
.inventory-v2738__categories button.is-active {
  border-color: var(--theme-accent);
  background: color-mix(in srgb,var(--theme-accent) 10%,var(--theme-card));
  color: var(--theme-text);
  box-shadow: inset 0 -2px color-mix(in srgb,var(--theme-accent) 60%,transparent);
}
.inventory-v2738__categories .inventory-category-icon { width: 25px; height: 25px; }
.inventory-v2738__categories button > span { display: grid; min-width: 0; gap: 1px; }
.inventory-v2738__categories b {
  overflow: hidden;
  font-size: 7px;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.inventory-v2738__categories small { color: var(--theme-muted); font-size: 7px; }
.inventory-v2738__content {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border-top: 1px solid color-mix(in srgb,var(--theme-border) 75%,transparent);
  padding-top: 12px;
}
.inventory-v2738__items {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  align-content: start;
  gap: 9px;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: auto;
  padding: 1px 3px 10px 1px;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb,var(--theme-muted) 42%,transparent) transparent;
}
.inventory-v2738.is-list .inventory-v2738__items { grid-template-columns: 1fr; }
.inventory-item-v2738 {
  position: relative;
  display: grid;
  grid-template-columns: 58px minmax(0,1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  min-height: 92px;
  padding: 10px 11px;
  border: 1px solid var(--theme-border);
  border-radius: 17px;
  background: var(--theme-card);
  color: var(--theme-text);
  text-align: left;
  cursor: pointer;
  box-shadow: 0 7px 17px rgba(5,31,45,.06);
  transition: transform .14s,border-color .14s,background .14s,box-shadow .14s;
}
.inventory-item-v2738:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb,var(--theme-accent) 50%,var(--theme-border));
  background: var(--theme-card-hover);
  box-shadow: 0 11px 24px rgba(5,31,45,.10);
}
.inventory-v2738.is-list .inventory-item-v2738 {
  grid-template-columns: 54px minmax(0,1fr) auto;
  min-height: 72px;
}
.inventory-item-v2738__art {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 16px;
  background: color-mix(in srgb,var(--theme-accent) 8%,var(--theme-surface-soft));
}
.inventory-item-v2738__art .item-icon { width: 48px; height: 48px; }
.inventory-item-v2738__copy { display: grid; gap: 4px; min-width: 0; }
.inventory-item-v2738__copy > b {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.inventory-item-v2738__copy > small { color: var(--theme-muted); font-size: 7px; }
.inventory-item-v2738__copy > i {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 19px;
  padding: 0 7px;
  border-radius: 999px;
  background: color-mix(in srgb,var(--theme-text) 5%,transparent);
  color: var(--theme-muted);
  font-size: 7px;
  font-style: normal;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.inventory-item-v2738__copy > i.is-tradable { background: rgba(53,169,221,.11); color: #3da5d6; }
.inventory-item-v2738__copy > i.is-protected { background: rgba(224,171,65,.11); color: #d3a33f; }
.inventory-item-v2738__copy > i.is-usable { background: rgba(75,190,126,.11); color: #43ad73; }
.inventory-item-v2738 > em {
  position: absolute;
  top: 8px;
  right: 8px;
  min-width: 29px;
  height: 24px;
  padding: 0 7px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: color-mix(in srgb,var(--theme-text) 7%,var(--theme-card));
  color: var(--theme-text);
  font-size: 9px;
  font-style: normal;
  font-weight: 950;
}
.inventory-v2738.is-list .inventory-item-v2738 > em { position: static; min-width: 48px; }
.inventory-v2738__empty {
  grid-column: 1/-1;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  min-height: 210px;
  border: 1px dashed var(--theme-border);
  border-radius: 18px;
  color: var(--theme-muted);
  background: color-mix(in srgb,var(--theme-card) 75%,transparent);
}
.inventory-v2738__empty .inventory-category-icon { width: 36px; height: 36px; opacity: .65; }
.inventory-v2738__empty b { color: var(--theme-text); font-size: 11px; }
.inventory-v2738__empty small { font-size: 8px; }

/* Independent item dialog: never participates in inventory panel layout. */
.inventory-item-dialog-v2738 {
  position: fixed;
  inset: 0;
  z-index: 190;
  display: none;
  place-items: center;
  padding: 22px;
  pointer-events: none;
}
.inventory-item-dialog-v2738.is-open { display: grid; pointer-events: auto; }
.inventory-item-dialog-v2738__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(4,18,27,.38);
  backdrop-filter: blur(5px);
}
.inventory-item-dialog-v2738__content {
  position: relative;
  z-index: 1;
  width: min(460px, calc(100vw - 36px));
  max-height: min(560px, calc(100vh - 80px));
}
.inventory-item-dialog-card-v2738 {
  position: relative;
  display: grid;
  gap: 12px;
  width: 100%;
  max-height: inherit;
  overflow: auto;
  padding: 18px;
  border: 1px solid var(--theme-border);
  border-radius: 23px;
  background: var(--theme-surface);
  color: var(--theme-text);
  box-shadow: 0 28px 80px rgba(0,0,0,.28);
}
.inventory-item-dialog-card-v2738__close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--theme-border);
  border-radius: 13px;
  background: var(--theme-surface-soft);
  color: var(--theme-text);
  font-size: 22px;
  cursor: pointer;
}
.inventory-item-dialog-card-v2738 > header {
  display: grid;
  grid-template-columns: 72px minmax(0,1fr) auto;
  gap: 12px;
  align-items: center;
  padding-right: 42px;
}
.inventory-item-dialog-card-v2738__art {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: 19px;
  background: color-mix(in srgb,var(--theme-accent) 9%,var(--theme-surface-soft));
}
.inventory-item-dialog-card-v2738__art .item-icon { width: 58px; height: 58px; }
.inventory-item-dialog-card-v2738 header small { color: var(--theme-accent); font-size: 7px; font-weight: 950; letter-spacing: .07em; }
.inventory-item-dialog-card-v2738 header h3 { margin: 2px 0 4px; font-size: 19px; line-height: 1.08; }
.inventory-item-dialog-card-v2738 header p { margin: 0; color: var(--theme-muted); font-size: 9px; line-height: 1.4; }
.inventory-item-dialog-card-v2738 header strong {
  align-self: start;
  min-width: 36px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: color-mix(in srgb,var(--theme-text) 7%,var(--theme-card));
  font-size: 9px;
}
.inventory-item-dialog-card-v2738__availability {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 6px;
}
.inventory-item-dialog-card-v2738__availability > span {
  display: grid;
  place-items: center;
  min-height: 58px;
  border: 1px solid var(--theme-border);
  border-radius: 13px;
  background: var(--theme-card);
}
.inventory-item-dialog-card-v2738__availability b { font-size: 15px; }
.inventory-item-dialog-card-v2738__availability small { color: var(--theme-muted); font-size: 6px; }
.inventory-item-dialog-card-v2738__availability .is-on { border-color: rgba(64,181,124,.38); background: rgba(64,181,124,.06); }
.inventory-item-dialog-card-v2738__availability .is-lock { border-color: rgba(222,171,64,.38); background: rgba(222,171,64,.06); }
.inventory-item-dialog-card-v2738__notice {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid rgba(222,171,64,.28);
  border-radius: 13px;
  background: rgba(222,171,64,.06);
}
.inventory-item-dialog-card-v2738__notice .ui-icon { width: 19px; height: 19px; }
.inventory-item-dialog-card-v2738__notice b { display: block; font-size: 8px; }
.inventory-item-dialog-card-v2738__notice small { color: var(--theme-muted); font-size: 7px; }
.inventory-item-dialog-card-v2738__lots {
  border: 1px solid var(--theme-border);
  border-radius: 13px;
  overflow: hidden;
}
.inventory-item-dialog-card-v2738__lots summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  padding: 0 10px;
  cursor: pointer;
  color: var(--theme-text);
  font-size: 8px;
  font-weight: 900;
  list-style: none;
}
.inventory-item-dialog-card-v2738__lots summary::-webkit-details-marker { display:none; }
.inventory-item-dialog-card-v2738__lots summary span {
  min-width: 21px;
  height: 21px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: color-mix(in srgb,var(--theme-accent) 10%,transparent);
}
.inventory-item-dialog-card-v2738__lots > div { display: grid; gap: 5px; padding: 0 7px 7px; }
.inventory-item-dialog-card-v2738__lots article {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 6px 8px;
  border-radius: 10px;
  background: var(--theme-surface-soft);
}
.inventory-item-dialog-card-v2738__lots article b { display:block; font-size:8px; }
.inventory-item-dialog-card-v2738__lots article small { color:var(--theme-muted); font-size:6px; }
.inventory-item-dialog-card-v2738__lots article em { font-size:8px; font-style:normal; font-weight:900; }
.inventory-item-dialog-card-v2738 > footer { display: grid; gap: 8px; }
.inventory-item-dialog-card-v2738 > footer > label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--theme-muted);
  font-size: 8px;
  font-weight: 900;
}
.inventory-item-dialog-card-v2738 > footer input {
  width: 84px;
  height: 34px;
  border: 1px solid var(--theme-border) !important;
  border-radius: 10px;
  background: var(--theme-input) !important;
  color: var(--theme-text) !important;
  text-align: center;
  font-weight: 900;
}
.inventory-item-dialog-card-v2738__actions {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 6px;
}
.inventory-item-dialog-card-v2738__actions button {
  display: grid;
  place-items: center;
  gap: 4px;
  min-width: 0;
  min-height: 48px;
  padding: 6px 4px;
  border: 1px solid var(--theme-border);
  border-radius: 12px;
  background: var(--theme-card);
  color: var(--theme-text);
  font-size: 7px;
  font-weight: 900;
  cursor: pointer;
}
.inventory-item-dialog-card-v2738__actions .ui-icon { width: 17px; height: 17px; }
.inventory-item-dialog-card-v2738__actions button.is-use { border-color: rgba(52,157,225,.36); background: rgba(52,157,225,.07); }
.inventory-item-dialog-card-v2738__actions button.is-trade { border-color: rgba(67,184,125,.36); background: rgba(67,184,125,.07); }
.inventory-item-dialog-card-v2738__actions button.is-sell { border-color: rgba(221,168,63,.36); background: rgba(221,168,63,.07); }
.inventory-item-dialog-card-v2738__actions button.is-danger { color:#df6666; border-color:rgba(223,102,102,.30); background:rgba(223,102,102,.06); }
.inventory-item-dialog-card-v2738__actions button:disabled { opacity:.32; cursor:not-allowed; }

html[data-game-theme="light"] .inventory-item-v2738 { box-shadow: 0 7px 18px rgba(45,93,121,.06); }
html[data-game-theme="light"] .inventory-item-dialog-v2738__backdrop { background: rgba(25,54,72,.24); }
html[data-game-theme="dark"] .inventory-item-v2738 { box-shadow: none; }
html[data-game-theme="dark"] .inventory-item-dialog-card-v2738 { box-shadow: 0 28px 80px rgba(0,0,0,.5); }

@media (max-width: 1050px) and (min-width: 761px) {
  .game-screen .side-panel.is-inventory-panel { width: min(820px,calc(100vw - 60px)); }
  .inventory-v2738__header { grid-template-columns: 1fr; gap: 10px; }
  .inventory-v2738__tools { grid-template-columns: minmax(180px,1fr) 150px 72px; }
  .inventory-v2738__categories { grid-template-columns: repeat(5,minmax(0,1fr)); }
  .inventory-v2738__items { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width:760px) {
  .game-screen .side-panel.is-inventory-panel {
    top: max(8px,env(safe-area-inset-top));
    right: 6px;
    bottom: calc(66px + env(safe-area-inset-bottom));
    left: 6px;
    width: auto;
    height: auto;
    max-height: none;
    padding: 12px;
    border-radius: 22px;
  }
  .game-screen .side-panel.is-inventory-panel > .panel-close {
    top: 10px;
    right: 10px;
    width: 40px;
    height: 40px;
  }
  .inventory-v2738 { gap: 9px; }
  .inventory-v2738__header { grid-template-columns: 1fr; gap: 9px; padding-right: 42px; }
  .inventory-v2738__title > span { width: 40px; height: 40px; border-radius: 13px; }
  .inventory-v2738__title-icon { width: 24px; height: 24px; }
  .inventory-v2738__title h2 { font-size: 20px; }
  .inventory-v2738__tools { grid-template-columns: minmax(0,1fr) 44px; gap: 7px; }
  .inventory-v2738__search { height: 40px; }
  .inventory-v2738__sort { grid-column: 1/2; height: 36px; }
  .inventory-v2738__view { grid-column: 2/3; grid-row: 1/3; }
  .inventory-v2738__categories {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
  }
  .inventory-v2738__categories::-webkit-scrollbar { display:none; }
  .inventory-v2738__categories button {
    flex: 0 0 72px;
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 3px;
    min-height: 54px;
    padding: 5px;
    text-align: center;
  }
  .inventory-v2738__categories .inventory-category-icon { width: 23px; height: 23px; }
  .inventory-v2738__categories b { max-width: 64px; font-size: 7px; }
  .inventory-v2738__categories small { font-size: 6px; }
  .inventory-v2738__content { padding-top: 8px; }
  .inventory-v2738__items { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
  .inventory-v2738.is-list .inventory-v2738__items { grid-template-columns: 1fr; }
  .inventory-item-v2738 { grid-template-columns: 48px minmax(0,1fr); min-height: 80px; padding: 8px; border-radius: 14px; }
  .inventory-item-v2738__art { width: 48px; height: 48px; border-radius: 13px; }
  .inventory-item-v2738__art .item-icon { width: 40px; height: 40px; }
  .inventory-item-v2738__copy > b { font-size: 9px; }
  .inventory-item-v2738__copy > small,.inventory-item-v2738__copy > i { font-size: 6px; }
  .inventory-item-dialog-v2738 { align-items: end; padding: 8px 8px calc(68px + env(safe-area-inset-bottom)); }
  .inventory-item-dialog-v2738__content { width:100%; max-height:min(74vh,590px); }
  .inventory-item-dialog-card-v2738 { max-height:inherit; padding:14px; border-radius:22px 22px 18px 18px; }
  .inventory-item-dialog-card-v2738 > header { grid-template-columns:62px minmax(0,1fr) auto; gap:9px; padding-right:38px; }
  .inventory-item-dialog-card-v2738__art { width:62px; height:62px; border-radius:16px; }
  .inventory-item-dialog-card-v2738__art .item-icon { width:50px; height:50px; }
  .inventory-item-dialog-card-v2738 header h3 { font-size:17px; }
  .inventory-item-dialog-card-v2738__availability { grid-template-columns:repeat(2,1fr); }
  .inventory-item-dialog-card-v2738__actions { grid-template-columns:repeat(2,1fr); }
  .inventory-item-dialog-card-v2738__actions button { min-height:46px; }
}
.inventory-v2738__categories b {
  overflow: visible;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 1.05;
  text-overflow: clip;
  white-space: normal;
}

/* v2.7.39 — game-ready compact inventory */
.game-screen .side-panel.is-inventory-panel {
  top: 82px;
  right: 22px;
  bottom: auto;
  width: min(780px, calc(100vw - 96px));
  height: min(590px, calc(100vh - 126px));
  max-height: none;
  padding: 16px;
  overflow: hidden;
  border-radius: 22px;
}
.game-screen .side-panel.is-inventory-panel.has-inventory-dialog > .panel-close { opacity: 0; pointer-events: none; }
.inventory-v2739 {
  display: grid;
  grid-template-rows: auto auto minmax(0,1fr);
  gap: 10px;
  width: 100%;
  height: 100%;
  min-height: 0;
}
.inventory-v2739__header {
  display: grid;
  grid-template-columns: minmax(190px,.7fr) minmax(380px,1.3fr);
  align-items: center;
  gap: 14px;
  padding-right: 48px;
}
.inventory-v2739__heading { display:flex; align-items:center; gap:10px; min-width:0; }
.inventory-v2739__heading > span {
  display:grid; place-items:center; flex:0 0 auto;
  width:44px; height:44px; border:1px solid var(--theme-border); border-radius:14px;
  background:color-mix(in srgb,var(--theme-accent) 9%,var(--theme-card));
}
.inventory-v2739__heading-icon { width:27px; height:27px; }
.inventory-v2739__heading small { display:block; color:var(--theme-accent); font-size:7px; font-weight:950; letter-spacing:.1em; }
.inventory-v2739__heading h2 { margin:2px 0 1px; font-size:22px; line-height:1; }
.inventory-v2739__heading p { margin:0; color:var(--theme-muted); font-size:8px; }
.inventory-v2739__toolbar { display:grid; grid-template-columns:minmax(150px,1fr) 145px 70px; gap:7px; min-width:0; }
.inventory-v2739__search,
.inventory-v2739__sort {
  display:flex; align-items:center; gap:7px; min-width:0; height:38px; padding:0 9px;
  border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-input);
}
.inventory-v2739__search .ui-icon,.inventory-v2739__sort .ui-icon { width:15px; height:15px; color:var(--theme-muted); flex:0 0 auto; }
.inventory-v2739__search input,.inventory-v2739__sort select {
  min-width:0; width:100%; height:100%; border:0 !important; outline:0; padding:0;
  background:transparent !important; color:var(--theme-text) !important; font-size:9px; font-weight:800;
}
.inventory-v2739__view { display:grid; grid-template-columns:1fr 1fr; gap:3px; padding:3px; border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-input); }
.inventory-v2739__view button { display:grid; place-items:center; border:0; border-radius:8px; background:transparent; color:var(--theme-muted); cursor:pointer; }
.inventory-v2739__view button.is-active { color:var(--theme-accent); background:color-mix(in srgb,var(--theme-accent) 14%,var(--theme-card)); }
.inventory-v2739__view .ui-icon { width:15px; height:15px; }
.inventory-v2739__meta { position:absolute; top:15px; right:69px; display:none; }
.inventory-v2739__categories { display:grid; grid-template-columns:repeat(9,minmax(0,1fr)); gap:5px; }
.inventory-v2739__categories button {
  position:relative; display:grid; justify-items:center; align-content:center; gap:2px; min-width:0; min-height:57px;
  padding:5px 3px; border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-card);
  color:var(--theme-muted); cursor:pointer; transition:transform .14s,border-color .14s,background .14s,color .14s;
}
.inventory-v2739__categories button:hover { transform:translateY(-1px); color:var(--theme-text); border-color:color-mix(in srgb,var(--theme-accent) 44%,var(--theme-border)); }
.inventory-v2739__categories button.is-active { color:var(--theme-accent); border-color:var(--theme-accent); background:color-mix(in srgb,var(--theme-accent) 10%,var(--theme-card)); }
.inventory-v2739__categories .inventory-category-icon { width:24px; height:24px; }
.inventory-v2739__categories button > span { width:100%; overflow:hidden; font-size:7px; font-weight:900; line-height:1.05; text-overflow:ellipsis; white-space:nowrap; text-align:center; }
.inventory-v2739__categories button > i { position:absolute; top:4px; right:5px; display:grid; place-items:center; min-width:17px; height:17px; padding:0 4px; border-radius:999px; background:color-mix(in srgb,var(--theme-text) 6%,var(--theme-card)); color:var(--theme-muted); font-size:6px; font-style:normal; font-weight:900; }
.inventory-v2739__content { min-height:0; padding-top:9px; border-top:1px solid color-mix(in srgb,var(--theme-border) 76%,transparent); overflow:hidden; }
.inventory-v2739__items { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-content:start; gap:8px; height:100%; overflow:auto; padding:1px 3px 8px 1px; scrollbar-width:thin; scrollbar-color:color-mix(in srgb,var(--theme-muted) 35%,transparent) transparent; }
.inventory-v2739.is-list .inventory-v2739__items { grid-template-columns:1fr; }
.inventory-item-v2739 {
  display:grid; grid-template-rows:58px auto auto; gap:6px; align-content:start; min-height:116px; padding:8px;
  border:1px solid var(--theme-border); border-radius:15px; background:var(--theme-card); color:var(--theme-text);
  text-align:left; cursor:pointer; box-shadow:0 5px 14px rgba(8,37,54,.05);
  transition:transform .14s,border-color .14s,box-shadow .14s,background .14s;
}
.inventory-item-v2739:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--theme-accent) 48%,var(--theme-border)); box-shadow:0 9px 20px rgba(8,37,54,.09); background:var(--theme-card-hover); }
.inventory-item-v2739:focus-visible { outline:2px solid var(--theme-accent); outline-offset:2px; }
.inventory-item-v2739__art { position:relative; display:grid; place-items:center; justify-self:center; width:58px; height:58px; border-radius:15px; background:color-mix(in srgb,var(--theme-accent) 7%,var(--theme-surface-soft)); }
.inventory-item-v2739__art .item-icon { width:48px; height:48px; }
.inventory-item-v2739__art > em { position:absolute; right:-6px; bottom:-4px; display:grid; place-items:center; min-width:27px; height:21px; padding:0 6px; border:2px solid var(--theme-card); border-radius:999px; background:var(--theme-text); color:var(--theme-surface); font-size:8px; font-style:normal; font-weight:950; }
.inventory-item-v2739__name { display:grid; gap:2px; min-width:0; text-align:center; }
.inventory-item-v2739__name b { overflow:hidden; font-size:9px; line-height:1.12; text-overflow:ellipsis; white-space:nowrap; }
.inventory-item-v2739__name small { color:var(--theme-muted); font-size:6px; }
.inventory-item-v2739__rights { display:flex; justify-content:center; gap:4px; min-height:20px; }
.inventory-item-v2739__rights i { display:flex; align-items:center; gap:3px; min-width:24px; height:20px; padding:0 5px; border-radius:999px; background:color-mix(in srgb,var(--theme-text) 5%,transparent); color:var(--theme-muted); font-style:normal; }
.inventory-item-v2739__rights .ui-icon { width:11px; height:11px; }
.inventory-item-v2739__rights b { font-size:7px; }
.inventory-item-v2739__rights i.is-locked { color:#c48e29; background:rgba(222,171,64,.10); }
.inventory-item-v2739__rights i.is-usable { color:#3eaa70; background:rgba(64,181,124,.10); }
.inventory-v2739.is-list .inventory-item-v2739 { grid-template-columns:48px minmax(0,1fr) auto; grid-template-rows:auto; min-height:66px; align-items:center; }
.inventory-v2739.is-list .inventory-item-v2739__art { width:48px; height:48px; }
.inventory-v2739.is-list .inventory-item-v2739__art .item-icon { width:40px; height:40px; }
.inventory-v2739.is-list .inventory-item-v2739__name { text-align:left; }
.inventory-v2739.is-list .inventory-item-v2739__rights { justify-content:flex-end; }
.inventory-v2739__empty { grid-column:1/-1; display:grid; place-items:center; align-content:center; gap:5px; min-height:180px; border:1px dashed var(--theme-border); border-radius:16px; color:var(--theme-muted); background:color-mix(in srgb,var(--theme-card) 75%,transparent); }
.inventory-v2739__empty .inventory-category-icon { width:34px; height:34px; opacity:.7; }
.inventory-v2739__empty b { font-size:10px; color:var(--theme-text); }
.inventory-v2739__empty small { font-size:7px; }

/* Independent item actions window */
.inventory-item-dialog-v2739 { animation:none; }
.inventory-item-dialog-v2739.is-open .inventory-item-dialog-v2738__backdrop { animation:inventoryBackdropIn .15s ease both; }
.inventory-item-dialog-v2739.is-open .inventory-item-dialog-v2738__content { animation:inventoryCardIn .18s cubic-bezier(.2,.8,.2,1) both; }
@keyframes inventoryBackdropIn { from { opacity:0 } to { opacity:1 } }
@keyframes inventoryCardIn { from { opacity:0; transform:translateY(8px) scale(.975) } to { opacity:1; transform:none } }
.inventory-item-dialog-v2739 .inventory-item-dialog-v2738__content { width:min(420px,calc(100vw - 32px)); max-height:none; }
.inventory-item-dialog-card-v2739 { gap:10px; max-height:none; overflow:visible; padding:16px; border-radius:21px; background:var(--theme-surface); }
.inventory-item-dialog-card-v2739__close { position:absolute; top:11px; right:11px; z-index:3; display:grid; place-items:center; width:37px; height:37px; border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-surface-soft); color:var(--theme-text); font-size:22px; cursor:pointer; }
.inventory-item-dialog-card-v2739__header { display:grid; grid-template-columns:68px minmax(0,1fr) auto; align-items:center; gap:11px; padding-right:38px; }
.inventory-item-dialog-card-v2739__art { display:grid; place-items:center; width:68px; height:68px; border-radius:18px; background:color-mix(in srgb,var(--theme-accent) 8%,var(--theme-surface-soft)); }
.inventory-item-dialog-card-v2739__art .item-icon { width:55px; height:55px; }
.inventory-item-dialog-card-v2739__header small { display:block; color:var(--theme-accent); font-size:7px; font-weight:950; }
.inventory-item-dialog-card-v2739__header h3 { margin:2px 0 4px; font-size:18px; line-height:1.05; }
.inventory-item-dialog-card-v2739__header p { margin:0; color:var(--theme-muted); font-size:8px; line-height:1.35; }
.inventory-item-dialog-card-v2739__header > strong { align-self:start; display:grid; place-items:center; min-width:34px; height:26px; border-radius:999px; background:color-mix(in srgb,var(--theme-text) 7%,var(--theme-card)); font-size:8px; }
.inventory-item-dialog-card-v2739__rights { display:grid; grid-template-columns:repeat(4,1fr); gap:5px; }
.inventory-item-dialog-card-v2739__rights > span { display:grid; grid-template-columns:14px auto; grid-template-rows:auto auto; align-items:center; justify-content:center; column-gap:4px; min-height:48px; padding:5px; border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-card); }
.inventory-item-dialog-card-v2739__rights .ui-icon { grid-row:1/3; width:13px; height:13px; color:var(--theme-muted); }
.inventory-item-dialog-card-v2739__rights b { font-size:12px; line-height:1; }
.inventory-item-dialog-card-v2739__rights small { color:var(--theme-muted); font-size:5.5px; white-space:nowrap; }
.inventory-item-dialog-card-v2739__rights > span.is-good { border-color:rgba(64,181,124,.32); background:rgba(64,181,124,.05); }
.inventory-item-dialog-card-v2739__rights > span.is-lock { border-color:rgba(222,171,64,.32); background:rgba(222,171,64,.05); }
.inventory-item-dialog-card-v2739__notice { display:grid; grid-template-columns:22px 1fr; gap:7px; align-items:center; padding:8px 9px; border:1px solid rgba(222,171,64,.25); border-radius:12px; background:rgba(222,171,64,.055); }
.inventory-item-dialog-card-v2739__notice .ui-icon { width:16px; height:16px; color:#c69232; }
.inventory-item-dialog-card-v2739__notice b { display:block; font-size:7px; }
.inventory-item-dialog-card-v2739__notice small { color:var(--theme-muted); font-size:6px; }
.inventory-item-dialog-card-v2739__quantity { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:38px; color:var(--theme-muted); font-size:7px; font-weight:900; }
.inventory-item-dialog-card-v2739__quantity > div { display:flex; align-items:center; gap:5px; }
.inventory-item-dialog-card-v2739__quantity button,.inventory-item-dialog-card-v2739__quantity input { height:34px; border:1px solid var(--theme-border) !important; border-radius:10px; background:var(--theme-input) !important; color:var(--theme-text) !important; text-align:center; font-size:10px; font-weight:900; }
.inventory-item-dialog-card-v2739__quantity button { min-width:34px; padding:0 9px; cursor:pointer; }
.inventory-item-dialog-card-v2739__quantity input { width:48px; }
.inventory-item-dialog-card-v2739__quantity button.is-max { min-width:52px; font-size:7px; }
.inventory-item-dialog-card-v2739__actions { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.inventory-item-dialog-card-v2739__actions button { display:grid; grid-template-columns:18px minmax(0,1fr) auto; align-items:center; gap:5px; min-width:0; min-height:42px; padding:0 9px; border:1px solid var(--theme-border); border-radius:11px; background:var(--theme-card); color:var(--theme-text); font-size:7px; font-weight:900; cursor:pointer; transition:transform .12s,background .12s,border-color .12s; }
.inventory-item-dialog-card-v2739__actions button:hover:not(:disabled) { transform:translateY(-1px); border-color:color-mix(in srgb,var(--theme-accent) 42%,var(--theme-border)); }
.inventory-item-dialog-card-v2739__actions button:active:not(:disabled) { transform:scale(.98); }
.inventory-item-dialog-card-v2739__actions .ui-icon { width:16px; height:16px; }
.inventory-item-dialog-card-v2739__actions button small { color:var(--theme-muted); font-size:6px; }
.inventory-item-dialog-card-v2739__actions button.is-primary { grid-column:1/-1; display:flex; justify-content:center; min-height:46px; color:#fff; border-color:var(--theme-accent); background:linear-gradient(180deg,color-mix(in srgb,var(--theme-accent) 92%,white),var(--theme-accent)); box-shadow:0 8px 18px color-mix(in srgb,var(--theme-accent) 22%,transparent); font-size:9px; }
.inventory-item-dialog-card-v2739__actions button.is-primary .ui-icon { color:#fff; }
.inventory-item-dialog-card-v2739__actions button.is-danger { color:#df5b5b; border-color:rgba(223,91,91,.28); background:rgba(223,91,91,.055); }
.inventory-item-dialog-card-v2739__actions button:disabled { opacity:.3; cursor:not-allowed; transform:none; }
.inventory-item-dialog-card-v2739__lots { border-top:1px solid var(--theme-border); }
.inventory-item-dialog-card-v2739__lots summary { display:flex; align-items:center; justify-content:space-between; min-height:34px; padding-top:5px; color:var(--theme-muted); font-size:7px; font-weight:900; cursor:pointer; list-style:none; }
.inventory-item-dialog-card-v2739__lots summary::-webkit-details-marker { display:none; }
.inventory-item-dialog-card-v2739__lots summary span { display:grid; place-items:center; min-width:18px; height:18px; border-radius:999px; background:color-mix(in srgb,var(--theme-accent) 9%,transparent); }
.inventory-item-dialog-card-v2739__lots > div { display:grid; gap:4px; max-height:108px; overflow:auto; padding-top:5px; }
.inventory-item-dialog-card-v2739__lots article { display:grid; grid-template-columns:1fr auto; align-items:center; gap:7px; min-height:36px; padding:5px 7px; border-radius:9px; background:var(--theme-surface-soft); }
.inventory-item-dialog-card-v2739__lots article b { display:block; font-size:7px; }
.inventory-item-dialog-card-v2739__lots article small { color:var(--theme-muted); font-size:5.5px; }
.inventory-item-dialog-card-v2739__lots article em { font-size:7px; font-style:normal; font-weight:900; }

html[data-game-theme="light"] .inventory-v2739__categories button,
html[data-game-theme="light"] .inventory-item-v2739 { box-shadow:0 4px 12px rgba(39,88,117,.045); }
html[data-game-theme="dark"] .inventory-v2739__categories button,
html[data-game-theme="dark"] .inventory-item-v2739 { box-shadow:none; }
html[data-game-theme="dark"] .inventory-item-v2739__art > em { background:#dcebf3; color:#0d2b3a; border-color:var(--theme-card); }

@media (max-width:1000px) and (min-width:761px) {
  .game-screen .side-panel.is-inventory-panel { width:min(720px,calc(100vw - 48px)); }
  .inventory-v2739__header { grid-template-columns:1fr; gap:8px; }
  .inventory-v2739__toolbar { grid-template-columns:minmax(160px,1fr) 140px 70px; }
  .inventory-v2739__items { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .inventory-v2739__categories { grid-template-columns:repeat(9,minmax(0,1fr)); }
}

@media (max-width:760px) {
  .game-screen .side-panel.is-inventory-panel {
    top:max(8px,env(safe-area-inset-top)); right:7px; left:7px; bottom:calc(66px + env(safe-area-inset-bottom));
    width:auto; height:auto; padding:10px; border-radius:20px;
  }
  .inventory-v2739 { gap:8px; }
  .inventory-v2739__header { grid-template-columns:1fr; gap:8px; padding-right:40px; }
  .inventory-v2739__heading > span { width:38px; height:38px; border-radius:12px; }
  .inventory-v2739__heading-icon { width:23px; height:23px; }
  .inventory-v2739__heading h2 { font-size:19px; }
  .inventory-v2739__heading p { font-size:7px; }
  .inventory-v2739__toolbar { grid-template-columns:minmax(0,1fr) 42px; grid-template-rows:38px 34px; gap:6px; }
  .inventory-v2739__search { grid-column:1/2; grid-row:1; height:38px; }
  .inventory-v2739__sort { grid-column:1/2; grid-row:2; height:34px; }
  .inventory-v2739__view { grid-column:2/3; grid-row:1/3; }
  .inventory-v2739__categories { display:flex; gap:5px; overflow:auto hidden; padding-bottom:2px; scrollbar-width:none; }
  .inventory-v2739__categories::-webkit-scrollbar { display:none; }
  .inventory-v2739__categories button { flex:0 0 61px; min-height:52px; padding:4px 2px; }
  .inventory-v2739__categories .inventory-category-icon { width:21px; height:21px; }
  .inventory-v2739__categories button > span { font-size:6px; }
  .inventory-v2739__categories button > i { top:3px; right:3px; min-width:15px; height:15px; font-size:5px; }
  .inventory-v2739__items { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
  .inventory-item-v2739 { grid-template-rows:50px auto auto; min-height:105px; padding:7px; border-radius:13px; }
  .inventory-item-v2739__art { width:50px; height:50px; border-radius:13px; }
  .inventory-item-v2739__art .item-icon { width:41px; height:41px; }
  .inventory-item-v2739__name b { font-size:8px; }
  .inventory-item-v2739__rights { gap:3px; }
  .inventory-item-v2739__rights i { min-width:21px; padding:0 4px; }
  .inventory-item-dialog-v2739 { align-items:end; padding:8px 8px calc(68px + env(safe-area-inset-bottom)); }
  .inventory-item-dialog-v2739 .inventory-item-dialog-v2738__content { width:100%; max-height:none; }
  .inventory-item-dialog-card-v2739 { gap:9px; width:100%; max-height:min(72vh,560px); overflow:auto; padding:14px; border-radius:20px 20px 16px 16px; }
  .inventory-item-dialog-card-v2739__header { grid-template-columns:58px minmax(0,1fr) auto; gap:8px; padding-right:36px; }
  .inventory-item-dialog-card-v2739__art { width:58px; height:58px; border-radius:15px; }
  .inventory-item-dialog-card-v2739__art .item-icon { width:47px; height:47px; }
  .inventory-item-dialog-card-v2739__header h3 { font-size:16px; }
  .inventory-item-dialog-card-v2739__rights { grid-template-columns:repeat(2,1fr); }
  .inventory-item-dialog-card-v2739__quantity { align-items:flex-start; flex-direction:column; gap:5px; }
  .inventory-item-dialog-card-v2739__quantity > div { width:100%; display:grid; grid-template-columns:36px 1fr 36px 52px; }
  .inventory-item-dialog-card-v2739__quantity input { width:100%; }
  .inventory-item-dialog-card-v2739__actions { grid-template-columns:repeat(2,1fr); }
  .inventory-item-dialog-card-v2739__actions button.is-primary { grid-column:1/-1; }
  .inventory-item-dialog-card-v2739__actions button.is-danger:last-child { grid-column:1/-1; }
}

/* v2.7.40 — finished inventory UI kit */
.inventory-ui-icon { width:18px; height:18px; color:currentColor; fill:none; flex:0 0 auto; }
.game-screen .side-panel.is-inventory-panel {
  top:82px;
  right:22px;
  bottom:auto;
  width:min(820px,calc(100vw - 96px));
  height:min(600px,calc(100vh - 126px));
  padding:16px;
  border-radius:24px;
  overflow:hidden;
}
.game-screen .side-panel.is-inventory-panel > .panel-close {
  top:15px;
  right:15px;
  width:42px;
  height:42px;
  border-radius:13px;
  z-index:4;
}
.inventory-v2740 {
  --inv-bg:var(--theme-surface);
  --inv-card:var(--theme-card);
  --inv-soft:var(--theme-surface-soft);
  --inv-line:var(--theme-border);
  --inv-text:var(--theme-text);
  --inv-muted:var(--theme-muted);
  --inv-blue:var(--theme-accent);
  display:grid;
  grid-template-rows:auto auto auto minmax(0,1fr);
  gap:9px;
  width:100%;
  height:100%;
  min-height:0;
  color:var(--inv-text);
}
.inventory-v2740__header {
  display:grid;
  grid-template-columns:minmax(180px,.78fr) auto minmax(320px,1.25fr);
  gap:10px;
  align-items:center;
  min-width:0;
  padding-right:50px;
}
.inventory-v2740__title { display:flex; align-items:center; gap:10px; min-width:0; }
.inventory-v2740__title > span { display:grid; place-items:center; width:42px; height:42px; border:1px solid var(--inv-line); border-radius:13px; background:color-mix(in srgb,var(--inv-blue) 8%,var(--inv-card)); color:var(--inv-blue); }
.inventory-v2740__title > span .inventory-ui-icon { width:25px; height:25px; }
.inventory-v2740__title small { display:block; color:var(--inv-muted); font-size:7px; font-weight:900; letter-spacing:.07em; }
.inventory-v2740__title h2 { margin:1px 0 0; font-size:21px; line-height:1; }
.inventory-v2740__wallet { display:flex; align-items:center; gap:5px; }
.inventory-v2740__wallet > span { display:flex; align-items:center; gap:5px; min-height:34px; padding:0 9px; border:1px solid var(--inv-line); border-radius:999px; background:var(--inv-card); color:var(--inv-text); }
.inventory-v2740__wallet .inventory-ui-icon { width:15px; height:15px; }
.inventory-v2740__wallet > span:first-child .inventory-ui-icon { color:#d69c1b; }
.inventory-v2740__wallet > span:last-child .inventory-ui-icon { color:#7762df; }
.inventory-v2740__wallet b { font-size:8px; white-space:nowrap; }
.inventory-v2740__tools { display:grid; grid-template-columns:minmax(130px,1fr) 135px 66px; gap:6px; min-width:0; }
.inventory-v2740__search,.inventory-v2740__sort { display:flex; align-items:center; gap:6px; height:36px; min-width:0; padding:0 9px; border:1px solid var(--inv-line); border-radius:11px; background:var(--theme-input); color:var(--inv-muted); }
.inventory-v2740__search .inventory-ui-icon,.inventory-v2740__sort .inventory-ui-icon { width:14px; height:14px; }
.inventory-v2740__search input,.inventory-v2740__sort select { width:100%; min-width:0; height:100%; padding:0 !important; border:0 !important; outline:0; appearance:none; background:transparent !important; color:var(--inv-text) !important; font-size:8px; font-weight:800; }
.inventory-v2740__sort > .inventory-ui-icon:last-child { width:12px; height:12px; margin-left:-18px; pointer-events:none; }
.inventory-v2740__view { display:grid; grid-template-columns:1fr 1fr; gap:3px; padding:3px; border:1px solid var(--inv-line); border-radius:11px; background:var(--theme-input); }
.inventory-v2740__view button { display:grid; place-items:center; padding:0; border:0; border-radius:7px; background:transparent; color:var(--inv-muted); cursor:pointer; }
.inventory-v2740__view button.is-active { color:var(--inv-blue); background:color-mix(in srgb,var(--inv-blue) 12%,var(--inv-card)); }
.inventory-v2740__view .inventory-ui-icon { width:14px; height:14px; }
.inventory-v2740__categories { display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:5px; min-width:0; }
.inventory-v2740__categories button { position:relative; display:grid; grid-template-rows:24px auto; justify-items:center; align-items:center; gap:2px; min-width:0; min-height:52px; padding:5px 2px 4px; border:1px solid var(--inv-line); border-radius:12px; background:var(--inv-card); color:var(--inv-muted); cursor:pointer; transition:transform .13s ease,border-color .13s ease,background .13s ease,color .13s ease; }
.inventory-v2740__categories button:hover { transform:translateY(-1px); color:var(--inv-text); border-color:color-mix(in srgb,var(--inv-blue) 45%,var(--inv-line)); }
.inventory-v2740__categories button.is-active { color:var(--inv-blue); border-color:color-mix(in srgb,var(--inv-blue) 72%,var(--inv-line)); background:color-mix(in srgb,var(--inv-blue) 9%,var(--inv-card)); }
.inventory-v2740__categories .inventory-category-icon,.inventory-v2740__categories .inventory-ui-icon { width:22px; height:22px; }
.inventory-v2740__categories button > span { max-width:100%; overflow:hidden; font-size:6.5px; line-height:1; font-weight:900; text-overflow:ellipsis; white-space:nowrap; }
.inventory-v2740__categories button > i { position:absolute; top:4px; right:4px; display:grid; place-items:center; min-width:16px; height:16px; padding:0 4px; border-radius:999px; background:color-mix(in srgb,var(--inv-text) 6%,var(--inv-card)); color:var(--inv-muted); font-size:5.5px; font-style:normal; font-weight:900; }
.inventory-v2740__categories button.is-favorite { color:#d39d26; }
.inventory-v2740__categories button.is-favorite.is-active { border-color:#e0b652; background:rgba(224,182,82,.09); color:#d39d26; }
.inventory-v2740__summary { display:flex; gap:6px; min-height:24px; }
.inventory-v2740__summary > span { display:flex; align-items:center; gap:4px; min-height:24px; padding:0 8px; border-radius:999px; background:color-mix(in srgb,var(--inv-text) 4%,transparent); color:var(--inv-muted); }
.inventory-v2740__summary .inventory-ui-icon { width:12px; height:12px; }
.inventory-v2740__summary b { color:var(--inv-text); font-size:7px; }
.inventory-v2740__summary small { font-size:6px; }
.inventory-v2740__content { min-height:0; overflow:hidden; border-top:1px solid color-mix(in srgb,var(--inv-line) 76%,transparent); padding-top:8px; }
.inventory-v2740__items { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); align-content:start; gap:7px; height:100%; min-height:0; overflow:auto; padding:1px 3px 6px 1px; scrollbar-width:none; }
.inventory-v2740__items::-webkit-scrollbar { width:0; height:0; }
.inventory-item-v2740 { display:grid; grid-template-rows:58px minmax(22px,auto) 20px; gap:5px; min-width:0; min-height:105px; padding:7px; border:1px solid var(--inv-line); border-radius:14px; background:var(--inv-card); color:var(--inv-text); cursor:pointer; box-shadow:0 4px 13px rgba(8,38,56,.05); transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease,background .14s ease; }
.inventory-item-v2740:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--inv-blue) 50%,var(--inv-line)); box-shadow:0 8px 18px rgba(8,38,56,.09); background:var(--theme-card-hover); }
.inventory-item-v2740:active { transform:scale(.985); }
.inventory-item-v2740:focus-visible { outline:2px solid var(--inv-blue); outline-offset:2px; }
.inventory-item-v2740__art { position:relative; display:grid; place-items:center; justify-self:center; width:58px; height:58px; border-radius:15px; background:color-mix(in srgb,var(--inv-blue) 6%,var(--inv-soft)); }
.inventory-item-v2740__art .item-icon { width:48px; height:48px; }
.inventory-item-v2740__art > em { position:absolute; right:-6px; bottom:-3px; display:grid; place-items:center; min-width:26px; height:20px; padding:0 6px; border:2px solid var(--inv-card); border-radius:999px; background:var(--inv-text); color:var(--inv-bg); font-size:7.5px; font-style:normal; font-weight:950; }
.inventory-item-v2740__favorite { position:absolute; left:-5px; top:-5px; display:grid; place-items:center; width:20px; height:20px; border:2px solid var(--inv-card); border-radius:999px; background:#fff4d7; color:#d79e1e; }
.inventory-item-v2740__favorite .inventory-ui-icon { width:12px; height:12px; }
.inventory-item-v2740__name { display:grid; place-items:start center; min-width:0; text-align:center; }
.inventory-item-v2740__name b { width:100%; overflow:hidden; font-size:8px; line-height:1.15; text-overflow:ellipsis; white-space:nowrap; }
.inventory-item-v2740__rights { display:flex; justify-content:center; align-items:center; gap:3px; min-height:20px; }
.inventory-item-v2740__rights i { display:flex; align-items:center; gap:2px; min-width:21px; height:19px; padding:0 4px; border-radius:999px; background:color-mix(in srgb,var(--inv-text) 5%,transparent); color:var(--inv-muted); font-style:normal; }
.inventory-item-v2740__rights .inventory-ui-icon { width:10px; height:10px; }
.inventory-item-v2740__rights b { font-size:6.5px; }
.inventory-item-v2740__rights .is-transfer { color:#2d8ebf; background:rgba(63,154,200,.09); }
.inventory-item-v2740__rights .is-trash { color:#788b98; }
.inventory-item-v2740__rights .is-lock { color:#c28b26; background:rgba(222,171,64,.10); }
.inventory-item-v2740__rights .is-use { color:#3caa72; background:rgba(64,181,124,.10); min-width:20px; justify-content:center; }
.inventory-v2740.is-list .inventory-v2740__items { grid-template-columns:1fr; }
.inventory-v2740.is-list .inventory-item-v2740 { grid-template-columns:48px minmax(0,1fr) auto; grid-template-rows:1fr; align-items:center; min-height:62px; }
.inventory-v2740.is-list .inventory-item-v2740__art { width:48px; height:48px; }
.inventory-v2740.is-list .inventory-item-v2740__art .item-icon { width:40px; height:40px; }
.inventory-v2740.is-list .inventory-item-v2740__name { justify-items:start; text-align:left; }
.inventory-v2740.is-list .inventory-item-v2740__rights { justify-content:flex-end; }
.inventory-v2740__empty { grid-column:1/-1; display:grid; place-items:center; align-content:center; gap:6px; min-height:180px; color:var(--inv-muted); }
.inventory-v2740__empty .inventory-ui-icon { width:34px; height:34px; opacity:.55; }
.inventory-v2740__empty b { font-size:10px; color:var(--inv-text); }
.inventory-v2740__empty small { font-size:7px; }

/* Item action card is a separate window, never a permanent inventory column. */
.inventory-item-dialog-v2739 .inventory-item-dialog-v2738__content { width:min(390px,calc(100vw - 32px)); max-height:none; }
.inventory-item-dialog-v2740 { position:relative; display:grid; gap:10px; padding:15px; border:1px solid var(--theme-border); border-radius:21px; background:var(--theme-surface); color:var(--theme-text); box-shadow:0 22px 56px rgba(0,0,0,.22); }
.inventory-item-dialog-v2740__close { position:absolute; top:11px; right:11px; display:grid; place-items:center; width:36px; height:36px; padding:0; border:1px solid var(--theme-border); border-radius:12px; background:var(--theme-card); color:var(--theme-text); cursor:pointer; }
.inventory-item-dialog-v2740__close .inventory-ui-icon { width:17px; height:17px; }
.inventory-item-dialog-v2740__header { display:grid; grid-template-columns:64px minmax(0,1fr) auto; gap:10px; align-items:center; padding-right:38px; }
.inventory-item-dialog-v2740__art { display:grid; place-items:center; width:64px; height:64px; border-radius:17px; background:color-mix(in srgb,var(--theme-accent) 7%,var(--theme-surface-soft)); }
.inventory-item-dialog-v2740__art .item-icon { width:52px; height:52px; }
.inventory-item-dialog-v2740__header small { display:block; color:var(--theme-accent); font-size:6.5px; font-weight:950; letter-spacing:.07em; }
.inventory-item-dialog-v2740__header h3 { margin:2px 0 4px; font-size:17px; line-height:1.05; }
.inventory-item-dialog-v2740__header p { margin:0; color:var(--theme-muted); font-size:8px; line-height:1.35; }
.inventory-item-dialog-v2740__header i { display:block; margin-top:4px; color:var(--theme-muted); font-size:6.5px; font-style:normal; font-weight:800; }
.inventory-item-dialog-v2740__header > strong { align-self:start; display:grid; place-items:center; min-width:32px; height:25px; padding:0 7px; border-radius:999px; background:color-mix(in srgb,var(--theme-text) 7%,var(--theme-card)); font-size:8px; }
.inventory-item-dialog-v2740__stock { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; }
.inventory-item-dialog-v2740__stock > span { display:grid; grid-template-columns:14px auto; grid-template-rows:auto auto; justify-content:center; align-items:center; column-gap:4px; min-height:46px; padding:5px; border:1px solid var(--theme-border); border-radius:11px; background:var(--theme-card); }
.inventory-item-dialog-v2740__stock .inventory-ui-icon { grid-row:1/3; width:13px; height:13px; }
.inventory-item-dialog-v2740__stock b { font-size:11px; line-height:1; }
.inventory-item-dialog-v2740__stock small { color:var(--theme-muted); font-size:5.5px; }
.inventory-item-dialog-v2740__stock .is-transfer { color:#2d8ebf; border-color:rgba(63,154,200,.25); background:rgba(63,154,200,.045); }
.inventory-item-dialog-v2740__stock .is-trash { color:#718692; }
.inventory-item-dialog-v2740__stock .is-lock { color:#c28b26; border-color:rgba(222,171,64,.27); background:rgba(222,171,64,.05); }
.inventory-item-dialog-v2740__notice { display:grid; grid-template-columns:20px 1fr; gap:7px; align-items:center; padding:8px 9px; border:1px solid rgba(222,171,64,.24); border-radius:11px; background:rgba(222,171,64,.05); color:#c28b26; }
.inventory-item-dialog-v2740__notice .inventory-ui-icon { width:15px; height:15px; }
.inventory-item-dialog-v2740__notice b { display:block; color:var(--theme-text); font-size:7px; }
.inventory-item-dialog-v2740__notice small { color:var(--theme-muted); font-size:6px; }
.inventory-item-dialog-v2740__quantity { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:36px; color:var(--theme-muted); font-size:7px; font-weight:900; }
.inventory-item-dialog-v2740__quantity > div { display:flex; gap:4px; align-items:center; }
.inventory-item-dialog-v2740__quantity button,.inventory-item-dialog-v2740__quantity input { height:33px; border:1px solid var(--theme-border) !important; border-radius:9px; background:var(--theme-input) !important; color:var(--theme-text) !important; text-align:center; font-size:9px; font-weight:900; }
.inventory-item-dialog-v2740__quantity button { display:grid; place-items:center; min-width:33px; padding:0 8px; cursor:pointer; }
.inventory-item-dialog-v2740__quantity button .inventory-ui-icon { width:13px; height:13px; }
.inventory-item-dialog-v2740__quantity input { width:48px; }
.inventory-item-dialog-v2740__quantity button.is-max { min-width:48px; font-size:6.5px; }
.inventory-item-dialog-v2740__actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.inventory-item-dialog-v2740__actions button { display:grid; grid-template-columns:18px minmax(0,1fr) auto; align-items:center; gap:5px; min-height:40px; padding:0 9px; border:1px solid var(--theme-border); border-radius:11px; background:var(--theme-card); color:var(--theme-text); font-size:7px; font-weight:900; cursor:pointer; transition:transform .12s ease,border-color .12s ease,background .12s ease; }
.inventory-item-dialog-v2740__actions button:hover { transform:translateY(-1px); border-color:color-mix(in srgb,var(--theme-accent) 40%,var(--theme-border)); }
.inventory-item-dialog-v2740__actions button:active { transform:scale(.98); }
.inventory-item-dialog-v2740__actions .inventory-ui-icon { width:15px; height:15px; }
.inventory-item-dialog-v2740__actions button small { color:var(--theme-muted); font-size:6px; }
.inventory-item-dialog-v2740__actions button.is-primary { grid-column:1/-1; display:flex; justify-content:center; min-height:45px; color:#fff; border-color:var(--theme-accent); background:linear-gradient(180deg,color-mix(in srgb,var(--theme-accent) 92%,white),var(--theme-accent)); box-shadow:0 7px 16px color-mix(in srgb,var(--theme-accent) 20%,transparent); font-size:8.5px; }
.inventory-item-dialog-v2740__actions button.is-primary .inventory-ui-icon { color:#fff; }
.inventory-item-dialog-v2740__actions button.is-danger { color:#d95b5b; border-color:rgba(217,91,91,.26); background:rgba(217,91,91,.045); }
.inventory-item-dialog-v2740__actions button.is-favorite { grid-column:1/-1; display:flex; justify-content:center; color:#a27b23; }
.inventory-item-dialog-v2740__actions button.is-favorite.is-active { color:#c18b13; border-color:rgba(222,171,64,.34); background:rgba(222,171,64,.075); }
.inventory-item-dialog-v2740__lots { border-top:1px solid var(--theme-border); }
.inventory-item-dialog-v2740__lots summary { display:grid; grid-template-columns:16px 1fr auto; align-items:center; gap:6px; min-height:32px; padding-top:5px; color:var(--theme-muted); font-size:7px; font-weight:900; cursor:pointer; list-style:none; }
.inventory-item-dialog-v2740__lots summary::-webkit-details-marker { display:none; }
.inventory-item-dialog-v2740__lots summary .inventory-ui-icon { width:13px; height:13px; }
.inventory-item-dialog-v2740__lots summary b { display:grid; place-items:center; min-width:18px; height:18px; border-radius:999px; background:color-mix(in srgb,var(--theme-accent) 9%,transparent); font-size:6px; }
.inventory-item-dialog-v2740__lots > div { display:grid; gap:4px; max-height:100px; overflow:auto; padding-top:5px; }
.inventory-item-dialog-v2740__lots article { display:grid; grid-template-columns:1fr auto; align-items:center; gap:7px; min-height:34px; padding:5px 7px; border-radius:9px; background:var(--theme-surface-soft); }
.inventory-item-dialog-v2740__lots article b { display:block; font-size:6.5px; }
.inventory-item-dialog-v2740__lots article small { color:var(--theme-muted); font-size:5.5px; }
.inventory-item-dialog-v2740__lots article em { font-size:7px; font-style:normal; font-weight:900; }

html[data-game-theme="light"] .inventory-v2740 {
  --inv-bg:#f8fbfd; --inv-card:#ffffff; --inv-soft:#f2f7fa; --inv-line:#d6e3eb; --inv-text:#163b55; --inv-muted:#6b8395; --inv-blue:#178fd2;
}
html[data-game-theme="light"] .game-screen .side-panel.is-inventory-panel { background:rgba(248,252,254,.975); box-shadow:0 18px 60px rgba(18,57,82,.18); }
html[data-game-theme="dark"] .inventory-v2740 {
  --inv-bg:#092532; --inv-card:#103543; --inv-soft:#0d2e3b; --inv-line:#2b5665; --inv-text:#eef7fa; --inv-muted:#8fa9b4; --inv-blue:#4bb7ed;
}
html[data-game-theme="dark"] .game-screen .side-panel.is-inventory-panel { background:rgba(8,35,47,.98); box-shadow:0 18px 60px rgba(0,0,0,.32); }
html[data-game-theme="dark"] .inventory-item-v2740 { box-shadow:none; }
html[data-game-theme="dark"] .inventory-item-v2740__art > em { color:#0b2a38; background:#e7f2f6; }
html[data-game-theme="dark"] .inventory-item-v2740__favorite { background:#4c401c; color:#ffd66a; }

@media (max-width:1000px) and (min-width:761px) {
  .game-screen .side-panel.is-inventory-panel { width:min(740px,calc(100vw - 48px)); }
  .inventory-v2740__header { grid-template-columns:minmax(180px,1fr) auto; }
  .inventory-v2740__tools { grid-column:1/-1; }
  .inventory-v2740__items { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .inventory-v2740__categories { grid-template-columns:repeat(5,minmax(0,1fr)); }
}

@media (max-width:760px) {
  .game-screen .side-panel.is-inventory-panel {
    top:max(8px,env(safe-area-inset-top));
    right:7px;
    left:7px;
    bottom:calc(66px + env(safe-area-inset-bottom));
    width:auto;
    height:auto;
    padding:10px;
    border-radius:20px;
  }
  .game-screen .side-panel.is-inventory-panel > .panel-close { top:9px; right:9px; width:38px; height:38px; border-radius:12px; }
  .inventory-v2740 { gap:7px; }
  .inventory-v2740__header { grid-template-columns:minmax(0,1fr) auto; gap:7px; padding-right:41px; }
  .inventory-v2740__title > span { width:37px; height:37px; border-radius:11px; }
  .inventory-v2740__title > span .inventory-ui-icon { width:22px; height:22px; }
  .inventory-v2740__title h2 { font-size:18px; }
  .inventory-v2740__title small { font-size:6px; }
  .inventory-v2740__wallet { justify-self:end; }
  .inventory-v2740__wallet > span { min-height:30px; padding:0 7px; }
  .inventory-v2740__wallet b { font-size:7px; }
  .inventory-v2740__tools { grid-column:1/-1; grid-template-columns:minmax(0,1fr) 108px 58px; }
  .inventory-v2740__search,.inventory-v2740__sort { height:34px; }
  .inventory-v2740__categories { display:flex; gap:5px; overflow:auto hidden; padding-bottom:1px; scrollbar-width:none; }
  .inventory-v2740__categories::-webkit-scrollbar { display:none; }
  .inventory-v2740__categories button { flex:0 0 58px; min-height:49px; padding:4px 2px; }
  .inventory-v2740__categories .inventory-category-icon,.inventory-v2740__categories .inventory-ui-icon { width:20px; height:20px; }
  .inventory-v2740__categories button > span { font-size:5.7px; }
  .inventory-v2740__categories button > i { top:3px; right:3px; min-width:14px; height:14px; font-size:5px; }
  .inventory-v2740__summary { display:none; }
  .inventory-v2740__items { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .inventory-item-v2740 { grid-template-rows:48px minmax(20px,auto) 18px; min-height:95px; padding:6px; border-radius:12px; }
  .inventory-item-v2740__art { width:48px; height:48px; border-radius:12px; }
  .inventory-item-v2740__art .item-icon { width:40px; height:40px; }
  .inventory-item-v2740__art > em { right:-5px; bottom:-3px; min-width:23px; height:18px; font-size:6.5px; }
  .inventory-item-v2740__name b { font-size:7px; }
  .inventory-item-v2740__rights i { min-width:18px; height:17px; padding:0 3px; }
  .inventory-item-v2740__rights .inventory-ui-icon { width:9px; height:9px; }
  .inventory-item-v2740__rights b { font-size:5.5px; }
  .inventory-item-dialog-v2739 { align-items:end; padding:8px 8px calc(68px + env(safe-area-inset-bottom)); }
  .inventory-item-dialog-v2739 .inventory-item-dialog-v2738__content { width:100%; max-height:none; }
  .inventory-item-dialog-v2740 { width:100%; max-height:min(66vh,520px); overflow:auto; border-radius:20px 20px 15px 15px; padding:13px; }
  .inventory-item-dialog-v2740__header { grid-template-columns:56px minmax(0,1fr) auto; gap:8px; padding-right:35px; }
  .inventory-item-dialog-v2740__art { width:56px; height:56px; border-radius:14px; }
  .inventory-item-dialog-v2740__art .item-icon { width:45px; height:45px; }
  .inventory-item-dialog-v2740__header h3 { font-size:15px; }
  .inventory-item-dialog-v2740__header p { font-size:7px; }
  .inventory-item-dialog-v2740__stock > span { min-height:42px; }
  .inventory-item-dialog-v2740__quantity { flex-direction:column; align-items:stretch; gap:5px; }
  .inventory-item-dialog-v2740__quantity > div { display:grid; grid-template-columns:34px 1fr 34px 48px; }
  .inventory-item-dialog-v2740__quantity input { width:100%; }
  .inventory-item-dialog-v2740__actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .inventory-item-dialog-v2740__actions button { min-height:42px; }
  .inventory-item-dialog-v2740__actions button.is-primary,.inventory-item-dialog-v2740__actions button.is-favorite { grid-column:1/-1; }
}

@media (max-width:430px) {
  .inventory-v2740__wallet > span:first-child { display:none; }
  .inventory-v2740__tools { grid-template-columns:minmax(0,1fr) 56px; }
  .inventory-v2740__sort { grid-column:1/-1; grid-row:2; }
  .inventory-v2740__view { grid-column:2; grid-row:1; }
  .inventory-v2740__items { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* v2.7.41 — modern game-ready inventory visual pass */
.inventory-v2741 {
  --inv-blue:#2f80ed;
  --inv-green:#2aa876;
  --inv-gold:#d6a128;
  --inv-red:#e65555;
  --inv-purple:#795fe7;
  font-family:"Segoe UI Variable",Inter,"Segoe UI",system-ui,sans-serif;
  gap:8px;
}
.game-screen .side-panel.is-inventory-panel {
  width:min(800px,calc(100vw - 92px));
  height:min(570px,calc(100vh - 122px));
  padding:15px;
  border-radius:22px;
  border:1px solid color-mix(in srgb,var(--theme-border) 84%,transparent);
}
.game-screen .side-panel.is-inventory-panel > .panel-close {
  top:14px; right:14px; width:40px; height:40px;
  border-radius:12px;
  border:1px solid var(--theme-border);
  background:var(--theme-card);
  color:var(--theme-text);
  box-shadow:0 5px 14px rgba(12,38,56,.08);
}
.game-screen .side-panel.is-inventory-panel > .panel-close:hover {
  background:color-mix(in srgb,var(--theme-accent) 7%,var(--theme-card));
  border-color:color-mix(in srgb,var(--theme-accent) 35%,var(--theme-border));
}
.inventory-v2741 .inventory-v2740__header {
  grid-template-columns:minmax(180px,1fr) auto;
  grid-template-rows:auto auto;
  column-gap:10px;
  row-gap:8px;
  padding-right:46px;
}
.inventory-v2741 .inventory-v2740__title > span {
  width:40px; height:40px;
  border-radius:12px;
  color:var(--inv-blue);
  background:color-mix(in srgb,var(--inv-blue) 8%,var(--inv-card));
}
.inventory-v2741 .inventory-v2740__title > span .inventory-ui-icon { width:23px; height:23px; }
.inventory-v2741 .inventory-v2740__title small {
  color:var(--inv-muted);
  font-size:8px;
  font-weight:700;
  letter-spacing:.035em;
  text-transform:none;
}
.inventory-v2741 .inventory-v2740__title h2 {
  margin:2px 0 0;
  font-size:23px;
  font-weight:760;
  letter-spacing:-.025em;
}
.inventory-v2741__wallet {
  justify-self:end;
  gap:7px;
}
.inventory-v2741__wallet > span {
  display:grid;
  grid-template-columns:18px auto 25px;
  align-items:center;
  gap:6px;
  min-width:98px;
  height:35px;
  padding:0 4px 0 9px;
  border-radius:12px;
  background:var(--inv-card);
  border:1px solid var(--inv-line);
  box-shadow:0 3px 10px rgba(18,59,84,.045);
}
.inventory-v2741__wallet > span > .inventory-ui-icon { width:17px; height:17px; }
.inventory-v2741__wallet > span.is-coins > .inventory-ui-icon { color:#d8a31f; }
.inventory-v2741__wallet > span.is-gems > .inventory-ui-icon { color:#5aa6f5; }
.inventory-v2741__wallet b {
  font-size:10px;
  font-weight:780;
  letter-spacing:.01em;
}
.inventory-v2741__wallet button {
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  padding:0;
  border:0;
  border-radius:8px;
  background:color-mix(in srgb,var(--inv-blue) 10%,var(--inv-soft));
  color:var(--inv-blue);
  cursor:pointer;
  transition:transform .12s ease,background .12s ease,color .12s ease;
}
.inventory-v2741__wallet button .inventory-ui-icon { width:13px; height:13px; }
.inventory-v2741__wallet button:hover { background:var(--inv-blue); color:#fff; transform:translateY(-1px); }
.inventory-v2741__wallet button:active { transform:scale(.94); }
.inventory-v2741 .inventory-v2740__tools {
  grid-column:1/-1;
  display:grid;
  grid-template-columns:minmax(180px,1fr) 145px 68px;
  gap:7px;
}
.inventory-v2741__search,
.inventory-v2741__sort {
  height:37px;
  border-radius:11px;
  border-color:color-mix(in srgb,var(--inv-line) 94%,transparent);
  background:var(--inv-soft);
}
.inventory-v2741__search:focus-within,
.inventory-v2741__sort:focus-within {
  border-color:color-mix(in srgb,var(--inv-blue) 65%,var(--inv-line));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--inv-blue) 9%,transparent);
}
.inventory-v2741__search input,
.inventory-v2741__sort select {
  font-size:9px !important;
  font-weight:650 !important;
}
.inventory-v2741__view {
  height:37px;
  border-radius:11px;
  background:var(--inv-soft);
}
.inventory-v2741__view button { transition:background .12s ease,color .12s ease,transform .12s ease; }
.inventory-v2741__view button:hover { color:var(--inv-text); }
.inventory-v2741__view button:active { transform:scale(.94); }
.inventory-v2741__view button.is-active {
  background:var(--inv-card);
  color:var(--inv-blue);
  box-shadow:0 2px 7px rgba(28,78,108,.08);
}
.inventory-v2741__categories {
  grid-template-columns:repeat(10,minmax(0,1fr));
  gap:5px;
}
.inventory-v2741__categories button {
  min-height:49px;
  grid-template-rows:21px auto;
  padding:5px 2px 4px;
  border-radius:11px;
  border-color:color-mix(in srgb,var(--inv-line) 92%,transparent);
  background:transparent;
  color:var(--inv-muted);
  box-shadow:none;
}
.inventory-v2741__categories button:hover {
  transform:none;
  background:var(--inv-soft);
  border-color:color-mix(in srgb,var(--inv-blue) 24%,var(--inv-line));
}
.inventory-v2741__categories button.is-active {
  color:var(--inv-blue);
  border-color:color-mix(in srgb,var(--inv-blue) 54%,var(--inv-line));
  background:color-mix(in srgb,var(--inv-blue) 7%,var(--inv-card));
  box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--inv-blue) 70%,transparent);
}
.inventory-v2741__categories .inventory-category-icon,
.inventory-v2741__categories .inventory-ui-icon { width:20px; height:20px; }
.inventory-v2741__categories button > span {
  font-size:7px;
  line-height:1.05;
  font-weight:700;
  letter-spacing:-.01em;
}
.inventory-v2741__categories button > i {
  top:3px; right:3px;
  min-width:15px; height:15px;
  padding:0 4px;
  background:var(--inv-soft);
  color:var(--inv-muted);
  font-size:5.5px;
}
.inventory-v2741__categories button.is-active > i {
  background:color-mix(in srgb,var(--inv-blue) 13%,var(--inv-card));
  color:var(--inv-blue);
}
.inventory-v2741__summary {
  min-height:22px;
  gap:5px;
}
.inventory-v2741__summary > span {
  min-height:22px;
  padding:0 8px;
  border:1px solid color-mix(in srgb,var(--inv-line) 68%,transparent);
  background:transparent;
  border-radius:8px;
}
.inventory-v2741__summary b { font-size:7.5px; }
.inventory-v2741__summary small { font-size:6.5px; font-weight:600; }
.inventory-v2741__summary > span:first-child { color:#288dbb; }
.inventory-v2741__summary > span:last-child { color:#b9872d; }
.inventory-v2741__content {
  padding-top:7px;
  border-top-color:color-mix(in srgb,var(--inv-line) 68%,transparent);
}
.inventory-v2741__items {
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
  padding:1px 2px 7px 1px;
}
.inventory-item-v2741 {
  position:relative;
  grid-template-rows:60px minmax(24px,auto) 19px;
  min-height:109px;
  gap:4px;
  padding:7px;
  border-radius:13px;
  border:1px solid var(--inv-line);
  background:var(--inv-card);
  box-shadow:none;
  overflow:hidden;
}
.inventory-item-v2741::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:2px;
  background:transparent;
  opacity:.85;
}
.inventory-item-v2741.rarity-uncommon::before { background:#48ac75; }
.inventory-item-v2741.rarity-rare::before { background:#4b91e6; }
.inventory-item-v2741.rarity-epic::before { background:#8a61df; }
.inventory-item-v2741.rarity-legendary::before { background:#dfaa34; }
.inventory-item-v2741:hover {
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--inv-blue) 42%,var(--inv-line));
  background:color-mix(in srgb,var(--inv-blue) 2.5%,var(--inv-card));
  box-shadow:0 6px 16px rgba(17,57,80,.065);
}
.inventory-item-v2741:active { transform:scale(.98); }
.inventory-item-v2741__art {
  width:60px; height:60px;
  border-radius:14px;
  background:var(--inv-soft);
}
.inventory-item-v2741.category-balls .inventory-item-v2741__art { background:color-mix(in srgb,#e85e5e 7%,var(--inv-soft)); }
.inventory-item-v2741.category-consumables .inventory-item-v2741__art { background:color-mix(in srgb,#4daf72 7%,var(--inv-soft)); }
.inventory-item-v2741.category-candy .inventory-item-v2741__art { background:color-mix(in srgb,#7f67dd 7%,var(--inv-soft)); }
.inventory-item-v2741.category-evolution .inventory-item-v2741__art { background:color-mix(in srgb,#4a99df 7%,var(--inv-soft)); }
.inventory-item-v2741.category-tools .inventory-item-v2741__art { background:color-mix(in srgb,#d69236 7%,var(--inv-soft)); }
.inventory-item-v2741__art .item-icon { width:49px; height:49px; }
.inventory-item-v2741__art > em {
  right:-4px; bottom:-2px;
  min-width:25px; height:19px;
  padding:0 5px;
  border-width:2px;
  font-size:7.5px;
  font-weight:800;
  letter-spacing:0;
}
.inventory-item-v2741__name b {
  font-size:8.5px;
  line-height:1.15;
  font-weight:720;
}
.inventory-item-v2741__rights { gap:3px; }
.inventory-item-v2741__rights i {
  min-width:20px;
  height:18px;
  padding:0 4px;
  border-radius:6px;
  background:transparent;
  border:1px solid color-mix(in srgb,var(--inv-line) 75%,transparent);
}
.inventory-item-v2741__rights .inventory-ui-icon { width:9px; height:9px; }
.inventory-item-v2741__rights b { font-size:6.5px; font-weight:760; }
.inventory-item-v2741__rights .is-transfer { color:#298bb8; border-color:rgba(43,144,188,.20); background:rgba(43,144,188,.04); }
.inventory-item-v2741__rights .is-trash { color:#6f8492; }
.inventory-item-v2741__rights .is-lock { color:#ad7d22; border-color:rgba(191,140,41,.20); background:rgba(191,140,41,.04); }
.inventory-item-v2741__rights .is-use { color:#268d61; border-color:rgba(38,141,97,.20); background:rgba(38,141,97,.04); }
.inventory-v2741.is-list .inventory-item-v2741 {
  grid-template-columns:48px minmax(0,1fr) auto;
  min-height:60px;
  padding:6px 8px;
}
.inventory-v2741.is-list .inventory-item-v2741__art { width:48px; height:48px; }
.inventory-v2741.is-list .inventory-item-v2741__art .item-icon { width:39px; height:39px; }
.inventory-v2741.is-list .inventory-item-v2741__name b { font-size:9px; }

/* item action window */
.inventory-item-dialog-v2741 {
  --action-blue:#2f80ed;
  --action-green:#2ca879;
  --action-gold:#d99c2d;
  --action-red:#e45656;
  gap:9px;
  padding:15px;
  border-radius:20px;
  border:1px solid var(--theme-border);
  box-shadow:0 18px 46px rgba(5,28,43,.24);
  font-family:"Segoe UI Variable",Inter,"Segoe UI",system-ui,sans-serif;
}
.inventory-item-dialog-v2741__header {
  grid-template-columns:66px minmax(0,1fr) auto;
  gap:11px;
}
.inventory-item-dialog-v2741__header h3 {
  margin:2px 0 3px;
  font-size:18px;
  font-weight:760;
  letter-spacing:-.02em;
}
.inventory-item-dialog-v2741__header p {
  font-size:8.5px;
  line-height:1.4;
  font-weight:500;
}
.inventory-item-dialog-v2741__header small { font-size:7px; font-weight:750; letter-spacing:.045em; }
.inventory-item-dialog-v2741__stock {
  grid-template-columns:repeat(3,1fr);
  gap:6px;
}
.inventory-item-dialog-v2741__stock > span {
  min-height:48px;
  border-radius:10px;
  background:var(--theme-card);
}
.inventory-item-dialog-v2741__stock b { font-size:12px; font-weight:780; }
.inventory-item-dialog-v2741__stock small { font-size:6.2px; font-weight:650; }
.inventory-item-dialog-v2741__actions {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}
.inventory-item-dialog-v2741__actions button {
  min-height:42px;
  border-radius:10px;
  font-size:8px;
  font-weight:720;
  box-shadow:none;
}
.inventory-item-dialog-v2741__actions button:hover:not(:disabled) { transform:translateY(-1px); }
.inventory-item-dialog-v2741__actions button.is-primary {
  grid-column:1/-1;
  min-height:46px;
  border-color:var(--action-blue);
  background:linear-gradient(180deg,#3e8df2,var(--action-blue));
  color:#fff;
  box-shadow:0 7px 15px rgba(47,128,237,.20);
  font-size:9px;
}
.inventory-item-dialog-v2741__actions button.is-transfer {
  color:#23875f;
  border-color:rgba(44,168,121,.30);
  background:rgba(44,168,121,.065);
}
.inventory-item-dialog-v2741__actions button.is-sell {
  color:#a56c10;
  border-color:rgba(217,156,45,.30);
  background:rgba(217,156,45,.07);
}
.inventory-item-dialog-v2741__actions button.is-danger {
  color:#ce4545;
  border-color:rgba(228,86,86,.30);
  background:rgba(228,86,86,.06);
}
.inventory-item-dialog-v2741__actions button.is-favorite {
  grid-column:1/-1;
  color:#94701e;
  border-color:rgba(201,157,54,.22);
  background:rgba(201,157,54,.045);
}
.inventory-item-dialog-v2741__actions button small {
  justify-self:end;
  min-width:20px;
  padding:2px 5px;
  border-radius:999px;
  background:color-mix(in srgb,currentColor 7%,transparent);
  color:currentColor;
  font-size:6.5px;
  font-weight:800;
}

/* light theme */
html[data-game-theme="light"] .inventory-v2741 {
  --inv-bg:#f7fafc;
  --inv-card:#ffffff;
  --inv-soft:#f2f6f9;
  --inv-line:#d9e3ea;
  --inv-text:#17354d;
  --inv-muted:#6e8495;
  --inv-blue:#2f80ed;
}
html[data-game-theme="light"] .game-screen .side-panel.is-inventory-panel {
  background:rgba(248,251,253,.985);
  box-shadow:0 18px 50px rgba(22,61,86,.16);
}
html[data-game-theme="light"] .inventory-item-dialog-v2741 {
  background:#fbfdfe;
}

/* dark theme */
html[data-game-theme="dark"] .inventory-v2741 {
  --inv-bg:#0a2733;
  --inv-card:#10333f;
  --inv-soft:#0c2d39;
  --inv-line:#2c5260;
  --inv-text:#f0f7fa;
  --inv-muted:#94aab4;
  --inv-blue:#55b8ef;
}
html[data-game-theme="dark"] .game-screen .side-panel.is-inventory-panel {
  background:rgba(8,35,46,.985);
  border-color:#294d5b;
  box-shadow:0 20px 54px rgba(0,0,0,.35);
}
html[data-game-theme="dark"] .inventory-v2741__wallet > span,
html[data-game-theme="dark"] .inventory-item-v2741 {
  box-shadow:none;
}
html[data-game-theme="dark"] .inventory-item-v2741:hover {
  background:#123a47;
  box-shadow:none;
}
html[data-game-theme="dark"] .inventory-v2741__wallet button {
  background:#143e4c;
}
html[data-game-theme="dark"] .inventory-v2741__wallet button:hover {
  background:var(--inv-blue);
  color:#082432;
}
html[data-game-theme="dark"] .inventory-item-dialog-v2741 {
  background:#0d303c;
  border-color:#315866;
}
html[data-game-theme="dark"] .inventory-item-dialog-v2741__actions button.is-transfer { color:#68d2a9; }
html[data-game-theme="dark"] .inventory-item-dialog-v2741__actions button.is-sell { color:#efbd60; }
html[data-game-theme="dark"] .inventory-item-dialog-v2741__actions button.is-danger { color:#ff8585; }

@media (max-width:1000px) and (min-width:761px) {
  .game-screen .side-panel.is-inventory-panel { width:min(740px,calc(100vw - 44px)); }
  .inventory-v2741__items { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .inventory-v2741__categories { grid-template-columns:repeat(5,minmax(0,1fr)); }
}

@media (max-width:760px) {
  .game-screen .side-panel.is-inventory-panel {
    top:max(8px,env(safe-area-inset-top));
    right:7px;
    left:7px;
    bottom:calc(66px + env(safe-area-inset-bottom));
    width:auto;
    height:auto;
    padding:10px;
    border-radius:19px;
  }
  .inventory-v2741 .inventory-v2740__header {
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto;
    gap:7px;
    padding-right:39px;
  }
  .inventory-v2741 .inventory-v2740__title > span { width:36px; height:36px; }
  .inventory-v2741 .inventory-v2740__title h2 { font-size:19px; }
  .inventory-v2741 .inventory-v2740__title small { font-size:6.5px; }
  .inventory-v2741__wallet { gap:5px; }
  .inventory-v2741__wallet > span {
    min-width:73px;
    height:31px;
    grid-template-columns:14px auto 21px;
    gap:4px;
    padding-left:6px;
  }
  .inventory-v2741__wallet > span > .inventory-ui-icon { width:14px; height:14px; }
  .inventory-v2741__wallet b { font-size:7.5px; }
  .inventory-v2741__wallet button { width:21px; height:21px; border-radius:7px; }
  .inventory-v2741 .inventory-v2740__tools {
    grid-column:1/-1;
    grid-template-columns:minmax(0,1fr) 56px;
    grid-template-rows:35px 34px;
    gap:5px;
  }
  .inventory-v2741__search { grid-column:1; grid-row:1; height:35px; }
  .inventory-v2741__view { grid-column:2; grid-row:1; height:35px; }
  .inventory-v2741__sort { grid-column:1/-1; grid-row:2; height:34px; }
  .inventory-v2741__categories {
    display:flex;
    overflow:auto hidden;
    gap:5px;
    padding-bottom:1px;
    scrollbar-width:none;
  }
  .inventory-v2741__categories::-webkit-scrollbar { display:none; }
  .inventory-v2741__categories button {
    flex:0 0 58px;
    min-height:48px;
  }
  .inventory-v2741__categories button > span { font-size:6px; }
  .inventory-v2741__summary { display:none; }
  .inventory-v2741__items {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
  }
  .inventory-item-v2741 {
    grid-template-rows:49px minmax(22px,auto) 18px;
    min-height:96px;
    padding:6px;
    border-radius:12px;
  }
  .inventory-item-v2741__art { width:49px; height:49px; border-radius:12px; }
  .inventory-item-v2741__art .item-icon { width:40px; height:40px; }
  .inventory-item-v2741__name b { font-size:7.5px; }
  .inventory-item-v2741__rights i { min-width:18px; height:17px; padding:0 3px; }
  .inventory-item-v2741__rights .inventory-ui-icon { width:8px; height:8px; }
  .inventory-item-v2741__rights b { font-size:5.8px; }
  .inventory-item-dialog-v2741 {
    width:100%;
    gap:8px;
    padding:13px;
    border-radius:19px 19px 14px 14px;
  }
  .inventory-item-dialog-v2741__header {
    grid-template-columns:56px minmax(0,1fr) auto;
    gap:8px;
  }
  .inventory-item-dialog-v2741__header h3 { font-size:16px; }
  .inventory-item-dialog-v2741__header p { font-size:7.5px; }
  .inventory-item-dialog-v2741__actions button { min-height:43px; }
}

@media (max-width:430px) {
  .inventory-v2741__wallet > span.is-coins { display:none; }
  .inventory-v2741__items { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .inventory-item-v2741 {
    grid-template-rows:53px minmax(23px,auto) 18px;
    min-height:101px;
  }
  .inventory-item-v2741__art { width:53px; height:53px; }
}
.inventory-v2741__wallet button .inventory-ui-icon { color:currentColor !important; }

/* v15 combat loadout: an inventory item is assigned to one of six explicit
   battle slots. The picker stays inside the existing item action dialog. */
.inventory-item-dialog-v2741 {
  max-height:min(84dvh,720px);
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
.inventory-item-dialog-v2741__actions button.is-battle-equip > svg {
  width:18px;height:18px;color:currentColor;
}
.inventory-item-dialog-v2741__actions button.is-battle-equip small {
  min-width:auto;padding:2px 6px;text-transform:none;
}
.inventory-battle-loadout[hidden] { display:none!important; }
.inventory-battle-loadout {
  display:grid;
  gap:8px;
  padding:10px;
  border:1px solid color-mix(in srgb,var(--theme-accent) 24%,var(--theme-border));
  border-radius:13px;
  background:color-mix(in srgb,var(--theme-card) 90%,var(--theme-accent) 10%);
  animation:inventory-loadout-open .16s ease-out both;
}
@keyframes inventory-loadout-open {
  from { opacity:0;transform:translateY(-4px); }
  to { opacity:1;transform:none; }
}
.inventory-battle-loadout > header {
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.inventory-battle-loadout > header > span {
  display:flex;align-items:center;gap:6px;color:var(--theme-text);
}
.inventory-battle-loadout > header svg { width:17px;height:17px;color:var(--theme-accent); }
.inventory-battle-loadout > header b { font-size:9px;font-weight:800; }
.inventory-battle-loadout > header small { color:var(--theme-muted);font-size:6.5px;font-weight:650;text-align:right; }
.inventory-battle-loadout > nav {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;
}
.inventory-battle-loadout > nav > button {
  position:relative;
  min-width:0;
  min-height:76px;
  padding:7px 5px 6px;
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  grid-template-rows:18px 17px;
  align-content:center;
  align-items:center;
  gap:1px 6px;
  border:1px solid var(--theme-border);
  border-radius:10px;
  background:var(--theme-card);
  color:var(--theme-text);
  box-shadow:none;
  text-align:left;
  transition:border-color .13s ease,background .13s ease,transform .13s ease;
}
.inventory-battle-loadout > nav > button:hover:not(:disabled),
.inventory-battle-loadout > nav > button:focus-visible {
  border-color:color-mix(in srgb,var(--theme-accent) 62%,var(--theme-border));
  background:color-mix(in srgb,var(--theme-card) 94%,var(--theme-accent) 6%);
  transform:translateY(-1px);
}
.inventory-battle-loadout > nav > button.is-current {
  border-color:var(--theme-accent);
  background:color-mix(in srgb,var(--theme-card) 88%,var(--theme-accent) 12%);
  box-shadow:inset 3px 0 var(--theme-accent);
}
.inventory-battle-loadout > nav > button > kbd {
  position:absolute;left:5px;top:5px;min-width:17px;height:17px;padding:0 3px;
  display:grid;place-items:center;border:1px solid var(--theme-border);border-radius:5px;
  background:var(--inv-soft,var(--theme-card));color:var(--theme-muted);font-family:inherit;font-size:7px;font-weight:800;line-height:1;
}
.inventory-battle-loadout > nav > button > span {
  grid-column:1;grid-row:1/3;width:30px;height:30px;display:grid;place-items:center;
  overflow:hidden;border:1px solid var(--theme-border);border-radius:9px;background:var(--inv-soft,var(--theme-card));
}
.inventory-battle-loadout .inventory-battle-slot-art,
.inventory-battle-loadout .inventory-battle-slot-art > *,
.inventory-battle-loadout .inventory-battle-slot-empty { width:25px;height:25px;object-fit:contain; }
.inventory-battle-loadout .inventory-battle-slot-empty { color:var(--theme-muted); }
.inventory-battle-loadout > nav > button > b {
  grid-column:2;grid-row:1;min-width:0;overflow:hidden;color:var(--theme-text);font-size:7.5px;font-weight:780;text-overflow:ellipsis;white-space:nowrap;
}
.inventory-battle-loadout > nav > button > small {
  grid-column:2;grid-row:2;color:var(--theme-muted);font-size:6.2px;font-weight:680;
}
.inventory-battle-loadout > nav > button.is-current > small { color:var(--theme-accent);font-weight:800; }
.inventory-battle-loadout > footer { display:flex;flex-wrap:wrap;gap:5px; }
.inventory-battle-loadout > footer > button {
  min-height:27px;padding:0 9px;border:1px solid color-mix(in srgb,#e45656 28%,var(--theme-border));border-radius:8px;
  background:color-mix(in srgb,var(--theme-card) 96%,#e45656 4%);color:#d24b4b;font-size:6.7px;font-weight:750;
}
html[data-game-theme="dark"] .inventory-battle-loadout > footer > button { color:#ff8585; }
@media (max-width:560px) {
  .inventory-battle-loadout > header { align-items:flex-start; }
  .inventory-battle-loadout > header small { max-width:46%; }
  .inventory-battle-loadout > nav { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* v2.7.42 — compact rectangular minimap with top/bottom status bars */
.world-minimap {
  --minimap-shell-bg: rgba(247,252,255,.97);
  --minimap-top-bg: rgba(7,35,48,.96);
  --minimap-top-text: #f6fbff;
  --minimap-bottom-bg: rgba(248,252,255,.98);
  --minimap-bottom-text: #193b50;
  --minimap-line: rgba(131,177,201,.46);
  position: absolute;
  z-index: 16;
  top: max(14px, env(safe-area-inset-top));
  right: max(14px, env(safe-area-inset-right));
  display: grid;
  grid-template-rows: 30px 126px 34px;
  width: 248px;
  height: 190px;
  padding: 0;
  overflow: hidden;
  border: 2px solid rgba(255,255,255,.92);
  border-radius: 20px;
  background: var(--minimap-shell-bg);
  box-shadow: 0 18px 42px rgba(0,25,41,.28), inset 0 0 0 1px rgba(12,114,173,.12);
  color: var(--minimap-bottom-text);
}
html[data-game-theme="dark"] .world-minimap {
  --minimap-shell-bg: rgba(5,30,42,.98);
  --minimap-top-bg: rgba(5,28,39,.98);
  --minimap-top-text: #f5fbff;
  --minimap-bottom-bg: rgba(6,37,50,.98);
  --minimap-bottom-text: #e8f7ff;
  --minimap-line: rgba(92,163,198,.34);
  border-color: rgba(126,197,230,.38);
}
.world-minimap.is-offline { opacity: .88; }
.world-minimap-topbar,
.world-minimap-bottombar {
  position: relative;
  z-index: 12;
  display: flex;
  align-items: center;
}
.world-minimap-topbar {
  justify-content: space-between;
  gap: 8px;
  padding: 0 11px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: var(--minimap-top-bg);
  color: var(--minimap-top-text);
}
.world-minimap-place {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
}
.world-minimap-place b {
  max-width: 154px;
  overflow: hidden;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .01em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.world-minimap-online-dot {
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #51d687;
  box-shadow: 0 0 0 3px rgba(81,214,135,.12);
}
.world-minimap.is-offline .world-minimap-online-dot { background:#8fa3ae; box-shadow:none; }
.world-minimap-topbar time {
  flex: 0 0 auto;
  font-size: 9px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}
.world-minimap-map-button {
  position: relative;
  display: block;
  width: 100%;
  height: 126px;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #16384a;
  box-shadow: none;
  color: inherit;
  cursor: pointer;
}
.world-minimap-map-button:hover { transform:none; filter:brightness(1.035); }
.world-minimap-map-button:active { transform:none; filter:brightness(.97); }
.world-minimap-frame {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg,#31586c,#102838);
  box-shadow: none;
  pointer-events: none;
}
.world-minimap-frame::after {
  content:'';
  position:absolute;
  z-index:2;
  inset:0;
  border-radius:0;
  background: linear-gradient(180deg,rgba(1,23,34,.05),transparent 22%,transparent 72%,rgba(1,22,33,.12));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
  pointer-events:none;
}
.world-minimap-preview {
  position:absolute;
  z-index:1;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  filter:saturate(1.08) contrast(1.025) brightness(1.01);
  transition:opacity .18s ease, filter .18s ease;
}
.world-minimap-map-button:hover .world-minimap-preview { filter:saturate(1.12) contrast(1.035) brightness(1.035); }
.world-minimap-grid,
.world-minimap-revision { display:none !important; }
.world-minimap-north {
  position:absolute;
  z-index:5;
  top:7px;
  left:50%;
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  transform:translateX(-50%);
  border:1px solid rgba(255,255,255,.72);
  border-radius:50%;
  background:rgba(7,31,43,.72);
  color:#fff;
  font-size:9px;
  font-style:normal;
  font-weight:1000;
  text-shadow:0 1px 3px rgba(0,0,0,.65);
  box-shadow:0 3px 8px rgba(0,0,0,.18);
}
.world-minimap-player {
  position:absolute;
  z-index:10;
  width:28px;
  height:34px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  transform:translate(-50%,-50%) rotate(var(--minimap-heading,0deg));
  transform-origin:50% 50%;
  transition:left .09s linear, top .09s linear, transform .14s ease-out;
  pointer-events:none;
}
.world-minimap-player svg {
  display:block;
  width:28px;
  height:34px;
  overflow:visible;
  filter:drop-shadow(0 3px 4px rgba(0,35,60,.48));
}
.world-minimap-player path {
  fill:#1b9df0;
  stroke:#fff;
  stroke-width:3;
  stroke-linejoin:round;
  paint-order:stroke fill;
}
.world-minimap-friend-markers,
.world-minimap-party-markers { border-radius:0; }
.world-minimap-bottombar {
  gap: 8px;
  padding: 0 7px 0 10px;
  border-top: 1px solid var(--minimap-line);
  background: var(--minimap-bottom-bg);
  color: var(--minimap-bottom-text);
}
.world-minimap-channel {
  display:flex;
  min-width:0;
  align-items:center;
  gap:4px;
  white-space:nowrap;
}
.world-minimap-channel > i {
  display:grid;
  place-items:center;
  width:16px;
  height:16px;
  border-radius:50%;
  background:color-mix(in srgb,#2d9fe8 12%,transparent);
  color:#258bc7;
  font-size:7px;
  font-style:normal;
}
.world-minimap-channel small { color:color-mix(in srgb,var(--minimap-bottom-text) 62%,transparent); font-size:6px; font-weight:800; }
.world-minimap-channel b { max-width:44px; overflow:hidden; font-size:8px; font-weight:950; text-overflow:ellipsis; }
.world-minimap-ping {
  display:flex;
  flex:0 0 auto;
  align-items:center;
  gap:5px;
  min-width:58px;
  padding-left:7px;
  border-left:1px solid var(--minimap-line);
}
.world-minimap-ping b { font-size:8px; font-weight:950; font-variant-numeric:tabular-nums; }
.world-minimap-ping-bars {
  display:flex;
  height:13px;
  align-items:flex-end;
  gap:1px;
}
.world-minimap-ping-bars span { width:2px; border-radius:2px; background:currentColor; opacity:.92; }
.world-minimap-ping-bars span:nth-child(1){height:4px}.world-minimap-ping-bars span:nth-child(2){height:7px}.world-minimap-ping-bars span:nth-child(3){height:10px}.world-minimap-ping-bars span:nth-child(4){height:13px}
.world-minimap-ping.is-good { color:#28a75f; }
.world-minimap-ping.is-medium { color:#d89423; }
.world-minimap-ping.is-bad { color:#e25555; }
.world-minimap-ping.is-unknown { color:#879aa6; }
.world-minimap-open {
  margin-left:auto;
  display:flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-width:62px;
  height:25px;
  padding:0 9px;
  border:1px solid #1685cf;
  border-radius:9px;
  background:linear-gradient(180deg,#2da7f2,#167fd1);
  color:#fff;
  box-shadow:0 4px 9px rgba(20,126,203,.22), inset 0 1px 0 rgba(255,255,255,.25);
}
.world-minimap-open:hover { transform:translateY(-1px); filter:brightness(1.04); }
.world-minimap-open:active { transform:translateY(0) scale(.98); }
.world-minimap-open span { display:grid; place-items:center; width:14px; height:14px; }
.world-minimap-open .ui-icon { width:13px; height:13px; }
.world-minimap-open b { font-size:8px; font-weight:950; }
html[data-game-theme="dark"] .world-minimap-open {
  border-color:#2a9bd8;
  background:linear-gradient(180deg,#1688ca,#0a669f);
}

@media (max-width:1180px) and (min-width:761px) {
  .world-minimap { width:220px; height:171px; grid-template-rows:28px 113px 30px; }
  .world-minimap-map-button { height:113px; }
  .world-minimap-place b { max-width:132px; }
  .world-minimap-bottombar { gap:6px; padding-left:8px; }
  .world-minimap-open { min-width:56px; height:23px; padding:0 7px; }
}

@media (max-width:760px) {
  .world-minimap {
    top:max(8px,env(safe-area-inset-top));
    right:max(8px,env(safe-area-inset-right));
    grid-template-rows:23px 82px 27px;
    width:158px;
    height:132px;
    border-width:1.5px;
    border-radius:15px;
    box-shadow:0 10px 24px rgba(0,24,38,.25);
  }
  .world-minimap-topbar { padding:0 7px; }
  .world-minimap-place { gap:4px; }
  .world-minimap-online-dot { width:5px; height:5px; box-shadow:none; }
  .world-minimap-place b { max-width:95px; font-size:7px; }
  .world-minimap-topbar time { font-size:7px; }
  .world-minimap-map-button { height:82px; }
  .world-minimap-north { top:4px; width:16px; height:16px; font-size:7px; }
  .world-minimap-player { width:20px; height:24px; }
  .world-minimap-player svg { width:20px; height:24px; }
  .world-minimap-player path { stroke-width:3.2; }
  .world-minimap-bottombar { gap:4px; padding:0 4px 0 6px; }
  .world-minimap-channel { gap:3px; }
  .world-minimap-channel > i { width:13px; height:13px; font-size:5px; }
  .world-minimap-channel small { display:none; }
  .world-minimap-channel b { max-width:31px; font-size:6px; }
  .world-minimap-ping { min-width:42px; gap:3px; padding-left:4px; }
  .world-minimap-ping b { font-size:6px; }
  .world-minimap-ping-bars { height:10px; }
  .world-minimap-ping-bars span { width:1.5px; }
  .world-minimap-ping-bars span:nth-child(1){height:3px}.world-minimap-ping-bars span:nth-child(2){height:5px}.world-minimap-ping-bars span:nth-child(3){height:8px}.world-minimap-ping-bars span:nth-child(4){height:10px}
  .world-minimap-open { min-width:43px; height:21px; padding:0 5px; border-radius:7px; gap:3px; }
  .world-minimap-open span { width:11px; height:11px; }
  .world-minimap-open .ui-icon { width:10px; height:10px; }
  .world-minimap-open b { font-size:6px; }
  .world-topbar { right:max(174px,calc(env(safe-area-inset-right) + 166px)); }
  .player-chip { width:min(174px,calc(100vw - 182px)); }
  .world-location { width:min(202px,calc(100vw - 174px)); }
  .quest-widget { top:max(142px,calc(env(safe-area-inset-top) + 136px)); }
}

@media (max-width:420px) {
  .world-minimap { width:148px; grid-template-rows:22px 76px 26px; height:124px; }
  .world-minimap-map-button { height:76px; }
  .world-minimap-place b { max-width:85px; }
  .world-minimap-open b { display:none; }
  .world-minimap-open { min-width:27px; width:27px; padding:0; }
  .world-topbar { right:max(160px,calc(env(safe-area-inset-right) + 154px)); }
  .player-chip { width:min(164px,calc(100vw - 168px)); }
  .world-location { width:min(184px,calc(100vw - 160px)); }
  .quest-widget { top:max(134px,calc(env(safe-area-inset-top) + 128px)); }
}

@media (prefers-reduced-motion:reduce) {
  .world-minimap-player,
  .world-minimap-preview,
  .world-minimap-open { transition:none!important; }
}

/* v2.7.43 — minimalist desktop minimap + classic round phone minimap */
@media (min-width:761px) {
  .world-minimap {
    --minimap-top-bg:rgba(13,29,31,.94);
    --minimap-bottom-bg:rgba(249,251,249,.98);
    --minimap-bottom-text:#263d47;
    --minimap-line:rgba(93,119,126,.26);
    top:max(14px,env(safe-area-inset-top));
    right:max(14px,env(safe-area-inset-right));
    display:grid;
    grid-template-rows:29px 112px 31px;
    width:252px;
    height:172px;
    overflow:visible;
    border:1px solid rgba(255,255,255,.92);
    border-radius:15px;
    background:transparent;
    box-shadow:0 13px 30px rgba(0,27,42,.28);
  }
  html[data-game-theme="dark"] .world-minimap {
    --minimap-top-bg:rgba(8,26,33,.97);
    --minimap-bottom-bg:rgba(9,34,43,.98);
    --minimap-bottom-text:#e8f5f8;
    --minimap-line:rgba(115,172,190,.2);
    border-color:rgba(139,190,204,.36);
  }
  .world-minimap-topbar {
    padding:0 10px 0 11px;
    border:0;
    border-radius:14px 14px 0 0;
    background:var(--minimap-top-bg);
    color:#f8fcfd;
  }
  .world-minimap-place { min-width:0; }
  .world-minimap-place b {
    max-width:154px;
    font-size:8px;
    font-weight:850;
    letter-spacing:.01em;
  }
  .world-minimap-server-meta {
    display:flex;
    flex:0 0 auto;
    align-items:center;
    gap:6px;
  }
  .world-minimap-server-meta img {
    width:16px;
    height:16px;
    object-fit:contain;
    filter:drop-shadow(0 1px 2px rgba(0,0,0,.22));
  }
  .world-minimap-topbar time {
    min-width:34px;
    font-size:8px;
    font-weight:900;
    text-align:right;
  }
  .world-minimap-map-surface {
    position:relative;
    width:100%;
    height:112px;
    overflow:hidden;
    background:#17394a;
  }
  .world-minimap-frame {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0;
    border-radius:0;
    box-shadow:none;
  }
  .world-minimap-preview { filter:saturate(1.06) contrast(1.015); }
  .world-minimap-frame::after {
    background:linear-gradient(180deg,rgba(4,24,31,.05),transparent 30%,transparent 75%,rgba(4,24,31,.1));
  }
  .world-minimap-grid,.world-minimap-revision,.world-minimap-north { display:none!important; }
  .world-minimap-player {
    width:16px;
    height:20px;
    transform:translate(-50%,-50%) rotate(var(--minimap-heading,0deg));
    transition:left .09s linear,top .09s linear,transform .13s ease-out;
  }
  .world-minimap-player svg { width:16px;height:20px;filter:drop-shadow(0 2px 3px rgba(0,35,60,.48)); }
  .world-minimap-player path { fill:#218fd4;stroke:#fff;stroke-width:2.3; }
  .world-minimap-bottombar {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:0;
    min-height:31px;
    padding:0;
    border-top:1px solid var(--minimap-line);
    border-radius:0 0 14px 14px;
    background:var(--minimap-bottom-bg);
    color:var(--minimap-bottom-text);
  }
  .world-minimap-channel {
    display:grid;
    grid-template-columns:18px minmax(0,1fr) auto 11px;
    gap:5px;
    align-items:center;
    height:30px;
    min-width:0;
    padding:0 8px 0 9px;
    border:0;
    border-radius:0 0 0 14px;
    background:transparent;
    color:inherit;
    box-shadow:none;
    text-align:left;
  }
  .world-minimap-channel:not(:disabled):hover { background:color-mix(in srgb,#2899d9 7%,transparent);transform:none; }
  .world-minimap-channel:disabled { opacity:.72;cursor:default; }
  .world-minimap-channel-icon { display:grid;place-items:center;width:18px;height:18px;color:#657d87; }
  .world-minimap-channel-icon svg { width:16px;height:16px;fill:currentColor;stroke:currentColor;stroke-width:1.3; }
  .world-minimap-channel-copy { display:grid;gap:0;min-width:0;line-height:1; }
  .world-minimap-channel-copy small { color:color-mix(in srgb,var(--minimap-bottom-text) 57%,transparent);font-size:5px;font-weight:750;text-transform:uppercase;letter-spacing:.05em; }
  .world-minimap-channel-copy b { overflow:hidden;font-size:7.5px;font-weight:900;text-overflow:ellipsis;white-space:nowrap; }
  .world-minimap-channel em { color:color-mix(in srgb,var(--minimap-bottom-text) 64%,transparent);font-size:6.5px;font-style:normal;font-weight:850;font-variant-numeric:tabular-nums; }
  .world-minimap-channel-chevron { color:color-mix(in srgb,var(--minimap-bottom-text) 55%,transparent);font-size:10px;transition:transform .15s ease; }
  .world-minimap.is-channel-open .world-minimap-channel-chevron { transform:rotate(180deg); }
  .world-minimap-ping {
    justify-content:center;
    min-width:66px;
    height:30px;
    padding:0 9px;
    border-left:1px solid var(--minimap-line);
  }
  .world-minimap-ping b { font-size:7.5px; }
  .world-minimap-ping-bars { height:12px; }
  .world-minimap-ping-bars span { width:2px; }
  .world-minimap-channel-menu {
    position:absolute;
    z-index:30;
    top:177px;
    right:0;
    width:206px;
    padding:8px;
    border:1px solid var(--theme-border,rgba(126,164,181,.38));
    border-radius:13px;
    background:var(--theme-panel,#f7fbfc);
    color:var(--theme-text,#173e58);
    box-shadow:0 14px 34px rgba(0,27,42,.28);
    animation:minimap-channel-in .14s ease-out both;
  }
  .world-minimap-channel-menu[hidden] { display:none!important; }
  .world-minimap-channel-menu>header { display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:2px 3px 7px; }
  .world-minimap-channel-menu>header b { font-size:9px;font-weight:900; }
  .world-minimap-channel-menu>header small { color:var(--theme-muted,#718897);font-size:6px; }
  #worldMinimapChannelList { display:grid;gap:5px; }
  #worldMinimapChannelList button {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    min-height:37px;
    padding:6px 8px;
    border:1px solid var(--theme-border,rgba(124,163,180,.26));
    border-radius:10px;
    background:var(--theme-surface-soft,rgba(225,239,245,.42));
    color:var(--theme-text,#173e58);
    box-shadow:none;
    text-align:left;
  }
  #worldMinimapChannelList button:not(:disabled):hover { border-color:color-mix(in srgb,#2d9bd7 52%,var(--theme-border));background:color-mix(in srgb,#2d9bd7 8%,var(--theme-surface-soft));transform:none; }
  #worldMinimapChannelList button>span { display:grid;grid-template-columns:8px 1fr;column-gap:6px;align-items:center; }
  #worldMinimapChannelList button>span i { grid-row:1/3;width:7px;height:7px;border-radius:50%;background:#54bd7b;box-shadow:0 0 0 3px rgba(84,189,123,.1); }
  #worldMinimapChannelList button.is-medium>span i { background:#e0a439; }
  #worldMinimapChannelList button.is-busy>span i { background:#df6868; }
  #worldMinimapChannelList button>span b { font-size:8px;font-weight:900; }
  #worldMinimapChannelList button>span small { color:var(--theme-muted,#718897);font-size:5.5px; }
  #worldMinimapChannelList button em { font-size:7px;font-style:normal;font-weight:900;font-variant-numeric:tabular-nums; }
  #worldMinimapChannelList button.is-current { border-color:rgba(45,155,215,.38);background:rgba(45,155,215,.09); }
  @keyframes minimap-channel-in { from{opacity:0;transform:translateY(-5px) scale(.98)} to{opacity:1;transform:none} }
}

/* Phone keeps the familiar circular minimap for now. */
@media (max-width:760px) {
  .world-minimap {
    top:max(8px,env(safe-area-inset-top));
    right:max(8px,env(safe-area-inset-right));
    display:block;
    width:102px;
    height:102px;
    overflow:hidden;
    border:2px solid rgba(255,255,255,.94);
    border-radius:50%;
    background:#17394a;
    box-shadow:0 10px 24px rgba(0,24,38,.25),inset 0 0 0 1px rgba(11,110,184,.14);
  }
  .world-minimap-topbar,.world-minimap-bottombar,.world-minimap-channel-menu { display:none!important; }
  .world-minimap-map-surface,.world-minimap-frame { position:absolute;inset:0;width:100%;height:100%;border-radius:50%;overflow:hidden; }
  .world-minimap-frame { border:0;box-shadow:none; }
  .world-minimap-frame::after { border-radius:50%;background:radial-gradient(circle at 50% 45%,transparent 60%,rgba(0,28,45,.15) 100%); }
  .world-minimap-preview { width:100%;height:100%;filter:saturate(1.04) contrast(1.01); }
  .world-minimap-grid,.world-minimap-revision,.world-minimap-north { display:none!important; }
  .world-minimap-player {
    width:11px;
    height:11px;
    border:2px solid #fff;
    border-radius:50%;
    background:#159ce8;
    box-shadow:0 0 0 4px rgba(18,161,255,.18),0 3px 8px rgba(2,76,140,.28);
    transform:translate(-50%,-50%)!important;
  }
  .world-minimap-player svg { display:none; }
  .world-topbar { right:max(118px,calc(env(safe-area-inset-right) + 110px)); }
  .player-chip { width:min(174px,calc(100vw - 118px)); }
  .world-location { width:min(202px,calc(100vw - 118px)); }
  .quest-widget { top:max(114px,calc(env(safe-area-inset-top) + 108px)); }
}
@media (max-width:420px) {
  .world-minimap { width:92px;height:92px; }
  .world-topbar { right:max(106px,calc(env(safe-area-inset-right) + 100px)); }
  .player-chip { width:min(164px,calc(100vw - 108px)); }
  .world-location { width:min(184px,calc(100vw - 106px)); }
  .quest-widget { top:max(104px,calc(env(safe-area-inset-top) + 100px)); }
}
@media (prefers-reduced-motion:reduce) {
  .world-minimap-channel-menu,.world-minimap-channel-chevron { animation:none!important;transition:none!important; }
}

/* v2.7.44 — stretched desktop minimap, stronger depth and world-channel teleport loading */
@media (min-width:761px) {
  .world-minimap {
    grid-template-rows:34px 136px 35px;
    width:286px;
    height:205px;
    border-color:rgba(255,255,255,.96);
    border-radius:17px;
    box-shadow:
      0 22px 46px rgba(0,24,38,.32),
      0 5px 14px rgba(0,31,48,.18),
      inset 0 0 0 1px rgba(15,105,150,.10);
    filter:drop-shadow(0 1px 0 rgba(255,255,255,.32));
  }
  html[data-game-theme="dark"] .world-minimap {
    border-color:rgba(132,187,207,.32);
    box-shadow:
      0 24px 52px rgba(0,0,0,.42),
      0 5px 16px rgba(0,15,25,.28),
      inset 0 0 0 1px rgba(107,181,208,.08);
  }
  .world-minimap-topbar {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:10px;
    min-height:34px;
    padding:0 11px 0 13px;
    border-radius:16px 16px 0 0;
  }
  .world-minimap-place {
    min-width:0;
    width:100%;
  }
  .world-minimap-place b {
    display:block;
    width:100%;
    max-width:none;
    overflow:hidden;
    font-size:9.5px;
    font-weight:900;
    letter-spacing:.008em;
    line-height:1;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .world-minimap-server-meta {
    min-width:max-content;
    gap:7px;
  }
  .world-minimap-server-meta img {
    width:17px;
    height:17px;
  }
  .world-minimap-topbar time {
    min-width:38px;
    font-size:9px;
  }
  .world-minimap-map-surface {
    height:136px;
    background:#17394a;
    box-shadow:inset 0 1px rgba(255,255,255,.10), inset 0 -1px rgba(0,20,31,.10);
  }
  .world-minimap-frame {
    height:136px;
  }
  .world-minimap-preview {
    width:100%;
    height:100%;
    transform:scale(1.018);
    transform-origin:center;
    filter:saturate(1.08) contrast(1.025) brightness(1.015);
  }
  .world-minimap-frame::after {
    box-shadow:
      inset 0 1px rgba(255,255,255,.10),
      inset 0 -12px 22px rgba(0,22,33,.10);
  }
  .world-minimap-player {
    width:15px;
    height:18px;
  }
  .world-minimap-player svg {
    width:15px;
    height:18px;
  }
  .world-minimap-bottombar {
    min-height:35px;
    border-radius:0 0 16px 16px;
  }
  .world-minimap-channel {
    grid-template-columns:19px minmax(0,1fr) auto 11px;
    height:34px;
    padding:0 10px 0 11px;
    border-radius:0 0 0 16px;
  }
  .world-minimap-channel-copy small {
    font-size:5.5px;
  }
  .world-minimap-channel-copy b {
    font-size:8px;
  }
  .world-minimap-channel em {
    padding:3px 6px;
    border-radius:999px;
    background:color-mix(in srgb,var(--minimap-bottom-text) 7%,transparent);
    font-size:6.7px;
  }
  .world-minimap-ping {
    min-width:72px;
    height:34px;
    padding:0 10px;
  }
  .world-minimap-ping b {
    font-size:7.8px;
  }
  .world-minimap-channel-menu {
    top:calc(100% + 7px);
    right:0;
    width:100%;
    padding:9px;
    border-radius:14px;
    box-shadow:0 18px 42px rgba(0,24,38,.32),0 3px 10px rgba(0,24,38,.12);
  }
  .world-minimap-channel-menu>header {
    padding:2px 4px 8px;
  }
  .world-minimap-channel-menu>header b {
    font-size:9.5px;
  }
  .world-minimap-channel-menu>header small {
    font-size:6.2px;
  }
  #worldMinimapChannelList {
    grid-template-columns:1fr 1fr;
    gap:6px;
  }
  #worldMinimapChannelList button {
    min-height:42px;
    padding:7px 9px;
  }
  #worldMinimapChannelList button>span b {
    font-size:8.2px;
  }
  #worldMinimapChannelList button>span small {
    font-size:5.8px;
  }
  #worldMinimapChannelList button em {
    font-size:7px;
  }
  .world-minimap.is-switching-world {
    pointer-events:none;
  }
  .world-minimap.is-switching-world::after {
    content:'Смена мира…';
    position:absolute;
    z-index:40;
    inset:34px 0 35px;
    display:grid;
    place-items:center;
    background:rgba(5,28,39,.24);
    color:#fff;
    font-size:8px;
    font-weight:900;
    letter-spacing:.03em;
    backdrop-filter:blur(1.5px);
  }
}

.loading-screen.is-channel-switch {
  background:rgba(4,23,33,.58);
  backdrop-filter:blur(8px) saturate(.9);
}
.loading-screen.is-channel-switch .loading-orbit {
  width:58px;
  height:58px;
  border-width:4px;
  border-color:rgba(255,255,255,.22);
  border-top-color:#79d3ff;
  box-shadow:0 0 0 9px rgba(77,181,234,.08),0 18px 50px rgba(0,0,0,.24);
}
.loading-screen.is-channel-switch .loading-orbit i {
  inset:17px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 0 6px rgba(79,191,240,.16);
}
.loading-screen.is-channel-switch b {
  margin-top:16px;
  font-size:17px;
  text-shadow:0 2px 10px rgba(0,0,0,.24);
}
.loading-screen.is-channel-switch small {
  max-width:min(420px,calc(100vw - 42px));
  color:#e3f5fc;
  font-size:9px;
  line-height:1.45;
  text-align:center;
}

/* Phone deliberately stays on the previous circular minimap layout. */
@media (max-width:760px) {
  .world-minimap-preview {
    transform:none;
  }
}

/* v2.7.45 — edge-to-edge minimap chrome and minimap-first world navigation */
@media (min-width:761px) {
  .world-minimap {
    --minimap-top-bg:rgba(10,27,32,.82);
    grid-template-columns:minmax(0,1fr);
    align-items:stretch;
    justify-items:stretch;
    align-content:stretch;
    justify-content:stretch;
    padding:0;
    border:0;
    background:none;
    box-shadow:0 18px 38px rgba(0,24,38,.30),0 4px 12px rgba(0,31,48,.16);
    filter:none;
  }
  html[data-game-theme="dark"] .world-minimap {
    --minimap-top-bg:rgba(6,23,30,.86);
    border:0;
    box-shadow:0 20px 44px rgba(0,0,0,.40),0 4px 13px rgba(0,15,25,.26);
  }
  .world-minimap-topbar,
  .world-minimap-map-surface,
  .world-minimap-bottombar {
    width:100%;
    min-width:0;
    max-width:none;
    justify-self:stretch;
  }
  .world-minimap-topbar {
    grid-template-columns:minmax(0,1fr) auto;
    gap:5px;
    padding:0 10px 0 13px;
    background:var(--minimap-top-bg);
    backdrop-filter:blur(8px) saturate(1.03);
    box-shadow:inset 0 1px rgba(255,255,255,.06);
  }
  .world-minimap-place b {
    max-width:none;
    font-size:10px;
    font-weight:900;
  }
  .world-minimap-server-meta {
    gap:2px;
    margin-left:2px;
  }
  .world-minimap-server-meta img {
    width:14px;
    height:14px;
    margin-right:1px;
  }
  .world-minimap-topbar time {
    min-width:37px;
    font-size:9px;
    letter-spacing:.01em;
  }
  .world-minimap-map-surface {
    cursor:pointer;
    outline:none;
  }
  .world-minimap-map-surface:focus-visible {
    box-shadow:inset 0 0 0 2px rgba(67,174,235,.82);
  }
  .world-minimap-map-surface:hover .world-minimap-preview {
    filter:saturate(1.11) contrast(1.03) brightness(1.02);
  }
  .world-topbar {
    grid-template-columns:minmax(200px,230px) minmax(0,1fr);
  }
}

@media (max-width:760px) {
  .world-minimap-map-surface { cursor:pointer; }
}

/* v2.7.46 — server-world channel confirmation */
.world-channel-confirm {
  position:absolute;
  inset:0;
  z-index:96;
  display:none;
  place-items:center;
  padding:18px;
}
.world-channel-confirm.is-open { display:grid; }
.world-channel-confirm__backdrop {
  position:absolute;
  inset:0;
  background:rgba(7,20,29,.28);
  backdrop-filter:blur(5px);
}
.world-channel-confirm__card {
  position:relative;
  z-index:1;
  width:min(390px,calc(100vw - 36px));
  padding:22px;
  border:1px solid var(--theme-border,#d3e2ea);
  border-radius:24px;
  background:color-mix(in srgb,var(--theme-panel,#fff) 97%,transparent);
  color:var(--theme-text,#173e58);
  box-shadow:0 24px 70px rgba(5,25,38,.26);
  animation:world-channel-confirm-in .16s ease-out both;
}
.world-channel-confirm__close {
  position:absolute;
  top:12px;
  right:12px;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:1px solid var(--theme-border,#d3e2ea);
  border-radius:13px;
  background:color-mix(in srgb,var(--theme-card,#fff) 94%,transparent);
  color:var(--theme-text,#173e58);
  font-size:22px;
}
.world-channel-confirm__icon {
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  margin-bottom:13px;
  border-radius:16px;
  background:color-mix(in srgb,#2d9fe8 12%,transparent);
  color:#1688cf;
}
.world-channel-confirm__icon svg { width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round; }
.world-channel-confirm__card>small { color:#1688cf;font-size:8px;font-weight:950;letter-spacing:.11em; }
.world-channel-confirm__card h2 { margin:5px 42px 5px 0;font-size:23px;line-height:1.08; }
.world-channel-confirm__card p { margin:0;color:var(--theme-muted,#698397);font-size:11px;line-height:1.5; }
.world-channel-confirm__meta { margin-top:14px;padding:10px 12px;border-radius:13px;background:color-mix(in srgb,var(--theme-text,#173e58) 5%,transparent);font-size:9px;font-weight:850; }
.world-channel-confirm__actions { display:grid;grid-template-columns:1fr 1.25fr;gap:8px;margin-top:16px; }
.world-channel-confirm__actions button { min-height:44px;border:1px solid var(--theme-border,#d3e2ea);border-radius:14px;background:var(--theme-card,#fff);color:var(--theme-text,#173e58);font-size:10px;font-weight:900; }
.world-channel-confirm__actions .is-primary { border-color:#238fd4;background:linear-gradient(180deg,#39a9ee,#218bd4);color:#fff;box-shadow:0 8px 18px rgba(33,139,212,.22); }
html[data-game-theme="dark"] .world-channel-confirm__card { background:rgba(10,39,52,.98); }
html[data-game-theme="dark"] .world-channel-confirm__actions button { background:rgba(255,255,255,.055); }
@keyframes world-channel-confirm-in { from{opacity:0;transform:translateY(8px) scale(.97)} to{opacity:1;transform:none} }
@media (max-width:760px) {
  .world-channel-confirm { align-items:end;padding:10px 10px calc(74px + env(safe-area-inset-bottom)); }
  .world-channel-confirm__card { width:100%;border-radius:22px;padding:18px; }
}

/* v2.7.47 — reliable one-click world picker hit areas */
@media (min-width:761px) {
  .world-minimap-channel {
    cursor:pointer;
    touch-action:manipulation;
    user-select:none;
  }
  .world-minimap-channel > * {
    pointer-events:none;
  }
  #worldMinimapChannelList button {
    min-height:48px;
    cursor:pointer;
    touch-action:manipulation;
    user-select:none;
    -webkit-tap-highlight-color:transparent;
  }
  #worldMinimapChannelList button > * {
    pointer-events:none;
  }
  #worldMinimapChannelList button:not(:disabled):active {
    border-color:color-mix(in srgb,#2d9bd7 68%,var(--theme-border));
    background:color-mix(in srgb,#2d9bd7 13%,var(--theme-surface-soft));
    transform:scale(.985);
  }
  .world-minimap-channel-menu {
    animation:minimap-channel-fade-v2747 .11s ease-out both;
  }
  @keyframes minimap-channel-fade-v2747 {
    from { opacity:0; }
    to { opacity:1; }
  }
}

/* v2.7.48 — desktop onboarding HUD + five-button dock. Mobile layout intentionally unchanged. */
.desktop-dock { display:none; }

@media (min-width:761px) {
  .game-screen .desktop-dock {
    position:absolute;
    z-index:24;
    left:50%;
    bottom:max(14px,env(safe-area-inset-bottom));
    display:grid;
    grid-template-columns:repeat(5,76px);
    gap:5px;
    padding:6px;
    transform:translateX(-50%);
    border:1px solid rgba(170,203,220,.24);
    border-radius:20px;
    background:linear-gradient(180deg,rgba(7,35,48,.88),rgba(5,29,41,.82));
    box-shadow:0 16px 38px rgba(0,18,28,.28),inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter:blur(18px) saturate(1.12);
  }
  .game-screen .desktop-dock button {
    position:relative;
    display:grid;
    grid-template-rows:30px auto;
    place-items:center;
    gap:3px;
    min-width:0;
    min-height:55px;
    padding:5px 6px 6px;
    border:1px solid transparent;
    border-radius:14px;
    background:transparent;
    color:#c9dde8;
    transition:transform .14s ease,border-color .14s ease,background .14s ease,color .14s ease,box-shadow .14s ease;
  }
  .game-screen .desktop-dock button::after {
    content:'';
    position:absolute;
    left:17px;
    right:17px;
    bottom:3px;
    height:2px;
    border-radius:999px;
    background:transparent;
    transition:background .14s ease,box-shadow .14s ease;
  }
  .game-screen .desktop-dock button:hover {
    transform:translateY(-1px);
    border-color:rgba(101,195,245,.26);
    background:rgba(40,139,195,.13);
    color:#fff;
  }
  .game-screen .desktop-dock button:active { transform:translateY(0) scale(.97); }
  .game-screen .desktop-dock button.is-active {
    border-color:rgba(84,190,245,.38);
    background:linear-gradient(180deg,rgba(34,151,217,.25),rgba(22,119,176,.14));
    color:#fff;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 7px 18px rgba(0,92,146,.14);
  }
  .game-screen .desktop-dock button.is-active::after {
    background:#52c8ff;
    box-shadow:0 0 8px rgba(74,197,255,.55);
  }
  .game-screen .desktop-dock button > span {
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    border-radius:10px;
    background:rgba(255,255,255,.055);
  }
  .game-screen .desktop-dock button > span .ui-icon { width:20px; height:20px; }
  .game-screen .desktop-dock button > b {
    max-width:66px;
    overflow:hidden;
    color:inherit;
    font-size:7.5px;
    font-weight:760;
    line-height:1.05;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  /* The old long rail becomes a compact secondary popover, only opened by Menu. */
  .game-screen .world-rail {
    left:50%;
    right:auto;
    top:auto;
    bottom:84px;
    display:none;
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:286px;
    max-height:none;
    padding:8px;
    gap:5px;
    overflow:visible;
    transform:translateX(28px);
    border-radius:17px;
    background:linear-gradient(160deg,rgba(6,34,47,.96),rgba(5,43,58,.92));
    box-shadow:0 18px 42px rgba(0,18,29,.3),inset 0 1px 0 rgba(255,255,255,.07);
    animation:desktopMenuIn .14s ease both;
  }
  .game-screen .world-rail.is-desktop-menu-open { display:grid; }
  .game-screen .world-rail button {
    display:grid;
    grid-template-columns:27px minmax(0,1fr);
    align-items:center;
    justify-items:start;
    min-height:40px;
    padding:5px 8px;
    gap:7px;
    border-radius:11px;
    color:#d8e9f1;
  }
  .game-screen .world-rail button span { width:27px; height:27px; }
  .game-screen .world-rail button span .ui-icon { width:17px; height:17px; }
  .game-screen .world-rail button b,
  .game-screen .world-rail button:hover b,
  .game-screen .world-rail button.is-active b {
    font-size:8px;
    font-weight:730;
    text-align:left;
  }
  .game-screen .world-rail button[data-panel="chat"],
  .game-screen .world-rail button[data-panel="home"] { margin-top:0; border-top:0; }
  @keyframes desktopMenuIn {
    from { opacity:0; transform:translateX(28px) translateY(5px) scale(.98); }
    to { opacity:1; transform:translateX(28px) translateY(0) scale(1); }
  }

  /* Compact training tracker: objective + progress at a glance, details live in the full quest panel. */
  .game-screen .quest-widget {
    --quest-card-width:clamp(250px,20vw,286px);
    left:max(16px,env(safe-area-inset-left));
    right:auto;
    top:calc(max(14px,env(safe-area-inset-top)) + 72px);
    width:var(--quest-card-width);
    gap:6px;
    padding:11px 12px 12px;
    border:1px solid rgba(128,194,225,.22);
    border-radius:16px;
    background:linear-gradient(155deg,rgba(5,31,43,.90),rgba(6,42,55,.84));
    box-shadow:0 13px 30px rgba(0,20,30,.22),inset 0 1px 0 rgba(255,255,255,.06);
    backdrop-filter:blur(16px) saturate(1.08);
  }
  .game-screen .quest-widget:hover {
    transform:translateY(-1px);
    border-color:rgba(99,198,244,.35);
    box-shadow:0 16px 36px rgba(0,20,30,.27),inset 0 1px 0 rgba(255,255,255,.07);
  }
  .game-screen .quest-widget-head {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto auto;
    align-items:center;
    gap:6px;
  }
  .game-screen .quest-widget-head > #questWidgetState {
    min-width:0;
    overflow:hidden;
    color:#65d79a;
    font-size:6.5px;
    font-weight:850;
    letter-spacing:.8px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .game-screen .quest-widget-training-progress {
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:5px;
    min-height:21px;
    padding:0 7px 0 6px;
    overflow:hidden;
    border:1px solid rgba(83,188,239,.20);
    border-radius:999px;
    background:rgba(57,158,214,.10);
    color:#bdeaff;
  }
  .game-screen .quest-widget-training-progress[hidden] { display:none; }
  .game-screen .quest-widget-training-progress::after {
    content:'';
    position:absolute;
    left:0;
    bottom:0;
    width:var(--tutorial-progress,0%);
    height:2px;
    background:#51c9ff;
    box-shadow:0 0 7px rgba(81,201,255,.5);
  }
  .game-screen .quest-widget-training-progress > i {
    width:6px;
    height:6px;
    border-radius:50%;
    background:#51c9ff;
    box-shadow:0 0 7px rgba(81,201,255,.6);
  }
  .game-screen .quest-widget-training-progress > b {
    color:inherit;
    font-size:6.5px;
    font-weight:780;
    white-space:nowrap;
  }
  .game-screen #questWidgetCounter {
    min-width:28px;
    min-height:21px;
    padding:0 6px;
    font-size:7px;
  }
  .game-screen .quest-widget > #questWidgetTitle {
    margin-top:1px;
    font-size:15px;
    font-weight:820;
    line-height:1.1;
  }
  .game-screen .quest-widget > #questWidgetDescription,
  .game-screen .quest-widget-meta { display:none; }
  .game-screen .quest-widget-target {
    grid-template-columns:34px minmax(0,1fr);
    gap:8px;
    padding:6px 8px 6px 6px;
    border:1px solid rgba(126,190,218,.16);
    border-radius:12px;
    background:rgba(255,255,255,.045);
  }
  .game-screen .quest-widget-target-icon {
    width:32px;
    height:32px;
    border-radius:9px;
  }
  .game-screen .quest-widget-target small { font-size:5.8px; letter-spacing:.65px; }
  .game-screen .quest-widget-target b {
    font-size:9.5px;
    font-weight:780;
    line-height:1.17;
    -webkit-line-clamp:2;
  }
  .game-screen .quest-widget-progress { gap:4px; }
  .game-screen .quest-widget-progress-copy { gap:8px; }
  .game-screen .quest-widget-progress-copy strong { font-size:8px; }
  .game-screen .quest-widget-progress-copy em {
    max-width:62%;
    color:#9bb7c5;
    font-size:7px;
  }
  .game-screen .quest-widget-progress-track { height:4px; background:rgba(255,255,255,.09); }
  .game-screen .quest-widget-progress-track > i {
    background:linear-gradient(90deg,#27aef1,#57d2ff);
    box-shadow:0 0 8px rgba(56,188,248,.34);
  }
  .game-screen .quest-widget.is-ready {
    border-color:rgba(255,208,79,.34);
  }
  .game-screen .quest-widget.is-ready .quest-widget-progress-track > i {
    background:linear-gradient(90deg,#e8b52e,#ffd861);
  }
  .game-screen .quest-widget.is-progress-updated {
    animation:questCompactUpdate .48s ease;
  }
  @keyframes questCompactUpdate {
    0%,100% { transform:none; }
    45% { transform:translateY(-2px); box-shadow:0 16px 36px rgba(0,20,30,.28),0 0 0 2px rgba(69,195,250,.12); }
  }

  /* Keep contextual actions above the new dock. */
  .game-screen .context-action { bottom:86px; }

  html[data-game-theme="light"] .game-screen .desktop-dock {
    border-color:rgba(190,214,226,.94);
    background:rgba(250,253,255,.92);
    box-shadow:0 14px 34px rgba(0,31,50,.18),inset 0 1px 0 #fff;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button { color:#42677d; }
  html[data-game-theme="light"] .game-screen .desktop-dock button > span { background:#edf6fa; }
  html[data-game-theme="light"] .game-screen .desktop-dock button:hover {
    border-color:#c8e2ef;
    background:#eff8fc;
    color:#087dcc;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button.is-active {
    border-color:#a9d8ee;
    background:linear-gradient(180deg,#e5f5fd,#f3fbff);
    color:#087dcc;
    box-shadow:0 7px 18px rgba(34,126,178,.10),inset 0 1px 0 #fff;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button.is-active::after { background:#149ce7; box-shadow:none; }
  html[data-game-theme="light"] .game-screen .world-rail {
    border-color:#cbdfe9;
    background:rgba(250,253,255,.97);
    box-shadow:0 16px 34px rgba(0,31,50,.19),inset 0 1px 0 #fff;
  }
  html[data-game-theme="light"] .game-screen .world-rail button { color:#315d77; }
  html[data-game-theme="light"] .game-screen .world-rail button:hover,
  html[data-game-theme="light"] .game-screen .world-rail button.is-active {
    border-color:#c8e4f2;
    background:#eaf6fc;
    color:#087dcc;
    box-shadow:none;
  }
  html[data-game-theme="light"] .game-screen .quest-widget {
    border-color:rgba(185,214,228,.95);
    background:rgba(250,253,255,.94);
    color:#173f59;
    box-shadow:0 13px 30px rgba(0,31,50,.16),inset 0 1px 0 #fff;
  }
  html[data-game-theme="light"] .game-screen .quest-widget-head > #questWidgetState { color:#2f9e68; }
  html[data-game-theme="light"] .game-screen .quest-widget-training-progress {
    border-color:#c6e4f2;
    background:#eef8fd;
    color:#147fbb;
  }
  html[data-game-theme="light"] .game-screen .quest-widget-target {
    border-color:#d7e7ee;
    background:#f1f8fb;
  }
  html[data-game-theme="light"] .game-screen .quest-widget-progress-copy em { color:#698596; }
  html[data-game-theme="light"] .game-screen .quest-widget-progress-track { background:#dceaf0; }
}

@media (min-width:761px) and (max-width:1080px) {
  .game-screen .desktop-dock { grid-template-columns:repeat(5,68px); }
  .game-screen .desktop-dock button { min-height:51px; }
  .game-screen .desktop-dock button > b { font-size:7px; }
  .game-screen .quest-widget { width:244px; }
}

@media (prefers-reduced-motion:reduce) {
  .game-screen .desktop-dock *,
  .game-screen .world-rail,
  .game-screen .quest-widget { animation:none !important; transition:none !important; }
}

/* v2.7.49 — five independent desktop/tablet actions on the right edge. Phone UI unchanged. */
@media (min-width:761px) {
  .game-screen .desktop-dock {
    --desktop-action-size:62px;
    --desktop-action-height:58px;
    position:absolute;
    z-index:26;
    left:auto;
    right:max(14px,env(safe-area-inset-right));
    top:auto;
    bottom:max(18px,env(safe-area-inset-bottom));
    display:flex;
    flex-direction:column;
    width:var(--desktop-action-size);
    gap:8px;
    padding:0;
    transform:none;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    pointer-events:none;
  }
  .game-screen .desktop-dock button {
    position:relative;
    display:grid;
    grid-template-rows:31px auto;
    place-items:center;
    gap:3px;
    width:var(--desktop-action-size);
    min-width:var(--desktop-action-size);
    height:var(--desktop-action-height);
    min-height:var(--desktop-action-height);
    padding:6px 5px 5px;
    overflow:visible;
    border:1px solid rgba(126,181,207,.28);
    border-radius:16px;
    background:linear-gradient(160deg,rgba(7,38,52,.93),rgba(5,30,43,.90));
    color:#cde1ea;
    box-shadow:0 9px 22px rgba(0,20,31,.20),inset 0 1px 0 rgba(255,255,255,.07);
    backdrop-filter:blur(14px) saturate(1.08);
    pointer-events:auto;
    transition:transform .14s ease,border-color .14s ease,background .14s ease,color .14s ease,box-shadow .14s ease;
  }
  .game-screen .desktop-dock button::after {
    content:'';
    position:absolute;
    left:10px;
    right:10px;
    bottom:3px;
    height:2px;
    border-radius:999px;
    background:transparent;
    transition:background .14s ease,box-shadow .14s ease;
  }
  .game-screen .desktop-dock button:hover {
    transform:translateX(-2px);
    border-color:rgba(90,197,245,.48);
    background:linear-gradient(160deg,rgba(10,57,76,.96),rgba(7,40,55,.94));
    color:#fff;
    box-shadow:0 12px 25px rgba(0,20,31,.26),0 0 0 1px rgba(54,174,232,.08),inset 0 1px 0 rgba(255,255,255,.09);
  }
  .game-screen .desktop-dock button:active { transform:translateX(-1px) scale(.965); }
  .game-screen .desktop-dock button.is-active {
    border-color:rgba(72,188,241,.60);
    background:linear-gradient(155deg,rgba(24,137,196,.93),rgba(16,91,137,.91));
    color:#fff;
    box-shadow:0 11px 26px rgba(0,75,119,.25),inset 0 1px 0 rgba(255,255,255,.15);
  }
  .game-screen .desktop-dock button.is-active::after {
    background:#8be0ff;
    box-shadow:0 0 8px rgba(83,203,255,.58);
  }
  .game-screen .desktop-dock button > span {
    display:grid;
    place-items:center;
    width:31px;
    height:31px;
    border-radius:10px;
    background:rgba(255,255,255,.06);
  }
  .game-screen .desktop-dock button > span .ui-icon { width:20px;height:20px; }
  .game-screen .desktop-dock button > b {
    width:100%;
    max-width:54px;
    overflow:hidden;
    color:inherit;
    font-size:7.2px;
    font-weight:780;
    line-height:1.05;
    text-align:center;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .game-screen .desktop-dock-chat > i {
    position:absolute;
    top:-5px;
    right:-5px;
    display:grid;
    place-items:center;
    min-width:18px;
    height:18px;
    padding:0 4px;
    border:2px solid #082b3b;
    border-radius:999px;
    background:#ef514a;
    color:#fff;
    font-size:7px;
    font-style:normal;
    font-weight:900;
    box-shadow:0 4px 9px rgba(116,22,19,.26);
  }
  .game-screen .desktop-dock-chat > i:empty,
  .game-screen .desktop-dock-chat > i[data-count="0"] { opacity:.58; }

  /* Secondary menu opens to the left of the fifth button, not on top of gameplay actions. */
  .game-screen .world-rail {
    left:auto;
    right:calc(max(14px,env(safe-area-inset-right)) + 72px);
    top:auto;
    bottom:max(18px,env(safe-area-inset-bottom));
    width:286px;
    max-height:min(286px,calc(100vh - 40px));
    padding:8px;
    gap:5px;
    overflow:auto;
    transform:none;
    grid-template-columns:repeat(2,minmax(0,1fr));
    border-radius:17px;
  }
  .game-screen .world-rail.is-desktop-menu-open { display:grid; }
  .game-screen .world-rail button {
    grid-template-columns:27px minmax(0,1fr);
    min-height:40px;
  }
  @keyframes desktopMenuInRight2749 {
    from { opacity:0; transform:translateX(6px) scale(.98); }
    to { opacity:1; transform:none; }
  }
  .game-screen .world-rail.is-desktop-menu-open { animation:desktopMenuInRight2749 .14s ease both; }

  /* Context interaction stays clear of the five-button rail. */
  .game-screen .context-action {
    right:calc(max(14px,env(safe-area-inset-right)) + 78px);
    bottom:max(24px,env(safe-area-inset-bottom));
  }
  .game-screen:has(.world-rail.is-desktop-menu-open) .context-action.is-ready {
    opacity:0;
    pointer-events:none;
  }

  html[data-game-theme="light"] .game-screen .desktop-dock {
    border:0;
    background:transparent;
    box-shadow:none;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button {
    border-color:rgba(190,216,228,.96);
    background:rgba(249,253,255,.95);
    color:#365f78;
    box-shadow:0 9px 22px rgba(0,31,50,.15),inset 0 1px 0 #fff;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button > span {
    background:#edf6fa;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button:hover {
    border-color:#b9dfee;
    background:#f1faff;
    color:#087dcc;
    box-shadow:0 11px 25px rgba(0,54,84,.17),inset 0 1px 0 #fff;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button.is-active {
    border-color:#83caea;
    background:linear-gradient(180deg,#dff3fd,#effaff);
    color:#077abd;
    box-shadow:0 10px 23px rgba(24,117,168,.16),inset 0 1px 0 #fff;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button.is-active::after {
    background:#159ee5;
    box-shadow:none;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock-chat > i { border-color:#f9fdff; }

  .is-battling .desktop-dock { opacity:0; pointer-events:none; }
}

/* Tablet / compact PC: same five actions, just denser. Mobile (<=760px) remains untouched. */
@media (min-width:761px) and (max-width:1080px) {
  .game-screen .desktop-dock {
    --desktop-action-size:54px;
    --desktop-action-height:52px;
    right:max(9px,env(safe-area-inset-right));
    bottom:max(12px,env(safe-area-inset-bottom));
    gap:6px;
  }
  .game-screen .desktop-dock button {
    grid-template-rows:27px auto;
    padding:5px 4px 4px;
    border-radius:14px;
  }
  .game-screen .desktop-dock button > span { width:27px;height:27px;border-radius:9px; }
  .game-screen .desktop-dock button > span .ui-icon { width:18px;height:18px; }
  .game-screen .desktop-dock button > b { max-width:48px;font-size:6.5px; }
  .game-screen .world-rail {
    right:calc(max(9px,env(safe-area-inset-right)) + 62px);
    bottom:max(12px,env(safe-area-inset-bottom));
    width:min(250px,calc(100vw - 90px));
  }
  .game-screen .context-action {
    right:calc(max(9px,env(safe-area-inset-right)) + 65px);
    bottom:max(14px,env(safe-area-inset-bottom));
  }
}

@media (min-width:761px) and (max-height:680px) {
  .game-screen .desktop-dock {
    --desktop-action-size:50px;
    --desktop-action-height:46px;
    gap:5px;
    bottom:10px;
  }
  .game-screen .desktop-dock button { grid-template-rows:24px auto;padding:4px 3px 3px;border-radius:13px; }
  .game-screen .desktop-dock button > span { width:24px;height:24px; }
  .game-screen .desktop-dock button > span .ui-icon { width:16px;height:16px; }
  .game-screen .desktop-dock button > b { font-size:6px; }
  .game-screen .world-rail { right:68px;bottom:10px;max-height:230px; }
  .game-screen .context-action { right:68px;bottom:10px; }
}
@media (min-width:761px) {
  .game-screen .desktop-dock-chat > i[hidden] { display:none; }
  .game-screen .desktop-dock button.is-menu-open {
    border-color:rgba(84,190,245,.42);
    color:#fff;
    background:linear-gradient(155deg,rgba(22,105,150,.86),rgba(11,65,92,.90));
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button.is-menu-open {
    border-color:#abd9ed;
    color:#087dcc;
    background:#eaf7fd;
  }
}

/* v2.7.50 — reference-inspired desktop HUD composition. Phone UI remains unchanged. */
.desktop-utility-rail,
.world-wallet { display:none; }

@media (min-width:761px) {
  /* Player + balance: three quiet islands, not one giant top bar. */
  .game-screen .world-topbar {
    z-index:24;
    top:max(12px,env(safe-area-inset-top));
    left:max(12px,env(safe-area-inset-left));
    right:auto;
    display:flex;
    align-items:flex-start;
    gap:10px;
    width:auto;
    pointer-events:none;
  }
  .game-screen .player-chip {
    pointer-events:auto;
    min-width:238px;
    min-height:62px;
    padding:7px 13px 7px 7px;
    border:1px solid rgba(132,191,211,.28);
    border-radius:19px;
    background:linear-gradient(145deg,rgba(7,39,51,.92),rgba(7,30,42,.88));
    box-shadow:0 11px 27px rgba(0,22,33,.20),inset 0 1px rgba(255,255,255,.07);
    backdrop-filter:blur(13px) saturate(1.08);
  }
  .game-screen .player-chip-avatar {
    width:46px;
    height:46px;
    border-radius:15px;
  }
  .game-screen .player-chip-copy b { font-size:12px; }
  .game-screen .player-chip-copy small { font-size:7px; }
  .game-screen .instance-chip { display:none; }

  .game-screen .world-wallet {
    position:fixed;
    z-index:25;
    top:max(12px,env(safe-area-inset-top));
    left:50%;
    display:flex;
    align-items:center;
    gap:8px;
    transform:translateX(-50%);
    pointer-events:auto;
  }
  .game-screen .world-wallet-currency {
    display:grid;
    grid-template-columns:25px minmax(52px,auto) 25px;
    align-items:center;
    gap:7px;
    min-height:42px;
    padding:0 7px 0 9px;
    border:1px solid rgba(132,191,211,.24);
    border-radius:14px;
    background:linear-gradient(145deg,rgba(7,39,51,.90),rgba(7,30,42,.88));
    color:#effaff;
    box-shadow:0 9px 23px rgba(0,22,33,.18),inset 0 1px rgba(255,255,255,.07);
    backdrop-filter:blur(12px);
  }
  .game-screen .world-wallet-currency > i,
  .game-screen .world-wallet-currency > i .ui-icon { width:22px;height:22px; }
  .game-screen .world-wallet-currency.is-coins > i { color:#f6c544; }
  .game-screen .world-wallet-currency.is-gems > i { color:#63b7ff; }
  .game-screen .world-wallet-currency b {
    min-width:0;
    font-size:11px;
    font-weight:850;
    font-variant-numeric:tabular-nums;
    text-align:center;
  }
  .game-screen .world-wallet-currency button {
    display:grid;
    place-items:center;
    width:25px;
    height:25px;
    padding:0;
    border:1px solid rgba(255,255,255,.10);
    border-radius:8px;
    background:rgba(255,255,255,.08);
    color:#fff;
    font:850 17px/1 system-ui;
    transition:transform .12s ease,background .12s ease;
  }
  .game-screen .world-wallet-currency button:hover { background:rgba(77,181,240,.24); }
  .game-screen .world-wallet-currency button:active { transform:scale(.92); }

  /* Five primary actions live at the extreme bottom-right, clear of the centered interaction CTA. */
  .game-screen .desktop-dock {
    --desktop-action-size:64px;
    --desktop-action-height:64px;
    position:absolute;
    z-index:27;
    right:max(14px,env(safe-area-inset-right));
    bottom:max(14px,env(safe-area-inset-bottom));
    left:auto;
    top:auto;
    display:grid;
    grid-template-columns:repeat(5,var(--desktop-action-size));
    grid-auto-flow:column;
    gap:8px;
    width:auto;
    padding:0;
    transform:none;
    border:0;
    background:transparent;
    box-shadow:none;
    pointer-events:none;
  }
  .game-screen .desktop-dock button {
    pointer-events:auto;
    display:grid;
    grid-template-rows:34px auto;
    place-items:center;
    gap:3px;
    width:var(--desktop-action-size);
    min-width:var(--desktop-action-size);
    height:var(--desktop-action-height);
    min-height:var(--desktop-action-height);
    padding:7px 5px 5px;
    border:1px solid rgba(132,191,211,.27);
    border-radius:17px;
    background:linear-gradient(155deg,rgba(8,43,57,.94),rgba(6,32,44,.91));
    color:#cde0e9;
    box-shadow:0 10px 24px rgba(0,21,32,.20),inset 0 1px rgba(255,255,255,.07);
    backdrop-filter:blur(13px) saturate(1.06);
    transition:transform .13s ease,border-color .13s ease,background .13s ease,color .13s ease,box-shadow .13s ease;
  }
  .game-screen .desktop-dock button::after { display:none; }
  .game-screen .desktop-dock button:hover {
    transform:translateY(-2px);
    border-color:rgba(84,194,241,.48);
    background:linear-gradient(155deg,rgba(12,59,78,.97),rgba(7,42,57,.95));
    color:#fff;
    box-shadow:0 13px 28px rgba(0,25,38,.26),inset 0 1px rgba(255,255,255,.09);
  }
  .game-screen .desktop-dock button:active { transform:translateY(0) scale(.965); }
  .game-screen .desktop-dock button.is-active,
  .game-screen .desktop-dock button.is-menu-open {
    border-color:rgba(76,189,239,.62);
    background:linear-gradient(155deg,rgba(24,137,196,.94),rgba(15,92,138,.92));
    color:#fff;
    box-shadow:0 12px 28px rgba(0,73,113,.26),inset 0 1px rgba(255,255,255,.15);
  }
  .game-screen .desktop-dock button > span {
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    border-radius:11px;
    background:rgba(255,255,255,.06);
  }
  .game-screen .desktop-dock button > span .ui-icon { width:21px;height:21px; }
  .game-screen .desktop-dock button > b {
    max-width:58px;
    overflow:hidden;
    font-size:7.2px;
    font-weight:800;
    line-height:1.05;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .game-screen .desktop-dock-chat > i {
    top:-5px;
    right:-5px;
  }

  /* Four secondary shortcuts stay above the dock and never compete with the main actions. */
  .game-screen .desktop-utility-rail {
    position:absolute;
    z-index:26;
    right:max(14px,env(safe-area-inset-right));
    bottom:calc(max(14px,env(safe-area-inset-bottom)) + 76px);
    display:grid;
    gap:7px;
    width:54px;
    pointer-events:none;
  }
  .game-screen .desktop-utility-rail button {
    position:relative;
    pointer-events:auto;
    display:grid;
    grid-template-rows:28px auto;
    place-items:center;
    gap:2px;
    width:54px;
    min-height:49px;
    padding:5px 3px 4px;
    border:1px solid rgba(132,191,211,.25);
    border-radius:15px;
    background:linear-gradient(155deg,rgba(8,43,57,.89),rgba(6,32,44,.86));
    color:#cfe1e9;
    box-shadow:0 8px 19px rgba(0,21,32,.17),inset 0 1px rgba(255,255,255,.06);
    backdrop-filter:blur(11px);
    transition:transform .12s ease,border-color .12s ease,background .12s ease;
  }
  .game-screen .desktop-utility-rail button:hover {
    transform:translateX(-2px);
    border-color:rgba(84,194,241,.45);
    background:linear-gradient(155deg,rgba(11,58,76,.94),rgba(7,41,56,.92));
  }
  .game-screen .desktop-utility-rail button > span {
    display:grid;
    place-items:center;
    width:27px;
    height:27px;
  }
  .game-screen .desktop-utility-rail .art-icon { width:27px;height:27px;object-fit:contain; }
  .game-screen .desktop-utility-rail button > b {
    max-width:48px;
    overflow:hidden;
    font-size:6.2px;
    font-weight:800;
    line-height:1;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  /* More menu opens up and to the left of the primary dock. */
  .game-screen .world-rail {
    left:auto;
    right:calc(max(14px,env(safe-area-inset-right)) + 72px);
    top:auto;
    bottom:calc(max(14px,env(safe-area-inset-bottom)) + 76px);
    width:278px;
    max-height:min(286px,calc(100vh - 120px));
    padding:8px;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:5px;
    overflow:auto;
    border-radius:17px;
  }

  /* The contextual action is visually dominant and stays centered. */
  .game-screen .context-action,
  .game-screen .interaction-card {
    left:50%;
    right:auto;
    bottom:max(16px,env(safe-area-inset-bottom));
  }
  .game-screen .interaction-card { width:min(420px,calc(100vw - 770px)); }
  .game-screen:has(.world-rail.is-desktop-menu-open) .context-action.is-ready { opacity:1; pointer-events:auto; }

  /* Desktop chat is intentionally openable as a compact lower-left tool window. */
  .game-screen .chat-panel {
    z-index:38;
    min-width:300px;
    min-height:250px;
    max-width:min(420px,calc(100vw - 420px));
    max-height:min(390px,calc(100vh - 150px));
    padding:10px 11px 11px;
    border:1px solid rgba(120,181,204,.24);
    border-radius:18px;
    background:rgba(6,38,49,var(--chat-opacity));
    color:#edf9fd;
    box-shadow:0 16px 38px rgba(0,22,33,.24),inset 0 1px rgba(255,255,255,.06);
    backdrop-filter:blur(14px) saturate(1.03);
  }
  .game-screen .chat-head { min-height:36px; }
  .game-screen .chat-head small { display:none; }
  .game-screen .chat-head b { margin:0;font-size:11px; }
  .game-screen .chat-head-actions { gap:4px; }
  .game-screen .chat-head-actions button {
    width:29px;
    height:29px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:9px;
    background:rgba(255,255,255,.06);
    color:#d8edf5;
  }
  .game-screen .chat-head-actions .chat-minimize span { font:900 15px/1 system-ui; }
  .game-screen .chat-tabs { gap:4px;margin:3px 0 6px; }
  .game-screen .chat-tabs button {
    min-height:28px;
    border:1px solid rgba(255,255,255,.07);
    background:rgba(255,255,255,.05);
    color:#a9c3cf;
    font-size:7px;
  }
  .game-screen .chat-tabs button.is-active {
    border-color:rgba(80,184,234,.32);
    background:rgba(43,139,188,.23);
    color:#e8f8ff;
  }
  .game-screen .chat-message { grid-template-columns:20px 1fr;gap:6px;margin:5px 0; }
  .game-screen .chat-message > i { width:20px;height:20px;border-radius:7px;background:rgba(83,177,222,.16);color:#77cbf1;font-size:7px; }
  .game-screen .chat-message b { color:#dceff7;font-size:.72em; }
  .game-screen .chat-message p { color:#c1d8e1;font-size:.75em;line-height:1.3; }
  .game-screen .chat-message time { color:#6f98aa; }
  .game-screen #chatForm { gap:5px;margin-top:5px; }
  .game-screen #chatForm input {
    min-height:34px;
    border:1px solid rgba(123,181,203,.18);
    border-radius:10px;
    background:rgba(255,255,255,.05);
    color:#eef9fd;
    font-size:8px;
  }
  .game-screen #chatForm button { width:34px;height:34px;border-radius:10px; }
  .game-screen .chat-panel.is-minimized {
    min-height:0!important;
    height:48px!important;
    max-height:48px!important;
    overflow:hidden;
  }
  .game-screen .chat-panel.is-minimized .chat-config,
  .game-screen .chat-panel.is-minimized .chat-tabs,
  .game-screen .chat-panel.is-minimized .chat-log,
  .game-screen .chat-panel.is-minimized #chatForm,
  .game-screen .chat-panel.is-minimized .chat-resize { display:none!important; }
  .game-screen .chat-panel.is-minimized .chat-head { min-height:27px;cursor:pointer; }

  /* Slightly quieter quest tracker so the world remains the main visual layer. */
  .game-screen .quest-widget {
    box-shadow:0 12px 26px rgba(0,25,35,.19),inset 0 1px rgba(255,255,255,.06);
  }

  html[data-game-theme="light"] .game-screen .player-chip,
  html[data-game-theme="light"] .game-screen .world-wallet-currency,
  html[data-game-theme="light"] .game-screen .desktop-dock button,
  html[data-game-theme="light"] .game-screen .desktop-utility-rail button {
    border-color:rgba(185,213,224,.92);
    background:rgba(249,253,255,.94);
    color:#355f77;
    box-shadow:0 9px 22px rgba(0,39,61,.12),inset 0 1px #fff;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button:hover,
  html[data-game-theme="light"] .game-screen .desktop-utility-rail button:hover {
    border-color:#aed9ea;
    background:#f0f9fd;
    color:#087fc5;
  }
  html[data-game-theme="light"] .game-screen .desktop-dock button.is-active,
  html[data-game-theme="light"] .game-screen .desktop-dock button.is-menu-open {
    border-color:#7fc8e8;
    background:linear-gradient(180deg,#def2fc,#eef9fd);
    color:#0779bd;
  }
  html[data-game-theme="light"] .game-screen .world-wallet-currency button {
    border-color:#d4e4ec;
    background:#edf5f9;
    color:#35677f;
  }
  html[data-game-theme="light"] .game-screen .chat-panel {
    border-color:rgba(181,211,224,.94);
    background:rgba(249,253,255,var(--chat-opacity));
    color:#173f57;
    box-shadow:0 15px 34px rgba(19,63,87,.15),inset 0 1px #fff;
  }
  html[data-game-theme="light"] .game-screen .chat-head-actions button,
  html[data-game-theme="light"] .game-screen .chat-tabs button {
    border-color:#d9e8ef;
    background:#eef6fa;
    color:#527187;
  }
  html[data-game-theme="light"] .game-screen .chat-tabs button.is-active { background:#dff2fb;color:#087bbf;border-color:#a8d8ec; }
  html[data-game-theme="light"] .game-screen .chat-message b { color:#1f4b62; }
  html[data-game-theme="light"] .game-screen .chat-message p { color:#58758a; }
  html[data-game-theme="light"] .game-screen #chatForm input { border-color:#d5e5ed;background:#f7fbfd;color:#173f57; }
}

/* Compact PC and tablet: reserve room instead of letting HUD layers overlap. */
@media (min-width:861px) and (max-width:1180px) {
  .game-screen .desktop-dock {
    --desktop-action-size:52px;
    --desktop-action-height:54px;
    gap:6px;
    right:max(9px,env(safe-area-inset-right));
    bottom:max(10px,env(safe-area-inset-bottom));
  }
  .game-screen .desktop-dock button { grid-template-rows:29px auto;padding:5px 3px 4px;border-radius:14px; }
  .game-screen .desktop-dock button > span { width:29px;height:29px;border-radius:9px; }
  .game-screen .desktop-dock button > span .ui-icon { width:18px;height:18px; }
  .game-screen .desktop-dock button > b { max-width:47px;font-size:6.2px; }
  .game-screen .desktop-utility-rail { right:max(9px,env(safe-area-inset-right));bottom:72px;width:46px;gap:5px; }
  .game-screen .desktop-utility-rail button { width:46px;min-height:43px;border-radius:13px;grid-template-rows:24px auto; }
  .game-screen .desktop-utility-rail .art-icon { width:23px;height:23px; }
  .game-screen .desktop-utility-rail button > b { font-size:5.4px; }
  .game-screen .world-rail { right:64px;bottom:72px;width:242px; }
  .game-screen .interaction-card { width:min(340px,calc(100vw - 690px)); }
  .game-screen .interaction-card__visual { width:52px;height:52px; }
  .game-screen .interaction-card__cta { min-width:126px;padding-right:11px; }
  .game-screen .world-wallet-currency { grid-template-columns:21px minmax(44px,auto) 22px;min-height:38px;gap:5px; }
  .game-screen .world-wallet-currency > i,.game-screen .world-wallet-currency > i .ui-icon { width:19px;height:19px; }
  .game-screen .chat-panel { max-width:340px;max-height:310px; }
}

@media (min-width:761px) and (max-width:860px) {
  .game-screen .desktop-dock {
    --desktop-action-size:44px;
    --desktop-action-height:48px;
    right:max(7px,env(safe-area-inset-right));
    bottom:max(8px,env(safe-area-inset-bottom));
    gap:4px;
  }
  .game-screen .desktop-dock button { grid-template-rows:24px auto;padding:4px 2px 3px;border-radius:12px; }
  .game-screen .desktop-dock button > span { width:24px;height:24px;border-radius:8px; }
  .game-screen .desktop-dock button > span .ui-icon { width:16px;height:16px; }
  .game-screen .desktop-dock button > b { max-width:40px;font-size:5.3px; }
  .game-screen .desktop-utility-rail { right:max(7px,env(safe-area-inset-right));bottom:62px;width:40px;gap:4px; }
  .game-screen .desktop-utility-rail button { width:40px;min-height:38px;padding:4px 2px;border-radius:11px;grid-template-rows:22px auto; }
  .game-screen .desktop-utility-rail .art-icon { width:21px;height:21px; }
  .game-screen .desktop-utility-rail button > b { display:none; }
  .game-screen .world-rail { right:52px;bottom:62px;width:222px;max-height:230px; }
  .game-screen .interaction-card {
    width:max(250px,calc(100vw - 490px));
    max-width:300px;
    min-height:68px;
    grid-template-columns:48px minmax(0,1fr) auto;
    gap:8px;
    padding:8px;
  }
  .game-screen .interaction-card__visual { width:46px;height:46px; }
  .game-screen .interaction-card__meta { display:none; }
  .game-screen .interaction-card__title { font-size:11px; }
  .game-screen .interaction-card__cta { min-width:110px;height:46px;padding:0 9px 0 7px;gap:6px; }
  .game-screen .interaction-card__key { width:32px;min-width:32px;height:32px;border-radius:8px;font-size:11px; }
  .game-screen .interaction-card__action-label { font-size:9px; }
  .game-screen .world-wallet { gap:5px; }
  .game-screen .world-wallet-currency { grid-template-columns:18px minmax(38px,auto) 20px;min-height:34px;padding:0 5px;gap:4px;border-radius:11px; }
  .game-screen .world-wallet-currency > i,.game-screen .world-wallet-currency > i .ui-icon { width:17px;height:17px; }
  .game-screen .world-wallet-currency b { font-size:8px; }
  .game-screen .world-wallet-currency button { width:20px;height:20px;border-radius:6px;font-size:13px; }
  .game-screen .player-chip { min-width:190px;min-height:52px;border-radius:16px; }
  .game-screen .player-chip-avatar { width:38px;height:38px;border-radius:12px; }
  .game-screen .chat-panel { max-width:300px;max-height:280px; }
}

@media (min-width:761px) and (max-height:680px) {
  .game-screen .desktop-utility-rail { bottom:58px; }
  .game-screen .world-rail { bottom:58px; }
  .game-screen .chat-panel { max-height:260px; }
}

@media (prefers-reduced-motion:reduce) {
  .game-screen .desktop-dock button,
  .game-screen .desktop-utility-rail button,
  .game-screen .world-wallet-currency button { transition:none!important; }
}

/* v2.7.51 — quest under minimap + trainer vitals card (desktop/tablet only) */
@media (min-width:761px) {
  .game-screen .player-chip {
    width:clamp(256px,19vw,294px);
    min-width:256px;
    min-height:90px;
    padding:8px 11px 8px 8px;
    gap:10px;
    border-radius:20px;
    align-items:flex-start;
  }
  .game-screen .player-chip-avatar {
    flex:0 0 auto;
    width:58px;
    height:58px;
    border:2px solid color-mix(in srgb,var(--role-color,#39aef4) 64%,#fff);
    border-radius:50%;
    box-shadow:0 0 0 3px color-mix(in srgb,var(--role-color,#39aef4) 16%,transparent),0 7px 16px rgba(0,25,38,.18);
    background-size:600% 800%;
  }
  .game-screen .player-chip-copy {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto auto auto;
    gap:3px;
    width:100%;
    min-width:0;
    padding-top:1px;
  }
  .game-screen .player-chip-identity {
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:8px;
    min-width:0;
  }
  .game-screen #worldPlayerName {
    display:block;
    max-width:none;
    min-width:0;
    overflow:hidden;
    color:inherit;
    font-size:11.5px;
    font-weight:850;
    line-height:1.1;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .game-screen #worldPlayerLevel {
    flex:0 0 auto;
    color:#b9d1dd;
    font-size:7.5px;
    font-style:normal;
    font-weight:850;
    white-space:nowrap;
  }
  .game-screen .player-community-role {
    position:absolute;
    left:7px;
    bottom:6px;
    z-index:2;
    max-width:55px;
    overflow:hidden;
    padding:2px 5px;
    border:1px solid color-mix(in srgb,var(--role-color,#39aef4) 42%,transparent);
    background:rgba(5,33,45,.88);
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .game-screen .player-connection {
    display:flex;
    align-items:center;
    min-width:0;
    margin:0;
    color:#8faab8;
    font-size:6.4px!important;
    line-height:1.05;
  }
  .game-screen .player-chip-progress {
    display:grid;
    grid-template-columns:26px minmax(0,1fr) 48px;
    align-items:center;
    gap:6px;
    min-width:0;
    margin-top:2px;
  }
  .game-screen .player-chip-progress > small,
  .game-screen .player-chip-resources small {
    margin:0;
    color:#9cb4c0;
    font-size:6px!important;
    font-weight:850;
    letter-spacing:.02em;
    text-transform:uppercase;
  }
  .game-screen .player-chip-progress > i,
  .game-screen .player-chip-resources i {
    position:relative;
    display:block;
    height:5px;
    overflow:hidden;
    border-radius:999px;
    background:rgba(255,255,255,.11);
  }
  .game-screen .player-chip-progress > i > b,
  .game-screen .player-chip-resources i > b {
    position:absolute;
    inset:0 auto 0 0;
    width:0;
    border-radius:inherit;
    transition:width .22s ease;
  }
  .game-screen .player-chip-progress.is-exp > i > b {
    background:linear-gradient(90deg,#238ee9,#59c9ff);
    box-shadow:0 0 7px rgba(64,179,245,.38);
  }
  .game-screen .player-chip-progress > em,
  .game-screen .player-chip-resources em {
    color:#c7dbe4;
    font-size:6.2px;
    font-style:normal;
    font-weight:780;
    font-variant-numeric:tabular-nums;
    text-align:right;
    white-space:nowrap;
  }
  .game-screen .player-chip-resources {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
  }
  .game-screen .player-chip-resources > span {
    display:grid;
    grid-template-columns:28px minmax(0,1fr) 20px;
    align-items:center;
    gap:4px;
    min-width:0;
  }
  .game-screen .player-chip-resources .is-stamina i > b {
    background:linear-gradient(90deg,#55bf3e,#a4dc36);
  }
  .game-screen .player-chip-resources .is-energy i > b {
    background:linear-gradient(90deg,#f1b62c,#ffd84d);
  }
  .game-screen .player-chip.is-tired .player-chip-resources .is-stamina i > b {
    background:linear-gradient(90deg,#e66e33,#f2a83b);
  }
  .game-screen .player-chip.is-low-energy .player-chip-resources .is-energy i > b {
    background:linear-gradient(90deg,#dc5845,#ee8a42);
  }

  /* Current objective belongs to the minimap cluster, not the player profile. */
  .game-screen .quest-widget {
    --quest-card-width:286px;
    left:auto;
    right:max(14px,env(safe-area-inset-right));
    top:calc(max(14px,env(safe-area-inset-top)) + 216px);
    width:var(--quest-card-width);
    max-height:190px;
    padding:10px 11px 11px;
    gap:5px;
    border-radius:16px;
    transition:opacity .14s ease,transform .14s ease,border-color .14s ease,box-shadow .14s ease;
  }
  .game-screen .quest-widget > #questWidgetTitle { font-size:13.5px; }
  .game-screen .quest-widget-target { grid-template-columns:30px minmax(0,1fr);padding:5px 7px 5px 5px; }
  .game-screen .quest-widget-target-icon { width:28px;height:28px;border-radius:8px; }
  .game-screen .quest-widget-target b { font-size:8.8px; }
  .game-screen .quest-widget-progress-copy strong { font-size:7.5px; }
  .game-screen .quest-widget-progress-copy em { font-size:6.5px; }
  .game-screen:has(.world-minimap.is-channel-open) .quest-widget {
    opacity:0;
    transform:translateY(7px);
    pointer-events:none;
  }

  html[data-game-theme="light"] .game-screen .player-chip {
    border-color:rgba(185,213,224,.95);
    background:rgba(249,253,255,.96);
    color:#173f57;
    box-shadow:0 11px 27px rgba(24,66,88,.14),inset 0 1px #fff;
  }
  html[data-game-theme="light"] .game-screen #worldPlayerLevel { color:#496f84; }
  html[data-game-theme="light"] .game-screen .player-connection,
  html[data-game-theme="light"] .game-screen .player-chip-progress > small,
  html[data-game-theme="light"] .game-screen .player-chip-resources small { color:#678697; }
  html[data-game-theme="light"] .game-screen .player-chip-progress > i,
  html[data-game-theme="light"] .game-screen .player-chip-resources i { background:#dce9ef; }
  html[data-game-theme="light"] .game-screen .player-chip-progress > em,
  html[data-game-theme="light"] .game-screen .player-chip-resources em { color:#486c80; }
  html[data-game-theme="light"] .game-screen .player-community-role { background:rgba(249,253,255,.94); }
}

@media (min-width:761px) and (max-width:1180px) {
  .game-screen .player-chip {
    width:236px;
    min-width:236px;
    min-height:78px;
    padding:7px 9px 7px 7px;
  }
  .game-screen .player-chip-avatar { width:48px;height:48px; }
  .game-screen #worldPlayerName { font-size:10px; }
  .game-screen #worldPlayerLevel { font-size:6.7px; }
  .game-screen .player-chip-progress { grid-template-columns:22px minmax(0,1fr) 40px;gap:4px; }
  .game-screen .player-chip-resources { gap:5px; }
  .game-screen .player-chip-resources > span { grid-template-columns:22px minmax(0,1fr) 18px;gap:3px; }
  .game-screen .player-chip-progress > small,
  .game-screen .player-chip-resources small,
  .game-screen .player-chip-progress > em,
  .game-screen .player-chip-resources em { font-size:5.4px!important; }
  .game-screen .quest-widget {
    --quest-card-width:252px;
    top:calc(max(10px,env(safe-area-inset-top)) + 216px);
    right:max(10px,env(safe-area-inset-right));
  }
}

@media (min-width:761px) and (max-height:720px) {
  .game-screen .quest-widget {
    top:calc(max(8px,env(safe-area-inset-top)) + 210px);
    max-height:166px;
  }
  .game-screen .quest-widget > #questWidgetTitle { font-size:12.5px; }
}

/* v2.7.52 — desktop social chat rebuild. Mobile chat layout intentionally unchanged. */
@media (min-width:761px) {
  .game-screen .chat-panel {
    --chat-accent:#35aee8;
    min-width:340px;
    min-height:290px;
    max-width:min(540px,calc(100vw - 380px));
    max-height:min(500px,calc(100vh - 118px));
    padding:12px;
    grid-template-rows:auto auto auto minmax(0,1fr) auto;
    gap:7px;
    border:1px solid rgba(119,183,207,.27);
    border-radius:20px;
    background:rgba(6,36,48,var(--chat-opacity));
    box-shadow:0 18px 44px rgba(0,19,31,.27),inset 0 1px rgba(255,255,255,.07);
    backdrop-filter:blur(17px) saturate(1.08);
    overflow:hidden;
  }
  .game-screen .chat-head {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto auto;
    align-items:center;
    gap:8px;
    min-height:40px;
    padding:0 1px 2px;
    cursor:grab;
  }
  .game-screen .chat-head:active { cursor:grabbing; }
  .game-screen .chat-title-copy {
    display:grid;
    align-content:center;
    gap:2px;
    min-width:0;
  }
  .game-screen .chat-title-copy > b {
    margin:0;
    color:#eefaff;
    font-size:13px;
    font-weight:850;
    line-height:1.1;
    letter-spacing:-.01em;
  }
  .game-screen .chat-title-copy > small {
    display:flex!important;
    align-items:center;
    gap:5px;
    margin:0;
    color:#8fb1c0!important;
    font-size:7.5px!important;
    font-weight:750;
    letter-spacing:0;
    text-transform:none;
  }
  .game-screen .chat-title-copy > small > i {
    display:block;
    width:6px;
    height:6px;
    border-radius:50%;
    background:#50d889;
    box-shadow:0 0 0 3px rgba(80,216,137,.10);
  }
  .game-screen .chat-head-unread {
    display:grid;
    place-items:center;
    min-width:23px;
    height:23px;
    padding:0 7px;
    border-radius:999px;
    background:#ec5b68;
    color:#fff;
    font:850 8px/1 system-ui,sans-serif;
    box-shadow:0 5px 12px rgba(157,33,50,.25);
  }
  .game-screen .chat-head-unread[hidden] { display:none!important; }
  .game-screen .chat-head-actions { display:flex;gap:5px; }
  .game-screen .chat-head-actions button {
    width:31px;
    height:31px;
    border:1px solid rgba(148,199,218,.12);
    border-radius:10px;
    background:rgba(255,255,255,.055);
    color:#d7edf5;
    transition:transform .12s ease,background .12s ease,border-color .12s ease;
  }
  .game-screen .chat-head-actions button:hover {
    border-color:rgba(81,183,231,.35);
    background:rgba(55,147,190,.18);
  }
  .game-screen .chat-head-actions button:active { transform:scale(.93); }
  .game-screen .chat-head-actions .chat-minimize span { font:900 16px/1 system-ui; }

  .game-screen .chat-tabs {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:5px;
    margin:0;
    padding:3px;
    border:1px solid rgba(138,193,214,.10);
    border-radius:12px;
    background:rgba(255,255,255,.035);
  }
  .game-screen .chat-tabs button {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:31px;
    padding:0 9px;
    border:0;
    border-radius:9px;
    background:transparent;
    color:#8fabba;
    font-size:8px;
    font-weight:800;
  }
  .game-screen .chat-tabs button:hover { color:#d8edf5;background:rgba(255,255,255,.045); }
  .game-screen .chat-tabs button.is-active {
    border:0;
    background:rgba(46,151,201,.20);
    color:#eaf9ff;
    box-shadow:inset 0 0 0 1px rgba(77,182,232,.22);
  }
  .game-screen .chat-tabs button > i {
    display:grid;
    place-items:center;
    min-width:18px;
    height:18px;
    padding:0 5px;
    border-radius:999px;
    background:#e85766;
    color:#fff;
    font:850 7px/1 system-ui,sans-serif;
  }
  .game-screen .chat-tabs button > i[hidden] { display:none!important; }

  .game-screen .chat-log-wrap {
    position:relative;
    min-height:0;
    overflow:hidden;
    border:1px solid rgba(134,190,211,.09);
    border-radius:13px;
    background:rgba(0,0,0,.055);
  }
  .game-screen .chat-log {
    height:100%;
    min-height:0;
    padding:8px 8px 12px;
    overflow:hidden auto;
    overscroll-behavior:contain;
    scrollbar-width:thin;
    scrollbar-color:rgba(115,171,193,.28) transparent;
  }
  .game-screen .chat-message {
    display:grid;
    grid-template-columns:30px minmax(0,1fr);
    gap:8px;
    align-items:start;
    margin:2px 0;
    padding:6px;
    border-radius:11px;
    transition:background .12s ease;
  }
  .game-screen .chat-message:hover { background:rgba(255,255,255,.035); }
  .game-screen .chat-message-avatar {
    display:block;
    width:30px;
    height:30px;
    flex:0 0 30px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.20);
    border-radius:50%;
    background:#143f56 url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png') 0 0/600% 800% no-repeat;
    color:transparent;
    box-shadow:0 0 0 2px rgba(61,163,210,.10);
  }
  .game-screen .chat-message-avatar[data-skin="female"] { background-image:url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png'); }
  .game-screen .chat-message-avatar.is-system {
    display:grid;
    place-items:center;
    border-color:rgba(85,187,232,.22);
    background:rgba(46,151,201,.18);
    color:#72c9f1;
    font:900 9px/1 system-ui,sans-serif;
  }
  .game-screen .chat-message-body { min-width:0; }
  .game-screen .chat-message-meta {
    display:flex;
    align-items:baseline;
    gap:7px;
    min-width:0;
  }
  .game-screen .chat-message-meta b {
    overflow:hidden;
    color:#e4f4fa;
    font-size:8.5px;
    font-weight:850;
    line-height:1.2;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .game-screen .chat-message-meta time {
    flex:0 0 auto;
    margin:0;
    color:#668d9f;
    font-size:6.5px;
    font-weight:700;
  }
  .game-screen .chat-message p {
    display:inline-block;
    max-width:100%;
    margin:3px 0 0;
    padding:5px 7px;
    border-radius:3px 9px 9px 9px;
    background:rgba(255,255,255,.045);
    color:#bfd6df;
    font-size:8.5px;
    line-height:1.38;
    overflow-wrap:anywhere;
  }
  .game-screen .chat-message.is-self p {
    background:rgba(31,137,188,.18);
    color:#dff4fc;
    box-shadow:inset 0 0 0 1px rgba(66,176,225,.10);
  }
  .game-screen .chat-message.is-system {
    grid-template-columns:24px minmax(0,1fr);
    margin:5px 0;
    padding:5px 7px;
    background:rgba(67,159,200,.07);
  }
  .game-screen .chat-message.is-system .chat-message-avatar { width:24px;height:24px; }
  .game-screen .chat-message.is-system p { padding:0;background:none;color:#8db2c2;font-style:italic; }

  .game-screen .chat-jump-latest {
    position:absolute;
    z-index:3;
    right:9px;
    bottom:9px;
    min-height:27px;
    padding:0 10px;
    border:1px solid rgba(92,190,235,.30);
    border-radius:999px;
    background:rgba(17,101,143,.93);
    color:#effaff;
    box-shadow:0 7px 18px rgba(0,38,59,.25);
    font-size:7px;
    font-weight:850;
  }
  .game-screen .chat-jump-latest[hidden] { display:none!important; }

  .game-screen #chatForm {
    display:grid;
    grid-template-columns:minmax(0,1fr) 37px;
    gap:6px;
    margin:0;
    padding:5px;
    border:1px solid rgba(137,192,212,.11);
    border-radius:13px;
    background:rgba(255,255,255,.04);
  }
  .game-screen #chatForm input {
    min-width:0;
    min-height:35px;
    padding:0 10px;
    border:0!important;
    outline:0;
    background:transparent!important;
    color:#effaff;
    font-size:8.5px;
  }
  .game-screen #chatForm input::placeholder { color:#6f96a7; }
  .game-screen #chatForm button {
    display:grid;
    place-items:center;
    width:37px;
    height:35px;
    border:0;
    border-radius:10px;
    background:linear-gradient(145deg,#28a8e4,#147eb8);
    color:white;
    box-shadow:0 7px 15px rgba(11,111,163,.23);
  }
  .game-screen #chatForm button:hover { filter:brightness(1.07); }
  .game-screen #chatForm button:active { transform:scale(.94); }

  .game-screen .chat-config {
    margin:0;
    padding:9px;
    border-color:rgba(132,190,212,.12);
    background:rgba(255,255,255,.045);
  }
  .game-screen .chat-resize {
    right:4px;
    bottom:4px;
    width:24px;
    height:24px;
    opacity:.58;
  }
  .game-screen .chat-resize:hover { opacity:1; }

  /* Minimized chat docks to the same bottom baseline as the five primary HUD buttons. */
  .game-screen .chat-panel.is-minimized {
    left:max(14px,env(safe-area-inset-left))!important;
    right:auto!important;
    top:auto!important;
    bottom:max(14px,env(safe-area-inset-bottom))!important;
    width:min(350px,calc(100vw - 410px))!important;
    min-width:250px!important;
    height:64px!important;
    min-height:64px!important;
    max-height:64px!important;
    padding:8px 10px!important;
    grid-template-rows:1fr!important;
    border-radius:17px;
    transform:none!important;
    cursor:pointer;
  }
  .game-screen .chat-panel.is-minimized .chat-head {
    min-height:46px;
    padding:0;
    cursor:pointer;
  }
  .game-screen .chat-panel.is-minimized .chat-title-copy > b { font-size:11px; }
  .game-screen .chat-panel.is-minimized .chat-title-copy > small { font-size:7px!important; }
  .game-screen .chat-panel.is-minimized [data-toggle-chat-settings],
  .game-screen .chat-panel.is-minimized [data-close-chat] { display:none!important; }
  .game-screen .chat-panel.is-minimized .chat-minimize { width:34px;height:34px; }
  .game-screen .chat-panel.is-minimized .chat-config,
  .game-screen .chat-panel.is-minimized .chat-tabs,
  .game-screen .chat-panel.is-minimized .chat-log-wrap,
  .game-screen .chat-panel.is-minimized #chatForm,
  .game-screen .chat-panel.is-minimized .chat-resize { display:none!important; }

  html[data-game-theme="light"] .game-screen .chat-panel {
    --chat-accent:#168bc9;
    border-color:rgba(182,211,224,.94);
    background:rgba(249,253,255,var(--chat-opacity));
    color:#173f57;
    box-shadow:0 17px 39px rgba(16,59,82,.15),inset 0 1px #fff;
  }
  html[data-game-theme="light"] .game-screen .chat-title-copy > b { color:#173f57; }
  html[data-game-theme="light"] .game-screen .chat-title-copy > small { color:#6f8b9d!important; }
  html[data-game-theme="light"] .game-screen .chat-head-actions button { border-color:#dce9ef;background:#f0f7fa;color:#527187; }
  html[data-game-theme="light"] .game-screen .chat-tabs { border-color:#dce9ef;background:#f4f9fb; }
  html[data-game-theme="light"] .game-screen .chat-tabs button { color:#6b8495; }
  html[data-game-theme="light"] .game-screen .chat-tabs button:hover { color:#176d9a;background:#eaf5fa; }
  html[data-game-theme="light"] .game-screen .chat-tabs button.is-active { background:#dff2fb;color:#087bbf;box-shadow:inset 0 0 0 1px #add9ec; }
  html[data-game-theme="light"] .game-screen .chat-log-wrap { border-color:#e0ebf0;background:#f8fbfd; }
  html[data-game-theme="light"] .game-screen .chat-message:hover { background:#eff7fa; }
  html[data-game-theme="light"] .game-screen .chat-message-avatar { border-color:#d7e6ed;box-shadow:0 0 0 2px #edf6fa; }
  html[data-game-theme="light"] .game-screen .chat-message-meta b { color:#244f66; }
  html[data-game-theme="light"] .game-screen .chat-message-meta time { color:#91a4af; }
  html[data-game-theme="light"] .game-screen .chat-message p { background:#eef5f8;color:#4f6f82; }
  html[data-game-theme="light"] .game-screen .chat-message.is-self p { background:#e0f2fb;color:#25617f;box-shadow:inset 0 0 0 1px #c9e7f5; }
  html[data-game-theme="light"] .game-screen .chat-message.is-system { background:#f0f8fb; }
  html[data-game-theme="light"] .game-screen .chat-message.is-system p { color:#668799; }
  html[data-game-theme="light"] .game-screen #chatForm { border-color:#dce9ef;background:#f6fafc; }
  html[data-game-theme="light"] .game-screen #chatForm input { color:#173f57; }
  html[data-game-theme="light"] .game-screen #chatForm input::placeholder { color:#92a7b3; }
  html[data-game-theme="light"] .game-screen .chat-config { border-color:#dce9ef;background:#f4f9fb; }
}

@media (min-width:861px) and (max-width:1180px) {
  .game-screen .chat-panel.is-minimized {
    left:max(10px,env(safe-area-inset-left))!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    width:min(300px,calc(100vw - 330px))!important;
    height:54px!important;
    min-height:54px!important;
    max-height:54px!important;
    padding:6px 9px!important;
  }
  .game-screen .chat-panel.is-minimized .chat-head { min-height:40px; }
  .game-screen .chat-panel { max-width:min(430px,calc(100vw - 300px));max-height:min(390px,calc(100vh - 100px)); }
}

@media (min-width:761px) and (max-width:860px) {
  .game-screen .chat-panel.is-minimized {
    left:max(8px,env(safe-area-inset-left))!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    width:min(260px,calc(100vw - 245px))!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    padding:5px 8px!important;
  }
  .game-screen .chat-panel.is-minimized .chat-head { min-height:36px; }
  .game-screen .chat-panel.is-minimized .chat-title-copy > small { display:none!important; }
  .game-screen .chat-panel { max-width:min(380px,calc(100vw - 240px));max-height:min(350px,calc(100vh - 90px)); }
}

@media (max-width:760px) {
  /* HTML wrapper added in v2.7.52 must remain transparent to the existing phone layout. */
  .game-screen .chat-log-wrap { position:relative;min-height:0;overflow:hidden; }
  .game-screen .chat-log-wrap .chat-log { height:100%;min-height:0;overflow:hidden auto; }
  .game-screen .chat-jump-latest {
    position:absolute;
    right:8px;
    bottom:8px;
    min-height:28px;
    padding:0 10px;
    border:0;
    border-radius:999px;
    background:rgba(19,117,171,.94);
    color:#fff;
    font-size:8px;
    font-weight:850;
  }
  .game-screen .chat-jump-latest[hidden],
  .game-screen .chat-head-unread[hidden],
  .game-screen .chat-tabs button > i[hidden] { display:none!important; }
}

/* v2.7.53 — BookiePark messenger chat. Desktop social center, mobile kept compact. */
@media (min-width:761px) {
  .game-screen .chat-panel.chat-messenger {
    --chat-world:#1d9bf0;
    --chat-trade:#32ad72;
    --chat-clan:#8a63e8;
    --chat-players:#ec9a35;
    min-width:500px;
    min-height:400px;
    max-width:min(760px,calc(100vw - 330px));
    max-height:min(620px,calc(100vh - 96px));
    padding:12px;
    grid-template-rows:auto auto auto minmax(0,1fr);
    gap:8px;
    border-radius:22px;
    overflow:hidden;
  }
  .game-screen .chat-title-icon {
    display:inline-grid;
    place-items:center;
    width:18px;
    height:18px;
    margin-right:7px;
    border-radius:7px;
    background:color-mix(in srgb,var(--chat-world) 16%,transparent);
    vertical-align:middle;
  }
  .game-screen .chat-title-icon .ui-icon { width:12px;height:12px; }
  .game-screen .chat-title-copy > b { display:flex;align-items:center;font-size:14px; }
  .game-screen .chat-head-actions button { width:33px;height:33px;border-radius:11px; }
  .game-screen .chat-head-actions [data-chat-search-toggle] .ui-icon { width:15px;height:15px; }

  .game-screen .chat-search-bar {
    display:grid;
    grid-template-columns:20px minmax(0,1fr) 28px;
    align-items:center;
    gap:7px;
    min-height:39px;
    padding:4px 5px 4px 10px;
    border:1px solid rgba(137,192,212,.14);
    border-radius:12px;
    background:rgba(255,255,255,.045);
  }
  .game-screen .chat-search-bar[hidden] { display:none!important; }
  .game-screen .chat-search-bar > span .ui-icon { width:15px;height:15px;opacity:.7; }
  .game-screen .chat-search-bar input {
    min-width:0;
    height:30px;
    border:0;
    outline:0;
    background:transparent;
    color:#e8f6fb;
    font:700 9px/1.2 system-ui,sans-serif;
  }
  .game-screen .chat-search-bar button {
    display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:9px;background:transparent;color:#8fb0bf;
  }
  .game-screen .chat-search-bar button:hover { background:rgba(255,255,255,.06);color:#fff; }

  .game-screen .chat-tabs {
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:5px;
    padding:3px;
  }
  .game-screen .chat-tabs button {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-width:0;
    min-height:37px;
    padding:0 7px;
    border-radius:9px;
    font-size:8px;
  }
  .game-screen .chat-tabs .chat-tab-icon {
    display:grid;
    place-items:center;
    width:17px;
    height:17px;
    color:currentColor;
    font-size:11px;
  }
  .game-screen .chat-tabs .chat-tab-icon .ui-icon { width:14px;height:14px; }
  .game-screen .chat-tabs button.channel-world.is-active { color:#e8f8ff;background:color-mix(in srgb,var(--chat-world) 30%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--chat-world) 48%,transparent); }
  .game-screen .chat-tabs button.channel-trade.is-active { color:#eafff3;background:color-mix(in srgb,var(--chat-trade) 28%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--chat-trade) 46%,transparent); }
  .game-screen .chat-tabs button.channel-clan.is-active { color:#f4edff;background:color-mix(in srgb,var(--chat-clan) 28%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--chat-clan) 46%,transparent); }
  .game-screen .chat-tabs button.channel-players.is-active { color:#fff5e7;background:color-mix(in srgb,var(--chat-players) 28%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--chat-players) 46%,transparent); }

  .game-screen .chat-config {
    position:absolute;
    z-index:12;
    top:58px;
    right:12px;
    width:min(390px,calc(100% - 24px));
    max-height:min(390px,calc(100% - 76px));
    overflow:auto;
    grid-template-columns:1fr 1fr;
    gap:9px 12px;
    padding:13px;
    border-radius:16px;
    box-shadow:0 16px 38px rgba(0,18,30,.28);
  }
  .game-screen .chat-config .chat-channel-visibility {
    grid-column:1/-1;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:7px;
    margin:0;
    padding:9px;
    border:1px solid rgba(137,192,212,.14);
    border-radius:12px;
  }
  .game-screen .chat-config .chat-channel-visibility legend { padding:0 5px;color:#7fa2b2;font-size:7px;font-weight:850; }
  .game-screen .chat-config .chat-channel-visibility label { display:flex;align-items:center;gap:5px;color:#b6ced8;font-size:8px;font-weight:750; }

  .game-screen .chat-messenger-layout {
    display:grid;
    grid-template-columns:minmax(0,3.15fr) minmax(135px,1fr);
    min-height:0;
    overflow:hidden;
    border:1px solid rgba(137,192,212,.11);
    border-radius:15px;
    background:rgba(0,0,0,.045);
  }
  .game-screen .chat-conversation {
    position:relative;
    display:grid;
    grid-template-rows:auto minmax(0,1fr) auto auto;
    min-width:0;
    min-height:0;
    padding:7px;
    border-right:1px solid rgba(137,192,212,.10);
  }
  .game-screen .chat-private-head {
    display:grid;
    grid-template-columns:28px 30px minmax(0,1fr) auto;
    align-items:center;
    gap:7px;
    min-height:43px;
    margin:-1px -1px 6px;
    padding:5px 6px;
    border-radius:11px;
    background:rgba(255,255,255,.045);
  }
  .game-screen .chat-private-head[hidden] { display:none!important; }
  .game-screen .chat-private-head > button:first-child { width:28px;height:28px;border:0;border-radius:9px;background:rgba(255,255,255,.05);color:#bcd4de; }
  .game-screen .chat-private-head > button:last-child { min-height:27px;padding:0 9px;border:1px solid rgba(117,185,214,.18);border-radius:8px;background:transparent;color:#a8c6d3;font-size:7px;font-weight:850; }
  .game-screen .chat-private-head > span:nth-of-type(2) { display:grid;gap:1px;min-width:0; }
  .game-screen .chat-private-head b { overflow:hidden;color:#e6f5fb;font-size:9px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-private-head small { color:#5bd18e;font-size:6.5px;font-weight:750; }
  .game-screen .chat-private-avatar,
  .game-screen .chat-player-avatar {
    position:relative;
    display:block;
    width:30px;
    height:30px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.20);
    border-radius:50%;
    background:#143f56 url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png') 0 0/600% 800% no-repeat;
    box-shadow:0 0 0 2px rgba(64,163,207,.10);
  }
  .game-screen .chat-private-avatar[data-skin="female"],
  .game-screen .chat-player-avatar[data-skin="female"] { background-image:url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png'); }

  .game-screen .chat-log-wrap {
    min-height:0;
    border:0;
    border-radius:0;
    background:transparent;
  }
  .game-screen .chat-log { padding:3px 4px 10px; }
  .game-screen .chat-message {
    position:relative;
    grid-template-columns:30px minmax(0,1fr) 24px;
    gap:8px;
    margin:1px 0;
    padding:6px 4px;
    border-radius:10px;
  }
  .game-screen .chat-message:hover { background:rgba(255,255,255,.035); }
  .game-screen .chat-message-avatar { appearance:none;padding:0;cursor:pointer; }
  .game-screen .chat-message-body { min-width:0; }
  .game-screen .chat-message-meta { gap:6px;min-height:15px; }
  .game-screen .chat-author-button {
    max-width:160px;
    overflow:hidden;
    padding:0;
    border:0;
    background:transparent;
    color:#e5f5fb;
    font:850 8.5px/1.2 system-ui,sans-serif;
    text-align:left;
    text-overflow:ellipsis;
    white-space:nowrap;
    cursor:pointer;
  }
  .game-screen .chat-author-button:hover { text-decoration:underline; }
  .game-screen .chat-message-meta > small { color:#698b9b;font-size:6px; }
  .game-screen .chat-message p {
    display:block;
    width:fit-content;
    max-width:100%;
    margin:2px 0 0;
    padding:3px 0;
    border-radius:0;
    background:transparent;
    color:#bfd6df;
    font-size:8.3px;
    line-height:1.42;
  }
  .game-screen .chat-message.is-self p { background:transparent;color:#d9edf5;box-shadow:none; }
  .game-screen .chat-message p mark { padding:1px 3px;border-radius:4px;background:rgba(236,157,54,.24);color:#ffd998; }
  .game-screen .chat-message.is-mentioned { background:rgba(235,149,42,.07);box-shadow:inset 2px 0 #e9a43f; }
  .game-screen .chat-message-more {
    align-self:start;
    opacity:0;
    display:grid;
    place-items:center;
    width:24px;
    height:22px;
    padding:0;
    border:0;
    border-radius:7px;
    background:transparent;
    color:#6d91a0;
    font-size:8px;
    transition:opacity .12s,background .12s;
  }
  .game-screen .chat-message:hover .chat-message-more { opacity:1; }
  .game-screen .chat-message-more:hover { background:rgba(255,255,255,.06);color:#d5eaf3; }
  .game-screen .chat-channel-chip {
    display:inline-flex;
    align-items:center;
    min-height:15px;
    padding:0 5px;
    border-radius:999px;
    font-size:5.7px;
    font-style:normal;
    font-weight:850;
  }
  .game-screen .chat-channel-chip.is-trade { background:rgba(50,173,114,.13);color:#68dda0; }
  .game-screen .chat-channel-chip.is-private { background:rgba(228,75,99,.13);color:#ff8397; }
  .game-screen .chat-message-reply-ref {
    display:grid;
    gap:1px;
    max-width:90%;
    margin:3px 0 1px;
    padding:4px 7px;
    border:0;
    border-left:2px solid rgba(49,158,211,.65);
    border-radius:0 7px 7px 0;
    background:rgba(53,153,198,.07);
    color:#809ead;
    text-align:left;
  }
  .game-screen .chat-message-reply-ref b { color:#79c9ed;font-size:6.5px; }
  .game-screen .chat-message-reply-ref span { overflow:hidden;font-size:6.5px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-message-attachment {
    display:flex;
    align-items:center;
    gap:6px;
    max-width:230px;
    margin-top:5px;
    padding:6px 8px;
    border:1px solid rgba(116,183,210,.15);
    border-radius:9px;
    background:rgba(255,255,255,.035);
    color:#b9d2dd;
  }
  .game-screen .chat-message-attachment > span { color:#6dc5ef; }
  .game-screen .chat-message-attachment b { overflow:hidden;font-size:7px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-message-attachment em { margin-left:auto;font-size:6px;font-style:normal; }
  .game-screen .chat-trade-actions { display:flex;gap:5px;margin-top:6px; }
  .game-screen .chat-trade-actions button { min-height:25px;padding:0 8px;border:1px solid rgba(66,184,125,.20);border-radius:8px;background:rgba(50,173,114,.08);color:#7fe0ab;font-size:6.5px;font-weight:850; }
  .game-screen .chat-message.is-trade-message { margin:4px 0;border:1px solid rgba(50,173,114,.10);background:rgba(50,173,114,.035); }
  .game-screen .chat-message.is-clan-message.is-leader-message { box-shadow:inset 2px 0 var(--chat-clan);background:rgba(138,99,232,.045); }
  .game-screen .chat-message.is-system { grid-template-columns:24px minmax(0,1fr);margin:4px 0;padding:5px 6px; }
  .game-screen .chat-message.is-system .chat-message-body p { color:#83a9b9;font-size:7.6px;font-style:normal; }
  .game-screen .chat-deleted-copy { color:#698896;font-size:7px;font-style:italic; }
  .game-screen .chat-message.is-flashed { animation:chat-message-flash .9s ease; }
  @keyframes chat-message-flash { 0%,100%{background:transparent} 35%{background:rgba(38,165,224,.18)} }

  .game-screen .chat-reply-preview {
    display:grid;
    grid-template-columns:minmax(0,1fr) 28px;
    gap:7px;
    align-items:center;
    margin:3px 0 4px;
    padding:6px 7px 6px 9px;
    border-left:2px solid var(--chat-world);
    border-radius:7px;
    background:rgba(41,146,195,.07);
  }
  .game-screen .chat-reply-preview[hidden] { display:none!important; }
  .game-screen .chat-reply-preview > span { display:grid;grid-template-columns:auto minmax(0,1fr);gap:1px 6px;min-width:0; }
  .game-screen .chat-reply-preview small { grid-column:1/-1;color:#54b9e8;font-size:5.5px;font-weight:900;text-transform:uppercase; }
  .game-screen .chat-reply-preview b { color:#b9d4df;font-size:7px; }
  .game-screen .chat-reply-preview em { overflow:hidden;color:#7899a7;font-size:7px;font-style:normal;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-reply-preview button { display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:8px;background:transparent;color:#7e9ba8; }
  .game-screen .chat-reply-preview button .ui-icon { width:12px;height:12px; }

  .game-screen #chatForm {
    position:relative;
    grid-template-columns:30px 30px minmax(0,1fr) 38px;
    align-items:end;
    gap:4px;
    min-height:47px;
    padding:5px;
    border-radius:12px;
  }
  .game-screen #chatForm[hidden] { display:none!important; }
  .game-screen #chatForm textarea {
    display:block;
    width:100%;
    min-width:0;
    min-height:36px;
    max-height:92px;
    padding:10px 7px 7px;
    resize:none;
    border:0;
    outline:0;
    background:transparent;
    color:#ecf8fc;
    font:700 8.5px/1.35 system-ui,sans-serif;
  }
  .game-screen #chatForm textarea::placeholder { color:#6f94a4; }
  .game-screen .chat-composer-tool {
    display:grid;
    place-items:center;
    width:30px;
    height:36px;
    padding:0;
    border:0;
    border-radius:9px;
    background:transparent;
    color:#86a6b3;
    font-size:14px;
  }
  .game-screen .chat-composer-tool:hover { background:rgba(255,255,255,.055);color:#d7ebf3; }
  .game-screen .chat-send-button { width:38px!important;height:36px!important; }
  .game-screen .chat-emoji-panel {
    position:absolute;
    z-index:8;
    left:8px;
    bottom:58px;
    display:grid;
    grid-template-columns:repeat(6,30px);
    gap:3px;
    padding:7px;
    border:1px solid rgba(133,190,212,.16);
    border-radius:12px;
    background:rgba(8,42,55,.98);
    box-shadow:0 14px 30px rgba(0,19,31,.30);
  }
  .game-screen .chat-emoji-panel[hidden] { display:none!important; }
  .game-screen .chat-emoji-panel button { width:30px;height:30px;border:0;border-radius:8px;background:transparent;font-size:15px; }
  .game-screen .chat-emoji-panel button:hover { background:rgba(255,255,255,.07); }

  .game-screen .chat-online-sidebar {
    display:grid;
    grid-template-rows:auto auto minmax(0,1fr) auto;
    min-width:0;
    min-height:0;
    padding:8px 7px 7px;
    background:rgba(255,255,255,.022);
  }
  .game-screen .chat-online-sidebar > header { display:flex;align-items:center;justify-content:space-between;gap:5px;min-height:31px;padding:0 3px 5px; }
  .game-screen .chat-online-sidebar > header > span { display:flex;align-items:center;gap:5px;min-width:0; }
  .game-screen .chat-online-sidebar > header b { overflow:hidden;color:#c9e0e8;font-size:7.3px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-online-sidebar > header small { display:grid;place-items:center;min-width:19px;height:18px;padding:0 5px;border-radius:999px;background:rgba(48,176,111,.12);color:#67d99e;font-size:6px;font-weight:850; }
  .game-screen .chat-online-sidebar > header button { display:grid;place-items:center;width:27px;height:27px;border:0;border-radius:8px;background:transparent;color:#7e9dac; }
  .game-screen .chat-online-sidebar > header button:hover { background:rgba(255,255,255,.05);color:#d8eaf1; }
  .game-screen .chat-online-sidebar > header .ui-icon { width:12px;height:12px; }
  .game-screen .chat-player-search { display:grid;grid-template-columns:15px 1fr;align-items:center;gap:5px;margin:0 0 5px;padding:0 6px;border:1px solid rgba(134,187,207,.12);border-radius:9px;background:rgba(255,255,255,.03); }
  .game-screen .chat-player-search[hidden] { display:none!important; }
  .game-screen .chat-player-search .ui-icon { width:11px;height:11px;color:#7899a7; }
  .game-screen .chat-player-search input { min-width:0;height:29px;border:0;outline:0;background:transparent;color:#d9ebf2;font-size:7px; }
  .game-screen .chat-online-list { min-height:0;overflow:hidden auto;padding:2px; }
  .game-screen .chat-online-player {
    display:grid;
    grid-template-columns:27px minmax(0,1fr) 8px;
    align-items:center;
    gap:6px;
    width:100%;
    min-height:39px;
    padding:4px;
    border:0;
    border-radius:9px;
    background:transparent;
    color:inherit;
    text-align:left;
  }
  .game-screen .chat-online-player:hover { background:rgba(255,255,255,.045); }
  .game-screen .chat-online-player .chat-player-avatar { width:27px;height:27px; }
  .game-screen .chat-online-player > span:nth-child(2) { display:grid;gap:1px;min-width:0; }
  .game-screen .chat-online-player b { overflow:hidden;color:#bdd3dc;font-size:6.8px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-online-player small { overflow:hidden;color:#698b99;font-size:5.8px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-online-player > em { color:#45cf83;font-size:8px;font-style:normal; }
  .game-screen .chat-online-player.is-friend b { color:#f0ce69; }
  .game-screen .chat-online-player.is-party b { color:#c2a8ff; }
  .game-screen .chat-online-player.is-self { opacity:.65; }
  .game-screen .chat-online-empty { padding:15px 5px;color:#6e8f9e;font-size:7px;text-align:center; }
  .game-screen .chat-invite-group {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:32px;
    margin-top:5px;
    border:1px solid rgba(119,188,216,.14);
    border-radius:9px;
    background:rgba(45,145,190,.06);
    color:#8fc8e1;
    font-size:6.5px;
    font-weight:850;
  }
  .game-screen .chat-invite-group .ui-icon { width:12px;height:12px; }

  .game-screen .chat-directory-section { display:grid;gap:6px;margin:5px 2px 12px; }
  .game-screen .chat-directory-section > header { display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 4px; }
  .game-screen .chat-directory-section > header b { color:#c4dbe4;font-size:7px;text-transform:uppercase;letter-spacing:.04em; }
  .game-screen .chat-directory-section > header small { color:#6c8d9b;font-size:6px; }
  .game-screen .chat-recent-dialogs { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px; }
  .game-screen .chat-recent-dialogs > button { display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:6px;min-height:44px;padding:5px;border:1px solid rgba(129,187,208,.10);border-radius:9px;background:rgba(255,255,255,.025);color:inherit;text-align:left; }
  .game-screen .chat-recent-dialogs .chat-player-avatar { width:28px;height:28px; }
  .game-screen .chat-recent-dialogs > button > span:nth-child(2) { display:grid;gap:1px;min-width:0; }
  .game-screen .chat-recent-dialogs b { overflow:hidden;color:#c8dee7;font-size:7px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-recent-dialogs small { overflow:hidden;color:#6d8d9a;font-size:6px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-recent-dialogs em { display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:#e85067;color:#fff;font-size:5.5px;font-style:normal;font-weight:900; }
  .game-screen .chat-directory-list { display:grid;gap:4px; }
  .game-screen .chat-directory-player { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px;padding:5px;border-radius:9px;background:rgba(255,255,255,.025); }
  .game-screen .chat-directory-main { display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:7px;min-width:0;padding:0;border:0;background:transparent;color:inherit;text-align:left; }
  .game-screen .chat-directory-main > span:nth-child(2) { display:grid;gap:2px;min-width:0; }
  .game-screen .chat-directory-main b { color:#cee3eb;font-size:7.5px; }
  .game-screen .chat-directory-main small { color:#698d9d;font-size:6px; }
  .game-screen .chat-directory-player > div { display:flex;gap:4px; }
  .game-screen .chat-directory-player > div button { min-height:27px;padding:0 7px;border:1px solid rgba(127,187,212,.14);border-radius:8px;background:transparent;color:#8eb8ca;font-size:6px;font-weight:800; }
  .game-screen .chat-directory-empty { color:#6c8d9b;font-size:7px;text-align:center; }
  .game-screen .chat-empty-state { display:grid;place-items:center;align-content:center;gap:8px;min-height:100%;padding:20px;color:#6f919f;text-align:center; }
  .game-screen .chat-empty-state > span { font-size:24px;opacity:.65; }
  .game-screen .chat-empty-state > span .chat-empty-raster { display:block;width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(15,61,83,.2)); }
  .game-screen .chat-empty-state > b { max-width:250px;font-size:7.5px;line-height:1.45; }

  .game-screen .chat-popover {
    position:absolute;
    z-index:30;
    width:200px;
    padding:7px;
    border:1px solid rgba(126,187,211,.18);
    border-radius:13px;
    background:rgba(7,39,52,.985);
    box-shadow:0 18px 38px rgba(0,15,25,.35);
  }
  .game-screen .chat-popover[hidden] { display:none!important; }
  .game-screen .chat-player-popover-head { display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:7px;padding:5px 5px 8px;border-bottom:1px solid rgba(128,188,212,.10); }
  .game-screen .chat-player-popover-head .chat-player-avatar { width:34px;height:34px; }
  .game-screen .chat-player-popover-head > span:last-child { display:grid;gap:2px;min-width:0; }
  .game-screen .chat-player-popover-head b { overflow:hidden;color:#d7eaf2;font-size:8px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-player-popover-head small { color:#66bf91;font-size:6px; }
  .game-screen .chat-popover-actions { display:grid;gap:2px;padding-top:4px; }
  .game-screen .chat-popover-actions button { min-height:29px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:#a8c3ce;font-size:6.7px;font-weight:750;text-align:left; }
  .game-screen .chat-popover-actions button:hover { background:rgba(255,255,255,.055);color:#e6f3f8; }
  .game-screen .chat-popover-actions button:disabled { opacity:.35; }
  .game-screen .chat-popover-actions button.is-danger { color:#f07b88; }

  .game-screen .chat-panel.is-minimized .chat-search-bar,
  .game-screen .chat-panel.is-minimized .chat-messenger-layout,
  .game-screen .chat-panel.is-minimized .chat-emoji-panel,
  .game-screen .chat-panel.is-minimized .chat-popover { display:none!important; }

  html[data-game-theme="light"] .game-screen .chat-search-bar { border-color:#d9e7ed;background:#f7fbfd; }
  html[data-game-theme="light"] .game-screen .chat-search-bar input { color:#173f57; }
  html[data-game-theme="light"] .game-screen .chat-messenger-layout { border-color:#dce9ef;background:#fbfdfe; }
  html[data-game-theme="light"] .game-screen .chat-conversation { border-color:#e3edf1; }
  html[data-game-theme="light"] .game-screen .chat-private-head { background:#f2f8fb; }
  html[data-game-theme="light"] .game-screen .chat-private-head b { color:#204a61; }
  html[data-game-theme="light"] .game-screen .chat-private-head > button:first-child,
  html[data-game-theme="light"] .game-screen .chat-private-head > button:last-child { border-color:#d6e6ed;background:#fff;color:#587589; }
  html[data-game-theme="light"] .game-screen .chat-message:hover { background:#f2f8fa; }
  html[data-game-theme="light"] .game-screen .chat-author-button { color:#244f66; }
  html[data-game-theme="light"] .game-screen .chat-message p,
  html[data-game-theme="light"] .game-screen .chat-message.is-self p { color:#527184; }
  html[data-game-theme="light"] .game-screen .chat-message.is-self { background:#f7fbfd; }
  html[data-game-theme="light"] .game-screen .chat-message-reply-ref { background:#edf7fb;color:#688b9b; }
  html[data-game-theme="light"] .game-screen .chat-message.is-trade-message { border-color:#d8eee2;background:#f5fbf7; }
  html[data-game-theme="light"] .game-screen .chat-message.is-clan-message.is-leader-message { background:#faf7ff; }
  html[data-game-theme="light"] .game-screen #chatForm { border-color:#dbe8ee;background:#f7fafc; }
  html[data-game-theme="light"] .game-screen #chatForm textarea { color:#183f56; }
  html[data-game-theme="light"] .game-screen #chatForm textarea::placeholder { color:#91a6b1; }
  html[data-game-theme="light"] .game-screen .chat-composer-tool { color:#718d9b; }
  html[data-game-theme="light"] .game-screen .chat-composer-tool:hover { background:#edf5f8;color:#285e7a; }
  html[data-game-theme="light"] .game-screen .chat-emoji-panel { border-color:#d4e5ec;background:#fff;box-shadow:0 14px 30px rgba(22,62,83,.18); }
  html[data-game-theme="light"] .game-screen .chat-emoji-panel button:hover { background:#eef6f9; }
  html[data-game-theme="light"] .game-screen .chat-online-sidebar { background:#f5f9fb; }
  html[data-game-theme="light"] .game-screen .chat-online-sidebar > header b { color:#365f75; }
  html[data-game-theme="light"] .game-screen .chat-online-player:hover { background:#eaf3f7; }
  html[data-game-theme="light"] .game-screen .chat-online-player b { color:#42667a; }
  html[data-game-theme="light"] .game-screen .chat-online-player small { color:#849ba8; }
  html[data-game-theme="light"] .game-screen .chat-player-search { border-color:#d9e7ed;background:#fff; }
  html[data-game-theme="light"] .game-screen .chat-player-search input { color:#20465b; }
  html[data-game-theme="light"] .game-screen .chat-invite-group { border-color:#d5e7ef;background:#fff;color:#397b9d; }
  html[data-game-theme="light"] .game-screen .chat-directory-section > header b,
  html[data-game-theme="light"] .game-screen .chat-directory-main b,
  html[data-game-theme="light"] .game-screen .chat-recent-dialogs b { color:#365f75; }
  html[data-game-theme="light"] .game-screen .chat-directory-player,
  html[data-game-theme="light"] .game-screen .chat-recent-dialogs > button { border-color:#e0ebef;background:#f8fbfc; }
  html[data-game-theme="light"] .game-screen .chat-popover { border-color:#d6e5eb;background:#fff;box-shadow:0 18px 38px rgba(18,55,75,.20); }
  html[data-game-theme="light"] .game-screen .chat-player-popover-head { border-color:#e4edf1; }
  html[data-game-theme="light"] .game-screen .chat-player-popover-head b { color:#284f65; }
  html[data-game-theme="light"] .game-screen .chat-popover-actions button { color:#547487; }
  html[data-game-theme="light"] .game-screen .chat-popover-actions button:hover { background:#eef6f9;color:#1e526e; }
}

@media (min-width:761px) and (max-width:1050px) {
  .game-screen .chat-panel.chat-messenger { min-width:470px;max-width:min(610px,calc(100vw - 270px)); }
  .game-screen .chat-messenger-layout { grid-template-columns:minmax(0,3.4fr) minmax(118px,1fr); }
  .game-screen .chat-tabs button { gap:4px;padding:0 5px; }
  .game-screen .chat-online-player { grid-template-columns:25px minmax(0,1fr) 7px;gap:5px; }
  .game-screen .chat-online-player .chat-player-avatar { width:25px;height:25px; }
}

@media (max-width:760px) {
  .game-screen .chat-messenger-layout { display:grid;grid-template-columns:1fr;min-height:0;overflow:hidden; }
  .game-screen .chat-conversation { display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;min-height:0; }
  .game-screen .chat-online-sidebar { display:none; }
  .game-screen .chat-search-bar { display:grid;grid-template-columns:20px 1fr 28px;align-items:center;gap:5px;margin-bottom:5px;padding:4px 6px;border:1px solid var(--theme-border,#d7e5eb);border-radius:10px;background:var(--theme-card,#fff); }
  .game-screen .chat-search-bar[hidden] { display:none!important; }
  .game-screen .chat-search-bar input { min-width:0;height:28px;border:0;outline:0;background:transparent;color:var(--theme-text,#173f57);font-size:8px; }
  .game-screen .chat-search-bar button { display:grid;place-items:center;width:28px;height:28px;border:0;background:transparent;color:var(--theme-muted,#6f8798); }
  .game-screen .chat-tabs { grid-template-columns:repeat(4,1fr); }
  .game-screen .chat-tabs button { min-width:0;padding:0 3px; }
  .game-screen .chat-tabs .chat-tab-icon { display:none; }
  .game-screen .chat-private-head { display:grid;grid-template-columns:28px 28px minmax(0,1fr);align-items:center;gap:6px;padding:5px; }
  .game-screen .chat-private-head[hidden] { display:none!important; }
  .game-screen .chat-private-head > button:last-child { display:none; }
  .game-screen .chat-private-avatar { width:28px;height:28px;border-radius:50%;background:#e9f3f7 url('/assets/v1.4/trainers/trainer-male-walk-8dir-6f.png') 0 0/600% 800% no-repeat; }
  .game-screen .chat-private-avatar[data-skin="female"] { background-image:url('/assets/v1.4/trainers/trainer-female-walk-8dir-6f.png'); }
  .game-screen #chatForm { display:grid;grid-template-columns:30px minmax(0,1fr) 36px;gap:4px;align-items:end; }
  .game-screen #chatForm [data-chat-attachment] { display:none; }
  .game-screen #chatForm textarea { min-width:0;min-height:36px;max-height:74px;padding:9px 5px;resize:none;border:0;outline:0;background:transparent;color:var(--theme-text,#173f57);font-size:9px; }
  .game-screen .chat-composer-tool { width:30px;height:36px;border:0;background:transparent; }
  .game-screen .chat-emoji-panel { position:absolute;left:8px;bottom:55px;display:grid;grid-template-columns:repeat(6,28px);gap:3px;padding:6px;border:1px solid var(--theme-border,#d8e5eb);border-radius:11px;background:var(--theme-panel,#fff); }
  .game-screen .chat-emoji-panel[hidden] { display:none!important; }
  .game-screen .chat-emoji-panel button { width:28px;height:28px;border:0;background:transparent; }
  .game-screen .chat-message-more { display:none; }
  .game-screen .chat-popover { display:none!important; }
}

/* v2.7.54 — server-wide Telegram-like messenger polish */
@media (min-width:761px) {
  .game-screen .chat-panel.chat-messenger {
    --chat-world:#2297e6;
    --chat-trade:#24a86a;
    --chat-clan:#7b61df;
    --chat-players:#e4932f;
    min-width:600px;
    min-height:430px;
    max-width:min(820px,calc(100vw - 300px));
    max-height:min(650px,calc(100vh - 86px));
    padding:0;
    grid-template-rows:auto auto minmax(0,1fr);
    gap:0;
    overflow:hidden;
    border:1px solid rgba(126,178,198,.24);
    border-radius:20px;
    box-shadow:0 22px 58px rgba(4,28,42,.25),0 2px 7px rgba(4,28,42,.12);
  }
  .game-screen .chat-head {
    min-height:60px;
    padding:10px 12px 8px 14px;
    border-bottom:1px solid rgba(126,178,198,.11);
  }
  .game-screen .chat-title-copy { display:grid;gap:3px;min-width:0; }
  .game-screen .chat-title-copy > b { font-size:15px;font-weight:850;letter-spacing:-.01em; }
  .game-screen .chat-title-copy > small { display:flex;align-items:center;gap:6px!important;font-size:7px!important;letter-spacing:0!important; }
  .game-screen .chat-title-copy > small > i { width:7px;height:7px;border-radius:50%;background:#3ecb7e;box-shadow:0 0 0 3px rgba(62,203,126,.10); }
  .game-screen .chat-head-actions { gap:4px; }
  .game-screen .chat-head-actions button { width:34px;height:34px;border-radius:50%;border:0;background:transparent;transition:background .14s,transform .12s; }
  .game-screen .chat-head-actions button:hover { background:rgba(89,151,177,.10); }
  .game-screen .chat-head-actions button:active { transform:scale(.94); }
  .game-screen .chat-title-icon { width:23px;height:23px;margin-right:8px;border-radius:8px; }

  .game-screen .chat-tabs {
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:2px;
    margin:0;
    padding:5px 10px 7px;
    border:0;
    border-bottom:1px solid rgba(126,178,198,.10);
    border-radius:0;
    background:transparent;
  }
  .game-screen .chat-tabs button {
    min-height:38px;
    padding:0 10px;
    border-radius:11px;
    background:transparent;
    font-size:8px;
    font-weight:850;
    transition:background .14s,color .14s,box-shadow .14s;
  }
  .game-screen .chat-tabs button:hover { background:rgba(83,147,173,.07); }
  .game-screen .chat-tabs .chat-tab-icon { width:19px;height:19px;font-size:12px; }
  .game-screen .chat-tabs button.channel-world.is-active { color:#1689ce;background:rgba(34,151,230,.10);box-shadow:none; }
  .game-screen .chat-tabs button.channel-trade.is-active { color:#218d5d;background:rgba(36,168,106,.10);box-shadow:none; }
  .game-screen .chat-tabs button.channel-clan.is-active { color:#7156ce;background:rgba(123,97,223,.10);box-shadow:none; }
  .game-screen .chat-tabs button.channel-players.is-active { color:#c87818;background:rgba(228,147,47,.10);box-shadow:none; }

  .game-screen .chat-search-bar {
    position:absolute;
    z-index:18;
    top:56px;
    left:12px;
    right:12px;
    min-height:42px;
    border:1px solid rgba(118,174,196,.20);
    border-radius:13px;
    background:rgba(13,45,58,.98);
    box-shadow:0 13px 28px rgba(0,22,33,.22);
  }

  .game-screen .chat-messenger-layout {
    display:grid;
    grid-template-columns:minmax(0,1fr) 184px;
    min-height:0;
    height:100%;
    border:0;
    border-radius:0;
    background:transparent;
  }
  .game-screen .chat-conversation {
    min-height:0;
    padding:0;
    grid-template-rows:auto minmax(0,1fr) auto auto;
    border-right:1px solid rgba(126,178,198,.10);
  }
  .game-screen .chat-log-wrap { min-height:0;overflow:hidden; }
  .game-screen .chat-log { height:100%;padding:8px 10px 12px;scrollbar-width:thin;scrollbar-color:rgba(103,151,171,.25) transparent; }
  .game-screen .chat-message {
    grid-template-columns:32px minmax(0,1fr) 24px;
    gap:8px;
    margin:0;
    padding:6px 7px;
    border-radius:11px;
  }
  .game-screen .chat-message:hover { background:rgba(80,143,168,.055); }
  .game-screen .chat-message-avatar { width:32px;height:32px;border:0;box-shadow:none; }
  .game-screen .chat-message-meta { gap:5px;min-height:15px; }
  .game-screen .chat-author-button { max-width:180px;font-size:8px;font-weight:900; }
  .game-screen .chat-message-meta time { font-size:6.3px;opacity:.72; }
  .game-screen .chat-message p {
    width:auto;
    max-width:100%;
    margin:2px 0 0;
    padding:0;
    color:#b9d0da;
    font-size:8px;
    line-height:1.5;
  }
  .game-screen .chat-message.is-self { background:rgba(34,151,230,.035); }
  .game-screen .chat-message.is-system { margin:3px 1px;padding:7px 8px;background:rgba(45,139,180,.065);border-radius:10px; }
  .game-screen .chat-message.is-system p { color:#7fa3b2; }
  .game-screen .chat-message.is-trade-message { margin:4px 2px;padding:8px;border:1px solid rgba(36,168,106,.15);background:rgba(36,168,106,.045); }
  .game-screen .chat-message.is-clan-message.is-leader-message { border-left:2px solid rgba(123,97,223,.65); }
  .game-screen .chat-channel-chip { min-height:14px;padding:0 5px;font-size:5.4px; }
  .game-screen .chat-channel-chip.is-world { background:rgba(34,151,230,.10);color:#68bde9; }
  .game-screen .chat-message-more { top:5px; }

  .game-screen .chat-private-head {
    min-height:48px;
    margin:0;
    padding:6px 9px;
    border-radius:0;
    border-bottom:1px solid rgba(126,178,198,.10);
    background:rgba(83,143,168,.035);
  }
  .game-screen .chat-private-head b { font-size:8.5px; }

  .game-screen #chatForm {
    grid-template-columns:34px 34px minmax(0,1fr) 42px;
    gap:3px;
    min-height:54px;
    margin:0 8px 8px;
    padding:5px;
    border:1px solid rgba(126,178,198,.15);
    border-radius:16px;
    background:rgba(255,255,255,.035);
    box-shadow:none;
  }
  .game-screen #chatForm textarea { min-height:40px;max-height:96px;padding:11px 7px 7px;font-size:8.4px; }
  .game-screen .chat-composer-tool { width:34px;height:40px;border-radius:12px;font-size:17px; }
  .game-screen .chat-send-button { width:40px!important;height:40px!important;border-radius:13px!important;background:linear-gradient(180deg,#28a5ec,#1486d0)!important;box-shadow:0 7px 14px rgba(24,137,204,.20); }
  .game-screen .chat-send-button .ui-icon { width:17px;height:17px; }

  .game-screen .chat-reply-preview { margin:0 8px 5px;padding:6px 8px; }

  .game-screen .chat-emoji-panel {
    position:absolute;
    z-index:24;
    left:8px;
    bottom:68px;
    display:grid;
    grid-template-rows:auto auto minmax(0,1fr);
    width:328px;
    height:286px;
    padding:0;
    overflow:hidden;
    border:1px solid rgba(126,178,198,.19);
    border-radius:16px;
    background:rgba(8,38,50,.985);
    box-shadow:0 18px 44px rgba(0,18,28,.34);
  }
  .game-screen .chat-emoji-panel[hidden] { display:none!important; }
  .game-screen .chat-emoji-panel > header { display:flex;align-items:center;justify-content:space-between;min-height:38px;padding:0 11px;border-bottom:1px solid rgba(126,178,198,.10); }
  .game-screen .chat-emoji-panel > header b { color:#d9eaf1;font-size:8px; }
  .game-screen .chat-emoji-panel > header small { color:#688c9b;font-size:6px;font-weight:800;text-transform:uppercase;letter-spacing:.08em; }
  .game-screen .chat-emoji-categories { display:flex;gap:2px;padding:5px 6px;border-bottom:1px solid rgba(126,178,198,.08);overflow-x:auto;scrollbar-width:none; }
  .game-screen .chat-emoji-categories::-webkit-scrollbar { display:none; }
  .game-screen .chat-emoji-categories button { flex:0 0 34px;width:34px;height:32px;border:0;border-radius:9px;background:transparent;font-size:15px; }
  .game-screen .chat-emoji-categories button:hover { background:rgba(255,255,255,.055); }
  .game-screen .chat-emoji-categories button.is-active { background:rgba(34,151,230,.14);box-shadow:inset 0 0 0 1px rgba(34,151,230,.22); }
  .game-screen .chat-emoji-grid { display:grid;grid-template-columns:repeat(8,1fr);align-content:start;gap:2px;padding:7px;overflow-y:auto; }
  .game-screen .chat-emoji-grid button { width:auto;height:34px;border:0;border-radius:9px;background:transparent;font-size:18px;line-height:1; }
  .game-screen .chat-emoji-grid button:hover { background:rgba(255,255,255,.07);transform:scale(1.06); }

  .game-screen .chat-online-sidebar {
    grid-template-rows:auto auto minmax(0,1fr);
    padding:8px 7px 9px;
    background:rgba(67,128,152,.025);
  }
  .game-screen .chat-online-sidebar > header { min-height:39px;padding:1px 4px 7px; }
  .game-screen .chat-online-sidebar > header > span { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px; }
  .game-screen .chat-online-sidebar > header b { font-size:7px;font-weight:900; }
  .game-screen .chat-online-sidebar > header small { display:flex;align-items:center;gap:4px;min-width:0;height:auto;padding:0;background:transparent;color:#5bbf89; }
  .game-screen .chat-online-sidebar > header small i { width:6px;height:6px;border-radius:50%;background:#43cc7c; }
  .game-screen .chat-online-sidebar > header small strong { font-size:6px; }
  .game-screen .chat-player-search { margin-bottom:6px;border-radius:10px; }
  .game-screen .chat-online-list { padding:1px; }
  .game-screen .chat-online-player { grid-template-columns:30px minmax(0,1fr) 8px;gap:7px;min-height:45px;padding:5px 4px;border-radius:11px; }
  .game-screen .chat-online-player:hover { background:rgba(86,149,175,.07); }
  .game-screen .chat-online-player .chat-player-avatar { width:30px;height:30px; }
  .game-screen .chat-online-copy { display:grid;gap:2px;min-width:0; }
  .game-screen .chat-online-player b { display:flex;align-items:center;gap:3px;font-size:6.8px; }
  .game-screen .chat-online-player small { font-size:5.5px; }
  .game-screen .chat-friend-dot { color:#e9b941;font-size:7px;font-style:normal; }
  .game-screen .chat-friend-dot .chat-friend-raster { display:block;width:11px;height:11px;object-fit:contain;filter:drop-shadow(0 1px 2px rgba(30,66,83,.24)); }
  .game-screen .chat-author-button .chat-leader-raster { display:inline-grid;place-items:center;width:13px;height:13px;margin-right:3px;vertical-align:-2px; }
  .game-screen .chat-author-button .chat-leader-raster img { width:13px;height:13px;object-fit:contain; }
  .game-screen .chat-online-player.is-self { opacity:.82; }

  .game-screen .chat-popover { width:216px;border-radius:15px;padding:7px; }
  .game-screen .chat-popover-actions button { min-height:32px;border-radius:9px;font-size:6.7px; }
  .game-screen .chat-popover-actions button:disabled { opacity:.42;cursor:not-allowed; }

  .game-screen .chat-resize { width:18px;height:18px;right:4px;bottom:4px;opacity:.42; }

  html[data-game-theme="light"] .game-screen .chat-panel.chat-messenger {
    border-color:#d8e6ec;
    background:rgba(249,252,253,var(--chat-opacity));
    box-shadow:0 20px 52px rgba(23,60,80,.18),0 2px 7px rgba(23,60,80,.08);
  }
  html[data-game-theme="light"] .game-screen .chat-head,
  html[data-game-theme="light"] .game-screen .chat-tabs,
  html[data-game-theme="light"] .game-screen .chat-conversation,
  html[data-game-theme="light"] .game-screen .chat-private-head { border-color:#e0ebf0; }
  html[data-game-theme="light"] .game-screen .chat-head-actions button:hover { background:#edf5f8; }
  html[data-game-theme="light"] .game-screen .chat-tabs button:hover { background:#eff6f8; }
  html[data-game-theme="light"] .game-screen .chat-messenger-layout { background:#fbfdfe; }
  html[data-game-theme="light"] .game-screen .chat-online-sidebar { background:#f7fafb; }
  html[data-game-theme="light"] .game-screen .chat-message:hover { background:#f0f6f8; }
  html[data-game-theme="light"] .game-screen .chat-message.is-self { background:#f5fbfe; }
  html[data-game-theme="light"] .game-screen .chat-message.is-system { background:#f1f7f9; }
  html[data-game-theme="light"] .game-screen .chat-message.is-trade-message { border-color:#d8eee2;background:#f7fbf8; }
  html[data-game-theme="light"] .game-screen .chat-message p { color:#46697c; }
  html[data-game-theme="light"] .game-screen .chat-author-button { color:#244e65; }
  html[data-game-theme="light"] .game-screen #chatForm { border-color:#dbe8ed;background:#f8fbfc; }
  html[data-game-theme="light"] .game-screen #chatForm textarea { color:#193f55; }
  html[data-game-theme="light"] .game-screen .chat-emoji-panel { border-color:#d4e4ea;background:#fff;box-shadow:0 18px 42px rgba(28,65,84,.20); }
  html[data-game-theme="light"] .game-screen .chat-emoji-panel > header,
  html[data-game-theme="light"] .game-screen .chat-emoji-categories { border-color:#e4edf1; }
  html[data-game-theme="light"] .game-screen .chat-emoji-panel > header b { color:#31586d; }
  html[data-game-theme="light"] .game-screen .chat-emoji-grid button:hover,
  html[data-game-theme="light"] .game-screen .chat-emoji-categories button:hover { background:#eef5f7; }
  html[data-game-theme="light"] .game-screen .chat-online-player:hover { background:#edf5f8; }
  html[data-game-theme="light"] .game-screen .chat-online-player b { color:#3f6579; }
  html[data-game-theme="light"] .game-screen .chat-online-player small { color:#8199a5; }
  html[data-game-theme="light"] .game-screen .chat-search-bar { background:#fff;border-color:#d8e6ec; }
}

@media (min-width:761px) and (max-width:1080px) {
  .game-screen .chat-panel.chat-messenger { min-width:560px;max-width:min(690px,calc(100vw - 245px)); }
  .game-screen .chat-messenger-layout { grid-template-columns:minmax(0,1fr) 160px; }
  .game-screen .chat-online-player { grid-template-columns:27px minmax(0,1fr) 7px;gap:5px; }
  .game-screen .chat-online-player .chat-player-avatar { width:27px;height:27px; }
}

@media (max-width:760px) {
  .game-screen .chat-emoji-panel {
    position:absolute;
    left:7px;
    right:7px;
    bottom:55px;
    width:auto;
    height:min(285px,46vh);
    display:grid;
    grid-template-rows:auto auto minmax(0,1fr);
    padding:0;
    overflow:hidden;
    border:1px solid var(--theme-border,#d8e5eb);
    border-radius:15px;
    background:var(--theme-panel,#fff);
    box-shadow:0 14px 30px rgba(19,54,74,.20);
  }
  .game-screen .chat-emoji-panel[hidden] { display:none!important; }
  .game-screen .chat-emoji-panel > header { display:flex;align-items:center;justify-content:space-between;min-height:36px;padding:0 10px;border-bottom:1px solid var(--theme-border,#d8e5eb); }
  .game-screen .chat-emoji-panel > header b { font-size:9px;color:var(--theme-text,#173f57); }
  .game-screen .chat-emoji-panel > header small { font-size:7px;color:var(--theme-muted,#78909e); }
  .game-screen .chat-emoji-categories { display:flex;gap:3px;padding:5px;overflow-x:auto;border-bottom:1px solid var(--theme-border,#d8e5eb); }
  .game-screen .chat-emoji-categories button { flex:0 0 34px;width:34px;height:32px;border:0;border-radius:9px;background:transparent;font-size:15px; }
  .game-screen .chat-emoji-categories button.is-active { background:color-mix(in srgb,var(--theme-accent,#168bc9) 12%,transparent); }
  .game-screen .chat-emoji-grid { display:grid;grid-template-columns:repeat(7,1fr);align-content:start;gap:2px;padding:6px;overflow-y:auto; }
  .game-screen .chat-emoji-grid button { width:auto;height:34px;border:0;border-radius:8px;background:transparent;font-size:18px; }
}

/* v2.7.55 — persistent docked messenger, readable typography and working resize */
@media (min-width:761px) {
  .game-screen .chat-panel.chat-messenger {
    --chat-ui-blue:#2297e6;
    min-width:540px;
    min-height:390px;
    max-width:min(960px,calc(100vw - 28px));
    max-height:min(720px,calc(100vh - 78px));
    padding:0;
    border-radius:22px;
    overflow:hidden;
  }

  .game-screen .chat-head {
    min-height:62px;
    padding:10px 12px 9px 14px;
  }
  .game-screen .chat-title-copy { gap:3px; }
  .game-screen .chat-title-copy > b {
    gap:8px;
    font-size:16px;
    line-height:1.15;
    letter-spacing:-.015em;
  }
  .game-screen .chat-title-copy > small {
    font-size:9px!important;
    line-height:1.2;
  }
  .game-screen .chat-title-icon { width:20px;height:20px; }
  .game-screen .chat-head-actions { gap:5px; }
  .game-screen .chat-head-actions button {
    width:40px;
    height:40px;
    border-radius:13px;
  }
  .game-screen .chat-head-actions .ui-icon { width:17px;height:17px; }

  .game-screen .chat-tabs {
    min-height:52px;
    padding:5px 8px;
    gap:4px;
  }
  .game-screen .chat-tabs button {
    min-height:40px;
    border-radius:12px;
    font-size:11px;
    font-weight:800;
  }
  .game-screen .chat-tabs .chat-tab-icon { width:20px;height:20px;font-size:14px; }
  .game-screen .chat-tabs button > i[data-chat-unread] {
    min-width:18px;
    height:18px;
    padding:0 5px;
    font-size:8px;
  }

  .game-screen .chat-messenger-layout {
    grid-template-columns:minmax(0,3fr) minmax(170px,1fr);
    min-height:0;
  }
  .game-screen .chat-log { padding:10px 11px 13px; }
  .game-screen .chat-message {
    grid-template-columns:36px minmax(0,1fr) 25px;
    gap:9px;
    padding:7px 8px;
    border-radius:12px;
  }
  .game-screen .chat-message-avatar { width:36px;height:36px; }
  .game-screen .chat-message-meta { min-height:17px;gap:6px; }
  .game-screen .chat-author-button {
    max-width:220px;
    font-size:11px;
    line-height:1.2;
    font-weight:850;
  }
  .game-screen .chat-message-meta time { font-size:8.5px; }
  .game-screen .chat-message p {
    margin-top:3px;
    font-size:11.5px;
    line-height:1.44;
  }
  .game-screen .chat-channel-chip { min-height:18px;padding:0 6px;font-size:7px; }
  .game-screen .chat-message-more { width:25px;height:25px; }

  .game-screen .chat-private-head { min-height:52px;padding:6px 10px; }
  .game-screen .chat-private-head b { font-size:11px; }
  .game-screen .chat-private-head small { font-size:8.5px; }

  .game-screen #chatForm {
    grid-template-columns:40px 40px minmax(0,1fr) 48px;
    gap:5px;
    min-height:62px;
    margin:0 9px 9px;
    padding:6px;
    border-radius:17px;
  }
  .game-screen #chatForm textarea {
    min-height:44px;
    max-height:112px;
    padding:12px 8px 8px;
    font-size:12px;
    line-height:1.35;
  }
  .game-screen .chat-composer-tool {
    width:40px;
    height:44px;
    border-radius:12px;
    font-size:19px;
  }
  .game-screen .chat-send-button {
    width:44px!important;
    height:44px!important;
    border-radius:13px!important;
  }
  .game-screen .chat-send-button .ui-icon { width:19px;height:19px; }

  .game-screen .chat-online-sidebar { padding:9px 8px 10px; }
  .game-screen .chat-online-sidebar > header { min-height:44px;padding:2px 4px 8px; }
  .game-screen .chat-online-sidebar > header b { font-size:9.5px; }
  .game-screen .chat-online-sidebar > header small strong { font-size:8px; }
  .game-screen .chat-online-player {
    grid-template-columns:34px minmax(0,1fr) 8px;
    gap:8px;
    min-height:50px;
    padding:6px 5px;
    border-radius:12px;
  }
  .game-screen .chat-online-player .chat-player-avatar { width:34px;height:34px; }
  .game-screen .chat-online-player b { font-size:9.5px; }
  .game-screen .chat-online-player small { font-size:7.5px;line-height:1.3; }

  /* Emoji picker is a compact popover, not a second full chat window. */
  .game-screen .chat-emoji-panel {
    left:10px!important;
    right:auto!important;
    bottom:78px!important;
    width:min(372px,calc(100% - 205px))!important;
    min-width:300px;
    height:min(304px,calc(100% - 142px))!important;
    min-height:236px;
    grid-template-rows:42px 46px minmax(0,1fr)!important;
    border-radius:16px!important;
    overflow:hidden!important;
  }
  .game-screen .chat-emoji-panel > header {
    min-height:42px!important;
    padding:0 12px!important;
  }
  .game-screen .chat-emoji-panel > header b { font-size:11px!important; }
  .game-screen .chat-emoji-panel > header small { font-size:8px!important; }
  .game-screen .chat-emoji-categories {
    display:grid!important;
    grid-template-columns:repeat(8,minmax(0,1fr))!important;
    gap:3px!important;
    padding:5px 7px!important;
    overflow:hidden!important;
  }
  .game-screen .chat-emoji-categories button {
    width:100%!important;
    height:35px!important;
    min-width:0!important;
    border-radius:10px!important;
    font-size:18px!important;
  }
  .game-screen .chat-emoji-categories button span { display:grid;place-items:center; }
  .game-screen .chat-emoji-grid {
    display:grid!important;
    grid-template-columns:repeat(8,minmax(0,1fr))!important;
    align-content:start!important;
    gap:3px!important;
    padding:8px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    scrollbar-width:thin;
  }
  .game-screen .chat-emoji-grid button {
    width:100%!important;
    height:36px!important;
    min-width:0!important;
    padding:0!important;
    border-radius:9px!important;
    font-size:22px!important;
    line-height:1!important;
  }

  /* The lower-right corner is now a real resize affordance. */
  .game-screen .chat-resize {
    display:block!important;
    position:absolute!important;
    right:3px!important;
    bottom:3px!important;
    z-index:40!important;
    width:30px!important;
    height:30px!important;
    padding:0!important;
    border:0!important;
    border-radius:0 0 18px 0!important;
    background:transparent!important;
    cursor:nwse-resize!important;
    touch-action:none!important;
    opacity:.72!important;
  }
  .game-screen .chat-resize::before,
  .game-screen .chat-resize::after {
    content:'';
    position:absolute;
    right:6px;
    bottom:6px;
    width:13px;
    height:2px;
    border-radius:999px;
    background:currentColor;
    transform:rotate(-45deg);
    transform-origin:right center;
  }
  .game-screen .chat-resize::after { right:5px;bottom:10px;width:8px;opacity:.55; }
  .game-screen .chat-panel.is-adjusting { user-select:none;transition:none!important; }
  .game-screen .chat-panel.is-adjusting * { cursor:nwse-resize; }

  /* Persistent collapsed dock: it is never removed from the desktop HUD. */
  .game-screen .chat-panel.is-minimized {
    display:grid!important;
    left:max(14px,env(safe-area-inset-left))!important;
    top:auto!important;
    bottom:max(14px,env(safe-area-inset-bottom))!important;
    width:min(360px,calc(100vw - 430px))!important;
    min-width:250px!important;
    height:64px!important;
    min-height:64px!important;
    max-height:64px!important;
    padding:8px 10px!important;
    border-radius:17px!important;
  }
  .game-screen .chat-panel.is-minimized .chat-head { min-height:46px!important; }
  .game-screen .chat-panel.is-minimized .chat-title-copy > b { font-size:13px!important; }
  .game-screen .chat-panel.is-minimized .chat-title-copy > small { font-size:8px!important; }
  .game-screen .chat-panel.is-minimized .chat-head-actions [data-chat-search-toggle] { display:grid!important; }
  .game-screen .chat-panel.is-minimized .chat-head-actions [data-toggle-chat-settings],
  .game-screen .chat-panel.is-minimized .chat-head-actions [data-close-chat] { display:none!important; }
  .game-screen .chat-panel.is-minimized .chat-minimize { display:grid!important;width:38px!important;height:38px!important; }
  .game-screen .chat-panel.is-minimized .chat-tabs,
  .game-screen .chat-panel.is-minimized .chat-search-bar,
  .game-screen .chat-panel.is-minimized .chat-messenger-layout,
  .game-screen .chat-panel.is-minimized .chat-config,
  .game-screen .chat-panel.is-minimized .chat-emoji-panel,
  .game-screen .chat-panel.is-minimized .chat-popover,
  .game-screen .chat-panel.is-minimized .chat-resize { display:none!important; }

  .game-screen .chat-config {
    max-height:min(420px,calc(100vh - 120px));
    padding:12px;
    font-size:11px;
    overflow:auto;
  }
  .game-screen .chat-config label > span,
  .game-screen .chat-channel-visibility legend { font-size:10px; }
}

@media (min-width:761px) and (max-width:1080px) {
  .game-screen .chat-panel.chat-messenger { min-width:520px; }
  .game-screen .chat-messenger-layout { grid-template-columns:minmax(0,1fr) 158px; }
  .game-screen .chat-emoji-panel { width:min(330px,calc(100% - 178px))!important;grid-template-rows:40px 42px minmax(0,1fr)!important; }
  .game-screen .chat-emoji-grid { grid-template-columns:repeat(7,minmax(0,1fr))!important; }
  .game-screen .chat-emoji-categories { grid-template-columns:repeat(8,minmax(0,1fr))!important; }
}

html[data-game-theme="light"] .game-screen .chat-resize { color:#82a8bb; }
html[data-game-theme="dark"] .game-screen .chat-resize { color:#78a7ba; }

/* v2.7.56 — messenger interaction polish, SVG composer controls and trainer actions */
@media (min-width:761px) {
  .game-screen .chat-panel.chat-messenger {
    font-family: Inter, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  }

  .game-screen .chat-head {
    padding-left:16px;
    padding-right:13px;
  }
  .game-screen .chat-title-copy > b { font-size:16.5px; font-weight:800; }
  .game-screen .chat-title-copy > small { font-size:9.5px!important; font-weight:650; }
  .game-screen .chat-tabs button { font-size:11.5px; font-weight:750; letter-spacing:-.01em; }

  .game-screen .chat-message { padding:8px 8px; }
  .game-screen .chat-author-button { font-size:11.5px; font-weight:800; }
  .game-screen .chat-message-meta time { font-size:8.7px; font-weight:600; }
  .game-screen .chat-message p { font-size:12px; line-height:1.46; letter-spacing:-.004em; }

  /* One clean Telegram-like composer surface. */
  .game-screen #chatForm {
    grid-template-columns:40px 40px minmax(0,1fr) 48px;
    align-items:end;
    gap:4px;
    min-height:64px;
    margin:0 10px 10px;
    padding:6px;
    border-radius:18px;
    border:1px solid rgba(115,166,187,.17);
    background:rgba(255,255,255,.045);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  }
  .game-screen #chatForm textarea {
    min-height:44px;
    max-height:118px;
    padding:12px 9px 9px;
    border:0!important;
    outline:0!important;
    background:transparent!important;
    font:500 12.5px/1.4 Inter,"Segoe UI",system-ui,sans-serif;
    resize:none;
  }
  .game-screen #chatForm textarea::placeholder { color:#7995a4; opacity:.82; }
  .game-screen .chat-composer-tool {
    display:grid;
    place-items:center;
    width:40px;
    height:44px;
    padding:0;
    border:0;
    border-radius:13px;
    background:transparent;
    color:#6f91a2;
    box-shadow:none;
    transition:background .14s ease,color .14s ease,transform .12s ease;
  }
  .game-screen .chat-composer-tool:hover { background:rgba(77,146,178,.10); color:#2499dc; }
  .game-screen .chat-composer-tool:active { transform:scale(.94); }
  .game-screen .chat-composer-tool .ui-icon { width:20px;height:20px; stroke-width:1.8; }
  .game-screen .chat-emoji-trigger[aria-expanded="true"] { background:rgba(34,151,230,.12); color:#2297e6; }
  .game-screen .chat-send-button {
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    height:44px!important;
    margin:0!important;
    border-radius:14px!important;
    background:linear-gradient(180deg,#2ba8ee,#1688d2)!important;
    box-shadow:0 7px 18px rgba(24,137,204,.22)!important;
    transition:transform .12s ease,filter .12s ease!important;
  }
  .game-screen .chat-send-button:hover { filter:brightness(1.055); }
  .game-screen .chat-send-button:active { transform:scale(.94); }

  /* Sidebar is intentionally just people: no extra mini-search button. */
  .game-screen .chat-online-sidebar { padding:10px 9px 10px; }
  .game-screen .chat-online-sidebar > header {
    min-height:40px;
    padding:2px 5px 7px;
    border-bottom:1px solid rgba(120,168,188,.08);
  }
  .game-screen .chat-online-sidebar > header > span {
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:7px;
    width:100%;
  }
  .game-screen .chat-online-sidebar > header b { font-size:9.5px; font-weight:800; }
  .game-screen .chat-online-sidebar > header small { gap:4px; margin-left:auto; }
  .game-screen .chat-online-player {
    grid-template-columns:36px minmax(0,1fr) 8px;
    min-height:54px;
    gap:8px;
    padding:7px 6px;
    border-radius:13px;
  }
  .game-screen .chat-online-player .chat-player-avatar { width:36px;height:36px; }
  .game-screen .chat-online-player b { font-size:10px; font-weight:800; }
  .game-screen .chat-online-player small { font-size:7.8px; line-height:1.35; }

  /* Player popover is now a compact social action sheet. */
  .game-screen .chat-popover {
    width:284px;
    max-height:min(430px,calc(100% - 64px));
    padding:8px;
    border-radius:18px;
    overflow:auto;
    scrollbar-width:thin;
  }
  .game-screen .chat-player-popover-head {
    grid-template-columns:42px minmax(0,1fr);
    gap:10px;
    min-height:58px;
    padding:5px 5px 7px;
  }
  .game-screen .chat-player-popover-head .chat-player-avatar { width:42px;height:42px; }
  .game-screen .chat-player-popover-head b { font-size:12px; font-weight:850; }
  .game-screen .chat-player-popover-head small { font-size:8px; line-height:1.35; }
  .game-screen .chat-player-location {
    display:grid;
    grid-template-columns:8px minmax(0,1fr);
    gap:8px;
    align-items:center;
    margin:0 2px 7px;
    padding:8px 9px;
    border-radius:12px;
    background:rgba(91,145,168,.075);
  }
  .game-screen .chat-player-location > i { width:8px;height:8px;border-radius:50%;background:#f0b84c;box-shadow:0 0 0 4px rgba(240,184,76,.08); }
  .game-screen .chat-player-location.is-nearby > i { background:#45ce82;box-shadow:0 0 0 4px rgba(69,206,130,.09); }
  .game-screen .chat-player-location.is-private > i { background:#9aaeb8;box-shadow:none; }
  .game-screen .chat-player-location span { display:grid;gap:1px;min-width:0; }
  .game-screen .chat-player-location b { font-size:9px; }
  .game-screen .chat-player-location small { overflow:hidden;color:#76929f;font-size:7.5px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-popover > .is-join {
    display:grid;
    grid-template-columns:28px minmax(0,1fr);
    gap:8px;
    width:100%;
    min-height:48px;
    margin:0 0 7px;
    padding:7px 9px;
    border:1px solid rgba(38,154,222,.22);
    border-radius:12px;
    background:rgba(35,151,222,.10);
    color:#65bdf0;
    text-align:left;
  }
  .game-screen .chat-popover > .is-join .ui-icon { width:20px;height:20px;align-self:center; }
  .game-screen .chat-popover > .is-join span { display:grid;gap:2px;min-width:0; }
  .game-screen .chat-popover > .is-join b { color:inherit;font-size:9.5px; }
  .game-screen .chat-popover > .is-join small { overflow:hidden;color:#789ba9;font-size:7.3px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .chat-popover-actions.is-social { gap:3px; }
  .game-screen .chat-popover-actions.is-social button {
    display:grid;
    grid-template-columns:28px minmax(0,1fr);
    gap:8px;
    align-items:center;
    min-height:48px;
    padding:6px 8px;
    border-radius:12px;
  }
  .game-screen .chat-popover-actions.is-social button .ui-icon { width:18px;height:18px; }
  .game-screen .chat-popover-actions.is-social button > span { display:grid;gap:1px;min-width:0; }
  .game-screen .chat-popover-actions.is-social button b { color:inherit;font-size:9.2px;font-weight:800; }
  .game-screen .chat-popover-actions.is-social button small { color:#718e9c;font-size:7.2px;font-weight:600; }
  .game-screen .chat-popover-actions button.requires-nearby { opacity:.72; }
  .game-screen .chat-popover-actions button.requires-nearby:hover { opacity:1; }
  .game-screen .chat-popover-actions button.is-status { opacity:.72; }

  /* Real SVG resize affordance instead of the broken painted corner. */
  .game-screen .chat-resize {
    right:0!important;
    bottom:0!important;
    z-index:45!important;
    width:36px!important;
    height:36px!important;
    border-radius:14px 0 20px 0!important;
    color:#74a5bb!important;
    opacity:.72!important;
    background:linear-gradient(135deg,transparent 45%,rgba(103,160,184,.07))!important;
  }
  .game-screen .chat-resize::before,
  .game-screen .chat-resize::after { display:none!important;content:none!important; }
  .game-screen .chat-resize > span { display:grid;place-items:center;width:100%;height:100%;pointer-events:none; }
  .game-screen .chat-resize .ui-icon { width:21px;height:21px;transform:translate(5px,5px); }
  .game-screen .chat-resize:hover { opacity:1!important;color:#2499dc!important; }

  html[data-game-theme="light"] .game-screen #chatForm {
    border-color:#d8e6ec;
    background:#f8fbfc;
    box-shadow:inset 0 1px 0 #fff;
  }
  html[data-game-theme="light"] .game-screen .chat-composer-tool { color:#6e8b9b; }
  html[data-game-theme="light"] .game-screen .chat-composer-tool:hover { background:#eaf4f8;color:#168fd4; }
  html[data-game-theme="light"] .game-screen .chat-player-location { background:#f1f7f9; }
  html[data-game-theme="light"] .game-screen .chat-popover > .is-join { border-color:#c9e5f3;background:#edf8fd;color:#177fb9; }
  html[data-game-theme="light"] .game-screen .chat-popover-actions.is-social button small { color:#7f97a3; }
  html[data-game-theme="light"] .game-screen .chat-resize { color:#719bad!important; }
}

/* v2.7.57 — rebuilt classic emoji picker and simplified messenger composer */
@media (min-width:761px) {
  .game-screen #chatForm {
    grid-template-columns:42px minmax(0,1fr) 50px!important;
    align-items:end!important;
    gap:6px!important;
    min-height:66px!important;
    margin:0 10px 10px!important;
    padding:7px!important;
    border:1px solid rgba(113,166,187,.18)!important;
    border-radius:19px!important;
  }
  .game-screen #chatForm textarea {
    width:100%!important;
    min-width:0!important;
    min-height:44px!important;
    max-height:120px!important;
    padding:12px 10px 9px!important;
    border:0!important;
    background:transparent!important;
    color:var(--theme-text,#173f57)!important;
    font:500 12.5px/1.42 Inter,"Segoe UI",system-ui,sans-serif!important;
    letter-spacing:0!important;
    resize:none!important;
  }
  .game-screen #chatForm textarea::placeholder { color:#83a0ae!important;opacity:.88!important; }
  .game-screen .chat-emoji-trigger {
    display:grid!important;
    place-items:center!important;
    width:42px!important;
    height:44px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:14px!important;
    background:transparent!important;
    color:#6e93a5!important;
  }
  .game-screen .chat-emoji-trigger:hover,
  .game-screen .chat-emoji-trigger[aria-expanded="true"] {
    background:rgba(32,151,226,.11)!important;
    color:#168fd8!important;
  }
  .game-screen .chat-emoji-trigger .ui-icon { width:21px!important;height:21px!important; }
  .game-screen .chat-send-button {
    width:46px!important;
    height:46px!important;
    align-self:center!important;
    border-radius:14px!important;
  }

  .game-screen .chat-emoji-panel,
  .game-screen .chat-emoji-panel * { box-sizing:border-box!important; }
  .game-screen .chat-emoji-panel {
    position:absolute!important;
    z-index:80!important;
    left:10px!important;
    right:auto!important;
    bottom:84px!important;
    display:grid!important;
    grid-template-rows:42px 46px minmax(0,1fr)!important;
    width:390px!important;
    max-width:calc(100% - 22px)!important;
    height:326px!important;
    max-height:calc(100% - 150px)!important;
    min-width:320px!important;
    min-height:250px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:1px solid rgba(125,174,195,.20)!important;
    border-radius:18px!important;
    background:rgba(9,38,51,.985)!important;
    box-shadow:0 20px 52px rgba(0,18,28,.34)!important;
    transform:none!important;
  }
  .game-screen .chat-emoji-panel[hidden] { display:none!important; }
  .game-screen .chat-emoji-head {
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    min-width:0!important;
    min-height:42px!important;
    margin:0!important;
    padding:0 13px!important;
    border:0!important;
    border-bottom:1px solid rgba(126,178,198,.10)!important;
    background:transparent!important;
  }
  .game-screen .chat-emoji-head b {
    margin:0!important;
    color:#e5f2f6!important;
    font:800 11.5px/1 Inter,"Segoe UI",system-ui,sans-serif!important;
  }
  .game-screen .chat-emoji-head small {
    margin:0!important;
    color:#7394a3!important;
    font:700 9px/1 Inter,"Segoe UI",system-ui,sans-serif!important;
  }
  .game-screen .chat-emoji-categories {
    display:grid!important;
    grid-template-columns:repeat(10,minmax(0,1fr))!important;
    gap:3px!important;
    width:100%!important;
    min-width:0!important;
    height:46px!important;
    margin:0!important;
    padding:5px 7px!important;
    overflow:hidden!important;
    border:0!important;
    border-bottom:1px solid rgba(126,178,198,.09)!important;
    background:rgba(255,255,255,.012)!important;
  }
  .game-screen .chat-emoji-categories button {
    appearance:none!important;
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    min-width:0!important;
    height:35px!important;
    min-height:35px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    color:inherit!important;
    box-shadow:none!important;
    font:400 18px/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
    cursor:pointer!important;
    transform:none!important;
  }
  .game-screen .chat-emoji-categories button span {
    display:block!important;
    width:auto!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    line-height:1!important;
  }
  .game-screen .chat-emoji-categories button:hover { background:rgba(255,255,255,.07)!important; }
  .game-screen .chat-emoji-categories button.is-active {
    background:rgba(35,153,228,.15)!important;
    box-shadow:inset 0 0 0 1px rgba(35,153,228,.24)!important;
  }
  .game-screen .chat-emoji-grid {
    display:grid!important;
    grid-template-columns:repeat(9,minmax(0,1fr))!important;
    grid-auto-rows:38px!important;
    align-content:start!important;
    gap:3px!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:9px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-gutter:stable!important;
    scrollbar-width:thin!important;
    scrollbar-color:rgba(111,158,177,.46) transparent!important;
    background:transparent!important;
  }
  .game-screen .chat-emoji-grid::-webkit-scrollbar { width:7px!important;height:0!important; }
  .game-screen .chat-emoji-grid::-webkit-scrollbar-track { background:transparent!important; }
  .game-screen .chat-emoji-grid::-webkit-scrollbar-thumb { border-radius:999px!important;background:rgba(111,158,177,.38)!important; }
  .game-screen .chat-emoji-grid button {
    appearance:none!important;
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    color:inherit!important;
    box-shadow:none!important;
    font:400 23px/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
    cursor:pointer!important;
    transform:none!important;
    transition:background .12s ease,transform .12s ease!important;
  }
  .game-screen .chat-emoji-grid button:hover {
    background:rgba(255,255,255,.075)!important;
    transform:scale(1.08)!important;
  }
  .game-screen .chat-emoji-grid button:active { transform:scale(.93)!important; }

  html[data-game-theme="light"] .game-screen .chat-emoji-panel {
    border-color:#d5e4ea!important;
    background:rgba(255,255,255,.99)!important;
    box-shadow:0 20px 48px rgba(27,65,85,.20)!important;
  }
  html[data-game-theme="light"] .game-screen .chat-emoji-head,
  html[data-game-theme="light"] .game-screen .chat-emoji-categories { border-color:#e3edf1!important; }
  html[data-game-theme="light"] .game-screen .chat-emoji-head b { color:#244d63!important; }
  html[data-game-theme="light"] .game-screen .chat-emoji-head small { color:#7c96a3!important; }
  html[data-game-theme="light"] .game-screen .chat-emoji-categories { background:#fbfdfe!important; }
  html[data-game-theme="light"] .game-screen .chat-emoji-categories button:hover,
  html[data-game-theme="light"] .game-screen .chat-emoji-grid button:hover { background:#eef6f9!important; }
  html[data-game-theme="light"] .game-screen .chat-emoji-categories button.is-active {
    background:#e4f4fc!important;
    box-shadow:inset 0 0 0 1px #9ed6f1!important;
  }
}

@media (max-width:760px) {
  .game-screen #chatForm { grid-template-columns:38px minmax(0,1fr) 46px!important;gap:5px!important; }
  .game-screen #chatForm [data-chat-attachment] { display:none!important; }
  .game-screen .chat-emoji-panel {
    left:8px!important;
    right:8px!important;
    bottom:62px!important;
    width:auto!important;
    min-width:0!important;
    height:min(330px,48vh)!important;
    display:grid!important;
    grid-template-rows:40px 44px minmax(0,1fr)!important;
    padding:0!important;
    overflow:hidden!important;
  }
  .game-screen .chat-emoji-panel[hidden] { display:none!important; }
  .game-screen .chat-emoji-categories {
    display:grid!important;
    grid-template-columns:repeat(10,minmax(30px,1fr))!important;
    gap:2px!important;
    padding:4px 5px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
  }
  .game-screen .chat-emoji-categories button { width:100%!important;height:34px!important;padding:0!important;font-size:17px!important; }
  .game-screen .chat-emoji-grid { grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:3px!important;padding:7px!important;overflow-y:auto!important; }
  .game-screen .chat-emoji-grid button { width:100%!important;height:38px!important;padding:0!important;font-size:22px!important; }
}

/* v2.7.58 — inline messenger search, single collapse control and stable emoji popover */
@media (min-width:761px) {
  .game-screen .chat-panel.chat-messenger {
    grid-template-rows:auto auto minmax(0,1fr)!important;
  }

  /* Search belongs to the title bar; it never creates a new row over messages. */
  .game-screen .chat-head {
    min-width:0;
  }
  .game-screen .chat-head-search {
    flex:1 1 260px;
    display:grid;
    grid-template-columns:20px minmax(0,1fr) 28px;
    align-items:center;
    gap:6px;
    min-width:180px;
    max-width:330px;
    height:38px;
    margin-left:auto;
    padding:0 5px 0 10px;
    border:1px solid color-mix(in srgb,var(--theme-accent,#1b95d1) 24%,var(--theme-border,#d7e5eb));
    border-radius:13px;
    background:color-mix(in srgb,var(--theme-card,#fff) 92%,transparent);
    box-shadow:0 7px 22px rgba(13,55,76,.08);
  }
  .game-screen .chat-head-search[hidden] { display:none!important; }
  .game-screen .chat-head-search > span {
    display:grid;
    place-items:center;
    color:var(--theme-muted,#7a96a4);
  }
  .game-screen .chat-head-search > span .ui-icon { width:15px;height:15px; }
  .game-screen .chat-head-search input {
    width:100%;
    min-width:0;
    height:34px;
    padding:0;
    border:0;
    outline:0;
    background:transparent;
    color:var(--theme-text,#173f57);
    font:600 12px/1.2 Inter,"Segoe UI",system-ui,sans-serif;
  }
  .game-screen .chat-head-search input::placeholder { color:var(--theme-muted,#8ba2ae); }
  .game-screen .chat-head-search button {
    display:grid;
    place-items:center;
    width:28px;
    height:28px;
    padding:0;
    border:0;
    border-radius:9px;
    background:transparent;
    color:var(--theme-muted,#7692a0);
  }
  .game-screen .chat-head-search button:hover { background:color-mix(in srgb,var(--theme-accent,#1c96d5) 10%,transparent);color:var(--theme-accent,#168fd4); }
  .game-screen .chat-head-search button .ui-icon { width:13px;height:13px; }
  .game-screen .chat-panel.is-searching .chat-title-copy { max-width:150px; }
  .game-screen .chat-panel.is-searching .chat-head-actions [data-chat-search-toggle] { display:none; }
  .game-screen .chat-search-bar { display:none!important; }

  /* There is one collapse control on desktop: X. No separate minus button. */
  .game-screen .chat-head-actions [data-chat-minimize],
  .game-screen .chat-minimize { display:none!important; }
  .game-screen .chat-head-actions [data-close-chat] { display:grid!important; }
  .game-screen .chat-panel.is-minimized .chat-head-actions [data-close-chat] { display:none!important; }

  /* Composer behaves like a messenger input, growing only when the user types. */
  .game-screen #chatForm {
    grid-template-columns:42px minmax(0,1fr) 48px!important;
    align-items:end!important;
    gap:6px!important;
    min-height:62px!important;
    margin:0 8px 8px!important;
    padding:7px 7px 7px 8px!important;
    border:1px solid var(--theme-border,#d9e7ed)!important;
    border-radius:18px!important;
    background:color-mix(in srgb,var(--theme-card,#fff) 94%,transparent)!important;
    box-shadow:0 5px 18px rgba(13,55,76,.045),inset 0 1px 0 rgba(255,255,255,.36)!important;
    transition:border-color .15s ease,box-shadow .15s ease,background .15s ease!important;
  }
  .game-screen #chatForm:focus-within {
    border-color:color-mix(in srgb,var(--theme-accent,#1b96d6) 48%,var(--theme-border,#d9e7ed))!important;
    box-shadow:0 8px 24px rgba(22,125,181,.10),0 0 0 2px color-mix(in srgb,var(--theme-accent,#1b96d6) 8%,transparent)!important;
  }
  .game-screen #chatForm textarea {
    min-height:42px!important;
    max-height:96px!important;
    padding:10px 8px 8px!important;
    color:var(--theme-text,#173f57)!important;
    font:500 13px/1.42 Inter,"Segoe UI",system-ui,sans-serif!important;
  }
  .game-screen #chatForm textarea::placeholder { color:var(--theme-muted,#8da3ae)!important; }
  .game-screen .chat-emoji-trigger {
    width:42px!important;
    height:42px!important;
    align-self:center!important;
    border-radius:13px!important;
  }
  .game-screen .chat-send-button {
    width:46px!important;
    height:46px!important;
    align-self:center!important;
    border-radius:14px!important;
    box-shadow:0 7px 18px rgba(24,145,211,.22)!important;
  }

  /* Emoji picker is a true popover. It is outside the conversation grid and cannot resize it. */
  .game-screen .chat-emoji-panel,
  .game-screen .chat-emoji-panel * { box-sizing:border-box!important; }
  .game-screen .chat-emoji-panel {
    position:absolute!important;
    z-index:120!important;
    left:16px!important;
    right:auto!important;
    bottom:82px!important;
    display:grid!important;
    grid-template-rows:45px minmax(0,1fr)!important;
    width:min(370px,calc(100% - 32px))!important;
    height:300px!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:min(300px,calc(100% - 132px))!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:1px solid var(--theme-border,#d9e7ed)!important;
    border-radius:18px!important;
    background:color-mix(in srgb,var(--theme-panel,#fff) 98%,transparent)!important;
    box-shadow:0 22px 55px rgba(10,38,54,.24),0 3px 10px rgba(10,38,54,.08)!important;
    backdrop-filter:blur(18px)!important;
    animation:chatEmojiPopoverIn .14s cubic-bezier(.2,.75,.25,1) both!important;
  }
  .game-screen .chat-emoji-panel[hidden] { display:none!important; }
  .game-screen .chat-emoji-categories {
    display:flex!important;
    align-items:center!important;
    gap:3px!important;
    width:100%!important;
    height:45px!important;
    margin:0!important;
    padding:5px 7px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-x:contain!important;
    scrollbar-width:none!important;
    border:0!important;
    border-bottom:1px solid var(--theme-border,#e2edf1)!important;
    background:color-mix(in srgb,var(--theme-card,#fff) 72%,transparent)!important;
  }
  .game-screen .chat-emoji-categories::-webkit-scrollbar { display:none!important; }
  .game-screen .chat-emoji-categories button {
    flex:0 0 34px!important;
    display:grid!important;
    place-items:center!important;
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    min-height:34px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    box-shadow:none!important;
    font:400 18px/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
    cursor:pointer!important;
  }
  .game-screen .chat-emoji-categories button span { display:block!important;width:auto!important;height:auto!important;line-height:1!important; }
  .game-screen .chat-emoji-categories button:hover { background:color-mix(in srgb,var(--theme-accent,#2198d8) 9%,transparent)!important; }
  .game-screen .chat-emoji-categories button.is-active {
    background:color-mix(in srgb,var(--theme-accent,#2198d8) 14%,transparent)!important;
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--theme-accent,#2198d8) 24%,transparent)!important;
  }
  .game-screen .chat-emoji-grid {
    display:grid!important;
    grid-template-columns:repeat(8,minmax(0,1fr))!important;
    grid-auto-rows:39px!important;
    align-content:start!important;
    gap:3px!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:9px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    scrollbar-width:thin!important;
    scrollbar-color:color-mix(in srgb,var(--theme-muted,#7893a0) 42%,transparent) transparent!important;
  }
  .game-screen .chat-emoji-grid button {
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    min-width:0!important;
    height:39px!important;
    min-height:39px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    box-shadow:none!important;
    font:400 23px/1 "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
    cursor:pointer!important;
    transition:background .1s ease,transform .1s ease!important;
  }
  .game-screen .chat-emoji-grid button:hover { background:color-mix(in srgb,var(--theme-accent,#2198d8) 8%,transparent)!important;transform:scale(1.08)!important; }
  .game-screen .chat-emoji-grid button:active { transform:scale(.93)!important; }
  html[data-game-theme="dark"] .game-screen .chat-emoji-panel {
    border-color:rgba(125,178,198,.20)!important;
    background:rgba(8,36,49,.985)!important;
    box-shadow:0 22px 55px rgba(0,12,20,.42)!important;
  }
  html[data-game-theme="dark"] .game-screen .chat-emoji-categories { border-color:rgba(125,178,198,.12)!important;background:rgba(255,255,255,.018)!important; }
}

@keyframes chatEmojiPopoverIn {
  from { opacity:0;transform:translateY(7px) scale(.985); }
  to { opacity:1;transform:translateY(0) scale(1); }
}

@media (max-width:760px) {
  /* Mobile keeps its own compact chat, but the picker must still be a popover rather than a layout row. */
  .game-screen .chat-emoji-panel {
    position:absolute!important;
    z-index:120!important;
    left:8px!important;
    right:8px!important;
    bottom:64px!important;
    display:grid!important;
    grid-template-rows:44px minmax(0,1fr)!important;
    width:auto!important;
    height:min(300px,45vh)!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border-radius:17px!important;
  }
  .game-screen .chat-emoji-panel[hidden] { display:none!important; }
  .game-screen .chat-emoji-categories {
    display:flex!important;
    gap:3px!important;
    padding:5px 6px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
  }
  .game-screen .chat-emoji-categories button { flex:0 0 34px!important;width:34px!important;height:34px!important;min-width:34px!important;padding:0!important;font-size:18px!important; }
  .game-screen .chat-emoji-grid { grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:3px!important;padding:8px!important;overflow-y:auto!important; }
  .game-screen .chat-emoji-grid button { width:100%!important;height:39px!important;padding:0!important;font-size:22px!important; }
}

/* v2.7.59 — readable trainer profile, portrait assets, teammate cards and detached stamina HUD */
.game-screen .player-chip-avatar,
.game-screen .party-hud-avatar {
  background-color:#eef8ff;
  background-image:url('/assets/v2.7/ui/player-profiles/trainer-boy-profile.png');
  background-position:center center;
  background-repeat:no-repeat;
  background-size:contain;
}
.game-screen .player-chip-avatar[data-skin="female"],
.game-screen .party-hud-avatar[data-skin="female"] {
  background-image:url('/assets/v2.7/ui/player-profiles/trainer-girl-profile.png');
}

.game-screen .player-stamina-hud {
  --party-hud-offset:0px;
  position:fixed;
  z-index:24;
  left:max(12px,env(safe-area-inset-left));
  top:calc(max(12px,env(safe-area-inset-top)) + 102px + var(--party-hud-offset));
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
  width:288px;
  min-height:34px;
  padding:5px 10px;
  border:1px solid rgba(117,180,202,.26);
  border-radius:12px;
  background:linear-gradient(145deg,rgba(7,39,51,.94),rgba(7,30,42,.92));
  box-shadow:0 9px 24px rgba(0,22,33,.19),inset 0 1px rgba(255,255,255,.07);
  color:#e9f7fb;
  pointer-events:none;
  backdrop-filter:blur(12px) saturate(1.06);
  transition:top .16s ease,border-color .16s ease,background .16s ease;
}
.game-screen .player-stamina-title {
  display:flex;
  align-items:baseline;
  gap:5px;
  min-width:76px;
  white-space:nowrap;
}
.game-screen .player-stamina-title small {
  color:#91b4c3;
  font-size:5.8px;
  font-weight:950;
  letter-spacing:.08em;
}
.game-screen .player-stamina-title b {
  color:#dff1f7;
  font-size:7.3px;
  font-weight:850;
}
.game-screen .player-stamina-meter {
  display:grid;
  grid-template-columns:minmax(0,1fr) 24px;
  align-items:center;
  gap:7px;
  min-width:0;
}
.game-screen .player-stamina-meter > i {
  position:relative;
  display:block;
  height:6px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.12);
}
.game-screen .player-stamina-meter > i > b {
  position:absolute;
  inset:0 auto 0 0;
  width:0;
  border-radius:inherit;
  background:linear-gradient(90deg,#52bd3d,#a8df39);
  box-shadow:0 0 7px rgba(116,205,58,.26);
  transition:width .2s ease,background .16s ease;
}
.game-screen .player-stamina-meter > em {
  color:#d1e5ec;
  font-size:6.8px;
  font-style:normal;
  font-weight:850;
  font-variant-numeric:tabular-nums;
  text-align:right;
}
.game-screen .player-stamina-hud.is-tired .player-stamina-meter > i > b {
  background:linear-gradient(90deg,#e77735,#f4af3d);
}
.game-screen .player-stamina-hud.is-critical {
  border-color:rgba(236,105,67,.38);
}
.game-screen .player-stamina-hud.is-critical .player-stamina-meter > i > b {
  background:linear-gradient(90deg,#dc4f42,#ef8441);
}

@media (min-width:761px) {
  .game-screen .player-chip {
    width:288px;
    min-width:288px;
    min-height:90px;
    padding:9px 12px 9px 9px;
    gap:11px;
    align-items:center;
    border:1px solid rgba(117,180,202,.28);
    border-radius:22px;
    background:linear-gradient(145deg,rgba(7,39,51,.95),rgba(7,30,42,.91));
    box-shadow:0 12px 30px rgba(0,22,33,.22),inset 0 1px rgba(255,255,255,.08);
  }
  .game-screen .player-chip-avatar {
    width:66px;
    height:66px;
    flex:0 0 66px;
    border:2px solid color-mix(in srgb,var(--role-color,#39aef4) 60%,#fff);
    border-radius:50%;
    background-size:112% 112%;
    box-shadow:0 0 0 4px color-mix(in srgb,var(--role-color,#39aef4) 14%,transparent),0 8px 18px rgba(0,25,38,.18);
  }
  .game-screen .player-chip-copy {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto auto auto;
    gap:3px;
    width:100%;
    min-width:0;
    padding:0;
  }
  .game-screen .player-chip-identity {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    min-width:0;
  }
  .game-screen #worldPlayerName {
    max-width:none;
    color:#f4fbfd;
    font-size:13px;
    font-weight:900;
    letter-spacing:-.12px;
    line-height:1.05;
  }
  .game-screen #worldPlayerLevel {
    flex:0 0 auto;
    padding:2px 5px;
    border:1px solid rgba(102,185,226,.2);
    border-radius:7px;
    background:rgba(89,174,220,.08);
    color:#bfe5f5;
    font-size:6.7px;
    font-weight:900;
  }
  .game-screen .player-connection {
    gap:4px;
    min-height:10px;
    color:#8faebb;
    font-size:6.1px!important;
  }
  .game-screen .player-community-role {
    left:13px;
    bottom:8px;
    max-width:58px;
    border-radius:7px;
    font-size:5px!important;
  }
  .game-screen .player-chip-progress {
    display:grid;
    grid-template-columns:30px minmax(0,1fr) 49px;
    align-items:center;
    gap:6px;
    min-width:0;
    margin:0;
  }
  .game-screen .player-chip-progress > small {
    margin:0;
    color:#91adba;
    font-size:5.7px!important;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
  }
  .game-screen .player-chip-progress > i {
    position:relative;
    display:block;
    height:6px;
    overflow:hidden;
    border-radius:999px;
    background:rgba(255,255,255,.11);
  }
  .game-screen .player-chip-progress > i > b {
    position:absolute;
    inset:0 auto 0 0;
    width:0;
    border-radius:inherit;
    transition:width .2s ease,background .16s ease;
  }
  .game-screen .player-chip-progress.is-exp > i > b {
    background:linear-gradient(90deg,#238ee9,#58c9ff);
    box-shadow:0 0 7px rgba(64,179,245,.34);
  }
  .game-screen .player-chip-progress.is-energy > i > b {
    background:linear-gradient(90deg,#efb22a,#ffd94b);
    box-shadow:0 0 7px rgba(246,190,52,.24);
  }
  .game-screen .player-chip.is-low-energy .player-chip-progress.is-energy > i > b {
    background:linear-gradient(90deg,#dc5845,#ee8a42);
  }
  .game-screen .player-chip-progress > em {
    color:#c8dde5;
    font-size:6.2px;
    font-style:normal;
    font-weight:800;
    font-variant-numeric:tabular-nums;
    text-align:right;
    white-space:nowrap;
  }

  .game-screen .party-hud {
    position:fixed;
    z-index:24;
    top:calc(max(12px,env(safe-area-inset-top)) + 102px);
    left:max(12px,env(safe-area-inset-left));
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
    width:288px;
    max-width:288px;
    pointer-events:auto;
  }
  .game-screen .party-hud[hidden] { display:none!important; }
  .game-screen .party-hud-member {
    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:center;
    gap:9px;
    width:100%;
    min-width:0;
    min-height:68px;
    padding:7px 10px 7px 7px;
    overflow:hidden;
    border:1px solid rgba(174,120,244,.42);
    border-radius:18px;
    background:linear-gradient(145deg,rgba(38,27,58,.94),rgba(25,21,43,.93));
    color:#fff;
    box-shadow:0 10px 26px rgba(43,18,72,.23),inset 0 1px rgba(255,255,255,.07);
    text-align:left;
    backdrop-filter:blur(12px) saturate(1.04);
    transition:transform .14s ease,border-color .14s ease,opacity .14s ease;
  }
  .game-screen .party-hud-member:not(:disabled):hover { transform:translateY(-1px);border-color:rgba(195,149,253,.68); }
  .game-screen .party-hud-member:disabled { opacity:.68;cursor:default; }
  .game-screen .party-hud-member.is-online { border-color:rgba(181,117,247,.58); }
  .game-screen .party-hud-member.is-leader { border-color:rgba(223,178,255,.7); }
  .game-screen .party-hud-avatar {
    position:relative;
    display:block;
    width:48px;
    height:48px;
    overflow:hidden;
    border:2px solid rgba(220,191,255,.72);
    border-radius:50%;
    background-size:112% 112%;
    box-shadow:0 0 0 3px rgba(177,111,244,.13);
  }
  .game-screen .party-hud-avatar img {
    position:absolute;
    right:-2px;
    bottom:-2px;
    width:17px;
    height:17px;
    filter:drop-shadow(0 1px 2px rgba(28,10,49,.45));
  }
  .game-screen .party-hud-avatar i {
    position:absolute;
    left:0;
    top:-1px;
    font-size:8px;
    font-style:normal;
  }
  .game-screen .party-hud-copy { display:grid;gap:2px;min-width:0; }
  .game-screen .party-hud-identity {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:7px;
    min-width:0;
  }
  .game-screen .party-hud-identity b {
    min-width:0;
    overflow:hidden;
    color:#fff;
    font-size:10.5px;
    font-weight:900;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .game-screen .party-hud-identity em {
    flex:0 0 auto;
    color:#dbc5f5;
    font-size:6.4px;
    font-style:normal;
    font-weight:850;
  }
  .game-screen .party-hud-status {
    display:flex;
    align-items:center;
    gap:4px;
    min-width:0;
  }
  .game-screen .party-hud-status > i {
    width:5px;
    height:5px;
    flex:0 0 5px;
    border-radius:50%;
    background:#737786;
    box-shadow:0 0 0 2px rgba(255,255,255,.05);
  }
  .game-screen .party-hud-member.is-online .party-hud-status > i { background:#55d978;box-shadow:0 0 0 2px rgba(85,217,120,.12); }
  .game-screen .party-hud-status small {
    overflow:hidden;
    color:#bca5d4;
    font-size:5.2px;
    font-weight:950;
    letter-spacing:.07em;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .game-screen .party-hud-lead {
    overflow:hidden;
    color:#ddd1e9;
    font-size:6.4px;
    line-height:1.1;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
}

html[data-game-theme="light"] .game-screen .player-chip,
html[data-game-theme="light"] .game-screen .player-stamina-hud {
  border-color:rgba(183,211,223,.96);
  background:rgba(248,253,255,.965);
  color:#173f57;
  box-shadow:0 11px 28px rgba(24,66,88,.14),inset 0 1px #fff;
}
html[data-game-theme="light"] .game-screen #worldPlayerName { color:#153d58; }
html[data-game-theme="light"] .game-screen #worldPlayerLevel {
  border-color:#d4e6ee;
  background:#eef7fb;
  color:#3f687d;
}
html[data-game-theme="light"] .game-screen .player-connection,
html[data-game-theme="light"] .game-screen .player-chip-progress > small { color:#678697; }
html[data-game-theme="light"] .game-screen .player-chip-progress > i,
html[data-game-theme="light"] .game-screen .player-stamina-meter > i { background:#dce9ef; }
html[data-game-theme="light"] .game-screen .player-chip-progress > em { color:#486c80; }
html[data-game-theme="light"] .game-screen .player-stamina-title small { color:#6a8999; }
html[data-game-theme="light"] .game-screen .player-stamina-title b { color:#315d72; }
html[data-game-theme="light"] .game-screen .player-stamina-meter > em { color:#496e80; }
html[data-game-theme="light"] .game-screen .party-hud-member {
  border-color:#ceb6eb;
  background:rgba(251,248,255,.97);
  color:#442561;
  box-shadow:0 9px 23px rgba(86,55,120,.14),inset 0 1px #fff;
}
html[data-game-theme="light"] .game-screen .party-hud-member.is-online { border-color:#ba91e9; }
html[data-game-theme="light"] .game-screen .party-hud-identity b { color:#40205e; }
html[data-game-theme="light"] .game-screen .party-hud-identity em { color:#7b5599; }
html[data-game-theme="light"] .game-screen .party-hud-status small { color:#815da0; }
html[data-game-theme="light"] .game-screen .party-hud-lead { color:#715b83; }

@media (max-width:760px) {
  .game-screen .player-chip {
    width:min(178px,calc(100vw - 170px));
    min-width:150px;
    min-height:78px;
    padding:6px 7px 6px 6px;
    gap:7px;
    align-items:center;
    border-radius:17px;
  }
  .game-screen .player-chip-avatar {
    width:48px;
    height:48px;
    flex:0 0 48px;
    border-radius:50%;
    background-size:114% 114%;
  }
  .game-screen .player-chip-copy {
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto auto auto;
    gap:2px;
    width:100%;
    min-width:0;
  }
  .game-screen .player-chip-identity { display:flex;align-items:center;justify-content:space-between;gap:4px;min-width:0; }
  .game-screen #worldPlayerName { max-width:none;font-size:9.5px;line-height:1; }
  .game-screen #worldPlayerLevel { flex:0 0 auto;font-size:5.3px;font-style:normal;font-weight:900;white-space:nowrap; }
  .game-screen .player-community-role { left:7px;bottom:5px;max-width:40px;padding:1px 3px;font-size:4px!important; }
  .game-screen .player-connection { margin:0;font-size:4.8px!important; }
  .game-screen .player-chip-progress {
    display:grid;
    grid-template-columns:18px minmax(0,1fr) 31px;
    align-items:center;
    gap:3px;
    min-width:0;
    margin:0;
  }
  .game-screen .player-chip-progress > small { font-size:4.5px!important;font-weight:900; }
  .game-screen .player-chip-progress > i { height:4px; }
  .game-screen .player-chip-progress > em { font-size:4.6px;font-style:normal;font-weight:800;text-align:right;white-space:nowrap; }
  .game-screen .player-chip-progress.is-energy > small { font-size:0!important; }
  .game-screen .player-chip-progress.is-energy > small::after { content:'ЭН';font-size:4.5px; }

  .game-screen .party-hud {
    position:fixed;
    z-index:24;
    top:calc(max(8px,env(safe-area-inset-top)) + 86px);
    left:max(8px,env(safe-area-inset-left));
    display:flex;
    flex-direction:column;
    gap:5px;
    width:min(178px,calc(100vw - 170px));
    max-width:178px;
  }
  .game-screen .party-hud[hidden] { display:none!important; }
  .game-screen .party-hud-member {
    display:grid;
    grid-template-columns:39px minmax(0,1fr);
    align-items:center;
    gap:6px;
    width:100%;
    min-width:0;
    min-height:52px;
    padding:5px 6px 5px 5px;
    border:1px solid rgba(183,124,255,.54);
    border-radius:14px;
    background:linear-gradient(150deg,rgba(55,32,82,.95),rgba(33,24,51,.94));
    box-shadow:0 8px 19px rgba(47,24,72,.22),inset 0 1px rgba(255,255,255,.07);
    text-align:left;
  }
  .game-screen .party-hud-member:disabled { opacity:.68; }
  .game-screen .party-hud-avatar { width:39px;height:39px;border:1.5px solid rgba(220,191,255,.7);border-radius:50%;background-size:114% 114%; }
  .game-screen .party-hud-avatar img { right:-2px;bottom:-2px;width:14px;height:14px; }
  .game-screen .party-hud-avatar i { left:0;top:-1px;font-size:6px; }
  .game-screen .party-hud-copy { display:grid;gap:1px;min-width:0; }
  .game-screen .party-hud-identity { display:flex;align-items:center;justify-content:space-between;gap:3px;min-width:0; }
  .game-screen .party-hud-identity b { min-width:0;overflow:hidden;color:#fff;font-size:7.5px;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .party-hud-identity em { flex:0 0 auto;color:#d8c0ee;font-size:5px;font-style:normal; }
  .game-screen .party-hud-status { display:flex;align-items:center;gap:3px; }
  .game-screen .party-hud-status > i { width:4px;height:4px;flex:0 0 4px;border-radius:50%;background:#737786; }
  .game-screen .party-hud-member.is-online .party-hud-status > i { background:#55d978; }
  .game-screen .party-hud-status small { overflow:hidden;color:#bca5d4;font-size:4px;font-weight:900;letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap; }
  .game-screen .party-hud-lead { overflow:hidden;color:#ded1ea;font-size:4.8px;text-overflow:ellipsis;white-space:nowrap; }

  .game-screen .player-stamina-hud {
    left:max(8px,env(safe-area-inset-left));
    top:calc(max(8px,env(safe-area-inset-top)) + 86px + var(--party-hud-offset));
    grid-template-columns:29px minmax(0,1fr);
    gap:5px;
    width:min(178px,calc(100vw - 170px));
    min-height:25px;
    padding:4px 6px;
    border-radius:10px;
  }
  .game-screen .player-stamina-title { min-width:0; }
  .game-screen .player-stamina-title small { font-size:4.4px; }
  .game-screen .player-stamina-title b { display:none; }
  .game-screen .player-stamina-meter { grid-template-columns:minmax(0,1fr) 18px;gap:4px; }
  .game-screen .player-stamina-meter > i { height:4px; }
  .game-screen .player-stamina-meter > em { font-size:4.8px; }
}

/* v2.7.59 — stamina follows the real teammate stack height without JS layout math */
.game-screen .party-hud[data-count="1"] + .player-stamina-hud { --party-hud-offset:74px; }
.game-screen .party-hud[data-count="2"] + .player-stamina-hud { --party-hud-offset:148px; }
@media (max-width:760px) {
  .game-screen .party-hud[data-count="1"] + .player-stamina-hud { --party-hud-offset:57px; }
  .game-screen .party-hud[data-count="2"] + .player-stamina-hud { --party-hud-offset:114px; }
}
html[data-game-theme="light"] .game-screen .party-hud-member {
  border-color:#ceb6eb;
  background:rgba(251,248,255,.97);
  color:#442561;
  box-shadow:0 9px 23px rgba(86,55,120,.14),inset 0 1px #fff;
}
html[data-game-theme="light"] .game-screen .party-hud-member.is-online { border-color:#ba91e9; }
html[data-game-theme="light"] .game-screen .party-hud-identity b { color:#40205e; }
html[data-game-theme="light"] .game-screen .party-hud-identity em { color:#7b5599; }
html[data-game-theme="light"] .game-screen .party-hud-status small { color:#815da0; }
html[data-game-theme="light"] .game-screen .party-hud-lead { color:#715b83; }


/* v2.7.60 — modern top-left trainer HUD polish: clearer hierarchy, party presence, compact resources */
.game-screen .player-chip,
.game-screen .party-hud-member,
.game-screen .player-stamina-hud,
.game-screen .party-hud-head { box-sizing:border-box; }

.game-screen .player-chip {
  isolation:isolate;
  position:relative;
  cursor:pointer;
  outline:none;
}
.game-screen .player-chip::before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(115deg,color-mix(in srgb,var(--role-color,#39aef4) 12%,transparent),transparent 42%);
  pointer-events:none;
}
.game-screen .player-chip-avatar {
  color:transparent!important;
  font-size:0!important;
}
.game-screen .player-chip-meta {
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  min-height:11px;
}
.game-screen .player-chip-meta .player-community-role {
  position:static!important;
  inset:auto!important;
  display:inline-flex;
  align-items:center;
  gap:3px;
  max-width:86px;
  min-height:0;
  margin:0;
  padding:1px 5px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--role-color,#39aef4) 35%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--role-color,#39aef4) 11%,transparent);
  color:color-mix(in srgb,var(--role-color,#39aef4) 72%,#fff);
  font-size:5.2px!important;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-screen .player-chip-meta .player-community-role[hidden] { display:none!important; }
.game-screen .player-chip-meta .player-community-role .ui-icon { width:9px;height:9px; }
.game-screen .player-chip-meta .player-connection {
  display:flex;
  align-items:center;
  gap:4px;
  min-width:0;
  margin:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-screen .player-chip-open-hint {
  position:absolute;
  right:6px;
  top:50%;
  display:grid;
  place-items:center;
  width:14px;
  height:25px;
  transform:translateY(-50%);
  border-radius:8px;
  color:rgba(207,232,241,.45);
  font:700 17px/1 system-ui;
  transition:transform .14s ease,color .14s ease,background .14s ease;
}
.game-screen .player-chip:hover .player-chip-open-hint,
.game-screen .player-chip:focus-visible .player-chip-open-hint {
  transform:translate(2px,-50%);
  color:#fff;
  background:rgba(255,255,255,.06);
}
.game-screen .player-chip:focus-visible,
.game-screen .party-hud-member:focus-visible {
  outline:2px solid color-mix(in srgb,#64c8ff 76%,#fff);
  outline-offset:2px;
}
.game-screen .player-chip-progress.is-exp > i { box-shadow:inset 0 0 0 1px rgba(255,255,255,.025); }
.game-screen .player-chip-progress.is-energy { opacity:.86; }
.game-screen .player-chip-progress.is-energy > i { height:5px; }
.game-screen .player-chip.is-low-energy .player-chip-progress.is-energy { opacity:1; }

.game-screen .party-hud-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  width:100%;
  min-height:26px;
  padding:5px 8px;
  border:1px solid rgba(180,132,237,.24);
  border-radius:11px;
  background:linear-gradient(145deg,rgba(28,24,42,.84),rgba(18,25,35,.82));
  color:#e9dcf7;
  box-shadow:0 7px 17px rgba(20,12,35,.14),inset 0 1px rgba(255,255,255,.05);
  backdrop-filter:blur(10px);
  pointer-events:none;
}
.game-screen .party-hud-head > span { display:flex;align-items:baseline;gap:6px;min-width:0; }
.game-screen .party-hud-head small { color:#bda5d2;font-size:5.3px;font-weight:950;letter-spacing:.09em; }
.game-screen .party-hud-head b { color:#fff;font-size:7.2px;font-weight:950;font-variant-numeric:tabular-nums; }
.game-screen .party-hud-head em { overflow:hidden;color:#9f89b5;font-size:5.5px;font-style:normal;font-weight:800;text-overflow:ellipsis;white-space:nowrap; }

.game-screen .party-hud-member { position:relative; padding-right:24px!important; }
.game-screen .party-hud-member::before {
  content:'';
  position:absolute;
  left:0;
  top:14px;
  bottom:14px;
  width:2px;
  border-radius:0 3px 3px 0;
  background:#8660ad;
  opacity:.36;
}
.game-screen .party-hud-member.is-online::before { background:#8f6fc0;opacity:.75; }
.game-screen .party-hud-member.is-nearby::before { background:#58d18a;box-shadow:0 0 8px rgba(88,209,138,.34); }
.game-screen .party-hud-member.is-leader::before { background:#f0c64f;box-shadow:0 0 8px rgba(240,198,79,.25); }
.game-screen .party-hud-member.is-offline .party-hud-avatar { filter:grayscale(.7) saturate(.55); }
.game-screen .party-hud-member.is-offline .party-hud-copy { opacity:.72; }
.game-screen .party-hud-status .party-hud-relation { letter-spacing:.055em; }
.game-screen .party-hud-member.is-nearby .party-hud-status > i { background:#58d18a!important;box-shadow:0 0 0 2px rgba(88,209,138,.14),0 0 7px rgba(88,209,138,.22)!important; }
.game-screen .party-hud-member.is-away .party-hud-status > i { background:#9a86ae!important; }
.game-screen .party-hud-lead {
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
  margin-top:1px;
}
.game-screen .party-hud-lead > small {
  flex:0 0 auto;
  margin:0;
  padding:2px 4px;
  border-radius:5px;
  background:rgba(166,112,231,.11);
  color:#a88fc1;
  font-size:4.5px;
  font-weight:950;
  letter-spacing:.05em;
}
.game-screen .party-hud-lead > b {
  min-width:0;
  overflow:hidden;
  color:#e5dceb;
  font-size:6.1px!important;
  font-weight:750!important;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.game-screen .party-hud-open {
  position:absolute;
  right:7px;
  top:50%;
  transform:translateY(-50%);
  color:rgba(226,207,244,.38);
  font:700 15px/1 system-ui;
  transition:transform .14s ease,color .14s ease;
}
.game-screen .party-hud-member:not(:disabled):hover .party-hud-open,
.game-screen .party-hud-member:focus-visible .party-hud-open { transform:translate(2px,-50%);color:#fff; }

.game-screen .player-stamina-hud {
  overflow:hidden;
  opacity:.84;
  transition:top .16s ease,opacity .18s ease,border-color .16s ease,background .16s ease,transform .18s ease;
}
.game-screen .player-stamina-hud::before {
  content:'';
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:#78cb50;
  opacity:.8;
}
.game-screen .player-stamina-hud.is-full:not(.is-moving) { opacity:.66; }
.game-screen .player-stamina-hud.is-moving { opacity:1;transform:translateX(2px); }
.game-screen .player-stamina-hud.is-tired::before { background:#efa33c; }
.game-screen .player-stamina-hud.is-critical::before { background:#e45e4f; }
.game-screen .player-stamina-hud.is-critical { opacity:1; }

html[data-game-theme="light"] .game-screen .player-chip-open-hint { color:rgba(58,91,110,.42); }
html[data-game-theme="light"] .game-screen .player-chip:hover .player-chip-open-hint,
html[data-game-theme="light"] .game-screen .player-chip:focus-visible .player-chip-open-hint { color:#167fbb;background:rgba(33,137,194,.07); }
html[data-game-theme="light"] .game-screen .player-chip-meta .player-community-role { color:color-mix(in srgb,var(--role-color,#228bc7) 74%,#173f57); }
html[data-game-theme="light"] .game-screen .party-hud-head {
  border-color:#d7c7e8;
  background:rgba(252,249,255,.94);
  color:#4b2e62;
  box-shadow:0 7px 18px rgba(75,47,102,.09),inset 0 1px #fff;
}
html[data-game-theme="light"] .game-screen .party-hud-head small { color:#8669a0; }
html[data-game-theme="light"] .game-screen .party-hud-head b { color:#4c2b68; }
html[data-game-theme="light"] .game-screen .party-hud-head em { color:#876f99; }
html[data-game-theme="light"] .game-screen .party-hud-lead > small { background:#efe5fa;color:#7b5599; }
html[data-game-theme="light"] .game-screen .party-hud-lead > b { color:#6b567c!important; }
html[data-game-theme="light"] .game-screen .party-hud-open { color:rgba(87,56,112,.32); }

@media (min-width:761px) {
  .game-screen .player-chip {
    width:276px;
    min-width:276px;
    min-height:82px;
    padding:8px 24px 8px 8px;
    gap:10px;
    border-radius:20px;
  }
  .game-screen .player-chip-avatar {
    width:58px;
    height:58px;
    flex:0 0 58px;
    border-width:2px;
    background-size:110% 110%;
  }
  .game-screen .player-chip-copy { gap:2px; }
  .game-screen #worldPlayerName { font-size:12.5px; }
  .game-screen #worldPlayerLevel { padding:2px 6px;font-size:6.5px; }
  .game-screen .player-chip-progress { grid-template-columns:29px minmax(0,1fr) 49px;gap:5px; }
  .game-screen .player-chip-progress > i { height:6px; }
  .game-screen .player-chip-progress.is-energy > i { height:4px; }

  .game-screen .party-hud {
    top:calc(max(12px,env(safe-area-inset-top)) + 92px);
    width:276px;
    max-width:276px;
    gap:5px;
  }
  .game-screen .party-hud-member {
    grid-template-columns:43px minmax(0,1fr);
    min-height:58px;
    padding:6px 24px 6px 6px!important;
    gap:8px;
    border-radius:16px;
  }
  .game-screen .party-hud-avatar { width:43px;height:43px;background-size:110% 110%; }
  .game-screen .party-hud-identity b { font-size:9.6px; }
  .game-screen .party-hud-identity em { font-size:6px; }
  .game-screen .party-hud-status small { font-size:4.9px; }

  .game-screen .player-stamina-hud {
    left:max(12px,env(safe-area-inset-left));
    top:calc(max(12px,env(safe-area-inset-top)) + 92px + var(--party-hud-offset));
    width:276px;
    min-height:29px;
    padding:4px 9px 4px 11px;
    border-radius:11px;
  }
  .game-screen .player-stamina-title { min-width:68px; }
  .game-screen .player-stamina-title small { font-size:5.3px; }
  .game-screen .player-stamina-title b { font-size:6.6px; }
  .game-screen .player-stamina-meter > i { height:5px; }
  .game-screen .player-stamina-meter > em { font-size:6.2px; }
  .game-screen .party-hud[data-count="1"] + .player-stamina-hud { --party-hud-offset:94px; }
  .game-screen .party-hud[data-count="2"] + .player-stamina-hud { --party-hud-offset:157px; }
}

@media (max-width:760px) {
  .game-screen .player-chip {
    width:min(190px,calc(100vw - 164px));
    min-width:156px;
    min-height:70px;
    padding:5px 18px 5px 5px;
    gap:6px;
    border-radius:16px;
  }
  .game-screen .player-chip-avatar { width:44px;height:44px;flex:0 0 44px;background-size:112% 112%; }
  .game-screen #worldPlayerName { font-size:9.2px; }
  .game-screen #worldPlayerLevel { font-size:5px; }
  .game-screen .player-chip-meta { gap:3px;min-height:8px; }
  .game-screen .player-chip-meta .player-community-role { max-width:54px;padding:1px 3px;font-size:3.9px!important; }
  .game-screen .player-chip-meta .player-community-role .ui-icon { width:7px;height:7px; }
  .game-screen .player-connection { font-size:4.4px!important; }
  .game-screen .player-chip-open-hint { right:3px;width:12px;height:20px;font-size:14px; }

  .game-screen .party-hud {
    top:calc(max(8px,env(safe-area-inset-top)) + 77px);
    width:min(190px,calc(100vw - 164px));
    max-width:190px;
    gap:4px;
  }
  .game-screen .party-hud-head { min-height:21px;padding:3px 6px;border-radius:9px; }
  .game-screen .party-hud-head small { font-size:4px; }
  .game-screen .party-hud-head b { font-size:5.8px; }
  .game-screen .party-hud-head em { font-size:4.2px; }
  .game-screen .party-hud-member {
    grid-template-columns:36px minmax(0,1fr);
    min-height:48px;
    padding:4px 19px 4px 4px!important;
    gap:5px;
    border-radius:13px;
  }
  .game-screen .party-hud-member::before { top:11px;bottom:11px; }
  .game-screen .party-hud-avatar { width:36px;height:36px; }
  .game-screen .party-hud-identity b { font-size:7.3px; }
  .game-screen .party-hud-identity em { font-size:4.7px; }
  .game-screen .party-hud-status small { font-size:3.8px; }
  .game-screen .party-hud-lead { gap:3px; }
  .game-screen .party-hud-lead > small { display:none; }
  .game-screen .party-hud-lead > b { font-size:4.6px!important; }
  .game-screen .party-hud-open { right:5px;font-size:12px; }

  .game-screen .player-stamina-hud {
    top:calc(max(8px,env(safe-area-inset-top)) + 77px + var(--party-hud-offset));
    width:min(190px,calc(100vw - 164px));
    min-height:23px;
    padding:3px 6px 3px 9px;
  }
  .game-screen .party-hud[data-count="1"] + .player-stamina-hud { --party-hud-offset:78px; }
  .game-screen .party-hud[data-count="2"] + .player-stamina-hud { --party-hud-offset:130px; }
}

@media (max-width:420px) {
  .game-screen .player-chip,
  .game-screen .party-hud,
  .game-screen .player-stamina-hud { width:min(182px,calc(100vw - 148px)); }
  .game-screen .party-hud-status small { max-width:92px; }
  .game-screen .player-chip-progress { grid-template-columns:17px minmax(0,1fr) 29px; }
}

@media (prefers-reduced-motion:reduce) {
  .game-screen .player-chip-open-hint,
  .game-screen .party-hud-open,
  .game-screen .player-stamina-hud,
  .game-screen .party-hud-member { transition:none!important;animation:none!important; }
}

/* v2.7.61 — trainer progression, professions, factions and clan concept */
.game-screen .side-panel.is-progression-panel,
.game-screen .side-panel.is-factions-panel {
  width:min(920px,calc(100vw - 132px));
  padding:18px;
}
.progression-window-v2761,
.factions-window-v2761 { display:grid; gap:13px; min-width:0; color:var(--theme-text); }
.progression-icon { width:24px; height:24px; display:block; }
.progression-hero-v2761,
.factions-hero-v2761 {
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:13px;
  padding:15px 16px; border:1px solid var(--theme-border); border-radius:19px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--theme-accent) 10%,var(--theme-card)),var(--theme-card));
}
.progression-hero-v2761 > span,
.factions-hero-v2761 > span {
  display:grid; place-items:center; width:48px; height:48px; border-radius:15px;
  color:var(--theme-accent); background:color-mix(in srgb,var(--theme-accent) 13%,transparent);
  border:1px solid color-mix(in srgb,var(--theme-accent) 24%,var(--theme-border));
}
.progression-hero-v2761 > div,
.factions-hero-v2761 > div { min-width:0; }
.progression-hero-v2761 small,
.factions-hero-v2761 small { display:block; margin-bottom:2px; font-size:8px; font-weight:900; letter-spacing:.09em; color:var(--theme-accent); }
.progression-hero-v2761 h2,
.factions-hero-v2761 h2 { margin:0; font-size:22px; line-height:1.05; color:var(--theme-text); }
.progression-hero-v2761 p,
.factions-hero-v2761 p { margin:5px 0 0; max-width:710px; font-size:10px; line-height:1.42; color:var(--theme-muted); }
.progression-hero-v2761 > strong,
.factions-hero-v2761 > strong {
  align-self:start; padding:7px 10px; border-radius:11px; font-size:9px; white-space:nowrap;
  color:color-mix(in srgb,var(--faction-accent,var(--theme-accent)) 84%,var(--theme-text));
  border:1px solid color-mix(in srgb,var(--faction-accent,var(--theme-accent)) 30%,var(--theme-border));
  background:color-mix(in srgb,var(--faction-accent,var(--theme-accent)) 11%,var(--theme-card));
}
.progression-tabs-v2761 { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.progression-tabs-v2761 button {
  display:flex; align-items:center; justify-content:center; gap:8px; min-height:40px; padding:8px 12px;
  border:1px solid var(--theme-border); border-radius:13px; background:var(--theme-card); color:var(--theme-muted); font:inherit; font-size:10px; font-weight:900; cursor:pointer;
}
.progression-tabs-v2761 button em { display:grid; place-items:center; min-width:21px; height:21px; padding:0 6px; border-radius:999px; font-style:normal; background:var(--theme-surface-soft); color:var(--theme-muted); }
.progression-tabs-v2761 button.is-active { border-color:color-mix(in srgb,var(--theme-accent) 55%,var(--theme-border)); color:var(--theme-text); background:color-mix(in srgb,var(--theme-accent) 9%,var(--theme-card)); box-shadow:inset 0 -2px 0 var(--theme-accent); }
.progression-tabs-v2761 button.is-active em { background:var(--theme-accent); color:white; }
.progression-summary-v2761 {
  display:grid; grid-template-columns:repeat(3,minmax(96px,130px)) minmax(220px,1fr); gap:8px; align-items:stretch;
}
.progression-summary-v2761.is-mastery { grid-template-columns:repeat(4,minmax(96px,130px)) minmax(210px,1fr); }
.progression-summary-v2761 > span { display:flex; flex-direction:column; justify-content:center; min-height:58px; padding:9px 11px; border:1px solid var(--theme-border); border-radius:13px; background:var(--theme-card); }
.progression-summary-v2761 small { font-size:7px; color:var(--theme-muted); }
.progression-summary-v2761 b { margin-top:2px; font-size:15px; color:var(--theme-text); }
.progression-summary-v2761 p { margin:0; display:flex; align-items:center; padding:10px 12px; border-radius:13px; background:var(--theme-surface-soft); color:var(--theme-muted); font-size:9px; line-height:1.4; }
.talent-grid-v2761 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.talent-branch-v2761,
.mastery-card-v2761,
.faction-card-v2761,
.clan-empty-v2761,
.clan-create-v2761,
.clan-dashboard-v2761,
.factions-footer-v2761 {
  border:1px solid var(--theme-border); background:var(--theme-card); border-radius:16px;
}
.talent-branch-v2761 { overflow:hidden; }
.talent-branch-v2761 > header,
.mastery-card-v2761 > header {
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:10px; align-items:center; padding:11px 12px;
  border-bottom:1px solid var(--theme-border); background:linear-gradient(110deg,color-mix(in srgb,var(--branch-accent,var(--mastery-accent)) 12%,var(--theme-card)),var(--theme-card));
}
.talent-branch-v2761 > header > i,
.mastery-card-v2761 > header > i,
.faction-card-v2761 > header > i,
.clan-create-v2761 > header > i,
.clan-dashboard-v2761 > header > i,
.clan-empty-v2761 > i {
  display:grid; place-items:center; width:38px; height:38px; border-radius:12px; color:var(--branch-accent,var(--mastery-accent,var(--faction-accent,var(--theme-accent))));
  background:color-mix(in srgb,var(--branch-accent,var(--mastery-accent,var(--faction-accent,var(--theme-accent)))) 12%,transparent);
}
.talent-branch-v2761 header span,
.mastery-card-v2761 header span { min-width:0; }
.talent-branch-v2761 header small,
.mastery-card-v2761 header small { display:block; font-size:7px; font-weight:900; color:var(--branch-accent,var(--mastery-accent)); }
.talent-branch-v2761 header b,
.mastery-card-v2761 header b { display:block; margin-top:1px; font-size:13px; color:var(--theme-text); }
.talent-branch-v2761 header em,
.mastery-card-v2761 header em { display:block; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:8px; font-style:normal; color:var(--theme-muted); }
.talent-branch-v2761 header strong { padding:5px 7px; border-radius:9px; color:var(--branch-accent); background:color-mix(in srgb,var(--branch-accent) 11%,transparent); font-size:9px; }
.talent-path-v2761 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:9px; }
.talent-node-v2761 {
  position:relative; display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:7px; min-height:48px; padding:6px 7px; text-align:left;
  border:1px solid var(--theme-border); border-radius:11px; background:var(--theme-surface-soft); color:var(--theme-muted); font:inherit;
}
.talent-node-v2761 > i,
.mastery-rank-v2761 > i { display:grid; place-items:center; width:25px; height:25px; border-radius:50%; border:1px solid var(--theme-border); background:var(--theme-card); font-size:8px; font-style:normal; font-weight:950; color:var(--theme-muted); flex:0 0 auto; }
.talent-node-v2761 b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:8px; color:var(--theme-text); }
.talent-node-v2761 small { display:block; margin-top:2px; font-size:6.7px; line-height:1.25; color:var(--theme-muted); }
.talent-node-v2761.is-unlocked { border-color:color-mix(in srgb,var(--branch-accent) 40%,var(--theme-border)); background:color-mix(in srgb,var(--branch-accent) 8%,var(--theme-card)); }
.talent-node-v2761.is-unlocked > i { color:white; border-color:transparent; background:var(--branch-accent); }
.talent-node-v2761.is-next:not(:disabled) { cursor:pointer; border-color:color-mix(in srgb,var(--branch-accent) 65%,var(--theme-border)); box-shadow:0 0 0 2px color-mix(in srgb,var(--branch-accent) 9%,transparent); }
.talent-node-v2761.is-next:not(:disabled):hover { transform:translateY(-1px); background:color-mix(in srgb,var(--branch-accent) 12%,var(--theme-card)); }
.talent-node-v2761:disabled { opacity:.62; cursor:default; }
.progression-footer-v2761 { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:3px 2px; color:var(--theme-muted); font-size:8px; }
.progression-footer-v2761 button,
.clan-dashboard-v2761 footer button { padding:7px 10px; border:1px solid var(--theme-border); border-radius:10px; background:var(--theme-surface-soft); color:var(--theme-muted); font:inherit; font-size:8px; font-weight:850; cursor:pointer; }
.mastery-grid-v2761 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.mastery-card-v2761 { overflow:hidden; }
.mastery-card-v2761 > header { grid-template-columns:auto minmax(0,1fr); }
.mastery-path-v2761 { display:grid; gap:5px; padding:9px; }
.mastery-rank-v2761 { display:flex; align-items:center; gap:8px; min-height:34px; padding:4px 6px; border:1px solid var(--theme-border); border-radius:9px; background:var(--theme-surface-soft); color:var(--theme-muted); font:inherit; font-size:8px; text-align:left; }
.mastery-rank-v2761.is-unlocked { border-color:color-mix(in srgb,var(--mastery-accent) 40%,var(--theme-border)); color:var(--theme-text); background:color-mix(in srgb,var(--mastery-accent) 8%,var(--theme-card)); }
.mastery-rank-v2761.is-unlocked > i { color:white; border-color:transparent; background:var(--mastery-accent); }
.mastery-rank-v2761.is-next:not(:disabled) { cursor:pointer; border-color:color-mix(in srgb,var(--mastery-accent) 65%,var(--theme-border)); }
.mastery-card-v2761 > footer { display:grid; gap:2px; padding:8px 10px 10px; border-top:1px solid var(--theme-border); }
.mastery-card-v2761 > footer b { font-size:8px; color:var(--theme-text); }
.mastery-card-v2761 > footer small { font-size:7px; color:var(--theme-muted); }
.faction-grid-v2761 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.faction-card-v2761 { display:grid; gap:9px; padding:12px; overflow:hidden; position:relative; }
.faction-card-v2761::before { content:''; position:absolute; inset:0 auto 0 0; width:3px; background:var(--faction-accent); opacity:.7; }
.faction-card-v2761.is-selected { border-color:color-mix(in srgb,var(--faction-accent) 55%,var(--theme-border)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--faction-accent) 14%,transparent); }
.faction-card-v2761 > header { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:9px; align-items:center; }
.faction-card-v2761 header span { min-width:0; }
.faction-card-v2761 header small { display:block; font-size:7px; font-weight:950; color:var(--faction-accent); }
.faction-card-v2761 header b { display:block; margin-top:1px; font-size:13px; color:var(--theme-text); }
.faction-card-v2761 header em { display:block; margin-top:1px; font-size:7px; font-style:normal; color:var(--theme-muted); }
.faction-card-v2761 header strong { padding:5px 7px; border-radius:999px; font-size:7px; color:var(--faction-accent); background:color-mix(in srgb,var(--faction-accent) 12%,transparent); }
.faction-card-v2761 > p { margin:0; font-size:10px; font-weight:800; color:var(--theme-text); }
.faction-playstyle-v2761 { display:grid; gap:3px; padding:8px 9px; border-radius:11px; background:color-mix(in srgb,var(--faction-accent) 6%,var(--theme-surface-soft)); }
.faction-playstyle-v2761 small { font-size:6.5px; font-weight:900; color:var(--faction-accent); }
.faction-playstyle-v2761 span { font-size:8px; line-height:1.35; color:var(--theme-muted); }
.faction-card-v2761 > footer { display:flex; align-items:center; justify-content:space-between; gap:9px; }
.faction-card-v2761 > footer > span { flex:1; font-size:7px; line-height:1.3; color:var(--theme-muted); }
.faction-card-v2761 > footer button { flex:0 0 auto; max-width:170px; min-height:31px; padding:6px 9px; border:1px solid color-mix(in srgb,var(--faction-accent) 35%,var(--theme-border)); border-radius:10px; background:color-mix(in srgb,var(--faction-accent) 11%,var(--theme-card)); color:var(--faction-accent); font:inherit; font-size:7px; font-weight:900; cursor:pointer; }
.faction-card-v2761 > footer button:disabled { opacity:.56; cursor:default; }
.clan-empty-v2761 { display:flex; align-items:center; gap:12px; padding:14px; }
.clan-empty-v2761 > div { min-width:0; }
.clan-empty-v2761 small { display:block; font-size:7px; font-weight:900; color:var(--theme-accent); }
.clan-empty-v2761 b { display:block; margin-top:2px; font-size:13px; color:var(--theme-text); }
.clan-empty-v2761 p { margin:4px 0 0; font-size:8px; color:var(--theme-muted); }
.clan-create-v2761,
.clan-dashboard-v2761 { padding:13px; }
.clan-create-v2761 > header,
.clan-dashboard-v2761 > header { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; }
.clan-create-v2761 > header { grid-template-columns:auto minmax(0,1fr); }
.clan-create-v2761 header small,
.clan-dashboard-v2761 header small { display:block; font-size:7px; font-weight:900; color:var(--faction-accent); }
.clan-create-v2761 h3,
.clan-dashboard-v2761 h3 { margin:1px 0 0; font-size:16px; color:var(--theme-text); }
.clan-create-v2761 header p,
.clan-dashboard-v2761 header p { margin:2px 0 0; font-size:8px; color:var(--theme-muted); }
.clan-dashboard-v2761 header > strong { padding:6px 8px; border-radius:10px; background:color-mix(in srgb,var(--faction-accent) 10%,transparent); color:var(--faction-accent); font-size:9px; }
.clan-create-fields-v2761 { display:grid; grid-template-columns:minmax(0,1fr) 110px auto; gap:8px; margin-top:11px; }
.clan-create-fields-v2761 label { display:grid; gap:4px; }
.clan-create-fields-v2761 label > span { font-size:7px; color:var(--theme-muted); }
.clan-create-fields-v2761 input { width:100%; min-height:38px; padding:0 10px; border:1px solid var(--theme-border); border-radius:10px; background:var(--theme-input); color:var(--theme-text); font:inherit; font-size:9px; outline:none; }
.clan-create-fields-v2761 input:focus { border-color:var(--faction-accent)!important; box-shadow:0 0 0 3px color-mix(in srgb,var(--faction-accent) 10%,transparent); }
.clan-create-fields-v2761 > button { align-self:end; min-height:38px; padding:0 13px; border:0; border-radius:10px; background:var(--faction-accent); color:white; font:inherit; font-size:8px; font-weight:950; cursor:pointer; }
.clan-create-note-v2761 { display:block; margin-top:8px; font-size:7px; line-height:1.35; color:var(--theme-muted); }
.clan-stats-v2761 { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:11px; }
.clan-stats-v2761 > span { display:grid; gap:2px; padding:8px 9px; border-radius:10px; background:var(--theme-surface-soft); }
.clan-stats-v2761 small { font-size:6.5px; color:var(--theme-muted); }
.clan-stats-v2761 b { font-size:11px; color:var(--theme-text); }
.clan-module-grid-v2761 { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; margin-top:8px; }
.clan-module-grid-v2761 article { display:grid; gap:2px; min-height:70px; padding:8px; border:1px solid var(--theme-border); border-radius:11px; background:var(--theme-surface-soft); }
.clan-module-grid-v2761 article i { font-style:normal; font-size:16px; color:var(--faction-accent); }
.clan-module-grid-v2761 article b { font-size:8px; color:var(--theme-text); }
.clan-module-grid-v2761 article small { font-size:6.5px; line-height:1.25; color:var(--theme-muted); }
.clan-dashboard-v2761 > footer { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:9px; }
.clan-dashboard-v2761 > footer span { font-size:7px; color:var(--theme-muted); }
.factions-footer-v2761 { display:flex; align-items:center; gap:8px; padding:10px 12px; }
.factions-footer-v2761 b { flex:0 0 auto; font-size:8px; color:var(--theme-text); }
.factions-footer-v2761 span { font-size:8px; color:var(--theme-muted); }

@media (max-width:1050px) {
  .progression-summary-v2761,
  .progression-summary-v2761.is-mastery { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .progression-summary-v2761 p { grid-column:1/-1; }
  .mastery-grid-v2761 { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .game-screen .side-panel.is-progression-panel,
  .game-screen .side-panel.is-factions-panel { inset:auto 6px calc(68px + env(safe-area-inset-bottom)) 6px; width:auto; max-height:calc(100% - 78px - env(safe-area-inset-top)); padding:10px; border-radius:20px; }
  .progression-window-v2761,.factions-window-v2761 { gap:9px; }
  .progression-hero-v2761,.factions-hero-v2761 { grid-template-columns:auto minmax(0,1fr); padding:11px; }
  .progression-hero-v2761 > strong,.factions-hero-v2761 > strong { grid-column:2; justify-self:start; }
  .progression-hero-v2761 h2,.factions-hero-v2761 h2 { font-size:18px; }
  .talent-grid-v2761,.faction-grid-v2761 { grid-template-columns:1fr; }
  .talent-path-v2761 { grid-template-columns:1fr; }
  .progression-summary-v2761,.progression-summary-v2761.is-mastery { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .progression-footer-v2761,.factions-footer-v2761,.clan-dashboard-v2761 > footer { align-items:flex-start; flex-direction:column; }
  .clan-create-fields-v2761 { grid-template-columns:minmax(0,1fr) 92px; }
  .clan-create-fields-v2761 > button { grid-column:1/-1; }
  .clan-module-grid-v2761 { grid-template-columns:repeat(2,1fr); }
  .faction-card-v2761 > footer { align-items:flex-start; flex-direction:column; }
  .faction-card-v2761 > footer button { width:100%; max-width:none; }
}

/* v2.7.62 — explicit sprint, analog mobile sprint ring and movement feedback */
.game-screen .player-stamina-hud.is-sprinting {
  opacity:1;
  transform:translateX(3px);
  border-color:rgba(94,196,255,.42);
  box-shadow:0 10px 28px rgba(0,27,43,.24),0 0 0 1px rgba(90,199,255,.08) inset;
}
.game-screen .player-stamina-hud.is-sprinting::before {
  background:#4fc3ff;
  box-shadow:0 0 12px rgba(79,195,255,.55);
}
.game-screen .player-stamina-hud.is-sprinting .player-stamina-title small {
  color:#87dcff;
  text-shadow:0 0 8px rgba(79,195,255,.28);
}
.game-screen .player-stamina-hud.is-sprinting .player-stamina-meter > i > b {
  box-shadow:0 0 12px rgba(118,215,70,.42);
}

@media (max-width:800px) {
  .joystick {
    --joystick-pressure:0;
    width:124px;
    height:124px;
    border:2px solid rgba(226,246,255,.66);
    background:radial-gradient(circle,rgba(13,83,123,.18) 0 34%,rgba(4,45,74,.5) 68%,rgba(2,33,57,.56) 100%);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 12px 30px rgba(0,25,45,.22);
    backdrop-filter:blur(5px);
  }
  .joystick::before {
    content:'';
    position:absolute;
    inset:8px;
    border:1px dashed rgba(220,244,255,.28);
    border-radius:50%;
    opacity:calc(.25 + var(--joystick-pressure) * .55);
    transform:scale(calc(.94 + var(--joystick-pressure) * .06));
    transition:opacity .12s ease,border-color .12s ease,transform .12s ease;
  }
  .joystick > span {
    inset:32px;
    border-color:rgba(232,249,255,.26);
  }
  .joystick > i {
    width:40px;
    height:40px;
    border-color:rgba(246,253,255,.9);
    background:linear-gradient(145deg,#28b4ff,#0b70c2);
    box-shadow:0 8px 18px rgba(0,30,54,.34),inset 0 1px rgba(255,255,255,.28);
    transition:background .12s ease,border-color .12s ease,box-shadow .12s ease;
  }
  .joystick > em {
    position:absolute;
    left:50%;
    top:-17px;
    min-width:44px;
    padding:4px 8px;
    transform:translateX(-50%) translateY(4px);
    border:1px solid rgba(255,255,255,.5);
    border-radius:999px;
    background:rgba(3,41,66,.82);
    color:#dff6ff;
    box-shadow:0 6px 16px rgba(0,28,48,.22);
    font-size:7px;
    font-style:normal;
    font-weight:1000;
    letter-spacing:.12em;
    opacity:0;
    transition:opacity .12s ease,transform .12s ease,background .12s ease,color .12s ease;
  }
  .joystick.is-sprinting {
    border-color:rgba(255,220,91,.92);
    box-shadow:0 0 0 5px rgba(255,207,62,.11),0 12px 30px rgba(0,25,45,.28),inset 0 0 22px rgba(255,209,65,.1);
    animation:mobile-sprint-ring .72s ease-in-out infinite alternate;
  }
  .joystick.is-sprinting::before { border-color:rgba(255,225,112,.62);opacity:.95; }
  .joystick.is-sprinting > i {
    border-color:#fff7ce;
    background:linear-gradient(145deg,#ffd957,#f0a823);
    box-shadow:0 0 0 5px rgba(255,212,66,.15),0 8px 18px rgba(0,30,54,.35);
  }
  .joystick.is-sprinting > em { opacity:1;transform:translateX(-50%) translateY(0); }
  .joystick.is-exhausted.is-sprinting {
    border-color:rgba(242,112,87,.9);
    box-shadow:0 0 0 5px rgba(230,90,66,.1),0 12px 30px rgba(0,25,45,.25);
    animation:none;
  }
  .joystick.is-exhausted.is-sprinting::before { border-color:rgba(247,139,116,.6); }
  .joystick.is-exhausted.is-sprinting > i { background:linear-gradient(145deg,#ef8b67,#ca5146);border-color:#ffe4dc; }
  .joystick.is-exhausted.is-sprinting > em { background:rgba(112,42,35,.9);color:#ffe6df; }
}

@keyframes mobile-sprint-ring {
  from { transform:translate(-50%,-50%) scale(1); }
  to { transform:translate(-50%,-50%) scale(1.035); }
}

/* v2.8.0 — authoritative PvE / PvP / co-op combat surface */
.game-screen .battle-panel {
  --battle-accent:#41c8f5;
  --battle-positive:#72de78;
  --battle-warning:#ffd263;
  position:absolute;
  z-index:94;
  left:50%;
  right:auto;
  bottom:18px;
  width:min(1040px,calc(100% - 32px));
  max-height:min(720px,calc(100% - 34px));
  padding:14px;
  overflow:auto;
  transform:translate(-50%,24px) scale(.985);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:10px 12px;
  border:1px solid rgba(120,214,248,.25);
  border-radius:24px;
  background:linear-gradient(145deg,rgba(5,25,39,.97),rgba(7,38,55,.96) 60%,rgba(9,31,48,.98));
  box-shadow:0 30px 80px rgba(0,12,23,.58),inset 0 1px rgba(255,255,255,.08),0 0 0 1px rgba(0,0,0,.18);
  color:#f2fbff;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  backdrop-filter:blur(22px) saturate(1.15);
  transition:opacity .2s ease,transform .24s cubic-bezier(.2,.8,.2,1),visibility .2s;
}
.game-screen .battle-panel.is-open { opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0) scale(1); }
.game-screen .battle-panel.is-pvp { --battle-accent:#ff737d;background:linear-gradient(145deg,rgba(38,12,26,.98),rgba(54,20,34,.97) 58%,rgba(25,19,38,.98));border-color:rgba(255,126,145,.3); }
.game-screen .battle-panel.is-coop { --battle-accent:#ae8bff;background:linear-gradient(145deg,rgba(20,16,47,.98),rgba(29,34,67,.97) 58%,rgba(10,35,52,.98));border-color:rgba(176,143,255,.34); }
.battle-panel .combat-icon,.battle-panel .skill-damage-icon { width:18px;height:18px;display:inline-block;flex:0 0 auto;vertical-align:middle; }
.battle-panel .battle-status { grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:2px 2px 8px;border-bottom:1px solid rgba(255,255,255,.08); }
.battle-status > span { min-width:0;display:grid;gap:3px; }
.battle-status > span > small { display:flex;align-items:center;gap:6px;color:rgba(213,237,247,.62);font-size:9px;font-weight:900;letter-spacing:.12em; }
.battle-status > span > small > i { display:inline-grid;color:var(--battle-accent); }
.battle-status > span > small > b { padding:3px 7px;border:1px solid color-mix(in srgb,var(--battle-accent) 42%,transparent);border-radius:999px;background:color-mix(in srgb,var(--battle-accent) 12%,transparent);color:var(--battle-accent);font-size:8px; }
.battle-status > span > strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:17px;letter-spacing:.01em; }
.battle-controls { display:flex;align-items:center;gap:6px; }
.battle-controls button { min-height:34px;padding:0 12px;border:1px solid rgba(255,255,255,.13);border-radius:10px;background:rgba(255,255,255,.055);color:#dbedf5;font-size:9px;font-weight:900;letter-spacing:.06em;transition:transform .14s ease,border-color .14s ease,background .14s ease; }
.battle-controls button:hover { transform:translateY(-1px);border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.1); }
.battle-controls #battleHelp { width:34px;padding:0;border-radius:50%;color:var(--battle-accent);font-size:15px; }
.battle-controls #autoBattle.is-active { border-color:color-mix(in srgb,var(--battle-accent) 52%,transparent);background:color-mix(in srgb,var(--battle-accent) 18%,transparent);color:#fff; }
.battle-team-strip,.battle-target-strip { grid-column:1/-1;display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin; }
.battle-team-strip:empty,.battle-target-strip:empty,.battle-target-strip[hidden] { display:none; }
.battle-team-member,.battle-target-strip > button { min-width:168px;display:flex;align-items:center;gap:8px;padding:7px 9px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(255,255,255,.045);color:inherit;text-align:left; }
.battle-target-strip > button { cursor:pointer;transition:transform .14s ease,border-color .14s ease,background .14s ease; }
.battle-target-strip > button:hover:not(:disabled) { transform:translateY(-2px);border-color:color-mix(in srgb,var(--battle-accent) 45%,transparent); }
.battle-target-strip > button.is-selected { border-color:var(--battle-accent);background:color-mix(in srgb,var(--battle-accent) 14%,transparent);box-shadow:0 0 0 2px color-mix(in srgb,var(--battle-accent) 10%,transparent); }
.battle-target-strip > button.is-selected > svg { color:var(--battle-accent);animation:battle-target-pulse 1.2s ease-in-out infinite; }
.battle-team-member.is-ko,.battle-target-strip > button.is-ko { filter:grayscale(.85);opacity:.48; }
.battle-team-member > strong { margin-left:auto;padding:3px 5px;border-radius:5px;background:rgba(173,139,255,.18);color:#cdb9ff;font-size:8px; }
.battle-team-portrait,.battle-target-portrait { width:34px;height:34px;flex:0 0 auto;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.08);overflow:hidden; }
.battle-team-portrait img,.battle-target-portrait img { width:88%;height:88%;object-fit:contain; }
.battle-team-member > span,.battle-target-strip > button > span { min-width:0;display:grid;flex:1;gap:1px; }
.battle-team-member small,.battle-target-strip small { color:var(--battle-accent);font-size:7px;font-weight:900;letter-spacing:.11em; }
.battle-team-member b,.battle-target-strip b { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px; }
.battle-team-member span > i,.battle-target-strip span > i { height:3px;margin-top:3px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.09); }
.battle-team-member span > i em,.battle-target-strip span > i em { display:block;height:100%;border-radius:inherit;background:var(--battle-positive);transition:width .25s ease; }
.battle-health { grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }
.battle-health > article { min-width:0;padding:11px;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025)); }
.battle-health > article > span,.battle-stamina > span,.battle-exp > span { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px; }
.battle-health > article > span b { font-size:12px; }
.battle-health > article > span small,.battle-stamina small,.battle-exp small { color:rgba(225,242,249,.66);font-size:9px;font-weight:800; }
.battle-hp-bar,.battle-stamina > i,.battle-exp > i { position:relative;display:block;height:8px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.09);box-shadow:inset 0 1px 2px rgba(0,0,0,.35); }
.battle-hp-bar > em { position:absolute;inset:0 auto 0 0;display:block;border-radius:inherit;background:linear-gradient(90deg,#41c86c,#86e87a);box-shadow:0 0 12px rgba(94,222,112,.3);transition:width .25s ease; }
.enemy-health .battle-hp-bar > em { background:linear-gradient(90deg,#ff6b6e,#ffac67);box-shadow:0 0 12px rgba(255,108,94,.28); }
.battle-hp-bar > strong { position:absolute;inset:0 auto 0 0;z-index:2;display:block;border-radius:inherit;background:repeating-linear-gradient(115deg,rgba(105,207,255,.95) 0 5px,rgba(159,227,255,.9) 5px 8px);box-shadow:0 0 9px rgba(86,199,255,.5);transition:width .2s ease; }
.battle-stamina,.battle-exp { margin-top:7px; }
.battle-stamina > span,.battle-exp > span { margin-bottom:3px; }
.battle-stamina > span b,.battle-exp > span b { color:#77d7ff;font-size:7px;letter-spacing:.1em; }
.battle-stamina > i,.battle-exp > i { height:4px; }
.battle-stamina > i em { display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3faef4,#72e0ff);transition:width .22s ease; }
.battle-exp > i em { display:block;height:100%;border-radius:inherit;background:#b78cff;transition:width .22s ease; }
.battle-statuses { min-height:0;display:flex;flex-wrap:wrap;gap:4px;margin-top:6px; }
.battle-status-chip { display:flex;align-items:center;gap:3px;padding:2px 5px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(0,0,0,.18);font-style:normal; }
.battle-status-chip svg { width:11px;height:11px;color:var(--battle-warning); }
.battle-status-chip b { font-size:7px; }.battle-status-chip small { color:rgba(255,255,255,.65);font-size:7px; }
.battle-basic { grid-column:1;display:grid;grid-template-columns:42px minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;gap:1px 9px;min-height:56px;padding:7px 10px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.03));color:#eefaff;text-align:left; }
.battle-basic > span { grid-row:1/3;width:40px;height:40px;display:grid;place-items:center;border-radius:11px;background:rgba(255,255,255,.08);color:var(--battle-accent); }
.battle-basic > span svg { width:23px;height:23px; }.battle-basic > b { font-size:10px; }.battle-basic > small { color:rgba(224,240,247,.55);font-size:8px; }
.battle-basic > em { grid-column:3;grid-row:1/3;padding:4px 6px;border-radius:6px;background:rgba(83,210,124,.13);color:#86e5a5;font-size:7px;font-style:normal;font-weight:900; }
.battle-basic.is-queued { border-color:var(--battle-accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--battle-accent) 10%,transparent); }
.battle-skills { grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px; }
.battle-skills.is-hidden { display:none; }
.battle-skills > button { position:relative;min-width:0;min-height:78px;display:grid;grid-template-columns:50px minmax(0,1fr);align-items:center;gap:8px;padding:8px;border:1px solid rgba(255,255,255,.11);border-radius:15px;background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));color:#f4fbff;text-align:left;overflow:hidden;transition:transform .14s ease,border-color .14s ease,filter .14s ease; }
.battle-skills > button:hover:not(:disabled) { transform:translateY(-2px);border-color:color-mix(in srgb,var(--battle-accent) 45%,transparent); }
.battle-skills > button > .skill-icon { width:50px;height:50px;display:block;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.06); }
.battle-skills > button > .skill-icon img { width:100%;height:100%;object-fit:cover; }
.battle-skills > button > kbd { position:absolute;left:5px;top:5px;z-index:3;min-width:19px;padding:2px 4px;border:1px solid rgba(255,255,255,.28);border-radius:5px;background:rgba(0,12,23,.8);color:#fff;font:900 8px/1.2 inherit;text-align:center;box-shadow:none; }
.battle-skills > button > span { min-width:0;display:grid;gap:5px; }
.battle-skills > button > span b { min-width:0;font-size:10px;line-height:1.2; }
.battle-skills > button > span b mark { display:inline-block;margin-left:4px;padding:2px 4px;border-radius:4px;background:rgba(255,191,75,.13);color:#ffc975;font-size:6px;vertical-align:middle; }
.battle-skills > button > span small { display:flex;align-items:center;gap:3px;color:rgba(222,239,247,.58);font-size:7px;line-height:1.3; }
.battle-skills > button > em { position:absolute;right:6px;top:6px;padding:3px 5px;border-radius:5px;background:rgba(76,204,118,.12);color:#80dda0;font-size:6px;font-style:normal;font-weight:900; }
.battle-skills > button.is-queued { border-color:var(--battle-accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--battle-accent) 13%,transparent);animation:battle-skill-queued .7s ease-in-out infinite alternate; }
.battle-skills > button:disabled { cursor:not-allowed;filter:saturate(.55);opacity:.58; }.battle-skills > button.is-no-stamina { border-color:rgba(84,158,197,.16); }
.battle-decision,.capture-panel { grid-column:1/-1; }.battle-decision:not(.is-open),.capture-panel:not(.is-open) { display:none; }
.battle-footer { grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.75fr);gap:12px;padding-top:3px;border-top:1px solid rgba(255,255,255,.06); }
.battle-footer > p { margin:0;align-self:center;color:rgba(224,241,248,.72);font-size:9px;line-height:1.45; }
.battle-footer > ol { max-height:54px;margin:0;padding:0;overflow:auto;list-style:none;display:grid;gap:3px; }
.battle-footer > ol li { display:flex;justify-content:space-between;gap:8px;color:rgba(215,234,242,.57);font-size:7px; }.battle-footer > ol b { color:#eaf8ff;font-size:8px; }
body[data-ui-theme="light"] .game-screen .battle-panel { background:linear-gradient(145deg,rgba(246,252,255,.97),rgba(226,242,250,.97));border-color:rgba(43,130,166,.28);box-shadow:0 30px 80px rgba(18,65,84,.28),inset 0 1px #fff;color:#153b4d; }
body[data-ui-theme="light"] .battle-health > article,body[data-ui-theme="light"] .battle-skills > button,body[data-ui-theme="light"] .battle-basic,body[data-ui-theme="light"] .battle-team-member,body[data-ui-theme="light"] .battle-target-strip > button { background:rgba(255,255,255,.72);border-color:rgba(27,93,120,.13);color:#173b4b; }
@keyframes battle-target-pulse { 50% { transform:scale(1.13);filter:drop-shadow(0 0 6px currentColor); } }
@keyframes battle-skill-queued { to { box-shadow:0 0 0 3px color-mix(in srgb,var(--battle-accent) 18%,transparent),0 0 20px color-mix(in srgb,var(--battle-accent) 13%,transparent); } }

@media (max-width:800px) {
  .game-screen .battle-panel { left:4px;right:4px;bottom:calc(4px + env(safe-area-inset-bottom));width:auto;max-height:min(88svh,760px);padding:9px;border-radius:19px;transform:translateY(30px);grid-template-columns:1fr;gap:7px;overscroll-behavior:contain; }
  .game-screen .battle-panel.is-open { transform:translateY(0); }
  .battle-panel .battle-status,.battle-team-strip,.battle-target-strip,.battle-health,.battle-skills,.battle-decision,.capture-panel,.battle-footer { grid-column:1; }
  .battle-status > span > strong { max-width:48vw;font-size:13px; }.battle-status > span > small { font-size:7px; }
  .battle-controls { gap:4px; }.battle-controls button { min-height:31px;padding:0 8px;font-size:7px; }.battle-controls #battleHelp { width:31px; }
  .battle-team-strip,.battle-target-strip { margin-inline:-2px;padding:1px 2px 3px; }.battle-team-member,.battle-target-strip > button { min-width:145px;padding:5px 7px; }
  .battle-team-portrait,.battle-target-portrait { width:29px;height:29px; }.battle-team-member b,.battle-target-strip b { font-size:9px; }
  .battle-health { grid-template-columns:repeat(2,minmax(0,1fr));gap:6px; }.battle-health > article { padding:7px;border-radius:12px; }
  .battle-health > article > span b { font-size:9px; }.battle-health > article > span small { font-size:7px; }.battle-stamina,.battle-exp { margin-top:5px; }
  .battle-statuses { display:none; }
  .battle-basic { position:relative;grid-column:1;min-height:48px;grid-template-columns:35px minmax(0,1fr) auto;padding:5px 7px; }.battle-basic > span { width:34px;height:34px; }.battle-basic > b { font-size:9px; }
  .battle-skills { grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding-left:min(13vw,54px); }
  .battle-skills > button { min-height:62px;grid-template-columns:42px minmax(0,1fr);padding:6px; }.battle-skills > button > .skill-icon { width:42px;height:42px;border-radius:10px; }.battle-skills > button > span b { font-size:9px; }.battle-skills > button > span small { font-size:6px; }.battle-skills > button > span small .skill-damage-icon { display:none; }
  .battle-footer { grid-template-columns:1fr;padding-top:2px; }.battle-footer > p { font-size:8px; }.battle-footer > ol { display:none; }
}
@media (max-width:430px) {
  .battle-status > span > strong { max-width:38vw;font-size:11px; }
  .battle-controls #battleHelp { display:none; }.battle-controls button { padding-inline:6px; }
  .battle-health > article > span { align-items:flex-start;flex-direction:column;gap:1px; }
  .battle-team-strip { display:none; }.battle-target-strip > button { min-width:132px; }
  .battle-skills { padding-left:36px; }.battle-skills > button { grid-template-columns:38px minmax(0,1fr); }.battle-skills > button > .skill-icon { width:38px;height:38px; }.battle-skills > button > span small { white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
}
@media (prefers-reduced-motion:reduce) {
  .game-screen .battle-panel,.battle-skills > button,.battle-target-strip > button { transition:none!important; }
  .battle-target-strip > button.is-selected > svg,.battle-skills > button.is-queued { animation:none!important; }
}

/* v2.9.0 — arena-first battle HUD and server-scored capture gesture */
.game-screen .battle-panel {
  --battle-stage-width:min(1120px,calc(100vw - 44px));
  --battle-deck-width:min(1120px,calc(100vw - 44px));
  --battle-text:#f5fbff;
  --battle-muted:#a9c1cf;
  --battle-glass:rgba(7,30,43,.88);
  --battle-card:rgba(10,38,52,.9);
  position:absolute;
  inset:0;
  z-index:94;
  width:auto;
  max-height:none;
  padding:0;
  overflow:hidden;
  display:block;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--battle-text);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:none;
  backdrop-filter:none;
  transition:opacity .24s ease,visibility .24s;
}
.game-screen .battle-panel.is-open { opacity:1;visibility:visible;pointer-events:none;transform:none; }
.game-screen .battle-panel.is-pvp,.game-screen .battle-panel.is-coop { background:transparent; }
.battle-panel::before {
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(2,19,30,.34),transparent 24%,transparent 68%,rgba(2,16,25,.5));
}
.battle-stage {
  position:absolute;left:50%;top:68px;bottom:232px;width:var(--battle-stage-width);min-height:310px;
  transform:translateX(-50%);overflow:hidden;border:1px solid rgba(226,249,255,.72);border-radius:30px;
  box-shadow:0 22px 60px rgba(0,20,31,.34),inset 0 1px rgba(255,255,255,.62),inset 0 -70px 90px rgba(3,27,35,.08);
  pointer-events:none;
}
.battle-stage::before { content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 5px rgba(255,255,255,.08);pointer-events:none; }
.battle-stage::after { content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at 67% 43%,transparent 0 20%,rgba(1,26,35,.03) 56%,rgba(2,18,28,.18));pointer-events:none; }
.battle-status {
  position:absolute;z-index:7;left:50%;top:12px;width:var(--battle-stage-width);min-height:48px;
  transform:translateX(-50%);padding:6px 11px!important;border:1px solid rgba(222,245,252,.22)!important;border-radius:17px!important;
  background:rgba(4,28,42,.76);box-shadow:0 12px 30px rgba(0,16,27,.22),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(16px) saturate(1.12);
  pointer-events:auto;
}
.battle-status > span > small { color:#a9c7d4;font-size:8px; }.battle-status > span > strong { color:#f5fbff;font-size:16px; }
.battle-controls button { min-width:44px;min-height:38px;border-color:rgba(228,247,253,.15);background:rgba(255,255,255,.065);color:#eaf8fd; }
.battle-controls #cancelBattle { color:#ffd9d6; }.battle-controls #autoBattle.is-active { background:linear-gradient(180deg,color-mix(in srgb,var(--battle-accent) 30%,transparent),color-mix(in srgb,var(--battle-accent) 14%,transparent)); }
.battle-turn-chip {
  position:absolute;z-index:4;left:50%;top:12px;display:flex;align-items:center;gap:8px;transform:translateX(-50%);
  min-height:36px;padding:5px 12px;border:1px solid rgba(255,255,255,.68);border-radius:999px;background:rgba(250,253,249,.88);color:#1b536b;box-shadow:0 8px 22px rgba(23,88,106,.18);backdrop-filter:blur(10px);
}
.battle-turn-chip small { font-size:7px;font-weight:950;letter-spacing:.1em;color:#299dcc; }.battle-turn-chip b { font-size:9px;white-space:nowrap; }
.battle-health {
  position:absolute;z-index:6;left:50%;top:68px;bottom:232px;width:var(--battle-stage-width);height:auto;transform:translateX(-50%);display:block;pointer-events:none;
}
.battle-health > article {
  position:absolute;width:min(310px,31vw);padding:12px 13px;border:1px solid rgba(255,255,255,.72);border-radius:19px;
  background:rgba(249,253,251,.91);color:#183f52;box-shadow:0 12px 30px rgba(20,76,92,.18),inset 0 1px #fff;backdrop-filter:blur(13px);
}
.battle-health > .enemy-health { right:18px;top:62px; }.battle-health > .ally-health { left:18px;bottom:18px; }
.battle-health > article > span b { color:#153f55;font-size:13px; }.battle-health > article > span small,.battle-health .battle-stamina small,.battle-health .battle-exp small { color:#56788a; }
.battle-health .battle-hp-bar,.battle-health .battle-stamina > i,.battle-health .battle-exp > i { background:rgba(30,78,96,.12); }
.battle-health .battle-status-chip { border-color:rgba(21,91,117,.15);background:rgba(37,117,145,.07);color:#2d6075; }
.battle-team-strip,.battle-target-strip {
  position:absolute;z-index:8;left:50%;top:116px;width:min(520px,calc(var(--battle-stage-width) - 650px));transform:translateX(-50%);justify-content:center;pointer-events:auto;
}
.battle-team-strip:empty,.battle-target-strip:empty,.battle-target-strip[hidden] { display:none; }
.battle-team-member,.battle-target-strip > button { background:rgba(4,29,42,.76);border-color:rgba(226,247,253,.2);box-shadow:0 8px 22px rgba(0,20,32,.18);backdrop-filter:blur(10px); }
.battle-command-deck {
  position:absolute;z-index:9;left:50%;bottom:12px;width:var(--battle-deck-width);min-height:204px;transform:translateX(-50%);
  display:grid;grid-template-columns:190px minmax(0,1fr);grid-template-rows:auto auto;gap:8px 10px;padding:11px;
  border:1px solid rgba(220,245,253,.24);border-radius:24px;background:linear-gradient(145deg,rgba(6,31,45,.91),rgba(7,43,58,.88));
  box-shadow:0 24px 64px rgba(0,17,28,.38),inset 0 1px rgba(255,255,255,.1);backdrop-filter:blur(22px) saturate(1.15);pointer-events:auto;
  transition:transform .25s cubic-bezier(.2,.8,.2,1),opacity .2s ease;
}
.battle-command-deck .battle-basic { grid-column:1;grid-row:1;min-height:78px; }
.battle-command-deck .battle-skills { grid-column:2;grid-row:1; }
.battle-command-deck .battle-decision,.battle-command-deck .capture-panel,.battle-command-deck .battle-footer { grid-column:1/-1; }
.battle-command-deck .battle-footer { grid-row:2; }
.battle-basic,.battle-skills > button { min-height:76px;border-color:rgba(234,249,255,.13);background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.035)); }
.battle-basic:focus-visible,.battle-skills > button:focus-visible,.battle-controls button:focus-visible,.capture-balls button:focus-visible,.capture-throw:focus-visible { outline:3px solid #fff;outline-offset:3px; }
.battle-skills > button { min-height:76px; }.battle-skills > button > .skill-icon { width:52px;height:52px; }
.battle-skills > button > span .skill-summary { display:block;overflow:hidden;color:rgba(213,235,244,.48);font-size:6px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap; }
.battle-skills > button.is-queued::after { content:'';position:absolute;inset:0;border-radius:inherit;border:2px solid var(--battle-accent);pointer-events:none; }
.battle-decision { min-height:86px;grid-template-columns:minmax(0,1fr) minmax(118px,.22fr) minmax(118px,.22fr);padding:12px 14px;border:1px solid rgba(255,218,98,.46);border-radius:17px;background:linear-gradient(135deg,rgba(104,75,10,.68),rgba(43,41,24,.72)); }
.battle-decision small { color:#ffd86a;font-size:8px; }.battle-decision b { margin-top:3px;color:#fff;font-size:12px; }.battle-decision button { min-height:48px;border-radius:13px;font-size:9px; }
.battle-decision #beginCapture { background:linear-gradient(180deg,#ed6657,#ca403c);box-shadow:0 8px 18px rgba(207,64,57,.22); }
.capture-panel { position:relative;display:none;grid-template-columns:190px minmax(0,1fr);align-items:center;gap:12px;min-height:92px;margin:0;padding:10px 12px;overflow:visible;border:1px solid rgba(133,219,250,.25);border-radius:17px;background:rgba(5,31,44,.55);box-shadow:none; }
.capture-panel.is-open { display:grid; }.capture-panel::before,.capture-panel::after { display:none!important; }
.capture-copy { display:grid;gap:2px; }.capture-copy small { color:#6fd6ff;font-size:7px;font-weight:950;letter-spacing:.12em; }.capture-copy b { color:#f2fbff;font-size:12px; }.capture-copy em { color:#9bb8c6;font-size:7px;font-style:normal; }
.capture-balls { display:flex;gap:8px;overflow-x:auto;padding:2px 2px 5px;scroll-snap-type:x proximity; }
.capture-balls button { flex:0 0 150px;min-width:0;min-height:64px;display:grid;grid-template-columns:45px minmax(0,1fr) auto;align-items:center;gap:7px;padding:7px 9px;border:1px solid rgba(229,248,255,.14);border-radius:14px;background:rgba(255,255,255,.06);color:#effaff;text-align:left;scroll-snap-align:start; }
.capture-balls button:hover { transform:translateY(-1px);border-color:rgba(100,211,251,.54); }.capture-balls button.is-selected { border-color:#61d0fb;background:rgba(74,194,239,.16);box-shadow:0 0 0 2px rgba(75,200,245,.1); }
.capture-balls .capture-ball-icon { width:43px;height:43px; }.capture-balls button b { overflow:hidden;font-size:8px;text-overflow:ellipsis;white-space:nowrap; }.capture-balls button small { color:#bcd1da;font-size:8px;font-weight:900; }
.capture-empty { display:flex;align-items:center;min-height:52px;color:#ffd5cf;font-size:9px; }
.capture-stage { position:absolute;z-index:5;inset:0;display:none;overflow:hidden;border-radius:inherit;pointer-events:none; }
.battle-panel.is-capture .capture-stage { display:block; }
.battle-panel.is-capture .battle-health > .ally-health { display:none; }
.capture-stage::before { content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 43%,rgba(128,238,164,.13),transparent 25%),linear-gradient(180deg,rgba(3,31,42,.08),rgba(3,24,35,.12)); }
.capture-target-reticle { position:absolute;z-index:4;left:50%;top:43%;width:170px;height:170px;transform:translate(-50%,-50%);display:grid;place-items:center; }
.capture-target-reticle > i { position:absolute;border-radius:50%;pointer-events:none; }
.capture-ring-outer { inset:0;border:3px solid rgba(255,255,255,.76);box-shadow:0 0 0 6px rgba(255,255,255,.08),0 0 24px rgba(68,226,136,.18); }
.capture-ring-inner { inset:0;border:5px solid #68e38d;background:rgba(86,225,133,.04);animation:capture-ring-contract var(--capture-ring-period,1800ms) linear infinite;animation-delay:var(--capture-ring-offset,0ms); }
.capture-target-reticle > span { position:absolute;top:-27px;display:flex;gap:5px;align-items:center;padding:5px 9px;border-radius:999px;background:rgba(4,34,45,.76);color:white;box-shadow:0 5px 14px rgba(0,22,30,.18); }
.capture-target-reticle small { color:#78e8a0;font-size:6px;font-weight:950;letter-spacing:.12em; }.capture-target-reticle b { font-size:8px; }
.capture-aim-guide { position:absolute;z-index:2;inset:0;width:100%;height:100%;opacity:0;transition:opacity .15s;pointer-events:none; }
.capture-aim-guide path { fill:none;stroke:rgba(255,255,255,.7);stroke-width:4;stroke-linecap:round;stroke-dasharray:7 11;filter:drop-shadow(0 2px 3px rgba(0,41,55,.4)); }
.capture-stage.is-aiming .capture-aim-guide { opacity:.82; }
.capture-feedback { position:absolute;z-index:5;left:50%;top:55px;transform:translateX(-50%);min-width:250px;padding:7px 12px;border:1px solid rgba(255,255,255,.28);border-radius:13px;background:rgba(3,30,42,.72);color:white;text-align:center;box-shadow:0 8px 20px rgba(0,20,29,.18);backdrop-filter:blur(10px); }
.capture-feedback small { display:block;color:#77ddff;font-size:6px;font-weight:950;letter-spacing:.14em; }.capture-feedback b { display:block;margin-top:2px;font-size:10px; }
.capture-stage[data-quality="nice"] .capture-feedback b { color:#9cf2bd; }.capture-stage[data-quality="great"] .capture-feedback b { color:#77dcff; }.capture-stage[data-quality="excellent"] .capture-feedback b { color:#ffd766;text-shadow:0 0 12px rgba(255,208,70,.48); }.capture-stage[data-quality="miss"] .capture-feedback b { color:#ffaea5; }
.capture-gesture-hint { position:absolute;z-index:4;left:24px;bottom:22px;display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:14px;background:rgba(4,33,45,.68);color:#ecfaff;backdrop-filter:blur(8px); }
.capture-gesture-hint > i { display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:rgba(95,210,251,.14);color:#73dcff; }.capture-gesture-hint svg { width:19px;height:19px; }
.capture-gesture-hint b,.capture-gesture-hint small { display:block; }.capture-gesture-hint b { font-size:8px; }.capture-gesture-hint small { margin-top:2px;color:#a8c2ce;font-size:6px; }
.capture-throw {
  --throw-x:0px;--throw-y:0px;--throw-rotate:0deg;--capture-spin-turn:0turn;
  position:absolute;z-index:8;left:50%;bottom:18px;width:94px;height:94px;display:grid;place-items:center;align-content:center;padding:5px;
  transform:translate(calc(-50% + var(--throw-x)),var(--throw-y)) rotate(var(--throw-rotate));
  border:3px solid rgba(255,255,255,.92);border-radius:50%;background:radial-gradient(circle at 34% 28%,#fff,#e6f5fa 70%);color:#17445f;
  box-shadow:0 13px 32px rgba(0,41,59,.34),0 0 0 7px rgba(255,255,255,.12);cursor:grab;pointer-events:auto;touch-action:none;user-select:none;transition:transform .18s ease,box-shadow .18s ease,opacity .18s;
}
.capture-throw::before { content:'';position:absolute;inset:-10px;border-radius:50%;background:conic-gradient(#6be4ff var(--capture-spin-turn),rgba(255,255,255,.08) 0);-webkit-mask:radial-gradient(circle,transparent 61%,#000 63%);mask:radial-gradient(circle,transparent 61%,#000 63%);opacity:.78;pointer-events:none; }
.capture-throw.is-aiming { transition:none;box-shadow:0 18px 34px rgba(0,40,58,.42),0 0 0 9px rgba(99,222,255,.15); }
.capture-throw:disabled { opacity:.34;filter:grayscale(.55);cursor:default; }.capture-throw-icon { width:61px;height:61px;pointer-events:none; }.capture-throw em { margin-top:-7px;font-size:5px;letter-spacing:.05em;pointer-events:none; }
.capture-spin-meter { position:absolute;inset:-4px;border-radius:50%;pointer-events:none; }
.capture-stage.is-resolving .capture-throw { opacity:0;pointer-events:none;transform:translate(-50%,30px) scale(.72); }
.battle-panel.is-intro .battle-command-deck { opacity:0;transform:translate(-50%,34px);pointer-events:none; }
.battle-panel.is-intro .battle-health { opacity:0; }.battle-panel.is-intro .battle-turn-chip { opacity:0; }
.battle-intro { position:absolute;z-index:7;inset:0;display:grid;place-items:center;opacity:0;pointer-events:none; }
.battle-intro::before { content:'';position:absolute;left:-8%;right:-8%;top:43%;height:110px;transform:translateY(-50%) skewY(-3deg);background:linear-gradient(90deg,transparent,rgba(2,26,35,.84) 16% 84%,transparent); }
.battle-intro > i { position:absolute;inset:-30%;background:linear-gradient(112deg,transparent 38%,rgba(109,232,255,.34) 45%,rgba(255,255,255,.76) 49%,rgba(121,231,255,.25) 53%,transparent 60%);transform:translateX(-55%); }
.battle-intro > span { position:relative;display:grid;gap:3px;text-align:center;text-shadow:0 4px 18px rgba(0,20,28,.72); }
.battle-intro small { color:#81e6ff;font-size:9px;font-weight:950;letter-spacing:.2em; }.battle-intro strong { color:#fff;font-size:clamp(28px,4vw,54px);line-height:1; }.battle-intro em { color:#d7f3fc;font-size:10px;font-style:normal;font-weight:800; }
.battle-panel.is-intro .battle-intro { opacity:1;animation:battle-intro-copy 1.35s ease both; }.battle-panel.is-intro .battle-intro > i { animation:battle-intro-swipe 1.15s cubic-bezier(.2,.78,.2,1) both; }
.battle-panel:not(.is-intro) .battle-intro { visibility:hidden; }
.battle-footer { min-height:32px; }.battle-footer > p { color:#c1d8e2;font-size:9px; }.battle-footer > ol { max-height:38px; }
body[data-ui-theme="light"] .game-screen .battle-panel { background:transparent;color:#eefaff;box-shadow:none; }
body[data-ui-theme="light"] .battle-status,body[data-ui-theme="light"] .battle-command-deck { color:#eefaff; }

@keyframes capture-ring-contract { 0% { transform:scale(1);border-color:#64e58b; } 82% { transform:scale(.28);border-color:#ffd95d; } 82.01% { transform:scale(1);border-color:#64e58b; } 100% { transform:scale(1);border-color:#64e58b; } }
@keyframes battle-intro-swipe { 0% { transform:translateX(-65%);opacity:0; } 18% { opacity:1; } 75% { opacity:1; } 100% { transform:translateX(58%);opacity:0; } }
@keyframes battle-intro-copy { 0%,8% { opacity:0;transform:scale(.94); } 25%,72% { opacity:1;transform:scale(1); } 100% { opacity:0;transform:scale(1.03); } }

@media (max-width:800px) {
  .game-screen .battle-panel { --battle-stage-width:calc(100vw - 12px);--battle-deck-width:calc(100vw - 12px); }
  .battle-stage { top:56px;bottom:248px;min-height:230px;border-radius:22px; }
  .battle-status { top:5px;min-height:45px;padding:4px 7px!important;border-radius:14px!important; }
  .battle-status > span > small { font-size:6px; }.battle-status > span > strong { max-width:42vw;font-size:11px; }
  .battle-controls { gap:3px; }.battle-controls button { min-width:36px;min-height:36px;padding:0 7px;font-size:6px; }.battle-controls #battleHelp { display:none; }
  .battle-health { top:56px;bottom:248px; }
  .battle-health > article { width:46%;padding:7px 8px;border-radius:13px; }
  .battle-health > .enemy-health { right:7px;top:48px; }.battle-health > .ally-health { left:7px;bottom:7px; }
  .battle-health > article > span { flex-direction:row;align-items:center; }.battle-health > article > span b { font-size:8px; }.battle-health > article > span small { font-size:6px; }
  .battle-health .battle-hp-bar { height:6px; }.battle-health .battle-stamina,.battle-health .battle-exp { margin-top:4px; }.battle-health .battle-statuses { display:none; }
  .battle-turn-chip { top:7px;min-height:29px;padding:4px 8px; }.battle-turn-chip small { font-size:5px; }.battle-turn-chip b { font-size:7px; }
  .battle-team-strip,.battle-target-strip { top:92px;width:72vw; }.battle-team-member,.battle-target-strip > button { min-width:132px;min-height:44px; }
  .battle-command-deck { bottom:calc(5px + env(safe-area-inset-bottom));min-height:0;max-height:238px;grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:6px;padding:7px;border-radius:19px;overflow:auto; }
  .battle-command-deck .battle-basic { grid-column:1;grid-row:auto;min-height:44px;grid-template-columns:34px minmax(0,1fr) auto;padding:4px 7px; }.battle-basic > span { width:32px;height:32px; }.battle-basic > b { font-size:8px; }.battle-basic > small { font-size:6px; }
  .battle-command-deck .battle-skills { grid-column:1;grid-row:auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:0; }
  .battle-skills > button { min-height:58px;grid-template-columns:39px minmax(0,1fr);padding:5px; }.battle-skills > button > .skill-icon { width:39px;height:39px;border-radius:9px; }.battle-skills > button > span { gap:2px; }.battle-skills > button > span b { font-size:8px; }.battle-skills > button > span small { font-size:5px; }.battle-skills > button > em { font-size:5px; }
  .battle-skills > button > span .skill-summary { display:none; }
  .battle-command-deck .battle-decision,.battle-command-deck .capture-panel,.battle-command-deck .battle-footer { grid-column:1; }
  .battle-decision { grid-template-columns:1fr 1fr;min-height:0;padding:8px; }.battle-decision > span { grid-column:1/-1; }.battle-decision button { min-height:44px; }
  .battle-footer { grid-template-columns:1fr;min-height:22px; }.battle-footer > ol { display:none; }.battle-footer > p { font-size:7px; }
  .capture-panel { grid-template-columns:1fr;min-height:82px;padding:7px;gap:5px; }.capture-copy { display:none; }.capture-balls button { flex-basis:132px;min-height:54px;grid-template-columns:38px minmax(0,1fr) auto;padding:5px 7px; }.capture-balls .capture-ball-icon { width:37px;height:37px; }
  .battle-panel.is-capture .battle-stage { bottom:104px; }.battle-panel.is-capture .battle-health { bottom:104px; }.battle-panel.is-capture .battle-health > .ally-health { display:none; }
  .battle-panel.is-capture .battle-command-deck { max-height:94px; }
  .capture-target-reticle { left:50%;top:42%;width:118px;height:118px; }.capture-target-reticle > span { top:-24px; }
  .capture-feedback { top:45px;min-width:190px;padding:5px 8px; }.capture-feedback b { font-size:8px; }
  .capture-gesture-hint { left:8px;bottom:10px;padding:5px 7px; }.capture-gesture-hint > i { width:26px;height:26px; }.capture-gesture-hint small { display:none; }.capture-gesture-hint b { font-size:6px; }
  .capture-throw { bottom:8px;width:78px;height:78px; }.capture-throw-icon { width:51px;height:51px; }.capture-throw em { display:none; }
}

@media (max-width:430px) {
  .battle-status > span > small { max-width:44vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.battle-status > span > strong { max-width:38vw;font-size:10px; }
  .battle-controls #autoBattle { max-width:82px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  .battle-stage { bottom:236px; }.battle-health { bottom:236px; }.battle-health > article { width:48%; }.battle-health .battle-exp { display:none; }
  .battle-skills > button > span small { white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }.battle-skills > button > span small .skill-damage-icon { display:none; }
  .capture-target-reticle { left:50%;width:104px;height:104px; }.capture-feedback { top:38px; }.capture-gesture-hint { display:none; }
}

@media (max-height:650px) and (max-width:900px) {
  .battle-stage { top:50px;bottom:194px; }.battle-health { top:50px;bottom:194px; }
  .battle-status { top:3px;min-height:41px; }.battle-command-deck { max-height:186px; }
  .battle-basic { display:none!important; }.battle-skills > button { min-height:50px; }.battle-footer { display:none; }
  .battle-panel.is-capture .battle-stage,.battle-panel.is-capture .battle-health { bottom:86px; }.battle-panel.is-capture .battle-command-deck { max-height:78px; }
}

@media (prefers-reduced-motion:reduce) {
  .battle-panel::before,.battle-stage::after { display:none; }
  .battle-intro,.battle-intro > i,.capture-ring-inner,.capture-throw,.battle-command-deck { animation:none!important;transition:none!important; }
  .battle-panel.is-intro .battle-intro { opacity:1; }.battle-panel.is-intro .battle-intro > i { display:none; }
}

.capture-guide-v290 { display:grid;gap:10px;padding:13px;border:1px solid color-mix(in srgb,#55c8f4 26%,var(--theme-border,#c9dde7));border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,#52c9f4 7%,var(--theme-card,#fff)),var(--theme-card,#fff)); }
.capture-guide-v290 > header { display:grid;grid-template-columns:48px minmax(0,1fr);gap:11px;align-items:center; }
.capture-guide-v290 > header > span { display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,#35b8ec,#2979c9);color:#fff;box-shadow:0 9px 20px rgba(35,137,193,.22); }
.capture-guide-v290 > header svg { width:27px;height:27px; }.capture-guide-v290 > header small { color:var(--theme-accent,#29a4df);font-size:7px;font-weight:950;letter-spacing:.09em; }.capture-guide-v290 > header b { display:block;margin-top:2px;color:var(--theme-text,#173c55);font-size:14px; }.capture-guide-v290 > header p { margin:3px 0 0;color:var(--theme-muted,#6d899a);font-size:8px;line-height:1.4; }
.capture-guide-v290 > ol { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:0;padding:0;list-style:none; }
.capture-guide-v290 > ol li { display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:center;min-height:58px;padding:8px;border:1px solid var(--theme-border,#d1e1e9);border-radius:13px;background:var(--theme-surface-soft,#eef6f9); }
.capture-guide-v290 > ol li > i { display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:color-mix(in srgb,var(--theme-accent,#2aa4df) 10%,var(--theme-card,#fff));color:var(--theme-accent,#2aa4df);font-style:normal; }.capture-guide-v290 > ol svg { width:22px;height:22px; }.capture-guide-v290 > ol b { display:block;color:var(--theme-text,#173c55);font-size:9px; }.capture-guide-v290 > ol small { display:block;margin-top:2px;color:var(--theme-muted,#6d899a);font-size:7px;line-height:1.35; }
.capture-guide-v290 > footer { display:grid;gap:2px;padding:9px 10px;border-radius:12px;background:color-mix(in srgb,#46bd80 8%,var(--theme-surface-soft,#eef6f9)); }.capture-guide-v290 > footer b { color:#319365;font-size:8px; }.capture-guide-v290 > footer span { color:var(--theme-muted,#6d899a);font-size:7px;line-height:1.4; }
.is-battling .side-panel.is-mechanics-panel { z-index:126;top:12px;right:12px;bottom:12px;left:auto;max-height:none;pointer-events:auto;box-shadow:0 30px 80px rgba(0,18,29,.54); }
@media (max-width:760px) { .capture-guide-v290 > ol { grid-template-columns:1fr; }.is-battling .side-panel.is-mechanics-panel { inset:6px;max-height:none;width:auto; } }

/* v2.9.1 — visible arena, compact MOBA skills and non-blocking game windows */
.visually-hidden { position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important; }

.game-screen .battle-panel {
  --battle-stage-width:min(1180px,calc(100vw - 120px));
  --battle-deck-width:min(650px,calc(100vw - 430px));
  --battle-slot:62px;
}
html[data-game-theme] .game-screen .battle-panel,
body[data-ui-theme] .game-screen .battle-panel {
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#effaff!important;
}
.battle-panel::before { background:radial-gradient(circle at 50% 43%,transparent 34%,rgba(2,20,29,.11) 72%,rgba(2,17,25,.34)),linear-gradient(180deg,rgba(2,20,30,.19),transparent 25%,transparent 72%,rgba(2,17,25,.35)); }
.battle-stage {
  top:66px;bottom:118px;width:var(--battle-stage-width);min-height:300px;border:1px solid rgba(225,249,255,.62);border-radius:28px;
  box-shadow:0 20px 56px rgba(0,26,36,.3),inset 0 1px rgba(255,255,255,.65),inset 0 -42px 68px rgba(2,28,32,.08);
}
.battle-stage::before { box-shadow:inset 0 0 0 4px rgba(255,255,255,.055),inset 0 -34px 70px rgba(2,34,35,.08); }
.battle-stage::after { background:radial-gradient(circle at 50% 49%,transparent 0 41%,rgba(3,32,36,.025) 68%,rgba(1,22,29,.17)); }
.battle-stage-decor { position:absolute;z-index:3;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none; }
.battle-stage-decor i { position:absolute;width:5px;height:5px;border-radius:50%;background:#fff8b1;box-shadow:0 0 10px rgba(255,246,161,.65);opacity:.38;animation:battle-mote-float 4.8s ease-in-out infinite; }
.battle-stage-decor i:nth-child(1) { left:11%;top:29%;animation-delay:-.7s; }.battle-stage-decor i:nth-child(2) { left:24%;top:17%;animation-delay:-2.3s; }.battle-stage-decor i:nth-child(3) { left:43%;top:33%;animation-delay:-1.1s; }.battle-stage-decor i:nth-child(4) { left:66%;top:18%;animation-delay:-3.4s; }.battle-stage-decor i:nth-child(5) { left:79%;top:41%;animation-delay:-1.8s; }.battle-stage-decor i:nth-child(6) { left:91%;top:25%;animation-delay:-4.1s; }

.battle-status { top:10px;width:min(720px,calc(100vw - 520px));min-width:480px;min-height:46px;padding:5px 9px!important;border-color:rgba(215,244,252,.2)!important;border-radius:15px!important;background:rgba(4,29,42,.8)!important;box-shadow:0 10px 28px rgba(0,19,28,.19),inset 0 1px rgba(255,255,255,.09);backdrop-filter:blur(12px) saturate(1.08); }
.battle-status > span > strong { font-size:14px; }.battle-status > span > small { font-size:7px; }
.battle-controls button { min-width:38px;min-height:34px;padding:0 9px;border-radius:10px; }
.battle-controls button .combat-icon { width:16px;height:16px; }.battle-controls button > b { font-size:7px; }

.battle-turn-chip { top:10px;min-height:32px;padding:4px 10px;background:rgba(251,255,252,.86); }
.battle-health { top:66px;bottom:118px;width:var(--battle-stage-width); }
html[data-game-theme] .game-screen .battle-health > article,
body[data-ui-theme] .game-screen .battle-health > article {
  width:min(255px,25vw);padding:9px 10px;border:1px solid rgba(217,246,252,.24)!important;border-radius:15px;
  background:rgba(4,31,43,.8)!important;color:#effaff!important;box-shadow:0 11px 26px rgba(0,27,36,.18),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(10px);
}
.battle-health > .enemy-health { right:14px;top:50px; }.battle-health > .ally-health { left:14px;bottom:14px; }
.battle-health > article > span b { color:#f1fbff!important;font-size:11px; }.battle-health > article > span small,.battle-health .battle-stamina small { color:#b7d1dc!important;font-size:7px; }
.battle-health .battle-hp-bar,.battle-health .battle-stamina > i { background:rgba(219,244,250,.14); }
.battle-health .battle-hp-bar { height:7px; }.battle-health .battle-stamina { margin-top:5px; }.battle-health .battle-stamina > i { height:3px; }
.battle-health .battle-exp { display:none!important; }.battle-health .battle-statuses { margin-top:5px;gap:3px; }
.battle-health .battle-status-chip { min-width:25px;justify-content:center;padding:2px 4px;border-color:rgba(220,246,252,.14)!important;background:rgba(255,255,255,.06)!important;color:#f4fbff!important; }
.battle-health .battle-status-chip b { display:none; }.battle-health .battle-status-chip small { color:#fff!important; }
.battle-team-strip,.battle-target-strip { top:104px;width:min(460px,calc(var(--battle-stage-width) - 560px)); }

.battle-command-deck {
  bottom:14px;width:var(--battle-deck-width);min-height:82px;grid-template-columns:var(--battle-slot) minmax(0,1fr);grid-template-rows:var(--battle-slot);align-items:center;gap:7px;padding:9px;
  border-color:rgba(217,245,252,.22);border-radius:20px;background:linear-gradient(145deg,rgba(4,28,40,.93),rgba(7,42,54,.9));box-shadow:0 18px 46px rgba(0,18,27,.34),inset 0 1px rgba(255,255,255,.09);backdrop-filter:blur(15px) saturate(1.08);
}
.battle-command-deck .battle-basic { grid-column:1;grid-row:1; }.battle-command-deck .battle-skills { grid-column:2;grid-row:1; }
.battle-basic,.battle-skills > button {
  position:relative;width:var(--battle-slot);height:var(--battle-slot);min-width:var(--battle-slot);min-height:var(--battle-slot);padding:5px!important;display:grid;place-items:center;border:1px solid rgba(222,246,252,.15);border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.035));overflow:visible;color:#effaff;box-shadow:inset 0 1px rgba(255,255,255,.06);transition:transform .14s ease,border-color .14s ease,filter .14s ease,box-shadow .14s ease;
}
.battle-basic:hover:not(:disabled),.battle-skills > button:hover { transform:translateY(-2px);border-color:rgba(118,218,249,.52);box-shadow:0 8px 18px rgba(0,18,27,.2),inset 0 1px rgba(255,255,255,.1); }
.battle-basic > span:first-child,.battle-skills > button > .skill-icon { width:50px;height:50px;grid-row:auto;display:grid;place-items:center;border-radius:11px;overflow:hidden;background:rgba(255,255,255,.06); }
.battle-basic > span:first-child svg { width:27px;height:27px; }.battle-skills > button > .skill-icon img { width:100%;height:100%;object-fit:cover; }
.battle-basic > b,.battle-basic > small { display:none; }
.battle-basic > kbd,.battle-skills > button > kbd { position:absolute;z-index:6;left:-3px;top:-4px;min-width:20px;height:20px;padding:2px 4px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.36);border-radius:6px;background:rgba(0,15,24,.9);color:#fff;font:900 8px/1 inherit;box-shadow:0 4px 8px rgba(0,13,20,.24); }
.battle-skills { display:grid;grid-template-columns:repeat(4,var(--battle-slot));justify-content:start;gap:7px;padding:0;margin:0;overflow:visible; }
.battle-skills > button > span.skill-cost { position:absolute;z-index:7;right:-4px;bottom:-4px;min-width:24px;height:20px;padding:2px 4px;display:flex;align-items:center;justify-content:center;gap:1px;border:1px solid rgba(154,223,247,.32);border-radius:7px;background:rgba(3,27,40,.94);color:#82dcff;box-shadow:0 4px 9px rgba(0,15,23,.25); }
.battle-skills > button > span.skill-cost svg { width:11px;height:11px; }.battle-skills > button > span.skill-cost b { font-size:7px; }
.battle-basic > em,.battle-skills > button > em { position:absolute;z-index:8;right:3px;top:3px;min-width:15px;height:15px;padding:0 3px;display:grid;place-items:center;border-radius:999px;background:#5dd187;color:#fff;font:950 8px/1 inherit;box-shadow:0 0 0 2px rgba(3,25,35,.8); }
.battle-basic > em:empty,.battle-skills > button > em:empty { display:none; }
.battle-skills > button.is-queued,.battle-basic.is-queued { border-color:#70e8ff;box-shadow:0 0 0 2px rgba(80,220,248,.2),0 0 20px rgba(77,211,245,.16);animation:none; }
.battle-skills > button.is-disabled { cursor:help;filter:saturate(.5) brightness(.78); }.battle-skills > button.is-disabled:not(.is-cooling) > .skill-icon { opacity:.72; }
.battle-skills > button.is-no-stamina > em { background:#328eb5; }.battle-skills > button.is-blocked-status > em { background:#e36b62; }
.skill-cooldown { position:absolute;z-index:5;inset:4px;display:grid;place-items:center;border-radius:11px;background:conic-gradient(from 0deg,rgba(1,14,22,.82) 0 var(--cooldown-sweep,0deg),transparent var(--cooldown-sweep,0deg) 360deg);opacity:0;pointer-events:none; }
.is-cooling > .skill-cooldown { opacity:1; }.skill-cooldown > b { display:grid;place-items:center;min-width:26px;height:26px;padding:0 4px;border:1px solid rgba(255,255,255,.19);border-radius:999px;background:rgba(2,19,28,.82);color:#fff;font-size:11px;text-shadow:0 2px 4px #00131c; }
.battle-action-slot.is-previewed { border-color:#9ce9ff!important;box-shadow:0 0 0 2px rgba(106,222,250,.18),0 0 22px rgba(70,195,229,.15)!important; }

.battle-skill-preview {
  position:absolute;z-index:20;left:50%;bottom:calc(100% + 11px);width:min(330px,calc(100vw - 28px));min-height:86px;padding:10px;display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:10px;
  transform:translate(-50%,8px) scale(.98);border:1px solid rgba(212,244,252,.22);border-radius:17px;background:rgba(4,29,41,.94);color:#effaff;box-shadow:0 16px 38px rgba(0,17,26,.38),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(14px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .14s ease,transform .14s ease,visibility .14s;
}
.battle-skill-preview.is-open { opacity:1;visibility:visible;transform:translate(-50%,0) scale(1); }
.battle-skill-preview > span { width:58px;height:58px;display:grid;place-items:center;border-radius:13px;background:rgba(255,255,255,.07);overflow:hidden;color:#72dfff; }.battle-skill-preview > span svg { width:31px;height:31px; }.battle-skill-preview > span .skill-icon,.battle-skill-preview > span img { width:100%;height:100%;object-fit:cover; }
.battle-skill-preview > div { min-width:0; }.battle-skill-preview small { color:#72dfff;font-size:7px;font-weight:900;letter-spacing:.09em; }.battle-skill-preview b { display:block;margin-top:2px;font-size:12px; }.battle-skill-preview p { margin:3px 0;color:#c7dce5;font-size:8px;line-height:1.35; }.battle-skill-preview em { color:#89aeba;font-size:7px;font-style:normal; }
.battle-skill-preview[data-state="cooldown"] em { color:#ffd279; }.battle-skill-preview[data-state="resource"] em,.battle-skill-preview[data-state="blocked"] em { color:#ffaaa3; }
.combat-ui-guide-v291 { display:grid;gap:9px;padding:11px;border:1px solid var(--theme-border,#d9e7ed);border-radius:16px;background:var(--theme-card,#fff); }
.combat-ui-guide-v291 > header { display:flex;align-items:center;gap:9px; }.combat-ui-guide-v291 > header > span { display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,var(--theme-accent,#159fca) 12%,transparent);color:var(--theme-accent,#159fca); }.combat-ui-guide-v291 > header svg { width:21px;height:21px; }.combat-ui-guide-v291 > header small { display:block;color:var(--theme-accent,#159fca);font-size:7px;font-weight:950;letter-spacing:.09em; }.combat-ui-guide-v291 > header b { display:block;margin-top:2px;color:var(--theme-text,#173b4c);font-size:12px; }
.combat-ui-guide-v291 > div { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px; }.combat-ui-guide-v291 article { display:grid;grid-template-columns:30px minmax(0,1fr);align-items:start;gap:7px;padding:8px;border-radius:11px;background:var(--theme-surface-soft,#edf5f8); }.combat-ui-guide-v291 article > svg { width:22px;height:22px;color:var(--theme-accent,#159fca); }.combat-ui-guide-v291 article b { display:block;color:var(--theme-text,#173b4c);font-size:8px; }.combat-ui-guide-v291 article small { display:block;margin-top:2px;color:var(--theme-muted,#6e8794);font-size:7px;line-height:1.4; }
.battle-footer { position:absolute;left:50%;bottom:calc(100% + 9px);width:min(520px,calc(100vw - 34px));min-height:30px;padding:6px 10px;transform:translateX(-50%);display:block;border:1px solid rgba(222,245,252,.2);border-radius:12px;background:rgba(4,30,42,.73);text-align:center;box-shadow:0 8px 20px rgba(0,20,29,.16);backdrop-filter:blur(8px);pointer-events:none; }
.battle-footer > p { color:#e4f5fa!important;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }.battle-footer > ol { display:none; }
.battle-panel:not([data-phase="battle"]) .battle-basic { display:none; }
.battle-panel[data-phase="decision"] .battle-command-deck,.battle-panel.is-capture .battle-command-deck { width:min(760px,calc(100vw - 32px));grid-template-columns:1fr;grid-template-rows:auto;min-height:0; }
.battle-command-deck .battle-decision,.battle-command-deck .capture-panel { grid-column:1;grid-row:1; }
.battle-decision { min-height:68px;grid-template-columns:minmax(0,1fr) 112px 112px;padding:8px 10px; }.battle-decision button { min-height:44px; }

.battle-asset-loader { position:absolute;z-index:12;left:50%;top:50%;width:min(330px,calc(100% - 30px));padding:13px 15px;transform:translate(-50%,-50%) scale(.96);display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:11px;border:1px solid rgba(203,242,253,.24);border-radius:18px;background:rgba(3,28,40,.91);color:#f2fbff;box-shadow:0 20px 54px rgba(0,18,27,.35);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .16s,transform .18s,visibility .16s; }
.battle-panel.is-preloading .battle-asset-loader { opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1); }.battle-panel.is-preloading .battle-intro { opacity:0!important; }
.battle-asset-loader > i { width:44px;height:44px;border:4px solid rgba(112,221,250,.18);border-top-color:#70dcfa;border-radius:50%;animation:battle-loader-spin .72s linear infinite; }.battle-asset-loader span { min-width:0;display:grid;gap:2px; }.battle-asset-loader small { color:#74dcf8;font-size:7px;font-weight:950;letter-spacing:.12em; }.battle-asset-loader b { font-size:11px; }.battle-asset-loader em { display:block;width:100%;height:3px;margin-top:5px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.09); }.battle-asset-loader em::after { content:'';display:block;width:42%;height:100%;border-radius:inherit;background:linear-gradient(90deg,transparent,#7de3fa,transparent);animation:battle-loader-line 1s ease-in-out infinite; }
.battle-intro::before { height:96px;background:linear-gradient(90deg,transparent,rgba(3,29,39,.74) 18% 82%,transparent); }.battle-intro small { color:#84e6ff; }.battle-intro strong { font-size:clamp(30px,4.4vw,58px); }

.battle-utility-rail { display:none; }
body.is-battling .chat-panel.is-open { z-index:128!important;pointer-events:auto!important; }
body.is-battling .side-panel.is-open { z-index:129!important;pointer-events:auto!important; }

@media (min-width:801px) {
  body.is-battling .desktop-dock { z-index:121!important;opacity:1!important;pointer-events:auto!important;filter:none!important; }
  body.is-battling .desktop-utility-rail { z-index:120!important;opacity:.92;pointer-events:auto; }
  body.is-battling .chat-panel.is-minimized { z-index:128!important;opacity:1!important;pointer-events:auto!important; }
}

@media (max-width:800px) {
  .game-screen .battle-panel { --battle-stage-width:calc(100vw - 6px);--battle-deck-width:calc(100vw - 66px);--battle-slot:52px; }
  .battle-panel::before { background:linear-gradient(180deg,rgba(2,18,28,.12),transparent 62%,rgba(2,18,27,.32)); }
  .battle-stage { top:7px;bottom:164px;min-height:220px;border-radius:18px; }
  .battle-status { top:7px;left:7px;width:calc(100vw - 62px);min-width:0;min-height:40px;transform:none;padding:4px 6px!important;border-radius:13px!important; }
  .battle-status > span > small { max-width:44vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:5px; }.battle-status > span > strong { max-width:42vw;font-size:9px; }
  .battle-controls { gap:2px; }.battle-controls button { min-width:31px;min-height:31px;padding:0 5px;font-size:0; }.battle-controls button > b { display:none; }.battle-controls button .combat-icon { width:15px;height:15px; }.battle-controls #battleHelp { display:none; }
  .battle-turn-chip { top:47px;min-height:27px;padding:3px 7px; }.battle-turn-chip small { font-size:5px; }.battle-turn-chip b { font-size:6px; }
  .battle-health { top:7px;bottom:164px;width:var(--battle-stage-width); }
  html[data-game-theme] .game-screen .battle-health > article,body[data-ui-theme] .game-screen .battle-health > article { width:47%;padding:6px 7px;border-radius:12px; }
  .battle-health > .enemy-health { right:6px;top:75px; }.battle-health > .ally-health { left:6px;bottom:7px; }
  .battle-health > article > span b { font-size:8px!important; }.battle-health > article > span small { font-size:6px!important; }.battle-health .battle-stamina > span b { font-size:5px; }
  .battle-team-strip,.battle-target-strip { top:82px;width:62vw; }.battle-team-member,.battle-target-strip > button { min-width:122px;min-height:40px;padding:4px 6px; }
  .battle-command-deck { left:7px;bottom:calc(6px + env(safe-area-inset-bottom));width:var(--battle-deck-width);min-height:118px;grid-template-columns:46px minmax(0,1fr);grid-template-rows:auto;align-items:start;gap:6px;padding:6px;transform:none;border-radius:17px; }
  .battle-command-deck .battle-basic { width:46px;height:46px;min-width:46px;min-height:46px; }.battle-basic > span:first-child { width:38px;height:38px; }
  .battle-command-deck .battle-skills { grid-template-columns:repeat(2,var(--battle-slot));grid-template-rows:repeat(2,var(--battle-slot));gap:6px;justify-content:start; }
  .battle-basic,.battle-skills > button { border-radius:12px; }.battle-skills > button > .skill-icon { width:44px;height:44px;border-radius:9px; }
  .battle-basic > kbd,.battle-skills > button > kbd { left:-2px;top:-3px;min-width:18px;height:18px;font-size:7px; }.battle-skills > button > span.skill-cost { right:-3px;bottom:-3px;min-width:21px;height:18px; }.battle-skills > button > span.skill-cost svg { display:none; }
  .battle-footer { bottom:calc(100% + 6px);width:min(430px,calc(100vw - 70px));min-height:26px;padding:5px 8px; }.battle-footer > p { font-size:6px; }
  .battle-skill-preview { left:0;bottom:calc(100% + 7px);width:calc(100vw - 70px);min-height:74px;grid-template-columns:46px minmax(0,1fr);padding:8px;transform:translateY(7px) scale(.98); }.battle-skill-preview.is-open { transform:none; }.battle-skill-preview > span { width:46px;height:46px;border-radius:11px; }.battle-skill-preview b { font-size:10px; }.battle-skill-preview p { font-size:7px;max-height:29px;overflow:hidden; }.battle-skill-preview em { font-size:6px; }
  .battle-panel[data-phase="decision"] .battle-command-deck,.battle-panel.is-capture .battle-command-deck { left:7px;width:calc(100vw - 14px);min-height:0; }
  .battle-decision { grid-template-columns:1fr 1fr;min-height:0;padding:7px; }.battle-decision > span { grid-column:1/-1; }.battle-decision button { min-height:41px; }
  .battle-panel.is-capture .battle-stage { bottom:94px; }.battle-panel.is-capture .battle-health { bottom:94px; }.battle-panel.is-capture .battle-command-deck { max-height:82px; }
  .capture-panel { min-height:68px;padding:6px; }.capture-balls button { min-height:50px; }
  .battle-utility-rail { position:absolute;z-index:31;right:5px;top:50%;display:grid;gap:5px;transform:translateY(-50%);pointer-events:auto; }
  .battle-utility-rail button { position:relative;width:45px;height:45px;padding:0;display:grid;place-items:center;border:1px solid rgba(218,246,252,.24);border-radius:14px;background:rgba(4,30,42,.84);color:#eaf9fd;box-shadow:0 8px 20px rgba(0,19,29,.2),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(9px); }
  .battle-utility-rail button span,.battle-utility-rail button svg { width:20px;height:20px; }.battle-utility-rail button b { position:absolute;right:calc(100% + 5px);padding:3px 5px;border-radius:6px;background:rgba(3,27,38,.83);color:#e9f8fd;font-size:5px;opacity:0;pointer-events:none; }.battle-utility-rail button:focus-visible b,.battle-utility-rail button:active b { opacity:1; }
  body.is-battling .mobile-dock { opacity:0!important;pointer-events:none!important; }
  body.is-battling .side-panel.is-open { inset:5px!important;width:auto!important;max-height:none!important;z-index:129!important; }
  body.is-battling .chat-panel.is-open { left:5px!important;right:5px!important;top:auto!important;bottom:5px!important;width:auto!important;max-width:none!important;height:min(72dvh,620px)!important;max-height:calc(100dvh - 10px)!important;z-index:130!important; }
}

@media (max-width:430px) {
  .battle-status > span > strong { max-width:35vw;font-size:8px; }.battle-status > span > small { max-width:35vw; }
  .battle-health > .enemy-health { top:68px; }.battle-health .battle-stamina { display:none; }
  .battle-footer { display:block; }.battle-intro strong { font-size:28px; }
}

@media (max-width:760px) { .combat-ui-guide-v291 > div { grid-template-columns:1fr; } }

@media (max-height:650px) and (max-width:900px) {
  .game-screen .battle-panel { --battle-slot:46px; }
  .battle-stage { top:5px;bottom:112px; }.battle-health { top:5px;bottom:112px; }
  .battle-command-deck { min-height:58px;grid-template-columns:42px minmax(0,1fr); }.battle-command-deck .battle-basic { width:42px;height:42px;min-width:42px;min-height:42px; }.battle-basic > span:first-child { width:34px;height:34px; }
  .battle-command-deck .battle-skills { grid-template-columns:repeat(4,var(--battle-slot));grid-template-rows:var(--battle-slot); }.battle-skills > button > .skill-icon { width:38px;height:38px; }
  .battle-footer { display:none; }.battle-skill-preview { bottom:calc(100% + 5px); }
  .battle-health > .enemy-health { top:52px; }.battle-health > .ally-health { bottom:5px; }
  .battle-panel.is-capture .battle-stage,.battle-panel.is-capture .battle-health { bottom:80px; }.battle-panel.is-capture .battle-command-deck { max-height:70px; }
  .battle-utility-rail { position:absolute;z-index:31;right:4px;top:50%;display:grid;gap:4px;transform:translateY(-50%);pointer-events:auto; }
  .battle-utility-rail button { position:relative;width:40px;height:40px;padding:0;display:grid;place-items:center;border:1px solid rgba(218,246,252,.24);border-radius:12px;background:rgba(4,30,42,.84);color:#eaf9fd;box-shadow:0 7px 18px rgba(0,19,29,.2),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(8px); }
  .battle-utility-rail button span,.battle-utility-rail button svg { width:18px;height:18px; }.battle-utility-rail button b { display:none; }
  body.is-battling .desktop-dock,body.is-battling .desktop-utility-rail { opacity:0!important;pointer-events:none!important; }
  body.is-battling .chat-panel.is-open { left:5px!important;right:5px!important;top:5px!important;bottom:5px!important;width:auto!important;max-width:none!important;height:auto!important;max-height:none!important;z-index:130!important; }
  body.is-battling .side-panel.is-open { inset:5px!important;width:auto!important;max-height:none!important;z-index:129!important; }
}

@media (prefers-reduced-motion:reduce) {
  .battle-stage-decor i,.battle-asset-loader > i,.battle-asset-loader em::after { animation:none!important; }
}

@keyframes battle-loader-spin { to { transform:rotate(360deg); } }
@keyframes battle-loader-line { from { transform:translateX(-120%); } to { transform:translateX(260%); } }
@keyframes battle-mote-float { 0%,100% { transform:translateY(0) scale(.8);opacity:.2; } 50% { transform:translateY(-15px) scale(1.2);opacity:.58; } }

/* v2.9.2 — individual energy, ultimate warm-up, quick items and authoritative PvE pause */
.game-screen .battle-panel { --battle-item-slot:43px;--battle-deck-width:min(690px,calc(100vw - 400px)); }
.battle-command-deck { grid-template-columns:var(--battle-slot) auto minmax(178px,1fr); }
.battle-command-deck .battle-basic { grid-column:1;grid-row:1; }
.battle-command-deck .battle-skills { grid-column:2;grid-row:1; }
.battle-command-deck .battle-quick-items { grid-column:3;grid-row:1; }
.battle-command-deck .battle-footer,.battle-command-deck .battle-decision,.battle-command-deck .capture-panel { grid-column:1/-1; }

.battle-quick-items { position:relative;display:grid;grid-template-columns:repeat(4,var(--battle-item-slot));justify-content:end;align-items:center;gap:5px;min-width:0;overflow:visible; }
.battle-quick-item { position:relative;width:var(--battle-item-slot);height:var(--battle-slot);min-width:var(--battle-item-slot);min-height:var(--battle-slot);padding:4px;display:grid;place-items:center;border:1px solid rgba(217,244,252,.14);border-radius:13px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.028));color:#f2fbff;box-shadow:inset 0 1px rgba(255,255,255,.07);overflow:visible;transition:transform .14s ease,border-color .14s ease,filter .14s ease; }
.battle-quick-item:hover,.battle-quick-item:focus-visible { z-index:25;transform:translateY(-2px);border-color:rgba(124,224,250,.56);outline:0; }
.battle-quick-item > span { width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.07);overflow:hidden; }
.battle-quick-item .battle-item-icon,.battle-quick-item .item-graphic-base { width:100%;height:100%;display:block; }
.battle-quick-item .item-graphic-base { padding:2px; }
.battle-quick-item > kbd { position:absolute;z-index:8;left:-3px;top:-4px;min-width:19px;height:19px;padding:2px 3px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.36);border-radius:6px;background:rgba(0,15,24,.92);color:#fff;font:900 7px/1 inherit;box-shadow:0 4px 8px rgba(0,13,20,.24); }
.battle-quick-item > b { position:absolute;z-index:8;right:-4px;bottom:-4px;min-width:21px;height:18px;padding:0 4px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.23);border-radius:7px;background:rgba(3,27,40,.95);color:#fff;font-size:7px; }
.battle-quick-item > em { position:absolute;z-index:8;right:2px;top:2px;padding:2px 3px;border-radius:5px;background:rgba(69,187,225,.88);color:#fff;font-size:5px;font-style:normal;font-weight:950;line-height:1; }
.battle-quick-item.is-disabled { cursor:help;filter:saturate(.45) brightness(.72); }
.battle-quick-item.is-ready::before { content:'';position:absolute;inset:2px;border:1px solid rgba(103,230,173,.25);border-radius:11px;pointer-events:none; }
.battle-quick-item::after { content:attr(data-tooltip);position:absolute;left:50%;bottom:calc(100% + 11px);width:max-content;max-width:230px;padding:7px 9px;transform:translate(-50%,5px);border:1px solid rgba(213,244,252,.2);border-radius:9px;background:rgba(3,27,39,.96);color:#eefaff;box-shadow:0 9px 24px rgba(0,16,25,.34);font-size:7px;font-weight:800;line-height:1.35;text-align:center;white-space:normal;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s,transform .12s,visibility .12s; }
.battle-quick-item:hover::after,.battle-quick-item:focus-visible::after { opacity:1;visibility:visible;transform:translate(-50%,0); }

.battle-energy > span b { color:#68d9ff!important; }
.battle-energy > i > em { background:linear-gradient(90deg,#2d9ee9,#69ddff)!important;box-shadow:0 0 9px rgba(69,193,241,.4); }
.battle-status-chip.is-buff { border-color:rgba(96,225,159,.34)!important;background:rgba(60,184,121,.16)!important;color:#94efbd!important; }
.battle-status-chip.is-debuff { border-color:rgba(255,130,116,.3)!important;background:rgba(213,76,70,.13)!important;color:#ffd2cd!important; }
.battle-status-chip small { min-width:10px;text-align:center;font-variant-numeric:tabular-nums; }
.battle-skills > button.skill-kind-ultimate { border-color:rgba(236,191,79,.3);box-shadow:inset 0 0 15px rgba(224,165,54,.06); }
.battle-skills > button.skill-kind-ultimate > kbd { border-color:rgba(255,222,125,.55);background:rgba(68,43,4,.9);color:#ffe598; }

.battle-pause-overlay { position:absolute;z-index:18;inset:0;display:grid;place-content:center;grid-template-columns:54px auto;align-items:center;gap:13px;border-radius:inherit;background:rgba(2,23,34,.53);color:#f3fbff;backdrop-filter:blur(4px) saturate(.6);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s,visibility .18s; }
.battle-pause-overlay > svg { width:54px;height:54px;padding:14px;border:1px solid rgba(208,244,252,.24);border-radius:17px;background:rgba(4,35,48,.76);color:#78ddfa;box-shadow:0 12px 30px rgba(0,17,27,.26); }
.battle-pause-overlay span { display:grid;gap:2px; }.battle-pause-overlay small { color:#78ddfa;font-size:7px;font-weight:950;letter-spacing:.12em; }.battle-pause-overlay b { font-size:24px;letter-spacing:.08em; }.battle-pause-overlay em { color:#bfd7df;font-size:8px;font-style:normal; }
.battle-panel.is-paused .battle-pause-overlay { opacity:1;visibility:visible; }
.battle-panel.is-paused .battle-basic,.battle-panel.is-paused .battle-skills,.battle-panel.is-paused .battle-quick-items { filter:saturate(.45) brightness(.72); }
.battle-controls #pauseBattle.is-active { border-color:rgba(112,221,250,.48);background:rgba(65,185,225,.22);color:#a7efff; }

@media (max-width:800px) {
  .game-screen .battle-panel { --battle-item-slot:34px; }
  .battle-command-deck { grid-template-columns:46px minmax(110px,1fr) 74px; }
  .battle-command-deck .battle-basic { grid-column:1; }.battle-command-deck .battle-skills { grid-column:2; }.battle-command-deck .battle-quick-items { grid-column:3; }
  .battle-quick-items { grid-template-columns:repeat(2,var(--battle-item-slot));grid-template-rows:repeat(2,var(--battle-slot));align-content:start;gap:6px; }
  .battle-quick-item { width:var(--battle-item-slot);height:var(--battle-slot);min-width:var(--battle-item-slot);min-height:var(--battle-slot);padding:2px;border-radius:10px; }
  .battle-quick-item > span { width:29px;height:29px;border-radius:8px; }.battle-quick-item > em { display:none; }.battle-quick-item > kbd { min-width:16px;height:16px;font-size:6px; }.battle-quick-item > b { min-width:18px;height:16px;font-size:6px; }
  .battle-quick-item::after { left:auto;right:0;bottom:calc(100% + 7px);max-width:min(210px,70vw);transform:translateY(4px); }.battle-quick-item:hover::after,.battle-quick-item:focus-visible::after { transform:none; }
  .battle-health .battle-statuses { display:flex!important;min-height:21px;overflow-x:auto;scrollbar-width:none; }.battle-health .battle-statuses:empty { min-height:0; }
  .battle-health .battle-status-chip { flex:0 0 auto;min-width:23px;padding:2px 3px; }.battle-health .battle-status-chip svg { width:12px;height:12px; }
  .battle-pause-overlay { grid-template-columns:42px auto;gap:9px; }.battle-pause-overlay > svg { width:42px;height:42px;padding:11px;border-radius:13px; }.battle-pause-overlay b { font-size:18px; }.battle-pause-overlay em { font-size:6px; }
}

@media (max-width:430px) {
  .battle-health .battle-stamina.battle-energy { display:flex; }
  .battle-health .battle-statuses { margin-top:3px; }
}

@media (max-height:650px) and (max-width:900px) {
  .game-screen .battle-panel { --battle-item-slot:34px; }
  .battle-command-deck { grid-template-columns:42px auto minmax(144px,1fr); }
  .battle-quick-items { grid-template-columns:repeat(4,var(--battle-item-slot));grid-template-rows:var(--battle-slot);justify-content:end;gap:4px; }
  .battle-quick-item { width:var(--battle-item-slot);height:var(--battle-slot);min-width:var(--battle-item-slot);min-height:var(--battle-slot); }
  .battle-quick-item > span { width:29px;height:29px; }
}

@media (prefers-reduced-motion:reduce) {
  .battle-quick-item,.battle-quick-item::after,.battle-pause-overlay { transition:none!important; }
}

/* v2.9.3 — one self-contained battle window; no viewport-positioned battle fragments */
.game-screen .battle-panel {
  --battle-shell-width:min(1280px,calc(100vw - 48px));
  --battle-shell-height:min(900px,calc(100dvh - 28px));
  --battle-shell-head:54px;
  --battle-shell-command:104px;
  --battle-shell-gap:8px;
  --battle-shell-pad:8px;
  --battle-slot:58px;
  --battle-item-slot:46px;
  position:absolute!important;
  inset:0!important;
  width:auto!important;
  height:auto!important;
  padding:0!important;
  overflow:hidden!important;
}
.game-screen .battle-panel::before {
  z-index:0;
  background:radial-gradient(circle at 50% 46%,rgba(2,24,31,.08) 0 36%,rgba(2,18,27,.38) 78%),rgba(2,18,25,.18)!important;
  backdrop-filter:saturate(.82) brightness(.9);
}
.battle-shell {
  position:absolute;
  z-index:2;
  left:50%;
  top:50%;
  width:var(--battle-shell-width);
  height:var(--battle-shell-height);
  min-width:720px;
  min-height:520px;
  box-sizing:border-box;
  padding:var(--battle-shell-pad);
  display:grid;
  grid-template-rows:var(--battle-shell-head) minmax(0,1fr) var(--battle-shell-command);
  gap:var(--battle-shell-gap);
  transform:translate(-50%,-50%);
  overflow:hidden;
  border:1px solid rgba(203,239,247,.46);
  border-radius:27px;
  background:rgba(2,25,34,.1);
  box-shadow:0 30px 90px rgba(0,16,24,.48),0 0 0 1px rgba(255,255,255,.05),inset 0 1px rgba(255,255,255,.18);
  pointer-events:none;
}
.battle-shell::after {
  content:'';
  position:absolute;
  z-index:40;
  inset:0;
  border-radius:inherit;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.035),inset 0 -40px 80px rgba(1,18,25,.08);
  pointer-events:none;
}

.battle-shell > .battle-status {
  position:relative!important;
  z-index:12;
  inset:auto!important;
  grid-row:1;
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  height:100%;
  box-sizing:border-box;
  transform:none!important;
  padding:6px 9px!important;
  border:1px solid rgba(201,239,248,.18)!important;
  border-radius:17px!important;
  background:linear-gradient(135deg,rgba(3,27,39,.96),rgba(6,47,57,.92))!important;
  box-shadow:0 8px 22px rgba(0,17,25,.24),inset 0 1px rgba(255,255,255,.08)!important;
  pointer-events:auto;
}
.battle-status > span { min-width:0; }
.battle-status > span > small { font-size:7px!important; }
.battle-status > span > strong { max-width:420px;font-size:14px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.battle-controls { flex:0 0 auto; }
.battle-controls button { min-height:36px!important;border-radius:11px!important; }

.battle-shell > .battle-stage {
  position:relative!important;
  z-index:2;
  inset:auto!important;
  grid-row:2;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  transform:none!important;
  box-sizing:border-box;
  overflow:hidden;
  border:1px solid rgba(216,245,251,.52)!important;
  border-radius:21px!important;
  box-shadow:0 14px 38px rgba(0,20,27,.25),inset 0 1px rgba(255,255,255,.24),inset 0 -40px 76px rgba(1,25,31,.08)!important;
}
.battle-stage::before { box-shadow:inset 0 0 0 3px rgba(255,255,255,.045),inset 0 -36px 64px rgba(2,25,30,.07)!important; }
.battle-stage::after { background:radial-gradient(circle at 50% 48%,transparent 0 44%,rgba(2,28,32,.025) 72%,rgba(1,20,27,.15))!important; }

.battle-shell > .battle-health {
  position:absolute!important;
  z-index:8;
  left:var(--battle-shell-pad)!important;
  right:var(--battle-shell-pad)!important;
  top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap))!important;
  bottom:calc(var(--battle-shell-pad) + var(--battle-shell-command) + var(--battle-shell-gap))!important;
  width:auto!important;
  height:auto!important;
  transform:none!important;
  pointer-events:none;
}
html[data-game-theme] .game-screen .battle-health > article,
body[data-ui-theme] .game-screen .battle-health > article {
  width:clamp(210px,22%,270px)!important;
  padding:9px 10px!important;
  border:1px solid rgba(207,242,249,.2)!important;
  border-radius:15px!important;
  background:linear-gradient(145deg,rgba(3,28,40,.91),rgba(5,47,55,.86))!important;
  box-shadow:0 10px 25px rgba(0,18,25,.22),inset 0 1px rgba(255,255,255,.07)!important;
}
.battle-health > .enemy-health { right:14px!important;top:14px!important; }
.battle-health > .ally-health { left:14px!important;bottom:14px!important; }
.battle-health .battle-hp-bar { height:7px!important; }
.battle-health .battle-stamina { margin-top:5px!important; }
.battle-health .battle-stamina > i { height:3px!important; }
.battle-health .battle-statuses { display:flex!important;max-width:100%;min-height:0;gap:3px!important;overflow-x:auto;scrollbar-width:none; }
.battle-health .battle-statuses,.battle-health .battle-status-chip { pointer-events:auto; }
.battle-health .battle-statuses:empty { display:none!important; }

.battle-shell > .battle-team-strip,.battle-shell > .battle-target-strip {
  position:absolute!important;
  z-index:10;
  left:50%!important;
  top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap) + 14px)!important;
  width:min(500px,42%)!important;
  transform:translateX(-50%)!important;
  pointer-events:auto;
}
.battle-panel:not(.is-coop) .battle-team-strip { display:none!important; }

.battle-shell > .battle-command-deck {
  position:relative!important;
  z-index:13;
  inset:auto!important;
  grid-row:3;
  width:100%!important;
  height:100%;
  min-width:0!important;
  min-height:0!important;
  box-sizing:border-box;
  margin:0!important;
  padding:8px 12px 5px!important;
  display:grid;
  grid-template-columns:var(--battle-slot) auto auto!important;
  grid-template-rows:var(--battle-slot) minmax(17px,1fr)!important;
  align-items:center!important;
  align-content:center;
  justify-content:center;
  gap:5px 8px!important;
  transform:none!important;
  overflow:visible;
  border:1px solid rgba(202,240,248,.18)!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,rgba(3,27,39,.97),rgba(5,45,55,.94))!important;
  box-shadow:0 9px 25px rgba(0,17,25,.27),inset 0 1px rgba(255,255,255,.075)!important;
  pointer-events:auto;
}
.battle-command-deck .battle-basic { grid-column:1!important;grid-row:1!important; }
.battle-command-deck .battle-skills { grid-column:2!important;grid-row:1!important; }
.battle-command-deck .battle-quick-items { grid-column:3!important;grid-row:1!important; }
.battle-basic,.battle-skills > button { width:var(--battle-slot)!important;height:var(--battle-slot)!important;min-width:var(--battle-slot)!important;min-height:var(--battle-slot)!important;border-radius:14px!important; }
.battle-basic > span:first-child,.battle-skills > button > .skill-icon { width:46px!important;height:46px!important;border-radius:10px!important; }
.battle-skills { grid-template-columns:repeat(4,var(--battle-slot))!important;grid-template-rows:var(--battle-slot)!important;gap:6px!important;padding:0!important; }
.battle-quick-items { grid-template-columns:repeat(4,var(--battle-item-slot))!important;grid-template-rows:var(--battle-slot)!important;gap:5px!important; }
.battle-quick-items[hidden] { display:none!important; }
.battle-quick-item { width:var(--battle-item-slot)!important;height:var(--battle-slot)!important;min-width:var(--battle-item-slot)!important;min-height:var(--battle-slot)!important;border-radius:12px!important; }
.battle-quick-item > span { width:35px!important;height:35px!important; }
.battle-command-deck .battle-footer {
  position:relative!important;
  inset:auto!important;
  grid-column:1/-1!important;
  grid-row:2!important;
  align-self:stretch;
  width:min(900px,100%)!important;
  min-height:0!important;
  height:auto;
  margin:0 auto!important;
  padding:1px 8px!important;
  transform:none!important;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:0!important;
  border-radius:6px!important;
  background:rgba(255,255,255,.035)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.battle-footer > p { width:100%;font-size:7px!important;line-height:1.2;text-align:center; }
.battle-command-deck .battle-decision,.battle-command-deck .capture-panel {
  grid-column:1/-1!important;
  grid-row:1!important;
  justify-self:center;
  width:min(760px,100%);
  max-width:100%;
  margin:0!important;
}
.battle-panel[data-phase="decision"] .battle-command-deck,.battle-panel.is-capture .battle-command-deck { grid-template-columns:1fr!important;grid-template-rows:1fr!important; }
.battle-panel[data-phase="decision"] .battle-footer,.battle-panel.is-capture .battle-footer { display:none!important; }
.battle-decision { min-height:0!important;height:100%;box-sizing:border-box;grid-template-columns:minmax(0,1fr) 118px 118px!important;padding:7px 9px!important; }
.capture-panel { min-height:0!important;height:100%;box-sizing:border-box;padding:7px!important; }
.battle-panel.is-intro .battle-command-deck { opacity:0!important;transform:translateY(18px)!important;pointer-events:none!important; }

.battle-shell > .battle-utility-rail {
  position:absolute!important;
  z-index:16;
  right:16px!important;
  top:50%!important;
  display:grid!important;
  gap:5px;
  transform:translateY(-50%)!important;
  pointer-events:auto;
}
.battle-utility-rail button {
  position:relative;
  width:38px!important;
  height:38px!important;
  padding:0!important;
  display:grid!important;
  place-items:center;
  border:1px solid rgba(207,241,248,.2)!important;
  border-radius:12px!important;
  background:rgba(3,31,42,.88)!important;
  color:#eafaff!important;
  box-shadow:0 7px 18px rgba(0,17,24,.23),inset 0 1px rgba(255,255,255,.07)!important;
  backdrop-filter:blur(9px);
}
.battle-utility-rail button span,.battle-utility-rail button svg { width:18px!important;height:18px!important; }
.battle-utility-rail button b { position:absolute;right:calc(100% + 6px);padding:4px 6px;border-radius:7px;background:rgba(2,25,35,.94);color:#f1fbff;font-size:6px;opacity:0;pointer-events:none;white-space:nowrap; }
.battle-utility-rail button:hover b,.battle-utility-rail button:focus-visible b { opacity:1; }

.battle-skill-preview { max-width:calc(var(--battle-shell-width) - 32px)!important; }
body.is-battling .world-topbar,
body.is-battling #partyHud,
body.is-battling #playerProfileButton,
body.is-battling #playerStaminaHud,
body.is-battling #questWidget,
body.is-battling #worldMinimapShell,
body.is-battling #desktopDock,
body.is-battling #desktopUtilityRail,
body.is-battling #desktopMoreMenu,
body.is-battling .interaction-card {
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
body.is-battling .chat-panel.is-open,body.is-battling .side-panel.is-open { visibility:visible!important; }
body.is-battling .chat-panel.is-minimized { opacity:0!important;visibility:hidden!important;pointer-events:none!important; }
body.is-battling .chat-panel.is-open:not(.is-minimized) { opacity:1!important;visibility:visible!important;pointer-events:auto!important; }

@media (max-width:800px) {
  .game-screen .battle-panel {
    --battle-shell-width:calc(100vw - 8px);
    --battle-shell-height:calc(100dvh - 8px);
    --battle-shell-head:44px;
    --battle-shell-command:134px;
    --battle-shell-gap:4px;
    --battle-shell-pad:4px;
    --battle-slot:48px;
    --battle-item-slot:34px;
  }
  .battle-shell { left:4px;top:4px;min-width:0;min-height:420px;transform:none;border-radius:20px; }
  .battle-shell > .battle-status { left:auto!important;top:auto!important;width:100%!important;height:44px;padding:4px 6px!important;border-radius:14px!important; }
  .battle-status > span > small { max-width:38vw!important;font-size:5px!important; }
  .battle-status > span > strong { max-width:38vw!important;font-size:9px!important; }
  .battle-controls { gap:2px!important; }
  .battle-controls button { min-width:31px!important;min-height:31px!important;padding:0 5px!important;font-size:0!important; }
  .battle-controls button > b { display:none!important; }
  .battle-controls #battleHelp { display:grid!important;font-size:11px!important; }
  .battle-shell > .battle-stage { top:auto!important;bottom:auto!important;border-radius:15px!important; }
  .battle-turn-chip { top:8px!important;min-height:26px!important;padding:3px 7px!important; }
  .battle-turn-chip small { font-size:5px!important; }.battle-turn-chip b { font-size:6px!important; }
  html[data-game-theme] .game-screen .battle-health > article,body[data-ui-theme] .game-screen .battle-health > article { width:47%!important;padding:6px 7px!important;border-radius:11px!important; }
  .battle-health > .enemy-health { right:6px!important;top:45px!important; }
  .battle-health > .ally-health { left:6px!important;bottom:6px!important; }
  .battle-health > article > span b { font-size:8px!important; }.battle-health > article > span small { font-size:6px!important; }
  .battle-health .battle-stamina { display:flex!important;margin-top:3px!important; }
  .battle-health .battle-statuses { margin-top:3px!important;max-height:21px; }
  .battle-health .battle-status-chip { flex:0 0 auto;min-width:22px!important;padding:2px 3px!important; }
  .battle-health .battle-status-chip svg { width:11px!important;height:11px!important; }
  .battle-shell > .battle-team-strip,.battle-shell > .battle-target-strip { top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap) + 39px)!important;width:58%!important; }
  .battle-shell > .battle-command-deck {
    left:auto!important;
    bottom:auto!important;
    width:100%!important;
    min-height:0!important;
    padding:7px 8px 4px!important;
    grid-template-columns:44px 100px 72px!important;
    grid-template-rows:100px minmax(18px,1fr)!important;
    gap:5px!important;
    border-radius:15px!important;
    overflow:visible!important;
  }
  .battle-command-deck .battle-basic { width:44px!important;height:48px!important;min-width:44px!important;min-height:48px!important;align-self:start; }
  .battle-basic > span:first-child { width:36px!important;height:38px!important; }
  .battle-command-deck .battle-skills { grid-template-columns:repeat(2,48px)!important;grid-template-rows:repeat(2,48px)!important;gap:4px!important;align-self:start; }
  .battle-skills > button { width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important; }
  .battle-skills > button > .skill-icon { width:40px!important;height:40px!important; }
  .battle-command-deck .battle-quick-items { grid-template-columns:repeat(2,34px)!important;grid-template-rows:repeat(2,48px)!important;gap:4px!important;align-self:start; }
  .battle-quick-item { width:34px!important;height:48px!important;min-width:34px!important;min-height:48px!important; }
  .battle-quick-item > span { width:28px!important;height:31px!important; }
  .battle-command-deck .battle-footer { grid-row:2!important;width:100%!important;padding:1px 4px!important; }
  .battle-footer > p { font-size:5.5px!important; }
  .battle-command-deck .battle-decision,.battle-command-deck .capture-panel { height:100%!important;width:100%!important; }
  .battle-decision { grid-template-columns:1fr 1fr!important;grid-template-rows:auto 40px!important;padding:6px!important; }
  .battle-decision > span { grid-column:1/-1!important; }
  .battle-decision button { min-height:38px!important; }
  .battle-shell > .battle-utility-rail { right:7px!important;top:50%!important;gap:4px!important; }
  .battle-utility-rail button { width:36px!important;height:36px!important;border-radius:11px!important; }
  .battle-utility-rail button b { display:none!important; }
  .battle-skill-preview { left:50%!important;bottom:calc(100% + 7px)!important;width:calc(var(--battle-shell-width) - 18px)!important;max-width:none!important;transform:translate(-50%,7px) scale(.98)!important; }
  .battle-skill-preview.is-open { transform:translate(-50%,0) scale(1)!important; }
  .battle-panel[data-phase="decision"] .battle-command-deck,.battle-panel.is-capture .battle-command-deck { grid-template-columns:1fr!important;grid-template-rows:1fr!important;padding:6px!important; }
  .battle-panel.is-capture .battle-stage,.battle-panel.is-capture .battle-health { bottom:auto!important; }
}

@media (max-width:430px) {
  .battle-status > span > small { max-width:34vw!important; }.battle-status > span > strong { max-width:34vw!important; }
  .battle-health .battle-stamina.battle-energy { display:flex!important; }
}

@media (max-height:650px) and (max-width:900px) and (orientation:landscape) {
  .game-screen .battle-panel {
    --battle-shell-width:calc(100vw - 8px);
    --battle-shell-height:calc(100dvh - 8px);
    --battle-shell-head:40px;
    --battle-shell-command:68px;
    --battle-shell-gap:4px;
    --battle-shell-pad:4px;
    --battle-slot:44px;
    --battle-item-slot:34px;
  }
  .battle-shell { left:4px;top:4px;min-width:0;min-height:300px;transform:none;border-radius:17px; }
  .battle-shell > .battle-status { height:40px!important; }
  .battle-shell > .battle-command-deck { grid-template-columns:40px auto auto!important;grid-template-rows:52px!important;padding:7px!important;gap:5px!important; }
  .battle-command-deck .battle-basic { display:grid!important;width:40px!important;height:44px!important;min-width:40px!important;min-height:44px!important; }
  .battle-basic > span:first-child { width:33px!important;height:35px!important; }
  .battle-command-deck .battle-skills { grid-template-columns:repeat(4,44px)!important;grid-template-rows:44px!important;gap:4px!important; }
  .battle-skills > button { width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important; }
  .battle-skills > button > .skill-icon { width:36px!important;height:36px!important; }
  .battle-command-deck .battle-quick-items { grid-template-columns:repeat(4,34px)!important;grid-template-rows:44px!important;gap:3px!important; }
  .battle-quick-item { width:34px!important;height:44px!important;min-width:34px!important;min-height:44px!important; }
  .battle-quick-item > span { width:28px!important;height:30px!important; }
  .battle-command-deck .battle-footer { display:none!important; }
  .battle-health > .enemy-health { top:38px!important; }.battle-health > .ally-health { bottom:5px!important; }
  .battle-shell > .battle-utility-rail { right:6px!important; }.battle-utility-rail button { width:32px!important;height:32px!important; }
  .battle-panel[data-phase="decision"] .battle-command-deck,.battle-panel.is-capture .battle-command-deck { grid-template-columns:1fr!important;grid-template-rows:1fr!important; }
  .battle-decision { grid-template-columns:minmax(0,1fr) 100px 100px!important;grid-template-rows:1fr!important; }
  .battle-decision > span { grid-column:auto!important; }
}

@media (prefers-reduced-motion:reduce) {
  .battle-shell,.battle-shell > .battle-command-deck { transition:none!important; }
}

/* v2.9.4 — themed battle workspace, six-slot roster and live world HUD */
.game-screen .battle-panel {
  --battle-shell-width:min(1480px,calc(100vw - 40px));
  --battle-shell-height:min(940px,calc(100dvh - 24px));
  pointer-events:none!important;
}
.game-screen .battle-panel::before { pointer-events:none!important;backdrop-filter:saturate(.9) brightness(.96)!important; }
html[data-game-theme="dark"] .game-screen .battle-panel::before { background:rgba(0,17,25,.22)!important; }
html[data-game-theme="light"] .game-screen .battle-panel::before { background:rgba(30,73,91,.08)!important; }

.battle-shell {
  --battle-ui-surface:rgba(5,31,43,.96);
  --battle-ui-surface-soft:rgba(9,45,57,.93);
  --battle-ui-card:rgba(8,43,54,.94);
  --battle-ui-card-hover:rgba(15,61,75,.97);
  --battle-ui-border:rgba(173,224,238,.26);
  --battle-ui-border-strong:rgba(191,234,245,.48);
  --battle-ui-text:#effbff;
  --battle-ui-muted:#9dbbc8;
  --battle-ui-accent:#42bdf4;
  --battle-ui-shadow:rgba(0,15,23,.42);
  border-color:var(--battle-ui-border-strong)!important;
  background:color-mix(in srgb,var(--battle-ui-surface) 32%,transparent)!important;
  box-shadow:0 30px 90px var(--battle-ui-shadow),0 0 0 1px rgba(255,255,255,.06),inset 0 1px rgba(255,255,255,.16)!important;
  color:var(--battle-ui-text);
}
html[data-game-theme="light"] .battle-shell {
  --battle-ui-surface:rgba(250,253,255,.98);
  --battle-ui-surface-soft:rgba(239,247,251,.97);
  --battle-ui-card:rgba(255,255,255,.96);
  --battle-ui-card-hover:#edf7fb;
  --battle-ui-border:#c6dce7;
  --battle-ui-border-strong:#afcedc;
  --battle-ui-text:#173d53;
  --battle-ui-muted:#617f91;
  --battle-ui-accent:#138bd0;
  --battle-ui-shadow:rgba(26,67,84,.24);
  background:rgba(242,249,252,.32)!important;
}
.battle-shell > .battle-status,
.battle-shell > .battle-command-deck,
.battle-roster-panel,
.battle-tactics {
  border-color:var(--battle-ui-border)!important;
  background:linear-gradient(145deg,var(--battle-ui-surface),var(--battle-ui-surface-soft))!important;
  color:var(--battle-ui-text)!important;
  box-shadow:0 10px 28px var(--battle-ui-shadow),inset 0 1px rgba(255,255,255,.12)!important;
}
.battle-status > span > strong,.battle-status > span > small,.battle-status > span > small b { color:var(--battle-ui-text)!important; }
.battle-status > span > small { color:var(--battle-ui-accent)!important; }
.battle-controls button {
  border-color:var(--battle-ui-border)!important;
  background:var(--battle-ui-card)!important;
  color:var(--battle-ui-text)!important;
  box-shadow:none!important;
}
.battle-controls button:hover,.battle-controls button:focus-visible,.battle-controls button.is-active { border-color:var(--battle-ui-accent)!important;background:color-mix(in srgb,var(--battle-ui-accent) 14%,var(--battle-ui-card))!important; }
.battle-controls :is(#battleTacticsToggle,#autoBattle,#pauseBattle)[hidden] { display:none!important; }
.battle-shell > .battle-stage { border-color:var(--battle-ui-border-strong)!important; }
html[data-game-theme="light"] .battle-stage::after { background:radial-gradient(circle at 50% 48%,transparent 0 52%,rgba(22,68,82,.06) 82%,rgba(18,51,65,.14))!important; }

html[data-game-theme] .game-screen .battle-health > article,
body[data-ui-theme] .game-screen .battle-health > article {
  border-color:var(--battle-ui-border)!important;
  background:color-mix(in srgb,var(--battle-ui-card) 94%,transparent)!important;
  color:var(--battle-ui-text)!important;
  box-shadow:0 10px 25px var(--battle-ui-shadow),inset 0 1px rgba(255,255,255,.12)!important;
}
.battle-health > article > span b,.battle-health > article > span small,.battle-health .battle-stamina b,.battle-health .battle-stamina small { color:var(--battle-ui-text)!important; }
.battle-command-deck :is(.battle-basic,.battle-skills > button,.battle-quick-item),
.battle-tactic-modes button {
  border-color:var(--battle-ui-border)!important;
  background:var(--battle-ui-card)!important;
  color:var(--battle-ui-text)!important;
  box-shadow:0 5px 14px color-mix(in srgb,var(--battle-ui-shadow) 72%,transparent),inset 0 1px rgba(255,255,255,.12)!important;
}
.battle-command-deck :is(.battle-basic,.battle-skills > button,.battle-quick-item):hover,
.battle-command-deck :is(.battle-basic,.battle-skills > button,.battle-quick-item):focus-visible,
.battle-tactic-modes button.is-active {
  border-color:var(--battle-ui-accent)!important;
  background:color-mix(in srgb,var(--battle-ui-accent) 13%,var(--battle-ui-card))!important;
}
.battle-command-deck .battle-footer { background:color-mix(in srgb,var(--battle-ui-card) 62%,transparent)!important;color:var(--battle-ui-muted)!important; }
.battle-footer > p,#battleHint { color:var(--battle-ui-muted)!important; }
.battle-skill-preview { border-color:var(--battle-ui-border)!important;background:var(--battle-ui-surface)!important;color:var(--battle-ui-text)!important; }
.battle-skill-preview :is(b,p,em,small) { color:inherit!important; }
.battle-decision,.capture-panel { border-color:var(--battle-ui-border)!important;background:var(--battle-ui-surface)!important;color:var(--battle-ui-text)!important; }

.battle-roster-panel {
  position:absolute;
  z-index:18;
  left:18px;
  top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap) + 18px);
  bottom:calc(var(--battle-shell-pad) + var(--battle-shell-command) + var(--battle-shell-gap) + 18px);
  width:132px;
  min-height:0;
  box-sizing:border-box;
  padding:9px;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:7px;
  overflow:hidden;
  border:1px solid var(--battle-ui-border);
  border-radius:18px;
  pointer-events:auto;
  backdrop-filter:blur(14px);
}
.battle-roster-panel > header { display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0; }
.battle-roster-panel > header span { display:grid;min-width:0; }
.battle-roster-panel > header small { color:var(--battle-ui-accent);font-size:6px;font-weight:950;letter-spacing:.12em; }
.battle-roster-panel > header b { overflow:hidden;color:var(--battle-ui-text);font-size:9px;text-overflow:ellipsis;white-space:nowrap; }
.battle-roster-panel > header em { flex:0 0 auto;padding:3px 5px;border:1px solid color-mix(in srgb,var(--battle-ui-accent) 42%,var(--battle-ui-border));border-radius:7px;background:color-mix(in srgb,var(--battle-ui-accent) 10%,transparent);color:var(--battle-ui-accent);font-size:6px;font-style:normal;font-weight:950; }
.battle-roster-panel > header em.is-cooling { border-color:#edb44c;color:#d99b28; }
.battle-roster-panel > p { margin:0;color:var(--battle-ui-muted);font-size:5.5px;line-height:1.35;text-align:center; }
.battle-roster { min-height:0;display:grid;grid-template-rows:repeat(6,minmax(0,1fr));gap:5px; }
.battle-roster-slot {
  position:relative;
  min-width:0;
  min-height:0;
  padding:4px 5px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  grid-template-rows:1fr;
  align-items:center;
  gap:5px;
  overflow:hidden;
  border:1px solid var(--battle-ui-border);
  border-radius:12px;
  background:var(--battle-ui-card);
  color:var(--battle-ui-text);
  cursor:pointer;
  transition:transform .16s,border-color .16s,background .16s,opacity .16s;
}
.battle-roster-slot:hover:not(:disabled),.battle-roster-slot:focus-visible { z-index:2;transform:translateX(2px);border-color:var(--battle-ui-accent);background:var(--battle-ui-card-hover); }
.battle-roster-slot.is-active { border-color:#5bd889;background:color-mix(in srgb,#5bd889 12%,var(--battle-ui-card));box-shadow:inset 3px 0 #5bd889; }
.battle-roster-slot.is-ready:not(.is-active) { border-color:color-mix(in srgb,var(--battle-ui-accent) 58%,var(--battle-ui-border)); }
.battle-roster-slot.is-ko { filter:grayscale(.8);opacity:.48; }
.battle-roster-slot.is-empty { opacity:.42;cursor:default; }
.battle-roster-portrait,.battle-roster-slot.is-empty > i { grid-column:1;grid-row:1;position:relative;width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:color-mix(in srgb,var(--battle-ui-accent) 8%,var(--battle-ui-surface-soft));overflow:hidden; }
.battle-roster-portrait img { width:100%;height:100%;object-fit:contain; }
.battle-roster-slot.is-empty > i::before { content:'+';color:var(--battle-ui-muted);font-size:17px;font-style:normal; }
.battle-roster-slot > kbd { position:absolute;z-index:3;left:2px;top:2px;min-width:15px;height:15px;padding:0 2px;display:grid;place-items:center;border:1px solid var(--battle-ui-border);border-radius:5px;background:var(--battle-ui-surface);color:var(--battle-ui-muted);font:900 5px system-ui; }
.battle-roster-slot > span { min-width:0;display:grid;gap:2px; }
.battle-roster-slot > span b,.battle-roster-slot > span small { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.battle-roster-slot > span b { color:var(--battle-ui-text);font-size:7px; }
.battle-roster-slot > span small { color:var(--battle-ui-muted);font-size:5px; }
.battle-roster-hp,.battle-roster-energy { position:relative;height:3px;display:block;overflow:hidden;border-radius:3px;background:color-mix(in srgb,var(--battle-ui-muted) 20%,transparent); }
.battle-roster-hp em,.battle-roster-energy em { position:absolute;inset:0 auto 0 0;border-radius:inherit;background:linear-gradient(90deg,#43c87c,#7fe394); }
.battle-roster-energy em { background:linear-gradient(90deg,#2e9ce8,#62d8ff); }
.battle-roster-slot > strong { position:absolute;right:4px;top:4px;padding:2px 3px;border-radius:4px;background:var(--battle-ui-surface);color:var(--battle-ui-muted);font-size:4.5px;letter-spacing:.05em; }
.battle-roster-slot.is-active > strong { background:#36b86c;color:#fff; }

.battle-tactics {
  position:absolute;
  z-index:35;
  right:64px;
  top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap) + 18px);
  width:min(316px,calc(100% - 156px));
  box-sizing:border-box;
  padding:12px;
  display:grid;
  gap:10px;
  overflow:auto;
  border:1px solid var(--battle-ui-border);
  border-radius:18px;
  opacity:0;
  visibility:hidden;
  transform:translateY(-8px) scale(.98);
  transform-origin:top right;
  pointer-events:none;
  transition:opacity .18s,transform .18s,visibility .18s;
  backdrop-filter:blur(18px);
}
.battle-tactics.is-open { opacity:1;visibility:visible;transform:none;pointer-events:auto; }
.battle-tactics > header { display:flex;align-items:center;justify-content:space-between;gap:10px; }
.battle-tactics > header span { display:grid; }
.battle-tactics > header small { color:var(--battle-ui-accent);font-size:6px;font-weight:950;letter-spacing:.12em; }
.battle-tactics > header b { color:var(--battle-ui-text);font-size:13px; }
.battle-tactics > header button { width:28px;height:28px;padding:0;display:grid;place-items:center;border:1px solid var(--battle-ui-border);border-radius:9px;background:var(--battle-ui-card);color:var(--battle-ui-text);font-size:17px; }
.battle-tactic-modes { display:grid;grid-template-columns:repeat(3,1fr);gap:6px; }
.battle-tactic-modes button { min-width:0;padding:8px 5px;display:grid;justify-items:center;gap:5px;border-radius:12px; }
.battle-tactic-modes button > svg { width:20px;height:20px;color:var(--battle-ui-accent); }
.battle-tactic-modes button > span { min-width:0;display:grid;gap:2px;text-align:center; }
.battle-tactic-modes button b { color:var(--battle-ui-text);font-size:7px; }
.battle-tactic-modes button small { color:var(--battle-ui-muted);font-size:5px;line-height:1.25; }
.battle-tactic-rules { display:grid;gap:5px; }
.battle-tactic-rules label { padding:7px 8px;display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:8px;border:1px solid var(--battle-ui-border);border-radius:11px;background:var(--battle-ui-card);cursor:pointer; }
.battle-tactic-rules input { width:30px;height:17px;margin:0;appearance:none;border:1px solid var(--battle-ui-border);border-radius:12px;background:var(--battle-ui-surface-soft);transition:background .15s; }
.battle-tactic-rules input::after { content:'';display:block;width:13px;height:13px;margin:1px;border-radius:50%;background:var(--battle-ui-muted);transition:transform .15s,background .15s; }
.battle-tactic-rules input:checked { border-color:var(--battle-ui-accent);background:color-mix(in srgb,var(--battle-ui-accent) 42%,var(--battle-ui-surface)); }
.battle-tactic-rules input:checked::after { transform:translateX(13px);background:#fff; }
.battle-tactic-rules span { display:grid;gap:2px; }
.battle-tactic-rules b { color:var(--battle-ui-text);font-size:7px; }
.battle-tactic-rules small { color:var(--battle-ui-muted);font-size:5.5px; }
.battle-tactics > footer { padding-top:8px;border-top:1px solid var(--battle-ui-border);color:var(--battle-ui-muted);font-size:5.5px;line-height:1.4;text-align:center; }

.battle-shell > .battle-utility-rail { right:14px!important; }
.battle-utility-rail button { border-color:var(--battle-ui-border)!important;background:var(--battle-ui-surface)!important;color:var(--battle-ui-text)!important; }
.battle-utility-rail button:hover,.battle-utility-rail button:focus-visible { border-color:var(--battle-ui-accent)!important;background:var(--battle-ui-card-hover)!important; }
.battle-utility-rail button b { background:var(--battle-ui-surface)!important;color:var(--battle-ui-text)!important; }

/* The world remains alive; application windows intentionally rise above combat. */
body.is-battling :is(.world-topbar,#partyHud,#playerProfileButton,#playerStaminaHud,#questWidget,#worldMinimapShell,#desktopDock,#desktopUtilityRail,#desktopMoreMenu,.mobile-dock) {
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
body.is-battling .chat-panel.is-minimized { opacity:1!important;visibility:visible!important;pointer-events:auto!important; }
body.is-battling .chat-panel.is-open { z-index:242!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important; }
body.is-battling .side-panel.is-open { z-index:243!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important; }

@media (max-width:800px) {
  .game-screen .battle-panel {
    --battle-shell-width:calc(100vw - 8px);
    --battle-shell-height:calc(100dvh - 78px - env(safe-area-inset-bottom));
  }
  .battle-shell { top:4px!important;min-height:350px; }
  .battle-roster-panel {
    left:6px;
    top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap) + 48px);
    bottom:calc(var(--battle-shell-pad) + var(--battle-shell-command) + var(--battle-shell-gap) + 8px);
    width:44px;
    padding:4px;
    grid-template-rows:minmax(0,1fr);
    border-radius:13px;
  }
  .battle-roster-panel > header,.battle-roster-panel > p { display:none; }
  .battle-roster { gap:3px; }
  .battle-roster-slot { padding:2px;display:grid;grid-template-columns:1fr;border-radius:9px; }
  .battle-roster-portrait,.battle-roster-slot.is-empty > i { width:32px;height:32px;justify-self:center;border-radius:8px; }
  .battle-roster-slot > span { position:absolute;left:3px;right:3px;bottom:2px;display:block; }
  .battle-roster-slot > span b,.battle-roster-slot > span small,.battle-roster-slot > span .battle-roster-energy { display:none; }
  .battle-roster-slot > span .battle-roster-hp { height:3px; }
  .battle-roster-slot > kbd,.battle-roster-slot > strong { display:none; }
  .battle-health > .ally-health { left:48px!important; }
  .battle-tactics { right:6px;top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap) + 6px);width:calc(100% - 12px);max-height:calc(100% - var(--battle-shell-head) - var(--battle-shell-command) - 24px);padding:9px;border-radius:15px; }
  .battle-tactic-modes button small { display:none; }
  .battle-tactic-rules label { padding:6px 7px; }
  .battle-shell > .battle-utility-rail { right:5px!important; }
  body.is-battling .mobile-dock { z-index:23!important; }
  body.is-battling .chat-panel.is-open,body.is-battling .side-panel.is-open { z-index:243!important; }
}

@media (max-height:650px) and (max-width:900px) and (orientation:landscape) {
  .game-screen .battle-panel { --battle-shell-height:calc(100dvh - 8px); }
  .battle-roster-panel { top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap) + 30px);bottom:calc(var(--battle-shell-pad) + var(--battle-shell-command) + var(--battle-shell-gap) + 4px);width:38px;padding:3px; }
  .battle-roster-panel > header,.battle-roster-panel > p { display:none; }
  .battle-roster { gap:2px; }
  .battle-roster-slot { padding:1px;display:grid;grid-template-columns:1fr;border-radius:8px; }
  .battle-roster-portrait,.battle-roster-slot.is-empty > i { width:28px;height:28px; }
  .battle-roster-slot > span { position:absolute;left:2px;right:2px;bottom:1px;display:block; }
  .battle-roster-slot > span b,.battle-roster-slot > span small,.battle-roster-slot > span .battle-roster-energy { display:none; }
  .battle-roster-slot > span .battle-roster-hp { height:2px; }
  .battle-roster-slot > kbd,.battle-roster-slot > strong { display:none; }
  .battle-health > .ally-health { left:42px!important; }
  .battle-tactics { top:46px;right:5px;width:min(310px,56vw);max-height:calc(100% - 52px); }
  .battle-tactic-modes button { padding:5px 3px; }.battle-tactic-rules { gap:3px; }.battle-tactic-rules label { padding:4px 6px; }
}

@media (prefers-reduced-motion:reduce) {
  .battle-roster-slot,.battle-tactics,.battle-tactic-rules input,.battle-tactic-rules input::after { transition:none!important; }
}

/* v2.9.5 — compact responsive battle room, collision-safe messenger and crisp combat feedback */
@property --cooldown-sweep {
  syntax:'<angle>';
  inherits:true;
  initial-value:0deg;
}

.game-screen .battle-panel {
  --battle-shell-width:min(1180px,78vw,calc(100vw - 48px));
  --battle-shell-height:min(760px,82dvh,calc(100dvh - 132px));
  --battle-shell-head:48px;
  --battle-shell-command:88px;
  --battle-shell-gap:6px;
  --battle-shell-pad:7px;
  --battle-slot:50px;
  --battle-item-slot:38px;
}
.game-screen .battle-panel::before {
  background:transparent!important;
  backdrop-filter:none!important;
  filter:none!important;
}
html[data-game-theme="light"] .game-screen .battle-panel::before,
html[data-game-theme="dark"] .game-screen .battle-panel::before { background:transparent!important; }

.battle-shell {
  top:calc(50% - 20px)!important;
  min-width:720px;
  min-height:500px;
  border-radius:23px!important;
  background:rgba(2,25,34,.075)!important;
  box-shadow:0 24px 68px rgba(0,16,24,.32),0 0 0 1px rgba(255,255,255,.06),inset 0 1px rgba(255,255,255,.14)!important;
  transition:left .22s ease,right .22s ease,width .22s ease,opacity .18s ease,transform .22s ease;
}
html[data-game-theme="light"] .battle-shell {
  --battle-ui-surface:rgba(250,253,255,.94);
  --battle-ui-surface-soft:rgba(237,247,251,.92);
  --battle-ui-card:rgba(255,255,255,.93);
  --battle-ui-card-hover:rgba(237,248,252,.98);
  background:rgba(232,247,251,.075)!important;
  box-shadow:0 22px 62px rgba(23,63,81,.20),0 0 0 1px rgba(255,255,255,.5),inset 0 1px rgba(255,255,255,.52)!important;
}
.battle-shell::after {
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)!important;
}

.battle-shell > .battle-status {
  padding:5px 8px!important;
  border-radius:15px!important;
  box-shadow:0 6px 17px color-mix(in srgb,var(--battle-ui-shadow) 66%,transparent),inset 0 1px rgba(255,255,255,.12)!important;
}
.battle-status > span > strong { max-width:360px;font-size:12px!important; }
.battle-controls { gap:4px!important; }
.battle-controls button { min-height:32px!important;padding:0 9px!important;border-radius:10px!important;font-size:7px!important; }
.battle-controls button > i,.battle-controls button > svg { width:15px!important;height:15px!important; }

.battle-shell > .battle-stage {
  border-radius:18px!important;
  box-shadow:0 10px 29px rgba(0,20,27,.18),inset 0 1px rgba(255,255,255,.2)!important;
}
.battle-stage::before {
  background:transparent!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),inset 0 -24px 50px rgba(2,25,30,.035)!important;
}
.battle-stage::after {
  background:radial-gradient(circle at 50% 48%,transparent 0 66%,rgba(2,27,34,.035) 88%,rgba(2,22,29,.095))!important;
}
html[data-game-theme="light"] .battle-stage::after {
  background:radial-gradient(circle at 50% 48%,transparent 0 72%,rgba(18,54,67,.045) 100%)!important;
}

/* Six server-backed team slots are visible without stealing a vertical strip from the arena. */
.battle-roster-panel {
  left:17px!important;
  top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap) + 10px)!important;
  right:auto!important;
  bottom:auto!important;
  width:min(500px,calc(100% - 360px))!important;
  height:56px!important;
  min-height:56px!important;
  padding:5px 6px!important;
  grid-template-columns:88px minmax(0,1fr)!important;
  grid-template-rows:1fr!important;
  align-items:center;
  gap:6px!important;
  border-radius:15px!important;
  backdrop-filter:blur(10px) saturate(1.05)!important;
}
.battle-roster-panel > header { height:100%;padding-right:6px;border-right:1px solid var(--battle-ui-border); }
.battle-roster-panel > header span { gap:2px; }
.battle-roster-panel > header small { font-size:5.5px; }
.battle-roster-panel > header b { font-size:7px; }
.battle-roster-panel > header em { padding:3px 4px;font-size:5px; }
.battle-roster-panel > p { display:none!important; }
.battle-roster {
  height:100%;
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  grid-template-rows:1fr!important;
  gap:4px!important;
}
.battle-roster-slot {
  height:44px;
  min-height:44px;
  padding:2px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  place-items:center;
  border-radius:10px!important;
}
.battle-roster-slot:hover:not(:disabled),.battle-roster-slot:focus-visible { transform:translateY(-2px)!important; }
.battle-roster-slot.is-active { box-shadow:inset 0 -3px #5bd889!important; }
.battle-roster-portrait,.battle-roster-slot.is-empty > i {
  width:38px!important;
  height:38px!important;
  border-radius:9px!important;
}
.battle-roster-slot > span { position:absolute;left:3px;right:3px;bottom:2px;display:grid!important;gap:1px!important; }
.battle-roster-slot > span > b,.battle-roster-slot > span > small { display:none!important; }
.battle-roster-hp,.battle-roster-energy { height:2px!important; }
.battle-roster-slot > kbd { left:1px!important;top:1px!important;min-width:14px!important;height:14px!important;font-size:4.5px!important; }
.battle-roster-slot > strong { display:none!important; }

.battle-health > .enemy-health { right:12px!important;top:12px!important; }
.battle-health > .ally-health { left:12px!important;bottom:10px!important; }
html[data-game-theme] .game-screen .battle-health > article,
body[data-ui-theme] .game-screen .battle-health > article {
  width:clamp(190px,22%,238px)!important;
  padding:7px 8px!important;
  border-radius:13px!important;
  backdrop-filter:blur(8px) saturate(1.05)!important;
}
.battle-health .battle-status-chip { padding:1px 3px!important; }
.battle-health .battle-status-chip svg { width:12px!important;height:12px!important; }

/* The entire command surface is a compact floating bar inside the battle shell. */
.battle-shell > .battle-command-deck {
  width:min(720px,calc(100% - 32px))!important;
  height:100%!important;
  justify-self:center!important;
  padding:6px 9px 4px!important;
  grid-template-columns:var(--battle-slot) auto auto!important;
  grid-template-rows:52px minmax(13px,1fr)!important;
  gap:3px 7px!important;
  border-radius:17px!important;
  background:linear-gradient(145deg,var(--battle-ui-surface),var(--battle-ui-surface-soft))!important;
  box-shadow:0 8px 22px color-mix(in srgb,var(--battle-ui-shadow) 72%,transparent),inset 0 1px rgba(255,255,255,.13)!important;
  backdrop-filter:blur(12px) saturate(1.05)!important;
}
.battle-basic,.battle-skills > button {
  width:var(--battle-slot)!important;
  height:var(--battle-slot)!important;
  min-width:var(--battle-slot)!important;
  min-height:var(--battle-slot)!important;
  border-radius:12px!important;
}
.battle-basic > span:first-child,.battle-skills > button > .skill-icon { width:42px!important;height:42px!important;border-radius:9px!important; }
.battle-skills { grid-template-columns:repeat(4,var(--battle-slot))!important;grid-template-rows:var(--battle-slot)!important;gap:5px!important; }
.battle-quick-items { grid-template-columns:repeat(4,var(--battle-item-slot))!important;grid-template-rows:var(--battle-slot)!important;gap:4px!important; }
.battle-quick-item {
  width:var(--battle-item-slot)!important;
  height:var(--battle-slot)!important;
  min-width:var(--battle-item-slot)!important;
  min-height:var(--battle-slot)!important;
  border-radius:11px!important;
}
.battle-quick-item > span { width:31px!important;height:34px!important;padding:0!important;background:transparent!important; }
.battle-quick-item .battle-item-icon { width:100%!important;height:100%!important;overflow:visible;filter:drop-shadow(0 3px 3px rgba(0,20,31,.24)); }
.battle-quick-item > em { padding:2px!important;font-size:4px!important; }
.battle-command-deck .battle-footer { padding:0 7px!important;background:transparent!important; }
.battle-footer > p { font-size:6.5px!important; }
.battle-command-deck .battle-decision,.battle-command-deck .capture-panel { width:100%!important; }
.battle-panel[data-phase="decision"] .battle-command-deck,.battle-panel.is-capture .battle-command-deck { width:min(720px,calc(100% - 32px))!important; }

.skill-cooldown {
  background:conic-gradient(from 0deg,rgba(1,14,22,.84) 0 var(--cooldown-sweep),rgba(4,25,34,.13) var(--cooldown-sweep) 360deg)!important;
  transition:--cooldown-sweep .12s linear,opacity .14s ease!important;
}
.skill-cooldown > b { min-width:24px;height:24px;font-size:10px; }
.battle-action-slot.is-just-ready,.battle-quick-item.is-just-ready { animation:battle-control-ready .72s cubic-bezier(.2,.75,.25,1); }
.battle-action-slot.is-just-ready::after,.battle-quick-item.is-just-ready::before {
  content:'';
  position:absolute;
  z-index:10;
  inset:-4px;
  border:2px solid #7ff0b4;
  border-radius:inherit;
  pointer-events:none;
  animation:battle-ready-ring .72s ease-out both;
}
.battle-skills > button.skill-kind-ultimate:not(.is-cooling) { box-shadow:inset 0 0 14px rgba(236,191,79,.08),0 0 0 1px rgba(236,191,79,.08)!important; }
.battle-skills > button.is-queued,.battle-basic.is-queued { animation:battle-command-queued .74s ease-in-out infinite alternate!important; }

.battle-shell > .battle-utility-rail { right:10px!important;gap:4px!important; }
.battle-utility-rail button { width:32px!important;height:32px!important;border-radius:10px!important; }
.battle-utility-rail button span,.battle-utility-rail button svg { width:15px!important;height:15px!important; }

/* A minimized chat stays below the medium battle window. Large desktops can show full windows beside combat. */
@supports selector(body:has(*)) {
  @media (min-width:1900px) {
    body.is-battling:has(.chat-panel.is-open:not(.is-minimized)) .battle-shell {
      left:auto!important;
      right:18px!important;
      width:min(1040px,calc(100vw - 1000px))!important;
      transform:translateY(-50%)!important;
    }
    body.is-battling:has(.side-panel.is-open) .battle-shell {
      left:18px!important;
      right:auto!important;
      width:min(1040px,calc(100vw - 1000px))!important;
      transform:translateY(-50%)!important;
    }
  }
  @media (max-width:1899px) {
    body.is-battling:has(.chat-panel.is-open:not(.is-minimized)) .battle-shell,
    body.is-battling:has(.side-panel.is-open) .battle-shell {
      opacity:.08!important;
      pointer-events:none!important;
    }
  }
}

@media (min-width:801px) and (max-width:1180px) {
  .game-screen .battle-panel {
    --battle-shell-width:min(940px,88vw,calc(100vw - 32px));
    --battle-shell-height:min(680px,80dvh,calc(100dvh - 108px));
  }
  .battle-shell { min-width:700px;min-height:480px; }
  .battle-roster-panel { width:min(430px,calc(100% - 320px))!important;grid-template-columns:72px minmax(0,1fr)!important; }
  .battle-roster-panel > header b { display:none; }
  .battle-shell > .battle-command-deck { width:min(680px,calc(100% - 24px))!important; }
}

@media (max-width:800px) {
  .game-screen .battle-panel {
    --battle-shell-width:calc(100vw - 12px);
    --battle-shell-height:min(680px,calc(100dvh - 82px - env(safe-area-inset-bottom)));
    --battle-shell-head:44px;
    --battle-shell-command:116px;
    --battle-shell-gap:4px;
    --battle-shell-pad:4px;
    --battle-slot:44px;
    --battle-item-slot:32px;
  }
  .battle-shell {
    left:50%!important;
    right:auto!important;
    top:calc(50% - 37px)!important;
    min-width:0!important;
    min-height:480px!important;
    transform:translate(-50%,-50%)!important;
    border-radius:18px!important;
  }
  .battle-shell > .battle-status { height:44px!important;padding:4px 5px!important;border-radius:12px!important; }
  .battle-status > span > small,.battle-status > span > strong { max-width:38vw!important; }
  .battle-status > span > strong { font-size:8px!important; }
  .battle-controls button { min-width:29px!important;min-height:29px!important;padding:0 4px!important; }
  .battle-controls button > b { display:none!important; }
  .battle-shell > .battle-stage { border-radius:14px!important; }

  .battle-roster-panel {
    left:8px!important;
    top:calc(var(--battle-shell-pad) + var(--battle-shell-head) + var(--battle-shell-gap) + 6px)!important;
    width:calc(100% - 16px)!important;
    height:48px!important;
    min-height:48px!important;
    padding:3px 4px!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    border-radius:12px!important;
  }
  .battle-roster-panel > header,.battle-roster-panel > p { display:none!important; }
  .battle-roster { grid-template-columns:repeat(6,minmax(0,1fr))!important;grid-template-rows:42px!important;gap:3px!important; }
  .battle-roster-slot { height:42px!important;min-height:42px!important;border-radius:9px!important; }
  .battle-roster-portrait,.battle-roster-slot.is-empty > i { width:36px!important;height:36px!important; }
  .battle-roster-slot > kbd { display:none!important; }
  .battle-health > .enemy-health { top:52px!important;right:5px!important; }
  .battle-health > .ally-health { left:5px!important;bottom:5px!important; }
  html[data-game-theme] .game-screen .battle-health > article,body[data-ui-theme] .game-screen .battle-health > article { width:48%!important;padding:5px 6px!important; }

  .battle-shell > .battle-command-deck {
    width:calc(100% - 10px)!important;
    padding:6px 6px 3px!important;
    grid-template-columns:40px 92px 68px!important;
    grid-template-rows:92px minmax(13px,1fr)!important;
    gap:3px 5px!important;
    border-radius:13px!important;
  }
  .battle-command-deck .battle-basic { width:40px!important;height:44px!important;min-width:40px!important;min-height:44px!important;align-self:start!important; }
  .battle-basic > span:first-child { width:34px!important;height:36px!important; }
  .battle-command-deck .battle-skills { grid-template-columns:repeat(2,44px)!important;grid-template-rows:repeat(2,44px)!important;gap:4px!important; }
  .battle-skills > button { width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important; }
  .battle-skills > button > .skill-icon { width:37px!important;height:37px!important; }
  .battle-command-deck .battle-quick-items { grid-template-columns:repeat(2,32px)!important;grid-template-rows:repeat(2,44px)!important;gap:4px!important; }
  .battle-quick-item { width:32px!important;height:44px!important;min-width:32px!important;min-height:44px!important; }
  .battle-quick-item > span { width:28px!important;height:31px!important; }
  .battle-footer > p { font-size:5.3px!important; }
  .battle-command-deck .battle-decision { grid-template-columns:1fr 1fr!important;grid-template-rows:auto 37px!important; }
  .battle-command-deck .battle-decision > span { grid-column:1/-1!important; }
  .battle-shell > .battle-utility-rail { display:none!important; }
  .battle-skill-preview { width:calc(var(--battle-shell-width) - 18px)!important; }
  body.is-battling .mobile-dock { z-index:23!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important; }
  body.is-battling .chat-panel.is-open,body.is-battling .side-panel.is-open { z-index:243!important; }
}

@media (max-width:430px) {
  .game-screen .battle-panel { --battle-shell-width:calc(100vw - 8px); }
  .battle-shell { min-height:450px!important; }
  .battle-roster-panel { left:6px!important;width:calc(100% - 12px)!important; }
  .battle-roster-portrait,.battle-roster-slot.is-empty > i { width:33px!important;height:33px!important; }
  .battle-status > span > small,.battle-status > span > strong { max-width:33vw!important; }
  .battle-health .battle-stamina { display:flex!important; }
}

@media (max-height:650px) and (max-width:900px) and (orientation:landscape) {
  .game-screen .battle-panel {
    --battle-shell-width:min(880px,calc(100vw - 10px));
    --battle-shell-height:calc(100dvh - 10px);
    --battle-shell-head:40px;
    --battle-shell-command:62px;
    --battle-slot:42px;
    --battle-item-slot:31px;
  }
  .battle-shell { left:50%!important;top:50%!important;min-height:300px!important;transform:translate(-50%,-50%)!important; }
  .battle-roster-panel { top:47px!important;left:7px!important;width:min(390px,calc(100% - 300px))!important;height:42px!important;min-height:42px!important;grid-template-columns:1fr!important; }
  .battle-roster-panel > header,.battle-roster-panel > p { display:none!important; }
  .battle-roster { grid-template-rows:36px!important; }
  .battle-roster-slot { height:36px!important;min-height:36px!important; }
  .battle-roster-portrait,.battle-roster-slot.is-empty > i { width:31px!important;height:31px!important; }
  .battle-health > .enemy-health { top:41px!important; }.battle-health > .ally-health { bottom:4px!important; }
  .battle-shell > .battle-command-deck { width:min(630px,calc(100% - 16px))!important;grid-template-columns:38px auto auto!important;grid-template-rows:46px!important;padding:5px 7px!important; }
  .battle-command-deck .battle-basic { width:38px!important;height:40px!important;min-width:38px!important;min-height:40px!important; }
  .battle-command-deck .battle-skills { grid-template-columns:repeat(4,42px)!important;grid-template-rows:42px!important; }
  .battle-skills > button { width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important; }
  .battle-command-deck .battle-quick-items { grid-template-columns:repeat(4,31px)!important;grid-template-rows:42px!important; }
  .battle-quick-item { width:31px!important;height:42px!important;min-width:31px!important;min-height:42px!important; }
  .battle-command-deck .battle-footer { display:none!important; }
  .battle-shell > .battle-utility-rail { display:none!important; }
}

@keyframes battle-control-ready {
  0% { transform:scale(.92);filter:brightness(1); }
  46% { transform:scale(1.08);filter:brightness(1.26) saturate(1.2); }
  100% { transform:scale(1);filter:brightness(1); }
}
@keyframes battle-ready-ring {
  0% { opacity:.95;transform:scale(.84); }
  100% { opacity:0;transform:scale(1.18); }
}
@keyframes battle-command-queued {
  from { box-shadow:0 0 0 1px rgba(92,225,255,.22),0 0 8px rgba(77,211,245,.1); }
  to { box-shadow:0 0 0 2px rgba(92,225,255,.38),0 0 18px rgba(77,211,245,.23); }
}

@media (prefers-reduced-motion:reduce) {
  .battle-shell,.skill-cooldown,.battle-action-slot.is-just-ready,.battle-quick-item.is-just-ready,
  .battle-action-slot.is-just-ready::after,.battle-quick-item.is-just-ready::before,
  .battle-skills > button.is-queued,.battle-basic.is-queued { animation:none!important;transition:none!important; }
}

/* v2.9.6 — complete compact battle-room redesign */
.game-screen .battle-panel {
  --battle-shell-width:min(1040px,72vw,calc(100vw - 180px));
  --battle-shell-height:min(650px,76dvh,calc(100dvh - 140px));
  --battle-control:#28a7e8;
  --battle-control-ready:#5bd889;
  --battle-ultimate:#e8b84d;
}
.game-screen .battle-panel::before { background:transparent!important;backdrop-filter:none!important; }

.game-screen .battle-panel .battle-shell {
  left:50%!important;
  right:auto!important;
  top:calc(50% - 18px)!important;
  width:var(--battle-shell-width)!important;
  height:var(--battle-shell-height)!important;
  min-width:760px!important;
  min-height:500px!important;
  padding:0!important;
  display:block!important;
  overflow:visible!important;
  transform:translate(-50%,-50%)!important;
  border:0!important;
  border-radius:22px!important;
  background:transparent!important;
  box-shadow:0 26px 70px rgba(0,18,27,.3)!important;
}
.game-screen .battle-panel .battle-shell::after { inset:0!important;border-radius:22px!important;box-shadow:0 0 0 1px rgba(227,249,255,.48),inset 0 0 0 2px rgba(255,255,255,.08)!important; }

.game-screen .battle-panel .battle-stage {
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  transform:none!important;
  border:1px solid rgba(218,245,252,.62)!important;
  border-radius:22px!important;
  background:transparent!important;
  box-shadow:0 18px 48px rgba(0,20,28,.23),inset 0 1px rgba(255,255,255,.3)!important;
  pointer-events:none;
}
.game-screen .battle-panel .battle-stage::before { box-shadow:inset 0 0 0 2px rgba(255,255,255,.08),inset 0 -32px 70px rgba(2,23,30,.035)!important; }
.game-screen .battle-panel .battle-stage::after { background:radial-gradient(circle at 50% 48%,transparent 0 72%,rgba(2,23,30,.065) 100%)!important; }
html[data-game-theme="light"] .game-screen .battle-panel .battle-stage::after { background:radial-gradient(circle at 50% 48%,transparent 0 78%,rgba(18,54,67,.04) 100%)!important; }

/* Title and controls are two small overlays, never a full-width white header. */
.game-screen .battle-stage > .battle-status {
  position:absolute!important;
  z-index:34!important;
  inset:9px 10px auto 10px!important;
  width:auto!important;
  min-width:0!important;
  min-height:0!important;
  height:38px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  transform:none!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  pointer-events:none!important;
}
.battle-stage > .battle-status > span {
  min-width:0;
  height:38px;
  padding:5px 10px;
  display:grid;
  align-content:center;
  border:1px solid var(--battle-ui-border);
  border-radius:13px;
  background:linear-gradient(145deg,var(--battle-ui-surface),var(--battle-ui-surface-soft));
  box-shadow:0 7px 19px var(--battle-ui-shadow),inset 0 1px rgba(255,255,255,.14);
  backdrop-filter:blur(10px) saturate(1.04);
  pointer-events:auto;
}
.battle-stage > .battle-status > span > small { display:flex!important;align-items:center;gap:4px;color:var(--battle-ui-accent)!important;font-size:8px!important;font-weight:950;letter-spacing:.08em; }
.battle-stage > .battle-status > span > small i,.battle-stage > .battle-status > span > small svg { width:12px!important;height:12px!important; }
.battle-stage > .battle-status > span > strong { max-width:270px!important;margin-top:1px;color:var(--battle-ui-text)!important;font-size:12px!important;line-height:1.05;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.battle-stage > .battle-status .battle-controls {
  height:38px;
  padding:3px;
  display:flex!important;
  align-items:center;
  gap:3px!important;
  border:1px solid var(--battle-ui-border);
  border-radius:13px;
  background:linear-gradient(145deg,var(--battle-ui-surface),var(--battle-ui-surface-soft));
  box-shadow:0 7px 19px var(--battle-ui-shadow),inset 0 1px rgba(255,255,255,.14);
  backdrop-filter:blur(10px) saturate(1.04);
  pointer-events:auto;
}
.battle-stage > .battle-status .battle-controls button {
  width:auto!important;
  min-width:30px!important;
  height:30px!important;
  min-height:30px!important;
  padding:0 7px!important;
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:4px;
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  color:var(--battle-ui-muted)!important;
  box-shadow:none!important;
  font-size:8px!important;
  font-weight:900!important;
}
.battle-stage > .battle-status .battle-controls button:hover,.battle-stage > .battle-status .battle-controls button:focus-visible,.battle-stage > .battle-status .battle-controls button.is-active { background:color-mix(in srgb,var(--battle-ui-accent) 13%,var(--battle-ui-card))!important;color:var(--battle-ui-accent)!important; }
.battle-stage > .battle-status .battle-controls button > i,.battle-stage > .battle-status .battle-controls button > svg { width:14px!important;height:14px!important; }
.battle-stage > .battle-status #cancelBattle { color:#df6a63!important; }
.battle-stage > .battle-status #cancelBattle:hover { background:rgba(223,106,99,.12)!important;color:#e6534c!important; }
.battle-turn-chip { z-index:32!important;top:10px!important;min-height:36px!important;padding:4px 9px!important;border-radius:12px!important;backdrop-filter:blur(9px)!important; }
.battle-turn-chip small { font-size:7px!important; }.battle-turn-chip b { font-size:9px!important; }

/* Large top participant cards with real emoji identity. */
.game-screen .battle-stage > .battle-health {
  position:absolute!important;
  z-index:21!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  transform:none!important;
  pointer-events:none!important;
}
html[data-game-theme] .game-screen .battle-stage .battle-health > article,
body[data-ui-theme] .game-screen .battle-stage .battle-health > article {
  position:absolute!important;
  top:57px!important;
  bottom:auto!important;
  width:250px!important;
  min-height:84px!important;
  box-sizing:border-box!important;
  padding:8px 9px!important;
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr)!important;
  grid-template-rows:auto 7px auto auto auto!important;
  column-gap:9px!important;
  row-gap:3px!important;
  overflow:visible!important;
  border:1px solid var(--battle-ui-border)!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,var(--battle-ui-surface),var(--battle-ui-surface-soft))!important;
  color:var(--battle-ui-text)!important;
  box-shadow:0 9px 24px var(--battle-ui-shadow),inset 0 1px rgba(255,255,255,.15)!important;
  backdrop-filter:blur(11px) saturate(1.05)!important;
}
.battle-stage .battle-health > .ally-health { left:11px!important;right:auto!important; }
.battle-stage .battle-health > .enemy-health { right:11px!important;left:auto!important; }
.battle-combat-portrait {
  grid-column:1!important;
  grid-row:1/6!important;
  align-self:center;
  width:58px!important;
  height:58px!important;
  display:grid!important;
  place-items:center;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--battle-ui-accent) 28%,var(--battle-ui-border));
  border-radius:16px;
  background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--battle-ui-accent) 12%,var(--battle-ui-card)),var(--battle-ui-surface-soft));
  box-shadow:inset 0 1px rgba(255,255,255,.2);
}
.battle-combat-portrait-art,.battle-combat-portrait-art img { width:100%!important;height:100%!important;display:block;object-fit:contain; }
.battle-stage .battle-health > article > span { grid-column:2!important;grid-row:1!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:5px!important; }
.battle-stage .battle-health > article > span b { min-width:0;color:var(--battle-ui-text)!important;font-size:12px!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.battle-stage .battle-health > article > span small { flex:0 0 auto;color:var(--battle-ui-muted)!important;font-size:9px!important;font-weight:850; }
.battle-stage .battle-health .battle-hp-bar { grid-column:2!important;grid-row:2!important;height:7px!important;border-radius:7px!important;background:color-mix(in srgb,var(--battle-ui-muted) 16%,transparent)!important; }
.battle-stage .battle-health .battle-stamina { grid-column:2!important;grid-row:3!important;margin:0!important;display:grid!important;grid-template-columns:35px minmax(0,1fr)!important;align-items:center!important;gap:5px!important; }
.battle-stage .battle-health .battle-stamina > span { display:flex!important;justify-content:space-between!important;gap:3px!important; }
.battle-stage .battle-health .battle-stamina > span b,.battle-stage .battle-health .battle-stamina > span small { font-size:7px!important; }
.battle-stage .battle-health .battle-stamina > i { height:4px!important;border-radius:4px!important; }
.battle-stage .battle-health .battle-statuses { grid-column:2!important;grid-row:4!important;margin:0!important;display:flex!important;gap:2px!important;min-height:0!important;max-height:19px;overflow-x:auto;pointer-events:auto!important;scrollbar-width:none; }
.battle-stage .battle-health .battle-statuses:empty { display:none!important; }
.battle-stage .battle-health .battle-status-chip { min-width:19px!important;height:18px!important;padding:1px 3px!important;border-radius:6px!important; }
.battle-stage .battle-health .battle-status-chip svg { width:11px!important;height:11px!important; }
.battle-stage .battle-health .battle-status-chip b { display:none!important; }
.battle-stage .battle-health .battle-status-chip small { font-size:7px!important; }
.battle-stage .battle-health .battle-exp { grid-column:2!important;grid-row:5!important;margin:0!important;display:block!important; }
.battle-stage .battle-health .battle-exp[hidden] { display:none!important; }
.battle-stage .battle-health .battle-exp > span { margin:0 0 2px!important; }.battle-stage .battle-health .battle-exp > span b,.battle-stage .battle-health .battle-exp > span small { font-size:7px!important; }
.battle-stage .battle-health .battle-exp > i { height:3px!important; }
.battle-stage .battle-health > article.is-low-hp { border-color:rgba(236,94,85,.68)!important;box-shadow:0 9px 24px var(--battle-ui-shadow),0 0 0 2px rgba(236,94,85,.11),inset 0 1px rgba(255,255,255,.15)!important; }
.battle-stage .battle-health > article.is-knocked-out { filter:saturate(.42);opacity:.72; }
.battle-stage .battle-health > article.has-shield .battle-combat-portrait { box-shadow:0 0 0 2px rgba(82,198,255,.18),inset 0 1px rgba(255,255,255,.2); }

/* Six circular team slots on the right; Poké Ball means a genuinely empty slot. */
.game-screen .battle-stage > .battle-roster-panel {
  position:absolute!important;
  z-index:30!important;
  left:auto!important;
  right:9px!important;
  top:50%!important;
  bottom:auto!important;
  width:54px!important;
  height:auto!important;
  min-height:0!important;
  box-sizing:border-box!important;
  padding:5px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:18px auto!important;
  gap:4px!important;
  transform:translateY(-38%)!important;
  overflow:visible!important;
  border:1px solid var(--battle-ui-border)!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,var(--battle-ui-surface),var(--battle-ui-surface-soft))!important;
  box-shadow:0 10px 27px var(--battle-ui-shadow),inset 0 1px rgba(255,255,255,.14)!important;
  backdrop-filter:blur(11px) saturate(1.04)!important;
  pointer-events:auto!important;
}
.battle-stage .battle-roster-panel > header { height:18px!important;padding:0!important;display:grid!important;place-items:center!important;border:0!important; }
.battle-stage .battle-roster-panel > header span { display:none!important; }
.battle-stage .battle-roster-panel > header em { max-width:44px!important;padding:2px 4px!important;border:0!important;border-radius:7px!important;background:color-mix(in srgb,var(--battle-control-ready) 14%,transparent)!important;color:var(--battle-control-ready)!important;font-size:7px!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.battle-stage .battle-roster-panel > header em.is-cooling { background:rgba(232,184,77,.13)!important;color:var(--battle-ultimate)!important; }
.battle-stage .battle-roster-panel > p { display:none!important; }
.battle-stage .battle-roster {
  width:44px!important;
  height:auto!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:44px!important;
  grid-template-rows:repeat(6,44px)!important;
  gap:4px!important;
}
.battle-stage .battle-roster-slot {
  position:relative!important;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  padding:2px!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
  border:1px solid var(--battle-ui-border)!important;
  border-radius:50%!important;
  background:var(--battle-ui-card)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.16)!important;
}
.battle-stage .battle-roster-slot:hover:not(:disabled),.battle-stage .battle-roster-slot:focus-visible { z-index:4;transform:scale(1.06)!important;border-color:var(--battle-ui-accent)!important; }
.battle-stage .battle-roster-slot.is-active { border-color:var(--battle-control-ready)!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--battle-control-ready) 26%,transparent),inset 0 1px rgba(255,255,255,.18)!important; }
.battle-stage .battle-roster-slot.is-ready:not(.is-active) { border-color:color-mix(in srgb,var(--battle-ui-accent) 56%,var(--battle-ui-border))!important; }
.battle-stage .battle-roster-slot.is-ko { filter:grayscale(.88)!important;opacity:.48!important; }
.battle-stage .battle-roster-portrait,.battle-stage .battle-roster-slot.is-empty > .battle-roster-empty {
  position:relative!important;
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:50%!important;
  background:color-mix(in srgb,var(--battle-ui-accent) 7%,var(--battle-ui-surface-soft))!important;
}
.battle-stage .battle-roster-portrait img { width:100%!important;height:100%!important;object-fit:contain!important; }
.battle-stage .battle-roster-empty::before { display:none!important;content:none!important; }
.battle-stage .battle-roster-empty-ball { width:28px!important;height:28px!important;display:block!important;opacity:.58;filter:saturate(.72); }
.battle-stage .battle-roster-slot > span { position:absolute!important;left:5px!important;right:5px!important;bottom:2px!important;display:block!important; }
.battle-stage .battle-roster-slot > span b,.battle-stage .battle-roster-slot > span small,.battle-stage .battle-roster-slot > span .battle-roster-energy { display:none!important; }
.battle-stage .battle-roster-slot > span .battle-roster-hp { display:block!important;height:3px!important;background:rgba(4,28,39,.28)!important; }
.battle-stage .battle-roster-slot > kbd { left:-3px!important;top:-3px!important;min-width:15px!important;height:15px!important;padding:0 2px!important;border-radius:6px!important;font-size:7px!important; }
.battle-stage .battle-roster-slot > strong { display:none!important; }

/* Co-op target strips remain small and only appear when the mode needs them. */
.game-screen .battle-stage > .battle-team-strip,.game-screen .battle-stage > .battle-target-strip {
  z-index:25!important;
  top:58px!important;
  width:min(380px,38%)!important;
  transform:translateX(-50%)!important;
}

/* Compact circular MOBA dock: basic + Q/W/E + larger R + four consumables. */
.game-screen .battle-stage > .battle-command-deck {
  position:absolute!important;
  z-index:35!important;
  left:50%!important;
  right:auto!important;
  top:auto!important;
  bottom:9px!important;
  width:auto!important;
  max-width:calc(100% - 136px)!important;
  height:92px!important;
  min-width:0!important;
  min-height:0!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:7px 10px 3px!important;
  display:grid!important;
  grid-template-columns:48px auto auto!important;
  grid-template-rows:70px 12px!important;
  align-items:end!important;
  justify-content:center!important;
  gap:2px 8px!important;
  transform:translateX(-50%)!important;
  overflow:visible!important;
  border:1px solid var(--battle-ui-border)!important;
  border-radius:22px!important;
  background:linear-gradient(145deg,var(--battle-ui-surface),var(--battle-ui-surface-soft))!important;
  box-shadow:0 12px 32px var(--battle-ui-shadow),inset 0 1px rgba(255,255,255,.16)!important;
  backdrop-filter:blur(13px) saturate(1.05)!important;
  pointer-events:auto!important;
}
.battle-stage .battle-command-deck .battle-basic {
  --battle-control-diameter:46px;
  grid-column:1!important;
  grid-row:1!important;
  align-self:end!important;
  width:48px!important;
  height:66px!important;
  min-width:48px!important;
  min-height:66px!important;
}
.battle-stage .battle-command-deck .battle-skills { grid-column:2!important;grid-row:1!important; }
.battle-stage .battle-command-deck .battle-quick-items { grid-column:3!important;grid-row:1!important; }
.battle-stage .battle-basic,.battle-stage .battle-skills > button {
  --battle-control-diameter:52px;
  position:relative!important;
  width:56px!important;
  height:70px!important;
  min-width:56px!important;
  min-height:70px!important;
  padding:0 0 14px!important;
  display:grid!important;
  grid-template-rows:var(--battle-control-diameter) 12px!important;
  place-items:center!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--battle-ui-text)!important;
  box-shadow:none!important;
  filter:none!important;
}
.battle-stage .battle-basic > span:first-child,.battle-stage .battle-skills > button > .skill-icon {
  grid-row:1!important;
  width:var(--battle-control-diameter)!important;
  height:var(--battle-control-diameter)!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  border:2px solid color-mix(in srgb,var(--battle-ui-accent) 38%,var(--battle-ui-border))!important;
  border-radius:50%!important;
  background:var(--battle-ui-card)!important;
  box-shadow:0 5px 13px color-mix(in srgb,var(--battle-ui-shadow) 70%,transparent),inset 0 1px rgba(255,255,255,.2)!important;
  transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease!important;
}
.battle-stage .battle-basic:hover:not(:disabled) > span:first-child,.battle-stage .battle-skills > button:hover > .skill-icon,.battle-stage .battle-basic:focus-visible > span:first-child,.battle-stage .battle-skills > button:focus-visible > .skill-icon { transform:translateY(-2px) scale(1.04)!important;border-color:var(--battle-ui-accent)!important;box-shadow:0 7px 18px color-mix(in srgb,var(--battle-ui-accent) 22%,transparent)!important; }
.battle-stage .battle-basic > span:first-child svg { width:24px!important;height:24px!important; }
.battle-stage .battle-skills > button > .skill-icon img { width:100%!important;height:100%!important;object-fit:cover!important; }
.battle-stage .battle-skills {
  height:70px!important;
  padding:0!important;
  display:flex!important;
  align-items:end!important;
  justify-content:center!important;
  gap:3px!important;
  overflow:visible!important;
}
.battle-stage .battle-skills > button.skill-kind-ultimate {
  --battle-control-diameter:64px;
  width:68px!important;
  min-width:68px!important;
  height:80px!important;
  min-height:80px!important;
  margin:0 0 -1px 3px!important;
  padding-bottom:14px!important;
}
.battle-stage .battle-skills > button.skill-kind-ultimate > .skill-icon { border:3px solid color-mix(in srgb,var(--battle-ultimate) 76%,#fff)!important;box-shadow:0 0 0 3px rgba(232,184,77,.13),0 7px 18px rgba(70,42,3,.22)!important; }
.battle-stage .battle-skills > button.skill-kind-ultimate > .battle-ultimate-badge { position:absolute;z-index:8;left:50%;top:calc(var(--battle-control-diameter) - 12px);padding:2px 5px;transform:translateX(-50%);border-radius:6px;background:var(--battle-ultimate);color:#422b05;font-size:6.5px;font-style:normal;font-weight:1000;letter-spacing:.05em;pointer-events:none; }
.battle-stage .battle-basic > .battle-skill-name,.battle-stage .battle-skills > button > .battle-skill-name {
  grid-row:2!important;
  align-self:end!important;
  width:100%!important;
  display:block!important;
  color:var(--battle-ui-text)!important;
  font-size:8.5px!important;
  font-weight:900!important;
  line-height:1!important;
  text-align:center!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.battle-stage .battle-basic > small { position:absolute;right:0;bottom:12px;display:block!important;color:var(--battle-ui-accent)!important;font-size:7px!important;font-weight:900; }
.battle-stage .battle-basic > kbd,.battle-stage .battle-skills > button > kbd {
  z-index:12!important;
  left:0!important;
  top:0!important;
  min-width:17px!important;
  height:17px!important;
  padding:0 3px!important;
  border-radius:7px!important;
  background:var(--battle-ui-surface)!important;
  color:var(--battle-ui-text)!important;
  border-color:var(--battle-ui-border-strong)!important;
  font-size:8px!important;
}
.battle-stage .battle-skills > button.skill-kind-ultimate > kbd { border-color:var(--battle-ultimate)!important;background:#60430c!important;color:#ffe7a7!important; }
.battle-stage .battle-skills > button > span.skill-cost {
  z-index:12!important;
  right:-1px!important;
  bottom:12px!important;
  min-width:21px!important;
  height:16px!important;
  padding:1px 3px!important;
  border-radius:7px!important;
  background:var(--battle-ui-surface)!important;
  color:var(--battle-ui-accent)!important;
}
.battle-stage .battle-skills > button > span.skill-cost svg { width:9px!important;height:9px!important; }.battle-stage .battle-skills > button > span.skill-cost b { font-size:7.5px!important; }
.battle-stage .battle-basic > em,.battle-stage .battle-skills > button > em { right:1px!important;top:1px!important;min-width:13px!important;height:13px!important;font-size:8px!important; }
.battle-stage .battle-skills > button.skill-kind-ultimate > em { right:2px!important;top:1px!important;background:var(--battle-ultimate)!important;color:#483008!important; }

.battle-stage .battle-basic > .skill-cooldown,.battle-stage .battle-skills > button > .skill-cooldown {
  position:absolute!important;
  z-index:7!important;
  inset:0 auto auto 0!important;
  width:var(--battle-control-diameter)!important;
  height:var(--battle-control-diameter)!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
  border-radius:50%!important;
  background:rgba(2,17,25,.57)!important;
  opacity:0!important;
}
.battle-stage .battle-basic.is-cooling > .skill-cooldown,.battle-stage .battle-skills > button.is-cooling > .skill-cooldown { opacity:1!important; }
.battle-stage .skill-cooldown::before {
  content:'';
  position:absolute;
  inset:-3px;
  border-radius:50%;
  background:conic-gradient(var(--battle-control) 0 var(--cooldown-sweep),rgba(255,255,255,.13) var(--cooldown-sweep) 360deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));
  pointer-events:none;
}
.battle-stage .skill-kind-ultimate > .skill-cooldown::before { background:conic-gradient(var(--battle-ultimate) 0 var(--cooldown-sweep),rgba(255,255,255,.13) var(--cooldown-sweep) 360deg); }
.battle-stage .skill-cooldown > b { min-width:24px!important;height:24px!important;border:0!important;background:rgba(2,18,27,.78)!important;font-size:10px!important; }

.battle-stage .battle-quick-items {
  position:relative!important;
  height:62px!important;
  min-width:0!important;
  padding:4px 5px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  overflow:visible!important;
  border-left:1px solid var(--battle-ui-border)!important;
}
.battle-stage .battle-quick-item {
  --battle-control-diameter:38px;
  position:relative!important;
  width:42px!important;
  height:56px!important;
  min-width:42px!important;
  min-height:56px!important;
  padding:0 2px 12px!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.battle-stage .battle-quick-item > span { width:38px!important;height:38px!important;padding:2px!important;display:grid!important;place-items:center!important;overflow:visible!important;border:1px solid var(--battle-ui-border)!important;border-radius:50%!important;background:var(--battle-ui-card)!important;box-shadow:0 4px 11px var(--battle-ui-shadow)!important; }
.battle-stage .battle-quick-item:hover > span,.battle-stage .battle-quick-item:focus-visible > span { transform:translateY(-2px) scale(1.04);border-color:var(--battle-ui-accent)!important; }
.battle-stage .battle-quick-item .battle-item-icon { width:34px!important;height:34px!important; }
.battle-stage .battle-quick-item > kbd { z-index:12!important;left:0!important;top:0!important;min-width:15px!important;height:15px!important;padding:0 2px!important;border-radius:6px!important;background:var(--battle-ui-surface)!important;color:var(--battle-ui-text)!important;font-size:7px!important; }
.battle-stage .battle-quick-item > b { right:0!important;bottom:11px!important;min-width:18px!important;height:15px!important;padding:0 3px!important;border-radius:6px!important;background:var(--battle-ui-surface)!important;color:var(--battle-ui-text)!important;font-size:7px!important; }
.battle-stage .battle-quick-item > em { right:50%!important;top:auto!important;bottom:0!important;transform:translateX(50%);padding:0!important;background:transparent!important;color:var(--battle-ui-muted)!important;font-size:6.5px!important;white-space:nowrap; }
.battle-stage .battle-quick-item > .skill-cooldown { inset:0 auto auto 2px!important;width:38px!important;height:38px!important;border-radius:50%!important;background:rgba(2,17,25,.59)!important; }
.battle-stage .battle-quick-item.is-cooling > .skill-cooldown { opacity:1!important; }
.battle-stage .battle-quick-item > .skill-cooldown::before { inset:-2px!important; }
.battle-stage .battle-quick-item::after { bottom:calc(100% + 7px)!important; }

.battle-stage .battle-command-deck .battle-footer {
  position:relative!important;
  inset:auto!important;
  grid-column:1/-1!important;
  grid-row:2!important;
  align-self:center!important;
  width:min(540px,100%)!important;
  height:12px!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:0!important;
  transform:none!important;
  display:flex!important;
  align-items:center!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  pointer-events:none!important;
}
.battle-stage .battle-footer > p { font-size:7px!important;color:var(--battle-ui-muted)!important; }
.battle-stage .battle-command-deck .battle-decision,.battle-stage .battle-command-deck .capture-panel {
  position:relative!important;
  inset:auto!important;
  grid-column:1/-1!important;
  grid-row:1/-1!important;
  width:min(620px,calc(100vw - 80px))!important;
  height:100%!important;
  min-height:0!important;
  margin:0!important;
  transform:none!important;
  border:0!important;
  border-radius:17px!important;
  background:transparent!important;
  box-shadow:none!important;
}
.battle-panel[data-phase="decision"] .battle-stage > .battle-command-deck,.battle-panel.is-capture .battle-stage > .battle-command-deck { width:min(640px,calc(100% - 120px))!important;grid-template-columns:1fr!important;grid-template-rows:1fr!important;padding:6px 8px!important; }
.battle-panel[data-phase="decision"] .battle-stage .battle-footer,.battle-panel.is-capture .battle-stage .battle-footer { display:none!important; }

.game-screen .battle-stage > .battle-tactics {
  z-index:45!important;
  right:9px!important;
  top:51px!important;
  width:min(292px,calc(100% - 20px))!important;
  max-height:calc(100% - 118px)!important;
  border-radius:16px!important;
  pointer-events:none!important;
}
.game-screen .battle-stage > .battle-tactics.is-open { pointer-events:auto!important; }

/* The battle no longer owns chat/bag/settings buttons; the world dock remains the only navigation. */
.game-screen .battle-panel .battle-utility-rail { display:none!important; }

@media (min-width:801px) and (max-width:1180px) {
  .game-screen .battle-panel { --battle-shell-width:min(900px,92vw,calc(100vw - 32px));--battle-shell-height:min(620px,80dvh,calc(100dvh - 108px)); }
  .game-screen .battle-panel .battle-shell { min-width:700px!important;min-height:480px!important; }
  html[data-game-theme] .game-screen .battle-stage .battle-health > article,body[data-ui-theme] .game-screen .battle-stage .battle-health > article { width:220px!important;grid-template-columns:50px minmax(0,1fr)!important; }
  .battle-combat-portrait { width:50px!important;height:50px!important; }
  .battle-stage .battle-basic > .battle-skill-name,.battle-stage .battle-skills > button > .battle-skill-name { display:none!important; }
  .battle-stage .battle-basic,.battle-stage .battle-skills > button { height:58px!important;min-height:58px!important;padding-bottom:2px!important; }
  .battle-stage .battle-skills > button.skill-kind-ultimate { height:68px!important;min-height:68px!important;padding-bottom:2px!important; }
  .battle-stage .battle-skills > button.skill-kind-ultimate > .battle-ultimate-badge { top:auto!important;bottom:-1px!important; }
  .battle-stage .battle-skills > button > span.skill-cost { bottom:0!important; }.battle-stage .battle-basic > small { bottom:0!important; }
}

@media (max-width:800px) {
  .game-screen .battle-panel {
    --battle-shell-width:calc(100vw - 8px);
    --battle-shell-height:min(640px,calc(100dvh - 78px - env(safe-area-inset-bottom)));
  }
  .game-screen .battle-panel .battle-shell {
    left:50%!important;
    top:calc(50% - 35px)!important;
    width:var(--battle-shell-width)!important;
    height:var(--battle-shell-height)!important;
    min-width:0!important;
    min-height:470px!important;
    transform:translate(-50%,-50%)!important;
    border-radius:17px!important;
  }
  .game-screen .battle-panel .battle-stage { border-radius:17px!important; }
  .game-screen .battle-stage > .battle-status { inset:5px 5px auto 5px!important;height:34px!important; }
  .battle-stage > .battle-status > span { height:34px;padding:4px 7px;border-radius:11px; }
  .battle-stage > .battle-status > span > small { font-size:6.5px!important; }.battle-stage > .battle-status > span > strong { max-width:34vw!important;font-size:9px!important; }
  .battle-stage > .battle-status .battle-controls { height:34px;padding:2px;border-radius:11px; }
  .battle-stage > .battle-status .battle-controls button { min-width:27px!important;width:27px!important;height:27px!important;min-height:27px!important;padding:0!important;font-size:0!important; }
  .battle-stage > .battle-status .battle-controls button > b { display:none!important; }
  .battle-stage > .battle-status #autoBattle { display:none!important; }
  .battle-stage > .battle-status #cancelBattle { font-size:0!important; }
  .battle-stage > .battle-status #cancelBattle::before { content:'';display:block;width:20px;height:20px;background:url('/assets/v2.9.11/items/escape-rope.png') center/contain no-repeat;font-size:0;filter:drop-shadow(0 2px 3px rgba(0,20,34,.28)); }
  .battle-turn-chip { top:41px!important;min-height:24px!important;padding:2px 5px!important; }.battle-turn-chip small { font-size:6px!important; }.battle-turn-chip b { font-size:7px!important; }

  html[data-game-theme] .game-screen .battle-stage .battle-health > article,body[data-ui-theme] .game-screen .battle-stage .battle-health > article {
    top:43px!important;
    width:calc(50% - 29px)!important;
    min-height:72px!important;
    padding:5px!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    grid-template-rows:auto 6px auto auto auto!important;
    column-gap:5px!important;
    border-radius:12px!important;
  }
  .battle-stage .battle-health > .ally-health { left:5px!important; }.battle-stage .battle-health > .enemy-health { right:50px!important; }
  .battle-combat-portrait { width:42px!important;height:42px!important;border-radius:12px!important; }
  .battle-stage .battle-health > article > span b { font-size:9px!important; }.battle-stage .battle-health > article > span small { font-size:7px!important; }
  .battle-stage .battle-health .battle-stamina { grid-template-columns:27px minmax(0,1fr)!important;gap:3px!important; }
  .battle-stage .battle-health .battle-stamina > span b,.battle-stage .battle-health .battle-stamina > span small { font-size:6px!important; }
  .battle-stage .battle-health .battle-statuses { max-height:15px; }.battle-stage .battle-health .battle-status-chip { min-width:15px!important;height:14px!important;padding:1px!important; }.battle-stage .battle-health .battle-status-chip svg { width:9px!important;height:9px!important; }

  .game-screen .battle-stage > .battle-roster-panel {
    right:4px!important;
    top:120px!important;
    width:42px!important;
    padding:3px!important;
    grid-template-rows:16px auto!important;
    gap:3px!important;
    transform:none!important;
    border-radius:14px!important;
  }
  .battle-stage .battle-roster-panel > header { height:16px!important; }.battle-stage .battle-roster-panel > header em { max-width:34px!important;padding:2px!important;font-size:5.5px!important; }
  .battle-stage .battle-roster { width:34px!important;grid-template-columns:34px!important;grid-template-rows:repeat(6,34px)!important;gap:3px!important; }
  .battle-stage .battle-roster-slot { width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important; }
  .battle-stage .battle-roster-portrait,.battle-stage .battle-roster-slot.is-empty > .battle-roster-empty { width:30px!important;height:30px!important; }
  .battle-stage .battle-roster-empty-ball { width:22px!important;height:22px!important; }
  .battle-stage .battle-roster-slot > kbd { display:none!important; }

  .game-screen .battle-stage > .battle-command-deck {
    bottom:5px!important;
    width:calc(100% - 12px)!important;
    max-width:none!important;
    height:112px!important;
    padding:5px 7px 2px!important;
    grid-template-columns:42px auto!important;
    grid-template-rows:56px 42px 8px!important;
    align-items:end!important;
    gap:2px 4px!important;
    border-radius:16px!important;
  }
  .battle-stage .battle-command-deck .battle-basic { --battle-control-diameter:40px;width:42px!important;height:48px!important;min-width:42px!important;min-height:48px!important;padding:0!important; }
  .battle-stage .battle-basic > .battle-skill-name,.battle-stage .battle-skills > button > .battle-skill-name,.battle-stage .battle-basic > small { display:none!important; }
  .battle-stage .battle-command-deck .battle-skills { grid-column:2!important;grid-row:1!important; }
  .battle-stage .battle-skills { height:56px!important;gap:2px!important; }
  .battle-stage .battle-skills > button { --battle-control-diameter:42px;width:44px!important;height:48px!important;min-width:44px!important;min-height:48px!important;padding:0!important; }
  .battle-stage .battle-skills > button.skill-kind-ultimate { --battle-control-diameter:50px;width:52px!important;min-width:52px!important;height:56px!important;min-height:56px!important;margin:0 0 -1px 2px!important;padding:0!important; }
  .battle-stage .battle-skills > button.skill-kind-ultimate > .battle-ultimate-badge { top:auto!important;bottom:-1px!important;font-size:5.5px!important;padding:1px 3px!important; }
  .battle-stage .battle-basic > kbd,.battle-stage .battle-skills > button > kbd { min-width:14px!important;height:14px!important;font-size:7px!important; }
  .battle-stage .battle-skills > button > span.skill-cost { right:-1px!important;bottom:0!important;height:14px!important;min-width:18px!important; }.battle-stage .battle-skills > button > span.skill-cost svg { display:none!important; }
  .battle-stage .battle-command-deck .battle-quick-items { grid-column:1/-1!important;grid-row:2!important; }
  .battle-stage .battle-quick-items { height:42px!important;padding:1px!important;border-top:1px solid var(--battle-ui-border)!important;border-left:0!important; }
  .battle-stage .battle-quick-item { --battle-control-diameter:34px;width:38px!important;height:40px!important;min-width:38px!important;min-height:40px!important;padding:0 2px 5px!important; }
  .battle-stage .battle-quick-item > span { width:34px!important;height:34px!important; }.battle-stage .battle-quick-item .battle-item-icon { width:30px!important;height:30px!important; }
  .battle-stage .battle-quick-item > .skill-cooldown { left:2px!important;width:34px!important;height:34px!important; }
  .battle-stage .battle-quick-item > em { display:none!important; }.battle-stage .battle-quick-item > b { bottom:3px!important; }
  .battle-stage .battle-command-deck .battle-footer { grid-row:3!important;height:8px!important; }.battle-stage .battle-footer > p { font-size:6px!important; }
  .battle-panel[data-phase="decision"] .battle-stage > .battle-command-deck,.battle-panel.is-capture .battle-stage > .battle-command-deck { width:calc(100% - 12px)!important;height:86px!important;grid-template-columns:1fr!important;grid-template-rows:1fr!important; }
  .game-screen .battle-stage > .battle-tactics { top:42px!important;right:4px!important;width:calc(100% - 8px)!important;max-height:calc(100% - 52px)!important; }
  .battle-skill-preview { bottom:calc(100% + 6px)!important;width:calc(var(--battle-shell-width) - 16px)!important; }
}

@media (max-width:430px) {
  .battle-stage > .battle-status > span > small { max-width:29vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  html[data-game-theme] .game-screen .battle-stage .battle-health > article,body[data-ui-theme] .game-screen .battle-stage .battle-health > article { width:calc(50% - 28px)!important;grid-template-columns:38px minmax(0,1fr)!important; }
  .battle-combat-portrait { width:38px!important;height:38px!important; }
  .battle-stage .battle-skills > button { --battle-control-diameter:40px;width:42px!important;min-width:42px!important; }
  .battle-stage .battle-skills > button.skill-kind-ultimate { --battle-control-diameter:48px;width:50px!important;min-width:50px!important; }
}

@media (max-height:650px) and (max-width:900px) and (orientation:landscape) {
  .game-screen .battle-panel { --battle-shell-width:min(840px,calc(100vw - 10px));--battle-shell-height:calc(100dvh - 10px); }
  .game-screen .battle-panel .battle-shell { left:50%!important;top:50%!important;min-width:620px!important;min-height:300px!important;transform:translate(-50%,-50%)!important; }
  .game-screen .battle-stage > .battle-status { inset:4px 5px auto!important;height:32px!important; }.battle-stage > .battle-status > span,.battle-stage > .battle-status .battle-controls { height:32px!important; }
  .battle-turn-chip { top:38px!important; }
  html[data-game-theme] .game-screen .battle-stage .battle-health > article,body[data-ui-theme] .game-screen .battle-stage .battle-health > article { top:39px!important;width:205px!important;min-height:66px!important;grid-template-columns:42px minmax(0,1fr)!important; }
  .battle-combat-portrait { width:42px!important;height:42px!important; }
  .game-screen .battle-stage > .battle-roster-panel { top:50%!important;right:5px!important;width:40px!important;transform:translateY(-38%)!important; }
  .battle-stage .battle-roster { width:32px!important;grid-template-columns:32px!important;grid-template-rows:repeat(6,32px)!important;gap:2px!important; }.battle-stage .battle-roster-slot { width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important; }.battle-stage .battle-roster-portrait,.battle-stage .battle-roster-slot.is-empty > .battle-roster-empty { width:28px!important;height:28px!important; }
  .game-screen .battle-stage > .battle-command-deck { bottom:4px!important;width:min(650px,calc(100% - 94px))!important;max-width:none!important;height:66px!important;padding:4px 7px 2px!important;grid-template-columns:40px auto auto!important;grid-template-rows:56px!important;gap:3px 5px!important; }
  .battle-stage .battle-command-deck .battle-basic { --battle-control-diameter:38px;width:40px!important;height:46px!important;min-width:40px!important;min-height:46px!important; }
  .battle-stage .battle-skills { height:52px!important; }.battle-stage .battle-skills > button { --battle-control-diameter:40px;width:42px!important;height:46px!important;min-width:42px!important;min-height:46px!important; }.battle-stage .battle-skills > button.skill-kind-ultimate { --battle-control-diameter:48px;width:50px!important;min-width:50px!important;height:54px!important;min-height:54px!important; }
  .battle-stage .battle-command-deck .battle-quick-items { grid-column:3!important;grid-row:1!important; }
  .battle-stage .battle-quick-items { height:48px!important;padding:2px 4px!important;border-top:0!important;border-left:1px solid var(--battle-ui-border)!important; }
  .battle-stage .battle-quick-item { --battle-control-diameter:32px;width:35px!important;height:43px!important;min-width:35px!important;min-height:43px!important; }.battle-stage .battle-quick-item > span { width:32px!important;height:32px!important; }.battle-stage .battle-quick-item .battle-item-icon { width:29px!important;height:29px!important; }.battle-stage .battle-quick-item > .skill-cooldown { width:32px!important;height:32px!important; }
  .battle-stage .battle-command-deck .battle-footer { display:none!important; }
  .battle-panel[data-phase="decision"] .battle-stage > .battle-command-deck,.battle-panel.is-capture .battle-stage > .battle-command-deck { width:min(620px,calc(100% - 90px))!important;height:58px!important;grid-template-columns:1fr!important; }
}

/* Short desktop screens keep the six-slot rail clear of the command dock. */
@media (min-width:801px) and (max-height:700px) {
  .game-screen .battle-stage > .battle-roster-panel { top:48%!important;width:46px!important;padding:4px!important;gap:3px!important;transform:translateY(-38%)!important; }
  .battle-stage .battle-roster { width:36px!important;grid-template-columns:36px!important;grid-template-rows:repeat(6,36px)!important;gap:3px!important; }
  .battle-stage .battle-roster-slot { width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important; }
  .battle-stage .battle-roster-portrait,.battle-stage .battle-roster-slot.is-empty > .battle-roster-empty { width:32px!important;height:32px!important; }
  .battle-stage .battle-roster-empty-ball { width:24px!important;height:24px!important; }
}

/* Full chat and side windows remain usable beside combat on ordinary desktop widths. */
@supports selector(body:has(*)) {
  @media (min-width:1280px) {
    body.is-battling:has(.chat-panel.is-open:not(.is-minimized)) .game-screen .battle-panel .battle-shell {
      left:auto!important;
      right:14px!important;
      width:min(790px,calc(100vw - 590px))!important;
      min-width:650px!important;
      opacity:1!important;
      pointer-events:auto!important;
      transform:translateY(-50%)!important;
    }
    body.is-battling:has(.side-panel.is-open) .game-screen .battle-panel .battle-shell {
      left:14px!important;
      right:auto!important;
      width:min(790px,calc(100vw - 550px))!important;
      min-width:650px!important;
      opacity:1!important;
      pointer-events:auto!important;
      transform:translateY(-50%)!important;
    }
  }
  @media (min-width:801px) and (max-width:1279px) {
    body.is-battling:has(.chat-panel.is-open:not(.is-minimized)) .game-screen .battle-panel .battle-shell,
    body.is-battling:has(.side-panel.is-open) .game-screen .battle-panel .battle-shell {
      opacity:.16!important;
      pointer-events:none!important;
    }
  }
}

@media (prefers-reduced-motion:reduce) {
  .battle-stage .battle-basic > span:first-child,.battle-stage .battle-skills > button > .skill-icon,
  .battle-stage .battle-quick-item > span,.battle-stage .battle-roster-slot { transition:none!important;transform:none!important; }
}

/* v2.9.7 — reward reveal, unified skill cluster and collision-safe battle states */
.game-screen .battle-panel {
  --battle-shell-width:min(920px,66vw,calc(100vw - 220px));
  --battle-shell-height:min(580px,70dvh,calc(100dvh - 170px));
}
.game-screen .battle-panel .battle-shell {
  width:var(--battle-shell-width)!important;
  height:var(--battle-shell-height)!important;
  min-width:700px!important;
  min-height:450px!important;
  top:calc(50% - 14px)!important;
  border-radius:20px!important;
}
.game-screen .battle-panel .battle-stage {
  border-radius:20px!important;
  background:transparent!important;
}
.game-screen .battle-panel .battle-stage::before { background:transparent!important; }

/* The six server slots live on the left and never reserve space outside the arena. */
.game-screen .battle-stage > .battle-roster-panel {
  left:8px!important;
  right:auto!important;
  top:50%!important;
  width:52px!important;
  padding:4px!important;
  transform:translateY(-34%)!important;
}
.battle-stage .battle-roster-slot > kbd { left:auto!important;right:-3px!important; }

/* Exactly one lower state is allowed to participate in layout. */
.battle-stage .battle-skill-cluster[hidden],
.battle-stage .battle-consumable-panel[hidden],
.battle-stage .battle-decision[aria-hidden="true"],
.battle-stage .capture-panel[aria-hidden="true"] { display:none!important; }
.battle-panel:not([data-phase="battle"]) .battle-stage .battle-skill-cluster,
.battle-panel:not([data-phase="battle"]) .battle-stage .battle-consumable-panel { display:none!important; }
.battle-panel[data-phase="battle"] .battle-stage .battle-decision,
.battle-panel[data-phase="battle"] .battle-stage .capture-panel { display:none!important; }

.game-screen .battle-stage > .battle-command-deck {
  bottom:8px!important;
  width:auto!important;
  max-width:calc(100% - 106px)!important;
  height:94px!important;
  padding:6px 8px 3px!important;
  grid-template-columns:auto 190px!important;
  grid-template-rows:72px 11px!important;
  align-items:end!important;
  gap:2px 8px!important;
  border-radius:20px!important;
}
.battle-stage .battle-skill-cluster {
  grid-column:1!important;
  grid-row:1!important;
  height:72px!important;
  min-width:0;
  display:flex!important;
  align-items:end;
  justify-content:center;
  gap:3px;
}
.battle-stage .battle-skill-cluster > .battle-basic {
  --battle-control-diameter:50px;
  flex:0 0 54px;
  width:54px!important;
  height:70px!important;
  min-width:54px!important;
  min-height:70px!important;
}
.battle-stage .battle-basic > span:first-child {
  display:grid!important;
  place-items:center;
  overflow:hidden!important;
}
.battle-stage .battle-basic > span:first-child .battle-interface-art,
.battle-stage .battle-basic > span:first-child > svg { width:100%!important;height:100%!important; }
.battle-stage .battle-skill-cluster > .battle-skills { height:72px!important;gap:3px!important; }
.battle-stage .battle-skill-cluster > .battle-skills > button {
  --battle-control-diameter:50px;
  width:54px!important;
  min-width:54px!important;
  height:70px!important;
  min-height:70px!important;
}
.battle-stage .battle-skill-cluster > .battle-skills > button.skill-kind-ultimate {
  --battle-control-diameter:60px;
  width:64px!important;
  min-width:64px!important;
  height:78px!important;
  min-height:78px!important;
  margin-left:3px!important;
}
.battle-stage .battle-skill-cluster .skill-cooldown { pointer-events:none; }
.battle-stage .battle-basic.is-cooling > .skill-cooldown,
.battle-stage .battle-skills > button.is-cooling > .skill-cooldown { opacity:1!important; }

.battle-stage .battle-consumable-panel {
  grid-column:2!important;
  grid-row:1!important;
  width:190px!important;
  height:68px!important;
  padding:4px 5px!important;
  display:grid!important;
  grid-template-rows:16px 44px!important;
  gap:2px!important;
  box-sizing:border-box;
  border:1px solid var(--battle-ui-border)!important;
  border-radius:15px!important;
  background:color-mix(in srgb,var(--battle-ui-card) 72%,transparent)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.1)!important;
}
.battle-consumable-panel > header {
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:5px;
  padding:0 3px;
  color:var(--battle-ui-text);
}
.battle-consumable-panel > header span { min-width:0;display:flex;align-items:baseline;gap:5px; }
.battle-consumable-panel > header small { color:var(--battle-ui-accent);font-size:6px;font-weight:950;letter-spacing:.08em; }
.battle-consumable-panel > header b { font-size:8px; }
.battle-consumable-panel > header em { color:var(--battle-ui-muted);font-size:7px;font-style:normal;font-weight:900; }
.battle-stage .battle-consumable-panel > .battle-quick-items {
  width:100%!important;
  height:44px!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:repeat(4,40px)!important;
  justify-content:center!important;
  gap:3px!important;
  overflow:visible!important;
  border:0!important;
}
.battle-stage .battle-consumable-panel .battle-quick-item {
  --battle-control-diameter:36px;
  width:40px!important;
  height:44px!important;
  min-width:40px!important;
  min-height:44px!important;
  padding:0 2px 5px!important;
}
.battle-stage .battle-consumable-panel .battle-quick-item > span { width:36px!important;height:36px!important; }
.battle-stage .battle-consumable-panel .battle-quick-item .battle-item-icon { width:32px!important;height:32px!important; }
.battle-stage .battle-consumable-panel .battle-quick-item > .skill-cooldown { left:2px!important;width:36px!important;height:36px!important; }
.battle-stage .battle-consumable-panel .battle-quick-item > b { bottom:3px!important; }
.battle-stage .battle-consumable-panel .battle-quick-item > em { display:none!important; }
.battle-stage .battle-command-deck .battle-footer { grid-column:1/-1!important;grid-row:2!important; }

/* Reward state replaces—not overlays—the controls. */
.battle-panel[data-phase="decision"] .battle-stage > .battle-command-deck {
  width:min(700px,calc(100% - 94px))!important;
  max-width:none!important;
  height:176px!important;
  padding:7px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:1fr!important;
  border-radius:19px!important;
}
.battle-stage .battle-command-deck .battle-decision {
  width:100%!important;
  height:100%!important;
  padding:0!important;
  display:none!important;
  grid-template-columns:minmax(0,1fr) 158px!important;
  gap:7px!important;
  box-sizing:border-box!important;
  background:transparent!important;
}
.battle-stage .battle-command-deck .battle-decision.is-open { display:grid!important; }
.battle-reward-card {
  min-width:0;
  padding:8px 9px 6px;
  display:grid;
  grid-template-rows:auto 1fr auto;
  gap:6px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,#66d6f5 38%,var(--battle-ui-border));
  border-radius:14px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--battle-ui-card) 94%,#168cc7 6%),var(--battle-ui-surface-soft));
  box-shadow:inset 0 1px rgba(255,255,255,.15),0 7px 18px color-mix(in srgb,var(--battle-ui-shadow) 60%,transparent);
  color:var(--battle-ui-text);
}
.battle-reward-card > header { min-width:0;display:flex;align-items:center;gap:8px; }
.battle-reward-card > header > i { flex:0 0 40px;width:40px;height:40px;display:grid;place-items:center; }
.battle-reward-card > header > i svg { width:40px;height:40px; }
.battle-reward-card > header > span { min-width:0;display:grid;gap:1px; }
.battle-reward-card > header small { color:var(--battle-ui-accent);font-size:6.5px;font-weight:1000;letter-spacing:.12em; }
.battle-reward-card > header b { font-size:12px;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.battle-reward-card > header em { color:var(--battle-ui-muted);font-size:7px;font-style:normal;font-weight:750; }
.battle-reward-list {
  min-width:0;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;
}
.battle-reward-item {
  position:relative;
  min-width:0;
  min-height:48px;
  padding:4px 5px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  grid-template-rows:1fr auto;
  align-items:center;
  column-gap:5px;
  border:1px solid var(--battle-ui-border);
  border-radius:11px;
  background:color-mix(in srgb,var(--battle-ui-card) 88%,transparent);
  box-shadow:inset 0 1px rgba(255,255,255,.12);
}
.battle-reward-item.is-quest { border-color:rgba(234,187,67,.62);background:linear-gradient(145deg,color-mix(in srgb,var(--battle-ui-card) 88%,#e2a82e 12%),var(--battle-ui-card)); }
.battle-reward-art { grid-column:1;grid-row:1/3;width:38px;height:38px;filter:drop-shadow(0 3px 5px rgba(0,20,35,.2)); }
.battle-reward-item > span { min-width:0;display:grid;gap:1px; }
.battle-reward-item > span small { color:var(--battle-ui-muted);font-size:5.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.battle-reward-item > span b { font-size:7.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.battle-reward-item > strong { color:#4dc7f4;font-size:10px;line-height:1; }
.battle-reward-item.is-quest > strong { color:#e9b947; }
.battle-reward-card > footer { min-width:0;display:flex;align-items:center;justify-content:space-between;gap:7px;color:var(--battle-ui-muted);font-size:6px; }
.battle-reward-card > footer span { display:flex;align-items:center;gap:4px; }
.battle-reward-card > footer span i { width:6px;height:6px;border-radius:50%;background:#55d887;box-shadow:0 0 0 3px rgba(85,216,135,.12); }
.battle-reward-card > footer b { color:var(--battle-ui-text);font-size:6px;text-align:right; }
.battle-decision-actions { display:grid;grid-template-rows:1fr 1fr;gap:6px; }
.battle-decision-actions > button {
  min-width:0!important;
  min-height:0!important;
  padding:7px 8px!important;
  display:grid!important;
  grid-template-columns:30px minmax(0,1fr)!important;
  align-items:center!important;
  gap:6px!important;
  border:1px solid color-mix(in srgb,var(--battle-ui-accent) 36%,var(--battle-ui-border))!important;
  border-radius:13px!important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--battle-ui-accent) 18%,var(--battle-ui-card)),var(--battle-ui-card))!important;
  color:var(--battle-ui-text)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.15)!important;
  text-align:left!important;
}
.battle-decision-actions > button:hover:not(:disabled),.battle-decision-actions > button:focus-visible { transform:translateY(-1px);border-color:var(--battle-ui-accent)!important; }
.battle-decision-actions > button > svg { width:28px;height:28px;color:var(--battle-ui-accent); }
.battle-decision-actions > button > span { min-width:0;display:grid;gap:2px; }
.battle-decision-actions > button small { color:var(--battle-ui-muted);font-size:5.5px;font-weight:950;letter-spacing:.06em; }
.battle-decision-actions > button b { font-size:9px;line-height:1.05; }
.battle-decision-actions #beginCapture { border-color:rgba(78,210,135,.44)!important;background:linear-gradient(145deg,color-mix(in srgb,#42c77d 17%,var(--battle-ui-card)),var(--battle-ui-card))!important; }
.battle-decision-actions #beginCapture > svg { color:#55d887; }
.battle-decision-actions > button:disabled { opacity:.48;filter:saturate(.55); }

/* Compact, measurable battle asset loader. */
.battle-stage .battle-asset-loader {
  width:min(350px,calc(100% - 32px));
  padding:12px 14px;
  grid-template-columns:52px minmax(0,1fr);
  gap:11px;
  border-color:var(--battle-ui-border);
  background:linear-gradient(145deg,var(--battle-ui-surface),var(--battle-ui-surface-soft));
  color:var(--battle-ui-text);
}
.battle-loader-ball { position:relative;width:48px!important;height:48px!important;display:block!important;border:3px solid #dff8ff;border-radius:50%;overflow:hidden;background:linear-gradient(#ec5d5b 0 46%,#17394d 46% 54%,#f4fbfd 54%);box-shadow:0 7px 16px rgba(0,20,31,.25);animation:battle-loader-ball 1s cubic-bezier(.4,0,.2,1) infinite; }
.battle-loader-ball::before { content:'';position:absolute;z-index:2;left:50%;top:50%;width:15px;height:15px;transform:translate(-50%,-50%);border:4px solid #17394d;border-radius:50%;background:#eaf8fc; }
.battle-loader-ball > i,.battle-loader-ball > b { position:absolute;width:6px;height:6px;border-radius:50%;background:#fff4a5;box-shadow:0 0 9px #fff5ad; }
.battle-loader-ball > i { left:7px;top:8px; }.battle-loader-ball > b { right:6px;bottom:8px; }
.battle-loader-copy { min-width:0!important;display:grid!important;grid-template-columns:1fr auto;grid-template-rows:auto auto 5px;gap:2px 8px!important; }
.battle-loader-copy > small { grid-column:1/-1;color:var(--battle-ui-accent)!important;font-size:6.5px!important; }
.battle-loader-copy > b { min-width:0;font-size:10px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.battle-loader-copy > strong { color:var(--battle-ui-muted);font-size:7px;align-self:center; }
.battle-load-track { grid-column:1/-1;position:relative;width:100%;height:5px!important;margin:2px 0 0!important;display:block!important;overflow:hidden;border-radius:999px;background:color-mix(in srgb,var(--battle-ui-muted) 18%,transparent)!important; }
.battle-load-track > em { width:0;height:100%!important;margin:0!important;display:block!important;border-radius:inherit;background:linear-gradient(90deg,#3ab9ed,#67e1c3,#f1cd61)!important;transition:width .2s ease; }
.battle-load-track > em::after { display:none!important;content:none!important; }
@keyframes battle-loader-ball { 0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-5px) rotate(8deg)} }

/* Capture remains a separate compact state. */
.battle-panel.is-capture .battle-stage > .battle-command-deck { width:min(610px,calc(100% - 94px))!important;height:88px!important;grid-template-columns:1fr!important;grid-template-rows:1fr!important; }

@media (min-width:801px) and (max-width:1180px) {
  .game-screen .battle-panel { --battle-shell-width:min(860px,calc(100vw - 72px));--battle-shell-height:min(550px,calc(100dvh - 126px)); }
  .game-screen .battle-panel .battle-shell { min-width:680px!important;min-height:440px!important; }
  .game-screen .battle-stage > .battle-command-deck { max-width:calc(100% - 88px)!important;grid-template-columns:auto 174px!important;gap:5px!important; }
  .battle-stage .battle-consumable-panel { width:174px!important; }
  .battle-stage .battle-consumable-panel > .battle-quick-items { grid-template-columns:repeat(4,37px)!important; }
  .battle-stage .battle-consumable-panel .battle-quick-item { width:37px!important;min-width:37px!important; }
}

@media (max-width:800px) {
  .game-screen .battle-panel { --battle-shell-width:calc(100vw - 8px);--battle-shell-height:min(620px,calc(100dvh - 80px - env(safe-area-inset-bottom))); }
  .game-screen .battle-panel .battle-shell { min-width:0!important;min-height:450px!important;top:calc(50% - 34px)!important; }
  .battle-stage .battle-health > .ally-health { left:5px!important; }
  .battle-stage .battle-health > .enemy-health { left:auto!important;right:5px!important; }
  .game-screen .battle-stage > .battle-roster-panel { left:4px!important;right:auto!important;top:122px!important;transform:none!important; }
  .game-screen .battle-stage > .battle-command-deck {
    bottom:5px!important;
    width:calc(100% - 12px)!important;
    max-width:none!important;
    height:122px!important;
    padding:5px 6px 2px!important;
    grid-template-columns:1fr!important;
    grid-template-rows:62px 47px 7px!important;
    gap:2px!important;
  }
  .battle-stage .battle-skill-cluster { grid-column:1!important;grid-row:1!important;height:62px!important; }
  .battle-stage .battle-skill-cluster > .battle-basic { --battle-control-diameter:42px;flex-basis:44px;width:44px!important;min-width:44px!important;height:52px!important;min-height:52px!important;padding:0!important; }
  .battle-stage .battle-skill-cluster > .battle-skills { height:60px!important; }
  .battle-stage .battle-skill-cluster > .battle-skills > button { --battle-control-diameter:42px;width:44px!important;min-width:44px!important;height:52px!important;min-height:52px!important;padding:0!important; }
  .battle-stage .battle-skill-cluster > .battle-skills > button.skill-kind-ultimate { --battle-control-diameter:50px;width:52px!important;min-width:52px!important;height:60px!important;min-height:60px!important; }
  .battle-stage .battle-basic > .battle-skill-name,.battle-stage .battle-skills > button > .battle-skill-name,.battle-stage .battle-basic > small { display:none!important; }
  .battle-stage .battle-consumable-panel { grid-column:1!important;grid-row:2!important;width:min(260px,100%)!important;height:47px!important;margin:auto;padding:2px 5px!important;grid-template-columns:72px 1fr!important;grid-template-rows:1fr!important;align-items:center; }
  .battle-consumable-panel > header { padding:0 4px;display:grid;justify-content:start; }
  .battle-consumable-panel > header span { display:grid;gap:0; }.battle-consumable-panel > header em { display:none; }
  .battle-stage .battle-consumable-panel > .battle-quick-items { height:40px!important;grid-template-columns:repeat(4,37px)!important; }
  .battle-stage .battle-consumable-panel .battle-quick-item { --battle-control-diameter:34px;width:37px!important;height:40px!important;min-width:37px!important;min-height:40px!important; }
  .battle-stage .battle-consumable-panel .battle-quick-item > span { width:34px!important;height:34px!important; }
  .battle-stage .battle-consumable-panel .battle-quick-item > .skill-cooldown { width:34px!important;height:34px!important; }
  .battle-stage .battle-command-deck .battle-footer { grid-row:3!important;height:7px!important; }
  .battle-panel[data-phase="decision"] .battle-stage > .battle-command-deck { width:calc(100% - 12px)!important;height:218px!important;padding:5px!important; }
  .battle-stage .battle-command-deck .battle-decision { grid-template-columns:1fr!important;grid-template-rows:minmax(0,1fr) 48px!important;gap:5px!important; }
  .battle-reward-card { padding:6px;gap:4px; }
  .battle-reward-card > header > i,.battle-reward-card > header > i svg { width:34px;height:34px;flex-basis:34px; }
  .battle-reward-list { grid-template-columns:repeat(3,minmax(112px,1fr));overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none; }
  .battle-reward-list::-webkit-scrollbar { display:none; }
  .battle-reward-item { min-height:44px;grid-template-columns:34px minmax(0,1fr); }.battle-reward-art { width:34px;height:34px; }
  .battle-reward-card > footer { display:grid;gap:2px; }.battle-reward-card > footer b { text-align:left; }
  .battle-decision-actions { grid-template-columns:1fr 1fr;grid-template-rows:1fr;gap:5px; }
  .battle-decision-actions > button { grid-template-columns:25px minmax(0,1fr)!important;padding:4px 6px!important; }
  .battle-decision-actions > button > svg { width:23px;height:23px; }
  .battle-decision-actions > button b { font-size:8px; }
  .battle-panel.is-capture .battle-stage > .battle-command-deck { width:calc(100% - 12px)!important;height:88px!important; }
}

@media (max-width:430px) {
  .battle-stage .battle-skill-cluster { gap:1px; }
  .battle-stage .battle-skill-cluster > .battle-basic { --battle-control-diameter:39px;flex-basis:41px;width:41px!important;min-width:41px!important; }
  .battle-stage .battle-skill-cluster > .battle-skills { gap:1px!important; }
  .battle-stage .battle-skill-cluster > .battle-skills > button { --battle-control-diameter:39px;width:41px!important;min-width:41px!important; }
  .battle-stage .battle-skill-cluster > .battle-skills > button.skill-kind-ultimate { --battle-control-diameter:47px;width:49px!important;min-width:49px!important; }
  .battle-reward-card > header b { font-size:10px; }
}

@media (max-height:650px) and (max-width:900px) and (orientation:landscape) {
  .game-screen .battle-panel { --battle-shell-width:min(820px,calc(100vw - 10px));--battle-shell-height:calc(100dvh - 10px); }
  .game-screen .battle-panel .battle-shell { min-width:620px!important;min-height:300px!important;top:50%!important; }
  .game-screen .battle-stage > .battle-roster-panel { left:4px!important;right:auto!important;top:50%!important;transform:translateY(-34%)!important; }
  .game-screen .battle-stage > .battle-command-deck { width:min(640px,calc(100% - 84px))!important;height:68px!important;grid-template-columns:auto 166px!important;grid-template-rows:58px!important;gap:4px!important; }
  .battle-stage .battle-skill-cluster { grid-column:1!important;grid-row:1!important;height:58px!important; }
  .battle-stage .battle-skill-cluster > .battle-basic { --battle-control-diameter:38px;flex-basis:40px;width:40px!important;min-width:40px!important;height:48px!important;min-height:48px!important; }
  .battle-stage .battle-skill-cluster > .battle-skills { height:56px!important; }
  .battle-stage .battle-skill-cluster > .battle-skills > button { --battle-control-diameter:38px;width:40px!important;min-width:40px!important;height:48px!important;min-height:48px!important; }
  .battle-stage .battle-skill-cluster > .battle-skills > button.skill-kind-ultimate { --battle-control-diameter:46px;width:48px!important;min-width:48px!important;height:56px!important;min-height:56px!important; }
  .battle-stage .battle-consumable-panel { grid-column:2!important;grid-row:1!important;width:166px!important;height:48px!important;margin:0!important;padding:2px 4px!important;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:1fr!important; }
  .battle-consumable-panel > header { display:none!important; }
  .battle-stage .battle-consumable-panel > .battle-quick-items { height:42px!important;grid-template-columns:repeat(4,36px)!important;border:0!important; }
  .battle-stage .battle-command-deck .battle-footer { display:none!important; }
  .battle-panel[data-phase="decision"] .battle-stage > .battle-command-deck { width:min(650px,calc(100% - 84px))!important;height:148px!important;grid-template-columns:1fr!important; }
  .battle-stage .battle-command-deck .battle-decision { grid-template-columns:minmax(0,1fr) 145px!important;grid-template-rows:1fr!important; }
  .battle-reward-card > footer { display:none; }
  .battle-panel.is-capture .battle-stage > .battle-command-deck { width:min(590px,calc(100% - 84px))!important;height:62px!important;grid-template-columns:1fr!important; }
}

@supports selector(body:has(*)) {
  @media (min-width:1280px) {
    body.is-battling:has(.chat-panel.is-open:not(.is-minimized)) .game-screen .battle-panel .battle-shell {
      left:auto!important;right:14px!important;width:min(760px,calc(100vw - 590px))!important;min-width:620px!important;transform:translateY(-50%)!important;
    }
    body.is-battling:has(.side-panel.is-open) .game-screen .battle-panel .battle-shell {
      left:14px!important;right:auto!important;width:min(760px,calc(100vw - 550px))!important;min-width:620px!important;transform:translateY(-50%)!important;
    }
  }
}

@media (prefers-reduced-motion:reduce) {
  .battle-loader-ball { animation:none!important; }
  .battle-load-track > em { transition:none!important; }
  .battle-reward-art,.battle-decision-actions > button { transition:none!important;transform:none!important; }
}

/* V34 — transparent raster item art. Capture balls are drawn objects, not
   icons placed on an extra coloured tile. The same atlas is shared by the
   inventory and battle capture selector so their silhouettes stay identical. */
.item-ball-raster {
  display:block;
  width:100%;
  height:100%;
  background-image:var(--ball-atlas);
  background-repeat:no-repeat;
  background-size:500% 300%;
  background-position:var(--ball-atlas-x) var(--ball-atlas-y);
  filter:drop-shadow(0 3px 3px rgba(13,44,62,.18));
  transform:translateZ(0);
}
.item-graphic-shell.category-balls::before {
  content:none!important;
  display:none!important;
}
.inventory-item-v2741.category-balls .inventory-item-v2741__art,
.inventory-item-v2741.category-balls .item-graphic-shell,
.inventory-card-v2733.category-balls .inventory-card-icon,
.inventory-detail-v2733 .item-graphic-shell.category-balls {
  background:transparent!important;
  box-shadow:none!important;
}
.inventory-item-v2741.category-balls .inventory-item-v2741__art .item-icon {
  width:56px;
  height:56px;
}

/* City Pokecenter + Pokemart */
.city-facility{padding:18px;min-height:100%;background:linear-gradient(145deg,#f7fbff 0%,#edf8ff 46%,#fff7ee 100%);color:#17384a}.city-facility .panel-section-head-v2737{margin:-18px -18px 14px;padding:18px 20px;background:linear-gradient(110deg,#123c54,#176c78);color:#fff}.facility-tabs{display:flex;gap:8px;margin:0 0 14px;padding:5px;background:#dcebf1;border-radius:16px}.facility-tabs button{flex:1;border:0;border-radius:12px;padding:11px 12px;background:transparent;color:#486675;font-weight:900;cursor:pointer}.facility-tabs button.active{background:#fff;color:#0c6b78;box-shadow:0 5px 16px #24576c22}.facility-search{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding:10px 14px;background:#fff;border:1px solid #cce0e8;border-radius:15px}.facility-search span{font-size:11px;font-weight:900;color:#67808c;text-transform:uppercase}.facility-search input{width:100%;border:0;outline:0;background:transparent;color:#163747;font:700 14px inherit}.facility-pokemon-card .facility-hp{display:block;width:100%;height:6px;overflow:hidden;border-radius:99px;background:#dce7e7}.facility-pokemon-card .facility-hp span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1ebd75,#80d856)}.facility-clinic-summary,.facility-nursery{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px;padding:16px 18px;border-radius:18px;background:linear-gradient(110deg,#fff,#eefbfa);border:1px solid #cde5e4}.facility-clinic-summary h3,.facility-nursery h3{margin:3px 0}.facility-clinic-summary small,.facility-nursery small{font-weight:900;color:#0a8b83}.facility-clinic-summary button,.facility-nursery button,.pokemart-product button{border:0;border-radius:12px;padding:11px 14px;background:#ef4b4b;color:#fff;font-weight:900;cursor:pointer}.facility-clinic-summary button:disabled,.facility-nursery button:disabled,.pokemart-product button:disabled{opacity:.42;cursor:not-allowed}.pokemart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pokemart-product{display:grid;grid-template-columns:72px 1fr;gap:14px;padding:15px;border:1px solid #d3e5eb;border-radius:18px;background:#fff;box-shadow:0 10px 24px #16485b12}.pokemart-product-art{display:grid;place-items:center;width:72px;height:72px;border-radius:18px;background:linear-gradient(145deg,#eaf8ff,#fff0d8)}.pokemart-product-art img{max-width:54px;max-height:54px}.pokemart-product h3{margin:3px 0 5px}.pokemart-product p{margin:0;color:#627985;font-size:12px;line-height:1.4}.pokemart-product footer{grid-column:1/-1;display:flex;align-items:center;gap:8px;border-top:1px solid #edf2f4;padding-top:11px}.pokemart-product footer b{margin-right:auto}.pokemart-product footer button:last-child{background:#167b8b}@media(max-width:740px){.city-facility{padding:12px}.city-facility .panel-section-head-v2737{margin:-12px -12px 10px}.facility-tabs{overflow-x:auto}.facility-tabs button{min-width:112px}.facility-clinic-summary,.facility-nursery{align-items:flex-start;flex-direction:column}.pokemart-grid{grid-template-columns:1fr}.pokemart-product{grid-template-columns:58px 1fr}.pokemart-product-art{width:58px;height:58px}}

/* Full dev atlas: every published location stays named and selectable. */
.region-map-v2204-node.has-label>span{transform:translate(calc(-50% + var(--node-label-x,0px)),var(--node-label-y,0px));max-width:126px;white-space:normal;text-align:center;line-height:1.08;padding:4px 7px;background:rgba(8,35,49,.84);border:1px solid rgba(255,255,255,.24);border-radius:8px;box-shadow:0 3px 9px rgba(5,24,34,.24)}
.region-map-v2204-node:hover,.region-map-v2204-node:focus-visible,.region-map-v2204-node.is-selected{z-index:40}
.region-map-v2204-node:hover>span,.region-map-v2204-node:focus-visible>span,.region-map-v2204-node.is-selected>span{background:#fff;color:#123b4d;border-color:var(--node-accent);box-shadow:0 7px 18px rgba(4,28,40,.3)}
@media(max-width:760px){.region-map-v2204-node.has-label>span{max-width:104px;font-size:9px;padding:3px 5px}}
.region-map-v2253-directory { margin:0 0 10px; padding:10px; border:1px solid rgba(41,118,146,.16); border-radius:16px; background:rgba(247,253,255,.94); }
.region-map-v2253-directory > header { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:8px; color:#173f52; }
.region-map-v2253-directory > header span { display:grid; gap:1px; }
.region-map-v2253-directory > header small { color:#2493bd; font-size:8px; font-weight:1000; letter-spacing:1.2px; }
.region-map-v2253-directory > header b { font-size:13px; }
.region-map-v2253-directory > header em { color:#678694; font-size:9px; font-style:normal; }
.region-map-v2253-directory > div { display:grid; grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); gap:5px; max-height:132px; overflow:auto; scrollbar-width:thin; }
.region-map-v2253-directory button { display:flex; align-items:center; gap:7px; min-width:0; padding:6px 8px; border:1px solid rgba(39,104,127,.12); border-radius:10px; background:#fff; color:#244b5c; text-align:left; cursor:pointer; }
.region-map-v2253-directory button:hover,.region-map-v2253-directory button:focus-visible { border-color:#27a2d1; background:#eefaff; outline:none; }
.region-map-v2253-directory button.is-selected { border-color:#f4a51c; background:#fff8e9; box-shadow:0 0 0 2px rgba(244,165,28,.12); }
.region-map-v2253-directory button.is-current { border-color:#28ad79; }
.region-map-v2253-directory button > i { display:grid; place-items:center; flex:0 0 25px; width:25px; height:25px; border-radius:8px; background:#eaf6fa; color:#218bb2; }
.region-map-v2253-directory button > i svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; }
.region-map-v2253-directory button > span { display:grid; min-width:0; }
.region-map-v2253-directory button b,.region-map-v2253-directory button small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.region-map-v2253-directory button b { font-size:9px; }
.region-map-v2253-directory button small { color:#78929d; font-size:7px; }
@media (max-width:760px) { .region-map-v2253-directory > div { grid-template-columns:repeat(2,minmax(0,1fr)); max-height:118px; } }

/* 2.27.1 — clean scalable Kanto overworld. */
.side-panel.is-regions-panel{width:min(1240px,calc(100vw - 48px));height:min(840px,calc(100dvh - 40px));max-height:none;left:50%;right:auto;top:50%;transform:translate(-50%,-50%)}
.side-panel.is-regions-panel .side-panel-content{height:100%;padding:0;overflow:hidden;background:#eaf5f4}
.kanto-map-v2262{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;background:linear-gradient(145deg,#f9fcf7,#e7f5f4);color:#173e4b;font-family:Inter,"Segoe UI",Arial,sans-serif}
.kanto-map-v2262 .region-map-v2204-header{min-height:70px;padding:12px 16px 11px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #c8dedf;background:rgba(252,255,252,.96);box-shadow:0 5px 18px #18465c12;box-sizing:border-box}
.kanto-map-v2262 .region-map-v2204-header>div:first-child{display:grid;grid-template-columns:auto auto;align-items:end;gap:0 10px}.kanto-map-v2262 .region-map-v2204-header>div:first-child>span{grid-column:1/-1;color:#278f91;font-size:8px;font-weight:1000;letter-spacing:.16em}.kanto-map-v2262 .region-map-v2204-header h2{margin:0;font-size:22px;line-height:1}.kanto-map-v2262 .region-map-v2204-header p{margin:0;color:#6c858c;font-size:10px;font-weight:750}
.kanto-map-v2262 .region-map-v2204-header>div:last-child{display:flex;align-items:center;gap:8px}.kanto-map-v2262 .region-map-v2204-close{width:36px;height:36px;border:0;border-radius:12px;background:#e7f0f1;color:#315965;font-size:24px;line-height:1;cursor:pointer}.kanto-map-v2262 .region-map-v2204-close:hover{background:#d8e8e9}
.kanto-map-v2262 .region-map-v2204-test-toggle{min-height:36px;padding:5px 9px;display:flex;align-items:center;gap:7px;border:1px solid #d0e0e1;border-radius:12px;background:#f6faf9;color:#496a72;cursor:pointer}.kanto-map-v2262 .region-map-v2204-test-toggle.is-active{border-color:#58b18c;background:#e8f8ef;color:#176a4b}.kanto-map-v2262 .region-map-v2204-test-toggle>i{width:20px;height:20px;display:grid;place-items:center}.kanto-map-v2262 .region-map-v2204-test-toggle svg{width:16px;height:16px}.kanto-map-v2262 .region-map-v2204-test-toggle span{display:grid;text-align:left}.kanto-map-v2262 .region-map-v2204-test-toggle b{font-size:9px}.kanto-map-v2262 .region-map-v2204-test-toggle small{font-size:7px;opacity:.72}
.kanto-map-v2262 .region-map-v2204-layout{min-height:0;padding:12px;display:grid;grid-template-columns:minmax(0,1fr) 304px;gap:12px;box-sizing:border-box}
.kanto-map-v2262 .region-map-v2204-stage{min-width:0;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:7px}.kanto-map-v2262 .region-map-v2204-toolbar{min-height:26px;display:flex;align-items:center;justify-content:space-between;gap:12px}.kanto-map-v2262 .region-map-v2204-toolbar>em{color:#69858d;font-size:8px;font-style:normal;font-weight:700;white-space:nowrap}.kanto-map-v2262 .region-map-v2204-legend{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.kanto-map-v2262 .region-map-v2204-legend span{display:flex;align-items:center;gap:4px;color:#53727b;font-size:8px;font-weight:850}.kanto-map-v2262 .region-map-v2204-legend span:before{content:"";width:8px;height:8px;border-radius:50%;background:#b9c7ca;box-shadow:0 0 0 2px #fff}.kanto-map-v2262 .region-map-v2204-legend .is-current:before{background:#ffcf39}.kanto-map-v2262 .region-map-v2204-legend .is-open:before{background:#37bd7d}.kanto-map-v2262 .region-map-v2204-legend .is-locked:before{background:#6f7e82}.kanto-map-v2262 .region-map-v2204-legend .is-route:before{background:#f3833d}
.kanto-map-v2262 .region-map-v2204-viewport{position:relative;min-height:0;overflow:hidden;border:1px solid rgba(20,82,91,.24);border-radius:18px;background:#47bde5;box-shadow:0 15px 30px #174d6224;isolation:isolate;touch-action:none;cursor:grab}.kanto-map-v2262 .region-map-v2204-viewport.is-dragging{cursor:grabbing}.kanto-map-v2262 .region-map-v2204-canvas{position:absolute;inset:0;transform:translate(var(--map-pan-x),var(--map-pan-y)) scale(var(--map-zoom));transform-origin:center;will-change:transform}.kanto-map-v2262 .region-map-v2204-canvas.is-animated{transition:transform .22s ease}.kanto-map-v2262 .region-map-v2204-canvas>img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;user-select:none;pointer-events:none}.kanto-map-v2262 .region-map-v2204-canvas>svg{position:absolute;z-index:2;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.kanto-map-v2262 .region-map-v2204-canvas>svg line{stroke:#536b70;stroke-width:3;stroke-linecap:round;stroke-dasharray:5 8;opacity:.5;vector-effect:non-scaling-stroke}.kanto-map-v2262 .region-map-v2204-canvas>svg line.is-open{stroke:#fff;stroke-width:4;opacity:.9;filter:drop-shadow(0 1px 2px #17666a)}.kanto-map-v2262 .region-map-v2204-canvas>svg line.is-planned{stroke:#ff8a3e;stroke-width:6;stroke-dasharray:10 7;opacity:1;animation:kanto-route-flow 1.2s linear infinite}
.kanto-map-v2262 .region-map-v2204-node{position:absolute;z-index:4;left:var(--node-x);top:var(--node-y);width:30px;height:30px;padding:0;display:grid;place-items:center;border:0;background:transparent;color:#1f6b80;transform:translate(-50%,-50%);cursor:pointer;overflow:visible}.kanto-map-v2262 .region-map-v2204-node>i{width:27px;height:27px;display:grid;place-items:center;border:3px solid #fff;border-radius:50%;background:#eff9f6;box-shadow:0 3px 8px #0b3f5266;transition:.18s ease}.kanto-map-v2262 .region-map-v2204-node.is-hub>i,.kanto-map-v2262 .region-map-v2204-node.is-market>i{width:33px;height:33px;background:#fff6d7;color:#bc6c21}.kanto-map-v2262 .region-map-v2204-node.is-water>i{background:#e4f8ff;color:#1788bc}.kanto-map-v2262 .region-map-v2204-node.is-special>i{background:#f2e9ff;color:#7652aa}.kanto-map-v2262 .region-map-v2204-node.is-locked>i{border-color:#d4dcdd;background:#596b70;color:#eef2f2;filter:saturate(.35)}.kanto-map-v2262 .region-map-v2204-node.is-current>i{border-color:#fff4a9;background:#ffcb35;color:#68440a;box-shadow:0 0 0 4px #fff8,0 5px 13px #6a4e1e88}.kanto-map-v2262 .region-map-v2204-node.is-selected>i{transform:scale(1.18);box-shadow:0 0 0 4px #ff8b3d99,0 6px 16px #173d5266}.kanto-map-v2262 .region-map-marker-icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.kanto-map-v2262 .region-map-v2204-node>em{position:absolute;z-index:3;right:-8px;top:-8px;width:15px;height:15px;display:grid;place-items:center;border:2px solid #fff;border-radius:50%;background:#ff7c36;color:#fff;font-size:7px;font-style:normal;font-weight:1000}.kanto-map-v2262 .region-map-v2204-node>span{position:absolute;z-index:2;left:50%;top:calc(100% + 5px);min-width:max-content;max-width:132px;padding:4px 7px;border:1px solid #fff8;border-radius:8px;background:#163f4de6;color:#fff;font-size:8px;font-weight:900;line-height:1.1;text-align:center;white-space:normal;box-shadow:0 4px 10px #102f3e55;opacity:0;pointer-events:none;transform:translate(-50%,2px);transition:.15s ease}.kanto-map-v2262 .region-map-v2204-node.has-label>span,.kanto-map-v2262 .region-map-v2204-node:hover>span,.kanto-map-v2262 .region-map-v2204-node:focus-visible>span,.kanto-map-v2262 .region-map-v2204-node.is-selected>span{opacity:1;transform:translate(-50%,0)}.kanto-map-v2262 .region-map-v2204-node:focus-visible{outline:3px solid #fff;outline-offset:5px;border-radius:50%}
.kanto-map-v2262 .region-map-v2204-zoom{position:absolute;z-index:8;right:10px;bottom:10px;display:flex;align-items:center;overflow:hidden;border:1px solid #d5e4e4;border-radius:12px;background:#fffffff2;box-shadow:0 5px 16px #133d5033}.kanto-map-v2262 .region-map-v2204-zoom button,.kanto-map-v2262 .region-map-v2204-zoom output{height:34px;padding:0 10px;display:grid;place-items:center;border:0;border-right:1px solid #e0ebeb;background:transparent;color:#295562;font:900 11px inherit}.kanto-map-v2262 .region-map-v2204-zoom button{cursor:pointer}.kanto-map-v2262 .region-map-v2204-zoom button:hover{background:#edf7f5}.kanto-map-v2262 .region-map-v2204-zoom button:last-child{display:flex;gap:5px;border-right:0}.kanto-map-v2262 .region-map-v2204-zoom svg{width:15px;height:15px}.kanto-map-v2262 .region-map-v2204-mobile-hint{color:#6a858d;font-size:8px;text-align:center}
.kanto-map-v2262 .region-map-v2204-sidebar{min-height:0;display:grid;align-content:start;gap:8px;overflow:auto;scrollbar-width:thin;padding-right:2px}.kanto-map-v2262 .region-map-v2204-selection,.kanto-map-v2262 .region-route-v2204,.kanto-map-v2262 .region-teleport-v2204{padding:12px;border:1px solid #cfdfdf;border-radius:16px;background:#fff;box-shadow:0 7px 18px #163d4e12}.kanto-map-v2262 .region-map-v2204-selection>header{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:8px}.kanto-map-v2262 .region-map-v2204-selection>header span{display:grid;min-width:0}.kanto-map-v2262 .region-map-v2204-selection>header small,.kanto-map-v2262 .region-route-v2204 header small,.kanto-map-v2262 .region-teleport-v2204 header small{color:#2c9795;font-size:7px;font-weight:1000;letter-spacing:.12em}.kanto-map-v2262 .region-map-v2204-selection>header b{font-size:16px;line-height:1.1}.kanto-map-v2262 .region-map-v2204-selection>header>i{width:35px;height:35px;display:grid;place-items:center;border-radius:11px;background:#eaf7f5;color:var(--region-accent)}.kanto-map-v2262 .region-map-v2204-selection>header svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8}.kanto-map-v2262 .region-map-v2204-selection-copy>p,.kanto-map-v2262 .region-route-v2204>p,.kanto-map-v2262 .region-teleport-v2204>p{margin:0 0 8px;color:#617980;font-size:9px;line-height:1.4}.kanto-map-v2262 .region-map-v2204-selection-copy>div{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px}.kanto-map-v2262 .region-map-v2204-selection-copy>div>span{padding:6px 7px;display:grid;border-radius:9px;background:#eef6f5}.kanto-map-v2262 .region-map-v2204-selection-copy small{color:#789096;font-size:6px;font-weight:900}.kanto-map-v2262 .region-map-v2204-selection-copy b{font-size:9px}.kanto-map-v2262 .region-map-v2204-selection-copy ul{margin:0 0 8px;padding:0;display:flex;gap:4px;flex-wrap:wrap;list-style:none}.kanto-map-v2262 .region-map-v2204-selection-copy li{padding:4px 6px;border-radius:8px;background:#eef8ee;color:#3b7050;font-size:7px;font-weight:800}.kanto-map-v2262 .region-map-v2204-primary{width:100%;min-height:40px;padding:7px 9px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:0;border-radius:11px;background:linear-gradient(120deg,#1591a8,#1eb47e);color:#fff;cursor:pointer}.kanto-map-v2262 .region-map-v2204-primary:disabled{background:#d1dddd;color:#7b9296;cursor:not-allowed}.kanto-map-v2262 .region-map-v2204-primary span{display:grid;text-align:left}.kanto-map-v2262 .region-map-v2204-primary small{color:inherit;font-size:6px;opacity:.8}.kanto-map-v2262 .region-map-v2204-primary b{font-size:9px}.kanto-map-v2262 .region-map-v2204-primary svg{width:18px;height:18px}
.kanto-map-v2262 .region-route-v2204>header,.kanto-map-v2262 .region-teleport-v2204>header{display:flex;align-items:center;gap:8px}.kanto-map-v2262 .region-route-v2204>header>span,.kanto-map-v2262 .region-teleport-v2204>header>span{min-width:0;display:grid;flex:1}.kanto-map-v2262 .region-route-v2204 header b,.kanto-map-v2262 .region-teleport-v2204 header b{font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kanto-map-v2262 .region-route-v2204 header em,.kanto-map-v2262 .region-teleport-v2204 header em{padding:4px 7px;border-radius:8px;background:#edf6f4;color:#2b7774;font-size:8px;font-style:normal;font-weight:900}.kanto-map-v2262 .region-route-v2204 details{font-size:8px}.kanto-map-v2262 .region-route-v2204 summary{color:#187d92;font-weight:900;cursor:pointer}.kanto-map-v2262 .region-route-v2204 ol{max-height:100px;margin:7px 0 0;padding:0;display:grid;gap:4px;overflow:auto;list-style:none}.kanto-map-v2262 .region-route-v2204 li{display:flex;align-items:center;gap:6px}.kanto-map-v2262 .region-route-v2204 li>i{width:17px;height:17px;display:grid;place-items:center;border-radius:50%;background:#eaf3f3;font-style:normal;font-size:7px}.kanto-map-v2262 .region-route-v2204 li>span{display:grid}.kanto-map-v2262 .region-route-v2204 li b{font-size:8px}.kanto-map-v2262 .region-route-v2204 li small{color:#789095;font-size:6px}
.kanto-map-v2262 .region-teleport-v2204>header>i{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:#eee8ff;color:#7154ae}.kanto-map-v2262 .region-teleport-glyph{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7}.kanto-map-v2262 .region-teleport-v2204-sources,.kanto-map-v2262 .region-teleport-v2204-destinations{display:grid;gap:5px}.kanto-map-v2262 .region-teleport-v2204-source,.kanto-map-v2262 .region-teleport-v2204-destination,.kanto-map-v2262 .region-teleport-v2204-empty{min-height:38px;padding:5px 7px;display:flex;align-items:center;gap:7px;border:1px solid #d9e6e5;border-radius:10px;background:#f8fbfa;color:#355a62;text-align:left}.kanto-map-v2262 button.region-teleport-v2204-source,.kanto-map-v2262 button.region-teleport-v2204-destination{cursor:pointer}.kanto-map-v2262 .region-teleport-v2204-source.is-selected{border-color:#7b65c6;background:#f2efff}.kanto-map-v2262 .region-teleport-v2204-source>span,.kanto-map-v2262 .region-teleport-v2204-destination>span,.kanto-map-v2262 .region-teleport-v2204-empty>span{min-width:0;display:grid;flex:1}.kanto-map-v2262 .region-teleport-v2204-source b,.kanto-map-v2262 .region-teleport-v2204-destination b,.kanto-map-v2262 .region-teleport-v2204-empty b{font-size:8px}.kanto-map-v2262 .region-teleport-v2204-source small,.kanto-map-v2262 .region-teleport-v2204-destination small,.kanto-map-v2262 .region-teleport-v2204-empty small{color:#789095;font-size:6px}.kanto-map-v2262 .region-teleport-v2204-destination>i,.kanto-map-v2262 .region-teleport-v2204-empty>i{width:24px;height:24px;display:grid;place-items:center}.kanto-map-v2262 .region-teleport-v2204-destination>i svg,.kanto-map-v2262 .region-teleport-v2204-empty>i svg{width:18px;height:18px}.kanto-map-v2262 .region-teleport-v2204-destination>em{font-size:6px;font-style:normal;font-weight:900}.kanto-map-v2262 .region-teleport-v2204-destination:disabled{opacity:.5;cursor:not-allowed}
@keyframes kanto-route-flow{to{stroke-dashoffset:-34}}
@media(max-width:900px){.side-panel.is-regions-panel{width:calc(100vw - 16px);height:calc(100dvh - 24px)}.kanto-map-v2262 .region-map-v2204-layout{grid-template-columns:minmax(0,1fr) 250px}.kanto-map-v2262 .region-map-v2204-header p{display:none}}
@media(max-width:700px){.side-panel.is-regions-panel{inset:4px 4px calc(72px + env(safe-area-inset-bottom)) 4px;width:auto;height:auto;transform:none;border-radius:18px}.kanto-map-v2262{overflow:auto}.kanto-map-v2262 .region-map-v2204-header{position:sticky;z-index:20;top:0;min-height:58px;padding:9px 10px}.kanto-map-v2262 .region-map-v2204-header h2{font-size:18px}.kanto-map-v2262 .region-map-v2204-test-toggle span{display:none}.kanto-map-v2262 .region-map-v2204-layout{padding:8px;display:block}.kanto-map-v2262 .region-map-v2204-toolbar{padding:0 2px}.kanto-map-v2262 .region-map-v2204-toolbar>em{display:none}.kanto-map-v2262 .region-map-v2204-legend{gap:7px}.kanto-map-v2262 .region-map-v2204-viewport{height:min(57dvh,520px);min-height:360px;border-radius:14px}.kanto-map-v2262 .region-map-v2204-sidebar{margin-top:8px;overflow:visible}.kanto-map-v2262 .region-map-v2204-node{width:26px;height:26px}.kanto-map-v2262 .region-map-v2204-node>i{width:23px;height:23px;border-width:2px}.kanto-map-v2262 .region-map-v2204-node.is-hub>i,.kanto-map-v2262 .region-map-v2204-node.is-market>i{width:28px;height:28px}.kanto-map-v2262 .region-map-v2204-node>span{max-width:104px;font-size:7px}.kanto-map-v2262 .region-map-v2204-zoom{right:6px;bottom:6px}.kanto-map-v2262 .region-map-v2204-zoom button,.kanto-map-v2262 .region-map-v2204-zoom output{height:31px;padding:0 8px}.kanto-map-v2262 .region-map-v2204-zoom button:last-child span{display:none}}
@media(prefers-reduced-motion:reduce){.kanto-map-v2262 .region-map-v2204-canvas.is-animated{transition:none}.kanto-map-v2262 .region-map-v2204-canvas>svg line.is-planned{animation:none}}

/* The atlas and its markers share one fixed 3:2 coordinate plane. This keeps
   every route aligned with the illustration on wide screens and phones. */
.kanto-map-v2262 .region-map-v2204-stage{grid-template-rows:auto auto auto;align-content:center}
.kanto-map-v2262 .region-map-v2204-viewport{width:min(100%,calc((100dvh - 210px)*1.5));max-width:100%;aspect-ratio:3/2;margin-inline:auto}
.kanto-map-v2262 .region-map-v2204-canvas>img{object-fit:fill}
.kanto-map-v2262 .region-map-v2204-legend .is-future:before{background:#9786bb}
.kanto-map-v2262 .region-map-v2204-canvas>svg line.is-future-link{stroke:#665e78;stroke-width:2;stroke-dasharray:3 7;opacity:.46}
.kanto-map-v2262 .region-map-v2204-node.is-stadium>i{width:25px;height:25px;background:#fff1df;color:#c35b35}
.kanto-map-v2262 .region-map-v2204-node.is-future>i{width:20px;height:20px;border-width:2px;border-style:dashed;border-color:#e7e1ef;background:#716888;color:#f4f1fa;opacity:.88}
.kanto-map-v2262 .region-map-v2204-node.is-future.is-stadium>i{width:22px;height:22px}
.kanto-map-v2262 .region-map-v2204-node.is-future .region-map-marker-icon{width:13px;height:13px}
.kanto-map-v2262 .region-map-v2204-node.is-future>span{background:#4f4963eb}
.kanto-map-v2262 .region-map-v2204-selection.is-future{border-style:dashed}
.kanto-map-v2262 .region-map-v2204-selection.is-future>header>i{background:#eeeaf6;color:#716888}
@media(max-width:700px){.kanto-map-v2262 .region-map-v2204-viewport{width:100%;height:auto;min-height:0;aspect-ratio:3/2}}

/* Readable map typography and a compact two-column teleport chooser. */
.kanto-map-v2262 .region-map-v2204-header>div:first-child>span{font-size:9px}
.kanto-map-v2262 .region-map-v2204-header p{font-size:11px}
.kanto-map-v2262 .region-map-v2204-legend span,.kanto-map-v2262 .region-map-v2204-toolbar>em{font-size:9px}
.kanto-map-v2262 .region-map-v2262-search{height:28px;min-width:170px;padding:0 8px;display:flex;align-items:center;gap:6px;border:1px solid #cbdedf;border-radius:9px;background:#fff;color:#618088}.kanto-map-v2262 .region-map-v2262-search svg{width:14px;height:14px;flex:0 0 auto}.kanto-map-v2262 .region-map-v2262-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#244d58;font:750 9px/1 Inter,"Segoe UI",sans-serif}.kanto-map-v2262 .region-map-v2262-search input::placeholder{color:#80979c}.kanto-map-v2262 .region-map-v2204-node.is-search-muted{opacity:.12;pointer-events:none}.kanto-map-v2262 .region-map-v2204-node.is-search-match{z-index:7}.kanto-map-v2262 .region-map-v2204-node.is-search-match>i{box-shadow:0 0 0 4px #fff9,0 0 0 7px #29b7a0,0 8px 18px #173d5266}.kanto-map-v2262 .region-map-v2204-node.is-search-match>span{opacity:1;transform:translate(-50%,0)}
.kanto-map-v2262 .region-map-v2204-node>span{font-size:9px;line-height:1.2}
.kanto-map-v2262 .region-map-v2204-selection>header small,.kanto-map-v2262 .region-route-v2204 header small,.kanto-map-v2262 .region-teleport-v2204 header small{font-size:8px}
.kanto-map-v2262 .region-map-v2204-selection-copy>p,.kanto-map-v2262 .region-route-v2204>p,.kanto-map-v2262 .region-teleport-v2204>p{font-size:10.5px;line-height:1.45}
.kanto-map-v2262 .region-map-v2204-selection-copy small{font-size:7px}
.kanto-map-v2262 .region-map-v2204-selection-copy b,.kanto-map-v2262 .region-map-v2204-primary b{font-size:10px}
.kanto-map-v2262 .region-map-v2204-primary small{font-size:7px}
.kanto-map-v2262 .region-route-v2204 header b,.kanto-map-v2262 .region-teleport-v2204 header b{font-size:11px}
.kanto-map-v2262 .region-teleport-v2204-destinations{grid-template-columns:repeat(2,minmax(0,1fr))}
.kanto-map-v2262 .region-teleport-v2204-destination{min-width:0}
.kanto-map-v2262 .region-teleport-v2204-destination.is-home{grid-column:1/-1}
.kanto-map-v2262 .region-teleport-v2204-source b,.kanto-map-v2262 .region-teleport-v2204-destination b,.kanto-map-v2262 .region-teleport-v2204-empty b{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kanto-map-v2262 .region-teleport-v2204-source small,.kanto-map-v2262 .region-teleport-v2204-destination small,.kanto-map-v2262 .region-teleport-v2204-empty small{font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:700px){.kanto-map-v2262 .region-map-v2204-header>div:first-child>span{font-size:8px}.kanto-map-v2262 .region-map-v2204-node>span{font-size:7px}.kanto-map-v2262 .region-map-v2204-legend span{font-size:7px}}
@media(max-width:1400px){.kanto-map-v2262 .region-map-v2204-toolbar>em{display:none}}
@media(max-width:700px){.kanto-map-v2262 .region-map-v2204-toolbar{align-items:flex-start;flex-wrap:wrap}.kanto-map-v2262 .region-map-v2262-search{width:100%;order:2;box-sizing:border-box}}
@media(max-width:700px){
  .kanto-map-v2262 .region-map-v2204-node>i{width:18px;height:18px}
  .kanto-map-v2262 .region-map-v2204-node.is-hub>i,.kanto-map-v2262 .region-map-v2204-node.is-market>i{width:22px;height:22px}
  .kanto-map-v2262 .region-map-v2204-node.is-stadium>i{width:17px;height:17px}
  .kanto-map-v2262 .region-map-v2204-node.is-future>i{width:14px;height:14px}
  .kanto-map-v2262 .region-map-v2204-node.is-future.is-stadium>i{width:15px;height:15px}
  .kanto-map-v2262 .region-map-v2204-node.is-current>i{width:26px;height:26px}
  .kanto-map-v2262 .region-map-v2204-node .region-map-marker-icon{width:12px;height:12px}
  .kanto-map-v2262 .region-map-v2204-node.has-label:not(.is-current):not(.is-selected):not(.is-search-match)>span{opacity:0;transform:translate(-50%,2px)}
  .kanto-map-v2262 .region-map-v2204-canvas>svg line.is-future-link{opacity:.28}
}

/* 2.27.2 — quiet atlas UI: one active route, compact controls and flag marker. */
.kanto-map-v2272 .region-map-v2204-header{min-height:58px;padding:9px 12px 9px 16px}
.kanto-map-v2272 .region-map-v2204-header>div:first-child{display:block}
.kanto-map-v2272 .region-map-v2204-header>div:first-child>span{display:block;margin-bottom:2px;font-size:8px}
.kanto-map-v2272 .region-map-v2204-header h2{font-size:20px;line-height:1.05}
.kanto-map-v2272 .region-map-v2272-progress{min-height:34px;padding:0 11px;display:flex;align-items:center;gap:5px;border:1px solid #d5e4e2;border-radius:11px;background:#f5faf8;color:#55737a}
.kanto-map-v2272 .region-map-v2272-progress b{color:#187e74;font-size:14px}.kanto-map-v2272 .region-map-v2272-progress small{font-size:8px;font-weight:850}
.kanto-map-v2272 .region-map-v2204-layout{padding:10px;grid-template-columns:minmax(0,1fr) 286px;gap:10px}
.kanto-map-v2272 .region-map-v2204-stage{grid-template-rows:minmax(0,1fr) auto;align-content:stretch;gap:6px}
.kanto-map-v2272 .region-map-v2204-viewport{width:min(100%,calc((100dvh - 140px)*1.5));box-shadow:0 11px 28px #174d6220}
.kanto-map-v2272 .region-map-v2272-floating{position:absolute;z-index:12;top:9px;left:9px;right:9px;display:flex;align-items:flex-start;justify-content:space-between;gap:8px;pointer-events:none}
.kanto-map-v2272 .region-map-v2272-search{width:min(310px,calc(100% - 52px));height:36px;padding:0 8px 0 10px;display:flex;align-items:center;gap:7px;border:1px solid #d5e4e2;border-radius:12px;background:#fffffff2;color:#607b82;box-shadow:0 5px 16px #133d5030;box-sizing:border-box;pointer-events:auto;backdrop-filter:blur(9px)}
.kanto-map-v2272 .region-map-v2272-search>svg{width:15px;height:15px;flex:0 0 auto}.kanto-map-v2272 .region-map-v2272-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#214b57;font:800 10px/1 Inter,"Segoe UI",sans-serif}.kanto-map-v2272 .region-map-v2272-search input::placeholder{color:#789096}.kanto-map-v2272 .region-map-v2272-search input::-webkit-search-cancel-button{display:none}.kanto-map-v2272 .region-map-v2272-search button{width:22px;height:22px;padding:0;border:0;border-radius:7px;background:#e8f1f0;color:#557078;font:900 15px/1 Inter,sans-serif;cursor:pointer}.kanto-map-v2272 .region-map-v2272-search output{padding-left:7px;border-left:1px solid #dbe7e6;color:#71898f;font-size:7px;font-weight:900;white-space:nowrap}
.kanto-map-v2272 .region-map-v2272-key{position:relative;pointer-events:auto}.kanto-map-v2272 .region-map-v2272-key>summary{width:36px;height:36px;display:grid;place-items:center;border:1px solid #d5e4e2;border-radius:12px;background:#fffffff2;color:#44666f;box-shadow:0 5px 16px #133d5030;cursor:pointer;list-style:none;backdrop-filter:blur(9px)}.kanto-map-v2272 .region-map-v2272-key>summary::-webkit-details-marker{display:none}.kanto-map-v2272 .region-map-v2272-key>summary i{width:18px;height:18px;display:grid;place-items:center;border:2px solid currentColor;border-radius:50%;font-size:10px;font-style:normal;font-weight:1000}.kanto-map-v2272 .region-map-v2272-key>summary span{display:none}
.kanto-map-v2272 .region-map-v2272-key>div{position:absolute;top:42px;right:0;width:148px;padding:9px;display:grid;gap:8px;border:1px solid #d5e4e2;border-radius:12px;background:#fffffff5;box-shadow:0 9px 24px #133d5040;box-sizing:border-box}.kanto-map-v2272 .region-map-v2204-legend span{font-size:8px}
.kanto-map-v2272 .region-map-v2204-canvas>svg polyline.is-active-route{fill:none;stroke:#ff873d;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;opacity:.92;filter:drop-shadow(0 1px 2px #fff) drop-shadow(0 2px 2px #17666a);vector-effect:non-scaling-stroke;animation:kanto-route-flow 1.6s linear infinite;stroke-dasharray:9 7}
.kanto-map-v2272 .region-map-v2204-node{width:26px;height:26px;color:#236579}.kanto-map-v2272 .region-map-v2204-node>i{width:21px;height:21px;border-width:2px;background:#f7fcfa;box-shadow:0 2px 6px #0b3f5255}.kanto-map-v2272 .region-map-v2204-node.is-route>i{width:16px;height:16px;color:#47717b}.kanto-map-v2272 .region-map-v2204-node.is-hub>i,.kanto-map-v2272 .region-map-v2204-node.is-market>i{width:26px;height:26px}.kanto-map-v2272 .region-map-v2204-node.is-stadium>i{width:21px;height:21px}.kanto-map-v2272 .region-map-v2204-node.is-locked>i{border-color:#f1f5f4;background:#64777b;color:#e8eeee;filter:saturate(.35);opacity:.78}.kanto-map-v2272 .region-map-v2204-node.is-future>i{width:12px;height:12px;border:2px solid #f1edf5;background:#716988;color:transparent;opacity:.7}.kanto-map-v2272 .region-map-v2204-node.is-future .region-map-marker-icon{display:none}.kanto-map-v2272 .region-map-v2204-node.is-current{z-index:9}.kanto-map-v2272 .region-map-v2204-node.is-current>i{width:34px;height:34px;border:3px solid #fff9b6;border-radius:12px 12px 12px 3px;background:#ffca34;color:#684309;box-shadow:0 0 0 4px #fff9,0 6px 15px #5d421e80;transform:rotate(-4deg)}.kanto-map-v2272 .region-map-v2204-node.is-current .region-map-marker-icon{width:21px;height:21px;transform:rotate(4deg)}.kanto-map-v2272 .region-map-v2204-node.is-selected:not(.is-current)>i{transform:scale(1.12);box-shadow:0 0 0 3px #fff9,0 0 0 6px #ff8b3dcc,0 6px 14px #173d5266}.kanto-map-v2272 .region-map-v2204-node.is-on-route{z-index:6}
.kanto-map-v2272 .region-map-v2204-node>em{right:-6px;top:-6px;width:13px;height:13px;border-width:1px;background:#f47732;font-size:6px}.kanto-map-v2272 .region-map-v2204-node>span{top:calc(100% + 6px);max-width:145px;padding:5px 8px;font-size:9px;opacity:0}.kanto-map-v2272 .region-map-v2204-node:hover>span,.kanto-map-v2272 .region-map-v2204-node:focus-visible>span,.kanto-map-v2272 .region-map-v2204-node.is-selected>span{opacity:1;transform:translate(-50%,0)}.kanto-map-v2272 .region-map-v2204-node.is-label-left>span{left:50%;transform:translate(0,2px)}.kanto-map-v2272 .region-map-v2204-node.is-label-left:hover>span,.kanto-map-v2272 .region-map-v2204-node.is-label-left:focus-visible>span,.kanto-map-v2272 .region-map-v2204-node.is-label-left.is-selected>span{transform:translate(0,0)}.kanto-map-v2272 .region-map-v2204-node.is-label-right>span{left:auto;right:50%;transform:translate(0,2px)}.kanto-map-v2272 .region-map-v2204-node.is-label-right:hover>span,.kanto-map-v2272 .region-map-v2204-node.is-label-right:focus-visible>span,.kanto-map-v2272 .region-map-v2204-node.is-label-right.is-selected>span{transform:translate(0,0)}.kanto-map-v2272 .region-map-v2204-node.is-label-top>span{top:auto;bottom:calc(100% + 6px)}
.kanto-map-v2272 .region-map-v2204-node.is-search-muted{opacity:.1;pointer-events:none}.kanto-map-v2272 .region-map-v2204-node.is-search-match{z-index:7}.kanto-map-v2272 .region-map-v2204-node.is-search-match>i{box-shadow:0 0 0 3px #fff9,0 0 0 6px #28b89f,0 6px 14px #173d5266}.kanto-map-v2272 .region-map-v2204-node.is-search-match>span{opacity:0}.kanto-map-v2272 .region-map-v2204-node.is-search-match.is-selected>span{opacity:1}
.kanto-map-v2272 .region-map-v2272-help{position:absolute;z-index:8;left:10px;bottom:10px;padding:6px 8px;border-radius:9px;background:#183f4db8;color:#fff;font-size:8px;font-weight:800;pointer-events:none;backdrop-filter:blur(5px)}
.kanto-map-v2272 .region-map-v2204-zoom{right:10px;bottom:10px}.kanto-map-v2272 .region-map-v2204-sidebar{gap:7px}.kanto-map-v2272 .region-map-v2204-selection,.kanto-map-v2272 .region-route-v2204,.kanto-map-v2272 .region-teleport-v2204{padding:10px;border-radius:14px;box-shadow:0 5px 14px #163d4e10}.kanto-map-v2272 .region-map-v2204-selection>header{margin-bottom:6px}.kanto-map-v2272 .region-map-v2204-selection-copy>p,.kanto-map-v2272 .region-route-v2204>p{margin-bottom:6px;font-size:9.5px}.kanto-map-v2272 .region-map-v2204-selection-copy ul{display:none}.kanto-map-v2272 .region-map-v2204-selection-copy>div{margin-bottom:6px}.kanto-map-v2272 .region-route-v2204 details ol{max-height:84px}
.kanto-map-v2272 .region-teleport-v2204>details>summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none}.kanto-map-v2272 .region-teleport-v2204>details>summary::-webkit-details-marker{display:none}.kanto-map-v2272 .region-teleport-v2204>details>summary>i{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:#eee8ff;color:#7154ae}.kanto-map-v2272 .region-teleport-v2204>details>summary>span{min-width:0;display:grid;flex:1}.kanto-map-v2272 .region-teleport-v2204>details>summary small{color:#2c9795;font-size:8px;font-weight:1000;letter-spacing:.12em}.kanto-map-v2272 .region-teleport-v2204>details>summary b{font-size:11px}.kanto-map-v2272 .region-teleport-v2204>details>summary em{padding:4px 7px;border-radius:8px;background:#edf6f4;color:#2b7774;font-size:8px;font-style:normal;font-weight:900}.kanto-map-v2272 .region-teleport-v2204>details>summary:after{content:"⌄";color:#6b858b;font-size:14px;transition:transform .16s}.kanto-map-v2272 .region-teleport-v2204>details[open]>summary:after{transform:rotate(180deg)}.kanto-map-v2272 .region-teleport-v2272-content{margin-top:9px;padding-top:9px;border-top:1px solid #e2eceb}.kanto-map-v2272 .region-teleport-v2272-content>p{margin:0 0 7px;color:#617980;font-size:9px;line-height:1.4}.kanto-map-v2272 .region-teleport-v2272-content .region-map-v2204-test-toggle{width:100%;margin-top:7px;box-sizing:border-box}
@media(max-width:900px){.kanto-map-v2272 .region-map-v2204-layout{grid-template-columns:minmax(0,1fr) 250px}.kanto-map-v2272 .region-map-v2272-progress small{display:none}}
@media(max-width:700px){.kanto-map-v2272 .region-map-v2204-header{min-height:52px;padding:7px 9px 7px 12px}.kanto-map-v2272 .region-map-v2204-header h2{font-size:17px}.kanto-map-v2272 .region-map-v2272-progress{min-height:32px;padding:0 8px}.kanto-map-v2272 .region-map-v2204-layout{padding:7px;display:block}.kanto-map-v2272 .region-map-v2204-stage{display:grid}.kanto-map-v2272 .region-map-v2204-viewport{width:100%;height:auto;min-height:0;aspect-ratio:3/2}.kanto-map-v2272 .region-map-v2272-floating{top:6px;left:6px;right:6px}.kanto-map-v2272 .region-map-v2272-search{width:calc(100% - 43px);height:32px}.kanto-map-v2272 .region-map-v2272-search output{display:none}.kanto-map-v2272 .region-map-v2272-key>summary{width:32px;height:32px}.kanto-map-v2272 .region-map-v2272-key>div{top:38px}.kanto-map-v2272 .region-map-v2204-node{width:22px;height:22px}.kanto-map-v2272 .region-map-v2204-node>i{width:16px;height:16px}.kanto-map-v2272 .region-map-v2204-node.is-hub>i,.kanto-map-v2272 .region-map-v2204-node.is-market>i{width:21px;height:21px}.kanto-map-v2272 .region-map-v2204-node.is-current>i{width:28px;height:28px}.kanto-map-v2272 .region-map-v2204-node.is-future>i{width:9px;height:9px}.kanto-map-v2272 .region-map-v2204-node .region-map-marker-icon{width:11px;height:11px}.kanto-map-v2272 .region-map-v2204-node.is-current .region-map-marker-icon{width:17px;height:17px}.kanto-map-v2272 .region-map-v2204-canvas>svg polyline.is-active-route{stroke-width:3}.kanto-map-v2272 .region-map-v2272-help{display:none}.kanto-map-v2272 .region-map-v2204-sidebar{margin-top:7px}.kanto-map-v2272 .region-map-v2204-node>span{max-width:108px;font-size:8px}}
@media(prefers-reduced-motion:reduce){.kanto-map-v2272 .region-map-v2204-canvas>svg polyline.is-active-route{animation:none}}

/* 2.29.2 — unified Kanto points, route tracking and visual teleport hub. */
.kanto-map-v2292 .region-map-v2204-node{width:24px;height:24px;color:#315f67}
.kanto-map-v2292 .region-map-v2204-node>i{width:11px;height:11px;border:2px solid #fff;border-radius:50%;background:#409b83;box-shadow:0 0 0 1px #215b6673,0 2px 5px #163d505c}
.kanto-map-v2292 .region-map-v2204-node>i::after{content:"";width:3px;height:3px;border-radius:50%;background:#fff9;box-shadow:inset 0 0 0 1px #fff6}
.kanto-map-v2292 .region-map-v2204-node .region-map-marker-icon{display:none}
.kanto-map-v2292 .region-map-v2204-node.is-hub>i,.kanto-map-v2292 .region-map-v2204-node.is-market>i,.kanto-map-v2292 .region-map-v2204-node.is-stadium>i{width:16px;height:16px;background:#eea94d}
.kanto-map-v2292 .region-map-v2204-node.is-market>i{background:#ec8258}
.kanto-map-v2292 .region-map-v2204-node.is-stadium>i{background:#c87bba}
.kanto-map-v2292 .region-map-v2204-node.is-water>i{background:#43a9c8}
.kanto-map-v2292 .region-map-v2204-node.is-special>i{background:#796fc3}
.kanto-map-v2292 .region-map-v2204-node.is-locked>i{border-color:#f5f7f5;background:#7d8b8c;filter:none;opacity:.78}
.kanto-map-v2292 .region-map-v2204-node.is-future>i{width:8px;height:8px;border:2px solid #e9edf0;background:#657279;color:transparent;opacity:.72}
.kanto-map-v2292 .region-map-v2204-node.is-selected:not(.is-current)>i{transform:scale(1.1);box-shadow:0 0 0 3px #fff,0 0 0 6px #ff873dcc,0 4px 10px #173d5266}
.kanto-map-v2292 .region-map-v2204-node.is-tracked:not(.is-current)>i{box-shadow:0 0 0 3px #fff,0 0 0 7px #1dc6a999,0 5px 13px #173d5266}
.kanto-map-v2292 .region-map-v2204-node.is-current>i{width:31px;height:31px;border:3px solid #fff3a9;border-radius:11px 11px 11px 3px;background:linear-gradient(145deg,#ffe46b,#f7b91d);color:#6d4a08;box-shadow:0 0 0 3px #fff,0 7px 16px #5d421e80;transform:rotate(-3deg)}
.kanto-map-v2292 .region-map-v2204-node.is-current>i::after{display:none}
.kanto-map-v2292 .region-map-v2204-node.is-current .region-map-marker-icon{display:block;width:19px;height:19px;transform:rotate(3deg)}
.kanto-map-v2292 .region-map-v2204-node.is-current .region-map-marker-icon .marker-fill{fill:currentColor;stroke:none}
.kanto-map-v2292 .region-map-v2204-node>em{right:-5px;top:-7px;width:13px;height:13px;font-size:6px}
.kanto-map-v2292 .region-map-v2204-node>span{max-width:122px;padding:4px 7px;border:1px solid #dbe6e5;background:#fffef7f2;color:#254e57;font-size:7px;line-height:1.15;box-shadow:0 3px 9px #163d5030;opacity:0}
.kanto-map-v2292 .region-map-v2204-canvas.is-labels-major .region-map-v2204-node:is(.is-hub,.is-market)>span,
.kanto-map-v2292 .region-map-v2204-canvas.is-labels-all .region-map-v2204-node:not(.is-future)>span,
.kanto-map-v2292 .region-map-v2204-canvas.is-labels-planned .region-map-v2204-node.is-future>span{opacity:.92;transform:translate(-50%,0)}
.kanto-map-v2292 .region-map-v2204-canvas:is(.is-labels-major,.is-labels-all,.is-labels-planned) .region-map-v2204-node.is-label-left>span{transform:translate(0,0)}
.kanto-map-v2292 .region-map-v2204-canvas:is(.is-labels-major,.is-labels-all,.is-labels-planned) .region-map-v2204-node.is-label-right>span{transform:translate(0,0)}
.kanto-map-v2292 .region-map-v2204-node:hover>span,.kanto-map-v2292 .region-map-v2204-node:focus-visible>span,.kanto-map-v2292 .region-map-v2204-node.is-selected>span,.kanto-map-v2292 .region-map-v2204-node.is-tracked>span,.kanto-map-v2292 .region-map-v2204-node.is-current>span{opacity:1}
.kanto-map-v2292 .region-map-v2204-legend .is-hub::before{background:#eea94d}

.kanto-map-v2292 .region-map-v2292-search{position:relative;height:auto;padding:0;border:0;background:transparent;box-shadow:none;display:block;overflow:visible}
.kanto-map-v2292 .region-map-v2292-search-field{width:100%;height:36px;padding:0 8px 0 10px;display:flex;align-items:center;gap:7px;border:1px solid #d5e4e2;border-radius:12px;background:#fffffff4;color:#607b82;box-shadow:0 5px 16px #133d5030;box-sizing:border-box;backdrop-filter:blur(9px)}
.kanto-map-v2292 .region-map-v2292-search-field>.ui-icon{width:15px;height:15px;flex:0 0 auto}
.kanto-map-v2292 .region-map-v2292-search-field input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#214b57;font:800 10px/1 Inter,"Segoe UI",sans-serif}
.kanto-map-v2292 .region-map-v2292-search-field input::placeholder{color:#789096}
.kanto-map-v2292 .region-map-v2292-search-field input::-webkit-search-cancel-button{display:none}
.kanto-map-v2292 .region-map-v2292-search-field>button{width:22px;height:22px;padding:0;border:0;border-radius:7px;background:#e8f1f0;color:#557078;font:900 15px/1 Inter,sans-serif}
.kanto-map-v2292 .region-map-v2292-search-field>output{min-width:18px;padding-left:7px;border-left:1px solid #dbe7e6;color:#58747b;font-size:8px;font-weight:950;text-align:center;white-space:nowrap}
.kanto-map-v2292 .region-map-v2292-search-results{position:absolute;z-index:20;top:42px;left:0;width:100%;max-height:232px;padding:5px;display:grid;gap:3px;overflow:auto;border:1px solid #d4e3e1;border-radius:12px;background:#fffffff8;box-shadow:0 12px 30px #143d5052;box-sizing:border-box;backdrop-filter:blur(12px)}
.kanto-map-v2292 .region-map-v2292-search-results[hidden]{display:none}
.kanto-map-v2292 .region-map-v2292-search-results>button{min-height:36px;padding:5px 7px;display:flex;align-items:center;gap:7px;border:0;border-radius:9px;background:transparent;color:#315861;text-align:left}
.kanto-map-v2292 .region-map-v2292-search-results>button:hover,.kanto-map-v2292 .region-map-v2292-search-results>button:focus-visible{background:#eaf6f3}
.kanto-map-v2292 .region-map-v2292-search-results>button span{min-width:0;display:grid;flex:1}
.kanto-map-v2292 .region-map-v2292-search-results>button b{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kanto-map-v2292 .region-map-v2292-search-results>button small{color:#789095;font-size:7px}
.kanto-map-v2292 .region-map-v2292-search-results>button svg{width:13px;height:13px}
.kanto-map-v2292 .region-map-v2292-search-results>p{margin:0;padding:9px;display:grid;color:#47636a;text-align:left}
.kanto-map-v2292 .region-map-v2292-search-results>p b{font-size:10px}.kanto-map-v2292 .region-map-v2292-search-results>p small{margin-top:2px;color:#809399;font-size:7px}

.kanto-map-v2292 .region-map-v2204-selection-copy>.region-map-v2292-actions{margin:0;display:grid;grid-template-columns:minmax(105px,.72fr) minmax(0,1.28fr);gap:6px;background:transparent;padding:0}
.kanto-map-v2292 .region-map-v2292-track{min-height:40px;padding:6px 8px;display:flex;align-items:center;gap:6px;border:1px solid #cfe0de;border-radius:11px;background:#f2f8f6;color:#2b6767;text-align:left}
.kanto-map-v2292 .region-map-v2292-track.is-active{border-color:#25aa91;background:#e0f7f0;color:#147663}
.kanto-map-v2292 .region-map-v2292-track:disabled{opacity:.48;cursor:not-allowed}
.kanto-map-v2292 .region-map-v2292-track>svg{width:17px;height:17px}.kanto-map-v2292 .region-map-v2292-track>span{display:grid}.kanto-map-v2292 .region-map-v2292-track small{font-size:6px}.kanto-map-v2292 .region-map-v2292-track b{font-size:8px}

.kanto-map-v2292 .region-teleport-v2292{border-color:#d8d1ed;background:linear-gradient(155deg,#fff 0,#f8f5ff 100%)}
.kanto-map-v2292 .region-teleport-v2292>details>summary>i{overflow:hidden;background:#eee8ff}
.kanto-map-v2292 .region-teleport-v2292-summary-art{width:32px;height:32px}.kanto-map-v2292 .region-teleport-v2292-summary-art img{width:100%;height:100%;object-fit:contain}
.kanto-map-v2292 .region-teleport-v2204-sources{margin-bottom:7px}
.kanto-map-v2292 .region-teleport-v2292-preview{position:relative;min-height:68px;padding:6px 8px;border-color:#cfc5ec;background:linear-gradient(120deg,#f4efff,#fff)}
.kanto-map-v2292 .region-teleport-v2292-abra-art{width:54px;height:54px;flex:0 0 auto;filter:saturate(.8)}
.kanto-map-v2292 .region-teleport-v2292-abra-art img{width:100%;height:100%;object-fit:contain}
.kanto-map-v2292 .region-teleport-v2292-preview span small{color:#795eb0;font-size:6px;font-weight:950;letter-spacing:.08em}
.kanto-map-v2292 .region-teleport-v2292-preview span b{font-size:12px}
.kanto-map-v2292 .region-teleport-v2292-preview span em{margin-top:2px;color:#718087;font-size:7px;font-style:normal;line-height:1.25;white-space:normal}
.kanto-map-v2292 .region-teleport-v2292-preview>strong{padding:4px 6px;border-radius:7px;background:#e7e1f2;color:#7d6c9d;font-size:6px}
.kanto-map-v2292 .region-teleport-v2204-destinations{max-height:245px;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;overflow:auto;scrollbar-width:thin}
.kanto-map-v2292 .region-teleport-v2204-destination{min-height:54px;padding:4px 5px;border-color:#d8e2e2;background:#f9fbfb;overflow:hidden}
.kanto-map-v2292 .region-teleport-v2204-destination.is-home{grid-column:1/-1}
.kanto-map-v2292 .region-teleport-v2204-destination.is-available{border-color:#74c4ad;background:#edfaf6}
.kanto-map-v2292 .region-teleport-v2204-destination.is-current{border-color:#ebc46b;background:#fff8e7}
.kanto-map-v2292 .region-teleport-v2204-destination:disabled{opacity:.68}
.kanto-map-v2292 .region-teleport-v2292-destination-art{width:38px;height:38px;flex:0 0 auto;overflow:hidden;border-radius:9px;background:#e9f2f0}
.kanto-map-v2292 .region-teleport-v2292-destination-art img{width:100%;height:100%;object-fit:cover}
.kanto-map-v2292 .region-teleport-v2204-destination.is-locked .region-teleport-v2292-destination-art img{filter:grayscale(1) brightness(.72)}
.kanto-map-v2292 .region-teleport-v2204-destination>span b{font-size:8px}.kanto-map-v2292 .region-teleport-v2204-destination>span small{font-size:6px}.kanto-map-v2292 .region-teleport-v2204-destination>em{padding:3px 4px;border-radius:6px;background:#e8efee;color:#60777b;font-size:5px;text-align:center}

.region-tracker-v2292{position:absolute;z-index:49;right:22px;bottom:118px;width:min(390px,calc(100vw - 44px));min-height:60px;display:flex;align-items:stretch;border:1px solid #d2e4e1;border-radius:16px;background:#fffffff2;color:#244d56;box-shadow:0 12px 30px #102f4040;overflow:hidden;backdrop-filter:blur(14px)}
.region-tracker-v2292[hidden]{display:none}
.region-tracker-v2292-main{min-width:0;padding:8px 9px;display:flex;align-items:center;gap:9px;flex:1;border:0;background:transparent;color:inherit;text-align:left}
.region-tracker-v2292-main>i{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:11px;background:linear-gradient(145deg,#1cb69a,#157f8e);color:#fff;box-shadow:0 5px 11px #177f8052}
.region-tracker-v2292-main>i svg{width:18px;height:18px;transform:rotate(var(--tracker-bearing));transition:transform .18s ease}
.region-tracker-v2292-main>span{min-width:0;display:grid;flex:1}.region-tracker-v2292-main>span small{color:#238d82;font-size:6px;font-weight:950;letter-spacing:.09em}.region-tracker-v2292-main>span b{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.region-tracker-v2292-main>span em{color:#6c8185;font-size:8px;font-style:normal}
.region-tracker-v2292-main>strong{max-width:100px;padding-left:8px;display:grid;border-left:1px solid #dfe9e7;color:#315b62;font-size:8px;line-height:1.1;text-align:right}.region-tracker-v2292-main>strong small{color:#89a09f;font-size:5px;letter-spacing:.1em}
.region-tracker-v2292-close{width:30px;border:0;border-left:1px solid #dfe9e7;background:#f3f7f6;color:#6b8185;font-size:17px}
.region-tracker-v2292 button:hover{filter:brightness(.98)}

@media(max-width:700px){
  .kanto-map-v2292 .region-map-v2292-search{width:calc(100% - 39px)}
  .kanto-map-v2292 .region-map-v2292-search-field{height:32px}
  .kanto-map-v2292 .region-map-v2292-search-results{top:37px}
  .kanto-map-v2292 .region-map-v2204-node>span{max-width:92px;font-size:6px}
  .kanto-map-v2292 .region-map-v2204-selection-copy>.region-map-v2292-actions{grid-template-columns:1fr}
  .kanto-map-v2292 .region-teleport-v2204-destinations{max-height:220px}
  .region-tracker-v2292{left:8px;right:8px;bottom:calc(80px + env(safe-area-inset-bottom));width:auto;min-height:54px;border-radius:14px}
  .region-tracker-v2292-main{padding:6px 7px;gap:7px}.region-tracker-v2292-main>i{width:31px;height:31px}.region-tracker-v2292-main>strong{display:none}.region-tracker-v2292-main>span b{font-size:10px}
}
@media(prefers-reduced-motion:reduce){.region-tracker-v2292-main>i svg{transition:none}}
