/* Phone layout (v2.217, Phase 7a-1). Everything is under html.mobile, so a desktop never sees any of it. */
html.mobile { --st:env(safe-area-inset-top, 0px); --sr:env(safe-area-inset-right, 0px); --sb:env(safe-area-inset-bottom, 0px); --sl:env(safe-area-inset-left, 0px); font-size:clamp(11px, 3.1vmin, 15px); -webkit-text-size-adjust:100%; overscroll-behavior:none; -webkit-tap-highlight-color:transparent; }
html.mobile, html.mobile body { touch-action:manipulation; }
html.mobile * { -webkit-touch-callout:none; }
html.mobile, html.mobile body { overflow:hidden; }
html.mobile #game { position:fixed; inset:0; display:grid; min-height:0; grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr); grid-template-areas:"stage"; padding:0; gap:0; }
html.mobile #top { display:none !important; }
html.mobile #stage { border:0; border-radius:0; min-height:0; flex:none; }
html.mobile #stage.space #stageUi { touch-action:none; }
html.mobile #hud, html.mobile #side { display:none; }
html.mobile #shipGrid { inset:calc(9vmin + var(--st)) calc(var(--sr)) 0 calc(var(--sl)); width:auto; margin:0; }
html.mobile .floaty { top:calc(9vmin + var(--st)); right:calc(1rem + var(--sr)); }
html.mobile #mailBar { font-size:.9rem; }

/* the touch layer */
#mob, #mRotate, #mClose { display:none; }
html.mobile #mob { display:block; position:fixed; inset:0; z-index:30; pointer-events:none; touch-action:none; }
html.mobile #mob.hidden { display:none; }
html.mobile #mob > * { pointer-events:auto; }
html.mobile #mob button { position:fixed; border-radius:50%; padding:0; display:flex; flex-direction:column; align-items:center; justify-content:center; font-weight:800; letter-spacing:.03em; line-height:1.05; touch-action:none; user-select:none; -webkit-user-select:none; color:#fff; border:2px solid #ffffff47; text-shadow:0 1px 2px #000b; box-shadow:0 3px 12px #000a, inset 0 2px 5px #ffffff59, inset 0 -6px 10px #0000004d; transition:filter .12s, transform .08s; will-change:transform; }
html.mobile #mob button:active { filter:brightness(1.18); transform:scale(.95); }
#mTarget { position:fixed; top:calc(1.5vmin + var(--st)); left:50%; transform:translateX(-50%); background:#000a; border:1px solid #ffffff30; border-radius:999px; padding:.1rem .8rem; font-size:3.3vmin; white-space:nowrap; pointer-events:none !important; }
#mTarget.hidden { display:none; }

#mJump { background:radial-gradient(circle at 50% 30%, #44dd7a, #17853d 70%, #0f6a2f); font-size:4.2vmin; }
#mJump b { font-size:4.2vmin; } #mJump small { font-size:3.2vmin; font-weight:700; color:#d6ffe4; min-height:0; }
#mJump:not(.ready) { background:radial-gradient(circle at 50% 30%, #1f5a35, #0e3320 75%); color:#bfe8cc; }
#mJump:not(.ready) b { font-size:3.2vmin; opacity:.8; }
#mJumpRing { position:fixed; pointer-events:none; overflow:visible; transform:rotate(-90deg); }
#mJumpRing circle { fill:none; stroke-width:4.5; }
#mJumpRing .rb { stroke:#0a2a18; opacity:.9; }
#mJumpRing .rf { stroke:#3cf08a; stroke-dasharray:100; stroke-dashoffset:100; stroke-linecap:round; transition:stroke-dashoffset .35s linear, stroke .3s; filter:drop-shadow(0 0 2px #3cf08a88); }
#mJumpRing.ready .rf { stroke:#7dffb0; filter:drop-shadow(0 0 4px #3cf08acc); }
#mEngage { background:radial-gradient(circle at 50% 30%, #ff4f58, #b3121d 70%, #8a0c15); font-size:3.3vmin; letter-spacing:0; white-space:nowrap; }
#mEngage.disengage { background:radial-gradient(circle at 50% 30%, #8a93a8, #3b4354 75%); border-color:#ffffff70; }
#mFire { background:radial-gradient(circle at 50% 30%, #ffb25a, #c25a00 75%); font-size:2.5vmin; letter-spacing:-.02em; }
#mFire.auto { box-shadow:0 0 0 .9vmin #ffd27a, 0 3px 12px #000a, inset 0 2px 5px #ffffff59; }
#mFire.hidden { display:none; }
#mob button.mini { font-size:2.9vmin; }
#mChatB { background:radial-gradient(circle at 50% 30%, #7a82ff, #2a2fa0 75%); } #mCargoB { background:radial-gradient(circle at 50% 30%, #ffb05a, #b85a00 75%); } #mStatsB { background:radial-gradient(circle at 50% 30%, #b3b9c4, #555b66 75%); }
#mob button.dot::after { content:""; position:absolute; top:-.4vmin; right:-.4vmin; width:3.2vmin; height:3.2vmin; border-radius:50%; background:#ffd84a; border:2px solid #000a; }
#mob button:disabled { opacity:.4; }

/* the shield arc around JUMP */
#mArc { position:fixed; left:var(--sl); bottom:calc(var(--sb) + 2.5vmin); width:40vmin; height:40vmin; overflow:visible; pointer-events:none !important; touch-action:none; }
#mArc path:not(defs *):not(.vn *):not(.lk *), #mArc line { fill:none; stroke-linecap:butt; }
#mArc .arcback { stroke:#0b3a58; opacity:.8; } #mArc .arcfill { stroke:#22b4ff; filter:drop-shadow(0 0 1.5px #22b4ffaa); } #mArc.drag .arcback { opacity:1; } #mArc .tick { stroke:#02121c; stroke-width:.9; opacity:.9; }
#mArc .archit { stroke:transparent; stroke-linecap:round; pointer-events:stroke; touch-action:none; cursor:pointer; }
#mArc .maxhit { fill:transparent; pointer-events:all; touch-action:none; }
#mArc .maxlbl { fill:#fff; font-weight:800; font-size:7px; paint-order:stroke; stroke:#000a; stroke-width:1.2px; }
#mArc .pctlbl { fill:#dff4ff; font-weight:800; font-size:6.2px; paint-order:stroke; stroke:#000c; stroke-width:1.2px; pointer-events:none; }
#mArc.off .arcfill { stroke:#556; }

/* chat, cargo and statistics open as a sheet on the right */
html.mobile.m-chat #side, html.mobile.m-cargo #hud, html.mobile.m-stats #hud { display:block; position:fixed; left:calc(38vmin + var(--sl)); right:calc(47vmin + var(--sr)); top:0; bottom:0; width:auto; z-index:50; background:#0b111efa; border-left:1px solid var(--line); padding:calc(1.4rem + var(--st)) .5rem .5rem .5rem; overflow:auto; }
html.mobile.m-chat #side { overflow:hidden; } html.mobile.m-chat #chat { position:absolute; min-height:0; inset:calc(2.6rem + var(--st)) .4rem .4rem .4rem; }
html.mobile.m-chat #chatForm input, html.mobile #chatIn { font-size:16px; }
html.mobile.m-cargo #hud .hud, html.mobile.m-stats #hud .hud { display:flex; flex-direction:column; gap:.5rem; }
html.mobile.m-cargo #hud .hgroup.left, html.mobile.m-cargo #hud .cell.gauges, html.mobile.m-cargo #hud .cell.center, html.mobile.m-stats #hud .hgroup.right { display:none; }
html.mobile.m-cargo #hud .hgroup.right .cell.mini-window { max-width:none; width:100%; min-width:0; }
html.mobile.m-cargo #hud .mini-window .goodgrid { grid-template-columns:repeat(4,minmax(0,1fr)); }
html.mobile .gtile { min-height:11vmin; touch-action:manipulation; }
html.mobile.m-stats #hud .hgroup.left { display:flex; flex-direction:column; gap:.5rem; }
html.mobile.m-stats #hud .hgroup.left .cell { max-width:none; width:100%; min-width:0; }
#mClose { position:fixed; z-index:60; top:calc(.4rem + var(--st)); right:calc(47vmin + .5rem + var(--sr)); width:11vmin; height:11vmin; border-radius:50%; background:#222b40; color:#fff; border:2px solid #fff4; font-size:5vmin; padding:0; }
html.mobile #mClose { display:block; } html.mobile #mClose.hidden { display:none; }

/* panels (map, planet screens): full screen, bigger tap targets */
html.mobile .panel, html.mobile .panel.full { inset:calc(.4rem + var(--st)) calc(.4rem + var(--sr)) calc(.4rem + var(--sb)) calc(.4rem + var(--sl)); }
html.mobile button, html.mobile .tabs button { min-height:9vmin; }
html.mobile .panel > header .closebtn { min-height:9vmin; font-size:.95rem; padding:.2rem .7rem; white-space:nowrap; }
html.mobile input, html.mobile select, html.mobile textarea { font-size:16px; }
html.mobile #toasts, html.mobile #flash { top:calc(14vmin + var(--st)); }

/* the game is played with the phone on its side */
html.mobile #mRotate { display:none; }
@media (orientation: portrait) {
  html.mobile #mRotate { display:flex; position:fixed; inset:0; z-index:9999; background:#02040a; color:#cfe3ff; align-items:center; justify-content:center; text-align:center; font-size:1.3rem; }
  html.mobile #mRotate b { font-size:4rem; display:block; }
}

/* the hull bar is on the left edge now: keep the sector clear of it */
html.mobile #shipGrid { inset:calc(8vmin + var(--st)) var(--sr) 0 calc(8vmin + var(--sl)); }
html.mobile .floaty { top:calc(8vmin + var(--st)); }
/* planets and satellites take less room */
html.mobile #shipGrid #planetBtn.pic { width:min(17vmin,92%); }
html.mobile #shipGrid #planetBtn.pic.corner { width:min(27vmin,100%); }
html.mobile #shipGrid #planetBtn:not(.pic) { width:min(17vmin,92%); height:auto; aspect-ratio:1; }
html.mobile #shipGrid #portalBtn { width:min(22vmin,22vw,40%); }
html.mobile .ship.sat svg.satsvg { width:11vmin; height:auto; } html.mobile .ship.sat img.photo { max-width:15vmin; max-height:12vmin; } html.mobile .ship.sat.wreck img.photo { max-width:16vmin; max-height:13vmin; }
html.mobile .ship img.photo { max-width:18vmin; max-height:15vmin; }

/* ---- on a planet ---- */
html.mobile #welcome { left:calc(.5rem + var(--sl)); right:auto; top:calc(.4rem + var(--st)); max-width:48vw; padding:.25rem .6rem; font-size:.95rem; }
html.mobile #welcome .wstat { float:none; display:block; font-size:.85em; }
html.mobile #lmenu { position:absolute; left:calc(.5rem + var(--sl)); top:calc(5.4rem + var(--st)); bottom:calc(.5rem + var(--sb)); width:23vw; max-width:12rem; padding:0; display:flex; flex-direction:column; gap:.35rem; overflow-y:auto; -webkit-overflow-scrolling:touch; }
html.mobile #lmenu button { min-height:8.5vmin; text-align:center; font-size:.95rem; padding:.2rem .4rem; }
html.mobile #pmenu { position:absolute; right:calc(.5rem + var(--sr)); top:calc(.5rem + var(--st)); bottom:calc(16vmin + var(--sb)); width:min(46vw,26rem); padding:0; display:grid; grid-template-columns:1fr 1fr; grid-auto-rows:min-content; gap:.35rem; align-content:start; overflow-y:auto; -webkit-overflow-scrolling:touch; }
html.mobile #pmenu button { min-height:10vmin; text-align:center; font-size:.95rem; padding:.2rem .3rem; }
html.mobile #pmenu .launch { position:fixed; right:calc(.5rem + var(--sr)); bottom:calc(.5rem + var(--sb)); width:min(46vw,26rem); height:13vmin; min-height:0; margin:0; padding:0; font-size:1.25rem; z-index:20; }
html.mobile #planetScene { height:auto; }

/* ---- panels on a phone (7a-2): one scrolling column, the left navigation kept narrow ---- */
html.mobile .panel { font-size:.95rem; }
html.mobile .panel > header { padding:.3rem .6rem; gap:.4rem; }
html.mobile .panel > header h2 { font-size:1.15rem; }
html.mobile .panel > .body { padding:.5rem .6rem; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; touch-action:pan-y; }
html.mobile .panel .gbody, html.mobile .panel .cview, html.mobile .panel .mgrid, html.mobile .panel .minibody { touch-action:pan-y; -webkit-overflow-scrolling:touch; }
html.mobile .panel.yard .body, html.mobile .panel.yard.shop .body, html.mobile .panel.store .body, html.mobile .panel.cache .body, html.mobile .panel.guildhall .body { grid-template-columns:7.5rem minmax(0,1fr) !important; gap:.6rem; }
html.mobile .panel.yard .body > :nth-child(n+3), html.mobile .panel.yard.shop .yright { grid-column:2 / -1 !important; }
html.mobile .panel.repair .body, html.mobile .storemain, html.mobile .hbody, html.mobile .bpwrap, html.mobile .bforms, html.mobile .hubcols, html.mobile .gover, html.mobile .boards, html.mobile .pcard { grid-template-columns:minmax(0,1fr) !important; }
html.mobile .grid, html.mobile .ggrid, html.mobile .rgrid, html.mobile .cgrid { grid-template-columns:repeat(auto-fill,minmax(11rem,1fr)) !important; }
html.mobile .cview { grid-template-columns:repeat(auto-fill,minmax(11rem,1fr)) !important; }
html.mobile .panel table { display:block; overflow-x:auto; max-width:100%; }
html.mobile .panel .ynav button, html.mobile .panel .gnav button, html.mobile .panel .tabs button { min-height:9vmin; font-size:.92rem; padding:.2rem .4rem; }
html.mobile .panel .btnrow { gap:.4rem; flex-wrap:wrap; }
html.mobile .panel .bigart, html.mobile .panel .yview { max-width:40vmin; }
html.mobile .confirm { max-width:90vw; max-height:92vh; overflow:auto; }

/* a panel open on a planet hides the planet menus (LAUNCH included) behind it */
html.mobile #stage:has(.panel) #pmenu, html.mobile #stage:has(.panel) #lmenu, html.mobile #stage:has(.panel) #welcome { visibility:hidden; }
/* tab rows are one scrolling line instead of a tall stack (the yard, cache, guild hall and store keep their side column) */
html.mobile .panel:not(.yard):not(.cache):not(.guildhall):not(.store) .ynav, html.mobile .panel .tabs, html.mobile .panel .minitabs { display:flex; flex-direction:row; gap:.3rem; overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; touch-action:pan-x; }
html.mobile .panel:not(.yard):not(.cache):not(.guildhall):not(.store) .ynav button, html.mobile .panel .tabs button { flex:none; white-space:nowrap; }

/* planet menu column: no frame of its own (the buttons were poking out of it) */
html.mobile #lmenu { background:none !important; border:0 !important; box-shadow:none !important; backdrop-filter:none !important; padding:0 !important; box-sizing:border-box; }
html.mobile #lmenu button { width:100%; box-sizing:border-box; }

/* goods market: each good is a small card (picture, name, prices, then the buying controls, then what the amount would cost) */
html.mobile .panel.market .mgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(19rem,1fr)); grid-template-rows:none; grid-auto-rows:max-content; gap:.4rem; align-content:start; }
html.mobile .panel.market .mcard { grid-template-columns:2.4rem minmax(0,1fr) auto; grid-template-areas:"ico name price" "ctl ctl ctl" "pv pv pv"; gap:.2rem .5rem; padding:.35rem .5rem; height:auto; min-height:0; }
html.mobile .panel.market .mico { grid-area:ico; width:2.4rem; height:2.4rem; } html.mobile .panel.market .mname { grid-area:name; } html.mobile .panel.market .mprice { grid-area:price; text-align:right; }
html.mobile .panel.market .mctl { grid-area:ctl; flex-wrap:nowrap; } html.mobile .panel.market .mpv { grid-area:pv; }
html.mobile .panel.market .mctl .qty { width:3.6rem; min-height:8.5vmin; } html.mobile .panel.market .mctl .mbtn { flex:1; min-width:0; padding:.1rem .2rem; min-height:8.5vmin; }
html.mobile .panel.market .pv { white-space:normal; font-size:.8rem; }
html.mobile .panel.market .mbar { flex-wrap:wrap; gap:.4rem; }
html.mobile .panel.market > header { flex-wrap:wrap; } html.mobile .panel.market > header .mnews { display:none; }
/* missions use the same grid: two cards across instead of fixed 22rem cards */
html.mobile .mgrid .item.mission { width:auto; flex:1 1 17rem; min-height:0; }

/* repair: the "Repair all" bar comes first and stays in view; the big ship picture is dropped */
html.mobile .panel.repair .body { display:flex !important; flex-direction:column; gap:.4rem; }
html.mobile .panel.repair .yright { order:-1; position:sticky; top:-.5rem; z-index:3; background:#0b111e; padding:.3rem 0; margin:-.5rem 0 0; }
html.mobile .panel.repair .rfoot { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem .8rem; } html.mobile .panel.repair .rfoot .big { min-height:10vmin; font-size:1.05rem; flex:none; }
html.mobile .panel.repair .rleft .bigart { display:none; } html.mobile .panel.repair .rleft > h3 { margin:.1rem 0; font-size:1rem; }
html.mobile .panel.repair .yrow { flex-wrap:wrap; gap:.3rem; } html.mobile .panel.repair .rcell { flex:1 1 7.5rem; }

/* the cargo sheet: the "In the sector / In your ship" switch is on top */
html.mobile .minibody { display:flex; flex-direction:column; } html.mobile .minibody .cargoview { order:-1; margin:0 0 .4rem; display:flex; gap:.3rem; } html.mobile .minibody .cargoview button { flex:1; min-height:9vmin; }
html.mobile .minibody .goodgrid { order:0; }

/* repair fix: the "Repair all" bar must not shrink to nothing in the flex column */
html.mobile .panel.repair .body > * { flex:none; min-height:min-content; }
html.mobile .panel.repair .rcell { flex:0 1 15rem; }
html.mobile .panel.repair .yright { overflow:visible; }

/* blueprints: small picture on the left, requirements and the buy button on the right, all on one screen */
html.mobile .bpwrap { grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr) !important; gap:.8rem; align-items:start; }
html.mobile .bpimg { max-height:46vmin; } html.mobile .bpcap { font-size:.85rem; }
html.mobile .bpinfo p, html.mobile .bpinfo li, html.mobile .bpguns li { font-size:.9rem; margin:.15rem 0; } html.mobile .bpinfo h4, html.mobile .bpguns h4 { margin:.3rem 0 .15rem; font-size:.95rem; }
html.mobile .bpinfo > button { width:100%; min-height:10vmin; margin-top:.3rem; }

/* supply cache: voidweaver keys and reward parts, compact */
html.mobile .keyrow { gap:.3rem; margin:.2rem 0 .5rem; } html.mobile .keycard { width:6.6rem; padding:.3rem .35rem; gap:.15rem; } html.mobile .keycard.empty { min-height:3.2rem; }
html.mobile .keycard .keysq, html.mobile .keysq { width:2.2rem; height:2.2rem; } html.mobile .keycard .kfx { font-size:.72rem; max-height:3.4em; } html.mobile .keycard button { min-height:7.5vmin; font-size:.8rem; padding:.1rem .2rem; }
html.mobile .item.cslot { padding:.35rem .5rem; gap:.2rem; } html.mobile .item.cslot.empty { padding:.15rem .5rem; min-height:0; }
html.mobile .item.cslot .cname { gap:.4rem; } html.mobile .bigart.sm { width:2.4rem; height:2.4rem; }
html.mobile .item.cslot .kfx { font-size:.78rem; } html.mobile .item.cslot .btnrow button { min-height:8vmin; }
html.mobile .cview { gap:.35rem; }
html.mobile .cview h4 { margin:.3rem 0 .1rem; grid-column:1 / -1; }

/* information center, bar and the Zenith trade hub */
html.mobile .pcard { gap:.5rem; } html.mobile .pcard .bigart { max-width:30vmin; margin:0 auto; }
html.mobile .kvrow { font-size:.9rem; }
html.mobile .boards { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:.4rem .8rem; } html.mobile .bcard h4 { font-size:.95rem; } html.mobile .brow { font-size:.88rem; }
html.mobile .hubhead { flex-wrap:wrap; } html.mobile .hubcols { grid-template-columns:minmax(0,1fr) !important; } html.mobile .hubsearch { grid-template-columns:repeat(auto-fit,minmax(10rem,1fr)); padding:.4rem; }
html.mobile .bforms { grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; gap:.5rem; } html.mobile .bform { padding:.4rem; gap:.3rem; }
html.mobile .bform input, html.mobile .bform select { min-height:8.5vmin; } html.mobile .bform label { font-size:.85rem; }

/* v2.220 leftovers */
html.mobile .cview > .keyrow { grid-column: 1 / -1; }
html.mobile .panel input, html.mobile .panel select, html.mobile .panel textarea { font-size: 14px; padding: .25rem .4rem; min-height: 0; }

/* v2.221: planet left column: compact name/credits pill, buttons centred below it */
html.mobile #welcome { bottom:auto !important; right:auto !important; height:auto !important; width:23vw; max-width:12rem; box-sizing:border-box; text-align:center; padding:.3rem .4rem; }
html.mobile #lmenu { justify-content:flex-start; align-items:stretch; top:calc(5.2rem + var(--st)); bottom:auto; max-height:calc(100vh - 6rem - var(--st) - var(--sb)); width:23vw; box-sizing:border-box; }
html.mobile #lmenu button { margin:0 auto; text-align:center; }
#mFire.off { filter:saturate(.3) brightness(.7); }

/* v2.221: ship / cargo sheets use the full sheet height instead of the desktop HUD height */
html.mobile.m-cargo #hud, html.mobile.m-stats #hud { display:flex; flex-direction:column; overflow:hidden; box-sizing:border-box; }
html.mobile.m-cargo #hud .hud, html.mobile.m-stats #hud .hud { height:auto !important; min-height:0 !important; max-height:none !important; overflow:visible !important; flex:1 1 auto; padding:.3rem; background:none; border:0; grid-template-columns:none !important; }
html.mobile.m-stats #hud .hgroup.left { flex-wrap:nowrap; }
html.mobile.m-stats #hud .hgroup.left .cell { height:auto !important; flex:0 0 auto !important; overflow:visible !important; white-space:normal !important; }
html.mobile.m-stats #hud .hgroup.left .cell.pilotcard { font-size:.95rem; }
html.mobile.m-stats #hud .pilotcard .k { width:4.6rem; }
html.mobile.m-cargo #hud .hud { display:flex; min-height:0 !important; height:100% !important; }
html.mobile.m-cargo #hud .hgroup.right { display:flex !important; flex:1 1 auto; min-height:0; width:100%; }
html.mobile.m-cargo #hud .hgroup.right .cell.mini-window { height:100% !important; max-height:none !important; flex:1 1 auto; min-height:0; }
html.mobile.m-cargo #hud .mini-window .minibody { flex:1 1 auto; min-height:0; overflow-y:auto; }
html.mobile.m-cargo #hud .mini-window .goodgrid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:.25rem; }
html.mobile .gtile { min-height:9vmin; }
html.mobile.m-cargo #hud .minibody .cargoview button { min-height:7.5vmin; }
html.mobile.m-cargo #hud .minitabs button { padding:.15rem .5rem; }
html.mobile.m-cargo #hud .mini-window .minibody { max-height:none !important; overflow-y:auto !important; }
html.mobile.m-cargo #hud .goodgrid { grid-auto-rows:9vmin; align-content:start; }
html.mobile .gtile { aspect-ratio:auto; }

/* v2.221: Repair all on the right; zone price table with a line between every planet column */
html.mobile .panel.repair .yright { display:flex; justify-content:flex-end; }
html.mobile .panel.repair .yright > * { margin-left:auto; }
html.mobile .zptable th, html.mobile .zptable td { border-left:1px solid #2b3d5e; border-bottom:1px solid #2b3d5e; padding:.3rem .45rem; }
html.mobile .zptable th:first-child, html.mobile .zptable td:first-child { border-left:0; }
html.mobile .zptable tbody tr:nth-child(even) td, html.mobile .zptable tbody tr:nth-child(even) th { background:#ffffff0a; }
html.mobile .zptable { border:1px solid #2b3d5e; }
html.mobile .zpblock { width:100%; } html.mobile .zptable { width:100%; table-layout:auto; }

/* v2.222: hangar = ship list on the left, a small preview on the right */
html.mobile .hangar { padding:calc(.4rem + var(--st)) calc(.5rem + var(--sr)) calc(.4rem + var(--sb)) calc(.5rem + var(--sl)); gap:.4rem; }
html.mobile .hhead { gap:.4rem; flex:none; } html.mobile .hhead .banner { padding:.3rem .6rem; font-size:.95rem; } html.mobile .hhead button { min-height:8vmin; padding:.2rem .7rem; }
html.mobile .hangar .hbody { grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) !important; gap:.5rem; min-height:0; }
html.mobile .hlist { gap:.35rem; -webkit-overflow-scrolling:touch; touch-action:pan-y; }
html.mobile .hrow { padding:.3rem .5rem; gap:.5rem; flex:none; }
html.mobile .hrow .hicon { width:10vmin; height:10vmin; flex:none; } html.mobile .hrow .hicon svg, html.mobile .hrow .hicon img { width:100%; height:100%; }
html.mobile .hrow .hmeta { min-width:0; flex:1; font-size:.8rem; } html.mobile .hrow .hmeta b { font-size:.9rem; }
html.mobile .hrow button { min-height:8vmin; padding:.15rem .6rem; font-size:.85rem; }
html.mobile .hpreview { min-height:0; overflow:auto; justify-content:flex-start; gap:.2rem; font-size:.8rem; }
html.mobile .hpreview .bigart { width:100%; height:24vmin; } html.mobile .hpreview .bigart svg, html.mobile .hpreview .bigart img { width:100%; height:100%; object-fit:contain; }
html.mobile .hpreview h3 { margin:0; font-size:1rem; }

/* v2.222: Ship Yard (ship / guns / missiles / upgrades): top arrows row, then buttons | ship + slots | details, each column scrolling on its own */
html.mobile .panel.yard:has(> .body > .snav) > .body { grid-template-columns:6.2rem minmax(0,1fr) minmax(0,1.1fr) !important; grid-template-rows:auto minmax(0,1fr) !important; gap:.4rem .6rem; height:100%; box-sizing:border-box; overflow:hidden; align-items:stretch; }
html.mobile .panel.yard:has(> .body > .snav) > .body > .snav { grid-column:1 / -1 !important; margin:0; gap:.5rem; justify-content:center; }
html.mobile .panel.yard:has(> .body > .snav) > .body > .snav .navbtn { min-height:8vmin; min-width:12vmin; padding:0; }
html.mobile .panel.yard:has(> .body > .snav) > .body > .ynav { grid-column:1 !important; grid-row:2; display:flex; flex-direction:column; gap:.3rem; overflow-y:auto; }
html.mobile .panel.yard:has(> .body > .snav) > .body > .ynav button { font-size:.8rem; padding:.25rem .3rem; min-height:8vmin; white-space:normal; }
html.mobile .panel.yard:has(> .body > .snav) > .body > .ycenter { grid-column:2 !important; grid-row:2; overflow-y:auto; min-height:0; align-items:stretch; }
html.mobile .panel.yard:has(> .body > .snav) > .body > .yright2, html.mobile .panel.yard:has(> .body > .snav) > .body > .ydetails { grid-column:3 !important; grid-row:2; overflow-y:auto; min-height:0; gap:.5rem; }
html.mobile .panel.yard:has(> .body > .snav) .ycenter .bigart { width:auto; height:20vmin; align-self:center; } html.mobile .panel.yard:has(> .body > .snav) .ycenter .bigart svg, html.mobile .panel.yard:has(> .body > .snav) .ycenter .bigart img { height:100%; width:auto; }
html.mobile .panel.yard:has(> .body > .snav) .ycenter h3 { margin:0; font-size:.95rem; text-align:center; }
html.mobile .panel.yard:has(> .body > .snav) .ydetails h3 { margin:0 0 .2rem; font-size:.95rem; }
html.mobile .panel.yard.parts table.stats td, html.mobile .panel.yard.parts table.stats th { padding:.12rem .35rem; font-size:.8rem; }
html.mobile .panel.yard:has(> .body > .snav) .ycenter .yview { width:100%; }
html.mobile .panel.yard:has(> .body > .snav) .ycenter .bigart { display:flex; justify-content:center; height:20vmin !important; min-height:20vmin; flex:none; }
html.mobile .panel.yard:has(> .body > .snav) table.stats td, html.mobile .panel.yard:has(> .body > .snav) table.stats th { padding:.12rem .35rem; font-size:.8rem; }
html.mobile .panel.yard .yslots .k { justify-content:flex-start; }

/* v2.223: cargo and ship sheets are bottom-half panels (easy to reach), chat is see-through, hangar a little smaller, leaderboards on one screen */
html.mobile.m-cargo #hud, html.mobile.m-stats #hud { top:auto !important; bottom:0 !important; height:54vh; padding:calc(.4rem) .5rem .4rem !important; border-top:1px solid var(--line); border-radius:12px 12px 0 0; background:#0b111ee6 !important; }
html.mobile.m-cargo #hud .hud, html.mobile.m-stats #hud .hud { padding:0; }
#mClose { }
html.mobile.m-cargo #mClose, html.mobile.m-stats #mClose { top:auto; bottom:calc(54vh - 5.5vmin); width:9vmin; height:9vmin; font-size:4.2vmin; }
html.mobile.m-cargo #hud .mini-window .goodgrid { grid-template-columns:repeat(5,minmax(0,1fr)); grid-auto-rows:13vmin; gap:.35rem; }
html.mobile.m-cargo #hud .gtile { min-height:13vmin; font-size:1.05rem; }
html.mobile.m-cargo #hud .gtile b, html.mobile.m-cargo #hud .gtile .gl { font-size:1.15rem; }
html.mobile.m-cargo #hud .minibody .cargoview button { min-height:7vmin; }
/* ship sheet: art + stats side by side */
html.mobile.m-stats #hud .hgroup.left { flex-direction:row !important; align-items:stretch; gap:.5rem; }
html.mobile.m-stats #hud .hgroup.left .cell { flex:1 1 0 !important; min-width:0 !important; }
html.mobile.m-stats.m-tgt #hud .hgroup.left .cell.shipcell { display:none; }
html.mobile.m-stats #hud .pilotcard { font-size:.85rem !important; }
html.mobile.m-stats #hud .pilotcard .tship { height:15vmin; display:flex; justify-content:center; margin-bottom:.2rem; }
html.mobile.m-stats #hud .pilotcard .tship svg, html.mobile.m-stats #hud .pilotcard .tship img { height:100%; width:auto; }
html.mobile.m-stats #hud .pilotcard .k { width:4rem; }
/* chat: see the sector through it */
html.mobile.m-chat #side { background:#0b111e73 !important; backdrop-filter:none; }
html.mobile.m-chat #chat, html.mobile.m-chat #chat * { background-color:transparent; }
html.mobile.m-chat #chat .log, html.mobile.m-chat #chatLog { background:transparent !important; text-shadow:0 1px 2px #000, 0 0 4px #000; }
html.mobile.m-chat #chatForm input, html.mobile #chatIn { background:#0b111eb3 !important; }
/* hangar: slightly smaller */
html.mobile .hrow { padding:.2rem .4rem; gap:.4rem; }
html.mobile .hrow .hicon { width:8vmin; height:8vmin; }
html.mobile .hrow .hmeta { font-size:.72rem; } html.mobile .hrow .hmeta b { font-size:.82rem; }
html.mobile .hrow button { min-height:7vmin; padding:.1rem .45rem; font-size:.78rem; }
html.mobile .hhead .banner { font-size:.85rem; padding:.2rem .5rem; } html.mobile .hhead button { min-height:7vmin; font-size:.8rem; }
html.mobile .hlist { gap:.25rem; }
html.mobile .hpreview .bigart { height:19vmin; } html.mobile .hpreview { font-size:.72rem; } html.mobile .hpreview h3 { font-size:.9rem; }
/* leaderboards: chips + two columns of five */
html.mobile .lbtop { display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
html.mobile .lbtop .tabs { margin:0; } html.mobile .lbchips button { padding:.2rem .6rem; font-size:.82rem; }
html.mobile .lbtitle { margin:.3rem 0 .2rem; font-size:.95rem; }
html.mobile .lbcols { display:grid; grid-template-columns:1fr 1fr; gap:0 1rem; }
html.mobile .lbcols .brow { font-size:.82rem; padding:.2rem .25rem; }
html.mobile .lbcols .brow { display:grid !important; grid-template-columns:1.4rem minmax(0,1fr) auto !important; align-items:baseline; gap:.3rem; }
html.mobile .lbcols .brow span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html.mobile .lbtop button { min-height:7vmin !important; height:auto; padding:.1rem .6rem; }
html.mobile .lbchips button { text-transform:capitalize; }

/* v2.224 */
html.mobile.m-chat #side { background:#0b111ea6 !important; top:12vh !important; border-radius:12px 0 0 0; }
html.mobile.m-chat #chat { inset:calc(.4rem) .4rem .4rem .4rem !important; }
html.mobile.m-chat #chatTabs button { background:#1a2540; color:#cfd9ee; border:1px solid #2f4268; border-bottom:0; min-height:7.5vmin; padding:.2rem .7rem; font-size:.85rem; }
html.mobile.m-chat #chatTabs button.on { background:#2c6cff; color:#fff; border-color:#7fa6ff; }
html.mobile #mClose { }
html.mobile.m-chat #mClose { top:calc(12vh + .3rem); }
/* no accidental text selection or magnifier on double tap */
html.mobile, html.mobile * { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; -webkit-tap-highlight-color:transparent; }
html.mobile input, html.mobile textarea, html.mobile #chatLog, html.mobile #chatLog * { -webkit-user-select:text; user-select:text; }
/* v2.225: jump ring has no seam when full */
#mJumpRing.ready .rf { stroke-dasharray:none; stroke-dashoffset:0 !important; transition:none; }
html.mobile .guildcard { font-size:.95rem; }

/* v2.226 */
html.mobile #flashNote { top:calc(.5rem + var(--st)); font-size:.8rem; }
/* names stay inside their own cell: the pilot name wraps onto two lines at most, the guild is cut with an ellipsis */
html.mobile .ship .nm { overflow:hidden !important; max-width:100% !important; width:auto; margin:0; transform:none; flex-wrap:wrap; justify-content:center; white-space:normal !important; overflow-wrap:anywhere; word-break:break-word; line-height:1.05; font-size:1rem; max-height:2.15em; text-overflow:clip; }
html.mobile .ship .gn { overflow:hidden !important; max-width:100% !important; width:auto; margin:0; transform:none; text-overflow:ellipsis !important; white-space:nowrap; font-size:.85rem; }
html.mobile .mini-window .cargo { font-size:1.05rem; font-weight:700; }
html.mobile.m-cargo #mClose + * { }

/* v2.231: reconnecting banner */
#mReconn { position:fixed; left:50%; top:calc(2vmin + var(--st)); transform:translate(-50%,-160%); z-index:70; pointer-events:none; display:flex; flex-direction:column; align-items:center; gap:.1rem; background:#2a1a08ee; border:1px solid #ff9a3d; color:#ffe2c0; padding:.35rem 1rem; border-radius:12px; font-size:.85rem; text-align:center; max-width:70vw; opacity:0; transition:transform .25s, opacity .25s; }
#mReconn.show { transform:translate(-50%,0); opacity:1; }
#mReconn b::after { content:""; display:inline-block; width:.7em; height:.7em; margin-left:.5em; border:2px solid #ff9a3d; border-top-color:transparent; border-radius:50%; animation:mspin .9s linear infinite; }
@keyframes mspin { to { transform:rotate(360deg); } }

/* v2.237: at 100% shield the last section of the curve (the final 25%) is dark blue; the MAX text stays as it was */
#mArc .arcfill { stroke:url(#mArcGrad); filter:drop-shadow(0 0 1.5px #3d8dffaa); } #mArc.off .arcfill { stroke:#556; }

/* v2.237: Ship Yard (ship page): smaller part pictures and tiles so every gun, missile and upgrade slot shows at once without scrolling */
html.mobile .panel.yard:has(> .body > .snav) > .body { grid-template-columns:5.6rem minmax(0,1.3fr) minmax(0,1fr) !important; }
html.mobile .panel.yard:has(> .body > .snav) .ycenter { gap:.12rem; }
html.mobile .panel.yard:has(> .body > .snav) .ycenter .bigart { height:17vmin !important; min-height:17vmin; }
html.mobile .panel.yard:has(> .body > .snav) .ycenter h3 { font-size:.82rem; }
html.mobile .panel.yard:has(> .body > .snav) .ycenter .hullbar { height:.35rem; margin:0; }
html.mobile .panel.yard:has(> .body > .snav) .ycenter > .dim { font-size:.7rem; line-height:1.1; }
html.mobile .yslots .k { margin:.15rem 0 .1rem; font-size:.62rem; letter-spacing:.04em; justify-content:flex-start; gap:.4rem; }
html.mobile .yslots .k .sellall { font-size:.62rem; min-height:0 !important; height:auto; padding:.05rem .4rem; }
html.mobile .yrow { gap:.2rem; flex-wrap:wrap; }
html.mobile .ytile, html.mobile .rcell { width:4.7rem; }
html.mobile .ytile { min-height:2.1rem; padding:.12rem .25rem; font-size:.6rem; gap:0; }
html.mobile .ytile b { font-size:.64rem; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html.mobile .ytile .dim { font-size:.56rem; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html.mobile .ytile.haspic img.partimg.sm, html.mobile .ytile.haspic svg { height:1.25rem; width:100%; margin-bottom:0; object-fit:contain; }
html.mobile .ytile.empty { min-height:1.9rem; } html.mobile .ytile.empty .dim { font-size:.55rem; white-space:normal; text-align:center; }

/* v2.238: the jump ring hides its dark track when charged (no grey at the seam at the top); the yard's For sale / Reward buttons are smaller */
#mJumpRing.ready .rb { opacity:0; }
html.mobile .yview { gap:.25rem; } html.mobile .yview button { min-height:0 !important; height:auto; padding:.12rem .5rem; font-size:.7rem; }

/* v2.239: a charged JUMP button is solid green to the edge: no white gloss on top and a green rim (the grey band at the top was the glossy inset shadow and the translucent white border) */
html.mobile #mob #mJump.ready { border-color:#3cf08a; background:radial-gradient(circle at 50% 40%, #3fe078, #17853d 72%, #0f6a2f); box-shadow:0 3px 12px #000a, inset 0 -6px 10px #0000004d; }
#mJumpRing.ready .rf { stroke-width:7.5; }   /* the ring grows inward under the button, so no dark gap shows between them */

/* v2.240: login screen on the phone. Two columns (title and messages on the left, the form on the right), so the card keeps one size when the red message
   appears (it used to grow and re-centre, which made the page jump), and the longer create-account form fits a landscape phone. */
html.mobile #auth { display:flex; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:calc(.4rem + var(--st)) calc(.5rem + var(--sr)) calc(.4rem + var(--sb)) calc(.5rem + var(--sl)); box-sizing:border-box; }
html.mobile #auth .card { margin:auto; width:min(46rem,100%); box-sizing:border-box; padding:.7rem 1rem; display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); grid-template-areas:"t f" "s f" "m f" ". f"; grid-template-rows:auto auto 1fr auto; column-gap:1.2rem; align-items:start; }
html.mobile #auth .card > h1 { grid-area:t; font-size:1.35rem; margin:0; }
html.mobile #auth .card > #authSub { grid-area:s; margin:.2rem 0 .4rem; font-size:.85rem; }
html.mobile #auth .card > #authMsg { grid-area:m; min-height:4.2em; font-size:.85rem; line-height:1.25; margin:0; overflow-wrap:anywhere; }
html.mobile #auth .card > form, html.mobile #auth .card > #charForm { grid-area:f; min-width:0; }
html.mobile #auth .card input { padding:.35rem .6rem; margin:.15rem 0; font-size:.95rem; min-height:0; }
html.mobile #auth .card h3 { margin:0 0 .25rem; font-size:.95rem; }
html.mobile #auth .card .row { margin:.3rem 0; } html.mobile #auth .card .row button { min-height:0; padding:.4rem .6rem; }
html.mobile #auth .card p { margin:.25rem 0; font-size:.8rem; } html.mobile #auth .card .switch { margin:.2rem 0; text-align:center; }
html.mobile #auth .card .gbtn { display:inline-block; padding:.3rem .6rem; }
@media (max-aspect-ratio: 1/1) {   /* portrait: one column; the message space is reserved so nothing moves */
  html.mobile #auth .card { grid-template-columns:minmax(0,1fr); grid-template-areas:"t" "s" "f" "m"; grid-template-rows:auto; width:min(26rem,100%); }
  html.mobile #auth .card > #authMsg { min-height:3.8em; margin-top:.3rem; }
}
html.mobile #auth .card { min-height:11.8rem; }   /* log in and create-account share one card height */
@media (max-aspect-ratio: 1/1) { html.mobile #auth .card { min-height:0; } }

/* v2.241: Phone tab (sound, vibration, screen on, alerts) */
html.mobile .psets { display:flex; flex-direction:column; gap:.4rem; max-width:34rem; }
html.mobile .pset { display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.4rem .6rem; border:1px solid var(--line); border-radius:8px; background:var(--panel2); }
html.mobile .pset .ptxt { min-width:0; } html.mobile .pset .ptxt .dim { font-size:.75rem; }
html.mobile .pset .tog { min-width:4.2rem; min-height:8vmin; font-weight:800; border-radius:999px; }
html.mobile .pset .tog.on { background:#1d5cff; border-color:#7fa8ff; color:#fff; }

html.mobile #authOnline { top:calc(.4rem + var(--st)); right:calc(.7rem + var(--sr)); font-size:.8rem; }

/* v2.243: repair panel: the small part tiles sit next to each other, each with its own small repair / reload button underneath */
html.mobile .panel.repair .yrow { gap:.25rem; flex-wrap:wrap; align-items:flex-start; }
html.mobile .panel.repair .rcell { flex:0 0 5.2rem; width:5.2rem; gap:.15rem; }
html.mobile .panel.repair .rcell .ytile { width:100%; }
html.mobile .panel.repair .rcell button.mini { min-height:6.5vmin; font-size:.62rem; padding:.1rem .2rem; line-height:1.05; white-space:normal; }
html.mobile .panel.repair .yslots .k { gap:.4rem; justify-content:flex-start; }
html.mobile .panel.repair .yslots .k button.mini { min-height:6.5vmin; font-size:.68rem; padding:.1rem .5rem; }
html.mobile .panel.repair .rhull .mini { min-height:6.5vmin; font-size:.72rem; padding:.1rem .6rem; }
html.mobile .panel.repair .rleft { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.2rem .6rem; align-items:start; justify-items:stretch; }
html.mobile .panel.repair .rleft > :not(.rsec) { grid-column:1 / -1; }
html.mobile .panel.repair .rleft h3 { text-align:left; margin:0; }
html.mobile .panel.repair .rsec .k { flex-wrap:wrap; }

/* v2.245: Buy a new ship on the phone: variants in a narrow list on the left, the ship with its Buy button in the middle, the figures in two columns next to it */
html.mobile .panel.store > .body { grid-template-columns:6.2rem minmax(0,1fr) !important; grid-template-rows:auto minmax(0,1fr) !important; gap:.3rem .6rem; height:100%; box-sizing:border-box; overflow:hidden; align-items:stretch; }
html.mobile .panel.store > .body > .snav { grid-column:1 / -1 !important; margin:0; gap:.5rem; justify-content:center; }
html.mobile .panel.store > .body > .snav .navbtn { min-height:8vmin; min-width:12vmin; padding:0; }
html.mobile .panel.store .slist { grid-column:1 !important; grid-row:2; display:flex; flex-direction:column; gap:.25rem; overflow-y:auto; min-height:0; -webkit-overflow-scrolling:touch; touch-action:pan-y; }
html.mobile .panel.store .srow2 { display:flex; align-items:center; gap:.3rem; padding:.15rem .3rem; min-height:0; flex:none; text-align:left; }
html.mobile .panel.store .srow2 .sico { flex:none; width:2.3rem; } html.mobile .panel.store .srow2 .sico svg, html.mobile .panel.store .srow2 .sico img { width:100%; height:1.7rem; }
html.mobile .panel.store .srow2 > span:last-child { min-width:0; line-height:1.15; font-size:.62rem; white-space:nowrap; } html.mobile .panel.store .srow2 b { font-size:.74rem; }
html.mobile .panel.store > .body > .yright { grid-column:2 !important; grid-row:2; overflow-y:auto; min-height:0; }
html.mobile .panel.store .storemain { display:grid !important; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) !important; gap:.2rem .6rem; align-items:start; }
html.mobile .panel.store .storeshow { display:flex; flex-direction:column; align-items:center; gap:.2rem; min-width:0; }
html.mobile .panel.store .storeshow h3 { margin:0; font-size:.85rem; text-align:center; }
html.mobile .panel.store .storeshow .bigart { width:auto; height:21vmin; } html.mobile .panel.store .storeshow .bigart svg, html.mobile .panel.store .storeshow .bigart img { height:100%; width:auto; }
html.mobile .panel.store .storeshow button.primary { min-height:7.5vmin; padding:.15rem .9rem; font-size:.85rem; }
html.mobile .panel.store .storeshow .dim { font-size:.66rem; text-align:center; }
html.mobile .panel.store .cgrid { display:grid; grid-template-columns:1fr 1fr; gap:0 .8rem; }
html.mobile .panel.store .cgrid .cst { padding:.12rem .25rem; font-size:.72rem; min-width:0; }
html.mobile .panel.store .yright > :not(.storemain) { font-size:.72rem; margin-top:.3rem; } html.mobile .panel.store .yright > :not(.storemain) h3, html.mobile .panel.store .yright > :not(.storemain) b { font-size:.8rem; }
html.mobile .panel.store .storemain > :not(.storeshow):not(.cgrid) { grid-column:1 / -1; font-size:.72rem; padding:.3rem .5rem; } html.mobile .panel.store .storemain > :not(.storeshow):not(.cgrid) * { font-size:inherit; margin:.1rem 0; }
/* v2.246: the variant list is wider and the text bigger, so long names and prices show in full */
html.mobile .panel.store > .body { grid-template-columns:9.5rem minmax(0,1fr) !important; }
html.mobile .panel.store .srow2 { padding:.25rem .4rem; gap:.4rem; }
html.mobile .panel.store .srow2 .sico { width:2.6rem; } html.mobile .panel.store .srow2 .sico svg, html.mobile .panel.store .srow2 .sico img { height:1.9rem; }
html.mobile .panel.store .srow2 > span:last-child { font-size:.78rem; white-space:normal; overflow-wrap:anywhere; line-height:1.2; } html.mobile .panel.store .srow2 b { font-size:.9rem; }
html.mobile .panel.store .srow2 .dim { white-space:nowrap; }

/* v2.249: the hull is an arc around the shield arc (the fluid drains from the top). Normal look: dark well, light rim, green/amber/red fluid (colour set by the script). */
#mArc .hh0 { stroke:#05070acc; } #mArc .hh1 { stroke:#ffffff4d; } #mArc .hh2 { stroke:#2a0508; }
#mArc .hfl { stroke:#46d68a; }
#mArc .sh0 { stroke:#05070acc; } #mArc .sh1 { stroke:#ffffff4d; }
#mArc .hulllbl { fill:#fff; font-weight:800; font-size:6.4px; paint-order:stroke; stroke:#000c; stroke-width:1.3px; pointer-events:none; }
#mob:not(.brood) .bro, #mob:not(.brood) .halo { display:none !important; }
html.mobile #mob > .halo { position:fixed; pointer-events:none !important; overflow:visible; }
html.mobile #mob > .halo.fhid { display:none !important; }

/* v2.249 Brood look (ship plan setting "Phone control look"): dark metal, blood-red fluid, spikes and a mechanical eye. Looks only. */
@keyframes bPulse { 0%,100% { opacity:.5; } 50% { opacity:1; } }
#mob.brood #mArc .hh0 { stroke:#05070a; } #mob.brood #mArc .hh1 { stroke:#555b64; } #mob.brood #mArc .hh2 { stroke:#06080a; }
#mob.brood #mArc .hfl { stroke:#a3121a; filter:drop-shadow(0 0 1.5px #e02a2a); }
#mob.brood #mArc .hsh { stroke:#ff5a4a; opacity:.5; transform:translate(-.6px,0); }
#mob.brood #mArc .hrib { stroke:#000; opacity:.5; }
#mob.brood.hlow #mArc .hfl, #mob.brood.hlow #mArc .hsh { animation:bPulse 2.4s ease-in-out infinite; }
#mob.brood.hcrit #mArc .hfl, #mob.brood.hcrit #mArc .hsh, #mob.brood.hcrit #mArc .hlamp, #mob.brood.hcrit #mArc .hspk { animation:bPulse 1.1s ease-in-out infinite; }
#mob.brood #mArc .hlamp { fill:#ff2a1a; filter:drop-shadow(0 0 1.5px #ff2a1a); }
#mob.brood #mArc .hplate { fill:url(#mSteel); stroke:#05070a; stroke-width:.5; }
#mob.brood #mArc .hspk { stroke:#fff3c0; stroke-width:1; stroke-linecap:round; }
#mob.brood #mArc .co { stroke:#8e0f14; stroke-width:1.6; stroke-linecap:round; opacity:.9; }
#mob.brood #mArc .cl { stroke:#d5dae0; stroke-width:.8; stroke-linejoin:bevel; opacity:1; }
#mob.brood #mArc .cd { stroke:#000; stroke-linejoin:bevel; stroke-linecap:round; }
#mob.brood #mArc .cr { stroke:#ff4636; stroke-width:.55; stroke-linejoin:bevel; opacity:.9; filter:drop-shadow(0 0 1.2px #ff2a1a); }
/* the shield: a steel bottle like the hull */
#mob.brood #mArc .sh0 { stroke:#05070a; } #mob.brood #mArc .sh1 { stroke:#555b64; }
#mob.brood #mArc .arcback { stroke:#15181c; opacity:1; }
#mob.brood #mArc .arcfill { stroke:url(#mArcGradB); filter:none; } #mob.brood #mArc.off .arcfill { stroke:#556; }
#mob.brood #mArc .tick { stroke:#05070a; stroke-width:1.2; }
/* the controls */
html.mobile #mob.brood button { border:.9vmin solid #3a3f46; text-shadow:0 0 5px #000, 0 0 3px #000; box-shadow:0 0 0 .4vmin #05070a, 0 3px 12px #000c, inset 0 0 2.4vmin #000; }
html.mobile #mob.brood #mJump { background:radial-gradient(circle at 42% 36%, #ff4a30 0, #8a0f14 33%, #14030a 66%); }
html.mobile #mob.brood #mJump:not(.ready) { background:radial-gradient(circle at 42% 36%, #5a1a16 0, #2a070c 40%, #0a0204 75%); color:#b99; }
html.mobile #mob.brood #mJump.ready { border-color:#4a6a40; background:radial-gradient(circle at 42% 36%, #ff4a30 0, #8a0f14 33%, #14030a 66%); box-shadow:0 0 0 .4vmin #05070a, 0 0 3vmin #7dff5a99, inset 0 0 2.4vmin #000; }
html.mobile #mob.brood #mEngage, html.mobile #mob.brood #mFire, html.mobile #mob.brood button.mini { background:radial-gradient(circle at 40% 30%, #6a1520, #2a070c 55%, #0a0204); }
html.mobile #mob.brood #mEngage { box-shadow:0 0 0 .4vmin #05070a, 0 0 3vmin #ff2a1a88, inset 0 0 2.4vmin #000a; }
html.mobile #mob.brood #mEngage.disengage { background:radial-gradient(circle at 40% 30%, #4a4f57, #1b1e23 60%, #090a0c); box-shadow:0 0 0 .4vmin #05070a, 0 0 2vmin #ff2a1a55, inset 0 0 2.4vmin #000a; }
html.mobile #mob.brood #mFire { box-shadow:0 0 0 .4vmin #05070a, 0 0 2.4vmin #c4221a99, inset 0 0 2vmin #000a; }
html.mobile #mob.brood button.mini { box-shadow:0 0 0 .4vmin #05070a, 0 0 1.8vmin #8a1a1a99, inset 0 0 2vmin #000a; }
#mob.brood #mJumpRing .rb { stroke:#14030a; }

/* v2.252 default look "angular tactical": octagon plates, blocks that light up, hazard stripes. Brood keeps its own look (#mob.brood). */
html.mobile #mob:not(.brood) button { --c:#8c9cff; --f1:#3a40a8; --f2:#0a0c24; --cg:#8c9cff66; border:0 !important; border-radius:0 !important; background:var(--c) !important; box-shadow:none !important; text-shadow:0 0 5px #000, 0 0 3px #000;
  clip-path:polygon(29.3% 0, 70.7% 0, 100% 29.3%, 100% 70.7%, 70.7% 100%, 29.3% 100%, 0 70.7%, 0 29.3%); }
html.mobile #mob:not(.brood) button::before { content:""; position:absolute; inset:.6vmin; z-index:-1; background:linear-gradient(180deg, var(--f1), var(--f2)); box-shadow:inset 0 0 1.8vmin var(--cg);
  clip-path:polygon(29.3% 0, 70.7% 0, 100% 29.3%, 100% 70.7%, 70.7% 100%, 29.3% 100%, 0 70.7%, 0 29.3%); }
html.mobile #mob:not(.brood) #mJump { --c:#46e08a; --f1:#1f6a3e; --f2:#06180e; --cg:#46e08a77; }
html.mobile #mob:not(.brood) #mJump:not(.ready) { --c:#2f8a58; --f1:#143d27; --f2:#05120b; --cg:#2f8a5844; }
html.mobile #mob:not(.brood) #mEngage { --c:#ff4a52; --f1:#8a1c26; --f2:#1c0408; --cg:#ff4a5277; }
html.mobile #mob:not(.brood) #mEngage.disengage { --c:#b8c2dc; --f1:#4a5266; --f2:#10131c; --cg:#b8c2dc55; }
html.mobile #mob:not(.brood) #mFire, html.mobile #mob:not(.brood) #mCargoB { --c:#ffb04a; --f1:#8a5412; --f2:#1c1004; --cg:#ffb04a66; }
html.mobile #mob:not(.brood) #mFire.auto { --c:#ffe08a; --cg:#ffe08a99; }
html.mobile #mob:not(.brood) #mStatsB { --c:#b8c2dc; --f1:#4a5266; --f2:#10131c; --cg:#b8c2dc55; }
html.mobile #mob:not(.brood) button.dot::after { display:none; }
html.mobile #mob:not(.brood) button.dot { --c:#ffd84a; --cg:#ffd84acc; }   /* the unread / new-goods mark: the plate's edge turns yellow */
#mob:not(.brood) #mJumpRing .circ { display:none; } #mob.brood #mJumpRing .oct { display:none; } #mJumpRing path { fill:none; stroke-width:4.5; stroke-linejoin:miter; }
#mob:not(.brood) #mArc .arcfill, #mob:not(.brood) #mArc .hfl, #mob:not(.brood) #mArc .tick { display:none; }
#mob.brood #mArc .blk, #mob.brood #mArc .haz, #mob.brood #mArc .riv, #mob.brood #mArc .tiny { display:none; }
#mArc .blk { stroke-width:.9px; } #mArc .haz { display:none; } #mArc .riv { stroke:#05070a; stroke-width:3; opacity:.8; stroke-dasharray:0 9; stroke-linecap:round; }

/* v2.256 Heavy metal look (ship plan "Control look" = Heavy metal): gunmetal plates, red armour ENGAGE, lime JUMP. Same shapes and places as the default look. */
html.mobile #mob.heavy button { --c:#6a7079; --f1:#4a4f57; --f2:#16181b; --cg:#00000066; }
html.mobile #mob.heavy #mJump { --c:#6a7079; --f1:#26402a; --f2:#0a120c; --cg:#00000066; }
html.mobile #mob.heavy #mJump.ready { --c:#8a9099; --f1:#c8ff8a; --f2:#2fd04a; --cg:#6aff4a99; color:#06200a; text-shadow:none; }
html.mobile #mob.heavy #mJump:not(.ready) { --c:#555a62; --f1:#26402a; --f2:#0a120c; --cg:#00000066; }
html.mobile #mob.heavy #mEngage { --c:#8a9099; --f1:#d12a38; --f2:#5e0a12; --cg:#ff4a5266; }
html.mobile #mob.heavy #mEngage.disengage { --c:#8a9099; --f1:#5b6068; --f2:#1b1d21; --cg:#00000066; }
html.mobile #mob.heavy #mFire, html.mobile #mob.heavy #mCargoB { --c:#8a9099; --f1:#7a2a2e; --f2:#2a0a0c; --cg:#ff4a5233; }
html.mobile #mob.heavy #mFire.auto { --c:#c8ccd4; --f1:#a33a3e; }
html.mobile #mob.heavy #mStatsB { --c:#8a9099; --f1:#4a4f57; --f2:#16181b; --cg:#00000066; }
#mob.heavy #mArc .hh0, #mob.heavy #mArc .sh0 { stroke:#05070a; } #mob.heavy #mArc .hh1, #mob.heavy #mArc .sh1 { stroke:#6a7079; } #mob.heavy #mArc .hh2 { stroke:#0b0c0f; }
#mob.heavy #mJumpRing path { stroke:#6aff4a; }
#mob.heavy #mArc .riv { stroke:#aab0ba; opacity:.9; }

/* v2.257 White brain look: ivory shell, cyan cores. Same shapes (round JUMP, rounded plates) and places as the default. */

/* v2.259 Spiky look: dark skin, green collar rims, gold horns (the spikes around ENGAGE, Missile, Chat, Cargo and Ship). Same shapes and places as the default. */
html.mobile #mob.spiky button { --c:#1fae3a; --f1:#3a3849; --f2:#15141c; --cg:#3fe05a44; clip-path:inset(0 round 24%); }
html.mobile #mob.spiky button::before { clip-path:inset(0 round 24%); }
html.mobile #mob.spiky #mJump, html.mobile #mob.spiky #mJump::before { clip-path:circle(50%); }
html.mobile #mob.spiky #mJump { --f1:#1c3a22; --f2:#07140a; --cg:#00000055; }
html.mobile #mob.spiky #mJump.ready { --c:#5ff07a; --f1:#d6ffb0; --f2:#3fe05a; --cg:#3fe05a99; color:#052a0e; text-shadow:none; }
html.mobile #mob.spiky #mEngage { --c:#1fae3a; --f1:#ff6a5a; --f2:#6e0a14; --cg:#ff6a5a66; }
html.mobile #mob.spiky #mEngage.disengage { --c:#8a88a4; --f1:#3a3849; --f2:#15141c; --cg:#00000044; }
html.mobile #mob.spiky #mFire, html.mobile #mob.spiky #mCargoB { --c:#ffe14a; --f1:#6a5008; --f2:#1c1404; --cg:#ffe14a55; }
html.mobile #mob.spiky #mStatsB { --c:#1fae3a; --f1:#3a3849; --f2:#15141c; }
html.mobile #mob.spiky > svg.halo { display:block !important; }
html.mobile #mob.spiky > svg.halo.fhid { display:none !important; }
#mob.spiky .halo path { fill:#ffe14a; stroke:#4a3a04; }
#mob.spiky #mArc .hh0, #mob.spiky #mArc .sh0 { stroke:#0e0d14; } #mob.spiky #mArc .hh1, #mob.spiky #mArc .sh1 { stroke:#4a4860; } #mob.spiky #mArc .hh2 { stroke:#0b0a10; }
#mob.spiky #mJumpRing path { stroke:#5ff07a; }
#mob.spiky #mArc .riv { stroke:#1fae3a; opacity:.9; }
#mob.spiky #mJumpRing .oct { display:none; } #mob.spiky #mJumpRing .circ { display:block; }

/* v2.262 Biomech look ("Biomech HUD Arcs" design): blood glass hull tube, plasma shield cells, clamped by gold-taloned red knuckles; blue-eye JUMP in a red scaled rosette; orb buttons in red scaled rings. Same places as the default. */
#mArc .bm { display:none; }
#mArc.bmOn .bm { display:block; }
#mArc.bmOn > :not(.bm):not(.archit):not(.maxhit):not(defs) { display:none !important; }
#mArc .bmt { font-family:Georgia,"Times New Roman",serif; font-weight:700; paint-order:stroke; stroke:#1a0204; stroke-width:.9px; pointer-events:none; }
#mArc .bml { fill:#f0b8a8; stroke:none; } #mArc .bmsl { fill:#a8d8ff; } #mArc .bmv { fill:#ffe0c8; } #mArc .bmsv { fill:#d8eeff; stroke:#020814; }
#mArc .gmG { fill:#3cff8a; } #mArc .gmA { fill:#ffb02e; } #mArc .gmB { animation:bmGemA 1.4s linear infinite; } #mArc .gmR { animation:bmGemR .5s linear infinite; }
@keyframes bmGemA { 0%,49% { fill:#ffb02e; } 50%,100% { fill:#4a3008; } }
@keyframes bmGemR { 0%,49% { fill:#ff2a2a; } 50%,100% { fill:#3a0606; } }
html.mobile #mob.biomech > svg.halo.bmcl { display:block !important; }
html.mobile #mob.biomech > svg.halo.bmcl.fhid { display:none !important; }
html.mobile #mob.biomech > svg.halo:not(.bmcl) { display:none !important; }
html.mobile #mob:not(.biomech) > svg.halo.bmcl { display:none !important; }
html.mobile #mob.biomech #mJumpRing { display:none; }
/* JUMP: the eye is drawn in the arc svg; the button is only its transparent lid with the text */
html.mobile #mob.biomech #mJump { background:none !important; border:0 !important; box-shadow:none !important; clip-path:none; font-family:Georgia,"Times New Roman",serif; color:#fff; text-shadow:0 0 3px #0a1e5a, 0 0 3px #0a1e5a, 0 0 2px #0a1e5a; }
html.mobile #mob.biomech #mJump::before, html.mobile #mob.biomech #mJump::after { display:none !important; }
html.mobile #mob.biomech #mJump b { font-size:5.2vmin; letter-spacing:.06em; opacity:1; }
html.mobile #mob.biomech #mJump small { font-size:2.1vmin; letter-spacing:.22em; color:#fff; font-weight:700; }
html.mobile #mob.biomech #mJump:not(.ready) b { font-size:5.2vmin; opacity:1; }
html.mobile #mob.biomech #mJump:not(.ready) small { font-size:3.6vmin; letter-spacing:.02em; }
html.mobile #mob.biomech #mJump.ready small::after { content:"READY"; }
html.mobile #mob.biomech #mJump:not(.ready) b { display:none; }
/* orbs: dark well, 3D orb inside a red scaled ring */
html.mobile #mob.biomech button:not(#mJump) { --o1:#dff0ff; --o2:#3d86f0; --o3:#0a1648; clip-path:circle(50%); border:0 !important; box-shadow:none !important; font-family:Georgia,"Times New Roman",serif; font-weight:700; color:#fff; letter-spacing:.02em; text-shadow:0 0 2px #0a1e5a, 0 0 2px #0a1e5a, 0 0 2px #0a1e5a;
  background:radial-gradient(ellipse 30% 15% at 36% 27%, #ffffffb8, transparent) center/73% 73% no-repeat,
             radial-gradient(circle, var(--o1) 0, var(--o2) 36%, var(--o3) 66%, var(--o3) 70.6%, transparent 70.8%) center/73% 73% no-repeat,
             radial-gradient(circle closest-side, #05030a 0 77%, #14010a 77% 79%, #8a0a14 79% 85%, #c01a26 88%, #6a0812 94%, #14010a 100%) !important; }
html.mobile #mob.biomech button:not(#mJump)::before { display:none !important; }
html.mobile #mob.biomech button#mEngage { --o1:#ffd0c0; --o2:#d42230; --o3:#3a0510; text-shadow:0 0 2px #3a0510, 0 0 2px #3a0510, 0 0 2px #3a0510; }
html.mobile #mob.biomech button#mEngage.disengage { --o1:#f4f0f8; --o2:#8e869a; --o3:#16131c; text-shadow:0 0 2px #16131c, 0 0 2px #16131c, 0 0 2px #16131c; }
html.mobile #mob.biomech button#mFire { --o1:#fffbf0; --o2:#d9b24c; --o3:#3a2206; text-shadow:0 0 2px #3a2206, 0 0 2px #3a2206, 0 0 2px #3a2206; }
html.mobile #mob.biomech button#mFire.foff { filter:saturate(.35) brightness(.8); }
html.mobile #mob.biomech #mJump:not(.ready) small::after { content:"CHARGING"; display:block; font-size:1.8vmin; letter-spacing:.18em; margin-top:.4vmin; }

/* v2.265 White brain look ("Neural ship HUD" design): vertebra-plate hull with glowing windows, wide bone-cased shield, brain JUMP with glass lens, bone-ringed lens buttons. Same places as the default. */
#mArc .wb { display:none; }
#mArc.wbOn .wb { display:block; }
#mArc.wbOn > :not(.wb):not(.archit):not(.maxhit):not(defs) { display:none !important; }
#mArc .wbt { font-family:Georgia,"Times New Roman",serif; font-weight:700; paint-order:stroke; stroke:#0a0606; stroke-width:.9px; pointer-events:none; }
#mArc .wbl { fill:#e8eef4; stroke:none; } #mArc .wbsl { fill:#a8d8ff; } #mArc .wbsv { fill:#d8eeff; stroke:#020814; }
#mArc .wbBlink { animation:wbBlink .6s linear infinite; } @keyframes wbBlink { 50% { opacity:.25; } }
html.mobile #mob.bio > svg.halo { display:none !important; }
html.mobile #mob.bio #mJumpRing { display:none; }
html.mobile #mob.bio #mJump { background:none !important; border:0 !important; box-shadow:none !important; clip-path:none; font-family:Georgia,"Times New Roman",serif; color:#fff; text-shadow:0 0 3px #02302c, 0 0 3px #02302c, 0 0 2px #02302c; }
html.mobile #mob.bio #mJump::before, html.mobile #mob.bio #mJump::after { display:none !important; }
html.mobile #mob.bio #mJump b { font-size:3.5vmin; letter-spacing:.05em; opacity:1; }
html.mobile #mob.bio #mJump small { font-size:1.5vmin; letter-spacing:.2em; color:#fff; font-weight:700; }
html.mobile #mob.bio #mJump:not(.ready) b { display:none; }
html.mobile #mob.bio #mJump:not(.ready) small { font-size:3.6vmin; letter-spacing:.02em; }
html.mobile #mob.bio #mJump.ready small::after { content:"READY"; }
html.mobile #mob.bio #mJump:not(.ready) small::after { content:"CHARGING"; display:block; font-size:1.4vmin; letter-spacing:.16em; margin-top:.3vmin; }
/* lens buttons: a bone ring with a glass lens and a teal status dot */
html.mobile #mob.bio button:not(#mJump) { --l0:#e6fffb; --l1:#8ff5e6; --l2:#22b8a8; --l3:#0a5552; --l4:#031818; clip-path:circle(50%); border:0 !important; box-shadow:none !important; font-family:Georgia,"Times New Roman",serif; font-weight:700; color:#fff; letter-spacing:.02em; text-shadow:0 0 2px #02302c, 0 0 2px #02302c, 0 0 2px #02302c; position:fixed;
  background:radial-gradient(ellipse 30% 15% at 36% 27%, #ffffffa0, transparent) center/73% 73% no-repeat,
             radial-gradient(circle, var(--l0) 0, var(--l1) 14%, var(--l2) 35%, var(--l3) 56%, var(--l4) 70.6%, transparent 70.8%) center/73% 73% no-repeat,
             radial-gradient(circle closest-side, #031416 0 76%, #0a0f10 76% 79%, #fffdf6 80%, #ebe5d6 86%, #b4ad9c 94%, #5e584c 99%, #2a2620 100%) !important; }
html.mobile #mob.bio button:not(#mJump)::before { display:none !important; }
html.mobile #mob.bio button:not(#mJump)::after { content:""; position:absolute; right:12%; top:12%; width:9%; height:9%; border-radius:50%; background:#3dffc4; box-shadow:0 0 3px #3dffc4; }
html.mobile #mob.bio button#mFire { --l0:#fff6dc; --l1:#ffd27a; --l2:#c47a12; --l3:#2a1404; --l4:#2a1404; text-shadow:0 0 2px #3a1a04, 0 0 2px #3a1a04, 0 0 2px #3a1a04; }
html.mobile #mob.bio button#mFire.foff { filter:saturate(.35) brightness(.8); }
html.mobile #mob.bio button#mEngage { --l0:#ffe0dc; --l1:#ff7a6a; --l2:#b8201a; --l3:#2a0404; --l4:#2a0404; text-shadow:0 0 2px #1a0404, 0 0 2px #1a0404, 0 0 2px #1a0404; }
html.mobile #mob.bio button#mEngage.disengage { --l0:#e8eef4; --l1:#a9b6bd; --l2:#6a7478; --l3:#2a3033; --l4:#2a3033; text-shadow:0 0 2px #0a0f10, 0 0 2px #0a0f10, 0 0 2px #0a0f10; }

/* ---- v2.267 Venom look (phone): green venom glass hull, plasma shield, hide plates and yellow talons, chrome blue eye JUMP ---- */
#mArc .vn { display:none; }
#mArc.vnOn .vn { display:block; }
#mArc.vnOn > :not(.vn):not(.archit):not(.maxhit):not(defs) { display:none !important; }
#mArc .vnt { font-family:Georgia,"Times New Roman",serif; font-weight:700; paint-order:stroke; stroke:#021a02; stroke-width:.9px; pointer-events:none; }
#mArc .vnl { fill:#d8f0c8; stroke:none; } #mArc .vnsl { fill:#a8d8ff; } #mArc .vnv { fill:#9aff5a; } #mArc .vnsv { fill:#d8eeff; stroke:#020814; }
html.mobile #mob.venom > svg.halo.vncl { display:block !important; }
html.mobile #mob.venom > svg.halo.vncl.fhid { display:none !important; }
html.mobile #mob.venom > svg.halo:not(.vncl) { display:none !important; }
html.mobile #mob:not(.venom) > svg.halo.vncl { display:none !important; }
html.mobile #mob.venom #mJumpRing { display:none; }
html.mobile #mob.venom #mJump { background:none !important; border:0 !important; box-shadow:none !important; clip-path:none; font-family:Georgia,"Times New Roman",serif; color:#fff; text-shadow:0 0 3px #0a1e5a, 0 0 3px #0a1e5a, 0 0 2px #0a1e5a; }
html.mobile #mob.venom #mJump::before, html.mobile #mob.venom #mJump::after { display:none !important; }
html.mobile #mob.venom #mJump b { font-size:3.7vmin; letter-spacing:.06em; opacity:1; }
html.mobile #mob.venom #mJump small { font-size:1.5vmin; letter-spacing:.22em; color:#fff; font-weight:700; }
html.mobile #mob.venom #mJump:not(.ready) b { display:none; }
html.mobile #mob.venom #mJump:not(.ready) small { font-size:3.2vmin; letter-spacing:.02em; }
html.mobile #mob.venom #mJump.ready small::after { content:"READY"; }
html.mobile #mob.venom #mJump:not(.ready) small::after { content:"CHARGING"; display:block; font-size:1.3vmin; letter-spacing:.14em; margin-top:.3vmin; }
/* orbs: dark well, chrome orb inside a toxic green ring */
html.mobile #mob.venom button:not(#mJump) { --o1:#dfe6ff; --o2:#5a6ad8; --o3:#06081e; clip-path:circle(50%); border:0 !important; box-shadow:none !important; font-family:Georgia,"Times New Roman",serif; font-weight:700; color:#fff; letter-spacing:.02em; text-shadow:0 0 2px #0a1440, 0 0 2px #0a1440, 0 0 2px #0a1440;
  background:radial-gradient(ellipse 30% 15% at 36% 27%, #ffffffb8, transparent) center/73% 73% no-repeat,
             radial-gradient(circle, var(--o1) 0, var(--o2) 36%, var(--o3) 66%, var(--o3) 70.6%, transparent 70.8%) center/73% 73% no-repeat,
             radial-gradient(circle closest-side, #031006 0 77%, #0a2a0e 77% 79%, #1e7a24 79% 85%, #5ad850 88%, #0e4a14 94%, #021006 100%) !important; }
html.mobile #mob.venom button:not(#mJump)::before { display:none !important; }
html.mobile #mob.venom button#mEngage { --o1:#ffd0c0; --o2:#d42230; --o3:#3a0510; text-shadow:0 0 2px #3a0510, 0 0 2px #3a0510, 0 0 2px #3a0510; }
html.mobile #mob.venom button#mEngage.disengage { --o1:#f4f4f4; --o2:#9a9fa6; --o3:#1a1d20; text-shadow:0 0 2px #1a1d20, 0 0 2px #1a1d20, 0 0 2px #1a1d20; }
html.mobile #mob.venom button#mFire { --o1:#fffbe0; --o2:#d9b02c; --o3:#3a2606; text-shadow:0 0 2px #3a2606, 0 0 2px #3a2606, 0 0 2px #3a2606; }
html.mobile #mob.venom button#mFire.foff { filter:saturate(.35) brightness(.8); }

/* ---- v2.269 JUMP label readability: a solid dark outline around the white text in every look that draws its own JUMP (phone) ---- */
html.mobile #mob.bio #mJump, html.mobile #mob.biomech #mJump, html.mobile #mob.venom #mJump, html.mobile #mob.spk #mJump { paint-order:stroke fill; -webkit-text-stroke:.8vmin var(--jo, #06281f); text-shadow:0 0 .6vmin var(--jo, #06281f), 0 0 1vmin var(--jo, #06281f), 0 0 1.4vmin var(--jo, #06281f); }
html.mobile #mob.bio #mJump { --jo:#02302c; } html.mobile #mob.biomech #mJump { --jo:#0a1e5a; } html.mobile #mob.venom #mJump { --jo:#0a1440; } html.mobile #mob.spk #mJump { --jo:#0b2a0b; }
html.mobile #mob.bio #mJump b { font-size:4vmin; } html.mobile #mob.bio #mJump small, html.mobile #mob.venom #mJump small, html.mobile #mob.biomech #mJump small { font-weight:900; }

/* ---- v2.271 a jump-ready JUMP button blinks in every look (the button and the drawn eye or ring) ---- */
@keyframes mJumpBlink { 0%,100% { opacity:1; } 50% { opacity:.3; } }
html.mobile #mob.jrd #mJump { animation:mJumpBlink 1.1s ease-in-out infinite; }
html.mobile #mob.jrd #mJumpRing { animation:mJumpBlink 1.1s ease-in-out infinite; }
#mob.jrd #mArc #bmRdy, #mob.jrd #mArc #wRdy, #mob.jrd #mArc #vnRdy, #mob.jrd #mArc #vnPips, #mob.jrd #mArc #wLens { animation:mJumpBlink 1.1s ease-in-out infinite; }

/* ---- v2.272 five more looks (phone): Aegis, Behemoth, Warhound, Ironclad, Nightspike ---- */
#mArc .lk { display:none; }
#mArc .lk.act { display:block; }
#mArc.lkOn > :not(.lk):not(.archit):not(.maxhit):not(defs) { display:none !important; }
html.mobile #mob.lkm > svg.halo { display:none !important; }
html.mobile #mob.lkm #mJumpRing { display:none; }
html.mobile #mob.lkm #mJump { background:none !important; border:0 !important; box-shadow:none !important; clip-path:none; font-family:Georgia,"Times New Roman",serif; color:var(--jt,#fff); paint-order:stroke fill; -webkit-text-stroke:.8vmin var(--jo,#000); text-shadow:0 0 .6vmin var(--jo,#000), 0 0 1vmin var(--jo,#000); }
html.mobile #mob.lkm #mJump::before, html.mobile #mob.lkm #mJump::after { display:none !important; }
html.mobile #mob.lkm #mJump b { font-size:4.6vmin; letter-spacing:.05em; opacity:1; font-weight:900; }
html.mobile #mob.lkm #mJump small { font-size:2vmin; letter-spacing:.22em; color:var(--jt,#fff); font-weight:900; }
html.mobile #mob.lkm #mJump:not(.ready) b { display:none; }
html.mobile #mob.lkm #mJump:not(.ready) small { font-size:3.6vmin; letter-spacing:.02em; }
html.mobile #mob.lkm #mJump.ready small::after { content:"READY"; }
html.mobile #mob.lkm #mJump:not(.ready) small::after { content:"CHARGING"; display:block; font-size:1.7vmin; letter-spacing:.16em; margin-top:.4vmin; }
html.mobile #mob.nightspike #mJump { display:flex; flex-direction:column-reverse; justify-content:space-between; align-items:center; padding:4.2vmin 0 3.6vmin; box-sizing:border-box; }
html.mobile #mob.lkm button:not(#mJump) { --o1:#fff; --o2:#888; --o3:#222; clip-path:circle(50%); border:0 !important; box-shadow:none !important; font-family:Georgia,"Times New Roman",serif; font-weight:700; color:#fff; letter-spacing:.02em; paint-order:stroke fill; -webkit-text-stroke:.45vmin var(--oo,#000);
  background:radial-gradient(ellipse 30% 15% at 36% 27%, #ffffffb8, transparent) center/73% 73% no-repeat,
             radial-gradient(circle, var(--o1) 0, var(--o2) 36%, var(--o3) 66%, var(--o3) 70.6%, transparent 70.8%) center/73% 73% no-repeat,
             radial-gradient(circle closest-side, var(--ring)) !important; }
html.mobile #mob.lkm button:not(#mJump)::before { display:none !important; }
html.mobile #mob.lkm button#mEngage { --o1:#ffd0c0; --o2:#d42230; --o3:#3a0510; --oo:#3a0510; }
html.mobile #mob.lkm button#mEngage.disengage { --o1:#f4f4f4; --o2:#9a9fa6; --o3:#1a1d20; --oo:#1a1d20; }
html.mobile #mob.lkm button#mFire { --o1:#fffbe0; --o2:#d9b02c; --o3:#3a2606; --oo:#3a2606; }
html.mobile #mob.lkm button#mFire.foff { filter:saturate(.35) brightness(.8); }
html.mobile #mob.aegis { --jt:#ffffff; --jo:#0a1a48; --ring:#0a0e14 0 77%, #5a6470 77% 79%, #ffffff 80%, #d8dee6 88%, #9aa4b0 95%, #20262e 100%; }
html.mobile #mob.aegis button:not(#mJump):not(#mEngage):not(#mFire) { --o1:#f0faff; --o2:#2a6ae0; --o3:#040c28; --oo:#040c28; }
html.mobile #mob.behemoth { --jt:#ffffff; --jo:#2a0a00; --ring:#0a0804 0 77%, #3a2e18 77% 79%, #f0e4b8 80%, #c4b388 88%, #8a7a50 95%, #2a2010 100%; }
html.mobile #mob.behemoth button:not(#mJump):not(#mEngage):not(#mFire) { --o1:#ffe0a0; --o2:#e86a10; --o3:#2a0a00; --oo:#2a0a00; }
html.mobile #mob.warhound { --jt:#14180a; --jo:#eaff9a; --ring:#14140a 0 77%, #3a3a14 77% 79%, #9a9a50 80%, #6a6a2c 88%, #ffc81a 95%, #14140a 100%; }
html.mobile #mob.warhound button:not(#mJump):not(#mEngage):not(#mFire) { --o1:#f0ffb0; --o2:#8ac81a; --o3:#1a2a04; --oo:#1a2a04; }
html.mobile #mob.ironclad { --jt:#ffffff; --jo:#3a0a00; --ring:#0a0c0e 0 77%, #5a6068 77% 79%, #ffffff 80%, #c8ccd2 88%, #6a7078 95%, #1a1c20 100%; }
html.mobile #mob.ironclad button:not(#mJump):not(#mEngage):not(#mFire) { --o1:#ffd8a0; --o2:#e85a10; --o3:#3a1000; --oo:#3a1000; }
html.mobile #mob.nightspike { --jt:#e8e4ff; --jo:#0a0420; --ring:#02040a 0 77%, #1a2a6a 77% 79%, #7a8ac0 80%, #3a4a8a 88%, #8a7aff 95%, #02040a 100%; }
html.mobile #mob.nightspike button:not(#mJump):not(#mEngage):not(#mFire) { --o1:#e8e4ff; --o2:#6a5ae0; --o3:#0a0630; --oo:#0a0630; }
html.mobile #mob.hydra { --jt:#fff5e0; --jo:#2a0000; --ring:#0a0000 0 77%, #5a0a0a 77% 79%, #ff8a7a 80%, #d81818 88%, #7a0808 95%, #1a0101 100%; }
html.mobile #mob.hydra button:not(#mJump):not(#mEngage):not(#mFire) { --o1:#a8c8ff; --o2:#2a5ae0; --o3:#050c30; --oo:#050c30; }
html.mobile #mob.pest { --jt:#fff2ea; --jo:#0a0908; --ring:#0a0908 0 77%, #2a2a28 77% 79%, #b8b4ac 80%, #8a8780 88%, #5a5852 95%, #141412 100%; }
html.mobile #mob.pest button:not(#mJump):not(#mEngage):not(#mFire) { --o1:#ff8a7a; --o2:#c81010; --o3:#2a0202; --oo:#2a0202; }
#mob.jrd #mArc .lk.act [id$="_RDY"] { animation:mJumpBlink 1.1s ease-in-out infinite; }
html.mobile #mob.pest #mJump b, html.mobile #mob.pest #mJump small { position:relative; top:-4vmin; }
html.mobile #mob.pest button#mFire { --o1:#e0ffa8; --o2:#4ac81a; --o3:#0a2a04; --oo:#0a2a04; }
html.mobile #mob.pest button#mEngage.disengage { --o1:#e8e4dc; --o2:#8a8780; --o3:#1a1816; --oo:#1a1816; }
/* v2.273 Red Hydra: JUMP or the charging seconds sit on the armour under the eye, never over it */
html.mobile #mob.hydra #mJump b, html.mobile #mob.hydra #mJump small { position:relative; top:5.2vmin; }
html.mobile #mob.hydra #mJump b { font-size:3.5vmin; letter-spacing:.04em; }
html.mobile #mob.hydra #mJump small { font-size:3.3vmin; letter-spacing:.02em; }
html.mobile #mob.hydra #mJump.ready small, html.mobile #mob.hydra #mJump.ready small::after, html.mobile #mob.hydra #mJump:not(.ready) small::after { display:none !important; content:none; }
/* v2.273 orb buttons: the Red Hydra and Plague Pest designs draw each round button as the look's collar around a glass lens */
html.mobile #mob.hydra { --orb-b:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%22-132 -132 264 264%22%3E%3Cdefs%3E%3CradialGradient id=%22hyLensB%22 cx=%22.4%22 cy=%22.35%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23e8f4ff%22%3E%3C/stop%3E%3Cstop offset=%22.25%22 stop-color=%22%237ab8ff%22%3E%3C/stop%3E%3Cstop offset=%22.6%22 stop-color=%22%231a4ac0%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%23030a28%22%3E%3C/stop%3E%3C/radialGradient%3E%3Cg id=%22hyCollar%22%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%22122%22 fill=%22%230a0000%22%3E%3C/circle%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(0)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(20)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(40)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(60)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(80)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(100)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(120)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(140)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(160)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(180)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(200)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(220)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(240)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(260)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(280)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(300)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(320)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(340)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(10)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(70)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(130)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(190)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(250)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(310)%22%3E%3C/use%3E%0A%3C/g%3E%3Cg id=%22hyThorn%22%3E%0A%3Cpath d=%22M 113 -6 C 118 -13 121 -22 119 -32 C 123 -24 125 -14 121 -6 Z%22 fill=%22url(%23hyClaw)%22 stroke=%22%232a2a00%22 stroke-width=%22.5%22%3E%3C/path%3E%0A%3Cpath d=%22M 115 -7.5 C 119 -14 121 -22 120 -29%22 fill=%22none%22 stroke=%22%23ffffff%22 stroke-opacity=%22.7%22 stroke-width=%22.5%22%3E%3C/path%3E%0A%3C/g%3E%3ClinearGradient id=%22hyClaw%22 x1=%221%22 y1=%220%22 x2=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%232a2a00%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%237a8a08%22%3E%3C/stop%3E%3Cstop offset=%22.6%22 stop-color=%22%23d4e040%22%3E%3C/stop%3E%3Cstop offset=%22.85%22 stop-color=%22%23f4f8a8%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%23ffffe8%22%3E%3C/stop%3E%3C/linearGradient%3E%3Cg id=%22hyCrest%22%3E%0A%3Cuse href=%22%23hyCrestS%22 fill=%22%23000000%22 opacity=%22.5%22 transform=%22translate(1.2 2)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrestS%22 fill=%22url(%23hyFeatherY)%22 stroke=%22%231a0101%22 stroke-width=%22.7%22%3E%3C/use%3E%0A%3Cpath d=%22M 90 -6 C 102 -9 115 -14 125 -22%22 fill=%22none%22 stroke=%22%23ffd8cc%22 stroke-opacity=%22.75%22 stroke-width=%22.7%22%3E%3C/path%3E%0A%3Cpath d=%22M 96 -9 Q 94 0 97 9 M 104 -11 Q 102 0 104.5 9.8%22 fill=%22none%22 stroke=%22%233a0202%22 stroke-opacity=%22.5%22 stroke-width=%22.6%22%3E%3C/path%3E%0A%3C/g%3E%3ClinearGradient id=%22hyFeatherY%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%231a0101%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%23a00c0c%22%3E%3C/stop%3E%3Cstop offset=%22.46%22 stop-color=%22%23ff6a58%22%3E%3C/stop%3E%3Cstop offset=%22.52%22 stop-color=%22%23ffd0c4%22%3E%3C/stop%3E%3Cstop offset=%22.58%22 stop-color=%22%23d81818%22%3E%3C/stop%3E%3Cstop offset=%22.85%22 stop-color=%22%235a0303%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%231a0101%22%3E%3C/stop%3E%3C/linearGradient%3E%3Cpath id=%22hyCrestS%22 d=%22M 86 -9 C 98 -12 113 -17 128 -26 C 121 -13 115 -2 111 10 C 102 12 92 11 86 9 Z%22%3E%3C/path%3E%3C/defs%3E%3Cuse href=%22%23hyCollar%22 transform=%22translate(-150 -400)%22/%3E%3Ccircle r=%2286.7%22 fill=%22%23140000%22/%3E%3Ccircle r=%2280%22 fill=%22url(%23hyLensB)%22/%3E%3Cellipse cx=%22-28%22 cy=%22-33.6%22 rx=%2230.4%22 ry=%2212.8%22 transform=%22rotate(-30 -28 -33.6)%22 fill=%22%23fff%22 opacity=%22.55%22/%3E%3C/svg%3E"); }
html.mobile #mob.hydra { --orb-y:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%22-132 -132 264 264%22%3E%3Cdefs%3E%3CradialGradient id=%22hyLensY%22 cx=%22.4%22 cy=%22.35%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23ffffe0%22%3E%3C/stop%3E%3Cstop offset=%22.25%22 stop-color=%22%23e8f060%22%3E%3C/stop%3E%3Cstop offset=%22.6%22 stop-color=%22%239aa010%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%231a1a00%22%3E%3C/stop%3E%3C/radialGradient%3E%3Cg id=%22hyCollar%22%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%22122%22 fill=%22%230a0000%22%3E%3C/circle%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(0)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(20)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(40)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(60)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(80)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(100)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(120)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(140)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(160)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(180)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(200)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(220)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(240)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(260)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(280)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(300)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(320)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(340)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(10)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(70)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(130)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(190)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(250)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(310)%22%3E%3C/use%3E%0A%3C/g%3E%3Cg id=%22hyThorn%22%3E%0A%3Cpath d=%22M 113 -6 C 118 -13 121 -22 119 -32 C 123 -24 125 -14 121 -6 Z%22 fill=%22url(%23hyClaw)%22 stroke=%22%232a2a00%22 stroke-width=%22.5%22%3E%3C/path%3E%0A%3Cpath d=%22M 115 -7.5 C 119 -14 121 -22 120 -29%22 fill=%22none%22 stroke=%22%23ffffff%22 stroke-opacity=%22.7%22 stroke-width=%22.5%22%3E%3C/path%3E%0A%3C/g%3E%3ClinearGradient id=%22hyClaw%22 x1=%221%22 y1=%220%22 x2=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%232a2a00%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%237a8a08%22%3E%3C/stop%3E%3Cstop offset=%22.6%22 stop-color=%22%23d4e040%22%3E%3C/stop%3E%3Cstop offset=%22.85%22 stop-color=%22%23f4f8a8%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%23ffffe8%22%3E%3C/stop%3E%3C/linearGradient%3E%3Cg id=%22hyCrest%22%3E%0A%3Cuse href=%22%23hyCrestS%22 fill=%22%23000000%22 opacity=%22.5%22 transform=%22translate(1.2 2)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrestS%22 fill=%22url(%23hyFeatherY)%22 stroke=%22%231a0101%22 stroke-width=%22.7%22%3E%3C/use%3E%0A%3Cpath d=%22M 90 -6 C 102 -9 115 -14 125 -22%22 fill=%22none%22 stroke=%22%23ffd8cc%22 stroke-opacity=%22.75%22 stroke-width=%22.7%22%3E%3C/path%3E%0A%3Cpath d=%22M 96 -9 Q 94 0 97 9 M 104 -11 Q 102 0 104.5 9.8%22 fill=%22none%22 stroke=%22%233a0202%22 stroke-opacity=%22.5%22 stroke-width=%22.6%22%3E%3C/path%3E%0A%3C/g%3E%3ClinearGradient id=%22hyFeatherY%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%231a0101%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%23a00c0c%22%3E%3C/stop%3E%3Cstop offset=%22.46%22 stop-color=%22%23ff6a58%22%3E%3C/stop%3E%3Cstop offset=%22.52%22 stop-color=%22%23ffd0c4%22%3E%3C/stop%3E%3Cstop offset=%22.58%22 stop-color=%22%23d81818%22%3E%3C/stop%3E%3Cstop offset=%22.85%22 stop-color=%22%235a0303%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%231a0101%22%3E%3C/stop%3E%3C/linearGradient%3E%3Cpath id=%22hyCrestS%22 d=%22M 86 -9 C 98 -12 113 -17 128 -26 C 121 -13 115 -2 111 10 C 102 12 92 11 86 9 Z%22%3E%3C/path%3E%3C/defs%3E%3Cuse href=%22%23hyCollar%22 transform=%22translate(-150 -400)%22/%3E%3Ccircle r=%2286.7%22 fill=%22%23140000%22/%3E%3Ccircle r=%2280%22 fill=%22url(%23hyLensY)%22/%3E%3Cellipse cx=%22-28%22 cy=%22-33.6%22 rx=%2230.4%22 ry=%2212.8%22 transform=%22rotate(-30 -28 -33.6)%22 fill=%22%23fff%22 opacity=%22.55%22/%3E%3C/svg%3E"); }
html.mobile #mob.hydra { --orb-r:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%22-132 -132 264 264%22%3E%3Cdefs%3E%3CradialGradient id=%22hyLensR%22 cx=%22.4%22 cy=%22.35%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23ffd8cc%22%3E%3C/stop%3E%3Cstop offset=%22.25%22 stop-color=%22%23ff5a4a%22%3E%3C/stop%3E%3Cstop offset=%22.6%22 stop-color=%22%23b01010%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%232a0000%22%3E%3C/stop%3E%3C/radialGradient%3E%3Cg id=%22hyCollar%22%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%22122%22 fill=%22%230a0000%22%3E%3C/circle%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(0)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(20)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(40)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(60)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(80)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(100)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(120)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(140)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(160)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(180)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(200)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(220)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(240)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(260)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(280)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(300)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(320)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrest%22 transform=%22translate(150 400) rotate(340)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(10)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(70)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(130)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(190)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(250)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyThorn%22 transform=%22translate(150 400) rotate(310)%22%3E%3C/use%3E%0A%3C/g%3E%3Cg id=%22hyThorn%22%3E%0A%3Cpath d=%22M 113 -6 C 118 -13 121 -22 119 -32 C 123 -24 125 -14 121 -6 Z%22 fill=%22url(%23hyClaw)%22 stroke=%22%232a2a00%22 stroke-width=%22.5%22%3E%3C/path%3E%0A%3Cpath d=%22M 115 -7.5 C 119 -14 121 -22 120 -29%22 fill=%22none%22 stroke=%22%23ffffff%22 stroke-opacity=%22.7%22 stroke-width=%22.5%22%3E%3C/path%3E%0A%3C/g%3E%3ClinearGradient id=%22hyClaw%22 x1=%221%22 y1=%220%22 x2=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%232a2a00%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%237a8a08%22%3E%3C/stop%3E%3Cstop offset=%22.6%22 stop-color=%22%23d4e040%22%3E%3C/stop%3E%3Cstop offset=%22.85%22 stop-color=%22%23f4f8a8%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%23ffffe8%22%3E%3C/stop%3E%3C/linearGradient%3E%3Cg id=%22hyCrest%22%3E%0A%3Cuse href=%22%23hyCrestS%22 fill=%22%23000000%22 opacity=%22.5%22 transform=%22translate(1.2 2)%22%3E%3C/use%3E%0A%3Cuse href=%22%23hyCrestS%22 fill=%22url(%23hyFeatherY)%22 stroke=%22%231a0101%22 stroke-width=%22.7%22%3E%3C/use%3E%0A%3Cpath d=%22M 90 -6 C 102 -9 115 -14 125 -22%22 fill=%22none%22 stroke=%22%23ffd8cc%22 stroke-opacity=%22.75%22 stroke-width=%22.7%22%3E%3C/path%3E%0A%3Cpath d=%22M 96 -9 Q 94 0 97 9 M 104 -11 Q 102 0 104.5 9.8%22 fill=%22none%22 stroke=%22%233a0202%22 stroke-opacity=%22.5%22 stroke-width=%22.6%22%3E%3C/path%3E%0A%3C/g%3E%3ClinearGradient id=%22hyFeatherY%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%231a0101%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%23a00c0c%22%3E%3C/stop%3E%3Cstop offset=%22.46%22 stop-color=%22%23ff6a58%22%3E%3C/stop%3E%3Cstop offset=%22.52%22 stop-color=%22%23ffd0c4%22%3E%3C/stop%3E%3Cstop offset=%22.58%22 stop-color=%22%23d81818%22%3E%3C/stop%3E%3Cstop offset=%22.85%22 stop-color=%22%235a0303%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%231a0101%22%3E%3C/stop%3E%3C/linearGradient%3E%3Cpath id=%22hyCrestS%22 d=%22M 86 -9 C 98 -12 113 -17 128 -26 C 121 -13 115 -2 111 10 C 102 12 92 11 86 9 Z%22%3E%3C/path%3E%3C/defs%3E%3Cuse href=%22%23hyCollar%22 transform=%22translate(-150 -400)%22/%3E%3Ccircle r=%2286.7%22 fill=%22%23140000%22/%3E%3Ccircle r=%2280%22 fill=%22url(%23hyLensR)%22/%3E%3Cellipse cx=%22-28%22 cy=%22-33.6%22 rx=%2230.4%22 ry=%2212.8%22 transform=%22rotate(-30 -28 -33.6)%22 fill=%22%23fff%22 opacity=%22.55%22/%3E%3C/svg%3E"); }
html.mobile #mob.hydra button:not(#mJump) { background:var(--orb-b) center/100% 100% no-repeat !important; --oo:#2a0000; }
html.mobile #mob.hydra button#mFire { background:var(--orb-y) center/100% 100% no-repeat !important; --oo:#2a0000; }
html.mobile #mob.hydra button#mEngage { background:var(--orb-r) center/100% 100% no-repeat !important; --oo:#2a0000; }
html.mobile #mob.hydra button#mEngage.disengage { background:var(--orb-r) center/100% 100% no-repeat !important; --oo:#2a0000; }
html.mobile #mob.pest { --orb-r:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%22-124 -124 248 248%22%3E%3Cdefs%3E%3CradialGradient id=%22peLensR%22 cx=%22.4%22 cy=%22.35%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23ffd8c8%22%3E%3C/stop%3E%3Cstop offset=%22.25%22 stop-color=%22%23ff4a2a%22%3E%3C/stop%3E%3Cstop offset=%22.6%22 stop-color=%22%239a0606%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%231a0000%22%3E%3C/stop%3E%3C/radialGradient%3E%3Cg id=%22peCollar2%22%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%22124%22 fill=%22%230a0908%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%2296%22 fill=%22none%22 stroke=%22url(%23peChitin)%22 stroke-width=%2220%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%2296%22 fill=%22none%22 stroke=%22url(%23peGrime)%22 stroke-width=%2220%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%2296%22 fill=%22none%22 stroke=%22%230a0908%22 stroke-width=%2220%22 stroke-dasharray=%221.6 15.2%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%22105.5%22 fill=%22none%22 stroke=%22%23ff2a1a%22 stroke-width=%222%22 stroke-dasharray=%220.01 16.8%22 stroke-linecap=%22round%22%3E%3C/circle%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(0) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(15) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(30) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(45) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(60) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(75) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(90) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(105) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(120) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(135) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(150) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(165) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(180) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(195) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(210) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(225) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(240) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(255) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(270) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(285) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(300) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(315) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(330) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(345) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3C/g%3E%3Cg id=%22peClaw%22%3E%0A%3Cuse href=%22%23peClawS%22 fill=%22%23000000%22 opacity=%22.55%22 transform=%22translate(1 1.8)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawS%22 fill=%22url(%23peClawG)%22 stroke=%22%23050404%22 stroke-width=%22.5%22%3E%3C/use%3E%0A%3Cpath d=%22M 2 -2.6 C 11 -3.4 20 -6.4 27 -12.6%22 fill=%22none%22 stroke=%22%23ffffff%22 stroke-opacity=%22.7%22 stroke-width=%22.55%22%3E%3C/path%3E%0A%3Cpath d=%22M 4 -3.4 Q 3 0 4 3.2 M 8 -3.8 Q 7 -.5 8 2.6%22 fill=%22none%22 stroke=%22%230a0908%22 stroke-width=%22.7%22%3E%3C/path%3E%0A%3C/g%3E%3ClinearGradient id=%22peClawG%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%231a1816%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%235a5650%22%3E%3C/stop%3E%3Cstop offset=%22.62%22 stop-color=%22%23cfcbc2%22%3E%3C/stop%3E%3Cstop offset=%22.82%22 stop-color=%22%238a8680%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%23141210%22%3E%3C/stop%3E%3C/linearGradient%3E%3Cpath id=%22peClawS%22 d=%22M 0 -3.2 C 10 -4 20 -7 28 -14 C 30 -16 31.5 -18 32 -20 C 29 -14 22 -6 14 -1 C 9 2 4 3.2 0 3.2 Z%22%3E%3C/path%3E%3Cg id=%22peClawV%22%3E%3Cuse href=%22%23peClaw%22%3E%3C/use%3E%3Ccircle cx=%2231.6%22 cy=%22-19.4%22 r=%221.7%22 fill=%22%23b8ff3a%22%3E%3C/circle%3E%3C/g%3E%3Cpattern id=%22peGrime%22 width=%2222%22 height=%2220%22 patternUnits=%22userSpaceOnUse%22%3E%0A%3Ccircle cx=%224%22 cy=%225%22 r=%223.4%22 fill=%22%232a2214%22 opacity=%22.45%22%3E%3C/circle%3E%3Ccircle cx=%2215%22 cy=%2213%22 r=%224.2%22 fill=%22%231a1810%22 opacity=%22.4%22%3E%3C/circle%3E%3Ccircle cx=%2212%22 cy=%223%22 r=%221.6%22 fill=%22%23ffffff%22 opacity=%22.12%22%3E%3C/circle%3E%3Ccircle cx=%223%22 cy=%2215%22 r=%222.2%22 fill=%22%233a3418%22 opacity=%22.5%22%3E%3C/circle%3E%3Ccircle cx=%2219%22 cy=%224%22 r=%221.2%22 fill=%22%234a1a0a%22 opacity=%22.5%22%3E%3C/circle%3E%0A%3Cpath d=%22M 2 10 L 9 8 M 13 18 L 20 16 M 8 1 L 11 6%22 stroke=%22%23000000%22 stroke-opacity=%22.35%22 stroke-width=%22.5%22%3E%3C/path%3E%0A%3C/pattern%3E%3CradialGradient id=%22peChitin%22 cx=%22.35%22 cy=%22.28%22 r=%22.85%22%3E%3Cstop offset=%220%22 stop-color=%22%23f0ece4%22%3E%3C/stop%3E%3Cstop offset=%22.25%22 stop-color=%22%23b8b4aa%22%3E%3C/stop%3E%3Cstop offset=%22.55%22 stop-color=%22%236a6660%22%3E%3C/stop%3E%3Cstop offset=%22.82%22 stop-color=%22%232e2c28%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%230e0d0c%22%3E%3C/stop%3E%3C/radialGradient%3E%3Cpattern id=%22peHex%22 width=%229%22 height=%2215.588%22 patternUnits=%22userSpaceOnUse%22 patternTransform=%22scale(3.4)%22%3E%3Cpath d=%22M 4.5 0 L 9 2.598 L 9 7.794 L 4.5 10.392 L 0 7.794 L 0 2.598 Z M 4.5 10.392 L 4.5 15.588%22 fill=%22none%22 stroke=%22%232a0000%22 stroke-width=%22.9%22/%3E%3Ccircle cx=%223.6%22 cy=%224%22 r=%22.9%22 fill=%22%23fff%22 opacity=%22.35%22/%3E%3C/pattern%3E%3C/defs%3E%3Cuse href=%22%23peCollar2%22 transform=%22translate(-150 -400)%22/%3E%3Ccircle r=%2286.7%22 fill=%22%230a0908%22/%3E%3Ccircle r=%2280%22 fill=%22url(%23peLensR)%22/%3E%3Ccircle r=%2280%22 fill=%22url(%23peHex)%22 opacity=%22.7%22/%3E%3Cellipse cx=%22-28%22 cy=%22-33.6%22 rx=%2230.4%22 ry=%2212.8%22 transform=%22rotate(-30 -28 -33.6)%22 fill=%22%23fff%22 opacity=%22.55%22/%3E%3C/svg%3E"); }
html.mobile #mob.pest { --orb-g:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%22-124 -124 248 248%22%3E%3Cdefs%3E%3CradialGradient id=%22peLensG%22 cx=%22.4%22 cy=%22.35%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23f0ffd8%22%3E%3C/stop%3E%3Cstop offset=%22.25%22 stop-color=%22%239aff4a%22%3E%3C/stop%3E%3Cstop offset=%22.6%22 stop-color=%22%232a8a08%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%23061a00%22%3E%3C/stop%3E%3C/radialGradient%3E%3Cg id=%22peCollar2%22%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%22124%22 fill=%22%230a0908%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%2296%22 fill=%22none%22 stroke=%22url(%23peChitin)%22 stroke-width=%2220%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%2296%22 fill=%22none%22 stroke=%22url(%23peGrime)%22 stroke-width=%2220%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%2296%22 fill=%22none%22 stroke=%22%230a0908%22 stroke-width=%2220%22 stroke-dasharray=%221.6 15.2%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%22105.5%22 fill=%22none%22 stroke=%22%23ff2a1a%22 stroke-width=%222%22 stroke-dasharray=%220.01 16.8%22 stroke-linecap=%22round%22%3E%3C/circle%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(0) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(15) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(30) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(45) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(60) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(75) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(90) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(105) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(120) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(135) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(150) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(165) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(180) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(195) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(210) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(225) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(240) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(255) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(270) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(285) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(300) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(315) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(330) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(345) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3C/g%3E%3Cg id=%22peClaw%22%3E%0A%3Cuse href=%22%23peClawS%22 fill=%22%23000000%22 opacity=%22.55%22 transform=%22translate(1 1.8)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawS%22 fill=%22url(%23peClawG)%22 stroke=%22%23050404%22 stroke-width=%22.5%22%3E%3C/use%3E%0A%3Cpath d=%22M 2 -2.6 C 11 -3.4 20 -6.4 27 -12.6%22 fill=%22none%22 stroke=%22%23ffffff%22 stroke-opacity=%22.7%22 stroke-width=%22.55%22%3E%3C/path%3E%0A%3Cpath d=%22M 4 -3.4 Q 3 0 4 3.2 M 8 -3.8 Q 7 -.5 8 2.6%22 fill=%22none%22 stroke=%22%230a0908%22 stroke-width=%22.7%22%3E%3C/path%3E%0A%3C/g%3E%3ClinearGradient id=%22peClawG%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%231a1816%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%235a5650%22%3E%3C/stop%3E%3Cstop offset=%22.62%22 stop-color=%22%23cfcbc2%22%3E%3C/stop%3E%3Cstop offset=%22.82%22 stop-color=%22%238a8680%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%23141210%22%3E%3C/stop%3E%3C/linearGradient%3E%3Cpath id=%22peClawS%22 d=%22M 0 -3.2 C 10 -4 20 -7 28 -14 C 30 -16 31.5 -18 32 -20 C 29 -14 22 -6 14 -1 C 9 2 4 3.2 0 3.2 Z%22%3E%3C/path%3E%3Cg id=%22peClawV%22%3E%3Cuse href=%22%23peClaw%22%3E%3C/use%3E%3Ccircle cx=%2231.6%22 cy=%22-19.4%22 r=%221.7%22 fill=%22%23b8ff3a%22%3E%3C/circle%3E%3C/g%3E%3Cpattern id=%22peGrime%22 width=%2222%22 height=%2220%22 patternUnits=%22userSpaceOnUse%22%3E%0A%3Ccircle cx=%224%22 cy=%225%22 r=%223.4%22 fill=%22%232a2214%22 opacity=%22.45%22%3E%3C/circle%3E%3Ccircle cx=%2215%22 cy=%2213%22 r=%224.2%22 fill=%22%231a1810%22 opacity=%22.4%22%3E%3C/circle%3E%3Ccircle cx=%2212%22 cy=%223%22 r=%221.6%22 fill=%22%23ffffff%22 opacity=%22.12%22%3E%3C/circle%3E%3Ccircle cx=%223%22 cy=%2215%22 r=%222.2%22 fill=%22%233a3418%22 opacity=%22.5%22%3E%3C/circle%3E%3Ccircle cx=%2219%22 cy=%224%22 r=%221.2%22 fill=%22%234a1a0a%22 opacity=%22.5%22%3E%3C/circle%3E%0A%3Cpath d=%22M 2 10 L 9 8 M 13 18 L 20 16 M 8 1 L 11 6%22 stroke=%22%23000000%22 stroke-opacity=%22.35%22 stroke-width=%22.5%22%3E%3C/path%3E%0A%3C/pattern%3E%3CradialGradient id=%22peChitin%22 cx=%22.35%22 cy=%22.28%22 r=%22.85%22%3E%3Cstop offset=%220%22 stop-color=%22%23f0ece4%22%3E%3C/stop%3E%3Cstop offset=%22.25%22 stop-color=%22%23b8b4aa%22%3E%3C/stop%3E%3Cstop offset=%22.55%22 stop-color=%22%236a6660%22%3E%3C/stop%3E%3Cstop offset=%22.82%22 stop-color=%22%232e2c28%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%230e0d0c%22%3E%3C/stop%3E%3C/radialGradient%3E%3Cpattern id=%22peHex%22 width=%229%22 height=%2215.588%22 patternUnits=%22userSpaceOnUse%22 patternTransform=%22scale(3.4)%22%3E%3Cpath d=%22M 4.5 0 L 9 2.598 L 9 7.794 L 4.5 10.392 L 0 7.794 L 0 2.598 Z M 4.5 10.392 L 4.5 15.588%22 fill=%22none%22 stroke=%22%232a0000%22 stroke-width=%22.9%22/%3E%3Ccircle cx=%223.6%22 cy=%224%22 r=%22.9%22 fill=%22%23fff%22 opacity=%22.35%22/%3E%3C/pattern%3E%3C/defs%3E%3Cuse href=%22%23peCollar2%22 transform=%22translate(-150 -400)%22/%3E%3Ccircle r=%2286.7%22 fill=%22%230a0908%22/%3E%3Ccircle r=%2280%22 fill=%22url(%23peLensG)%22/%3E%3Ccircle r=%2280%22 fill=%22url(%23peHex)%22 opacity=%22.7%22/%3E%3Cellipse cx=%22-28%22 cy=%22-33.6%22 rx=%2230.4%22 ry=%2212.8%22 transform=%22rotate(-30 -28 -33.6)%22 fill=%22%23fff%22 opacity=%22.55%22/%3E%3C/svg%3E"); }
html.mobile #mob.pest { --orb-s:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%22-124 -124 248 248%22%3E%3Cdefs%3E%3CradialGradient id=%22peLensS%22 cx=%22.4%22 cy=%22.35%22 r=%22.7%22%3E%3Cstop offset=%220%22 stop-color=%22%23f0ece4%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%23a8a49c%22%3E%3C/stop%3E%3Cstop offset=%22.7%22 stop-color=%22%233a3632%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%230a0908%22%3E%3C/stop%3E%3C/radialGradient%3E%3Cg id=%22peCollar2%22%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%22124%22 fill=%22%230a0908%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%2296%22 fill=%22none%22 stroke=%22url(%23peChitin)%22 stroke-width=%2220%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%2296%22 fill=%22none%22 stroke=%22url(%23peGrime)%22 stroke-width=%2220%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%2296%22 fill=%22none%22 stroke=%22%230a0908%22 stroke-width=%2220%22 stroke-dasharray=%221.6 15.2%22%3E%3C/circle%3E%0A%3Ccircle cx=%22150%22 cy=%22400%22 r=%22105.5%22 fill=%22none%22 stroke=%22%23ff2a1a%22 stroke-width=%222%22 stroke-dasharray=%220.01 16.8%22 stroke-linecap=%22round%22%3E%3C/circle%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(0) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(15) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(30) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(45) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(60) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(75) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(90) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(105) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(120) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(135) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(150) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(165) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(180) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(195) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(210) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(225) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(240) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(255) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(270) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(285) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawV%22 transform=%22translate(150 400) rotate(300) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(315) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(330) translate(94 0) scale(0.86)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClaw%22 transform=%22translate(150 400) rotate(345) translate(94 0) scale(0.62)%22%3E%3C/use%3E%0A%3C/g%3E%3Cg id=%22peClaw%22%3E%0A%3Cuse href=%22%23peClawS%22 fill=%22%23000000%22 opacity=%22.55%22 transform=%22translate(1 1.8)%22%3E%3C/use%3E%0A%3Cuse href=%22%23peClawS%22 fill=%22url(%23peClawG)%22 stroke=%22%23050404%22 stroke-width=%22.5%22%3E%3C/use%3E%0A%3Cpath d=%22M 2 -2.6 C 11 -3.4 20 -6.4 27 -12.6%22 fill=%22none%22 stroke=%22%23ffffff%22 stroke-opacity=%22.7%22 stroke-width=%22.55%22%3E%3C/path%3E%0A%3Cpath d=%22M 4 -3.4 Q 3 0 4 3.2 M 8 -3.8 Q 7 -.5 8 2.6%22 fill=%22none%22 stroke=%22%230a0908%22 stroke-width=%22.7%22%3E%3C/path%3E%0A%3C/g%3E%3ClinearGradient id=%22peClawG%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%231a1816%22%3E%3C/stop%3E%3Cstop offset=%22.3%22 stop-color=%22%235a5650%22%3E%3C/stop%3E%3Cstop offset=%22.62%22 stop-color=%22%23cfcbc2%22%3E%3C/stop%3E%3Cstop offset=%22.82%22 stop-color=%22%238a8680%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%23141210%22%3E%3C/stop%3E%3C/linearGradient%3E%3Cpath id=%22peClawS%22 d=%22M 0 -3.2 C 10 -4 20 -7 28 -14 C 30 -16 31.5 -18 32 -20 C 29 -14 22 -6 14 -1 C 9 2 4 3.2 0 3.2 Z%22%3E%3C/path%3E%3Cg id=%22peClawV%22%3E%3Cuse href=%22%23peClaw%22%3E%3C/use%3E%3Ccircle cx=%2231.6%22 cy=%22-19.4%22 r=%221.7%22 fill=%22%23b8ff3a%22%3E%3C/circle%3E%3C/g%3E%3Cpattern id=%22peGrime%22 width=%2222%22 height=%2220%22 patternUnits=%22userSpaceOnUse%22%3E%0A%3Ccircle cx=%224%22 cy=%225%22 r=%223.4%22 fill=%22%232a2214%22 opacity=%22.45%22%3E%3C/circle%3E%3Ccircle cx=%2215%22 cy=%2213%22 r=%224.2%22 fill=%22%231a1810%22 opacity=%22.4%22%3E%3C/circle%3E%3Ccircle cx=%2212%22 cy=%223%22 r=%221.6%22 fill=%22%23ffffff%22 opacity=%22.12%22%3E%3C/circle%3E%3Ccircle cx=%223%22 cy=%2215%22 r=%222.2%22 fill=%22%233a3418%22 opacity=%22.5%22%3E%3C/circle%3E%3Ccircle cx=%2219%22 cy=%224%22 r=%221.2%22 fill=%22%234a1a0a%22 opacity=%22.5%22%3E%3C/circle%3E%0A%3Cpath d=%22M 2 10 L 9 8 M 13 18 L 20 16 M 8 1 L 11 6%22 stroke=%22%23000000%22 stroke-opacity=%22.35%22 stroke-width=%22.5%22%3E%3C/path%3E%0A%3C/pattern%3E%3CradialGradient id=%22peChitin%22 cx=%22.35%22 cy=%22.28%22 r=%22.85%22%3E%3Cstop offset=%220%22 stop-color=%22%23f0ece4%22%3E%3C/stop%3E%3Cstop offset=%22.25%22 stop-color=%22%23b8b4aa%22%3E%3C/stop%3E%3Cstop offset=%22.55%22 stop-color=%22%236a6660%22%3E%3C/stop%3E%3Cstop offset=%22.82%22 stop-color=%22%232e2c28%22%3E%3C/stop%3E%3Cstop offset=%221%22 stop-color=%22%230e0d0c%22%3E%3C/stop%3E%3C/radialGradient%3E%3Cpattern id=%22peHex%22 width=%229%22 height=%2215.588%22 patternUnits=%22userSpaceOnUse%22 patternTransform=%22scale(3.4)%22%3E%3Cpath d=%22M 4.5 0 L 9 2.598 L 9 7.794 L 4.5 10.392 L 0 7.794 L 0 2.598 Z M 4.5 10.392 L 4.5 15.588%22 fill=%22none%22 stroke=%22%232a0000%22 stroke-width=%22.9%22/%3E%3Ccircle cx=%223.6%22 cy=%224%22 r=%22.9%22 fill=%22%23fff%22 opacity=%22.35%22/%3E%3C/pattern%3E%3C/defs%3E%3Cuse href=%22%23peCollar2%22 transform=%22translate(-150 -400)%22/%3E%3Ccircle r=%2286.7%22 fill=%22%230a0908%22/%3E%3Ccircle r=%2280%22 fill=%22url(%23peLensS)%22/%3E%3Ccircle r=%2280%22 fill=%22url(%23peHex)%22 opacity=%22.7%22/%3E%3Cellipse cx=%22-28%22 cy=%22-33.6%22 rx=%2230.4%22 ry=%2212.8%22 transform=%22rotate(-30 -28 -33.6)%22 fill=%22%23fff%22 opacity=%22.55%22/%3E%3C/svg%3E"); }
html.mobile #mob.pest button:not(#mJump) { background:var(--orb-r) center/100% 100% no-repeat !important; --oo:#1a0000; }
html.mobile #mob.pest button#mFire { background:var(--orb-g) center/100% 100% no-repeat !important; --oo:#1a0000; }
html.mobile #mob.pest button#mEngage { background:var(--orb-r) center/100% 100% no-repeat !important; --oo:#1a0000; }
html.mobile #mob.pest button#mEngage.disengage { background:var(--orb-s) center/100% 100% no-repeat !important; --oo:#1a0000; }

/* v2.275 Plague Pest JUMP: ready = only "JUMP"; charging = only the seconds (no CHARGING / READY words) */
html.mobile #mob.pest #mJump small::after, html.mobile #mob.pest #mJump b::after { display:none !important; content:none !important; }
html.mobile #mob.pest #mJump.ready small, html.mobile #mob.pest #mJump:not(.ready) b { display:none !important; }
html.mobile #mob.pest #mJump small { font-size:4.2vmin; font-weight:900; }