
/* v1.41.1 · first-paint guard: hidden My/EA dialogs must never flash during Safari reload. */
#myOverlay[aria-hidden="true"],
#myExternalSheet[aria-hidden="true"],
#myDetailSheet[aria-hidden="true"],
#myNameSheet[aria-hidden="true"],
#mySaveSheet[aria-hidden="true"],
#myApplySheet[aria-hidden="true"]{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}


:root{--bg:#090d11;--line:rgba(255,255,255,.075);--line2:rgba(255,255,255,.12);--text:#e8ebed;--muted:#7f8991;--gold:#c7aa60;--safe:env(safe-area-inset-bottom,0px);--toolbar:60px;--nav:72px}
*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#06090c;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Microsoft YaHei",sans-serif}button{font:inherit}
.app{height:100vh;max-width:430px;margin:0 auto;display:grid;grid-template-rows:var(--toolbar) 1fr calc(var(--nav) + var(--safe));background:radial-gradient(740px 340px at 50% -120px,rgba(176,143,69,.075),transparent 64%),linear-gradient(180deg,#0a0f14,#080c10)}
.toolbar{display:flex;align-items:center;gap:8px;padding:0 14px;border-bottom:1px solid var(--line);background:rgba(9,13,17,.92);backdrop-filter:blur(18px);z-index:30}
.title{display:flex;align-items:center;gap:9px;margin-right:auto;white-space:nowrap}.title .cn{font-size:17.8px;font-weight:840}.title .en{position:relative;font-size:15px;font-style:italic;font-weight:720;color:rgba(208,178,95,.7);text-shadow:0 0 12px rgba(199,170,96,.1)}.title .en:before{content:"Archetype";position:absolute;left:0;top:1px;color:rgba(199,170,96,.18);filter:blur(5px);z-index:-1}
.mode{display:flex;height:29px;padding:3px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.018)}.mode button{border:0;background:transparent;color:#68727b;padding:0 8px;border-radius:6px;font-size:10px;font-weight:770}.mode button.active{color:#dbc175;background:rgba(199,170,95,.085)}
.tool{height:31px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.018);color:#8b949c}.undo{width:33px;font-size:16px}.undo:disabled{opacity:.34}.reset{padding:0 9px;font-size:10px;font-weight:780}
.scroll{overflow:auto;scrollbar-width:none;padding:0 14px 24px;overscroll-behavior:contain}.scroll::-webkit-scrollbar{display:none}
.sticky{position:sticky;top:0;z-index:20;margin:0 -14px;padding:10px 14px 10px;background:linear-gradient(180deg,rgba(9,13,17,.99),rgba(9,13,17,.95) 82%,rgba(9,13,17,0));backdrop-filter:blur(15px)}
.identity{position:relative;height:44px;display:grid;grid-template-columns:auto 1px minmax(0,1fr) auto;align-items:center;gap:10px;padding:0 11px;border:1px solid var(--line);border-radius:12px;background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.01))}
.level{min-width:52px;text-align:center;color:#d2b76d;font-size:13.5px;font-weight:830;touch-action:none;user-select:none}.sep{height:22px;background:rgba(255,255,255,.1)}
.arch{border:0;background:transparent;color:inherit;padding:0;display:flex;align-items:center;gap:8px;text-align:left;min-width:0}.logo{width:27px;height:27px;object-fit:contain;flex:0 0 27px}.archcopy{display:flex;align-items:baseline;gap:5px;min-width:0;white-space:nowrap;overflow:hidden}.archcn{font-size:13.3px;font-weight:820}.archen{font-size:8.6px;color:#768089;overflow:hidden;text-overflow:ellipsis}.chev{color:#68727b;font-size:14px}
.dropdown{position:absolute;left:0;right:0;top:49px;display:none;padding:8px;border:1px solid var(--line2);border-radius:12px;background:rgba(14,20,25,.98);box-shadow:0 18px 44px rgba(0,0,0,.42);max-height:56vh;overflow:auto;z-index:50}.dropdown.show{display:block}.groupcap{padding:7px 7px 5px;color:#68727b;font-size:8px;font-weight:780;letter-spacing:.08em}.opt{width:100%;height:40px;border:0;border-radius:9px;background:transparent;color:#aeb6bd;display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:8px;text-align:left;padding:0 8px}.opt img{width:23px;height:23px;object-fit:contain}.opt .z{font-size:11px;font-weight:760}.opt .e{font-size:8px;color:#68727b}.opt.active{background:rgba(199,170,95,.06);color:#d6bc73}
.apwrap{padding:12px 1px 0}.apline{display:flex;justify-content:flex-end;margin-bottom:6px}.apline span{font-size:9.3px;color:#aeb5bb;font-weight:760}.apline em{font-style:normal;color:#68727b;margin-right:2px}.aptrack{height:4px;border-radius:999px;background:#161b20;overflow:hidden}.apfill{height:100%;border-radius:inherit;background:#53b86c;transition:width .18s ease,background .18s ease}
.gap{height:10px}.rule{height:1px;background:var(--line)}
.row{min-height:42px;display:grid;align-items:center}.quick{grid-template-columns:1fr 1fr;column-gap:22px}.quickitem{display:flex;align-items:center;gap:8px;min-width:0;white-space:nowrap}.qlabel,.bodymetric .label,.bodymetric .value{font-size:11.4px;line-height:1}.qlabel,.bodymetric .label{color:#6f7982;font-weight:720}.bodymetric .value{color:#c9d0d5;font-weight:760}
.stars{font-size:16px;letter-spacing:.55px;line-height:1;white-space:nowrap;touch-action:none;user-select:none}.star{color:#414950}.star.on{color:#c6a95f}.star.locked{color:#282e34}
.bodyrow{display:flex;align-items:center;gap:7px;cursor:pointer}.bodymetric{display:flex;gap:2px;align-items:baseline;white-space:nowrap}.spacer{flex:1}.seg{height:25px;display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:rgba(255,255,255,.014)}.seg button{width:25px;height:23px;border:0;background:transparent;color:#69737c;font-size:8.7px;font-weight:780}.seg button.active{background:rgba(199,170,95,.085);color:#d3b86f}.seg button+button{border-left:1px solid rgba(255,255,255,.055)}.accel{height:25px;padding:0 8px;border:1px solid rgba(199,170,95,.14);border-radius:8px;background:rgba(199,170,95,.045);color:#bea763;font-size:8.5px;font-weight:770;display:flex;align-items:center;white-space:nowrap}.arrow{color:#68727b;font-size:14px}
.bodydetail{display:none;padding:12px 0 12px}.body.open .bodydetail{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:14px;align-items:stretch}.cross{position:relative;min-height:170px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:radial-gradient(circle at 58% 42%,rgba(199,170,95,.07),transparent 42%),#0c1217;overflow:hidden;touch-action:none;cursor:crosshair}.cross:before,.cross:after{content:"";position:absolute;background:rgba(255,255,255,.075)}.cross:before{left:50%;top:11%;bottom:11%;width:1px}.cross:after{top:50%;left:9%;right:9%;height:1px}.axis{position:absolute;font-size:9.5px;color:#66717a;font-weight:650}.axis.t{top:5px;left:50%;transform:translateX(-50%)}.axis.b{bottom:5px;left:50%;transform:translateX(-50%)}.axis.l{left:5px;top:50%;transform:translateY(-50%)}.axis.r{right:5px;top:50%;transform:translateY(-50%)}.dot{position:absolute;width:12px;height:12px;border-radius:50%;background:#c7aa60;transform:translate(-50%,-50%);box-shadow:0 0 0 4px rgba(199,170,96,.1)}.bonus{display:grid;grid-template-columns:1fr 1fr;column-gap:10px;row-gap:13px;align-content:center}.bonus div{display:flex;justify-content:flex-start;align-items:baseline;gap:8px;min-width:0}.bonus span{font-size:11.2px;color:#8b949c;white-space:nowrap}.bonus b{font-size:11.8px;font-weight:830;min-width:22px;text-align:right}.pos{color:#8daf95}.neg{color:#b48179}.zero{color:#717b83}
.attrs{padding-top:10px}.cat+.cat{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}.cattitle{margin-bottom:10px;font-size:12.4px;font-weight:830}.attr{margin-bottom:12px}.atop{display:flex;justify-content:space-between;margin-bottom:6px}.aname{font-size:11.2px;color:#aab2b8}.avalwrap{display:flex;align-items:baseline;gap:6px}.aval{font-size:13.4px;font-weight:830;min-width:28px;text-align:right}.overflow{font-size:8.8px;color:#b98b5f;font-weight:760;white-space:nowrap;display:none}.overflow.show{display:inline}
.slider{--cur:40%;--ap:75%;--cap:86%;position:relative;height:17px;touch-action:none;user-select:none}.track{position:absolute;left:0;right:0;top:6px;height:5px;border-radius:999px;background:linear-gradient(90deg,var(--active,#89959e) 0 var(--cur),#59636b var(--cur) var(--ap),#373e45 var(--ap) var(--cap),#1b2127 var(--cap) 100%)}.thumb{position:absolute;top:1px;left:var(--cur);width:15px;height:15px;border-radius:50%;transform:translateX(-50%);opacity:0;background:#d1d6d9;border:2px solid #0a0e12;transition:opacity .1s}.slider.dragging .thumb{opacity:1}.slider.dragging .track{filter:brightness(1.14)}.pop{position:absolute;top:-34px;left:var(--cur);transform:translateX(-50%);min-width:74px;padding:4px 6px;border-radius:7px;border:1px solid rgba(199,170,95,.18);background:#11181e;color:#d9c278;font-size:8.7px;font-weight:760;text-align:center;line-height:1.25;opacity:0;white-space:nowrap}.slider.dragging .pop{opacity:1}
.nav{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;padding:8px 8px calc(8px + var(--safe));border-top:1px solid var(--line);background:rgba(8,12,16,.94);backdrop-filter:blur(18px);z-index:30}.nav button{position:relative;border:0;background:transparent;color:#68727b;border-radius:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:9.4px;font-weight:760}.nav .icon{font-size:14px}.nav button.active{color:#d2b76d}.nav button.active:before{content:"";position:absolute;inset:2px 5px;border-radius:10px;background:rgba(199,170,95,.072)}.nav button>*{position:relative;z-index:1}
.toast{position:fixed;left:50%;bottom:calc(92px + var(--safe));transform:translateX(-50%) translateY(10px);padding:7px 10px;border-radius:9px;background:#141b20;border:1px solid var(--line2);color:#c9d0d5;font-size:9px;opacity:0;pointer-events:none;transition:.16s;z-index:100}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* Mobile Test Build hardening */
html{
  -webkit-text-size-adjust:100%;
  -webkit-tap-highlight-color:transparent;
}
body{
  touch-action:manipulation;
  -webkit-user-select:none;
  user-select:none;
}
button,.level,.stars,.slider,.cross{
  -webkit-touch-callout:none;
}
.scroll{
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;
}
.slider{touch-action:pan-y;}
.stars,.cross,.level{touch-action:none;}
.toolbar,.sticky,.nav{
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}
@supports (height: 100dvh){
  .app{height:100dvh}
}


/* =========================================================
   v0.16 · Mobile Shell V2
   Native document scrolling + glass Context Toolbar + dark Nav
   ========================================================= */
html,body{
  height:auto!important;
  min-height:100%!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
}
body{
  padding:0!important;
  background:#06090c!important;
  touch-action:auto!important;
}
.app{
  display:block!important;
  height:auto!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  max-width:430px!important;
  margin:0 auto!important;
  padding-bottom:calc(132px + env(safe-area-inset-bottom,0px))!important;
  background:
    radial-gradient(740px 340px at 50% -120px,rgba(176,143,69,.075),transparent 64%),
    linear-gradient(180deg,#0a0f14 0%,#080c10 100%)!important;
}
.scroll{
  overflow:visible!important;
  height:auto!important;
  min-height:100vh;
  padding:0 14px 30px!important;
  -webkit-overflow-scrolling:auto!important;
}
.page-title{
  height:62px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:4px 1px 0;
  white-space:nowrap;
}
.page-title .cn{
  position:relative;
  z-index:2;
  font-size:18px;
  font-weight:840;
  letter-spacing:.01em;
}
.page-title .en{
  position:relative;
  z-index:1;
  margin-top:3px;
  font-size:15.5px;
  line-height:1;
  font-style:italic;
  font-weight:720;
  letter-spacing:.02em;
  color:rgba(208,178,95,.72);
  text-shadow:0 0 13px rgba(199,170,96,.11);
}
.page-title .en:before{
  content:"Archetype";
  position:absolute;
  left:0;top:1px;z-index:-1;
  color:rgba(199,170,96,.20);
  filter:blur(5px);
}
.sticky{
  top:0!important;
}

/* Bottom Dock container only establishes stacking. */
.bottom-dock{
  position:relative;
  z-index:80;
}

/* Glass Context Toolbar: visually floats above the navigation base. */
.context-toolbar{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  top:auto!important;
  bottom:calc(66px + env(safe-area-inset-bottom,0px) + 8px)!important;
  transform:translateX(-50%)!important;
  width:min(410px,calc(100% - 20px))!important;
  height:42px!important;
  padding:0 9px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;

  border:1px solid rgba(235,241,247,.12)!important;
  border-radius:15px!important;
  background:
    linear-gradient(180deg,rgba(32,38,44,.50),rgba(14,19,24,.38))!important;
  -webkit-backdrop-filter:blur(28px) saturate(145%)!important;
  backdrop-filter:blur(28px) saturate(145%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(255,255,255,.025),
    0 8px 24px rgba(0,0,0,.24)!important;
}
.toolbar-spacer{flex:1}

/* PC-inspired Base / Match distinction. */
.context-toolbar .mode{
  height:31px;
  padding:2px;
  border:1px solid rgba(222,230,238,.11);
  border-radius:10px;
  background:rgba(5,10,15,.22);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.18);
}
.context-toolbar .mode button{
  height:25px;
  min-width:53px;
  padding:0 10px;
  color:#7f8a95;
  font-size:10.5px;
  transition:color .15s ease,background .15s ease,box-shadow .15s ease;
}
.context-toolbar .mode button[data-mode="base"].active{
  color:#e1e6eb;
  background:linear-gradient(180deg,rgba(229,236,243,.13),rgba(194,205,216,.065));
  box-shadow:inset 0 0 0 1px rgba(235,241,247,.10),0 1px 4px rgba(0,0,0,.18);
}
.context-toolbar .mode button[data-mode="match"].active{
  color:#dfd7b7;
  background:linear-gradient(180deg,rgba(205,216,227,.105),rgba(205,216,227,.040));
  box-shadow:inset 0 0 0 1px rgba(225,233,241,.10),0 0 8px rgba(205,216,227,.025);
}
.context-toolbar .tool{
  height:31px;
  border-color:rgba(235,241,247,.10);
  background:rgba(255,255,255,.025);
  color:#a1aab2;
}
.context-toolbar .reset{
  padding:0 11px;
}

/* Bottom navigation is a darker stable base, clearly distinct from the glass tool layer. */
.nav{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:0!important;
  transform:translateX(-50%)!important;
  width:min(430px,100%)!important;
  height:calc(66px + env(safe-area-inset-bottom,0px))!important;
  padding:7px 8px calc(7px + env(safe-area-inset-bottom,0px))!important;
  border-top:1px solid rgba(255,255,255,.07)!important;
  background:rgba(7,11,15,.94)!important;
  -webkit-backdrop-filter:blur(14px) saturate(110%)!important;
  backdrop-filter:blur(14px) saturate(110%)!important;
  box-shadow:0 -10px 26px rgba(0,0,0,.20)!important;
}

/* Slightly roomier body row for readability. */
.bodyrow{
  min-height:46px!important;
}
.bodymetric .label,
.bodymetric .value{
  font-size:11.8px!important;
}
.seg button{
  font-size:9.4px!important;
}
.accel{
  font-size:9.5px!important;
  font-weight:800!important;
}

/* PC semantic acceleration colors, color-only and deliberately muted. */
.accel[data-accel="掌控"]{
  color:#6fa986!important;
  border-color:rgba(111,169,134,.18)!important;
  background:rgba(111,169,134,.045)!important;
}
.accel[data-accel="爆发"]{
  color:#bd7770!important;
  border-color:rgba(189,119,112,.18)!important;
  background:rgba(189,119,112,.045)!important;
}
.accel[data-accel="漫长"]{
  color:#728fb7!important;
  border-color:rgba(114,143,183,.18)!important;
  background:rgba(114,143,183,.045)!important;
}

/* Native scroll is intentional so Safari can collapse its browser chrome. */
@supports(height:100dvh){
  .scroll{min-height:100dvh}
}


/* v0.17 slider interaction tuning */
.slider{
  touch-action:pan-y!important;
}


/* v0.18 · PC fixed 40–99 baseline + protected touch drag */
.slider{
  touch-action:pan-y!important;
}
.slider .track,
.slider .thumb,
.slider .pop{
  pointer-events:none;
}
.drag-hit{
  position:absolute;
  top:-8px;
  width:36px;
  height:34px;
  transform:translateX(-50%);
  z-index:8;
  background:transparent;
  border:0;
  touch-action:none!important;
  cursor:grab;
}
.slider.dragging .drag-hit{
  cursor:grabbing;
}
html.attr-dragging,
html.attr-dragging body{
  overscroll-behavior:none!important;
}


/* v0.19 */
.weightmetric{
  gap:3px!important;
}
.body-inline-arrow{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  width:19px;
  height:22px;
  margin-left:2px;
  font-size:17px!important;
  line-height:1;
  color:#a7b0b8!important;
  font-weight:800;
}
.body.open .body-inline-arrow{
  color:#c7aa5f!important;
}

/* Attribute category hierarchy */
.cat+.cat{
  margin-top:13px!important;
  padding-top:0!important;
  border-top:0!important;
}
.cathead{
  width:100%;
  height:35px;
  padding:0 10px 0 11px;
  display:flex;
  align-items:center;
  border:1px solid rgba(210,220,230,.105);
  border-radius:9px;
  background:linear-gradient(180deg,rgba(255,255,255,.030),rgba(255,255,255,.012));
  color:inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  -webkit-tap-highlight-color:transparent;
}
.catname{
  font-size:12.4px;
  font-weight:840;
  letter-spacing:.01em;
  color:#d5d9dc;
}
.catcount{
  margin-left:7px;
  min-width:17px;
  height:17px;
  padding:0 5px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:6px;
  background:rgba(255,255,255,.035);
  color:#747f88;
  font-size:8.8px;
  font-weight:760;
}
.catarrow{
  margin-left:auto;
  width:22px;
  text-align:center;
  color:#8d979f;
  font-size:15px;
  font-weight:820;
}
.catbody{
  padding:10px 2px 0;
}
.cat.collapsed .catbody{
  display:none;
}
.cat.collapsed .cathead{
  background:rgba(255,255,255,.014);
}
.cat.collapsed .catarrow{
  color:#717b83;
}


/* v0.26: real inner safe area for the body crosshair */
.body-safe{
  position:absolute;
  inset:14px;
  pointer-events:none;
}
.body-safe .dot{
  margin:0!important;
}

/* Full slider track is the gesture surface. Old hit-zone layer is disabled. */
.slider .drag-hit{
  display:none!important;
}
.slider .track{
  height:6px!important;
}


/* v0.27 · alignment + unified chevrons */

/* 身高 / 体重：统一在同一条垂直中线上，避免 baseline 导致上下错位 */
.bodyrow{
  align-items:center!important;
}
.bodymetric{
  height:28px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:3px!important;
  line-height:1!important;
}
.bodymetric .label,
.bodymetric .value{
  display:inline-flex!important;
  align-items:center!important;
  height:28px!important;
  line-height:28px!important;
  margin:0!important;
  padding:0!important;
}
.weightmetric{
  align-items:center!important;
}

/* 身材展开箭头不用字体 glyph 的基线，改成固定 CSS chevron */
.body-inline-arrow{
  position:relative!important;
  width:22px!important;
  height:28px!important;
  margin:0 0 0 2px!important;
  padding:0!important;
  font-size:0!important;
  line-height:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 22px!important;
}
.body-inline-arrow::before{
  content:"";
  width:7px;
  height:7px;
  box-sizing:border-box;
  border-right:1.6px solid currentColor;
  border-bottom:1.6px solid currentColor;
  transform:translateY(-2px) rotate(45deg);
  transform-origin:center;
}
.body.open .body-inline-arrow::before{
  transform:translateY(2px) rotate(225deg);
}

/* 属性大类展开/收起使用同一枚 CSS chevron，仅旋转方向，尺寸完全一致 */
.catarrow{
  position:relative!important;
  width:24px!important;
  height:24px!important;
  margin-left:auto!important;
  padding:0!important;
  font-size:0!important;
  line-height:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 24px!important;
}
.catarrow::before{
  content:"";
  width:7px;
  height:7px;
  box-sizing:border-box;
  border-right:1.6px solid currentColor;
  border-bottom:1.6px solid currentColor;
  transform:translateY(-2px) rotate(45deg);
  transform-origin:center;
}
.cathead[aria-expanded="true"] .catarrow::before{
  transform:translateY(2px) rotate(225deg);
}
.cathead[aria-expanded="false"] .catarrow::before{
  transform:translateY(-2px) rotate(45deg);
}


/* =========================================================
   v0.28 · Mobile motion system prototype
   Smooth, restrained expand/collapse. No hard display toggles.
   ========================================================= */

:root{
  --motion-expand-fast:260ms;
  --motion-expand-body:340ms;
  --motion-expand-panel:380ms;
  --motion-fade:190ms;
  --motion-ease-out:cubic-bezier(.22,.78,.24,1);
}

/* Body panel:
   outer shell animates 0fr -> 1fr; clip guarantees a true zero-height close. */
.bodydetail.bodydetail-shell{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:0fr!important;
  padding:0!important;
  overflow:visible!important;
  transition:
    grid-template-rows var(--motion-expand-body) var(--motion-ease-out)!important;
}
.body.open .bodydetail.bodydetail-shell{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:1fr!important;
  padding:0!important;
}
.bodydetail-clip{
  min-height:0;
  overflow:hidden;
}
.bodydetail-inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) 150px;
  gap:14px;
  align-items:stretch;
  padding:12px 0;
  opacity:0;
  transform:translateY(-5px);
  transition:
    opacity 150ms ease,
    transform var(--motion-expand-body) var(--motion-ease-out);
}
.body.open .bodydetail-inner{
  opacity:1;
  transform:translateY(0);
}

/* Body chevron rotates as one object rather than swapping glyph geometry. */
.body-inline-arrow::before{
  transition:transform var(--motion-expand-body) var(--motion-ease-out);
}

/* Attribute category:
   same height-collapse language, slightly faster because the content is smaller. */
.catbody{
  display:grid!important;
  grid-template-rows:1fr;
  padding:0!important;
  overflow:visible;
  transition:
    grid-template-rows var(--motion-expand-fast) var(--motion-ease-out);
}
.cat.collapsed .catbody{
  display:grid!important;
  grid-template-rows:0fr;
}
.catbody-clip{
  min-height:0;
  overflow:hidden;
}
.catbody-inner{
  min-height:0;
  padding:10px 2px 0;
  opacity:1;
  transform:translateY(0);
  transition:
    opacity 120ms ease,
    transform var(--motion-expand-fast) var(--motion-ease-out);
}
.cat.collapsed .catbody-inner{
  opacity:0;
  transform:translateY(-4px);
}
.catarrow::before{
  transition:transform var(--motion-expand-fast) var(--motion-ease-out);
}

/* Tiny press feedback: functional now, final visual language will be redesigned later. */
.cathead{
  transition:
    background 150ms ease,
    border-color 150ms ease,
    transform 90ms ease;
}
.cathead:active{
  transform:scale(.995);
}

/* Respect OS accessibility preferences. */
@media (prefers-reduced-motion: reduce){
  .bodydetail.bodydetail-shell,
  .bodydetail-inner,
  .body-inline-arrow::before,
  .catbody,
  .catbody-inner,
  .catarrow::before,
  .cathead{
    transition-duration:0.01ms!important;
  }
}


/* =========================================================
   v0.29 · Dropdown / Popover motion
   Smooth pull-out / tuck-in language for floating menus.
   ========================================================= */
.dropdown{
  display:block!important;
  visibility:hidden;
  pointer-events:none;
  opacity:0;
  transform-origin:50% 0%;
  transform:translateY(-7px) scale(.985,.955);
  clip-path:inset(0 0 9% 0 round 12px);
  will-change:opacity,transform,clip-path;
  transition:
    opacity var(--motion-fade) ease,
    transform 300ms var(--motion-ease-out),
    clip-path 300ms var(--motion-ease-out),
    visibility 0s linear 300ms;
}
.dropdown.show{
  visibility:visible;
  pointer-events:auto;
  opacity:1;
  transform:translateY(0) scale(1);
  clip-path:inset(0 0 0 0 round 12px);
  transition:
    visibility 0s linear 0s,
    opacity 210ms ease,
    transform 320ms var(--motion-ease-out),
    clip-path 320ms var(--motion-ease-out);
}

/* The identity chevron participates in the same motion language. */
.identity>.chev{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transform-origin:center;
  transition:
    transform 320ms var(--motion-ease-out),
    color 190ms ease;
}
.identity.dropdown-open>.chev{
  transform:rotate(180deg);
  color:#a89562;
}

/* A tiny fade/settle on options keeps the dropdown from feeling like a hard layer. */
.dropdown .opt,
.dropdown .groupcap{
  transition:
    background 140ms ease,
    color 140ms ease;
}

@media (prefers-reduced-motion: reduce){
  .dropdown,
  .identity>.chev{
    transition-duration:0.01ms!important;
  }
}


/* =========================================================
   v0.32 · Mobile PlayStyles collapsible library
   Loadout-first flow + dynamic regular slots + inline inspector
   ========================================================= */
:root{
  --psm-silver-badge:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22g%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%220%22%20y2%3D%221%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23F1F4F7%22%2F%3E%3Cstop%20offset%3D%220.56%22%20stop-color%3D%22%23DDE2E7%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23C0C7D0%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpolygon%20points%3D%2250%2C1%2099%2C50%2050%2C99%201%2C50%22%20fill%3D%22url%28%23g%29%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E");
  --psm-gold-badge:url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20100%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22g%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%220%22%20y2%3D%221%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23FFE9A0%22%2F%3E%3Cstop%20offset%3D%220.55%22%20stop-color%3D%22%23FBDD81%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23F5C84B%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpolygon%20points%3D%2230%2C0%2090%2C0%20120%2C33.333%2060%2C100%200%2C33.333%22%20fill%3D%22url%28%23g%29%22%2F%3E%3C%2Fsvg%3E");
}
#playstylesMobilePage[hidden]{display:none!important}
#playstylesMobilePage{
  padding:0 14px 92px;
  min-height:100vh;
  min-height:100dvh;
  color:var(--text);
}
body.psm-view .context-toolbar{display:flex!important}
body.psm-view .app{padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))!important}
.psm-page-title{
  height:62px;display:flex;align-items:center;gap:10px;padding:4px 1px 0;white-space:nowrap
}
.psm-page-title .cn{font-size:18px;font-weight:840;letter-spacing:.01em}
.psm-page-title .en{
  margin-top:3px;font-size:15.5px;line-height:1;font-style:italic;font-weight:720;
  letter-spacing:.02em;color:rgba(208,178,95,.72);text-shadow:0 0 13px rgba(199,170,96,.11)
}
.psm-sticky{margin-bottom:5px}
.psm-sticky .identity{height:44px}
.psm-sticky .dropdown{max-height:52vh}
.psm-headline{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:4px 0 10px;padding:0 1px;color:#7d8790;font-size:9.4px;font-weight:720
}
.psm-headline strong{color:#b8c0c7;font-size:10px;font-weight:800}
.psm-headline em{font-style:normal;color:#bca45f}

.psm-loadout{
  border:1px solid rgba(255,255,255,.085);border-radius:14px;
  background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.012));
  overflow:visible;margin-bottom:13px
}
.psm-loadout-row{
  min-height:70px;padding:9px 10px;display:flex;align-items:center;gap:8px;overflow:visible
}
.psm-loadout-row+.psm-loadout-row{border-top:1px solid rgba(255,255,255,.06)}
.psm-loadout-kicker{
  width:19px;flex:0 0 19px;color:#66717a;font-size:8.5px;font-weight:900;letter-spacing:.06em;
  writing-mode:vertical-rl;transform:rotate(180deg);text-align:center
}
.psm-source-strip{min-width:0;display:flex;align-items:center;gap:7px;flex:1;overflow:visible}
.psm-source-sep{width:1px;height:37px;background:rgba(255,255,255,.105);margin:0 3px;flex:0 0 1px}
.psm-regular-track{display:grid;grid-auto-flow:column;grid-auto-columns:48px;gap:5px;overflow:visible}
.psm-loadout-slot{
  width:48px;height:50px;padding:0;border:0;border-radius:9px;background:transparent;
  display:grid;place-items:center;overflow:visible;-webkit-tap-highlight-color:transparent;
  transition:background 150ms ease,box-shadow 150ms ease,transform 90ms ease
}
.psm-loadout-slot:active{transform:scale(.98)}
.psm-loadout-slot.selector-open{background:rgba(199,170,96,.035);box-shadow:inset 0 0 0 1px rgba(199,170,96,.13)}
.psm-source-zone{display:flex;align-items:center;gap:5px;min-width:44px;overflow:visible}

.psm-badge{
  position:relative;width:48px;height:50px;display:grid;place-items:center;flex:0 0 48px;
  border:0;background:transparent;padding:0;color:inherit;overflow:visible!important
}
.psm-badge-shell{
  --badge-h:40px;--badge-w:40px;--icon-box:23px;--icon-lift:0px;
  position:relative;width:48px;height:48px;display:block;overflow:visible!important;
  border:0!important;background:none!important;clip-path:none!important;filter:none!important
}
.psm-badge-shell::before{
  content:"";position:absolute;left:50%;top:50%;width:var(--badge-w);height:var(--badge-h);
  transform:translate(-50%,-50%);background:var(--psm-silver-badge) center/100% 100% no-repeat;
  filter:drop-shadow(0 3px 7px rgba(0,0,0,.20));pointer-events:none;z-index:1
}
.psm-badge.plus .psm-badge-shell,
.psm-badge-shell.plus{
  --badge-w:48px;--icon-box:24px;--icon-lift:1.8px
}
.psm-badge.plus .psm-badge-shell::before,
.psm-badge-shell.plus::before{
  background-image:var(--psm-gold-badge);
  filter:drop-shadow(0 4px 9px rgba(0,0,0,.22))
}
.psm-badge-shell img{
  position:absolute;left:50%;top:calc(50% - var(--icon-lift));
  width:var(--icon-box);height:var(--icon-box);object-fit:contain;max-width:none;max-height:none;
  transform:translate(-50%,-50%);z-index:2;filter:none
}

/* Empty ordinary slots / AMP add are deliberately not PS silhouettes. */
.psm-badge.empty .psm-badge-shell,
.psm-badge.amp-add .psm-badge-shell{
  width:37px;height:37px;transform:rotate(45deg);border:1px dashed #46515d!important;
  border-radius:7px!important;background:transparent!important
}
.psm-badge.empty .psm-badge-shell::before,
.psm-badge.amp-add .psm-badge-shell::before{display:none}
.psm-badge.empty.locked .psm-badge-shell{opacity:.34}
.psm-badge.empty .psm-lock-level{
  position:absolute;inset:0;display:grid;place-items:center;font-size:8.5px;color:#68737d;font-weight:900;
  transform:rotate(-45deg)
}
.psm-badge.amp-add .psm-badge-shell{
  border-color:rgba(199,170,96,.36)!important
}
.psm-badge.amp-add .psm-badge-shell::after{
  content:"+";position:absolute;inset:0;display:grid;place-items:center;
  transform:rotate(-45deg);font-size:19px;line-height:1;color:#b49a55;font-weight:500
}
/* v0.35 · Ordinary empty slots are self-explanatory entry points.
   Same diamond language as AMP, but quieter and without an AMP source label. */
.psm-badge.empty.addable .psm-badge-shell{
  border-color:rgba(164,176,187,.26)!important;
  background:rgba(255,255,255,.008)!important
}
.psm-badge.empty.addable .psm-badge-shell::after{
  content:"+";position:absolute;inset:0;display:grid;place-items:center;
  transform:rotate(-45deg);font-size:18px;line-height:1;color:#89949d;font-weight:520
}
.psm-loadout-slot:active .psm-badge.empty.addable .psm-badge-shell{
  border-color:rgba(199,170,96,.34)!important
}
.psm-loadout{
  cursor:pointer;
  -webkit-tap-highlight-color:transparent
}
.psm-amp-zone{cursor:default}
.psm-amp-label{
  position:absolute;left:50%;bottom:-3px;transform:translateX(-50%);
  min-width:31px;height:16px;padding:0 5px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  background:#1f1c11;border:1px solid rgba(199,170,96,.18);color:#a99148;
  font-size:8.5px;font-weight:900;letter-spacing:.03em;z-index:7
}
.psm-warning-dot{
  position:absolute;right:2px;top:3px;width:9px;height:9px;border-radius:50%;
  background:#df6264;box-shadow:0 0 0 2px #10161b;z-index:8
}
.psm-source-check{
  position:absolute;right:1px;bottom:3px;width:16px;height:16px;border-radius:50%;
  display:grid;place-items:center;background:#211e13;border:1px solid rgba(199,170,96,.24);
  color:#c3a75c;font-size:10px;font-weight:1000;z-index:8
}
.psm-loadout-empty-note{color:#5e6973;font-size:8px}

.psm-library{
  display:grid;grid-template-rows:0fr;margin-top:0;border-top:1px solid transparent;padding-top:0;
  transition:grid-template-rows var(--motion-expand-panel) var(--motion-ease-out),margin-top var(--motion-expand-panel) var(--motion-ease-out),border-color 240ms ease,padding-top var(--motion-expand-panel) var(--motion-ease-out)
}
.psm-library.open{
  grid-template-rows:1fr;margin-top:2px;border-top-color:rgba(255,255,255,.065);padding-top:4px
}
.psm-library-clip{min-height:0;overflow:hidden}
.psm-library-inner{
  min-height:0;opacity:0;transform:translateY(-5px);
  transition:opacity var(--motion-fade) ease,transform var(--motion-expand-panel) var(--motion-ease-out)
}
.psm-library.open .psm-library-inner{opacity:1;transform:translateY(0)}
.psm-library-close{
  width:100%;height:30px;border:0;background:transparent;display:grid;place-items:center;
  padding:0;margin:0 0 1px;-webkit-tap-highlight-color:transparent
}
.psm-library-close span{
  position:relative;width:28px;height:14px;border-radius:999px;background:rgba(255,255,255,.018);
  border:1px solid rgba(255,255,255,.055)
}
.psm-library-close span::before{
  content:"";position:absolute;left:50%;top:6px;width:7px;height:7px;box-sizing:border-box;
  border-left:1.4px solid #73808a;border-top:1.4px solid #73808a;
  transform:translate(-50%,-15%) rotate(45deg)
}
.psm-library-content{min-height:0}
.psm-category{padding:12px 0 8px}
.psm-category+.psm-category{border-top:1px solid rgba(255,255,255,.055)}
.psm-category-head{display:flex;align-items:baseline;gap:7px;margin-bottom:8px;padding:0 2px}
.psm-category-head strong{font-size:11.6px;color:#cfd5da;font-weight:840}
.psm-category-head span{font-size:8.5px;color:#59646e;font-weight:800;letter-spacing:.05em}
.psm-icon-row{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;align-items:center;overflow:visible
}
.psm-tile{
  position:relative;min-width:0;height:64px;border:0;border-radius:11px;background:transparent;
  display:grid;place-items:center;padding:0;-webkit-tap-highlight-color:transparent;overflow:visible!important
}
.psm-tile::after{
  content:"";position:absolute;inset:3px;border-radius:10px;border:1px solid transparent;
  transition:border-color 150ms ease,background 150ms ease,transform 110ms ease
}
.psm-tile:active::after{transform:scale(.97)}
.psm-tile.selected::after{border-color:rgba(199,170,96,.27);background:rgba(199,170,96,.025)}
.psm-tile .psm-badge-shell{
  --badge-h:42px;--badge-w:42px;--icon-box:24px;--icon-lift:0px;
  width:52px;height:52px;transition:opacity 150ms ease,filter 150ms ease
}
.psm-tile.locked .psm-badge-shell{opacity:.44;filter:grayscale(.30) brightness(.76)!important}
.psm-tile.unreachable .psm-badge-shell{opacity:.29;filter:grayscale(.55) brightness(.63)!important}
.psm-tile.unlocked .psm-badge-shell,
.psm-tile.equipped .psm-badge-shell{opacity:1}
.psm-tile.equipped .psm-badge-shell{filter:brightness(1.035)!important}
.psm-tile .psm-source-check{right:6px;bottom:6px}
.psm-tile .psm-own-check{
  position:absolute;right:6px;top:6px;width:15px;height:15px;border-radius:50%;z-index:8;
  display:grid;place-items:center;
  color:#8fb59a;background:rgba(54,83,65,.38);border:1px solid rgba(132,174,145,.22);
  font-size:9px;font-weight:1000
}

/* Inline detail: whole row; state changes patch in place instead of rebuilding it. */
.psm-detail-shell{
  grid-column:1/-1;display:grid;grid-template-rows:0fr;margin-top:0;
  transition:grid-template-rows var(--motion-expand-body) var(--motion-ease-out),margin-top var(--motion-expand-body) var(--motion-ease-out)
}
.psm-detail-shell.open{grid-template-rows:1fr;margin-top:5px}
.psm-detail-clip{min-height:0;overflow:hidden}
.psm-detail-card{
  min-height:105px;border:1px solid rgba(255,255,255,.09);border-radius:12px;
  background:linear-gradient(145deg,rgba(255,255,255,.034),rgba(255,255,255,.014));
  padding:10px;display:grid;grid-template-columns:78px minmax(0,1fr) 108px;gap:9px;align-items:center;
  opacity:0;transform:translateY(-4px);
  transition:opacity var(--motion-fade) ease,transform var(--motion-expand-body) var(--motion-ease-out)
}
.psm-detail-shell.open .psm-detail-card{opacity:1;transform:translateY(0)}
.psm-detail-id{min-width:0;text-align:center}
.psm-detail-id .psm-badge{margin:0 auto;width:56px;height:56px}
.psm-detail-id .psm-badge-shell{--badge-h:46px;--badge-w:46px;--icon-box:26px;width:56px;height:56px}
.psm-detail-id .psm-badge.plus .psm-badge-shell{--badge-w:55px;--icon-box:27px}
.psm-detail-id strong{display:block;margin-top:2px;color:#dce2e6;font-size:10px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psm-detail-id span{display:block;margin-top:2px;color:#69747e;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psm-reqs{min-width:0;display:grid;gap:4px}
.psm-req{
  height:23px;display:grid;grid-template-columns:minmax(0,1fr) auto 14px;gap:5px;align-items:center;
  padding:0 7px;border-radius:7px;background:rgba(255,255,255,.022);color:#7e8992;font-size:8.5px
}
.psm-req b{color:#c4cbd0;font-size:9.5px;font-variant-numeric:tabular-nums}
.psm-req b em{font-style:normal;color:#68727b;font-size:8.5px}
.psm-req i{font-style:normal;color:#7fac90;font-weight:1000;text-align:center}
.psm-req.missing b{color:#c78d78}
.psm-action{min-width:0;text-align:center}
.psm-status{display:block;margin-bottom:6px;color:#8a949d;font-size:8.5px;font-weight:850;line-height:1.25}
.psm-status.good{color:#9bb6a2}.psm-status.warn{color:#bda55e}.psm-status.bad{color:#b87871}
.psm-main-action{
  width:100%;min-height:34px;border:1px solid rgba(255,255,255,.11);border-radius:9px;
  background:rgba(255,255,255,.026);color:#c8d0d6;font-size:8.8px;font-weight:850;padding:5px 6px;
  transition:background .15s ease,border-color .15s ease,color .15s ease,opacity .15s ease
}
.psm-main-action.gold{border-color:rgba(199,170,96,.24);background:rgba(199,170,96,.06);color:#d3bb75}
.psm-main-action.remove{color:#b8c1c8}
.psm-main-action:disabled{opacity:.43}
.psm-detail-notes{grid-column:1/-1;display:grid;gap:5px}
.psm-source-note{
  padding:6px 8px;border-radius:8px;background:rgba(199,170,96,.035);
  color:#8e815d;font-size:8.5px;line-height:1.38;
  display:grid;grid-template-columns:10px minmax(0,1fr);column-gap:6px;align-items:start
}
.psm-source-note .check{
  color:#c1a456;font-weight:1000;line-height:1.38;text-align:center
}
.psm-source-note .psm-note-copy{min-width:0}
.psm-source-note.duplicate{background:rgba(214,91,91,.035);color:#aa7774}
.psm-source-note.duplicate .dot{
  position:static!important;
  width:6px;height:6px;border-radius:50%;background:#df6264;
  margin:2.4px auto 0;display:block;
  transform:none!important;box-shadow:none!important;
  justify-self:center;align-self:start
}

/* Attribute-page unlock/loss feedback: mobile adaptation of PC's cursor feedback. */
.psm-build-feedback{
  position:fixed;z-index:14000;display:inline-flex;align-items:center;
  min-height:28px;max-width:min(310px,calc(100vw - 24px));
  padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);
  background:rgba(12,17,23,.96);color:#d7dee5;
  box-shadow:0 8px 22px rgba(0,0,0,.30);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  font-size:9.3px;font-weight:820;line-height:1.25;letter-spacing:.005em;
  white-space:nowrap;pointer-events:none;opacity:0;
  transform:translateY(4px) scale(.97);transform-origin:top left;
  transition:opacity .14s ease,transform .16s ease
}
.psm-build-feedback.show{opacity:1;transform:translateY(0) scale(1)}
.psm-build-feedback.gain{
  color:#d8c786;border-color:rgba(199,170,96,.27);background:rgba(30,27,18,.96)
}
.psm-build-feedback.loss{
  color:#dda0a4;border-color:rgba(200,90,96,.34);background:rgba(43,21,24,.97)
}
@media(prefers-reduced-motion:reduce){
  .psm-build-feedback{transition-duration:.01ms!important}
}

/* AMP picker: same compact body, now with tier switch. */
.psm-amp-picker{
  display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--motion-expand-body) var(--motion-ease-out);margin:-5px 0 9px
}
.psm-amp-picker.open{grid-template-rows:1fr}
.psm-amp-picker-clip{min-height:0;overflow:hidden}
.psm-amp-picker-inner{
  border:1px solid rgba(199,170,96,.13);border-radius:12px;background:rgba(18,23,28,.92);
  padding:9px;opacity:0;transform:translateY(-4px);transition:opacity var(--motion-fade) ease,transform var(--motion-expand-body) var(--motion-ease-out)
}
.psm-amp-picker.open .psm-amp-picker-inner{opacity:1;transform:translateY(0)}
.psm-amp-picker-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:7px}
.psm-amp-picker-title{min-width:0;display:grid;gap:2px}
.psm-amp-picker-title strong{color:#c8b46f;font-size:9px}
.psm-amp-picker-title span{color:#7d8790;font-size:8.5px}
.psm-amp-tier{
  height:27px;display:flex;padding:2px;border:1px solid rgba(255,255,255,.09);
  border-radius:8px;background:rgba(5,10,15,.22);flex:0 0 auto
}
.psm-amp-tier button{
  min-width:44px;height:21px;border:0;border-radius:6px;background:transparent;
  color:#727d86;font-size:8.5px;font-weight:830;padding:0 6px
}
.psm-amp-tier button.active{color:#d9c273;background:rgba(199,170,95,.085)}
.psm-amp-tier button[data-psm-amp-tier="silver"].active{
  color:#cbd4dc;background:rgba(214,223,231,.065);box-shadow:inset 0 0 0 1px rgba(214,223,231,.055)
}
.psm-amp-choices{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.psm-amp-choice{
  height:46px;border:0;border-radius:8px;background:rgba(255,255,255,.018);
  display:grid;place-items:center;overflow:visible!important
}
.psm-amp-choice .psm-badge-shell{
  --badge-h:31px;--badge-w:31px;--icon-box:18px;width:38px;height:38px
}
.psm-amp-choice .psm-badge-shell.plus{--badge-w:37px;--icon-box:19px;--icon-lift:1.4px}

@media(max-width:360px){
  .psm-regular-track{grid-auto-columns:44px}
  .psm-loadout-slot{width:44px;height:48px}
  .psm-badge{width:44px;height:48px;flex-basis:44px}
  .psm-source-strip{gap:3px}.psm-source-sep{margin:0 1px}
  .psm-detail-card{grid-template-columns:68px minmax(0,1fr);gap:7px}
  .psm-action{grid-column:1/-1;display:grid;grid-template-columns:1fr 112px;gap:7px;align-items:center;text-align:left}
  .psm-status{margin:0}
}
@media(prefers-reduced-motion:reduce){
  .psm-detail-shell,.psm-detail-card,.psm-amp-picker,.psm-amp-picker-inner,.psm-library,.psm-library-inner,.psm-loadout-slot,.psm-tile::after,.psm-tile .psm-badge-shell{transition-duration:.01ms!important}
}


/* =========================================================
   v0.40 · Mobile Specialization signature-slot prototype
   Current PC state language, adapted to fixed 2×2 mobile cards:
   locked = muted / unlocked = permanent cool silver / equipped = warm gold.
   No copper focus ring. No card or portrait lift/zoom.
   ========================================================= */
:root{
  --psm-spec-silver:214,223,231;
  --psm-spec-gold:216,184,95;
}
.psm-spec{
  margin:12px 0 4px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:linear-gradient(145deg,rgba(255,255,255,.026),rgba(255,255,255,.010));
  overflow:hidden
}
.psm-spec-summary{
  width:100%;min-height:58px;padding:8px 11px;border:0;background:transparent;color:inherit;
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:9px;
  text-align:left;-webkit-tap-highlight-color:transparent
}
.psm-spec-summary:active{background:rgba(255,255,255,.018)}
.psm-spec-summary-copy{min-width:0;display:flex;flex-direction:column;gap:2px}
.psm-spec-summary-kicker{font-size:8.5px;line-height:1;color:#66717a;font-weight:900;letter-spacing:.12em}
.psm-spec-summary-main{display:flex;align-items:baseline;gap:7px;min-width:0}
.psm-spec-summary-main strong{font-size:13px;color:#d9e0e6;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psm-spec-summary-main span{font-size:8px;color:#727e88;font-weight:760;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psm-spec-summary-reward{display:flex;align-items:center;gap:5px;min-width:0}
.psm-spec-summary-reward .psm-badge{transform:scale(.76);transform-origin:center}
.psm-spec-summary-reward small{max-width:54px;color:#8e99a2;font-size:8.5px;font-weight:820;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psm-spec-summary-chevron{
  flex:0 0 auto;width:18px;height:18px;position:relative;border:1px solid rgba(255,255,255,.055);border-radius:6px;background:rgba(255,255,255,.012);transform:rotate(0);transition:transform 320ms var(--motion-ease-out),background .18s,border-color .18s
}
.psm-spec-summary-chevron::before{
  content:"";position:absolute;left:50%;top:43%;width:6px;height:6px;
  border-right:1.4px solid #75818b;border-bottom:1.4px solid #75818b;
  transform:translate(-50%,-50%) rotate(45deg)
}
.psm-spec.open .psm-spec-summary-chevron{transform:rotate(180deg)}

.psm-spec-panel{
  display:grid;grid-template-rows:0fr;border-top:1px solid transparent;
  transition:grid-template-rows var(--motion-expand-panel) var(--motion-ease-out),border-color 240ms ease
}
.psm-spec.open .psm-spec-panel{grid-template-rows:1fr;border-top-color:rgba(255,255,255,.06)}
.psm-spec-panel-clip{min-height:0;overflow:hidden}
.psm-spec-panel-inner{
  min-height:0;padding:0 9px 10px;opacity:0;transform:translateY(-5px);
  transition:opacity var(--motion-fade) ease,transform var(--motion-expand-panel) var(--motion-ease-out)
}
.psm-spec.open .psm-spec-panel-inner{opacity:1;transform:translateY(0)}
.psm-spec-row{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;
  padding-top:9px;align-items:start
}
.psm-spec-card{
  position:relative;min-width:0;height:126px;padding:0;border-radius:12px;overflow:hidden;
  border:1px solid rgba(255,255,255,.045);
  background:rgba(8,13,18,.97);color:inherit;text-align:left;
  box-shadow:0 8px 20px rgba(0,0,0,.17);
  -webkit-tap-highlight-color:transparent;
  transition:border-color 320ms ease,box-shadow 360ms ease,background 360ms ease,filter 260ms ease
}
.psm-spec-card:active{filter:brightness(1.035)}
.psm-spec-art{
  position:absolute;inset:0 0 39px;background:#091016;overflow:hidden
}
.psm-spec-art img{
  width:100%;height:100%;display:block;object-fit:cover;object-position:center center;
  filter:grayscale(.98) saturate(.16) brightness(.44) contrast(.94) blur(.9px);
  transform:none!important;transition:filter 420ms ease!important
}
.psm-spec-art::after{
  content:"";position:absolute;inset:auto 0 0;height:55%;
  background:linear-gradient(180deg,transparent,rgba(8,13,18,.96));pointer-events:none
}
.psm-spec-player{
  position:absolute;left:8px;bottom:43px;z-index:2;max-width:78%;
  font-size:8px;font-weight:760;color:#56616b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.psm-spec-card-copy{
  position:absolute;left:8px;right:8px;bottom:7px;z-index:3;min-width:0
}
.psm-spec-card-copy strong{
  display:block;color:#78838d;font-size:11.5px;line-height:1.15;font-weight:860;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.psm-spec-card-copy span{
  display:block;margin-top:2px;color:#4d5862;font-size:8px;line-height:1;font-weight:800;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.psm-spec-status{
  position:absolute;z-index:5;right:7px;top:7px;min-height:20px;padding:0 7px;border-radius:999px;
  display:flex;align-items:center;border:1px solid rgba(255,255,255,.06);
  background:rgba(7,11,15,.84);color:#68737e;font-size:8px;font-weight:900;letter-spacing:.03em
}

/* Base archetype is always a silver identity, even when active. */
.psm-spec-card.base{
  border-color:rgba(var(--psm-spec-silver),.25);
  background:
    radial-gradient(ellipse 85% 34% at 50% -5%,rgba(var(--psm-spec-silver),.07),transparent 72%),
    rgba(12,18,24,.965)
}
.psm-spec-card.base .psm-spec-art{
  display:grid;place-items:center;background:
    radial-gradient(circle at 50% 47%,rgba(var(--psm-spec-silver),.095),transparent 43%),#0d151c
}
.psm-spec-card.base .psm-spec-art img{
  width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 7px 14px rgba(0,0,0,.30))!important
}
.psm-spec-card.base .psm-spec-player{color:#7b8791}
.psm-spec-card.base .psm-spec-card-copy strong{color:#e5ebf0}
.psm-spec-card.base .psm-spec-card-copy span{color:#7c8894}
.psm-spec-card.base .psm-spec-status{
  color:#c7d0d9;border-color:rgba(var(--psm-spec-silver),.20);background:rgba(24,31,38,.86)
}
.psm-spec-card.base.active{
  border-color:rgba(var(--psm-spec-silver),.43);
  box-shadow:0 9px 22px rgba(0,0,0,.19),0 0 0 1px rgba(var(--psm-spec-silver),.08),0 0 18px rgba(var(--psm-spec-silver),.045)
}

/* Unlocked specialty = permanent cool silver. */
.psm-spec-card.unlocked{
  border-color:rgba(var(--psm-spec-silver),.25);
  background:
    radial-gradient(ellipse 82% 30% at 50% -4%,rgba(var(--psm-spec-silver),.052),transparent 72%),
    linear-gradient(145deg,rgba(255,255,255,.030),rgba(255,255,255,.008) 44%,transparent 72%),
    rgba(12,18,24,.965);
  box-shadow:0 9px 22px rgba(0,0,0,.19),inset 0 0 0 1px rgba(225,233,240,.026)
}
.psm-spec-card.unlocked .psm-spec-art img{filter:saturate(1) brightness(1) contrast(1)!important}
.psm-spec-card.unlocked .psm-spec-player{color:#a7b2bc}
.psm-spec-card.unlocked .psm-spec-card-copy strong{color:#edf2f6}
.psm-spec-card.unlocked .psm-spec-card-copy span{color:#7c8894}
.psm-spec-card.unlocked .psm-spec-status{
  color:#c7d0d9;border-color:rgba(var(--psm-spec-silver),.22);background:rgba(24,31,38,.86)
}

/* Focus uses only the card's own silver/gold state; copper is intentionally absent. */
.psm-spec-card.focused:not(.equipped){
  border-color:rgba(var(--psm-spec-silver),.46);
  box-shadow:0 10px 24px rgba(0,0,0,.20),0 0 0 1px rgba(var(--psm-spec-silver),.11),0 0 17px rgba(var(--psm-spec-silver),.036)
}

/* Equipped specialty = gold, fixed geometry, no portrait movement. */
.psm-spec-card.equipped{
  border-color:rgba(var(--psm-spec-gold),.46);
  background:
    radial-gradient(ellipse 80% 29% at 50% -2%,rgba(237,211,132,.105),transparent 72%),
    linear-gradient(180deg,rgba(var(--psm-spec-gold),.050),transparent 56%),
    rgba(12,18,24,.968);
  box-shadow:0 10px 25px rgba(0,0,0,.22),0 0 0 1px rgba(var(--psm-spec-gold),.09),0 0 22px rgba(var(--psm-spec-gold),.082)
}
.psm-spec-card.equipped .psm-spec-art img{
  filter:saturate(1.025) brightness(1.01) contrast(1.005)!important;transform:none!important
}
.psm-spec-card.equipped .psm-spec-player{color:#c7b77c}
.psm-spec-card.equipped .psm-spec-card-copy strong{color:#ead58a}
.psm-spec-card.equipped .psm-spec-card-copy span{color:#9e8e60}
.psm-spec-card.equipped .psm-spec-status{
  color:#e1c872;border-color:rgba(var(--psm-spec-gold),.28);background:rgba(38,32,18,.80)
}

/* Row-spanning detail: exactly the same mental model as the PlayStyle library. */
.psm-spec-detail-shell{
  grid-column:1/-1;display:grid;grid-template-rows:0fr;min-width:0;
  transition:grid-template-rows var(--motion-expand-body) var(--motion-ease-out)
}
.psm-spec-detail-shell.open{grid-template-rows:1fr}
.psm-spec-detail-clip{min-height:0;overflow:hidden}
.psm-spec-detail{
  margin-top:1px;border:1px solid rgba(255,255,255,.07);border-radius:12px;
  background:rgba(11,17,22,.94);padding:10px;opacity:0;transform:translateY(-4px);
  transition:opacity var(--motion-fade) ease,transform var(--motion-expand-body) var(--motion-ease-out)
}
.psm-spec-detail-shell.open .psm-spec-detail{opacity:1;transform:translateY(0)}
.psm-spec-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px}
.psm-spec-detail-title{min-width:0}
.psm-spec-detail-title strong{display:block;color:#e4e9ed;font-size:12.5px;font-weight:880}
.psm-spec-detail-title span{display:block;margin-top:2px;color:#6f7b85;font-size:8.5px;font-weight:780}
.psm-spec-detail-state{
  min-height:21px;padding:0 7px;border-radius:999px;display:flex;align-items:center;
  border:1px solid rgba(255,255,255,.07);color:#8b969f;font-size:8.5px;font-weight:880;white-space:nowrap
}
.psm-spec-detail-state.good{color:#cbd4dc;border-color:rgba(var(--psm-spec-silver),.20);background:rgba(var(--psm-spec-silver),.035)}
.psm-spec-detail-state.gold{color:#e1c872;border-color:rgba(var(--psm-spec-gold),.24);background:rgba(var(--psm-spec-gold),.045)}
.psm-spec-detail-state.bad{color:#d98586;border-color:rgba(215,105,107,.19);background:rgba(215,105,107,.035)}
.psm-spec-reqs{display:grid;gap:5px;margin-top:4px}
.psm-spec-req{
  min-height:34px;padding:0 9px;border-radius:7px;background:rgba(255,255,255,.018);
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px
}
.psm-spec-req span{color:#aab2b8;font-size:11.2px;font-weight:740}
.psm-spec-req strong{color:#cfd6dc;font-size:13.4px;font-weight:900;font-variant-numeric:tabular-nums}
.psm-spec-req strong em{font-style:normal;color:#66717b;font-size:11.2px;margin-left:2px}
.psm-spec-req.met strong{color:#8fb99a}
.psm-spec-req.missing strong{color:#d69d78}
.psm-spec-rewards{
  margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.055);
  display:grid;grid-template-columns:1fr 1fr;gap:7px
}
.psm-spec-detail[data-psm-spec-detail="base"] .psm-spec-rewards{
  margin-top:0;padding-top:0;border-top:0
}
.psm-spec-reward{
  min-width:0;padding:7px 8px;border-radius:8px;background:rgba(255,255,255,.018)
}
.psm-spec-reward label{display:block;color:#626e78;font-size:8px;font-weight:850;letter-spacing:.04em}
.psm-spec-reward strong{
  display:block;margin-top:3px;color:#cbd3da;font-size:9px;font-weight:880;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.psm-spec-reward.gold strong{color:#d9c376}
.psm-spec-base-note{
  margin-top:7px;color:#75818b;font-size:8.5px;line-height:1.45
}
.psm-spec-action{
  width:100%;min-height:36px;margin-top:9px;border-radius:10px;border:1px solid rgba(255,255,255,.085);
  background:rgba(255,255,255,.025);color:#aab4bd;font-size:9px;font-weight:900
}
.psm-spec-action.silver:not(:disabled){
  color:#d2d9df;border-color:rgba(var(--psm-spec-silver),.24);
  background:linear-gradient(180deg,rgba(var(--psm-spec-silver),.052),rgba(255,255,255,.014))
}
.psm-spec-action.gold:not(:disabled){
  color:#dbc77f;border-color:rgba(var(--psm-spec-gold),.29);
  background:linear-gradient(180deg,rgba(var(--psm-spec-gold),.075),rgba(var(--psm-spec-gold),.027))
}
.psm-spec-action:disabled{opacity:.46}
.psm-spec-card.newly-equipped{
  animation:psmSpecGoldBloom 680ms cubic-bezier(.22,.68,.24,1) both
}
@keyframes psmSpecGoldBloom{
  0%{box-shadow:0 9px 22px rgba(0,0,0,.19);filter:brightness(1)}
  48%{box-shadow:0 10px 26px rgba(0,0,0,.22),0 0 24px rgba(var(--psm-spec-gold),.12);filter:brightness(1.035)}
  100%{filter:brightness(1)}
}
@media(prefers-reduced-motion:reduce){
  .psm-spec-panel,.psm-spec-panel-inner,.psm-spec-summary-chevron,.psm-spec-detail-shell,.psm-spec-detail,
  .psm-spec-card,.psm-spec-art img{transition-duration:.01ms!important}
  .psm-spec-card.newly-equipped{animation:none!important}
}


/* v0.39 · Persistent specialization grid + card reward badges + page-aware toolbar */
body.psm-view .context-toolbar{display:flex!important}
body.psm-view .context-toolbar .mode{display:none!important}
body.psm-view .context-toolbar .undo{padding:0 11px!important;min-width:52px!important}
#playstylesMobilePage{padding-bottom:128px!important}

.psm-spec-static-head{
  min-height:48px;padding:9px 11px 8px;display:flex;flex-direction:column;justify-content:center;gap:3px;
  border-bottom:1px solid rgba(255,255,255,.06)
}
.psm-spec-static-head span{color:#66717a;font-size:8.5px;line-height:1;font-weight:900;letter-spacing:.12em}
.psm-spec-static-head strong{color:#d9e0e6;font-size:13px;line-height:1.1;font-weight:860}
.psm-spec-panel{grid-template-rows:1fr!important;border-top-color:transparent!important}
.psm-spec-panel-inner{padding:0 9px 10px!important;opacity:1!important;transform:none!important}

.psm-spec-card-copy{right:48px!important}
.psm-spec-card-badge{
  position:absolute;z-index:4;right:2px;bottom:0;width:47px;height:47px;display:grid;place-items:center;
  pointer-events:none;transition:opacity 360ms ease,filter 420ms ease
}
.psm-spec-card-badge .psm-badge{transform:scale(.73);transform-origin:center}
/* Current reward is intentionally quieter than the top loadout badge. */
.psm-spec-card-badge.current{opacity:.80;filter:saturate(.94) brightness(.96)}
.psm-spec-card-badge.available{opacity:.42;filter:saturate(.82) brightness(.78)}
.psm-spec-card-badge.locked{opacity:.20;filter:saturate(.62) brightness(.62)}
.psm-spec-card.base:not(.active) .psm-spec-card-badge{opacity:.42}
.psm-spec-card.base.active .psm-spec-card-badge{opacity:.80}

@media(prefers-reduced-motion:reduce){
  .psm-spec-card-badge{transition-duration:.01ms!important}
}


/* v0.40 · Specialization perk and signature PlayStyle are independent.
   The equipped specialization controls the perk; one fixed signature slot can
   use either the base archetype signature or the currently equipped specialty+. */
.psm-badge.signature-switchable{cursor:pointer}
.psm-signature-mark{
  position:absolute;z-index:8;right:1px;bottom:1px;min-width:16px;height:16px;padding:0 3px;
  border:1px solid rgba(216,184,95,.22);border-radius:999px;display:flex;align-items:center;justify-content:center;
  background:rgba(18,16,11,.92);color:#cbb569;font-size:8.5px;font-weight:900;line-height:1;pointer-events:none
}
.psm-signature-picker{
  display:grid;grid-template-rows:0fr;margin:-5px 0 9px;
  transition:grid-template-rows var(--motion-expand-body) var(--motion-ease-out)
}
.psm-signature-picker.open{grid-template-rows:1fr}
.psm-signature-picker-clip{min-height:0;overflow:hidden}
.psm-signature-picker-inner{
  min-height:0;border:1px solid rgba(216,184,95,.14);border-radius:12px;background:rgba(18,23,28,.94);
  padding:9px;opacity:0;transform:translateY(-4px);
  transition:opacity var(--motion-fade) ease,transform var(--motion-expand-body) var(--motion-ease-out)
}
.psm-signature-picker.open .psm-signature-picker-inner{opacity:1;transform:translateY(0)}
.psm-signature-picker-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:7px}
.psm-signature-picker-title{min-width:0;display:grid;gap:2px}
.psm-signature-picker-title strong{color:#d4c075;font-size:9px;font-weight:900}
.psm-signature-picker-title span{color:#78838d;font-size:8.5px;font-weight:760}
.psm-signature-choices{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.psm-signature-choice{
  position:relative;min-width:0;min-height:66px;padding:7px 7px 7px 53px;border-radius:10px;
  border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.018);color:inherit;text-align:left;
  transition:border-color 260ms ease,background 260ms ease,box-shadow 300ms ease,filter 160ms ease
}
.psm-signature-choice:active{filter:brightness(1.04)}
.psm-signature-choice.active{
  border-color:rgba(216,184,95,.31);
  background:linear-gradient(180deg,rgba(216,184,95,.048),rgba(255,255,255,.015));
  box-shadow:inset 0 0 0 1px rgba(216,184,95,.035)
}
.psm-signature-choice .psm-badge{position:absolute;left:4px;top:9px;transform:scale(.78);transform-origin:center}
.psm-signature-choice-copy{min-width:0;display:flex;flex-direction:column;gap:3px;padding-top:4px}
.psm-signature-choice-copy small{color:#69757f;font-size:8px;font-weight:850;letter-spacing:.04em}
.psm-signature-choice-copy strong{color:#d9e0e6;font-size:9.6px;font-weight:880;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psm-signature-choice-copy span{color:#78848e;font-size:8px;font-weight:760;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psm-signature-choice.active .psm-signature-choice-copy small{color:#c5b269}
.psm-signature-choice.active .psm-signature-choice-copy strong{color:#e2d08c}
.psm-signature-check{position:absolute;right:7px;top:7px;color:#7fb58b;font-size:9px;font-weight:950;opacity:0}
.psm-signature-choice.active .psm-signature-check{opacity:1}
/* The card's reward badge follows signature-slot usage, not perk-card activation. */
.psm-spec-card-badge.current{opacity:.80;filter:saturate(.94) brightness(.96)}
.psm-spec-card-badge.available{opacity:.42;filter:saturate(.82) brightness(.78)}
.psm-spec-card-badge.locked{opacity:.20;filter:saturate(.62) brightness(.62)}
@media(prefers-reduced-motion:reduce){
  .psm-signature-picker,.psm-signature-picker-inner,.psm-signature-choice{transition-duration:.01ms!important}
}


/* Typography pass layout guards.
   1) Text toolbar buttons must stay on one line.
   2) At very narrow 320–340px screens, AMP switches from 6 to 5 columns so badges never clip. */
body.psm-view .context-toolbar .undo,
body.psm-view .context-toolbar .reset{
  font-size:10.5px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
@media(max-width:340px){
  .psm-amp-choices{grid-template-columns:repeat(5,minmax(0,1fr))!important}
}


/* v0.42 · Typography floor.
   6.x px -> 8px; 7.x px -> 8.5px.
   Core 8px+ hierarchy is otherwise unchanged. */


/* v0.45 · Specialization detail hierarchy balance + text-only perk sheet */
.psm-spec-req{
  min-height:31px!important;
  padding:0 9px!important;
}
.psm-spec-req span{font-size:10px!important;font-weight:750!important}
.psm-spec-req strong{font-size:11.5px!important;font-weight:900!important}
.psm-spec-req strong em{font-size:10px!important}

.psm-spec-reward label{font-size:9px!important}
.psm-spec-reward strong{font-size:10.5px!important;line-height:1.25!important}
.psm-spec-action{font-size:10.5px!important}

.psm-spec-base-perks{
  grid-column:1/-1;
  display:grid;
  gap:5px;
  margin-top:0;
}
.psm-spec-base-perks-label{
  color:#626e78;
  font-size:9px;
  font-weight:850;
  letter-spacing:.04em;
  padding:0 1px;
}
.psm-spec-perk-row{
  width:100%;
  min-height:32px;
  padding:0 9px;
  border:0;
  border-radius:8px;
  background:rgba(255,255,255,.018);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  color:#cbd3da;
  text-align:left;
  cursor:pointer;
}
.psm-spec-perk-row:active{background:rgba(255,255,255,.035)}
.psm-spec-perk-row strong{
  min-width:0;
  font-size:10.5px;
  font-weight:880;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.psm-spec-perk-row span{
  color:#7c8791;
  font-size:9px;
  font-weight:820;
  white-space:nowrap;
}
.psm-spec-perk-row.locked{opacity:.52}

.psm-spec-perk-hit{cursor:pointer;position:relative;padding-right:20px!important}
.psm-spec-perk-hit::after{
  content:'›';
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  color:#66717a;
  font-size:13px;
  line-height:1;
  font-weight:700;
}
.psm-spec-perk-hit:active{background:rgba(255,255,255,.035)}

/* v0.47 · Perk text uses an anchored contextual popover instead of a bottom sheet. */
.psm-perk-sheet{
  position:fixed;
  inset:0;
  z-index:240;
  pointer-events:none;
  visibility:hidden;
}
.psm-perk-sheet.open{visibility:visible}
.psm-perk-sheet-card{
  position:fixed;
  left:16px;
  top:16px;
  width:min(340px,calc(100vw - 32px));
  max-height:min(42vh,300px);
  overflow:auto;
  border:1px solid rgba(235,241,247,.12);
  border-radius:13px;
  background:rgba(16,21,26,.97);
  box-shadow:0 14px 34px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.045);
  -webkit-backdrop-filter:blur(20px) saturate(135%);
  backdrop-filter:blur(20px) saturate(135%);
  padding:14px 16px;
  opacity:0;
  visibility:hidden;
  pointer-events:auto;
  transform:translateY(var(--perk-enter-y,4px)) scale(.988);
  transform-origin:50% var(--perk-origin-y,100%);
  transition:opacity 190ms ease,transform 280ms var(--motion-ease-out),visibility 0s linear 280ms;
}
.psm-perk-sheet.open .psm-perk-sheet-card{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
  transition:opacity 190ms ease,transform 280ms var(--motion-ease-out),visibility 0s linear 0s;
}
.psm-perk-sheet[data-placement="below"] .psm-perk-sheet-card{
  --perk-enter-y:-4px;
  --perk-origin-y:0%;
}
.psm-perk-sheet[data-placement="above"] .psm-perk-sheet-card{
  --perk-enter-y:4px;
  --perk-origin-y:100%;
}
.psm-perk-sheet-text{
  margin:0;
  color:#d5dbe0;
  font-size:13px;
  line-height:1.68;
  font-weight:540;
  letter-spacing:.005em;
  white-space:pre-line;
}
@media(max-width:360px){
  .psm-perk-sheet-card{width:calc(100vw - 28px);padding:13px 15px}
}
@media(min-width:761px){
  .psm-perk-sheet-card{max-width:calc(100vw - 28px)}
}
@media(prefers-reduced-motion:reduce){
  .psm-perk-sheet-card{transition-duration:.01ms!important}
}


/* =========================================================
   v0.51 · Shared fixed context header + clearer level gesture
   Reuse `.mobile-context-title` + `.mobile-context-selector`
   on every future Mobile primary page.
   ========================================================= */
:root{
  --mobile-context-title-h:62px;
}

/* Page title and build context now behave as one persistent top module. */
.mobile-context-title{
  position:sticky!important;
  top:0!important;
  z-index:46!important;
  margin-left:-14px!important;
  margin-right:-14px!important;
  padding-left:15px!important;
  padding-right:15px!important;
  background:rgba(9,13,17,.985)!important;
  -webkit-backdrop-filter:blur(18px) saturate(120%);
  backdrop-filter:blur(18px) saturate(120%);
  isolation:isolate;
}
.mobile-context-selector{
  position:sticky!important;
  top:var(--mobile-context-title-h)!important;
  z-index:45!important;
  margin-top:0!important;
  background:linear-gradient(180deg,rgba(9,13,17,.985) 0%,rgba(9,13,17,.965) 78%,rgba(9,13,17,.91) 91%,rgba(9,13,17,0) 100%)!important;
  -webkit-backdrop-filter:blur(16px) saturate(118%);
  backdrop-filter:blur(16px) saturate(118%);
}

/* Approximately 20 / 80 between Level and Archetype selector.
   Separator and chevron remain lightweight utility columns. */
.mobile-context-selector .identity{
  grid-template-columns:minmax(62px,20%) 1px minmax(0,1fr) auto!important;
}
.mobile-context-selector .level{
  min-width:0!important;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  position:relative;
  cursor:ns-resize;
  border-radius:9px;
  transition:background 160ms ease,color 160ms ease;
}
.level-copy{white-space:nowrap}
.level-gesture-hint{
  width:13px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#77828b;
  font-size:12.5px;
  line-height:1;
  font-weight:780;
  opacity:.66;
  transform:translateY(0);
  animation:levelGestureNudge 1.05s cubic-bezier(.22,.78,.24,1) 760ms 2 both;
  pointer-events:none;
}
.mobile-context-selector .level.level-dragging{
  background:rgba(199,170,95,.045);
  color:#ddc476;
}
.mobile-context-selector .level.level-dragging .level-gesture-hint{
  color:#cdb46d;
  opacity:.96;
  animation:none;
}
@keyframes levelGestureNudge{
  0%,100%{transform:translateY(0);opacity:.58}
  28%{transform:translateY(-2.2px);opacity:.9}
  72%{transform:translateY(2.2px);opacity:.9}
}

/* Keep the fixed module visually stable on narrow phones. */
@media(max-width:350px){
  .mobile-context-selector .identity{grid-template-columns:minmax(58px,22%) 1px minmax(0,1fr) auto!important;gap:8px}
  .mobile-context-selector .level{gap:5px;font-size:13px}
  .level-gesture-hint{font-size:11.5px;width:11px}
}
@media(prefers-reduced-motion:reduce){
  .level-gesture-hint{animation:none!important}
}


/* =========================================================
   v0.52 · Real root-scroll sticky context header + 30/70 selector
   Root cause in v0.51: both html and body were overflow-y:auto.
   That made BODY the nearest overflow ancestor without its own
   scrolling viewport, so position:sticky computed correctly but
   behaved like normal flow while window/document scrolled.
   Keep only the root element as the document scroller; BODY must
   not become a scroll container.
   ========================================================= */
html{
  overflow-x:hidden!important;
  overflow-y:auto!important;
}
body{
  overflow:visible!important;
}
@supports (overflow:clip){
  body{
    overflow-x:clip!important;
    overflow-y:visible!important;
  }
}

/* Level : archetype = about 30 : 70 inside the flexible area.
   Separator and chevron remain fixed utility columns. */
.mobile-context-selector .identity{
  grid-template-columns:minmax(78px,3fr) 1px minmax(0,7fr) auto!important;
}

/* Give the wider level area a touch more breathing room without
   making the hint louder than the selected level itself. */
.mobile-context-selector .level{
  gap:8px!important;
}
.level-gesture-hint{
  flex:0 0 13px;
}

@media(max-width:350px){
  .mobile-context-selector .identity{
    grid-template-columns:minmax(74px,3fr) 1px minmax(0,7fr) auto!important;
    gap:7px!important;
  }
  .mobile-context-selector .level{gap:6px!important}
}


/* v0.53 · Specialization artwork normalization
   - Cafu / Baresi: their source cut-outs are almost pure black around the player,
     so add the same restrained ambient color/light language used by the other cards.
   - Kroos / Nedvěd: source aspect ratios were much taller than the rest; their
     embedded images are reframed to the common 2:1 card-art canvas above. */
#psmSpecPanel .psm-spec-art img{
  position:relative;
  z-index:0;
}
#psmSpecPanel .psm-spec-art::after{
  z-index:2;
}
#psmSpecPanel [data-psm-spec-card="marauder_plus"] .psm-spec-art::before,
#psmSpecPanel [data-psm-spec-card="pioneer"] .psm-spec-art::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  opacity:.78;
  mix-blend-mode:screen;
}
#psmSpecPanel [data-psm-spec-card="marauder_plus"] .psm-spec-art::before{
  background:
    radial-gradient(ellipse 58% 72% at 51% 50%,rgba(145,48,38,.24),transparent 68%),
    radial-gradient(ellipse 34% 58% at 64% 30%,rgba(218,179,105,.12),transparent 70%),
    linear-gradient(115deg,rgba(83,34,31,.10),transparent 48%);
}
#psmSpecPanel [data-psm-spec-card="pioneer"] .psm-spec-art::before{
  background:
    radial-gradient(ellipse 56% 72% at 50% 48%,rgba(137,55,42,.21),transparent 68%),
    radial-gradient(ellipse 34% 58% at 37% 29%,rgba(213,185,125,.12),transparent 70%),
    linear-gradient(245deg,rgba(77,43,35,.09),transparent 50%);
}
/* Keep the atmosphere restrained in the locked state and let it breathe once unlocked. */
#psmSpecPanel .psm-spec-card.locked[data-psm-spec-card="marauder_plus"] .psm-spec-art::before,
#psmSpecPanel .psm-spec-card.locked[data-psm-spec-card="pioneer"] .psm-spec-art::before{
  opacity:.48;
  filter:saturate(.72) brightness(.86);
}
#psmSpecPanel .psm-spec-card.unlocked[data-psm-spec-card="marauder_plus"] .psm-spec-art::before,
#psmSpecPanel .psm-spec-card.unlocked[data-psm-spec-card="pioneer"] .psm-spec-art::before,
#psmSpecPanel .psm-spec-card.equipped[data-psm-spec-card="marauder_plus"] .psm-spec-art::before,
#psmSpecPanel .psm-spec-card.equipped[data-psm-spec-card="pioneer"] .psm-spec-art::before{
  opacity:.88;
}


/* v0.54 · specialization portrait alignment / ambience correction
   - Cafu / Baresi now carry a neutral Ferdinand-like blue/slate + warm edge ambience
     directly in their embedded artwork, so the previous red screen tint is disabled.
   - Kroos / Nedvěd are reframed independently from their source portrait geometry
     (headroom + upper-body proportion), rather than sharing a one-size-fits-all crop. */
#psmSpecPanel [data-psm-spec-card="marauder_plus"] .psm-spec-art::before,
#psmSpecPanel [data-psm-spec-card="pioneer"] .psm-spec-art::before{
  display:none!important;
  content:none!important;
}
#psmSpecPanel [data-psm-spec-card="maestro_plus"] .psm-spec-art img,
#psmSpecPanel [data-psm-spec-card="heartbeat"] .psm-spec-art img,
#psmSpecPanel [data-psm-spec-card="marauder_plus"] .psm-spec-art img,
#psmSpecPanel [data-psm-spec-card="pioneer"] .psm-spec-art img{
  object-position:center center!important;
}


/* v0.55 · specialization edge cleanup
   - Kroos: remove bright top/right edge artifacts by giving the portrait more safety margin
     and fading the card-art edge back into the panel background.
   - Nedvěd: same cleanup on the right edge; keep the strong right-facing composition.
   - Cafu / Baresi: add a restrained Ferdinand-like slate-blue ambience instead of the older warm/red bias. */
#psmSpecPanel [data-psm-spec-card="maestro_plus"] .psm-spec-art::before,
#psmSpecPanel [data-psm-spec-card="heartbeat"] .psm-spec-art::before,
#psmSpecPanel [data-psm-spec-card="marauder_plus"] .psm-spec-art::before,
#psmSpecPanel [data-psm-spec-card="pioneer"] .psm-spec-art::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
}
/* Edge-safe fades for the two reframed portraits */
#psmSpecPanel [data-psm-spec-card="maestro_plus"] .psm-spec-art img{
  object-position:46% 48%!important;
}
#psmSpecPanel [data-psm-spec-card="maestro_plus"] .psm-spec-art::before{
  background:
    linear-gradient(180deg,rgba(9,16,22,.72) 0%,rgba(9,16,22,.22) 12%,transparent 30%),
    linear-gradient(270deg,rgba(9,16,22,.88) 0%,rgba(9,16,22,.38) 12%,transparent 24%),
    radial-gradient(ellipse 54% 42% at 50% 14%,rgba(9,16,22,.32),transparent 76%);
}
#psmSpecPanel [data-psm-spec-card="heartbeat"] .psm-spec-art img{
  object-position:47% 50%!important;
}
#psmSpecPanel [data-psm-spec-card="heartbeat"] .psm-spec-art::before{
  background:
    linear-gradient(270deg,rgba(9,16,22,.78) 0%,rgba(9,16,22,.28) 12%,transparent 24%),
    radial-gradient(ellipse 20% 58% at 100% 50%,rgba(9,16,22,.45),transparent 72%);
}
/* Bring Cafu / Baresi closer to Ferdinand's restrained slate-blue ambience. */
#psmSpecPanel [data-psm-spec-card="marauder_plus"] .psm-spec-art::before{
  background:
    linear-gradient(180deg,rgba(6,11,16,.10),rgba(6,11,16,.02) 44%,transparent 66%),
    radial-gradient(ellipse 72% 92% at 34% 50%,rgba(44,68,104,.24),transparent 70%),
    radial-gradient(ellipse 28% 66% at 86% 50%,rgba(173,136,77,.11),transparent 66%),
    linear-gradient(90deg,rgba(18,28,40,.16),transparent 44%);
  opacity:.9;
}
#psmSpecPanel [data-psm-spec-card="pioneer"] .psm-spec-art::before{
  background:
    linear-gradient(180deg,rgba(6,11,16,.10),rgba(6,11,16,.02) 44%,transparent 66%),
    radial-gradient(ellipse 74% 96% at 66% 48%,rgba(46,70,108,.24),transparent 70%),
    radial-gradient(ellipse 26% 64% at 12% 50%,rgba(170,132,74,.10),transparent 66%),
    linear-gradient(270deg,rgba(18,28,40,.16),transparent 44%);
  opacity:.88;
}
#psmSpecPanel .psm-spec-card.locked[data-psm-spec-card="marauder_plus"] .psm-spec-art::before,
#psmSpecPanel .psm-spec-card.locked[data-psm-spec-card="pioneer"] .psm-spec-art::before{opacity:.58;filter:saturate(.88) brightness(.86)}
#psmSpecPanel .psm-spec-card.unlocked[data-psm-spec-card="marauder_plus"] .psm-spec-art::before,
#psmSpecPanel .psm-spec-card.equipped[data-psm-spec-card="marauder_plus"] .psm-spec-art::before,
#psmSpecPanel .psm-spec-card.unlocked[data-psm-spec-card="pioneer"] .psm-spec-art::before,
#psmSpecPanel .psm-spec-card.equipped[data-psm-spec-card="pioneer"] .psm-spec-art::before{opacity:.92}


/* =========================================================
   v0.56 · Enhance / Mastery / Facilities mobile page
   ========================================================= */
#enhanceMobilePage[hidden]{display:none!important}
#enhanceMobilePage{
  min-height:100vh;
  padding:0 14px 132px;
}
.enh-page-title{margin:0 -0px}
.enh-page-title .en:before{content:"Enhance"}
.enh-section{margin-top:12px}
.enh-section-head{
  display:flex;align-items:baseline;gap:8px;margin:0 2px 8px;
}
.enh-section-head strong{font-size:13px;font-weight:900;color:#dce2e7}
.enh-section-head span{font-size:8.5px;font-weight:850;letter-spacing:.12em;color:#65717b}
.enh-card{
  border:1px solid rgba(255,255,255,.075);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(255,255,255,.028),transparent 45%),rgba(12,18,24,.72);
  box-shadow:0 12px 26px rgba(0,0,0,.16);
  overflow:hidden;
}

/* Mastery summary */
.mastery-mobile{position:relative}
.mastery-summary-top{
  min-height:43px;padding:0 11px;display:grid;
  grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;
}
.mastery-titleline{display:flex;align-items:center;gap:7px;min-width:0}
.mastery-titleline strong{font-size:12.5px;font-weight:900;color:#e0e5e9}
.mastery-titleline span{font-size:8px;font-weight:850;letter-spacing:.10em;color:#65717b}
.mastery-count{font-size:9.5px;font-weight:820;color:#aab3bb;white-space:nowrap}
.mastery-expand-btn{
  flex:0 0 auto;width:22px;height:22px;border:1px solid rgba(199,170,95,.12);border-radius:7px;
  background:rgba(199,170,95,.035);color:#a99563;font-size:14px;line-height:1;
  display:grid;place-items:center;pointer-events:none;
  transition:transform .26s cubic-bezier(.22,.78,.24,1),background .18s,border-color .18s,color .18s;
}
.mastery-summary-top:active .mastery-expand-btn{background:rgba(199,170,95,.075);border-color:rgba(199,170,95,.22);color:#d4bb75}
.mastery-mobile.open .mastery-expand-btn{transform:rotate(180deg);color:#d4bb75;border-color:rgba(199,170,95,.20);background:rgba(199,170,95,.055)}
.mastery-quickbar{
  display:grid;grid-template-columns:1fr 1fr .82fr;gap:6px;padding:0 10px 10px;
}
.mastery-quick{
  min-width:0;height:29px;border:1px solid rgba(255,255,255,.075);border-radius:9px;
  background:rgba(255,255,255,.022);color:#9ba5ae;font-size:9px;font-weight:820;
}
.mastery-quick:active{background:rgba(199,170,95,.07)}
.mastery-quick.is-complete{color:#d7bf7a;border-color:rgba(199,170,95,.22);background:rgba(199,170,95,.05)}
.mastery-quick.view-all{color:#8e99a2}
.mastery-list-shell{display:grid;grid-template-rows:0fr;transition:grid-template-rows .31s cubic-bezier(.22,.78,.24,1);border-top:1px solid transparent}
.mastery-mobile.open .mastery-list-shell{grid-template-rows:1fr;border-top-color:rgba(255,255,255,.055)}
.mastery-list-clip{min-height:0;overflow:hidden}
.mastery-list{padding:7px 8px 10px;opacity:0;transform:translateY(-5px);transition:opacity .18s ease,transform .28s cubic-bezier(.22,.78,.24,1)}
.mastery-mobile.open .mastery-list{opacity:1;transform:none}
.mastery-group+.mastery-group{margin-top:7px}
.mastery-group-cap{height:22px;display:flex;align-items:center;padding:0 4px;color:#68747e;font-size:8px;font-weight:850;letter-spacing:.09em}
.mastery-model-row{
  min-height:39px;display:grid;grid-template-columns:92px minmax(0,1.38fr) minmax(78px,.9fr);align-items:center;
  gap:5px;padding:4px;border-top:1px solid rgba(255,255,255,.038);cursor:pointer;
}
.mastery-group .mastery-model-row:first-of-type{border-top:0}
.mastery-model-row.current{background:rgba(199,170,95,.025);border-radius:10px}
.mastery-model-id{min-width:0;display:grid;grid-template-columns:26px minmax(0,1fr);gap:6px;align-items:center}
.mastery-model-id img{width:26px;height:26px;object-fit:contain;opacity:.76}
.mastery-model-id strong{font-size:10.2px;font-weight:830;color:#aeb7bf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mastery-node-mobile{
  height:30px;min-width:0;padding:0 6px;border:1px solid rgba(255,255,255,.05);border-radius:8px;
  display:flex;align-items:center;gap:5px;background:rgba(255,255,255,.014);color:#69747e;overflow:hidden;
}
.mastery-node-mobile b{flex:0 0 auto;font-size:8.5px;font-weight:900;color:#76818b}
.mastery-node-mobile span{min-width:0;font-size:8px;font-weight:760;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mastery-node-mobile.active{border-color:rgba(199,170,95,.20);background:rgba(199,170,95,.052);color:#c5b479}
.mastery-node-mobile.active b{color:#d6bd72}
.mastery-aggregate-pop{
  position:absolute;z-index:50;right:9px;top:75px;width:min(306px,calc(100% - 18px));max-height:42vh;overflow:auto;
  padding:11px;border:1px solid rgba(255,255,255,.11);border-radius:13px;background:rgba(13,19,24,.985);
  box-shadow:0 18px 44px rgba(0,0,0,.42);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  opacity:0;transform:translateY(-5px) scale(.985);pointer-events:none;transition:opacity .16s,transform .18s;
}
.mastery-aggregate-pop.show{opacity:1;transform:none;pointer-events:auto}
.mastery-aggregate-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.mastery-aggregate-head strong{font-size:10.5px;color:#d7dde2}.mastery-aggregate-head span{font-size:8px;color:#69747d}
.mastery-aggregate-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.mastery-agg-chip{height:28px;padding:0 8px;border:1px solid rgba(255,255,255,.055);border-radius:8px;background:rgba(255,255,255,.018);display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:9px;color:#8f99a2}
.mastery-agg-chip b{font-size:10px;color:#cdb777}
.mastery-aggregate-empty{padding:10px 3px;color:#6a747d;font-size:9px;text-align:center}

/* Facilities */
.facility-mobile-head{display:flex;align-items:baseline;gap:8px;margin-bottom:8px;padding:0 2px}
.facility-mobile-head strong{font-size:13px;font-weight:900;color:#dce2e7}.facility-mobile-head span{font-size:8.5px;font-weight:850;letter-spacing:.12em;color:#65717b}
.facility-budget-wrap{display:grid;grid-template-columns:132px minmax(0,1fr);gap:8px}
.facility-info-card{min-height:72px;padding:10px 11px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(12,18,24,.70)}
.facility-info-card>label,.facility-info-title{display:block;margin-bottom:7px;color:#6d7882;font-size:8.5px;font-weight:850;letter-spacing:.04em}
.facility-level-select{width:100%;height:33px;border:1px solid rgba(199,170,95,.20);border-radius:10px;background:#10161c;color:#d1d6da;padding:0 9px;font-size:10.5px;font-weight:830;outline:none;color-scheme:dark}
.facility-budget-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px}.facility-budget-head span{font-size:8.5px;color:#707b84;font-weight:820}.facility-budget-head strong{font-size:10.5px;color:#b7c0c7;font-weight:900}.facility-budget-head strong.over{color:#d78372}
.facility-budget-rail{height:5px;border-radius:999px;background:#1a2026;overflow:hidden}.facility-budget-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#786b40,#bea65e);transition:width .26s ease}.facility-budget-fill.over{background:linear-gradient(90deg,#9e5448,#cf7766)}
.facility-overbudget-note{display:none;margin-top:8px;padding:8px 10px;border:1px solid rgba(211,112,92,.20);border-radius:10px;background:rgba(188,75,58,.055);color:#cf8d7f;font-size:9px;line-height:1.45;font-weight:760}.facility-overbudget-note.show{display:block}
.facility-summary{margin-top:8px;padding:10px 11px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(12,18,24,.62);transition:opacity .2s}.facility-summary.paused{opacity:.54}
.facility-summary-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}.facility-summary-top strong{font-size:9px;color:#747f88}.facility-paused-pill{display:none;padding:3px 6px;border-radius:999px;border:1px solid rgba(211,112,92,.18);color:#c18174;font-size:8px;font-weight:800}.facility-summary.paused .facility-paused-pill{display:inline-flex}
.facility-attr-chips{display:flex;flex-wrap:wrap;gap:5px}.facility-attr-chip{height:27px;display:flex;align-items:center;gap:6px;padding:0 8px;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:rgba(255,255,255,.018);font-size:9px;color:#929ca4}.facility-attr-chip b{color:#c6b173;font-size:9.5px}.facility-summary-empty{color:#65707a;font-size:9px;padding:4px 0}
.facility-ps-summary{margin-top:9px;padding-top:9px;border-top:1px solid rgba(255,255,255,.045)}
.facility-ps-title{margin-bottom:6px;color:#707b84;font-size:8.5px;font-weight:850}
.facility-ps-row{display:flex;flex-wrap:wrap;gap:7px}.facility-ps-item{display:flex;align-items:center;gap:5px;min-width:0}.facility-ps-icon{width:25px;height:25px;object-fit:contain}.facility-ps-item span{font-size:8.5px;color:#8e99a1;font-weight:760}
.facility-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.facility-card-mobile,.facility-add-mobile{position:relative;min-height:126px;border:1px solid rgba(199,170,95,.16);border-radius:14px;background:linear-gradient(145deg,rgba(199,170,95,.035),transparent 46%),rgba(12,18,24,.72);padding:10px;text-align:left;color:inherit;overflow:hidden}
.facility-card-mobile:active,.facility-add-mobile:active{filter:brightness(1.04)}
.facility-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.facility-card-icon{width:31px;height:31px;object-fit:contain;filter:grayscale(.12) brightness(.85)}
.facility-card-level{height:21px;padding:0 7px;border:1px solid rgba(199,170,95,.18);border-radius:999px;display:flex;align-items:center;color:#b7a568;font-size:8.5px;font-weight:900;background:rgba(199,170,95,.035)}
.facility-card-mobile h4{margin:10px 0 6px;font-size:11.5px;line-height:1.2;color:#c5ccd2;font-weight:880;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.facility-card-boosts{display:flex;gap:7px;flex-wrap:wrap;min-height:17px}.facility-card-boosts span{font-size:8.7px;color:#858f98;white-space:nowrap}.facility-card-boosts b{color:#baa76c;font-size:9px}
.facility-card-foot{position:absolute;left:10px;right:10px;bottom:8px;padding-top:7px;border-top:1px solid rgba(255,255,255,.04);display:flex;align-items:center;gap:7px}.facility-card-cost{font-size:9.5px;font-weight:900;color:#9ea8b0;margin-right:auto}.facility-card-ps{width:24px;height:24px;object-fit:contain}.facility-delete{width:24px;height:24px;border:1px solid rgba(255,255,255,.055);border-radius:8px;background:rgba(255,255,255,.012);color:#59636c;display:grid;place-items:center;font-size:13px}
.facility-add-mobile{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-style:dashed;border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.012)}
.facility-add-mobile .plus{font-size:25px;line-height:1;color:#a78f54}.facility-add-mobile strong{margin-top:4px;font-size:10.5px;color:#9da7af}.facility-add-mobile small{margin-top:5px;font-size:8.5px;color:#64707a}
.facility-add-mobile:disabled{opacity:.42}

/* Lightweight selector shell for v0.56 testing; visual refinement can follow. */
.facility-picker-backdrop{position:fixed;inset:0;z-index:180;background:rgba(0,0,0,.48);opacity:0;pointer-events:none;transition:opacity .18s}.facility-picker-backdrop.open{opacity:1;pointer-events:auto}
.facility-picker-sheet{position:fixed;z-index:190;left:50%;bottom:0;width:min(430px,100%);max-height:78vh;transform:translate(-50%,105%);transition:transform .27s cubic-bezier(.22,.78,.24,1);border:1px solid rgba(255,255,255,.09);border-bottom:0;border-radius:20px 20px 0 0;background:linear-gradient(180deg,#11181e,#0a0f14);box-shadow:0 -22px 50px rgba(0,0,0,.40);overflow:hidden}.facility-picker-sheet.open{transform:translate(-50%,0)}
.facility-picker-head{height:52px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.055)}.facility-picker-head strong{font-size:12px;color:#d8dee3}.facility-picker-close{width:29px;height:29px;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.02);color:#7c8790;font-size:18px}
.facility-picker-body{max-height:calc(78vh - 52px);overflow:auto;padding:10px 12px 24px}
.facility-picker-list{display:grid;grid-template-columns:1fr 1fr;gap:7px}.facility-picker-tile{min-height:68px;border:1px solid rgba(255,255,255,.065);border-radius:12px;background:rgba(255,255,255,.018);padding:8px;display:grid;grid-template-columns:28px minmax(0,1fr);gap:7px;align-items:center;text-align:left;color:inherit}.facility-picker-tile.selected{border-color:rgba(199,170,95,.22);background:rgba(199,170,95,.04)}.facility-picker-tile img{width:27px;height:27px;object-fit:contain;opacity:.8}.facility-picker-tile strong{display:block;font-size:9.5px;color:#aeb7bf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.facility-picker-tile span{display:block;margin-top:4px;font-size:8px;line-height:1.3;color:#69747d}
.facility-picker-detail{padding:3px 0}.facility-detail-title{display:flex;align-items:center;gap:9px;margin-bottom:9px}.facility-detail-title img{width:34px;height:34px;object-fit:contain}.facility-detail-title strong{font-size:12px;color:#d2d8dd}.facility-detail-title span{display:block;margin-top:3px;font-size:8.5px;color:#707a83}.facility-level-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.facility-level-option{min-height:104px;border:1px solid rgba(255,255,255,.065);border-radius:12px;background:rgba(255,255,255,.018);padding:8px;text-align:left;color:#8c969f}.facility-level-option.current{border-color:rgba(199,170,95,.24);background:rgba(199,170,95,.045)}.facility-level-option:disabled{opacity:.38}.facility-level-option strong{font-size:10px;color:#c4ccd2}.facility-level-option .lvboost{margin-top:8px;font-size:8.3px;line-height:1.6}.facility-level-option .lvboost b{color:#b9a66c}.facility-level-option .lvcost{margin-top:6px;font-size:9px;font-weight:900;color:#9da7af}.facility-level-option .lvreward{margin-top:6px;font-size:8px;color:#a99660;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.facility-picker-back{height:28px;margin-bottom:8px;border:1px solid rgba(255,255,255,.06);border-radius:8px;background:rgba(255,255,255,.018);color:#7d8790;font-size:8.5px;font-weight:800;padding:0 9px}

body.enh-view .context-toolbar .mode{display:none!important}
body.enh-view .context-toolbar{justify-content:flex-end}
body.enh-view .context-toolbar .toolbar-spacer{display:block}
@media(max-width:350px){
  .mastery-model-row{grid-template-columns:82px minmax(0,1.34fr) minmax(72px,.88fr);gap:4px}
  .mastery-node-mobile{padding:0 4px}.mastery-node-mobile b{font-size:8px}.mastery-node-mobile span{font-size:8px}
  .facility-budget-wrap{grid-template-columns:116px minmax(0,1fr)}
  .facility-card-mobile,.facility-add-mobile{min-height:122px;padding:9px}
}
@media(prefers-reduced-motion:reduce){.mastery-list-shell,.mastery-list,.facility-picker-backdrop,.facility-picker-sheet{transition-duration:.01ms!important}}


/* =========================================================
   v0.57 · Enhance refinement
   ========================================================= */
/* Mastery: the entire summary row is the open/close hit target. */
.mastery-summary-top{cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .16s ease}
.mastery-summary-top:active{background:rgba(255,255,255,.022)}
.mastery-summary-top:focus-visible{outline:1px solid rgba(199,170,95,.28);outline-offset:-1px}
.mastery-expand-btn{pointer-events:none}
.mastery-quickbar{grid-template-columns:1fr 1fr .86fr}
.mastery-quick.is-complete{box-shadow:inset 0 0 0 1px rgba(199,170,95,.035)}

/* Mastery aggregate is a real modal, independent from expansion state. */
.mastery-aggregate-backdrop{
  position:fixed;inset:0;z-index:245;background:rgba(2,6,9,.43);
  backdrop-filter:blur(7px) saturate(.85);-webkit-backdrop-filter:blur(7px) saturate(.85);
  opacity:0;pointer-events:none;transition:opacity .18s ease
}
.mastery-aggregate-backdrop.show{opacity:1;pointer-events:auto}
.mastery-aggregate-pop{
  position:fixed;z-index:250;left:50%;top:50%;right:auto;
  width:min(400px,calc(100vw - 28px));max-height:min(62vh,540px);overflow:auto;
  padding:13px;border:1px solid rgba(255,255,255,.12);border-radius:16px;
  background:linear-gradient(180deg,rgba(17,24,30,.985),rgba(9,14,19,.99));
  box-shadow:0 24px 62px rgba(0,0,0,.50);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  opacity:0;transform:translate(-50%,-47%) scale(.975);pointer-events:none;
  transition:opacity .17s ease,transform .20s cubic-bezier(.22,.78,.24,1)
}
.mastery-aggregate-pop.show{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}
.mastery-aggregate-head{position:sticky;top:-13px;z-index:2;margin:-13px -13px 10px;padding:12px 13px 9px;background:rgba(15,21,27,.96);border-bottom:1px solid rgba(255,255,255,.05)}
.mastery-aggregate-head-copy{display:flex;align-items:baseline;gap:7px;min-width:0}
.mastery-aggregate-head-copy strong{font-size:12px;color:#dce2e7}.mastery-aggregate-head-copy span{font-size:8.5px;color:#6f7a84}
.mastery-aggregate-close{width:28px;height:28px;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.02);color:#7f8992;font-size:18px;line-height:1}
.mastery-aggregate-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.mastery-agg-chip{height:31px;padding:0 7px;gap:5px;font-size:9px;min-width:0}
.mastery-agg-chip span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mastery-agg-chip b{font-size:10px;flex:0 0 auto}
.mastery-agg-chip.wide{grid-column:span 2}
body.mastery-modal-open{overflow:hidden!important}

/* Club level: compact selected value, richer dropdown rows. */
.facility-budget-wrap{grid-template-columns:122px minmax(0,1fr);gap:8px;align-items:stretch}
.facility-info-card{position:relative;min-height:56px;padding:9px 10px}
.facility-level-card{display:flex;align-items:center;padding:8px}
.facility-level-button{width:100%;height:38px;border:1px solid rgba(199,170,95,.20);border-radius:10px;background:#10161c;color:#d1d6da;padding:0 9px;display:flex;align-items:center;justify-content:space-between;gap:7px;font-size:10.5px;font-weight:850;text-align:left}
.facility-level-chevron{color:#75808a;font-size:14px;transition:transform .2s ease}
.facility-level-button[aria-expanded="true"] .facility-level-chevron{transform:rotate(180deg)}
.facility-level-menu{position:absolute;z-index:80;left:8px;right:8px;top:50px;padding:5px;border:1px solid rgba(255,255,255,.10);border-radius:11px;background:#0d1318;box-shadow:0 16px 38px rgba(0,0,0,.58);opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .15s ease,transform .18s ease}
.facility-level-menu.show{opacity:1;transform:none;pointer-events:auto}
.facility-level-menu button{width:100%;height:31px;border:0;border-radius:7px;background:transparent;padding:0 7px;display:flex;align-items:center;justify-content:space-between;color:#a8b1b9;font-size:9.5px;font-weight:800}
.facility-level-menu button span:last-child{color:#7b858e;font-size:9px;font-variant-numeric:tabular-nums}
.facility-level-menu button.active{background:rgba(199,170,95,.065);color:#d7bf7a}
.facility-level-menu button:active{background:rgba(255,255,255,.04)}
.facility-budget-head{margin-bottom:7px}

/* Facilities cards: keep 2 columns, but lift all operational text above tiny-helper size. */
.facility-card-mobile,.facility-add-mobile{min-height:132px;padding:10px}
.facility-card-icon{width:32px;height:32px}.facility-card-level{font-size:9px}
.facility-card-mobile h4{font-size:12px;margin:9px 0 7px}
.facility-card-boosts{gap:7px;min-height:18px}.facility-card-boosts span{font-size:9.5px}.facility-card-boosts b{font-size:9.8px}
.facility-card-cost{font-size:10.2px}.facility-card-ps{width:26px;height:26px}.facility-delete{width:25px;height:25px}
.facility-add-mobile strong{font-size:11px}.facility-add-mobile small{font-size:9px}

/* Facility selector: every tile exposes its Lv3 PlayStyle; level cards repeat it at Lv3. */
.facility-picker-list{gap:8px}
.facility-picker-tile{position:relative;min-height:76px;padding:9px;grid-template-columns:30px minmax(0,1fr) 28px;gap:8px}
.facility-picker-tile>img{width:29px;height:29px}
.facility-picker-tile strong{font-size:10.5px}
.facility-picker-tile .facility-picker-summary{display:block;margin-top:4px;font-size:9.2px;line-height:1.35;color:#737e87}
.facility-picker-reward{width:28px;height:28px;display:grid;place-items:center;align-self:center;justify-self:end}
.facility-picker-reward img{width:27px!important;height:27px!important;object-fit:contain;opacity:.88!important}
.facility-picker-reward .fallback{width:24px;height:24px;border:1px solid rgba(199,170,95,.18);transform:rotate(45deg);display:grid;place-items:center;color:#a18d58;font-size:10px}
.facility-picker-reward .fallback i{font-style:normal;transform:rotate(-45deg)}
.facility-detail-title img{width:36px;height:36px}.facility-detail-title strong{font-size:12.5px}.facility-detail-title span{font-size:9.5px}
.facility-level-option{min-height:122px;padding:9px}.facility-level-option strong{font-size:10.5px}.facility-level-option .lvboost{font-size:9.4px;line-height:1.55}.facility-level-option .lvcost{font-size:9.8px}.facility-level-option .lvreward{margin-top:7px;display:flex;align-items:center;gap:5px;min-height:28px;font-size:9.2px;color:#a99660;white-space:normal;overflow:visible}
.facility-level-option .lvreward img{width:25px;height:25px;object-fit:contain;flex:0 0 auto}
.facility-picker-back{font-size:9px}

@media(max-width:360px){
  .mastery-aggregate-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mastery-agg-chip.wide{grid-column:span 2}
  .facility-budget-wrap{grid-template-columns:112px minmax(0,1fr)}
  .facility-picker-tile{grid-template-columns:27px minmax(0,1fr) 26px;padding:8px;gap:6px}
  .facility-picker-tile>img{width:27px;height:27px}.facility-picker-reward img{width:25px!important;height:25px!important}
}
@media(prefers-reduced-motion:reduce){.mastery-aggregate-backdrop,.mastery-aggregate-pop,.facility-level-menu,.facility-level-chevron{transition-duration:.01ms!important}}


/* v0.58 · Facility PlayStyle shells + clearer two-line facility picker attributes */
.facility-ps-badge-mobile{
  width:28px;height:28px;display:inline-grid;place-items:center;flex:0 0 auto;
  background:linear-gradient(145deg,#d8dde2,#aeb5bc);
  clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.28));
}
.facility-ps-badge-mobile.plus{
  background:linear-gradient(145deg,#dfc46c,#a88737);
}
.facility-ps-badge-mobile img{
  width:68%!important;height:68%!important;object-fit:contain!important;opacity:1!important;
  filter:brightness(.18) contrast(1.15);
}
.facility-ps-badge-mobile.small{width:26px;height:26px}
.facility-ps-badge-mobile.picker{width:29px;height:29px}
.facility-ps-badge-mobile.level{width:26px;height:26px}

/* Selected facility cards: agreed readable attribute floor. */
.facility-card-boosts span{font-size:10px!important}
.facility-card-boosts b{font-size:10.5px!important}

/* Picker tiles: one facility attribute per line, never "A + B" on one line. */
.facility-picker-tile{min-height:82px!important;align-items:center}
.facility-picker-summary{
  display:grid!important;
  gap:2px!important;
  margin-top:4px!important;
  font-size:10px!important;
  line-height:1.22!important;
  color:#78838c!important;
}
.facility-picker-summary-line{
  display:block!important;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:10px!important;
  line-height:1.22!important;
}
.facility-picker-reward{width:30px!important;height:30px!important}
.facility-picker-reward .facility-ps-badge-mobile{margin:auto}

/* Lv detail attributes should not fall below the same readable level. */
.facility-level-option .lvboost{font-size:10px!important;line-height:1.5!important}
.facility-level-option .lvreward{font-size:9.5px!important}
.facility-level-option .lvreward .facility-ps-badge-mobile{margin-right:1px}

/* Info-only facility PlayStyle summary uses the same badge language. */
.facility-ps-item .facility-ps-badge-mobile{width:26px;height:26px}
.facility-card-foot .facility-ps-badge-mobile{width:27px;height:27px}

@media(max-width:360px){
  .facility-picker-tile{min-height:80px!important}
  .facility-picker-summary,.facility-picker-summary-line{font-size:10px!important}
  .facility-ps-badge-mobile.picker{width:27px;height:27px}
}


/* v0.59 · Facility PlayStyle badge fix
   Reuse the exact badge shell language from the PlayStyle page.
   Silver = native diamond; PlayStyle+ = native wider pentagonal gold shell.
   This intentionally replaces the temporary CSS diamond from v0.58. */
.facility-ps-badge-mobile{
  --fac-badge-h:26px;
  --fac-badge-w:26px;
  --fac-icon-box:15px;
  position:relative!important;
  width:32px!important;
  height:30px!important;
  display:inline-grid!important;
  place-items:center!important;
  flex:0 0 32px!important;
  overflow:visible!important;
  background:none!important;
  clip-path:none!important;
  filter:none!important;
}
.facility-ps-badge-mobile.plus{
  --fac-badge-w:31px;
  --fac-icon-box:15px;
}
.facility-ps-badge-mobile .psm-badge-shell,
.facility-ps-badge-mobile.plus .psm-badge-shell{
  --badge-h:var(--fac-badge-h)!important;
  --badge-w:var(--fac-badge-w)!important;
  --icon-box:var(--fac-icon-box)!important;
  --icon-lift:0px!important;
  position:relative!important;
  width:32px!important;
  height:30px!important;
  display:block!important;
  overflow:visible!important;
  background:none!important;
  clip-path:none!important;
  filter:none!important;
}
.facility-ps-badge-mobile.plus .psm-badge-shell{--icon-lift:1px!important}
.facility-ps-badge-mobile .psm-badge-shell::before{
  background:var(--psm-silver-badge) center/100% 100% no-repeat!important;
}
.facility-ps-badge-mobile.plus .psm-badge-shell::before{
  background-image:var(--psm-gold-badge)!important;
}
.facility-ps-badge-mobile .psm-badge-shell img{
  position:absolute!important;
  left:50%!important;
  top:calc(50% - var(--icon-lift))!important;
  width:var(--icon-box)!important;
  height:var(--icon-box)!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  transform:translate(-50%,-50%)!important;
  opacity:1!important;
  filter:none!important;
  z-index:2!important;
}
/* Context sizing: same artwork, only the container scale changes. */
.facility-ps-badge-mobile.small{
  --fac-badge-h:24px;--fac-badge-w:24px;--fac-icon-box:14px;
  width:29px!important;height:28px!important;flex-basis:29px!important;
}
.facility-ps-badge-mobile.small.plus{--fac-badge-w:29px}
.facility-ps-badge-mobile.small .psm-badge-shell{width:29px!important;height:28px!important}
.facility-ps-badge-mobile.picker{
  --fac-badge-h:27px;--fac-badge-w:27px;--fac-icon-box:15.5px;
  width:34px!important;height:31px!important;flex-basis:34px!important;
}
.facility-ps-badge-mobile.picker.plus{--fac-badge-w:32.5px}
.facility-ps-badge-mobile.picker .psm-badge-shell{width:34px!important;height:31px!important}
.facility-ps-badge-mobile.level{
  --fac-badge-h:26px;--fac-badge-w:26px;--fac-icon-box:15px;
  width:33px!important;height:30px!important;flex-basis:33px!important;
}
.facility-ps-badge-mobile.level.plus{--fac-badge-w:31px}
.facility-ps-badge-mobile.level .psm-badge-shell{width:33px!important;height:30px!important}
/* Give the picker reward column enough room for the wider PlayStyle+ shell. */
.facility-picker-tile{grid-template-columns:30px minmax(0,1fr) 34px!important}
.facility-picker-reward{width:34px!important;height:31px!important;overflow:visible!important}
.facility-level-option .lvreward{overflow:visible!important}
.facility-level-option .lvreward .facility-ps-badge-mobile{margin-right:2px!important}
@media(max-width:360px){
  .facility-picker-tile{grid-template-columns:27px minmax(0,1fr) 32px!important}
  .facility-ps-badge-mobile.picker{width:32px!important;flex-basis:32px!important}
  .facility-ps-badge-mobile.picker .psm-badge-shell{width:32px!important}
  .facility-picker-reward{width:32px!important}
}


/* v0.60 · Global SVG Undo / Reset + three Enhance presets */
.context-toolbar .tool.undo,
.context-toolbar .tool.reset{
  width:31px!important;min-width:31px!important;height:31px!important;padding:0!important;
  display:grid!important;place-items:center!important;border-radius:9px!important;
}
.context-toolbar .tool svg,
.enh-preset-save svg{
  width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;pointer-events:none;
}
.context-toolbar .tool:disabled{opacity:.34!important}
body.psm-view .context-toolbar .undo,body.psm-view .context-toolbar .reset{
  min-width:31px!important;width:31px!important;padding:0!important;font-size:0!important;
}
.enh-preset-toolbar{display:none;align-items:center;gap:5px;min-width:0}
body.enh-view .enh-preset-toolbar{display:flex}
.enh-preset-save,.enh-preset-slot{
  height:31px;border:1px solid rgba(235,241,247,.10);border-radius:9px;
  background:rgba(255,255,255,.025);color:#8e98a1;
}
.enh-preset-save{width:31px;min-width:31px;display:grid;place-items:center;padding:0}
.enh-preset-slot{
  min-width:43px;padding:0 7px;font-size:9px;line-height:1;font-weight:820;white-space:nowrap;position:relative;
}
.enh-preset-slot.has-data{color:#c8b578;border-color:rgba(199,170,95,.20);background:rgba(199,170,95,.045)}
.enh-preset-slot.has-data::after{
  content:"";position:absolute;right:4px;top:4px;width:4px;height:4px;border-radius:50%;background:#cbb66d;opacity:.8;
}
.enh-preset-save:active,.enh-preset-slot:active{filter:brightness(1.08)}
body.enh-view .context-toolbar{gap:6px!important;padding-left:7px!important;padding-right:7px!important}

.enh-preset-backdrop{
  position:fixed;inset:0;z-index:250;background:rgba(2,5,8,.54);
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  opacity:0;pointer-events:none;transition:opacity .18s ease;
}
.enh-preset-backdrop.show{opacity:1;pointer-events:auto}
.enh-preset-modal{
  position:fixed;z-index:260;left:50%;top:50%;width:min(366px,calc(100% - 28px));max-height:min(72vh,560px);
  transform:translate(-50%,-47%) scale(.985);opacity:0;pointer-events:none;
  border:1px solid rgba(255,255,255,.10);border-radius:18px;overflow:hidden;
  background:linear-gradient(180deg,rgba(18,25,31,.985),rgba(9,14,19,.995));
  box-shadow:0 28px 74px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.035);
  transition:opacity .18s ease,transform .22s cubic-bezier(.22,.78,.24,1);
}
.enh-preset-modal.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.enh-preset-modal-inner{max-height:min(72vh,560px);overflow:auto;padding:16px}
.enh-preset-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:13px}
.enh-preset-head-copy{min-width:0}
.enh-preset-head strong{display:block;color:#e0e5e9;font-size:13px;font-weight:900}
.enh-preset-head span{display:block;margin-top:4px;color:#707b85;font-size:9px;line-height:1.45}
.enh-preset-close{
  flex:0 0 auto;width:29px;height:29px;border:1px solid rgba(255,255,255,.07);border-radius:9px;
  background:rgba(255,255,255,.02);color:#7b8690;font-size:18px;display:grid;place-items:center;
}
.enh-preset-scope-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.enh-preset-scope{
  min-height:66px;border:1px solid rgba(255,255,255,.065);border-radius:13px;background:rgba(255,255,255,.018);
  padding:10px;text-align:left;color:#8b959e;position:relative;
}
.enh-preset-scope strong{display:block;color:#b7c0c7;font-size:11px;font-weight:860}
.enh-preset-scope span{display:block;margin-top:5px;font-size:8.5px;line-height:1.4;color:#68737d}
.enh-preset-scope::after{
  content:"";position:absolute;right:10px;top:10px;width:14px;height:14px;border-radius:5px;
  border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.015);
}
.enh-preset-scope.selected{border-color:rgba(199,170,95,.24);background:rgba(199,170,95,.045)}
.enh-preset-scope.selected strong{color:#dcc780}
.enh-preset-scope.selected::after{
  content:"✓";display:grid;place-items:center;color:#d8c178;border-color:rgba(199,170,95,.28);font-size:9px;font-weight:950;
}
.enh-preset-actions{display:flex;justify-content:flex-end;gap:7px;margin-top:14px}
.enh-preset-action{
  min-width:72px;height:34px;border:1px solid rgba(255,255,255,.075);border-radius:10px;
  background:rgba(255,255,255,.022);color:#8e98a1;font-size:9.5px;font-weight:820;
}
.enh-preset-action.primary{color:#ddc77f;border-color:rgba(199,170,95,.24);background:rgba(199,170,95,.055)}
.enh-preset-action.danger{color:#d79989;border-color:rgba(205,103,84,.20);background:rgba(205,103,84,.045)}
.enh-preset-action:disabled{opacity:.38}
.enh-preset-slot-list{display:grid;gap:7px}
.enh-preset-slot-card{
  width:100%;min-height:56px;border:1px solid rgba(255,255,255,.065);border-radius:12px;background:rgba(255,255,255,.018);
  padding:9px 11px;display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;color:inherit;
}
.enh-preset-slot-card strong{font-size:10.5px;color:#bdc5cc;font-weight:860}
.enh-preset-slot-card span{font-size:8.5px;color:#66717b;text-align:right;line-height:1.35}
.enh-preset-slot-card.occupied{border-color:rgba(199,170,95,.15);background:rgba(199,170,95,.025)}
.enh-preset-slot-card.occupied strong{color:#d0bd7a}
.enh-preset-warning{
  padding:11px 12px;border:1px solid rgba(211,112,92,.16);border-radius:12px;background:rgba(188,75,58,.045);
  color:#c98c7f;font-size:9.5px;line-height:1.55;font-weight:760;
}
.enh-preset-summary{margin-top:8px;color:#68737d;font-size:8.5px;line-height:1.5}
@media(max-width:360px){
  body.enh-view .context-toolbar{gap:4px!important;padding-left:5px!important;padding-right:5px!important}
  .enh-preset-toolbar{gap:3px}.enh-preset-slot{min-width:39px;padding:0 5px;font-size:8.5px}
  .context-toolbar .tool.undo,.context-toolbar .tool.reset,.enh-preset-save{width:29px!important;min-width:29px!important}
}
@media(prefers-reduced-motion:reduce){.enh-preset-backdrop,.enh-preset-modal{transition-duration:.01ms!important}}


/* v0.61 · calmer Enhance toolbar + direct-touch Mastery controls */
body.enh-view .context-toolbar{
  display:grid!important;
  grid-template-columns:31px minmax(8px,1fr) auto auto auto minmax(8px,1fr) 31px 31px!important;
  align-items:center!important;
  column-gap:8px!important;
  padding-left:9px!important;padding-right:9px!important;
}
body.enh-view .context-toolbar .mode,
body.enh-view .context-toolbar .toolbar-spacer{display:none!important}
body.enh-view .enh-preset-toolbar{display:contents!important}
body.enh-view .enh-preset-save{grid-column:1}
body.enh-view [data-enh-preset-load="A"]{grid-column:3}
body.enh-view [data-enh-preset-load="B"]{grid-column:4}
body.enh-view [data-enh-preset-load="C"]{grid-column:5}
body.enh-view .context-toolbar .undo{grid-column:7}
body.enh-view .context-toolbar .reset{grid-column:8}
.enh-preset-slot{min-width:50px!important;padding:0 8px!important}

.mastery-quickbar{grid-template-columns:1fr 1fr .72fr .92fr!important;gap:6px!important}
.mastery-quick{min-width:0!important;padding:0 5px!important}
.mastery-quick.mastery-off{color:#858f98}
.mastery-quick.mastery-off.is-complete{color:#b9c1c8;border-color:rgba(220,228,235,.16);background:rgba(220,228,235,.04)}
.mastery-model-row{cursor:default!important}
.mastery-node-mobile{
  font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.mastery-node-mobile:active{filter:brightness(1.10)}
@media(max-width:360px){
  body.enh-view .context-toolbar{
    grid-template-columns:29px minmax(3px,1fr) auto auto auto minmax(3px,1fr) 29px 29px!important;
    column-gap:5px!important;padding-left:5px!important;padding-right:5px!important;
  }
  .enh-preset-slot{min-width:41px!important;padding:0 5px!important;font-size:8.5px!important}
  .mastery-quickbar{gap:4px!important}
  .mastery-quick{font-size:8px!important;padding:0 3px!important}
}


/* v0.63 · facility picker automatically follows remaining club budget */
.facility-picker-budget-note{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:0 0 10px;padding:8px 10px;border:1px solid rgba(255,255,255,.065);
  border-radius:12px;background:rgba(255,255,255,.022);color:#7f8994;
  font-size:9px;font-weight:760;line-height:1.2
}
.facility-picker-budget-note strong{color:#cdb97b;font-size:10px;font-weight:850;white-space:nowrap}
.facility-picker-budget-note span{min-width:0;text-align:right}
.facility-picker-budget-empty{
  min-height:128px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;padding:18px 14px;border:1px dashed rgba(255,255,255,.07);border-radius:14px;
  color:#66717b;text-align:center
}
.facility-picker-budget-empty strong{color:#aab3bc;font-size:11px;font-weight:820}
.facility-picker-budget-empty span{font-size:9px;line-height:1.45}


/* v0.64 · AP Tool / AP Calculator mobile first pass */
#apToolsMobilePage[hidden]{display:none!important}
#apToolsMobilePage{
  padding:0 14px 34px;min-height:100vh;color:#cfd6dc;
}
.aptool-page-title{margin:0 -0px}
.aptool-page-title .en:before{content:"AP Calculator"}

.aptool-top-card,.aptool-section{
  border:1px solid rgba(255,255,255,.075);border-radius:18px;
  background:linear-gradient(145deg,rgba(255,255,255,.032),transparent 46%),rgba(15,21,29,.64);
  box-shadow:0 12px 30px rgba(0,0,0,.16);overflow:hidden;
}
.aptool-top-card{position:relative;padding:12px;margin-bottom:10px}
.aptool-stats{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:8px}
.aptool-stat{min-height:49px;padding:9px 10px;border:1px solid rgba(255,255,255,.055);border-radius:12px;background:rgba(255,255,255,.018)}
.aptool-stat span{display:block;color:#6f7a84;font-size:9px;font-weight:780}
.aptool-stat strong{display:block;margin-top:4px;color:#7b8791;font-size:13.5px;font-weight:820;font-variant-numeric:tabular-nums;white-space:nowrap}.aptool-target-stat strong.has-targets{color:#e0c878}
.aptool-badge-summary{min-height:29px;margin-top:4px;display:grid;grid-template-columns:repeat(6,27px);gap:3px;align-items:center;align-content:start;justify-content:start}
.aptool-badge-summary em{grid-column:1/-1;align-self:center;color:#59656f;font-size:9px;font-style:normal;font-weight:740}
.aptool-badge-mini{width:27px;height:27px;display:grid;place-items:center;overflow:visible}
.aptool-badge-mini .psm-badge-shell{--badge-h:24px;--badge-w:24px;--icon-box:14px;width:27px;height:27px;transform:none!important}
@media(max-width:340px){.aptool-badge-summary{grid-template-columns:repeat(5,27px)}}
.aptool-actions{display:grid;grid-template-columns:minmax(0,2.08fr) minmax(0,1fr);gap:8px;margin-top:8px}
.aptool-action{
  min-height:48px;border:1px solid rgba(255,255,255,.075);border-radius:12px;background:rgba(255,255,255,.02);
  color:#aeb7bf;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;line-height:1.05;
}
.aptool-action>span{font-size:11px;font-weight:820;letter-spacing:.01em}
.aptool-action>small{font-size:8px;color:#66727c;font-weight:650}
.aptool-import-action{gap:0;width:108px;max-width:100%}.aptool-import-action>span{font-size:12px;font-weight:840;letter-spacing:.015em}
.aptool-action.primary{color:#dfca82;border-color:rgba(199,170,95,.24);background:rgba(199,170,95,.052)}
.aptool-action.primary>small{color:#8c7c50}
.aptool-action:disabled{opacity:.36}
.aptool-action .sub{font-size:8px;color:#6b7680;font-weight:720}
.aptool-import-wrap{position:relative}
.aptool-import-menu{
  position:absolute;left:0;right:0;top:calc(100% + 7px);z-index:80;padding:6px;border:1px solid rgba(255,255,255,.09);
  border-radius:14px;background:rgba(12,18,24,.985);box-shadow:0 18px 50px rgba(0,0,0,.46);max-height:52vh;overflow:auto;
  opacity:0;transform:translateY(-5px);pointer-events:none;transition:opacity .16s ease,transform .20s cubic-bezier(.22,.78,.24,1)
}
.aptool-import-menu.open{opacity:1;transform:none;pointer-events:auto}
.aptool-import-option{
  width:100%;min-height:45px;padding:6px 8px;border:0;border-radius:10px;background:transparent;color:inherit;
  display:grid;grid-template-columns:31px minmax(0,1fr) auto;gap:8px;align-items:center;text-align:left;
}
.aptool-import-option:active{background:rgba(255,255,255,.035)}
.aptool-import-option img{width:29px;height:29px;object-fit:contain}
.aptool-import-copy{min-width:0}.aptool-import-copy strong{display:block;color:#cbd3d9;font-size:10.5px;font-weight:840}.aptool-import-copy span{display:block;color:#626e78;font-size:8px;margin-top:2px}
.aptool-import-state{font-size:8px;color:#82765a;white-space:nowrap}

.aptool-section{margin-bottom:10px}
.aptool-section-head{min-height:45px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid rgba(255,255,255,.052)}
.aptool-section-head strong{color:#dce2e7;font-size:12px;font-weight:880}.aptool-section-head span{color:#68737d;font-size:8.5px;font-weight:720}
.aptool-groups{padding:8px}
.aptool-group{border:1px solid rgba(255,255,255,.05);border-radius:13px;background:rgba(255,255,255,.012);overflow:hidden;margin-bottom:7px}
.aptool-group:last-child{margin-bottom:0}
.aptool-group-head{
  width:100%;height:40px;padding:0 7px 0 0;background:rgba(255,255,255,.012);color:inherit;
  display:grid;grid-template-columns:minmax(0,1fr) 30px;align-items:center;text-align:left;
}
.aptool-group-toggle{
  min-width:0;height:40px;padding:0 7px 0 10px;border:0;background:transparent;color:inherit;
  display:flex;align-items:center;justify-content:flex-start;gap:9px;text-align:left;
}
.aptool-group-title{display:flex;align-items:baseline;gap:7px}.aptool-group-title strong{font-size:11px;color:#bfc8cf;font-weight:850}.aptool-group-title span{font-size:9.5px;color:#626d77;font-weight:720}.aptool-group-title span.is-set{color:#c7ad62;font-weight:800}
.aptool-group-chev{font-size:14px;color:#817454;transition:transform .24s cubic-bezier(.22,.78,.24,1)}
.aptool-group.open .aptool-group-chev{transform:rotate(180deg)}
.aptool-group-clear{
  width:29px;height:30px;padding:0;border:1px solid rgba(255,255,255,.07);border-radius:8px;background:rgba(255,255,255,.018);
  color:#737f88;display:grid;place-items:center;font-size:15px;font-weight:760;line-height:1;
}
.aptool-group-clear:not(:disabled):active{color:#d08c7e;border-color:rgba(208,140,126,.22);background:rgba(208,140,126,.05)}
.aptool-group-clear:disabled{opacity:.24}
.aptool-group-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s cubic-bezier(.22,.78,.24,1)}
.aptool-group.open .aptool-group-body{grid-template-rows:1fr}
.aptool-group-clip{min-height:0;overflow:hidden}
.aptool-attr-row{
  min-height:47px;padding:7px 9px;border-top:1px solid rgba(255,255,255,.042);
  display:grid;grid-template-columns:minmax(70px,1fr) auto;gap:8px;align-items:center;
}
.aptool-attr-name{min-width:0;display:flex;align-items:center;gap:5px}.aptool-attr-name strong{font-size:12px;color:#aeb8c0;font-weight:520;white-space:nowrap}.aptool-source{height:16px;padding:0 5px;border-radius:999px;border:1px solid rgba(199,170,95,.16);background:rgba(199,170,95,.035);color:#a7925b;font-size:8px;font-weight:820;display:inline-flex;align-items:center}
.aptool-attr-control{display:grid;grid-template-columns:29px 45px 29px 33px 29px;gap:4px;align-items:center}
.aptool-step,.aptool-quick,.aptool-clear{height:30px;border:1px solid rgba(255,255,255,.07);border-radius:8px;background:rgba(255,255,255,.018);color:#89949e;font-size:13px;font-weight:760}
.aptool-quick{font-size:8.5px;color:#9d8c62}
.aptool-clear{font-size:15px;line-height:1;color:#737f88}
.aptool-clear:not(:disabled):active{color:#d08c7e;border-color:rgba(208,140,126,.26);background:rgba(208,140,126,.055)}
.aptool-clear:disabled{opacity:.28}
.aptool-input{width:45px;height:30px;padding:0;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:#0c1218;color:#78848e;text-align:center;font-size:11px;font-weight:850;outline:none;font-variant-numeric:tabular-nums;-moz-appearance:textfield}
.aptool-input.has-value{color:#e2ca81;border-color:rgba(199,170,95,.18);background:rgba(199,170,95,.025)}
.aptool-input::-webkit-inner-spin-button,.aptool-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.aptool-input:focus{border-color:rgba(199,170,95,.36);box-shadow:0 0 0 2px rgba(199,170,95,.055)}

.aptool-ps-toggle{
  width:100%;height:47px;padding:0 12px;border:0;background:transparent;color:inherit;display:grid;grid-template-columns:minmax(0,1fr) 28px auto;align-items:center;gap:8px;text-align:left;
}
.aptool-ps-left{min-width:0;display:flex;align-items:baseline;gap:8px}.aptool-ps-left strong{font-size:12px;color:#dce2e7;font-weight:880}.aptool-ps-left span{font-size:8.5px;color:#6b7680;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.aptool-ps-count{font-size:9px;color:#9c8a5d;font-weight:800;white-space:nowrap}.aptool-ps-chev{width:24px;height:24px;border:1px solid rgba(199,170,95,.11);border-radius:7px;background:rgba(199,170,95,.028);display:grid;place-items:center;font-size:14px;color:#9b895b;transition:transform .24s cubic-bezier(.22,.78,.24,1),background .18s,border-color .18s,color .18s}
.aptool-ps-section.open .aptool-ps-chev{transform:rotate(180deg)}
.aptool-ps-shell{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.22,.78,.24,1)}
.aptool-ps-section.open .aptool-ps-shell{grid-template-rows:1fr}
.aptool-ps-clip{min-height:0;overflow:hidden}.aptool-ps-inner{padding:0 8px 9px}
.aptool-ps-group{padding:8px 0 4px;border-top:1px solid rgba(255,255,255,.04)}
.aptool-ps-group-head{display:flex;align-items:center;justify-content:space-between;padding:0 3px 5px}.aptool-ps-group-head strong{font-size:9.5px;color:#8f9aa4;font-weight:840}.aptool-ps-group-head span{font-size:8px;color:#59646e}
.aptool-ps-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.aptool-ps-btn{
  min-width:0;min-height:59px;padding:4px 2px;border:1px solid rgba(255,255,255,.045);border-radius:10px;background:rgba(255,255,255,.012);color:#77828c;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
}
.aptool-ps-btn.selected{border-color:rgba(199,170,95,.22);background:rgba(199,170,95,.04);color:#cdb978}
.aptool-ps-btn .psm-badge-shell{--badge-h:29px;--badge-w:29px;--icon-box:16.5px;width:34px;height:33px}
.aptool-ps-name{max-width:100%;font-size:8px;font-weight:760;line-height:1.18;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}


.aptool-badge-toast{position:fixed;left:50%;top:118px;z-index:360;max-width:min(360px,calc(100vw - 28px));transform:translate(-50%,-8px) scale(.985);opacity:0;pointer-events:none;padding:8px 11px;border:1px solid rgba(199,170,95,.22);border-radius:11px;background:rgba(14,20,26,.965);box-shadow:0 14px 36px rgba(0,0,0,.34);color:#d9c47d;font-size:10px;font-weight:820;line-height:1.45;text-align:center;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:opacity .14s ease,transform .18s cubic-bezier(.22,.78,.24,1)}
.aptool-badge-toast.show{opacity:1;transform:translate(-50%,0) scale(1)}

/* AP result modal */
.aptool-result-backdrop{position:fixed;inset:0;z-index:310;background:rgba(2,5,8,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .18s ease}
.aptool-result-backdrop.show{opacity:1;pointer-events:auto}
.aptool-result-modal{
  position:fixed;left:50%;top:50%;z-index:320;width:min(410px,calc(100% - 18px));height:min(88vh,720px);
  transform:translate(-50%,-47%) scale(.986);opacity:0;pointer-events:none;overflow:hidden;
  border:1px solid rgba(255,255,255,.11);border-radius:19px;background:linear-gradient(180deg,rgba(18,25,32,.995),rgba(8,13,18,.998));
  box-shadow:0 28px 80px rgba(0,0,0,.58);transition:opacity .18s ease,transform .22s cubic-bezier(.22,.78,.24,1);
  display:flex;flex-direction:column;
}
.aptool-result-modal.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.aptool-result-head{min-height:59px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06)}
.aptool-result-head-copy span{display:block;color:#66727d;font-size:8px;font-weight:850;letter-spacing:.10em}.aptool-result-head-copy strong{display:block;margin-top:3px;color:#e8edf0;font-size:14px;font-weight:900}
.aptool-result-close{width:32px;height:32px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.02);color:#7e8993;font-size:19px}
.aptool-result-meta{min-height:34px;padding:7px 12px;border-bottom:1px solid rgba(255,255,255,.05);color:#6f7a84;font-size:8.5px;line-height:1.45}
.aptool-result-body{min-height:0;flex:1;overflow:auto;padding:8px}
.aptool-result-row{
  width:100%;min-height:50px;margin-bottom:6px;padding:6px 8px;border:1px solid rgba(255,255,255,.05);border-radius:11px;background:rgba(255,255,255,.014);
  display:grid;grid-template-columns:24px 31px minmax(0,1fr) auto;gap:7px;align-items:center;text-align:left;color:inherit;
}
.aptool-result-rank{font-size:8.5px;color:#59646e;font-weight:850}.aptool-result-row img{width:29px;height:29px;object-fit:contain}.aptool-result-copy{min-width:0}.aptool-result-copy strong{display:block;color:#cdd5db;font-size:10.5px;font-weight:850}.aptool-result-copy span{display:block;margin-top:2px;color:#606c76;font-size:8px}.aptool-result-cost{color:#d8c47d;font-size:11.5px;font-weight:900;white-space:nowrap}.aptool-result-row.impossible{opacity:.58}.aptool-result-row.impossible .aptool-result-cost{font-size:8.5px;color:#ad796f}
.aptool-detail-back{height:32px;padding:0 9px;margin-bottom:7px;border:1px solid rgba(255,255,255,.06);border-radius:9px;background:rgba(255,255,255,.018);color:#89949e;font-size:9px;font-weight:780}
.aptool-detail-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 4px 10px;border-bottom:1px solid rgba(255,255,255,.05)}
.aptool-detail-id{display:flex;align-items:center;gap:9px;min-width:0}.aptool-detail-id img{width:36px;height:36px;object-fit:contain}.aptool-detail-id strong{display:block;color:#e4e9ed;font-size:13px;font-weight:900}.aptool-detail-id span{display:block;margin-top:2px;color:#65717b;font-size:8px}.aptool-detail-total{text-align:right}.aptool-detail-total span{display:block;color:#697580;font-size:8px}.aptool-detail-total b{display:block;margin-top:2px;color:#dfca80;font-size:18px;font-weight:900}
.aptool-detail-grid{display:grid;gap:5px;margin-top:8px}.aptool-detail-row{min-height:38px;padding:6px 8px;border:1px solid rgba(255,255,255,.04);border-radius:9px;background:rgba(255,255,255,.01);display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center}.aptool-detail-row>span{font-size:9.5px;color:#aeb7be}.aptool-detail-row>em{font-size:8.5px;color:#6d7882;font-style:normal}.aptool-detail-row>b{font-size:9.5px;color:#cdb978;white-space:nowrap}
.aptool-impossible{padding:11px;margin-top:9px;border:1px solid rgba(202,104,88,.16);border-radius:11px;background:rgba(185,76,59,.045);color:#c58b80;font-size:9.5px;line-height:1.55}
.aptool-apply{width:100%;height:42px;margin-top:10px;border:1px solid rgba(199,170,95,.26);border-radius:11px;background:rgba(199,170,95,.06);color:#e0ca83;font-size:10.5px;font-weight:900}

body.aptool-view .context-toolbar .mode,body.aptool-view .enh-preset-toolbar{display:none!important}
body.aptool-view .context-toolbar{gap:8px!important;padding-left:10px!important;padding-right:10px!important}
body.aptool-view .context-toolbar .toolbar-spacer{display:block!important;flex:1 1 auto!important}
body.aptool-view .context-toolbar .undo,body.aptool-view .context-toolbar .reset{display:grid!important}
@media(max-width:360px){
  #apToolsMobilePage{padding-left:10px;padding-right:10px}.aptool-attr-row{grid-template-columns:minmax(58px,1fr) auto;padding-left:7px;padding-right:7px}.aptool-attr-control{grid-template-columns:26px 39px 26px 30px 26px;gap:3px}.aptool-input{width:39px}.aptool-ps-grid{gap:4px}.aptool-ps-name{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.aptool-group-body,.aptool-ps-shell,.aptool-import-menu,.aptool-result-modal,.aptool-result-backdrop{transition-duration:.01ms!important}}


/* v0.66 · AP Tool import/apply reliability + local feedback */
.aptool-badge-toast{
  left:var(--ap-toast-x,50%)!important;top:var(--ap-toast-y,118px)!important;
  transform:translate(-50%,calc(-100% - 5px)) scale(.985)!important;
}
.aptool-badge-toast.show{transform:translate(-50%,calc(-100% - 9px)) scale(1)!important}

.aptool-import-backdrop{
  position:fixed;inset:0;z-index:330;background:rgba(2,5,8,.58);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;pointer-events:none;
  transition:opacity .18s ease;
}
.aptool-import-backdrop.show{opacity:1;pointer-events:auto}
.aptool-import-modal{
  position:fixed;left:50%;top:50%;z-index:340;width:min(404px,calc(100% - 20px));max-height:min(78vh,620px);
  transform:translate(-50%,-47%) scale(.986);opacity:0;pointer-events:none;overflow:hidden;
  border:1px solid rgba(255,255,255,.11);border-radius:18px;
  background:linear-gradient(180deg,rgba(18,25,32,.995),rgba(8,13,18,.998));
  box-shadow:0 28px 80px rgba(0,0,0,.56);transition:opacity .18s ease,transform .22s cubic-bezier(.22,.78,.24,1);
  display:flex;flex-direction:column;
}
.aptool-import-modal.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.aptool-import-modal-head{min-height:58px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06)}
.aptool-import-modal-head span{display:block;color:#66727d;font-size:8px;font-weight:850;letter-spacing:.10em}
.aptool-import-modal-head strong{display:block;margin-top:3px;color:#e8edf0;font-size:14px;font-weight:900}
.aptool-import-close{width:32px;height:32px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.02);color:#7e8993;font-size:19px}
.aptool-import-note{padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.05);color:#68737e;font-size:9px;line-height:1.45}
.aptool-import-list{min-height:0;overflow:auto;padding:7px}
.aptool-import-list .aptool-import-option{min-height:49px;border-bottom:1px solid rgba(255,255,255,.035);border-radius:10px}
.aptool-import-list .aptool-import-option:last-child{border-bottom:0}
.aptool-import-list .aptool-import-copy strong{font-size:11px}
.aptool-import-list .aptool-import-copy span,.aptool-import-list .aptool-import-state{font-size:8.5px}
.aptool-import-menu{display:none!important}

.aptool-result-modal{position:fixed}
.aptool-apply-feedback{
  position:absolute;left:50%;bottom:72px;z-index:5;max-width:calc(100% - 28px);
  transform:translate(-50%,8px) scale(.985);opacity:0;pointer-events:none;
  padding:8px 11px;border:1px solid rgba(216,184,95,.24);border-radius:11px;
  background:rgba(14,20,26,.975);box-shadow:0 14px 36px rgba(0,0,0,.38);
  color:#dec985;font-size:10px;font-weight:820;line-height:1.45;text-align:center;
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  transition:opacity .14s ease,transform .18s cubic-bezier(.22,.78,.24,1)
}
.aptool-apply-feedback.loss{color:#e3a18f;border-color:rgba(224,130,109,.28)}
.aptool-apply-feedback.show{opacity:1;transform:translate(-50%,0) scale(1)}
@media(prefers-reduced-motion:reduce){.aptool-import-backdrop,.aptool-import-modal,.aptool-apply-feedback{transition-duration:.01ms!important}}

/* v0.67 · transient notices live just above the user's tap point. */
.aptool-pointer-toast{
  position:fixed;z-index:520;max-width:min(330px,calc(100vw - 24px));
  opacity:0;pointer-events:none;visibility:hidden;
  padding:10px 13px;border:1px solid rgba(199,170,95,.24);border-radius:12px;
  background:rgba(13,19,25,.975);box-shadow:0 16px 38px rgba(0,0,0,.42);
  color:#dfcb87;font-size:11.5px;font-weight:840;line-height:1.48;text-align:center;
  -webkit-backdrop-filter:blur(13px);backdrop-filter:blur(13px);
  transform:translate(-50%,-100%) translateY(-5px) scale(.985);
  transition:opacity .14s ease,transform .18s cubic-bezier(.22,.78,.24,1)
}
.aptool-pointer-toast.show{opacity:1;visibility:visible;transform:translate(-50%,-100%) translateY(-10px) scale(1)}
.aptool-pointer-toast.loss{color:#f0aa98;border-color:rgba(224,130,109,.34);background:rgba(30,17,17,.975)}
.aptool-pointer-toast.gain{color:#dfe7b0;border-color:rgba(159,190,111,.30);background:rgba(16,25,19,.975)}
.aptool-pointer-toast.info{color:#dfcb87}
.aptool-apply-feedback{display:none!important}
@media(prefers-reduced-motion:reduce){.aptool-pointer-toast{transition-duration:.01ms!important}}


/* v0.71 · expandable-module chevrons stay near the module label / visual center, not the screen edge. */
.aptool-group-toggle .aptool-group-chev{flex:0 0 auto}
.aptool-ps-toggle:active .aptool-ps-chev{background:rgba(199,170,95,.07);border-color:rgba(199,170,95,.20);color:#cfb66d}
@media(max-width:350px){
  .aptool-ps-toggle{grid-template-columns:minmax(0,1fr) 26px auto;gap:5px;padding-left:10px;padding-right:10px}
  .aptool-ps-left{gap:6px}
}


/* v0.72 · AP Tool mobile typography pass: 9.5px minimum + stronger hierarchy. */
#apToolsMobilePage .aptool-stat>span{font-size:10px!important}
#apToolsMobilePage .aptool-target-stat>strong{font-size:14px!important}
#apToolsMobilePage .aptool-badge-summary em{font-size:10px!important}

#apToolsMobilePage .aptool-action>span{font-size:14px!important}
#apToolsMobilePage .aptool-import-action>span{font-size:14px!important}
#apToolsMobilePage .aptool-action>small{font-size:9.5px!important}
#apToolsMobilePage .aptool-action .sub{font-size:9.5px!important}

#apToolsMobilePage .aptool-section-head strong{font-size:12.5px!important}
#apToolsMobilePage .aptool-section-head span{font-size:10px!important}
#apToolsMobilePage .aptool-group-title strong{font-size:12.5px!important}
#apToolsMobilePage .aptool-group-title span{font-size:9.5px!important}
#apToolsMobilePage .aptool-attr-name strong{font-size:12.5px!important}
#apToolsMobilePage .aptool-source{font-size:10.5px!important}
#apToolsMobilePage .aptool-quick{font-size:10.5px!important}
#apToolsMobilePage .aptool-input{font-size:11.5px!important}

#apToolsMobilePage .aptool-ps-left strong{font-size:12.5px!important}
#apToolsMobilePage .aptool-ps-left span{font-size:10px!important}
#apToolsMobilePage .aptool-ps-count{font-size:10px!important}
#apToolsMobilePage .aptool-ps-group-head{justify-content:flex-start!important}
#apToolsMobilePage .aptool-ps-group-head strong{font-size:10px!important}
#apToolsMobilePage .aptool-ps-btn{min-height:48px!important;padding:4px 2px!important;gap:0!important}
#apToolsMobilePage .aptool-ps-name,#apToolsMobilePage .aptool-ps-group-head span{display:none!important}

.aptool-import-modal-head span{font-size:9.5px!important}
.aptool-import-modal-head strong{font-size:14px!important}
.aptool-import-note{font-size:10px!important}
.aptool-import-list .aptool-import-copy strong{font-size:12.5px!important}
.aptool-import-list .aptool-import-copy span,.aptool-import-list .aptool-import-state{font-size:9.5px!important}
.aptool-import-copy span,.aptool-import-state{font-size:9.5px!important}

.aptool-result-head-copy span{font-size:9.5px!important}
.aptool-result-head-copy strong{font-size:15px!important}
.aptool-result-meta{font-size:10px!important}
.aptool-result-rank{font-size:10px!important}
.aptool-result-copy strong{font-size:12.5px!important}
.aptool-result-copy span{font-size:9.5px!important}
.aptool-result-cost{font-size:12px!important}
.aptool-result-row.impossible .aptool-result-cost{font-size:9.5px!important}
.aptool-detail-back{font-size:9.5px!important}
.aptool-detail-id strong{font-size:13.5px!important}
.aptool-detail-id span{font-size:9.5px!important}
.aptool-detail-total span{font-size:9.5px!important}
.aptool-detail-total b{font-size:19px!important}
.aptool-detail-row>span{font-size:10px!important}
.aptool-detail-row>em{font-size:9.5px!important}
.aptool-detail-row>b{font-size:10px!important}
.aptool-impossible{font-size:10px!important}
.aptool-apply{font-size:11.5px!important}


/* v0.73 · AP result detail readability pass. Keep hierarchy simple and phone-friendly. */
.aptool-detail-back{font-size:10.5px!important}
.aptool-detail-id strong{font-size:15px!important}
.aptool-detail-id span{font-size:10.5px!important}
.aptool-detail-total span{font-size:10.5px!important}
.aptool-detail-total b{font-size:22px!important}
.aptool-detail-grid{gap:7px!important;margin-top:10px!important}
.aptool-detail-row{min-height:44px!important;padding:7px 9px!important;gap:10px!important}
.aptool-detail-row>span{font-size:12px!important;font-weight:500!important}
.aptool-detail-row>span small{font-size:10px!important;font-weight:500!important}
.aptool-detail-row>em{font-size:11.5px!important}
.aptool-detail-row>b{font-size:12px!important}
.aptool-impossible{font-size:10px!important}
.aptool-apply{height:46px!important;margin-top:12px!important;font-size:13.5px!important}


/* =========================================================
   v0.74 · BUILD page mobile readability pass
   Scope: 建模页 only. Other primary pages remain untouched.
   Working rule: weak text >= 9.5px; normal working text ~12–13px.
   ========================================================= */

/* Sticky build context */
#scroll .mobile-context-selector .level{
  font-size:14.5px!important;
}
#scroll .archcn{
  font-size:14.5px!important;
}
#scroll .archen{
  font-size:10px!important;
}
#scroll .apline span{
  font-size:10.5px!important;
}

/* Archetype dropdown */
#scroll .groupcap{
  font-size:10px!important;
  padding-top:8px!important;
  padding-bottom:6px!important;
}
#scroll .opt{
  height:44px!important;
}
#scroll .opt .z{
  font-size:12.5px!important;
}
#scroll .opt .e{
  font-size:9.5px!important;
}

/* Skill moves / weak foot + body controls */
#scroll .row.quick{
  min-height:48px!important;
}
#scroll .qlabel{
  font-size:12.5px!important;
}
#scroll .stars{
  font-size:17px!important;
}
#scroll .bodyrow{
  min-height:48px!important;
}
#scroll .bodymetric .label,
#scroll .bodymetric .value{
  font-size:12.5px!important;
}
#scroll .seg{
  height:27px!important;
}
#scroll .seg button{
  width:27px!important;
  height:25px!important;
  font-size:10.5px!important;
}
#scroll .accel{
  height:27px!important;
  font-size:10.5px!important;
  padding-left:9px!important;
  padding-right:9px!important;
}

/* Expanded body editor */
#scroll .axis{
  font-size:10px!important;
}
#scroll .bonus span{
  font-size:12px!important;
}
#scroll .bonus b{
  font-size:12.5px!important;
}

/* Attribute categories */
#scroll .cat+.cat{
  margin-top:15px!important;
}
#scroll .cathead{
  height:38px!important;
  padding-left:12px!important;
  padding-right:11px!important;
}
#scroll .catname{
  font-size:13.5px!important;
}
#scroll .catcount{
  height:19px!important;
  min-width:19px!important;
  font-size:10px!important;
}
#scroll .catbody{
  padding-top:11px!important;
}
#scroll .attr{
  margin-bottom:14px!important;
}
#scroll .atop{
  margin-bottom:7px!important;
}
#scroll .aname{
  font-size:12.5px!important;
  font-weight:500!important;
}
#scroll .aval{
  font-size:14.5px!important;
}
#scroll .overflow{
  font-size:10px!important;
}
#scroll .slider{
  height:18px!important;
}
#scroll .pop{
  top:-38px!important;
  min-width:84px!important;
  padding:5px 8px!important;
  font-size:10.5px!important;
}

/* Build-only context toolbar text. Keep other pages untouched. */
body:not(.psm-view):not(.enh-view):not(.aptool-view) .context-toolbar .mode button{
  font-size:11.5px!important;
}

/* When the 6+1 attribute categories are all collapsed, keep the stack compact.
   Expanded sections retain the more relaxed spacing from v0.74. */
#scroll .cat.collapsed + .cat.collapsed{
  margin-top:7px!important;
}


/* v0.76 · Body units: keep the numeric value primary and the unit readable but secondary. */
#scroll .bodymetric .value{
  display:inline-flex!important;
  align-items:baseline!important;
  gap:3px!important;
}
#scroll .bodymetric .value .body-number{
  font-size:inherit!important;
  font-weight:inherit!important;
  line-height:1!important;
}
#scroll .bodymetric .value .body-unit{
  font-size:9.5px!important;
  font-weight:700!important;
  line-height:1!important;
  color:#7f8991!important;
  letter-spacing:.01em!important;
}


/* v0.77 · Build page polish
   1) Align 身高 / 体重 labels, values and units to one optical baseline.
   2) Remove static category-size badges such as 控球 6 / 速度 2. */
#scroll .bodymetric{
  height:30px!important;
  align-items:baseline!important;
}
#scroll .bodymetric .label,
#scroll .bodymetric .value{
  height:auto!important;
  min-height:0!important;
  line-height:1!important;
  align-items:baseline!important;
}
#scroll .bodymetric .value{
  gap:4px!important;
}
#scroll .bodymetric .value .body-number,
#scroll .bodymetric .value .body-unit{
  line-height:1!important;
  vertical-align:baseline!important;
}
#scroll .catcount{display:none!important}


/* v0.78 · The body expand chevron is an independent centered affordance.
   It no longer participates in the 身高 / 体重 inline layout, so larger phone
   typography cannot push it around or disturb the metrics' baseline. */
#scroll .bodyrow{
  position:relative!important;
}
#scroll .body-inline-arrow{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-50%)!important;
  margin:0!important;
  z-index:3!important;
  pointer-events:none!important;
}


/* v0.79 · Optical vertical centering for the compact body row.
   The larger mobile typography reads slightly high inside the 48px row,
   so bias the content down by ~3px without changing the row height. */
#scroll .bodyrow{
  padding-top:6px!important;
  padding-bottom:0!important;
}
#scroll .body-inline-arrow{
  top:calc(50% + 3px)!important;
}


/* v0.80 · Fix only the left 身高 / 体重 cluster.
   v0.77 put the metric box on baseline alignment while leaving it 30px tall,
   which made the glyphs sit visually high inside that box. v0.79 then shifted
   the whole row, incorrectly moving the already-correct right-side controls.
   Restore the row itself, and vertically center only the metric clusters. */
#scroll .bodyrow{
  padding-top:0!important;
  padding-bottom:0!important;
}
#scroll .bodymetric{
  height:27px!important;
  display:inline-flex!important;
  align-items:center!important;
}
#scroll .bodymetric .label{
  display:inline-block!important;
  height:auto!important;
  min-height:0!important;
  line-height:1!important;
  align-self:center!important;
}
#scroll .bodymetric .value{
  display:inline-flex!important;
  height:auto!important;
  min-height:0!important;
  line-height:1!important;
  align-self:center!important;
  align-items:baseline!important;
}
#scroll .body-inline-arrow{
  top:50%!important;
}


/* v0.81 · iOS Safari accordion tap seam fix.
   The old press feedback scaled the full-width category button to .995.
   On iPhone Safari that temporary transform is rasterized in compositor tiles,
   producing 1px bright seams near 25% / 75% width for a frame during collapse.
   Keep press feedback color-only; never transform the category header. */
#scroll .cathead{
  transform:none!important;
  -webkit-transform:none!important;
  will-change:auto!important;
  transition:background 150ms ease,border-color 150ms ease!important;
}
#scroll .cathead:active{
  transform:none!important;
  -webkit-transform:none!important;
  background:rgba(255,255,255,.026)!important;
}


/* v0.82 · Keep document scrolling but suppress accidental double-tap page zoom.
   `manipulation` still permits normal one-finger scrolling. */
html,body{touch-action:manipulation!important}


/* v0.83 · Enhance page mobile typography pass
   Readability rule: visible helper text should not fall below 9.5px.
   Preserve structure/logic; only lift hierarchy and readability. */

/* Mastery summary + expanded list */
#enhanceMobilePage .mastery-titleline strong{font-size:13.5px!important}
#enhanceMobilePage .mastery-titleline>span:not(.mastery-expand-btn){font-size:9.5px!important}
#enhanceMobilePage .mastery-count{font-size:10.5px!important}
#enhanceMobilePage .mastery-quick{font-size:10.5px!important}
#enhanceMobilePage .mastery-group-cap{font-size:9.5px!important}
#enhanceMobilePage .mastery-model-id strong{font-size:11.5px!important}
#enhanceMobilePage .mastery-node-mobile b{font-size:10px!important}
#enhanceMobilePage .mastery-node-mobile span{font-size:9.5px!important}

/* Mastery aggregate modal */
.mastery-aggregate-head-copy strong{font-size:13px!important}
.mastery-aggregate-head-copy span{font-size:9.5px!important}
.mastery-agg-chip{font-size:10px!important}
.mastery-agg-chip b{font-size:11px!important}
.mastery-aggregate-empty{font-size:10px!important}

/* Facilities main page */
#enhanceMobilePage .facility-mobile-head strong{font-size:14px!important}
#enhanceMobilePage .facility-mobile-head span{font-size:9.5px!important}
#enhanceMobilePage .facility-level-button{font-size:12px!important}
#enhanceMobilePage .facility-level-menu button{font-size:10.5px!important}
#enhanceMobilePage .facility-level-menu button span:last-child{font-size:9.5px!important}
#enhanceMobilePage .facility-budget-head span{font-size:10px!important}
#enhanceMobilePage .facility-budget-head strong{font-size:12px!important}
#enhanceMobilePage .facility-overbudget-note{font-size:10px!important}
#enhanceMobilePage .facility-summary-top strong{font-size:10.5px!important}
#enhanceMobilePage .facility-paused-pill{font-size:9.5px!important}
#enhanceMobilePage .facility-attr-chip{font-size:10px!important}
#enhanceMobilePage .facility-attr-chip b{font-size:10.5px!important}
#enhanceMobilePage .facility-summary-empty{font-size:10px!important}
#enhanceMobilePage .facility-ps-title{font-size:10px!important}
#enhanceMobilePage .facility-ps-item span{font-size:9.5px!important}
#enhanceMobilePage .facility-card-level{font-size:10px!important}
#enhanceMobilePage .facility-card-mobile h4{font-size:13px!important}
#enhanceMobilePage .facility-card-boosts span{font-size:10.5px!important}
#enhanceMobilePage .facility-card-boosts b{font-size:11px!important}
#enhanceMobilePage .facility-card-cost{font-size:11px!important}
#enhanceMobilePage .facility-add-mobile strong{font-size:12px!important}
#enhanceMobilePage .facility-add-mobile small{font-size:9.5px!important}

/* Facility picker */
.facility-picker-head strong{font-size:13px!important}
.facility-picker-tile strong{font-size:11.5px!important}
.facility-picker-summary,
.facility-picker-summary-line{font-size:10.5px!important}
.facility-detail-title strong{font-size:13.5px!important}
.facility-detail-title span{font-size:10.5px!important}
.facility-level-option strong{font-size:11.5px!important}
.facility-level-option .lvboost{font-size:10.5px!important}
.facility-level-option .lvcost{font-size:10.5px!important}
.facility-level-option .lvreward{font-size:10px!important}
.facility-picker-back{font-size:10.5px!important}
.facility-picker-budget-note{font-size:10px!important}
.facility-picker-budget-note strong{font-size:11px!important}
.facility-picker-budget-empty strong{font-size:12px!important}
.facility-picker-budget-empty span{font-size:10px!important}

/* Enhance preset toolbar + modal */
body.enh-view .enh-preset-slot{font-size:10px!important}
.enh-preset-head strong{font-size:14px!important}
.enh-preset-head span{font-size:10px!important}
.enh-preset-scope strong{font-size:12px!important}
.enh-preset-scope span{font-size:10px!important}
.enh-preset-action{font-size:11px!important}
.enh-preset-slot-card strong{font-size:11.5px!important}
.enh-preset-slot-card span{font-size:9.5px!important}
.enh-preset-warning{font-size:10px!important}
.enh-preset-summary{font-size:9.5px!important}

/* Do not let narrow-phone legacy overrides shrink Enhance text again. */
@media(max-width:360px){
  #enhanceMobilePage .mastery-quick{font-size:9.5px!important}
  #enhanceMobilePage .mastery-node-mobile b{font-size:9.5px!important}
  #enhanceMobilePage .mastery-node-mobile span{font-size:9.5px!important}
  body.enh-view .enh-preset-slot{font-size:9.5px!important}
}


/* v0.84 · give Club Lv selector more breathing room after typography increase */
#enhanceMobilePage .facility-budget-wrap{
  grid-template-columns:146px minmax(0,1fr)!important;
}
#enhanceMobilePage .facility-level-button{
  white-space:nowrap;
}
#enhanceMobilePage #facilityClubLevelValueMobile{
  white-space:nowrap;
}
@media(max-width:360px){
  #enhanceMobilePage .facility-budget-wrap{
    grid-template-columns:138px minmax(0,1fr)!important;
  }
}


/* v0.85 · PlayStyles page mobile typography pass
   9.5px is the practical floor; primary labels/buttons scale up with it. */
body.psm-view .psm-headline{font-size:10.5px!important}
body.psm-view .psm-headline strong{font-size:11.5px!important}

body.psm-view .psm-loadout-kicker{font-size:9.5px!important}
body.psm-view .psm-badge.empty .psm-lock-level{font-size:9.5px!important}
body.psm-view .psm-amp-label{font-size:9.5px!important}
body.psm-view .psm-source-check{font-size:10.5px!important}
body.psm-view .psm-loadout-empty-note{font-size:9.5px!important}

body.psm-view .psm-category-head strong{font-size:12.5px!important}
body.psm-view .psm-category-head span{font-size:9.5px!important}

body.psm-view .psm-detail-id strong{font-size:11.5px!important}
body.psm-view .psm-detail-id span{font-size:9.5px!important}
body.psm-view .psm-req{font-size:10.5px!important}
body.psm-view .psm-req b{font-size:11.5px!important}
body.psm-view .psm-req b em{font-size:9.5px!important}
body.psm-view .psm-status{font-size:10px!important}
body.psm-view .psm-main-action{font-size:11px!important}
body.psm-view .psm-source-note{font-size:9.5px!important}
body.psm-view .psm-build-feedback{font-size:10.5px!important}

body.psm-view .psm-amp-picker-title strong{font-size:11px!important}
body.psm-view .psm-amp-picker-title span{font-size:9.5px!important}
body.psm-view .psm-amp-tier button{font-size:10px!important;min-width:54px!important;padding:0 7px!important}

body.psm-view .psm-spec-static-head span,
body.psm-view .psm-spec-summary-kicker{font-size:9.5px!important}
body.psm-view .psm-spec-static-head strong,
body.psm-view .psm-spec-summary-main strong{font-size:14px!important}
body.psm-view .psm-spec-summary-main span,
body.psm-view .psm-spec-summary-reward small{font-size:9.5px!important}

body.psm-view .psm-spec-player{font-size:9.5px!important}
body.psm-view .psm-spec-card-copy strong{font-size:12.5px!important}
body.psm-view .psm-spec-card-copy span{font-size:9.5px!important}
body.psm-view .psm-spec-status{font-size:9.5px!important}

body.psm-view .psm-spec-detail-title strong{font-size:13.5px!important}
body.psm-view .psm-spec-detail-title span{font-size:9.5px!important}
body.psm-view .psm-spec-detail-state{font-size:9.5px!important}
body.psm-view .psm-spec-req span{font-size:11.5px!important}
body.psm-view .psm-spec-req strong{font-size:13px!important}
body.psm-view .psm-spec-req strong em{font-size:10.5px!important}
body.psm-view .psm-spec-reward label{font-size:9.5px!important}
body.psm-view .psm-spec-reward strong{font-size:11px!important}
body.psm-view .psm-spec-base-note{font-size:9.5px!important}
body.psm-view .psm-spec-action{font-size:11.5px!important}
body.psm-view .psm-spec-base-perks-label{font-size:9.5px!important}
body.psm-view .psm-spec-perk-row strong{font-size:11px!important}
body.psm-view .psm-spec-perk-row span{font-size:9.5px!important}

body.psm-view .psm-signature-mark{font-size:9.5px!important}
body.psm-view .psm-signature-picker-title strong{font-size:11px!important}
body.psm-view .psm-signature-picker-title span{font-size:9.5px!important}
body.psm-view .psm-signature-choice-copy small{font-size:9.5px!important}
body.psm-view .psm-signature-choice-copy strong{font-size:11px!important}
body.psm-view .psm-signature-choice-copy span{font-size:9.5px!important}
body.psm-view .psm-signature-check{font-size:10px!important}

body.psm-view .context-toolbar .undo,
body.psm-view .context-toolbar .reset{font-size:11.5px!important}


/* v0.88 · My page: balanced info header + transient editable pickers */
body.my-view .context-toolbar{display:none!important}
body.my-view .app{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))!important}
.my-page{min-height:100vh;padding:0 12px calc(94px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,rgba(10,15,20,.985),#080c10 72%)}
.my-page-title{height:62px;display:flex;align-items:center;gap:10px;padding:4px 2px 0;white-space:nowrap}
.my-page-title .cn{font-size:18px;font-weight:850;letter-spacing:.01em}.my-page-title .en{margin-top:3px;font-size:15.5px;line-height:1;font-style:italic;font-weight:720;color:rgba(208,178,95,.72);text-shadow:0 0 13px rgba(199,170,96,.11)}
.my-overview-section{margin-top:1px}.my-section-cap{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:0 2px 8px}.my-section-cap>div>small{display:block;font-size:9.5px;font-weight:800;letter-spacing:.11em;color:#68747e}.my-section-cap>div>strong{display:block;margin-top:2px;font-size:14px;color:#dfe4e8;font-weight:850}.my-section-cap>span{font-size:9.5px;color:#69747d;font-weight:700}
.my-overview-card{position:relative;overflow:hidden;border:1px solid rgba(199,170,96,.17);border-radius:18px;background:linear-gradient(155deg,rgba(199,170,96,.065),rgba(18,25,31,.98) 27%,rgba(10,15,20,.99) 72%);box-shadow:0 16px 40px rgba(0,0,0,.23)}
.my-overview-card:before{content:"";position:absolute;inset:0;background:radial-gradient(120% 48% at 82% 0%,rgba(81,112,139,.12),transparent 58%),linear-gradient(118deg,transparent 0 42%,rgba(255,255,255,.018) 42.2% 42.7%,transparent 43% 100%);pointer-events:none}
.myov-info,.myov-attrs{position:relative;z-index:1}.myov-info{padding:14px 13px 10px}.myov-header-grid{display:grid;grid-template-columns:minmax(0,1fr) 124px;gap:12px;align-items:start}.myov-identity{min-width:0;padding-top:1px}.myov-title-line{display:flex;align-items:center;min-width:0;gap:6px}.myov-level{font-size:12px;color:#d5bd7a;font-weight:850;white-space:nowrap}.myov-dot{font-size:10px;color:#59636b}.myov-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;line-height:1.15;color:#eef1f3;font-weight:860}.myov-edit{margin-left:1px;flex:0 0 auto;width:27px;height:27px;display:grid;place-items:center;border:0;background:transparent;color:#75818b;border-radius:8px}.myov-edit:active{background:rgba(255,255,255,.04)}.myov-edit svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.myov-archetype{display:flex;align-items:center;gap:7px;margin-top:7px;min-width:0}.myov-logo{width:26px;height:26px;object-fit:contain;filter:drop-shadow(0 4px 7px rgba(0,0,0,.25))}.myov-archcopy{min-width:0}.myov-archcopy strong{display:block;font-size:11.5px;line-height:1.1;color:#bfc7cd;font-weight:820;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.myov-archcopy span{display:block;margin-top:2px;font-size:9.5px;line-height:1;color:#65717b;font-weight:690;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.myov-pickers{display:grid;gap:4px;align-self:stretch;padding-top:1px}.myov-select-wrap{position:relative;display:flex;align-items:center;justify-content:space-between;gap:7px;min-height:28px;padding:0 16px 0 7px;border:1px solid transparent;border-radius:8px;transition:background .14s ease,border-color .14s ease}.myov-select-label{flex:0 0 auto;font-size:9.5px;color:#67727b;font-weight:730;pointer-events:none}.myov-select{appearance:none;-webkit-appearance:none;min-width:0;width:auto;max-width:82px;height:26px;padding:0;border:0;background:transparent;color:#dce1e4;font-size:11.5px;font-weight:780;outline:none;text-align:right;text-align-last:right}.myov-select-wrap:not(.readonly):after{content:"⌄";position:absolute;right:3px;top:50%;transform:translateY(-51%);font-size:10px;color:#77828b;pointer-events:none}.myov-select-wrap:not(.readonly):focus-within{border-color:rgba(199,170,96,.28);background:rgba(199,170,96,.055)}.myov-select-wrap.readonly{padding-right:7px}.myov-select-wrap.readonly .myov-select{font-weight:680;color:#c8cfd4}.myov-select-wrap.readonly:after{display:none}
.myov-readonly{margin-top:9px;padding-top:8px;border-top:1px solid rgba(255,255,255,.045)}.myov-readline{display:flex;align-items:center;flex-wrap:wrap;min-height:22px;gap:5px;font-size:10.5px;color:#aab2b8;font-weight:730}.myov-readline+.myov-readline{margin-top:1px}.myov-readline i{font-style:normal;color:#505a62}.myov-readline .muted{color:#69747c;font-size:9.5px}.myov-stars{letter-spacing:-.03em;color:#cbb36e;font-size:10.5px;white-space:nowrap}
.myov-ps{display:flex;align-items:flex-start;gap:9px;margin-top:7px;min-height:25px}.myov-ps-group{display:flex;align-items:center;gap:4px;min-width:0}.myov-ps-group label{flex:0 0 auto;font-size:9.5px;color:#65717a;font-weight:820}.myov-ps-icons{display:flex;align-items:center;gap:3px;flex-wrap:wrap}.myov-ps-badge{width:20px;height:20px;display:grid;place-items:center;border-radius:6px;border:1px solid rgba(255,255,255,.065);background:rgba(255,255,255,.025);overflow:hidden}.myov-ps-badge.plus{border-color:rgba(213,182,102,.23);background:rgba(213,182,102,.075)}.myov-ps-badge img{width:18px;height:18px;object-fit:contain}.myov-ps-empty{font-size:9.5px;color:#56616a}
.myov-divider{height:1px;margin:0 13px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.085) 8%,rgba(255,255,255,.085) 92%,transparent)}
.myov-attrs{padding:10px 9px 12px;background:rgba(4,8,11,.20)}.myov-attrs-head{display:flex;align-items:center;justify-content:space-between;padding:0 3px 7px}.myov-attrs-head strong{font-size:11px;color:#aeb7bd;font-weight:830}.myov-attrs-head span{font-size:9.5px;color:#616c75;font-weight:720}.myov-attr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.myov-attr-col{min-width:0;padding:7px 7px 8px;border:1px solid rgba(255,255,255,.045);border-radius:10px;background:rgba(7,11,15,.30)}.myov-group+.myov-group{margin-top:8px}.myov-group h4{margin:0 0 4px;padding-bottom:3px;border-bottom:1px solid rgba(255,255,255,.045);font-size:10.5px;color:#b6a36e;font-weight:850}.myov-attr-row{display:flex;align-items:center;justify-content:space-between;gap:3px;min-height:19px}.myov-attr-row span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9.5px;color:#87919a;font-weight:500}.myov-attr-row b{flex:0 0 auto;font-size:12.5px;line-height:1;color:#dfe4e7;font-weight:560;font-variant-numeric:tabular-nums}
.my-overview-actions{display:grid;grid-template-columns:.8fr 1.25fr;gap:8px;margin-top:9px}.my-action{height:42px;border-radius:11px;border:1px solid rgba(255,255,255,.075);background:rgba(255,255,255,.026);color:#cbd2d7;font-size:12px;font-weight:820}.my-action.primary{border-color:rgba(199,170,96,.28);background:linear-gradient(180deg,rgba(199,170,96,.15),rgba(199,170,96,.075));color:#ead69e}.my-action:disabled{opacity:.42}
.my-library{margin-top:23px}.my-library-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:0 2px 9px}.my-library-title strong{display:block;font-size:14px;font-weight:850;color:#e5e9ec}.my-library-title span{display:block;margin-top:3px;font-size:9.5px;color:#727d86;font-weight:720}.my-sort{height:32px;padding:0 10px;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.022);color:#8f99a1;font-size:10px;font-weight:760;white-space:nowrap}.my-build-list{display:grid;gap:8px}.my-build-card{width:100%;min-height:80px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.028),rgba(255,255,255,.012));display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 11px;text-align:left;color:inherit}.my-build-card:active{background:rgba(255,255,255,.045)}.my-build-logo{width:36px;height:36px;object-fit:contain}.my-build-copy{min-width:0}.my-build-copy strong{display:block;font-size:12.5px;font-weight:830;color:#e0e5e8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.my-build-copy span{display:block;margin-top:3px;font-size:9.5px;color:#6f7a83;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.my-build-meta{margin-top:5px!important;color:#9ba4aa!important;font-size:10px!important;font-weight:700}.my-build-chevron{font-size:18px;color:#5f6972;padding-left:2px}.my-empty{padding:34px 18px;border:1px dashed rgba(255,255,255,.08);border-radius:14px;text-align:center;color:#65717a;background:rgba(255,255,255,.012)}.my-empty strong{display:block;font-size:12px;color:#9aa4ab;margin-bottom:5px}.my-empty span{font-size:9.5px;line-height:1.5}
.my-overlay{position:fixed;z-index:150;inset:0;background:rgba(0,0,0,.50);opacity:0;pointer-events:none;transition:opacity .18s ease}.my-overlay.show{opacity:1;pointer-events:auto}.my-sheet{position:fixed;z-index:151;left:50%;bottom:0;width:min(430px,100%);max-height:min(91vh,820px);transform:translate(-50%,105%);transition:transform .28s cubic-bezier(.22,.78,.24,1);border:1px solid rgba(255,255,255,.09);border-bottom:0;border-radius:22px 22px 0 0;background:linear-gradient(180deg,#11171d,#0b1015 68%);box-shadow:0 -18px 46px rgba(0,0,0,.38);overflow:auto;padding:15px 14px calc(18px + env(safe-area-inset-bottom,0px))}.my-sheet.show{transform:translate(-50%,0)}.my-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.my-sheet-head small{display:block;font-size:9.5px;color:#7a858e;font-weight:780;letter-spacing:.08em}.my-sheet-head strong{display:block;margin-top:2px;font-size:15px;color:#e7ebee;font-weight:850}.my-close{width:34px;height:34px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.025);color:#8f99a1;font-size:20px;line-height:1}.my-detail-card-wrap{margin:0 -2px}.my-detail-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;margin-top:12px}.my-detail-actions .danger{color:#c88d87;border-color:rgba(200,109,101,.17);background:rgba(200,109,101,.045)}
.my-field-label{display:block;font-size:10px;color:#89939b;font-weight:760;margin-bottom:6px}.my-name-input{width:100%;height:45px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:#0b1015;color:#e6eaed;padding:0 12px;font-size:16px;outline:none}.my-name-input:focus{border-color:rgba(199,170,96,.42);box-shadow:0 0 0 3px rgba(199,170,96,.07)}.my-save-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:8px;margin-top:14px}.my-save-scope-title{margin:13px 1px 7px;font-size:10px;color:#77828b;font-weight:800}.my-save-scopes,.my-apply-options{display:grid;gap:7px}.my-scope-option,.my-apply-option{display:flex;align-items:center;gap:10px;min-height:45px;padding:8px 10px;border:1px solid rgba(255,255,255,.06);border-radius:11px;background:rgba(255,255,255,.016);color:#c5ccd1}.my-scope-option>span,.my-apply-option>span{min-width:0;flex:1}.my-scope-option strong,.my-apply-option strong{display:block;font-size:11px;font-weight:800}.my-scope-option small,.my-apply-option small{display:block;margin-top:2px;font-size:9.5px;color:#6c7780;font-weight:650}.my-scope-option input,.my-apply-option input{width:18px;height:18px;accent-color:#c7aa60;flex:0 0 auto}.my-scope-option.locked,.my-apply-option.locked{border-color:rgba(199,170,96,.13);background:rgba(199,170,96,.035)}.my-apply-note,.my-save-note{font-size:9.5px;color:#69747d;line-height:1.5;margin:8px 1px 0}
@media(max-width:360px){.my-page{padding-left:9px;padding-right:9px}.myov-info{padding-left:11px;padding-right:11px}.myov-header-grid{grid-template-columns:minmax(0,1fr) 116px;gap:8px}.myov-attrs{padding-left:6px;padding-right:6px}.myov-attr-grid{gap:4px}.myov-attr-col{padding-left:5px;padding-right:5px}.myov-attr-row span{font-size:9.5px}.myov-name{font-size:15px}}


/* =========================================================
   v1.17 · Global Premium UI
   Theme colors = atmosphere only. Gold remains interaction semantics.
   ========================================================= */
body{
  --ui-atmo:#c9ab5c;
  --ui-atmo-rgb:201,171,92;
  --ui-atmo-soft:#9d8245;
  --ui-cloud-rgb:86,111,132;
  --ui-bg-top:#0a0f14;
  --ui-bg-mid:#080d11;
  --ui-bg-bottom:#070b0f;
  --ui-panel:14,21,27;
  --ui-panel-2:10,16,21;
  --ui-line:255,255,255;
}
body[data-my-theme="theme2"]{
  --ui-atmo:#76b59f;
  --ui-atmo-rgb:118,181,159;
  --ui-atmo-soft:#4f8274;
  --ui-cloud-rgb:74,118,127;
  --ui-bg-top:#091315;
  --ui-bg-mid:#081014;
  --ui-bg-bottom:#070d10;
  --ui-panel:13,23,25;
  --ui-panel-2:8,17,19;
}
body[data-my-theme="theme3"]{
  --ui-atmo:#88a9d3;
  --ui-atmo-rgb:136,169,211;
  --ui-atmo-soft:#5d7fa9;
  --ui-cloud-rgb:84,107,141;
  --ui-bg-top:#0d141b;
  --ui-bg-mid:#0a1016;
  --ui-bg-bottom:#090d12;
  --ui-panel:16,23,31;
  --ui-panel-2:10,16,23;
}
html,body{background:var(--ui-bg-bottom)!important}
body{transition:background .22s ease}
.app{
  position:relative!important;isolation:isolate;
  background:
    radial-gradient(92% 330px at 50% -70px,rgba(var(--ui-cloud-rgb),.19),transparent 66%),
    radial-gradient(64% 260px at 103% 3%,rgba(var(--ui-atmo-rgb),.070),transparent 72%),
    linear-gradient(180deg,var(--ui-bg-top) 0%,var(--ui-bg-mid) 43%,var(--ui-bg-bottom) 100%)!important;
  transition:background .24s ease!important;
}
.app:before{
  content:"";position:absolute;z-index:0;left:0;right:0;top:0;height:380px;pointer-events:none;opacity:.42;
  background-image:linear-gradient(rgba(255,255,255,.014) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.011) 1px,transparent 1px);
  background-size:34px 34px;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.48) 42%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.48) 42%,transparent 100%)
}
#scroll,#playstylesMobilePage,#enhanceMobilePage,#apToolsMobilePage,#myBuildsMobilePage{position:relative;z-index:1;background:transparent!important}

/* ---- Global title language ---- */
.mobile-context-title,.aptool-page-title,.my-page-title{
  position:relative!important;height:66px!important;display:flex!important;align-items:center!important;gap:11px!important;
  padding:7px 56px 0 14px!important;margin:0!important;white-space:nowrap!important
}
.mobile-context-title:before,.aptool-page-title:before,.my-page-title:before{
  content:""!important;position:absolute!important;left:1px!important;top:25px!important;width:3px!important;height:19px!important;border-radius:99px!important;
  background:linear-gradient(180deg,rgba(var(--ui-atmo-rgb),.95),rgba(var(--ui-atmo-rgb),.47))!important;
  box-shadow:0 0 18px rgba(var(--ui-atmo-rgb),.20)!important
}
.mobile-context-title:after,.aptool-page-title:after,.my-page-title:after{
  content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:1px!important;
  background:linear-gradient(90deg,rgba(var(--ui-atmo-rgb),.25),rgba(255,255,255,.045) 38%,transparent 88%)!important
}
.mobile-context-title .cn,.aptool-page-title .cn,.my-page-title .cn{
  font-size:19px!important;line-height:1!important;font-weight:790!important;letter-spacing:.045em!important;color:#edf1f3!important;text-shadow:0 1px 12px rgba(0,0,0,.20)!important
}
.mobile-context-title .en,.aptool-page-title .en,.my-page-title .en{
  margin-top:4px!important;font-family:"Ink Free","Segoe Print","Segoe Script","Bradley Hand",cursive!important;
  font-size:18px!important;line-height:1!important;font-style:italic!important;font-weight:800!important;text-transform:none!important;letter-spacing:.015em!important;
  color:rgba(var(--ui-atmo-rgb),.82)!important;text-shadow:none!important;transform:rotate(-2deg);transform-origin:left center;transition:color .18s ease
}
.mobile-context-title .en:before,.aptool-page-title .en:before,.my-page-title .en:before{content:none!important}

/* ---- Global theme control ---- */
.global-theme-btn{
  position:absolute;z-index:120;right:13px;top:16px;width:43px;height:33px;padding:0;border:1px solid rgba(255,255,255,.095);border-radius:12px;
  background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.018));color:#aeb7bd;
  box-shadow:0 9px 24px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.055);
  display:grid;place-items:center;-webkit-backdrop-filter:blur(18px) saturate(118%);backdrop-filter:blur(18px) saturate(118%);
  transition:transform .10s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease
}
.global-theme-btn:before{
  content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;opacity:.48;
  background:radial-gradient(circle at 50% 0%,rgba(var(--ui-atmo-rgb),.17),transparent 64%)
}
.global-theme-btn:active{transform:scale(.965);border-color:rgba(199,170,95,.25);background:linear-gradient(180deg,rgba(199,170,95,.075),rgba(255,255,255,.018));box-shadow:0 6px 18px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.06)}
.global-theme-dots{position:relative;display:flex;align-items:center;justify-content:center;gap:4px;height:12px}
.global-theme-dots i{display:block;width:4px;height:4px;border-radius:50%;background:#aeb6bc;box-shadow:0 0 8px rgba(var(--ui-atmo-rgb),.12)}
.global-theme-dots i:nth-child(2){width:5px;height:5px;background:var(--ui-atmo);box-shadow:0 0 10px rgba(var(--ui-atmo-rgb),.24)}
.global-theme-menu{min-width:188px!important;padding:8px!important;border-color:rgba(255,255,255,.09)!important;border-radius:15px!important;background:linear-gradient(180deg,rgba(var(--ui-panel),.985),rgba(var(--ui-panel-2),.995))!important;box-shadow:0 24px 64px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.03)!important}
.global-theme-menu .my-theme-head{padding:4px 7px 8px!important;font-size:8px!important;letter-spacing:.14em!important;color:#707b84!important}.global-theme-menu .my-theme-head span{margin-left:5px;letter-spacing:.04em;color:#59656e}
.global-theme-menu .my-theme-option{min-height:43px!important;padding:7px 8px!important;border-radius:10px!important}.global-theme-menu .my-theme-option.active{background:rgba(199,170,95,.065)!important;box-shadow:inset 0 0 0 1px rgba(199,170,95,.075)}
.global-theme-menu .my-theme-check{color:#d8bf77!important}.my-page-theme-btn{display:none!important}

/* ---- Page shell / selector / glass ---- */
.sticky.mobile-context-selector{
  padding-top:11px!important;padding-bottom:10px!important;
  background:linear-gradient(180deg,rgba(var(--ui-panel-2),.96),rgba(var(--ui-panel-2),.83) 78%,rgba(var(--ui-panel-2),0))!important;
  -webkit-backdrop-filter:blur(18px) saturate(112%)!important;backdrop-filter:blur(18px) saturate(112%)!important
}
.identity{
  border-color:rgba(var(--ui-atmo-rgb),.115)!important;border-radius:14px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(var(--ui-atmo-rgb),.012) 48%,rgba(255,255,255,.009))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.028),0 9px 24px rgba(0,0,0,.10)!important
}
.dropdown{border-color:rgba(var(--ui-atmo-rgb),.13)!important;background:linear-gradient(180deg,rgba(var(--ui-panel),.985),rgba(var(--ui-panel-2),.995))!important;box-shadow:0 20px 54px rgba(0,0,0,.48)!important}
.aptrack{background:rgba(255,255,255,.055)!important}

/* ---- Build page ---- */
#scroll .cathead{
  height:37px!important;border-color:rgba(var(--ui-atmo-rgb),.105)!important;border-radius:11px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.033),rgba(var(--ui-atmo-rgb),.010))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 7px 18px rgba(0,0,0,.08)!important
}
#scroll .cat.collapsed .cathead{background:linear-gradient(180deg,rgba(255,255,255,.020),rgba(255,255,255,.008))!important}
#scroll .cross{border-color:rgba(var(--ui-atmo-rgb),.13)!important;background:radial-gradient(circle at 58% 42%,rgba(var(--ui-atmo-rgb),.065),transparent 43%),rgba(var(--ui-panel-2),.76)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.018)}
#scroll .rule{background:linear-gradient(90deg,transparent,rgba(255,255,255,.065) 10%,rgba(255,255,255,.065) 90%,transparent)!important}

/* ---- PlayStyles page ---- */
.psm-loadout,.psm-spec,.psm-detail-card{
  border-color:rgba(var(--ui-atmo-rgb),.11)!important;border-radius:16px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.030),rgba(var(--ui-atmo-rgb),.012) 46%,rgba(255,255,255,.007))!important;
  box-shadow:0 12px 30px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.020)!important
}
.psm-library-inner,.psm-amp-picker-inner,.psm-signature-picker-inner{background:linear-gradient(180deg,rgba(var(--ui-panel),.98),rgba(var(--ui-panel-2),.99))!important}
.psm-category+.psm-category{border-top-color:rgba(255,255,255,.05)!important}
.psm-spec-static-head span,.psm-category-head span{color:rgba(var(--ui-atmo-rgb),.55)!important}

/* ---- Enhance page ---- */
.enh-card,.facility-info-card,.facility-summary{
  border-color:rgba(var(--ui-atmo-rgb),.105)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.028),rgba(var(--ui-atmo-rgb),.011) 50%,rgba(255,255,255,.007))!important;
  box-shadow:0 12px 28px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.018)!important
}
.facility-card-mobile{background:linear-gradient(145deg,rgba(199,170,95,.035),rgba(var(--ui-atmo-rgb),.010) 50%,rgba(var(--ui-panel),.72))!important}
.facility-picker-sheet,.mastery-aggregate-pop,.enh-preset-modal-inner{background:linear-gradient(180deg,rgba(var(--ui-panel),.99),rgba(var(--ui-panel-2),.995))!important}
.facility-mobile-head span,.enh-section-head span{color:rgba(var(--ui-atmo-rgb),.55)!important}

/* ---- AP tools page ---- */
.aptool-top-card,.aptool-section{
  border-color:rgba(var(--ui-atmo-rgb),.11)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.031),rgba(var(--ui-atmo-rgb),.011) 48%,rgba(var(--ui-panel),.62))!important;
  box-shadow:0 13px 31px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.020)!important
}
.aptool-stat,.aptool-group{border-color:rgba(255,255,255,.055)!important;background:linear-gradient(145deg,rgba(255,255,255,.020),rgba(var(--ui-atmo-rgb),.006))!important}
.aptool-import-menu,.aptool-import-modal,.aptool-result-modal{background:linear-gradient(180deg,rgba(var(--ui-panel),.992),rgba(var(--ui-panel-2),.998))!important}

/* ---- My page: keep existing card-specific theme, unify shell only ---- */
body.my-view .my-page{background:transparent!important}
body.my-view .my-page:before{display:none!important}
.my-build-card{box-shadow:inset 0 1px 0 rgba(255,255,255,.014),0 8px 20px rgba(0,0,0,.08)!important}

/* ---- Dock language across all pages ---- */
.context-toolbar{
  border-color:rgba(var(--ui-atmo-rgb),.105)!important;
  background:linear-gradient(180deg,rgba(var(--ui-panel),.78),rgba(var(--ui-panel-2),.72))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.065),0 11px 28px rgba(0,0,0,.25)!important
}
.nav{
  border-color:rgba(255,255,255,.06)!important;
  background:linear-gradient(180deg,rgba(var(--ui-panel),.94),rgba(var(--ui-panel-2),.975))!important;
  box-shadow:0 16px 42px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.022)!important
}
/* Gold is semantic: active/selected/interactable states intentionally stay gold. */
.nav button.active{color:#d9c27f!important}.nav button.active .icon{background:rgba(215,189,119,.075)!important;box-shadow:inset 0 0 0 1px rgba(215,189,119,.10)!important}.nav button:after{background:#d7bd76!important;box-shadow:0 0 10px rgba(215,189,118,.22)!important}

@media(max-width:360px){
  .mobile-context-title,.aptool-page-title,.my-page-title{padding-left:13px!important;padding-right:54px!important}
  .mobile-context-title .cn,.aptool-page-title .cn,.my-page-title .cn{font-size:18px!important}
  .mobile-context-title .en,.aptool-page-title .en,.my-page-title .en{font-size:16.5px!important}
  .global-theme-btn{right:10px;top:17px;width:40px;height:31px}
}
@media(prefers-reduced-motion:reduce){.app,.global-theme-btn,.mobile-context-title .en,.aptool-page-title .en,.my-page-title .en{transition:none!important}}


/* v1.18 · true global rollout: mirror My Builds visual language on all five pages */
.mobile-context-title,.aptool-page-title,.my-page-title{position:relative!important;padding-right:68px!important}
.page-theme-btn{
  position:absolute;right:8px;top:15px;width:48px;height:36px;padding:0;border:1px solid rgba(255,255,255,.10);border-radius:13px;
  background:linear-gradient(180deg,rgba(255,255,255,.058),rgba(255,255,255,.018));color:#aeb7bd;
  display:grid;place-items:center;box-shadow:0 10px 26px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.055);
  -webkit-backdrop-filter:blur(18px) saturate(118%);backdrop-filter:blur(18px) saturate(118%);z-index:8
}
.page-theme-btn:before{content:"";position:absolute;inset:-1px;border-radius:inherit;background:radial-gradient(circle at 50% 0%,rgba(var(--ui-atmo-rgb),.20),transparent 66%);pointer-events:none}
.page-theme-btn:active{transform:scale(.965);border-color:rgba(215,189,119,.24);background:linear-gradient(180deg,rgba(215,189,119,.075),rgba(255,255,255,.018))}
.page-theme-btn .global-theme-dots{position:relative;z-index:1}

#scroll,#playstylesMobilePage,#enhanceMobilePage,#apToolsMobilePage,#myBuildsMobilePage{padding-left:13px!important;padding-right:13px!important}
#scroll>.mobile-context-title,#playstylesMobilePage>.mobile-context-title,#enhanceMobilePage>.mobile-context-title,#apToolsMobilePage>.aptool-page-title,#myBuildsMobilePage>.my-page-title{margin-left:0!important;margin-right:0!important}

/* selector / top context card */
.sticky.mobile-context-selector{margin:10px 0 12px!important;padding:0!important;background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.sticky.mobile-context-selector .identity{padding:8px 10px!important;border:1px solid rgba(var(--ui-atmo-rgb),.12)!important;border-radius:16px!important;background:linear-gradient(145deg,rgba(255,255,255,.033),rgba(var(--ui-atmo-rgb),.012) 46%,rgba(255,255,255,.008))!important;box-shadow:0 12px 28px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.024)!important}
.sticky.mobile-context-selector .apwrap{margin-top:7px!important;padding:0 3px!important}

/* build */
#scroll .quick{margin:8px 0!important;padding:10px 12px!important;border:1px solid rgba(255,255,255,.055)!important;border-radius:14px!important;background:linear-gradient(145deg,rgba(255,255,255,.024),rgba(var(--ui-atmo-rgb),.007))!important}
#scroll .body{margin-top:8px!important;border:1px solid rgba(var(--ui-atmo-rgb),.09)!important;border-radius:16px!important;background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(var(--ui-atmo-rgb),.008) 48%,rgba(255,255,255,.006))!important;box-shadow:0 12px 28px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.018)!important;overflow:hidden}
#scroll .bodyrow{padding:11px 12px!important}
#scroll .attrs{margin-top:10px!important}
#scroll .cat{margin-bottom:8px!important;border:1px solid rgba(255,255,255,.05)!important;border-radius:14px!important;background:linear-gradient(145deg,rgba(255,255,255,.022),rgba(var(--ui-atmo-rgb),.006))!important;overflow:hidden}
#scroll .cathead{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}

/* playstyles */
#playstylesMobilePage .psm-loadout,#playstylesMobilePage .psm-spec,#playstylesMobilePage .psm-detail-card{border-radius:18px!important;border:1px solid rgba(var(--ui-atmo-rgb),.11)!important;background:linear-gradient(145deg,rgba(255,255,255,.029),rgba(var(--ui-atmo-rgb),.010) 48%,rgba(255,255,255,.006))!important;box-shadow:0 14px 32px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.020)!important}
#playstylesMobilePage .psm-loadout{margin-top:8px!important}
#playstylesMobilePage .psm-signature-picker,#playstylesMobilePage .psm-amp-picker,#playstylesMobilePage .psm-library{border-radius:18px!important}
#playstylesMobilePage .psm-signature-picker-inner,#playstylesMobilePage .psm-amp-picker-inner,#playstylesMobilePage .psm-library-inner{border:1px solid rgba(255,255,255,.055)!important;border-radius:18px!important;background:linear-gradient(180deg,rgba(var(--ui-panel),.985),rgba(var(--ui-panel-2),.995))!important;box-shadow:0 16px 36px rgba(0,0,0,.18)!important}

/* enhance */
#enhanceMobilePage .enh-section{margin-top:10px!important}
#enhanceMobilePage .enh-card,#enhanceMobilePage .facility-info-card,#enhanceMobilePage .facility-summary,#enhanceMobilePage .facility-card-mobile{border:1px solid rgba(var(--ui-atmo-rgb),.105)!important;border-radius:17px!important;background:linear-gradient(145deg,rgba(255,255,255,.028),rgba(var(--ui-atmo-rgb),.009) 50%,rgba(255,255,255,.006))!important;box-shadow:0 13px 30px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.018)!important}
#enhanceMobilePage .facility-mobile-head{margin:18px 2px 9px!important;padding-left:10px!important;position:relative}
#enhanceMobilePage .facility-mobile-head:before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:2px;border-radius:99px;background:rgba(var(--ui-atmo-rgb),.70)}

/* AP tools */
#apToolsMobilePage .aptool-top-card,#apToolsMobilePage .aptool-section{border:1px solid rgba(var(--ui-atmo-rgb),.11)!important;border-radius:18px!important;background:linear-gradient(145deg,rgba(255,255,255,.030),rgba(var(--ui-atmo-rgb),.010) 48%,rgba(255,255,255,.006))!important;box-shadow:0 14px 32px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.020)!important}
#apToolsMobilePage .aptool-top-card{margin-top:10px!important}
#apToolsMobilePage .aptool-section{margin-top:9px!important}
#apToolsMobilePage .aptool-group,#apToolsMobilePage .aptool-stat{border-radius:13px!important;background:rgba(255,255,255,.016)!important}

/* drawers / menus / sheets */
.dropdown,.psm-library-inner,.psm-amp-picker-inner,.psm-signature-picker-inner,.facility-level-menu,.facility-picker-sheet,.mastery-aggregate-pop,.enh-preset-modal-inner,.aptool-import-menu,.aptool-import-modal,.aptool-result-modal,.my-sheet,.my-theme-menu{border-color:rgba(255,255,255,.08)!important;background:linear-gradient(180deg,rgba(var(--ui-panel),.992),rgba(var(--ui-panel-2),.998))!important;box-shadow:0 22px 58px rgba(0,0,0,.45)!important}

/* interaction semantics stay gold, theme only changes atmosphere */
.nav button.active{color:#d9c27f!important}.nav button.active .icon{background:rgba(215,189,119,.075)!important;box-shadow:inset 0 0 0 1px rgba(215,189,119,.10)!important}.nav button:after{background:#d7bd76!important}

@media(max-width:360px){
  #scroll,#playstylesMobilePage,#enhanceMobilePage,#apToolsMobilePage,#myBuildsMobilePage{padding-left:10px!important;padding-right:10px!important}
  .mobile-context-title,.aptool-page-title,.my-page-title{padding-right:62px!important}
  .page-theme-btn{right:6px;top:16px;width:44px;height:33px;border-radius:12px}
}


/* v1.20 · minimal theme palette SVG */
body .page-theme-btn{width:48px!important;height:36px!important;border-radius:13px!important;display:grid!important;place-items:center!important;padding:0!important}
body .page-theme-btn .theme-palette-icon{position:relative;z-index:2;width:23px;height:23px;overflow:visible;filter:drop-shadow(0 3px 7px rgba(0,0,0,.22))}
body .page-theme-btn .theme-palette-outline{fill:none;stroke:#aeb8bf;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round;opacity:.92}
body .page-theme-btn .theme-palette-dot{fill:#88949c;opacity:.86}
body .page-theme-btn .theme-palette-dot.d2{fill:var(--global-atmo)!important;opacity:1;filter:drop-shadow(0 0 3px rgba(var(--global-atmo-rgb),.38))}
body .page-theme-btn .theme-palette-notch{fill:#0c1217;stroke:#75818a;stroke-width:.8;opacity:.92}
body .page-theme-btn:active .theme-palette-outline{stroke:#d9c27f}
body .page-theme-btn:active .theme-palette-dot.d1,body .page-theme-btn:active .theme-palette-dot.d3{fill:#b6c0c6}
body .page-theme-btn:active .theme-palette-notch{stroke:#b8a265}
@media(max-width:360px){body .page-theme-btn{width:46px!important;height:35px!important}body .page-theme-btn .theme-palette-icon{width:22px;height:22px}}


/* v1.34 · first-paint App Shell guard.
   This lives in HEAD so Safari never paints the legacy fixed-bottom layout for one frame. */
:root{--app-shell-height:100vh;--bottom-nav-h:48px}
@supports(height:100dvh){:root{--app-shell-height:100dvh}}
html,body{
  width:100%!important;height:100%!important;min-height:0!important;
  overflow:hidden!important;overscroll-behavior:none!important;
}
body{position:relative!important;min-height:0!important;padding:0!important}
body .app{
  box-sizing:border-box!important;width:min(430px,100vw)!important;max-width:430px!important;
  height:var(--app-shell-height)!important;min-height:0!important;margin:0 auto!important;
  padding-top:var(--safe-top,env(safe-area-inset-top,0px))!important;padding-bottom:0!important;
  display:flex!important;flex-direction:column!important;overflow:hidden!important;
}
body .app>main#scroll,body .app>main#playstylesMobilePage,body .app>main#enhanceMobilePage,body .app>main#apToolsMobilePage,body .app>main#myBuildsMobilePage{
  flex:1 1 auto!important;min-height:0!important;height:auto!important;max-height:none!important;
  overflow-x:hidden!important;overflow-y:auto!important;box-sizing:border-box!important;
}
body .app>main[hidden]{display:none!important}
body .bottom-dock{
  position:relative!important;flex:0 0 var(--bottom-shell-h)!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  width:100%!important;max-width:none!important;height:var(--bottom-shell-h)!important;
  min-height:var(--bottom-shell-h)!important;margin:0!important;transform:none!important;
}
body.my-view .bottom-dock{
  flex-basis:calc(var(--bottom-nav-h) + 8px + env(safe-area-inset-bottom,0px))!important;
  height:calc(var(--bottom-nav-h) + 8px + env(safe-area-inset-bottom,0px))!important;
  min-height:calc(var(--bottom-nav-h) + 8px + env(safe-area-inset-bottom,0px))!important;
}
@media(max-width:360px){:root{--bottom-nav-h:46px}}


/* v0.93 · My Build overview: compact text triggers for formation / position */
.myov-info{padding:14px 13px 11px!important}
.myov-top-grid{display:grid;grid-template-columns:minmax(0,.44fr) minmax(0,.56fr);gap:12px;align-items:start;min-height:116px}
.myov-identity{min-width:0;align-self:start;padding-top:1px}
.myov-title-line{gap:4px!important;align-items:center!important;min-height:28px}
.myov-level,.myov-name{font-size:14.5px!important;line-height:1.1!important;font-weight:840!important;letter-spacing:0!important}
.myov-level{color:#d5bd7a!important}.myov-dot{font-size:13px!important;color:#70777d!important;margin:0 1px}.myov-name{color:#eef1f3!important}
.myov-edit{width:25px!important;height:25px!important;margin-left:0!important}.myov-edit svg{width:13.5px!important;height:13.5px!important}
.myov-archetype{margin-top:10px!important;gap:8px!important;align-items:center!important}.myov-logo{width:32px!important;height:32px!important}
.myov-archcopy strong{font-size:12px!important;line-height:1.08!important;font-weight:780!important;color:#bfc7cd!important}.myov-archcopy span{margin-top:3px!important;font-size:9.5px!important;font-weight:650!important;color:#65717b!important}
.myov-config{min-width:0;align-self:start;display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start;padding-top:2px}
.myov-config-row{min-width:0;width:100%;display:flex;align-items:center;justify-content:flex-end;text-align:right;white-space:nowrap}
.myov-config-row i{font-style:normal;color:#4f5961;margin:0 4px}
.myov-config-row .muted,.myov-config-meta .myov-meta-value,.myov-config-stars,.myov-config-stars .myov-stars,.myov-pick-label,.myov-pick-value{font-size:10.5px!important;line-height:1!important}
.myov-config-row .muted,.myov-pick-label{color:#69747c!important;font-weight:700!important}
.myov-config-meta .myov-meta-value,.myov-config-stars .myov-stars,.myov-pick-value{color:#dce1e4!important;font-weight:740!important}
.myov-config-stars{min-height:22px;overflow:hidden;color:#aab2b8!important;margin-bottom:1px}.myov-config-stars .myov-stars{color:#cbb36e!important;letter-spacing:-.04em!important}
.myov-config-meta{min-height:22px;overflow:hidden;color:#aab2b8!important;margin-bottom:1px}
.myov-accel{font-size:10.5px!important;font-weight:800!important}
.myov-accel[data-accel="掌控"]{color:#6fa986!important}
.myov-accel[data-accel="爆发"]{color:#bd7770!important}
.myov-accel[data-accel="漫长"]{color:#728fb7!important}
.myov-config-picks{min-height:27px;margin-bottom:3px}
.myov-pick-pair{display:flex;justify-content:flex-end;align-items:center;gap:13px;width:100%}
.myov-pick-cell{display:inline-flex;align-items:center;justify-content:flex-end;gap:4px;min-width:0;flex:0 0 auto}
.myov-pick-cell.formation,.myov-pick-cell.position{width:auto}
.myov-pick-input{position:relative;display:inline-flex;align-items:center;justify-content:flex-end;gap:3px;min-width:0;width:auto;height:25px;padding:0 12px 0 0;border:1px solid transparent;border-radius:7px;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
.myov-pick-input.readonly{padding-right:0!important;cursor:default}
.myov-pick-input:not(.readonly):focus-within{border-color:rgba(199,170,96,.18)!important;background:rgba(199,170,96,.045)!important}
.myov-pick-input:not(.readonly):after{content:"";position:absolute;right:1px;top:50%;width:5px;height:5px;border-right:1.3px solid #737e87;border-bottom:1.3px solid #737e87;transform:translateY(-65%) rotate(45deg);pointer-events:none}
.myov-pick-input .myov-pick-value{display:inline-block;min-width:0;width:auto;height:auto;padding:0;background:transparent;border:0;color:#dce1e4;font-size:10.5px;font-weight:740;line-height:1;white-space:nowrap;pointer-events:none}
.myov-pick-input select{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;opacity:0;appearance:none;-webkit-appearance:none;cursor:pointer}
.myov-config-ps{min-height:28px;margin-top:1px;overflow:hidden;justify-content:flex-end!important}.myov-config-ps .myov-ps-icons,.myov-config-ps .myov-ps-strip{display:flex!important;justify-content:flex-end!important;align-items:center!important;gap:5px!important;flex-wrap:nowrap!important;min-width:0}
.myov-config-ps .myov-ps-badge{width:22px!important;height:22px!important;border-radius:7px!important;border:1px solid rgba(148,163,175,.22)!important;background:linear-gradient(180deg,rgba(131,146,158,.16),rgba(77,89,99,.10))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important}
.myov-config-ps .myov-ps-badge.plus{border-color:rgba(213,182,102,.46)!important;background:linear-gradient(180deg,rgba(213,182,102,.22),rgba(129,102,43,.14))!important;box-shadow:inset 0 1px 0 rgba(255,232,165,.12)!important}
.myov-config-ps .myov-ps-badge img{width:18px!important;height:18px!important;object-fit:contain}.myov-config-ps .myov-ps-empty{font-size:9.8px!important;color:#56616a!important}
.myov-readonly,.myov-ps{display:none!important}.myov-divider{margin:0 13px!important}
.myov-attr-row span{font-weight:400!important;color:#87919a!important}.myov-attr-row b{font-weight:500!important}
@media(max-width:365px){
  .myov-top-grid{grid-template-columns:minmax(0,.43fr) minmax(0,.57fr);gap:9px}.myov-level,.myov-name{font-size:13.5px!important}.myov-logo{width:29px!important;height:29px!important}.myov-archcopy strong{font-size:11.5px!important}
  .myov-config-row .muted,.myov-config-meta .myov-meta-value,.myov-config-stars,.myov-config-stars .myov-stars,.myov-pick-label,.myov-pick-value,.myov-accel{font-size:10px!important}
  .myov-pick-pair{gap:10px}.myov-pick-cell{gap:3px}.myov-pick-input{padding-right:11px}
  .myov-config-ps .myov-ps-badge{width:20px!important;height:20px!important}.myov-config-ps .myov-ps-badge img{width:16px!important;height:16px!important}
}

/* v0.94 · My Build PlayStyle badges use the same real silver / gold shells as the PlayStyle page.
   The old implementation drew only a rounded slot behind the raw black icon, so the badge silhouette was missing. */
.myov-config-ps .myov-ps-badge{
  width:25px!important;height:25px!important;flex:0 0 25px!important;
  display:grid!important;place-items:center!important;
  overflow:visible!important;border:0!important;border-radius:0!important;
  background:none!important;box-shadow:none!important;
}
.myov-config-ps .myov-ps-badge.plus{
  border:0!important;background:none!important;box-shadow:none!important;
}
.myov-config-ps .myov-ps-badge .psm-badge-shell{
  --badge-h:22px;--badge-w:22px;--icon-box:13px;--icon-lift:0px;
  width:25px!important;height:25px!important;overflow:visible!important;
}
.myov-config-ps .myov-ps-badge .psm-badge-shell.plus{
  --badge-h:22px;--badge-w:26px;--icon-box:13.5px;--icon-lift:1px;
}
.myov-config-ps .myov-ps-badge .psm-badge-shell img{
  width:var(--icon-box)!important;height:var(--icon-box)!important;
  max-width:none!important;max-height:none!important;object-fit:contain!important;
}
@media(max-width:365px){
  .myov-config-ps .myov-ps-badge{width:23px!important;height:23px!important;flex-basis:23px!important}
  .myov-config-ps .myov-ps-badge .psm-badge-shell{
    --badge-h:20px;--badge-w:20px;--icon-box:12px;width:23px!important;height:23px!important
  }
  .myov-config-ps .myov-ps-badge .psm-badge-shell.plus{
    --badge-h:20px;--badge-w:24px;--icon-box:12.5px;--icon-lift:.8px
  }
}


/* v0.95 · My Build: theme menu, live mastery/facility toggles, export image */
.my-section-cap{position:relative!important;align-items:center!important}
.my-cap-actions{position:relative;display:flex;align-items:center;justify-content:flex-end;min-width:32px}
.my-kebab{width:28px;height:28px;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.02);color:#9aa6af;font-size:18px;line-height:1;display:grid;place-items:center;padding:0}
.my-kebab:active{background:rgba(255,255,255,.05)}
.my-theme-menu{position:absolute;right:0;top:34px;z-index:40;min-width:152px;padding:7px;border:1px solid rgba(255,255,255,.09);border-radius:13px;background:linear-gradient(180deg,rgba(17,24,30,.985),rgba(10,15,20,.99));box-shadow:0 16px 34px rgba(0,0,0,.42)}
.my-theme-menu[hidden]{display:none!important}
.my-theme-head{padding:3px 6px 7px;font-size:8.6px;letter-spacing:.12em;font-weight:820;color:#6d7881}
.my-theme-option{width:100%;display:flex;align-items:center;gap:8px;padding:8px;border:0;border-radius:10px;background:transparent;color:#cfd6db;text-align:left}
.my-theme-option:active{background:rgba(255,255,255,.045)}
.my-theme-option.active{background:rgba(199,170,96,.08)}
.my-theme-thumb{flex:0 0 auto;width:22px;height:22px;border-radius:7px;border:1px solid rgba(255,255,255,.08);overflow:hidden}
.my-theme-thumb.t1{background:radial-gradient(circle at 22% 12%,rgba(210,183,110,.23),transparent 45%),linear-gradient(145deg,#141d24,#0a0f14 78%)}
.my-theme-thumb.t2{background:radial-gradient(circle at 24% 12%,rgba(120,182,161,.23),transparent 46%),linear-gradient(145deg,#121c20,#091015 78%)}
.my-theme-thumb.t3{background:radial-gradient(circle at 52% 0%,rgba(107,145,184,.20),transparent 54%),linear-gradient(180deg,#121a22,#0a0f14 82%)}
.my-theme-copy{min-width:0}.my-theme-copy strong{display:block;font-size:10.5px;line-height:1.05;font-weight:800;color:#dde3e7}.my-theme-copy span{display:block;margin-top:2px;font-size:8.8px;line-height:1;color:#6f7a84}
.my-theme-check{margin-left:auto;font-size:10px;color:#d0b56a;font-weight:900;opacity:0}.my-theme-option.active .my-theme-check{opacity:1}
.my-overview-card{overflow:hidden!important}
.my-overview-card:before{display:none!important}
.myov-theme-layer,.myov-theme-floor{position:absolute;inset:0;pointer-events:none;z-index:0}
.my-overview-card[data-theme="theme1"]{border-color:rgba(199,170,96,.18)!important;background:linear-gradient(155deg,rgba(199,170,96,.06),rgba(18,25,31,.98) 27%,rgba(10,15,20,.99) 72%)!important}
.my-overview-card[data-theme="theme1"] .myov-theme-layer{background:radial-gradient(118% 54% at 82% 0%,rgba(81,112,139,.15),transparent 56%),radial-gradient(80% 40% at 14% 0%,rgba(199,170,96,.13),transparent 46%),linear-gradient(118deg,transparent 0 42%,rgba(255,255,255,.018) 42.2% 42.7%,transparent 43% 100%)}
.my-overview-card[data-theme="theme1"] .myov-theme-floor{inset:auto -5% 0;height:30%;background:linear-gradient(180deg,transparent,rgba(199,170,96,.06) 35%,rgba(9,13,18,.03) 100%);opacity:.9}
.my-overview-card[data-theme="theme2"]{border-color:rgba(116,177,158,.22)!important;background:linear-gradient(160deg,rgba(94,153,136,.08),rgba(16,24,27,.98) 28%,rgba(8,13,17,.995) 72%)!important}
.my-overview-card[data-theme="theme2"] .myov-theme-layer{background:radial-gradient(120% 52% at 82% 0%,rgba(79,126,144,.17),transparent 56%),radial-gradient(72% 34% at 16% 0%,rgba(116,177,158,.16),transparent 44%),linear-gradient(124deg,transparent 0 40%,rgba(255,255,255,.014) 40.1% 40.8%,transparent 41% 100%)}
.my-overview-card[data-theme="theme2"] .myov-theme-floor{inset:auto 0 0;height:31%;background:linear-gradient(180deg,transparent,rgba(116,177,158,.04) 24%,rgba(10,15,19,.16) 100%),repeating-linear-gradient(90deg,rgba(127,173,160,.06) 0 1px,transparent 1px 40px);opacity:.86;mask-image:linear-gradient(180deg,transparent,#000 24%,#000)}
.my-overview-card[data-theme="theme3"]{border-color:rgba(111,142,177,.19)!important;background:linear-gradient(180deg,#131b23,#0a1015 62%,#090d12 100%)!important}
.my-overview-card[data-theme="theme3"] .myov-theme-layer{background:radial-gradient(120% 56% at 50% -10%,rgba(92,131,174,.18),transparent 55%),radial-gradient(90% 40% at 86% 0%,rgba(47,77,112,.12),transparent 46%),linear-gradient(180deg,rgba(18,25,32,.985),rgba(10,15,20,.995) 58%,rgba(8,12,16,1) 100%)}
.my-overview-card[data-theme="theme3"] .myov-theme-floor{top:auto;bottom:-7%;left:-14%;right:-14%;height:42%;background:linear-gradient(180deg,transparent 0%,rgba(23,35,45,.09) 16%,rgba(14,21,28,.44) 100%),repeating-linear-gradient(90deg,rgba(120,149,176,.10) 0 1px,transparent 1px 44px),repeating-linear-gradient(0deg,rgba(120,149,176,.08) 0 1px,transparent 1px 26px);transform:perspective(520px) rotateX(72deg);transform-origin:center bottom;opacity:.92;mask-image:linear-gradient(180deg,transparent,#000 16%,#000)}
.myov-attrs-head.is-live{align-items:flex-start!important;gap:10px!important}
.myov-attrs-title{min-width:0}.myov-attrs-title strong{display:block}.myov-attrs-title span{display:block;margin-top:2px}
.myov-attrs-tools{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex:0 0 auto}
.myov-toggle{display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:0 9px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(255,255,255,.02);color:#7f8b94;font-size:9.5px;font-weight:800;white-space:nowrap}
.myov-toggle i{font-style:normal;font-size:9px;font-weight:900;color:#5e6870}
.myov-toggle.on{border-color:rgba(199,170,96,.24);background:rgba(199,170,96,.075);color:#d6be7b}.myov-toggle.on i{color:#d6be7b}
.myov-toggle:active{transform:translateY(1px)}
.my-overview-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.my-action.accent{color:#d7bf7a!important;border-color:rgba(199,170,96,.18)!important;background:rgba(199,170,96,.04)!important}
.my-action.accent:active{background:rgba(199,170,96,.085)!important}
.my-export-watermark{position:absolute;left:50%;bottom:7px;transform:translateX(-50%);font-size:8.5px;line-height:1;color:rgba(220,228,234,.62);font-weight:700;letter-spacing:.045em;text-align:center;white-space:nowrap}
@media(max-width:360px){
  .my-theme-menu{min-width:144px;right:-2px}
  .myov-attrs-tools{gap:5px}
  .myov-toggle{padding:0 8px;font-size:9px}
}


/* v0.99 · similarity mobile polish: unified actions + fixed-width overlay drawer */
.my-overview-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
.my-overview-actions .my-action,
.my-overview-actions .my-action.primary,
.my-overview-actions .my-action.accent,
.my-overview-actions .my-sim-action{
  position:relative!important;height:42px!important;border:1px solid rgba(199,170,96,.20)!important;border-radius:11px!important;
  background:rgba(199,170,96,.035)!important;color:#d8c17b!important;font-size:11.5px!important;font-weight:830!important;
  box-shadow:none!important;transition:background .14s ease,border-color .14s ease,transform .08s ease!important
}
.my-overview-actions .my-action:active{background:rgba(199,170,96,.075)!important;border-color:rgba(199,170,96,.30)!important;transform:translateY(1px)}
.my-sim-action sup{position:absolute;right:7px;top:5px;font-size:5.6px;line-height:1;letter-spacing:.07em;color:#cdb56e;font-weight:900;opacity:.92}
.my-sim-action span{white-space:nowrap}
body.my-sim-open{overflow:hidden!important}
.my-sim-backdrop{position:fixed;left:50%;top:0;bottom:0;width:min(100vw,430px);transform:translateX(-50%);z-index:220;background:rgba(2,5,8,.66);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .20s ease}
.my-sim-backdrop.open{opacity:1;pointer-events:auto}
.my-sim-panel{position:fixed;left:50%;right:auto;top:0;width:min(calc(100vw - 12px),418px);z-index:221;max-height:min(84dvh,720px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:none;-webkit-overflow-scrolling:touch;contain:layout paint;padding:calc(9px + env(safe-area-inset-top,0px)) 12px 18px;border:1px solid rgba(199,170,96,.18);border-top:0;border-radius:0 0 20px 20px;background:linear-gradient(180deg,rgba(17,24,30,.995),rgba(8,13,17,.995));box-shadow:0 24px 60px rgba(0,0,0,.48);transform:translate(-50%,calc(-100% - 24px));visibility:hidden;transition:transform .28s cubic-bezier(.22,.78,.22,1),visibility 0s linear .28s}
.my-sim-panel.open{transform:translate(-50%,0);visibility:visible;transition-delay:0s}
.my-sim-grip{width:34px;height:3px;margin:0 auto 10px;border-radius:99px;background:rgba(255,255,255,.16)}
.my-sim-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 1px 10px;border-bottom:1px solid rgba(255,255,255,.055)}
.my-sim-title small{display:block;font-size:8px;line-height:1;letter-spacing:.14em;color:#66727b;font-weight:820}
.my-sim-title>div{display:flex;align-items:center;gap:7px;margin-top:5px}.my-sim-title strong{font-size:16px;line-height:1.1;color:#eef1f3;font-weight:860}.my-sim-title span{padding:3px 5px 2px;border:1px solid rgba(199,170,96,.22);border-radius:5px;background:rgba(199,170,96,.07);font-size:6.5px;line-height:1;color:#d4bc75;font-weight:900;letter-spacing:.08em}
.my-sim-close{width:30px;height:30px;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.018);color:#8b969e;font-size:21px;line-height:1;display:grid;place-items:center;padding:0}
.my-sim-mode{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:12px;padding:3px;border:1px solid rgba(255,255,255,.055);border-radius:11px;background:rgba(0,0,0,.18)}
.my-sim-mode button{height:31px;border:0;border-radius:8px;background:transparent;color:#78848d;font-size:10.5px;font-weight:800}.my-sim-mode button.active{background:rgba(199,170,96,.09);color:#d7bf7a;box-shadow:inset 0 0 0 1px rgba(199,170,96,.13)}
.my-sim-dbline{display:flex;align-items:center;gap:6px;margin-top:10px;padding:0 2px;font-size:9px;color:#77838c;font-weight:720}.my-sim-dbline i{width:6px;height:6px;border-radius:50%;background:#79a58d;box-shadow:0 0 0 3px rgba(121,165,141,.08)}
.my-sim-context{margin-top:5px;padding:0 2px;font-size:8.5px;line-height:1.35;color:#5f6b74;font-weight:670}
.my-sim-generate{width:100%;height:36px;margin-top:11px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid rgba(199,170,96,.20);border-radius:11px;background:linear-gradient(180deg,rgba(199,170,96,.10),rgba(199,170,96,.045));color:#dec77f}.my-sim-generate span{font-size:12px}.my-sim-generate strong{font-size:11px;font-weight:850}.my-sim-generate:disabled{opacity:.48}
.my-sim-result{margin-top:10px;min-height:108px}
.my-sim-idle{height:108px;display:flex;align-items:center;justify-content:center;gap:5px;position:relative;color:#55616a;font-size:9px}.my-sim-idle i{width:4px;height:4px;border-radius:50%;background:#4d5962}.my-sim-idle span{position:absolute;top:68px;left:0;right:0;text-align:center}
.my-sim-loading{min-height:112px;display:grid;place-items:center;align-content:center;gap:10px}.my-sim-loading-orbit{width:28px;height:28px;border-radius:50%;border:1px solid rgba(199,170,96,.18);position:relative;animation:mySimSpin 1.1s linear infinite}.my-sim-loading-orbit:after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:#d3ba73;left:50%;top:-3px;transform:translateX(-50%)}.my-sim-loading span{font-size:9px;color:#78848c;font-weight:720}@keyframes mySimSpin{to{transform:rotate(360deg)}}
.my-sim-topline{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:1px 1px 7px;font-size:8px;color:#63707a;font-weight:760}.my-sim-topline strong{color:#b7a66e;font-size:8.5px}
.my-sim-list{display:grid;gap:6px}
.my-sim-player{display:block;text-decoration:none;color:inherit;border:1px solid rgba(255,255,255,.06);border-radius:12px;background:rgba(255,255,255,.018);padding:9px 9px 8px;position:relative}.my-sim-player:first-child{border-color:rgba(199,170,96,.21);background:linear-gradient(135deg,rgba(199,170,96,.075),rgba(255,255,255,.014) 58%)}
.my-sim-player-head{display:grid;grid-template-columns:20px minmax(0,1fr) auto auto;align-items:center;gap:7px}.my-sim-rank{font-size:10px;color:#5f6b74;font-weight:850}.my-sim-player:first-child .my-sim-rank{color:#cfb76e}.my-sim-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#e1e6e9;font-weight:840}.my-sim-meta{display:flex;align-items:baseline;gap:3px}.my-sim-meta b{font-size:12px;color:#cfd6da}.my-sim-meta span{font-size:8px;color:#6b7780;font-weight:760}.my-sim-score{text-align:right;min-width:39px}.my-sim-score b{display:block;font-size:13px;line-height:1;color:#d4bc75}.my-sim-score span{display:block;margin-top:2px;font-size:6.5px;color:#66727a}
.my-sim-face{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin:8px 0 0 27px}.my-sim-face.gk{grid-template-columns:repeat(5,minmax(0,1fr))}.my-sim-stat{text-align:center;padding:4px 1px;border-radius:6px;background:rgba(0,0,0,.16)}.my-sim-stat span{display:block;font-size:6.5px;color:#5e6a73;font-weight:820}.my-sim-stat b{display:block;margin-top:2px;font-size:9.5px;color:#bfc7cc;font-weight:820}
.my-sim-player-sub{display:flex;align-items:center;gap:5px;margin:6px 0 0 27px;min-width:0;font-size:7.5px;color:#59656e}.my-sim-player-sub span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.my-sim-player-sub i{font-style:normal;color:#3f4950}
.my-sim-foot{margin:9px 2px 1px;font-size:7.7px;line-height:1.45;color:#56616a;text-align:center}
.my-sim-error{min-height:106px;display:grid;place-items:center;text-align:center;font-size:9px;color:#8a7373}
@media(max-width:360px){.my-overview-actions{gap:5px!important}.my-overview-actions .my-action{font-size:9.5px!important;padding-left:5px!important;padding-right:5px!important}.my-sim-action sup{right:4px;top:4px;font-size:5.1px}.my-sim-panel{width:calc(100vw - 10px);padding-left:10px;padding-right:10px}.my-sim-face{gap:3px}}
@media(prefers-reduced-motion:reduce){.my-sim-backdrop,.my-sim-panel,.my-sim-loading-orbit{transition:none!important;animation:none!important}}


/* v1.00 · card-contained theme trigger + stable navigation / similarity overlay */
.my-overview-section{margin-top:4px!important;position:relative}
.myov-config-theme{display:flex!important;align-items:center!important;justify-content:flex-end!important;min-height:22px!important;margin-top:-1px!important}
.myov-theme-trigger{width:30px;height:22px;display:grid;place-items:center;padding:0;border:0;border-radius:7px;background:rgba(255,255,255,.018);color:#7f8a93;font-size:15px;line-height:1;letter-spacing:1px}
.myov-theme-trigger:active{background:rgba(255,255,255,.05);color:#b4bdc4}
.my-theme-menu{position:fixed!important;right:auto!important;top:auto;left:auto;z-index:260!important;min-width:152px!important;max-width:calc(100vw - 16px);box-shadow:0 18px 42px rgba(0,0,0,.48)!important}
.my-theme-menu[hidden]{display:none!important}
@media(max-width:360px){.my-theme-menu{min-width:144px!important}.myov-theme-trigger{width:28px;height:21px}}


/* v1.01 · Similar-player typography + content-fingerprint save identity */
.my-sim-title small{font-size:9.5px!important}
.my-sim-title span{font-size:8.5px!important;padding:3px 6px 2px!important}
.my-sim-mode button{font-size:10.5px!important}
.my-sim-dbline{font-size:9.5px!important}
.my-sim-context{font-size:9px!important}
.my-sim-generate strong{font-size:11.5px!important}
.my-sim-idle{font-size:9.5px!important}
.my-sim-loading span{font-size:9.5px!important}
.my-sim-topline{font-size:9px!important}.my-sim-topline strong{font-size:9.5px!important}
.my-sim-rank{font-size:10.5px!important}
.my-sim-name{font-size:11.5px!important}
.my-sim-meta b{font-size:13px!important}.my-sim-meta span{font-size:9px!important}
.my-sim-score b{font-size:13.5px!important}.my-sim-score span{font-size:8.5px!important}
.my-sim-stat span{font-size:8.5px!important}.my-sim-stat b{font-size:10.5px!important}
.my-sim-player-sub{font-size:8.5px!important}
.my-sim-foot{font-size:8.5px!important}
.my-sim-error{font-size:9.5px!important}


/* v1.10 · 7FCLAB premium visual language pilot — My page only */
body.my-view{
  --lab-gold:#d7bd77;
  --lab-gold-soft:#bda45f;
  --lab-ink:#070b0f;
  --lab-panel:#0e151b;
  --lab-line:rgba(255,255,255,.065);
  --lab-text:#e8edf0;
  --lab-muted:#7b8790;
  background:#070b0f!important;
}
body.my-view .app{background:#070b0f!important}
.my-page{
  position:relative!important;
  isolation:isolate;
  padding-left:13px!important;padding-right:13px!important;
  background:
    radial-gradient(95% 46% at 50% -8%,rgba(86,111,132,.14),transparent 64%),
    radial-gradient(60% 26% at 96% 2%,rgba(188,157,84,.055),transparent 70%),
    linear-gradient(180deg,#0a0f14 0%,#080c10 40%,#070b0f 100%)!important;
}
.my-page:before{
  content:"";position:absolute;z-index:-1;inset:0 0 auto;height:330px;pointer-events:none;opacity:.48;
  background-image:linear-gradient(rgba(255,255,255,.016) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.50) 38%,transparent 100%);
  -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.50) 38%,transparent 100%);
}
.my-page-title{
  position:relative;height:66px!important;gap:9px!important;padding:7px 2px 0 13px!important;align-items:center!important;
}
.my-page-title:before{
  content:"";position:absolute;left:1px;top:26px;width:3px;height:18px;border-radius:99px;
  background:linear-gradient(180deg,#e1ca87,#9a8248);box-shadow:0 0 18px rgba(215,189,119,.18)
}
.my-page-title:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,rgba(215,189,119,.22),rgba(255,255,255,.045) 38%,transparent 86%)
}
.my-page-title .cn{font-size:20px!important;line-height:1!important;color:#edf1f3!important;font-weight:860!important;letter-spacing:.02em!important}
.my-page-title .en{margin-top:1px!important;font-size:9px!important;line-height:1!important;font-style:normal!important;text-transform:uppercase;letter-spacing:.18em!important;color:rgba(215,189,119,.62)!important;font-weight:790!important;text-shadow:none!important}
.my-overview-section{margin-top:14px!important}
.my-overview-card{
  border-radius:22px!important;
  border-color:rgba(215,189,119,.19)!important;
  box-shadow:0 22px 52px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.my-overview-card[data-theme="theme1"]{
  background:linear-gradient(155deg,rgba(183,151,79,.075),rgba(18,25,31,.985) 25%,rgba(8,13,17,.995) 75%)!important
}
.my-overview-card[data-theme="theme1"] .myov-theme-layer{
  background:radial-gradient(110% 48% at 88% -5%,rgba(92,126,153,.16),transparent 58%),radial-gradient(72% 38% at 6% 0%,rgba(205,170,89,.13),transparent 48%),linear-gradient(120deg,transparent 0 43%,rgba(255,255,255,.018) 43.2% 43.55%,transparent 43.8% 100%)!important
}
.my-overview-card[data-theme="theme2"]{
  background:linear-gradient(155deg,rgba(67,125,111,.085),rgba(15,24,27,.985) 25%,rgba(7,13,17,.995) 75%)!important
}
.my-overview-card[data-theme="theme3"]{
  background:linear-gradient(180deg,#111a22 0%,#0b1117 57%,#080d12 100%)!important
}
.myov-info{padding:16px 14px 12px!important}
.myov-top-grid{gap:13px!important}
.myov-title-line{gap:7px!important}
.myov-level{
  display:inline-flex;align-items:center;height:22px;padding:0 7px;border-radius:7px;
  border:1px solid rgba(215,189,119,.19);background:rgba(215,189,119,.065);
  font-size:10px!important;letter-spacing:.035em;color:#d9c17e!important;font-weight:850!important
}
.myov-dot{display:none!important}
.myov-name{font-size:17px!important;letter-spacing:.005em!important;color:#f0f3f5!important;font-weight:850!important}
.myov-edit{width:29px!important;height:29px!important;color:#7f8b94!important;border:1px solid transparent!important;transition:.14s ease}
.myov-edit:active{border-color:rgba(255,255,255,.06)!important;background:rgba(255,255,255,.035)!important}
.myov-archetype{margin-top:9px!important;gap:8px!important}
.myov-logo{width:31px!important;height:31px!important;padding:3px;border-radius:9px;background:linear-gradient(145deg,rgba(255,255,255,.032),rgba(255,255,255,.006));box-shadow:inset 0 0 0 1px rgba(255,255,255,.045);filter:drop-shadow(0 5px 9px rgba(0,0,0,.28))!important}
.myov-archcopy strong{font-size:12px!important;color:#cbd2d7!important;font-weight:820!important}
.myov-archcopy span{font-size:8.5px!important;letter-spacing:.08em!important;color:#66737d!important}
.myov-config{gap:0!important}
.myov-config-row{min-height:24px!important}
.myov-config-row .muted,.myov-config-meta .myov-meta-value,.myov-config-stars,.myov-config-stars .myov-stars,.myov-pick-label,.myov-pick-value,.myov-accel{font-size:10.5px!important}
.myov-config-stars .myov-stars{color:#d4bc76!important;text-shadow:0 0 12px rgba(215,189,119,.08)}
.myov-config-row i{color:#414b53!important}
.myov-pick-input:not(.readonly):after{color:#81714a!important;opacity:.9}
.myov-config-ps{padding-top:2px!important;min-height:28px!important}
.myov-config-theme{min-height:20px!important;margin-top:0!important}
.myov-theme-trigger{
  width:31px!important;height:21px!important;border:1px solid rgba(255,255,255,.055)!important;border-radius:8px!important;
  background:rgba(255,255,255,.018)!important;color:#84909a!important;font-size:14px!important;letter-spacing:1.5px!important
}
.myov-theme-trigger:active{border-color:rgba(215,189,119,.20)!important;background:rgba(215,189,119,.06)!important;color:#d1ba78!important}
.myov-divider{margin:0 14px!important;background:linear-gradient(90deg,transparent,rgba(215,189,119,.11) 10%,rgba(255,255,255,.055) 45%,rgba(255,255,255,.035) 90%,transparent)!important}
.myov-attrs{padding:12px 10px 13px!important;background:linear-gradient(180deg,rgba(2,6,9,.10),rgba(2,5,8,.26))!important}
.myov-attrs-head{padding:0 3px 9px!important}
.myov-attrs-title strong,.myov-attrs-head>strong{font-size:11.5px!important;color:#c4cdd2!important;letter-spacing:.015em}
.myov-attrs-title span,.myov-attrs-head>span{margin-top:3px!important;font-size:8.8px!important;color:#65717a!important}
.myov-attrs-tools{gap:5px!important}
.myov-toggle{
  min-height:25px!important;padding:0 9px!important;border-color:rgba(255,255,255,.07)!important;
  background:rgba(255,255,255,.018)!important;color:#75818a!important;font-size:9.2px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.02)
}
.myov-toggle.on{border-color:rgba(215,189,119,.20)!important;background:linear-gradient(180deg,rgba(215,189,119,.085),rgba(215,189,119,.045))!important;color:#d7c17e!important}
.myov-attr-grid{gap:7px!important}
.myov-attr-col{
  padding:8px 8px 9px!important;border-color:rgba(255,255,255,.055)!important;border-radius:12px!important;
  background:linear-gradient(160deg,rgba(255,255,255,.029),rgba(255,255,255,.010))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018)
}
.myov-group+.myov-group{margin-top:9px!important}
.myov-group h4{margin-bottom:5px!important;padding-bottom:4px!important;border-color:rgba(255,255,255,.045)!important;font-size:10.5px!important;letter-spacing:.02em!important;color:#c8ae67!important}
.myov-attr-row{min-height:20px!important}
.myov-attr-row span{font-size:9.6px!important;color:#849099!important;font-weight:560!important}
.myov-attr-row b{font-size:12.8px!important;font-weight:610!important;text-shadow:0 1px 6px rgba(0,0,0,.18)}
/* command dock */
.my-overview-actions{
  margin-top:10px!important;padding:4px!important;gap:0!important;border:1px solid rgba(255,255,255,.06)!important;border-radius:15px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.027),rgba(255,255,255,.012))!important;
  box-shadow:0 12px 28px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.018)!important;overflow:hidden
}
.my-overview-actions .my-action,
.my-overview-actions .my-action.primary,
.my-overview-actions .my-action.accent,
.my-overview-actions .my-sim-action{
  height:39px!important;border:0!important;border-radius:10px!important;background:transparent!important;color:#adb6bc!important;font-size:10.8px!important;font-weight:790!important;box-shadow:none!important;letter-spacing:.01em!important
}
.my-overview-actions .my-action+ .my-action:before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:1px;background:rgba(255,255,255,.055)}
.my-overview-actions .my-action:active{background:rgba(215,189,119,.065)!important;color:#d8c17d!important;transform:none!important}
.my-overview-actions #mySaveCurrentBtn{color:#d3c086!important}
.my-sim-action sup{right:6px!important;top:4px!important;padding:2px 3px;border-radius:4px;background:rgba(215,189,119,.09);font-size:5.5px!important;color:#d2b86f!important}
/* library */
.my-library{margin-top:26px!important}
.my-library-head{align-items:center!important;margin:0 2px 10px!important}
.my-library-title{display:flex;align-items:baseline;gap:8px}
.my-library-title strong{font-size:14.5px!important;color:#e5eaed!important;font-weight:850!important}
.my-library-title span{margin-top:0!important;font-size:9px!important;color:#68747d!important;letter-spacing:.03em}
.my-sort{
  height:31px!important;padding:0 11px!important;border-color:rgba(255,255,255,.065)!important;border-radius:10px!important;
  background:rgba(255,255,255,.018)!important;color:#87929a!important;font-size:9.5px!important
}
.my-sort:active{border-color:rgba(215,189,119,.18)!important;background:rgba(215,189,119,.045)!important;color:#c9b374!important}
.my-build-list{gap:8px!important}
.my-build-card{
  position:relative!important;min-height:82px!important;padding:10px 11px 10px 12px!important;gap:11px!important;
  border-color:rgba(255,255,255,.058)!important;border-radius:15px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.027),rgba(255,255,255,.010))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.014);overflow:hidden;transition:background .14s ease,border-color .14s ease,transform .08s ease
}
.my-build-card:before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:2px;border-radius:0 2px 2px 0;background:linear-gradient(180deg,rgba(215,189,119,.70),rgba(215,189,119,.14));opacity:.68}
.my-build-card:active{transform:scale(.994);border-color:rgba(215,189,119,.15)!important;background:linear-gradient(145deg,rgba(215,189,119,.05),rgba(255,255,255,.012))!important}
.my-build-logo{width:38px!important;height:38px!important;padding:5px!important;border-radius:11px!important;background:rgba(255,255,255,.018)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.045)}
.my-build-copy strong{font-size:12.5px!important;color:#e5e9ec!important;letter-spacing:.005em}
.my-build-copy span{margin-top:4px!important;font-size:9.2px!important;color:#6f7b84!important}
.my-build-meta{margin-top:5px!important;font-size:9.7px!important;color:#99a2a8!important;font-weight:680!important}
.my-build-chevron{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.018);font-size:17px!important;color:#68737c!important;padding:0!important}
.my-empty{border-color:rgba(255,255,255,.06)!important;border-radius:16px!important;background:linear-gradient(145deg,rgba(255,255,255,.018),rgba(255,255,255,.006))!important}
/* theme popover */
.my-theme-menu{
  padding:8px!important;border-color:rgba(215,189,119,.14)!important;border-radius:14px!important;
  background:linear-gradient(180deg,rgba(18,25,31,.995),rgba(8,13,17,.995))!important;
  box-shadow:0 20px 52px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.025)!important
}
.my-theme-head{font-size:8px!important;letter-spacing:.15em!important;color:#66727b!important}
.my-theme-option{border-radius:10px!important}.my-theme-option.active{background:rgba(215,189,119,.065)!important}.my-theme-copy strong{color:#dfe5e8!important}.my-theme-check{color:#d8bf77!important}
/* sheets */
.my-overlay{background:rgba(1,4,7,.66)!important;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.my-sheet{
  border-color:rgba(255,255,255,.075)!important;border-radius:24px 24px 0 0!important;
  background:linear-gradient(180deg,#111920 0%,#0b1116 56%,#080d11 100%)!important;
  box-shadow:0 -24px 64px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.026)!important
}
.my-sheet:before{content:"";display:block;width:34px;height:3px;margin:-5px auto 12px;border-radius:99px;background:rgba(255,255,255,.12)}
.my-sheet-head small{font-size:8.5px!important;letter-spacing:.12em!important;color:#67737d!important}.my-sheet-head strong{font-size:15.5px!important;color:#ebeff1!important}.my-close{border-color:rgba(255,255,255,.06)!important;background:rgba(255,255,255,.018)!important;color:#89949c!important}
.my-name-input{border-color:rgba(255,255,255,.07)!important;background:rgba(255,255,255,.018)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.012)}
.my-name-input:focus{border-color:rgba(215,189,119,.26)!important;box-shadow:0 0 0 3px rgba(215,189,119,.045)!important}
/* similarity */
.my-sim-backdrop{background:rgba(1,4,7,.72)!important;backdrop-filter:blur(5px)!important;-webkit-backdrop-filter:blur(5px)!important}
.my-sim-panel{
  border-color:rgba(215,189,119,.16)!important;border-radius:0 0 24px 24px!important;
  background:linear-gradient(180deg,#111920 0%,#0b1116 60%,#080d11 100%)!important;
  box-shadow:0 28px 72px rgba(0,0,0,.54),inset 0 -1px 0 rgba(255,255,255,.02)!important
}
.my-sim-grip{background:rgba(255,255,255,.13)!important}
.my-sim-head{border-color:rgba(255,255,255,.052)!important}
.my-sim-title small{letter-spacing:.16em!important;color:#69757e!important}.my-sim-title strong{color:#edf1f3!important}.my-sim-title span{border-color:rgba(215,189,119,.18)!important;background:rgba(215,189,119,.065)!important;color:#d7bf78!important}
.my-sim-close{border-color:rgba(255,255,255,.06)!important;background:rgba(255,255,255,.015)!important}
.my-sim-mode{padding:4px!important;border-color:rgba(255,255,255,.055)!important;border-radius:12px!important;background:rgba(0,0,0,.16)!important}
.my-sim-mode button{height:33px!important;border-radius:9px!important}.my-sim-mode button.active{background:linear-gradient(180deg,rgba(215,189,119,.085),rgba(215,189,119,.045))!important;color:#d9c27e!important;box-shadow:inset 0 0 0 1px rgba(215,189,119,.12)!important}
.my-sim-generate{height:39px!important;border-color:rgba(215,189,119,.18)!important;border-radius:12px!important;background:linear-gradient(180deg,rgba(215,189,119,.095),rgba(215,189,119,.038))!important;color:#dcc67f!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.018)}
.my-sim-player{border-color:rgba(255,255,255,.055)!important;border-radius:13px!important;background:linear-gradient(145deg,rgba(255,255,255,.023),rgba(255,255,255,.010))!important}.my-sim-player:first-child{border-color:rgba(215,189,119,.17)!important;background:linear-gradient(135deg,rgba(215,189,119,.065),rgba(255,255,255,.012) 60%)!important}
.my-sim-stat{background:rgba(0,0,0,.14)!important;border:1px solid rgba(255,255,255,.025)}
/* bottom navigation preview for the visual system */
body.my-view .nav{
  border-top-color:rgba(255,255,255,.055)!important;
  background:linear-gradient(180deg,rgba(10,15,20,.91),rgba(7,11,15,.97))!important;
  box-shadow:0 -12px 34px rgba(0,0,0,.20);backdrop-filter:blur(22px)!important;-webkit-backdrop-filter:blur(22px)!important
}
body.my-view .nav button{color:#69757e!important;transition:color .15s ease,transform .10s ease}
body.my-view .nav button.active{color:#d6bd78!important}
body.my-view .nav button.active:before{inset:1px 5px!important;border:1px solid rgba(215,189,119,.10);background:linear-gradient(180deg,rgba(215,189,119,.075),rgba(215,189,119,.025))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.018)}
body.my-view .nav button:active{transform:translateY(1px)}
@media(max-width:360px){
  .my-page{padding-left:10px!important;padding-right:10px!important}
  .my-page-title{padding-left:12px!important}
  .my-overview-section{margin-top:11px!important}
  .myov-info{padding-left:11px!important;padding-right:11px!important}
  .myov-name{font-size:15.5px!important}
  .myov-logo{width:29px!important;height:29px!important}
  .myov-attrs{padding-left:7px!important;padding-right:7px!important}
  .myov-attr-grid{gap:5px!important}.myov-attr-col{padding-left:6px!important;padding-right:6px!important}
  .my-overview-actions .my-action,.my-overview-actions .my-action.primary,.my-overview-actions .my-action.accent,.my-overview-actions .my-sim-action{font-size:9.7px!important}
}
@media(prefers-reduced-motion:reduce){.my-build-card,.my-action,.myov-theme-trigger,body.my-view .nav button{transition:none!important}}

/* v1.11 · My Builds refinement pass */
.my-page-title{height:64px!important;gap:11px!important;padding-top:6px!important}
.my-page-title .cn{font-size:19px!important;font-weight:760!important;letter-spacing:.055em!important;color:#eef1f2!important;text-shadow:0 1px 12px rgba(0,0,0,.22)}
.my-page-title .en{margin-top:4px!important;font-family:"Ink Free","Segoe Print","Segoe Script","Bradley Hand",cursive!important;font-size:18px!important;font-style:italic!important;font-weight:800!important;text-transform:none!important;letter-spacing:.015em!important;line-height:1!important;color:rgba(220,196,128,.78)!important;transform:rotate(-2deg);transform-origin:left center}

.myov-top-grid{grid-template-columns:minmax(0,.52fr) minmax(0,.48fr)!important;gap:8px!important}
.myov-title-line{gap:5px!important}
.myov-level{height:21px!important;padding:0 6px!important;font-size:9.6px!important}
.myov-dot{display:none!important}
.myov-name{font-size:16px!important;flex:1 1 auto!important;max-width:none!important}
.myov-edit{width:25px!important;height:25px!important;flex:0 0 25px!important}
.myov-config-row i{margin-left:3px!important;margin-right:3px!important}
.myov-config-row .muted,.myov-config-meta .myov-meta-value,.myov-config-stars,.myov-config-stars .myov-stars,.myov-pick-label,.myov-pick-value,.myov-accel{font-size:9.9px!important}
@media(max-width:365px){.myov-top-grid{grid-template-columns:minmax(0,.50fr) minmax(0,.50fr)!important;gap:6px!important}.myov-name{font-size:14.8px!important}.myov-config-row .muted,.myov-config-meta .myov-meta-value,.myov-config-stars,.myov-config-stars .myov-stars,.myov-pick-label,.myov-pick-value,.myov-accel{font-size:9.35px!important}}

.my-build-list{gap:6px!important}
.my-build-card{min-height:64px!important;padding:7px 9px 7px 10px!important;gap:9px!important;border-radius:13px!important;grid-template-columns:34px minmax(0,1fr) 23px!important}
.my-build-card:before{top:12px!important;bottom:12px!important}
.my-build-logo{width:32px!important;height:32px!important;padding:4px!important;border-radius:9px!important}
.my-build-copy strong{font-size:12px!important;line-height:1.08!important}
.my-build-copy span{margin-top:2px!important;font-size:8.8px!important;line-height:1.12!important}
.my-build-meta{margin-top:3px!important;font-size:9px!important;line-height:1.12!important}
.my-build-chevron{width:22px!important;height:22px!important;border-radius:7px!important;font-size:15px!important}

.my-sim-player-head{grid-template-columns:18px minmax(0,1fr) auto!important;gap:6px!important}
.my-sim-matchline{display:flex;align-items:baseline;justify-content:flex-end;gap:4px;white-space:nowrap;min-width:0}
.my-sim-ovr{font-size:13px;line-height:1;color:#cfd6da;font-weight:820}
.my-sim-pos{font-size:8.8px;color:#73808a;font-weight:760}
.my-sim-label{margin-left:3px;font-size:8.6px;color:#66727a;font-weight:680}
.my-sim-pct{font-size:13.2px;line-height:1;color:#d4bc75;font-weight:850}
@media(max-width:360px){.my-sim-matchline{gap:3px}.my-sim-label{margin-left:1px;font-size:8px}.my-sim-pct,.my-sim-ovr{font-size:12.5px}}

/* Bottom navigation option A · recommended floating lab dock */
.nav{left:50%!important;right:auto!important;bottom:calc(7px + env(safe-area-inset-bottom,0px))!important;width:min(414px,calc(100% - 16px))!important;height:58px!important;padding:5px 6px!important;border:1px solid rgba(255,255,255,.075)!important;border-radius:18px!important;background:linear-gradient(180deg,rgba(17,24,30,.94),rgba(7,11,15,.965))!important;box-shadow:0 16px 42px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.025)!important;-webkit-backdrop-filter:blur(24px) saturate(115%)!important;backdrop-filter:blur(24px) saturate(115%)!important;overflow:visible}
.nav button{position:relative!important;min-width:0!important;border-radius:12px!important;gap:3px!important;color:#68747d!important;font-size:8.7px!important;font-weight:760!important;transition:color .16s ease,transform .10s ease,background .16s ease!important}
.nav .icon{display:grid;place-items:center;width:26px;height:23px;border-radius:8px;font-size:13px!important;line-height:1!important;transition:.16s ease}
.nav button:before{content:none!important}
.nav button:after{content:"";position:absolute;left:50%;top:-5px;width:0;height:2px;border-radius:99px;background:#d7bd76;box-shadow:0 0 10px rgba(215,189,118,.22);transform:translateX(-50%);opacity:0;transition:width .16s ease,opacity .16s ease}
.nav button.active{color:#d9c27f!important;background:linear-gradient(180deg,rgba(215,189,119,.075),rgba(215,189,119,.022))!important}
.nav button.active .icon{background:rgba(215,189,119,.075);box-shadow:inset 0 0 0 1px rgba(215,189,119,.10)}
.nav button.active:after{width:24px;opacity:1}
.nav button:active{transform:translateY(1px)!important}
.app{padding-bottom:72px!important}
@media(prefers-reduced-motion:reduce){.nav button,.nav .icon,.nav button:after{transition:none!important}}
/* v1.12 · compact density pass + linked global themes */
body.my-view{
  --my-accent:#d7bd77;
  --my-accent-rgb:215,189,119;
  --my-accent-strong:#e1ca87;
  --my-accent-dark:#9a8248;
  --my-page-cloud:86,111,132;
  --my-page-tint:188,157,84;
}
body.my-view[data-my-theme="theme2"]{
  --my-accent:#76b59f;
  --my-accent-rgb:118,181,159;
  --my-accent-strong:#9bd0be;
  --my-accent-dark:#4d7d71;
  --my-page-cloud:74,118,127;
  --my-page-tint:118,181,159;
}
body.my-view[data-my-theme="theme3"]{
  --my-accent:#88a9d3;
  --my-accent-rgb:136,169,211;
  --my-accent-strong:#a5c0e0;
  --my-accent-dark:#5978a1;
  --my-page-cloud:84,107,141;
  --my-page-tint:108,145,184;
}
body.my-view .my-page{background:
  radial-gradient(95% 46% at 50% -8%,rgba(var(--my-page-cloud),.15),transparent 64%),
  radial-gradient(60% 26% at 96% 2%,rgba(var(--my-page-tint),.065),transparent 70%),
  linear-gradient(180deg,#0a0f14 0%,#080c10 40%,#070b0f 100%)!important}
body.my-view[data-my-theme="theme2"] .my-page{background:
  radial-gradient(95% 46% at 50% -8%,rgba(74,118,127,.16),transparent 64%),
  radial-gradient(60% 26% at 96% 2%,rgba(118,181,159,.07),transparent 70%),
  linear-gradient(180deg,#0a1215 0%,#081013 40%,#070d10 100%)!important}
body.my-view[data-my-theme="theme3"] .my-page{background:
  radial-gradient(95% 46% at 50% -8%,rgba(84,107,141,.17),transparent 64%),
  radial-gradient(60% 26% at 96% 2%,rgba(108,145,184,.075),transparent 70%),
  linear-gradient(180deg,#0d1319 0%,#0a0f15 40%,#090d12 100%)!important}
body.my-view .my-page-title{padding-right:44px!important}
body.my-view .my-page-title:before{background:linear-gradient(180deg,var(--my-accent-strong),var(--my-accent-dark))!important;box-shadow:0 0 18px rgba(var(--my-accent-rgb),.18)!important}
body.my-view .my-page-title:after{background:linear-gradient(90deg,rgba(var(--my-accent-rgb),.22),rgba(255,255,255,.045) 38%,transparent 86%)!important}
body.my-view .my-page-title .en{color:rgba(var(--my-accent-rgb),.8)!important}
.my-page-theme-btn{position:absolute;right:1px;top:17px;width:29px;height:22px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.06);border-radius:8px;background:rgba(255,255,255,.018);color:#88939c;font-size:14px;line-height:1;letter-spacing:1.2px}
.my-page-theme-btn:active{border-color:rgba(var(--my-accent-rgb),.22)!important;background:rgba(var(--my-accent-rgb),.08)!important;color:var(--my-accent)!important}

.myov-top-grid{grid-template-columns:minmax(0,.58fr) minmax(0,.42fr)!important;gap:7px!important}
.myov-title-line{gap:4px!important;min-width:0!important}
.myov-level{padding:0!important;height:auto!important;border:0!important;background:none!important;border-radius:0!important;font-size:10px!important;line-height:1!important;color:var(--my-accent)!important;font-weight:860!important;letter-spacing:.02em!important;white-space:nowrap}
.myov-dot{display:inline!important;color:#59646c!important;flex:0 0 auto}
.myov-name{font-size:15px!important;line-height:1.05!important;min-width:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.myov-edit{width:23px!important;height:23px!important;flex:0 0 23px!important}
@media(max-width:365px){.myov-top-grid{grid-template-columns:minmax(0,.56fr) minmax(0,.44fr)!important}.myov-name{font-size:14.1px!important}}

.my-overview-actions{margin-top:8px!important;padding:3px!important;border-radius:14px!important}
.my-overview-actions .my-action,.my-overview-actions .my-action.primary,.my-overview-actions .my-action.accent,.my-overview-actions .my-sim-action{height:36px!important;font-size:10.2px!important}
.my-overview-actions .my-action:active{background:rgba(var(--my-accent-rgb),.065)!important;color:var(--my-accent)!important}
.my-overview-actions #mySaveCurrentBtn{color:var(--my-accent)!important}
.my-sim-action sup{background:rgba(var(--my-accent-rgb),.10)!important;color:var(--my-accent)!important}

.my-library{margin-top:18px!important}
.my-library-head{margin:0 2px 7px!important}
.my-sort{height:29px!important;padding:0 10px!important;font-size:9.1px!important}
.my-sort:active{border-color:rgba(var(--my-accent-rgb),.20)!important;background:rgba(var(--my-accent-rgb),.05)!important;color:var(--my-accent)!important}
.my-build-list{gap:6px!important}
.my-build-card{min-height:58px!important;padding:6px 8px 6px 10px!important;gap:8px!important;border-radius:13px!important;grid-template-columns:30px minmax(0,1fr) 20px!important}
.my-build-card:before{top:10px!important;bottom:10px!important;background:linear-gradient(180deg,rgba(var(--my-accent-rgb),.72),rgba(var(--my-accent-rgb),.16))!important}
.my-build-card:active{border-color:rgba(var(--my-accent-rgb),.17)!important;background:linear-gradient(145deg,rgba(var(--my-accent-rgb),.045),rgba(255,255,255,.012))!important}
.my-build-logo{width:30px!important;height:30px!important;padding:4px!important;border-radius:9px!important}
.my-build-copy strong{font-size:11.8px!important;line-height:1.06!important;color:#e7ebee!important}
.my-build-sub{display:block;margin-top:3px!important;font-size:8.9px!important;line-height:1.12!important;color:#87929b!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.my-build-chevron{width:20px!important;height:20px!important;border-radius:7px!important;font-size:14px!important}

.my-theme-menu{border-color:rgba(var(--my-accent-rgb),.16)!important}
.my-theme-option.active{background:rgba(var(--my-accent-rgb),.07)!important}
.my-theme-check{color:var(--my-accent)!important}
.myov-toggle.on{border-color:rgba(var(--my-accent-rgb),.22)!important;background:linear-gradient(180deg,rgba(var(--my-accent-rgb),.085),rgba(var(--my-accent-rgb),.045))!important;color:var(--my-accent)!important}
.my-sim-mode button.active{background:linear-gradient(180deg,rgba(var(--my-accent-rgb),.085),rgba(var(--my-accent-rgb),.045))!important;color:var(--my-accent)!important;box-shadow:inset 0 0 0 1px rgba(var(--my-accent-rgb),.12)!important}
.my-sim-generate{border-color:rgba(var(--my-accent-rgb),.18)!important;background:linear-gradient(180deg,rgba(var(--my-accent-rgb),.10),rgba(var(--my-accent-rgb),.04))!important;color:var(--my-accent)!important}
.my-sim-player:first-child{border-color:rgba(var(--my-accent-rgb),.18)!important;background:linear-gradient(135deg,rgba(var(--my-accent-rgb),.07),rgba(255,255,255,.012) 60%)!important}
.my-sim-pct,.myov-group h4{color:var(--my-accent)!important}
.nav button.active{color:var(--my-accent)!important;background:linear-gradient(180deg,rgba(var(--my-accent-rgb),.075),rgba(var(--my-accent-rgb),.022))!important}
.nav button.active .icon{background:rgba(var(--my-accent-rgb),.075)!important;box-shadow:inset 0 0 0 1px rgba(var(--my-accent-rgb),.10)!important}
.nav button:after{background:var(--my-accent)!important;box-shadow:0 0 10px rgba(var(--my-accent-rgb),.22)!important}




/* v1.13 · theme atmosphere only; interaction semantics stay gold */
body.my-view{
  --semantic-gold:#d7bd77;
  --semantic-gold-rgb:215,189,119;
  --semantic-gold-strong:#e1ca87;
  --semantic-gold-dark:#9a8248;
}
/* Theme may color atmosphere / decoration */
body.my-view .my-page-title:before{
  background:linear-gradient(180deg,var(--my-accent-strong),var(--my-accent-dark))!important;
  box-shadow:0 0 18px rgba(var(--my-accent-rgb),.18)!important
}
body.my-view .my-page-title:after{
  background:linear-gradient(90deg,rgba(var(--my-accent-rgb),.22),rgba(255,255,255,.045) 38%,transparent 86%)!important
}
body.my-view .my-page-title .en{color:rgba(var(--my-accent-rgb),.82)!important}
.my-build-card:before{background:linear-gradient(180deg,rgba(var(--my-accent-rgb),.72),rgba(var(--my-accent-rgb),.16))!important}
body.my-view[data-my-theme="theme1"] .my-build-copy strong{color:#e7ebee!important}
body.my-view[data-my-theme="theme2"] .my-build-copy strong{color:#dce9e4!important}
body.my-view[data-my-theme="theme3"] .my-build-copy strong{color:#dfe7f0!important}

/* Interactive / selected / active states remain semantic gold */
.my-page-theme-btn:active{
  border-color:rgba(var(--semantic-gold-rgb),.22)!important;
  background:rgba(var(--semantic-gold-rgb),.08)!important;
  color:var(--semantic-gold)!important
}
.myov-level{color:var(--semantic-gold)!important}
.my-overview-actions .my-action:active{
  background:rgba(var(--semantic-gold-rgb),.065)!important;
  color:var(--semantic-gold)!important
}
.my-overview-actions #mySaveCurrentBtn{color:var(--semantic-gold)!important}
.my-sim-action sup{background:rgba(var(--semantic-gold-rgb),.10)!important;color:var(--semantic-gold)!important}
.my-sort:active{
  border-color:rgba(var(--semantic-gold-rgb),.20)!important;
  background:rgba(var(--semantic-gold-rgb),.05)!important;
  color:var(--semantic-gold)!important
}
.my-theme-menu{border-color:rgba(var(--semantic-gold-rgb),.16)!important}
.my-theme-option.active{background:rgba(var(--semantic-gold-rgb),.07)!important}
.my-theme-check{color:var(--semantic-gold)!important}
.myov-toggle.on{
  border-color:rgba(var(--semantic-gold-rgb),.22)!important;
  background:linear-gradient(180deg,rgba(var(--semantic-gold-rgb),.085),rgba(var(--semantic-gold-rgb),.045))!important;
  color:var(--semantic-gold)!important
}
.my-sim-mode button.active{
  background:linear-gradient(180deg,rgba(var(--semantic-gold-rgb),.085),rgba(var(--semantic-gold-rgb),.045))!important;
  color:var(--semantic-gold)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--semantic-gold-rgb),.12)!important
}
.my-sim-generate{
  border-color:rgba(var(--semantic-gold-rgb),.18)!important;
  background:linear-gradient(180deg,rgba(var(--semantic-gold-rgb),.10),rgba(var(--semantic-gold-rgb),.04))!important;
  color:var(--semantic-gold)!important
}
.my-sim-player:first-child{
  border-color:rgba(var(--semantic-gold-rgb),.18)!important;
  background:linear-gradient(135deg,rgba(var(--semantic-gold-rgb),.07),rgba(255,255,255,.012) 60%)!important
}
.my-sim-pct,.myov-group h4{color:var(--semantic-gold)!important}
.nav button.active{
  color:var(--semantic-gold)!important;
  background:linear-gradient(180deg,rgba(var(--semantic-gold-rgb),.075),rgba(var(--semantic-gold-rgb),.022))!important
}
.nav button.active .icon{
  background:rgba(var(--semantic-gold-rgb),.075)!important;
  box-shadow:inset 0 0 0 1px rgba(var(--semantic-gold-rgb),.10)!important
}
.nav button:after{
  background:var(--semantic-gold)!important;
  box-shadow:0 0 10px rgba(var(--semantic-gold-rgb),.22)!important
}


/* v1.14 · save/library recovery + full-width playstyle row + theme cleanup */
.myov-ps-row{display:block;width:100%;margin-top:7px!important;min-width:0!important}
.myov-ps-row .myov-config-ps{width:100%!important;min-height:30px!important;justify-content:flex-end!important;overflow:hidden!important}
.myov-ps-row .myov-config-ps .myov-ps-icons,.myov-ps-row .myov-config-ps .myov-ps-strip{display:flex!important;width:100%!important;justify-content:flex-end!important;align-items:center!important;gap:4px!important;flex-wrap:nowrap!important;overflow:hidden!important;min-width:0!important}
.myov-ps-row .myov-config-ps .myov-ps-badge{flex:0 0 auto!important}
.my-overview-card[data-theme="theme2"] .myov-theme-floor{inset:auto 0 0!important;height:31%!important;background:linear-gradient(180deg,transparent,rgba(116,177,158,.045) 28%,rgba(10,15,19,.16) 100%)!important;opacity:.84!important;mask-image:linear-gradient(180deg,transparent,#000 24%,#000)!important;-webkit-mask-image:linear-gradient(180deg,transparent,#000 24%,#000)!important}
@media(max-width:360px){.myov-ps-row .myov-config-ps .myov-ps-icons,.myov-ps-row .myov-config-ps .myov-ps-strip{gap:3px!important}.myov-ps-row .myov-config-ps .myov-ps-badge{width:22px!important;height:22px!important;flex-basis:22px!important}}


/* v1.15 · restore compact playstyle position + strengthen saved-build actions */
.myov-info{position:relative!important;padding-bottom:40px!important}
.myov-top-grid{min-height:96px!important;align-items:start!important}
.myov-config{position:static!important}
.myov-config-ps{position:absolute!important;left:14px!important;right:14px!important;bottom:9px!important;width:auto!important;min-height:24px!important;margin-top:0!important;padding-top:0!important;justify-content:flex-end!important;overflow:hidden!important}
.myov-config-ps .myov-ps-icons,.myov-config-ps .myov-ps-strip{display:flex!important;width:100%!important;justify-content:flex-end!important;align-items:center!important;gap:4px!important;flex-wrap:nowrap!important;overflow:hidden!important;min-width:0!important}
.myov-config-ps .myov-ps-badge{flex:0 0 auto!important}
.myov-divider{margin-top:0!important}
.myov-ps-row{display:none!important}
@media(max-width:360px){.myov-info{padding-bottom:38px!important}.myov-top-grid{min-height:92px!important}.myov-config-ps{left:11px!important;right:11px!important;bottom:8px!important}.myov-config-ps .myov-ps-icons,.myov-config-ps .myov-ps-strip{gap:3px!important}}


/* v1.16 · playstyle row uses original vertical slot, gains width only to the left */
.myov-info{padding-bottom:12px!important}
.myov-top-grid{position:relative!important;height:116px!important;min-height:116px!important;align-items:start!important}
.myov-config{position:static!important}
.myov-config-ps{position:absolute!important;left:0!important;right:0!important;bottom:0!important;width:auto!important;height:28px!important;min-height:28px!important;margin:0!important;padding:0!important;justify-content:flex-end!important;overflow:hidden!important}
.myov-config-ps .myov-ps-icons,.myov-config-ps .myov-ps-strip{display:flex!important;width:100%!important;height:28px!important;justify-content:flex-end!important;align-items:center!important;gap:4px!important;flex-wrap:nowrap!important;overflow:hidden!important;min-width:0!important}
.myov-config-ps .myov-ps-badge{flex:0 0 auto!important}
.myov-divider{margin-top:0!important}
.myov-toggle{touch-action:manipulation}
@media(max-width:360px){.myov-info{padding-bottom:11px!important}.myov-top-grid{height:110px!important;min-height:110px!important}.myov-config-ps,.myov-config-ps .myov-ps-icons,.myov-config-ps .myov-ps-strip{height:26px!important;min-height:26px!important}.myov-config-ps .myov-ps-icons,.myov-config-ps .myov-ps-strip{gap:3px!important}}


/* =========================================================
   v1.19 FINAL GLOBAL OVERRIDE
   My Builds visual language on all five pages.
   Atmosphere follows Theme 1/2/3. Interactive semantics stay gold.
   ========================================================= */
body{
  --semantic-gold:#d7bd77;
  --semantic-gold-rgb:215,189,119;
  --global-atmo:#c9ab5c;
  --global-atmo-rgb:201,171,92;
  --global-cloud-rgb:86,111,132;
  --global-bg-top:#0a0f14;
  --global-bg-mid:#080c10;
  --global-bg-bottom:#070b0f;
  --global-panel:#0e151b;
  --global-panel-2:#0a1015;
}
body[data-my-theme="theme2"]{
  --global-atmo:#76b59f;--global-atmo-rgb:118,181,159;--global-cloud-rgb:74,118,127;
  --global-bg-top:#091315;--global-bg-mid:#081014;--global-bg-bottom:#070d10;
  --global-panel:#0d1719;--global-panel-2:#081113;
}
body[data-my-theme="theme3"]{
  --global-atmo:#88a9d3;--global-atmo-rgb:136,169,211;--global-cloud-rgb:84,107,141;
  --global-bg-top:#0d141b;--global-bg-mid:#0a1016;--global-bg-bottom:#090d12;
  --global-panel:#10171f;--global-panel-2:#0a1017;
}
html,body{background:var(--global-bg-bottom)!important}
body .app{
  background:
    radial-gradient(105% 360px at 50% -95px,rgba(var(--global-cloud-rgb),.19),transparent 66%),
    radial-gradient(68% 260px at 104% 4%,rgba(var(--global-atmo-rgb),.065),transparent 72%),
    linear-gradient(180deg,var(--global-bg-top) 0%,var(--global-bg-mid) 43%,var(--global-bg-bottom) 100%)!important;
}
body .app:before{
  opacity:.38!important;background-size:34px 34px!important;
  background-image:linear-gradient(rgba(255,255,255,.014) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.011) 1px,transparent 1px)!important;
}
body #scroll,body #playstylesMobilePage,body #enhanceMobilePage,body #apToolsMobilePage,body #myBuildsMobilePage{
  position:relative!important;background:transparent!important;padding-left:13px!important;padding-right:13px!important;
}

/* ----- same title language on EVERY page ----- */
body #scroll>.mobile-context-title,
body #playstylesMobilePage>.mobile-context-title,
body #enhanceMobilePage>.mobile-context-title,
body #apToolsMobilePage>.aptool-page-title,
body #myBuildsMobilePage>.my-page-title{
  position:relative!important;height:66px!important;display:flex!important;align-items:center!important;gap:11px!important;
  padding:7px 68px 0 14px!important;margin:0!important;white-space:nowrap!important;background:transparent!important;border:0!important;
}
body #scroll>.mobile-context-title:before,
body #playstylesMobilePage>.mobile-context-title:before,
body #enhanceMobilePage>.mobile-context-title:before,
body #apToolsMobilePage>.aptool-page-title:before,
body #myBuildsMobilePage>.my-page-title:before{
  content:""!important;position:absolute!important;left:1px!important;top:24px!important;width:3px!important;height:20px!important;border-radius:99px!important;
  background:linear-gradient(180deg,rgba(var(--global-atmo-rgb),.96),rgba(var(--global-atmo-rgb),.42))!important;
  box-shadow:0 0 18px rgba(var(--global-atmo-rgb),.19)!important;
}
body #scroll>.mobile-context-title:after,
body #playstylesMobilePage>.mobile-context-title:after,
body #enhanceMobilePage>.mobile-context-title:after,
body #apToolsMobilePage>.aptool-page-title:after,
body #myBuildsMobilePage>.my-page-title:after{
  content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:1px!important;
  background:linear-gradient(90deg,rgba(var(--global-atmo-rgb),.23),rgba(255,255,255,.045) 38%,transparent 88%)!important;
}
body .mobile-context-title .cn,body .aptool-page-title .cn,body .my-page-title .cn{
  font-size:19px!important;line-height:1!important;font-weight:790!important;letter-spacing:.045em!important;color:#edf1f3!important;text-shadow:0 1px 12px rgba(0,0,0,.20)!important;
}
body .mobile-context-title .en,body .aptool-page-title .en,body .my-page-title .en{
  margin-top:4px!important;font-family:"Ink Free","Segoe Print","Segoe Script","Bradley Hand",cursive!important;font-size:18px!important;line-height:1!important;
  font-style:italic!important;font-weight:800!important;text-transform:none!important;letter-spacing:.015em!important;color:rgba(var(--global-atmo-rgb),.82)!important;
  text-shadow:none!important;transform:rotate(-2deg)!important;transform-origin:left center!important;
}
body .mobile-context-title .en:before,body .aptool-page-title .en:before,body .my-page-title .en:before{content:none!important}

/* ----- larger, shape-only theme button: no font/glyph -> cannot乱码 ----- */
body .page-theme-btn{
  position:absolute!important;right:4px!important;top:14px!important;width:52px!important;height:38px!important;padding:0!important;border:1px solid rgba(255,255,255,.095)!important;
  border-radius:14px!important;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.017))!important;color:transparent!important;
  display:grid!important;place-items:center!important;box-shadow:0 10px 26px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.055)!important;
  -webkit-backdrop-filter:blur(18px) saturate(118%)!important;backdrop-filter:blur(18px) saturate(118%)!important;z-index:40!important;overflow:hidden!important;
}
body .page-theme-btn:before{content:""!important;position:absolute!important;inset:-1px!important;border-radius:inherit!important;background:radial-gradient(circle at 50% 0%,rgba(var(--global-atmo-rgb),.20),transparent 66%)!important;pointer-events:none!important}
body .page-theme-btn:active{transform:scale(.965)!important;border-color:rgba(var(--semantic-gold-rgb),.25)!important;background:linear-gradient(180deg,rgba(var(--semantic-gold-rgb),.075),rgba(255,255,255,.018))!important}
body .global-theme-dots{position:relative!important;z-index:2!important;width:26px!important;height:12px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important}
body .global-theme-dots .theme-dot{display:block!important;width:5px!important;height:5px!important;flex:0 0 5px!important;border-radius:50%!important;background:#aab3b9!important;box-shadow:0 0 8px rgba(0,0,0,.25)!important}
body .global-theme-dots .theme-dot:nth-child(2){width:6px!important;height:6px!important;flex-basis:6px!important;background:var(--global-atmo)!important;box-shadow:0 0 12px rgba(var(--global-atmo-rgb),.30)!important}

/* theme popover */
body #myThemeMenu.global-theme-menu{
  position:fixed!important;z-index:320!important;min-width:192px!important;max-width:calc(100vw - 16px)!important;padding:8px!important;
  border:1px solid rgba(255,255,255,.085)!important;border-radius:15px!important;background:linear-gradient(180deg,rgba(17,24,30,.995),rgba(8,13,17,.997))!important;
  box-shadow:0 24px 64px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.028)!important;
}
body #myThemeMenu .my-theme-head{padding:4px 7px 8px!important;color:#6e7982!important}
body #myThemeMenu .my-theme-option{min-height:43px!important;padding:7px 8px!important;border-radius:10px!important;background:transparent!important}
body #myThemeMenu .my-theme-option.active{background:rgba(var(--semantic-gold-rgb),.07)!important;box-shadow:inset 0 0 0 1px rgba(var(--semantic-gold-rgb),.07)!important}
body #myThemeMenu .my-theme-check{color:var(--semantic-gold)!important}

/* ----- universal top context card, matches My Builds card shell ----- */
body .sticky.mobile-context-selector{
  margin:10px 0 11px!important;padding:0!important;background:transparent!important;box-shadow:none!important;border:0!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
}
body .sticky.mobile-context-selector .identity{
  min-height:54px!important;padding:8px 10px!important;border:1px solid rgba(255,255,255,.060)!important;border-radius:16px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.030),rgba(var(--global-atmo-rgb),.010) 48%,rgba(255,255,255,.007))!important;
  box-shadow:0 12px 28px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.022)!important;
}
body .sticky.mobile-context-selector .apwrap{margin:7px 3px 0!important;padding:0!important}
body .sticky.mobile-context-selector .aptrack{height:4px!important;border-radius:99px!important;background:rgba(255,255,255,.050)!important;overflow:hidden!important}
body .sticky.mobile-context-selector .dropdown{border:1px solid rgba(255,255,255,.075)!important;border-radius:15px!important;background:linear-gradient(180deg,#111920,#090e13)!important;box-shadow:0 22px 58px rgba(0,0,0,.46)!important}

/* ----- BUILD PAGE ----- */
body #scroll>.gap{height:2px!important}
body #scroll>.rule{height:1px!important;margin:7px 0!important;background:linear-gradient(90deg,transparent,rgba(255,255,255,.050) 9%,rgba(255,255,255,.050) 91%,transparent)!important}
body #scroll .quick{
  margin:7px 0!important;padding:4px!important;min-height:45px!important;border:1px solid rgba(255,255,255,.058)!important;border-radius:14px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.026),rgba(255,255,255,.010))!important;box-shadow:0 10px 24px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.018)!important;
}
body #scroll .quickitem{min-height:35px!important;border-radius:10px!important;padding:0 10px!important}
body #scroll .body{
  margin:8px 0 0!important;border:1px solid rgba(255,255,255,.058)!important;border-radius:17px!important;overflow:hidden!important;
  background:linear-gradient(145deg,rgba(255,255,255,.027),rgba(var(--global-atmo-rgb),.008) 50%,rgba(255,255,255,.006))!important;
  box-shadow:0 13px 30px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.018)!important;
}
body #scroll .bodyrow{padding:10px 11px!important}
body #scroll .bodydetail{border-top-color:rgba(255,255,255,.045)!important;background:rgba(0,0,0,.08)!important}
body #scroll .cross{border-color:rgba(255,255,255,.055)!important;border-radius:14px!important;background:radial-gradient(circle at 58% 42%,rgba(var(--global-atmo-rgb),.055),transparent 43%),rgba(7,12,16,.58)!important}
body #scroll .attrs{margin-top:9px!important}
body #scroll .cat{
  margin-bottom:7px!important;border:1px solid rgba(255,255,255,.052)!important;border-radius:14px!important;overflow:hidden!important;
  background:linear-gradient(145deg,rgba(255,255,255,.023),rgba(var(--global-atmo-rgb),.006) 52%,rgba(255,255,255,.004))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.013)!important;
}
body #scroll .cathead{height:39px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;padding-left:11px!important;padding-right:11px!important}
body #scroll .cat:not(.collapsed) .cathead{background:linear-gradient(90deg,rgba(var(--global-atmo-rgb),.035),transparent 58%)!important}

/* ----- PLAYSTYLES PAGE ----- */
body #playstylesMobilePage .psm-loadout,
body #playstylesMobilePage .psm-spec,
body #playstylesMobilePage .psm-detail-card{
  border:1px solid rgba(255,255,255,.058)!important;border-radius:18px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.028),rgba(var(--global-atmo-rgb),.009) 50%,rgba(255,255,255,.006))!important;
  box-shadow:0 14px 32px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.019)!important;
}
body #playstylesMobilePage .psm-loadout{margin-top:7px!important}
body #playstylesMobilePage .psm-spec{margin-top:9px!important}
body #playstylesMobilePage .psm-spec-static-head{padding:11px 12px 8px!important}
body #playstylesMobilePage .psm-spec-static-head span,body #playstylesMobilePage .psm-category-head span{color:rgba(var(--global-atmo-rgb),.63)!important}
body #playstylesMobilePage .psm-library-inner,
body #playstylesMobilePage .psm-amp-picker-inner,
body #playstylesMobilePage .psm-signature-picker-inner{
  border:1px solid rgba(255,255,255,.065)!important;border-radius:18px!important;background:linear-gradient(180deg,#111920,#090e13)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.018)!important;
}

/* ----- ENHANCE PAGE ----- */
body #enhanceMobilePage .enh-section{margin-top:9px!important}
body #enhanceMobilePage .enh-card,
body #enhanceMobilePage .facility-info-card,
body #enhanceMobilePage .facility-summary,
body #enhanceMobilePage .facility-card-mobile{
  border:1px solid rgba(255,255,255,.058)!important;border-radius:17px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.028),rgba(var(--global-atmo-rgb),.008) 50%,rgba(255,255,255,.006))!important;
  box-shadow:0 13px 30px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.018)!important;
}
body #enhanceMobilePage .mastery-quickbar{margin:8px 8px 10px!important;padding:4px!important;border:1px solid rgba(255,255,255,.050)!important;border-radius:13px!important;background:rgba(0,0,0,.12)!important}
body #enhanceMobilePage .facility-mobile-head{position:relative!important;margin:18px 2px 8px!important;padding-left:11px!important}
body #enhanceMobilePage .facility-mobile-head:before{content:""!important;position:absolute!important;left:0!important;top:2px!important;bottom:2px!important;width:2px!important;border-radius:99px!important;background:rgba(var(--global-atmo-rgb),.72)!important}
body #enhanceMobilePage .facility-mobile-head span{color:rgba(var(--global-atmo-rgb),.65)!important}
body #enhanceMobilePage .facility-level-menu,
body #enhanceMobilePage .facility-picker-sheet,
body #enhanceMobilePage .mastery-aggregate-pop{border-color:rgba(255,255,255,.070)!important;background:linear-gradient(180deg,#111920,#090e13)!important;box-shadow:0 22px 58px rgba(0,0,0,.46)!important}

/* ----- AP TOOLS PAGE ----- */
body #apToolsMobilePage .aptool-top-card,
body #apToolsMobilePage .aptool-section{
  border:1px solid rgba(255,255,255,.058)!important;border-radius:18px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.029),rgba(var(--global-atmo-rgb),.009) 50%,rgba(255,255,255,.006))!important;
  box-shadow:0 14px 32px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.019)!important;
}
body #apToolsMobilePage .aptool-top-card{margin-top:9px!important}
body #apToolsMobilePage .aptool-section{margin-top:8px!important}
body #apToolsMobilePage .aptool-stat,body #apToolsMobilePage .aptool-group{border-color:rgba(255,255,255,.045)!important;border-radius:13px!important;background:rgba(255,255,255,.015)!important}
body #apToolsMobilePage .aptool-import-menu,
body #apToolsMobilePage .aptool-import-modal,
body #apToolsMobilePage .aptool-result-modal{border-color:rgba(255,255,255,.070)!important;background:linear-gradient(180deg,#111920,#090e13)!important;box-shadow:0 22px 58px rgba(0,0,0,.46)!important}

/* ----- shared toolbar/nav/sheets ----- */
body .context-toolbar{
  border:1px solid rgba(255,255,255,.060)!important;border-radius:15px!important;
  background:linear-gradient(180deg,rgba(16,23,29,.91),rgba(8,13,17,.96))!important;
  box-shadow:0 12px 30px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.020)!important;
  -webkit-backdrop-filter:blur(22px)!important;backdrop-filter:blur(22px)!important;
}
body .nav{
  border:1px solid rgba(255,255,255,.070)!important;border-radius:18px!important;
  background:linear-gradient(180deg,rgba(16,23,29,.94),rgba(7,11,15,.975))!important;
  box-shadow:0 16px 42px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.023)!important;
}
/* semantic interaction colors DO NOT follow atmosphere */
body .nav button.active{color:var(--semantic-gold)!important;background:linear-gradient(180deg,rgba(var(--semantic-gold-rgb),.075),rgba(var(--semantic-gold-rgb),.022))!important}
body .nav button.active .icon{background:rgba(var(--semantic-gold-rgb),.075)!important;box-shadow:inset 0 0 0 1px rgba(var(--semantic-gold-rgb),.10)!important}
body .nav button:after{background:var(--semantic-gold)!important;box-shadow:0 0 10px rgba(var(--semantic-gold-rgb),.22)!important}
body button.active,body button.selected{--semantic-active:var(--semantic-gold)}

@media(max-width:360px){
  body #scroll,body #playstylesMobilePage,body #enhanceMobilePage,body #apToolsMobilePage,body #myBuildsMobilePage{padding-left:10px!important;padding-right:10px!important}
  body #scroll>.mobile-context-title,body #playstylesMobilePage>.mobile-context-title,body #enhanceMobilePage>.mobile-context-title,body #apToolsMobilePage>.aptool-page-title,body #myBuildsMobilePage>.my-page-title{padding-left:13px!important;padding-right:64px!important}
  body .mobile-context-title .cn,body .aptool-page-title .cn,body .my-page-title .cn{font-size:18px!important}
  body .mobile-context-title .en,body .aptool-page-title .en,body .my-page-title .en{font-size:16.5px!important}
  body .page-theme-btn{right:3px!important;top:15px!important;width:47px!important;height:35px!important;border-radius:13px!important}
}


/* v1.22 · responsive browser shell + refined semantic SVG navigation */
:root{
  --bottom-nav-h:52px;
  --bottom-tool-h:42px;
  --bottom-shell-h:calc(var(--bottom-nav-h) + var(--bottom-tool-h) + 8px + env(safe-area-inset-bottom,0px));
}
html,body{background:#070b0f!important;overscroll-behavior-y:none}
@supports(height:100dvh){html,body,.app{min-height:100dvh}}

/* Browser-safe surface behind both rows. On a real phone it fills the viewport;
   on desktop/mobile-preview it stays inside the app-width shell instead of spanning Chrome. */
.bottom-dock{
  position:fixed!important;
  z-index:120!important;
  left:50%!important;right:auto!important;bottom:0!important;
  width:min(430px,100vw)!important;max-width:430px!important;
  height:var(--bottom-shell-h)!important;
  pointer-events:none!important;
  transform:translateX(-50%)!important;
  background:
    linear-gradient(180deg,rgba(7,11,15,0) 0,rgba(7,11,15,.90) 13px,rgba(7,11,15,.985) 35px,#070b0f 100%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(112%)!important;
  backdrop-filter:blur(18px) saturate(112%)!important;
}
.bottom-dock:before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.055) 8%,rgba(255,255,255,.055) 92%,transparent);
}
@media(max-width:480px){
  .bottom-dock{left:0!important;right:0!important;width:100%!important;max-width:none!important;transform:none!important}
}

/* Toolbar is a full-width utility shelf, not another floating dock. */
body .context-toolbar{
  position:absolute!important;
  pointer-events:auto!important;
  left:0!important;right:0!important;top:auto!important;
  bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom,0px))!important;
  transform:none!important;
  width:100%!important;max-width:none!important;
  height:var(--bottom-tool-h)!important;
  padding:0 12px!important;
  gap:7px!important;
  border:0!important;border-top:1px solid rgba(255,255,255,.052)!important;
  border-radius:0!important;
  background:linear-gradient(180deg,rgba(13,19,24,.96),rgba(8,13,17,.985))!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
}
body .context-toolbar .mode{height:30px!important;border-radius:9px!important}
body .context-toolbar .mode button{height:24px!important}
body .context-toolbar .tool{height:30px!important;border-radius:9px!important}

/* Navigation remains the identity/navigation layer: compact, inset, darker. */
body .nav{
  position:absolute!important;
  pointer-events:auto!important;
  left:8px!important;right:8px!important;bottom:calc(4px + env(safe-area-inset-bottom,0px))!important;
  transform:none!important;
  width:auto!important;max-width:none!important;
  height:var(--bottom-nav-h)!important;
  padding:3px 5px!important;
  gap:2px!important;
  border:1px solid rgba(255,255,255,.064)!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,rgba(14,20,25,.985),rgba(7,11,15,.995))!important;
  box-shadow:0 8px 24px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.018)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  overflow:hidden!important;
}
body .nav button{
  position:relative!important;
  min-width:0!important;
  border-radius:10px!important;
  gap:2px!important;
  padding:2px 0 1px!important;
  color:#66717a!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:8.7px!important;
  line-height:1!important;
  font-weight:760!important;
}
body .nav button:before{content:none!important}
body .nav button:after{
  content:""!important;position:absolute!important;left:50%!important;top:-3px!important;
  width:0!important;height:2px!important;border-radius:99px!important;
  transform:translateX(-50%)!important;opacity:0!important;
  background:var(--semantic-gold)!important;
  box-shadow:0 0 9px rgba(var(--semantic-gold-rgb),.20)!important;
  transition:width .15s ease,opacity .15s ease!important;
}
body .nav button.active{
  color:var(--semantic-gold)!important;
  background:transparent!important;
  box-shadow:none!important;
}
body .nav button.active:after{width:22px!important;opacity:1!important}
body .nav .icon,
body .nav button.active .icon{
  width:25px!important;height:24px!important;
  display:grid!important;place-items:center!important;
  padding:0!important;margin:0!important;
  border:0!important;border-radius:0!important;
  background:transparent!important;box-shadow:none!important;
  color:inherit!important;
}
body .nav .nav-icon svg{
  width:20px!important;height:20px!important;display:block!important;
  fill:none!important;stroke:currentColor!important;stroke-width:1.75!important;
  stroke-linecap:round!important;stroke-linejoin:round!important;
  overflow:visible!important;
}
body .nav button.active .nav-icon svg{filter:drop-shadow(0 0 5px rgba(var(--semantic-gold-rgb),.10))}
body .nav .nav-icon-style svg{stroke-width:1.6!important}
body .nav .nav-icon-boost .boost-edge{opacity:.48;stroke-width:1.45!important}
body .nav button.active .nav-icon-boost .boost-edge{opacity:.72;filter:drop-shadow(0 0 3px rgba(var(--semantic-gold-rgb),.20))}
body .nav .nav-icon-fx svg{stroke-width:1.65!important}
body .nav .nav-icon-fx .fx-bracket{opacity:.58}

/* No transparent seam: content stops above the entire bottom system. */
body:not(.my-view) .app{padding-bottom:calc(108px + env(safe-area-inset-bottom,0px))!important}
body.my-view .app{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))!important}
body #scroll,body #playstylesMobilePage,body #enhanceMobilePage,body #apToolsMobilePage{
  padding-bottom:calc(114px + env(safe-area-inset-bottom,0px))!important;
}
body #myBuildsMobilePage{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))!important}

/* On My Builds the toolbar is hidden, so shrink the opaque shell itself. */
body.my-view .bottom-dock{height:calc(var(--bottom-nav-h) + 8px + env(safe-area-inset-bottom,0px))!important}
body.my-view .context-toolbar{display:none!important}

@media(max-width:360px){
  :root{--bottom-nav-h:50px;--bottom-tool-h:40px}
  body .context-toolbar{padding-left:8px!important;padding-right:8px!important;gap:5px!important}
  body .nav{left:6px!important;right:6px!important;border-radius:15px!important}
  body .nav button{font-size:8.3px!important}
  body .nav .nav-icon svg{width:19px!important;height:19px!important}
}
@media(prefers-reduced-motion:reduce){body .nav button:after{transition:none!important}}


/* v1.23 · Safari/browser chrome hardening + real sticky top stack */
:root{--safe-top:env(safe-area-inset-top,0px)}
html,body{
  overscroll-behavior-y:auto!important;
  -webkit-overflow-scrolling:touch;
  color-scheme:dark;
}
body .app{
  padding-top:var(--safe-top)!important;
  min-height:100dvh!important;
}

/* The bottom browser shell must be opaque. Content may continue scrolling behind a fixed
   control surface, but it must never be visible through it. The visual fade lives ABOVE it. */
body .bottom-dock{
  background:var(--global-bg-bottom,#070b0f)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
body .bottom-dock:after{
  content:"";
  position:absolute;
  left:0;right:0;top:-16px;height:16px;
  pointer-events:none;
  background:linear-gradient(180deg,transparent,var(--global-bg-bottom,#070b0f));
}

/* Re-enable the persistent header that was accidentally neutralised by the global UI pass. */
body #scroll>.mobile-context-title,
body #playstylesMobilePage>.mobile-context-title,
body #enhanceMobilePage>.mobile-context-title,
body #apToolsMobilePage>.aptool-page-title,
body #myBuildsMobilePage>.my-page-title{
  position:sticky!important;
  top:var(--safe-top)!important;
  z-index:76!important;
  background:linear-gradient(180deg,var(--global-bg-top,#0a0f14) 0%,var(--global-bg-mid,#080c10) 100%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(112%)!important;
  backdrop-filter:blur(18px) saturate(112%)!important;
}

/* Archetype / build-context selector is the second row of the sticky header stack. */
body .sticky.mobile-context-selector{
  position:sticky!important;
  top:calc(var(--safe-top) + 66px)!important;
  z-index:75!important;
  margin:0 0 11px!important;
  padding:9px 0 10px!important;
  background:linear-gradient(180deg,var(--global-bg-mid,#080c10) 0%,rgba(8,12,16,.975) 78%,rgba(8,12,16,.94) 100%)!important;
  -webkit-backdrop-filter:blur(17px) saturate(110%)!important;
  backdrop-filter:blur(17px) saturate(110%)!important;
}
body .sticky.mobile-context-selector .identity{
  position:relative!important;
  z-index:1!important;
}
body .sticky.mobile-context-selector .dropdown{z-index:90!important}

/* On devices with a notch / Dynamic Island, only atmosphere extends into the status area.
   Interactive content remains below the safe inset. */
@supports(padding-top:env(safe-area-inset-top)){
  body:before{
    content:"";
    position:fixed;
    z-index:0;
    left:0;right:0;top:0;
    height:var(--safe-top);
    pointer-events:none;
    background:
      radial-gradient(70% 140% at 50% 0%,rgba(var(--global-atmo-rgb),.12),transparent 72%),
      var(--global-bg-top,#0a0f14);
  }
}


/* v1.24 · bottom density refinement + lighter nav glyphs + global snackbar */
:root{
  --bottom-tool-gap:5px;
  --global-notice-bottom:calc(var(--bottom-shell-h) + 14px);
}
body.my-view{--global-notice-bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom,0px) + 18px)}

/* Give the utility row breathing room above navigation instead of letting its controls visually sit on it. */
body .context-toolbar{
  bottom:calc(var(--bottom-nav-h) + env(safe-area-inset-bottom,0px) + var(--bottom-tool-gap))!important;
  height:var(--bottom-tool-h)!important;
  padding-top:0!important;padding-bottom:3px!important;
  align-items:center!important;
}
body .context-toolbar .mode,
body .context-toolbar .tool,
body .enh-preset-save,
body .enh-preset-slot{
  transform:translateY(-1px)!important;
}
body .context-toolbar .mode{height:29px!important}
body .context-toolbar .mode button{height:23px!important}
body .context-toolbar .tool,
body .enh-preset-save,
body .enh-preset-slot{height:29px!important}
body .context-toolbar .tool.undo,
body .context-toolbar .tool.reset,
body .enh-preset-save{width:29px!important;min-width:29px!important}

/* Keep icon footprint readable; make the drawing itself lighter and calmer. */
body .nav .nav-icon svg{
  width:20px!important;height:20px!important;
  stroke-width:1.35!important;
}
body .nav .nav-icon-style svg{stroke-width:1.22!important}
body .nav .nav-icon-boost .boost-main{stroke-width:1.38!important}
body .nav .nav-icon-boost .boost-edge{stroke-width:1.05!important;opacity:.36!important}
body .nav button.active .nav-icon-boost .boost-edge{opacity:.58!important}
body .nav .nav-icon-fx svg{stroke-width:1.28!important}
body .nav .nav-icon-build circle{stroke-width:1.25!important}
body .nav button.active .nav-icon svg{filter:drop-shadow(0 0 4px rgba(var(--semantic-gold-rgb),.08))}

/* One app-like fixed snackbar system for all transient notices.
   Older pointer/tap positioning code can keep running; !important clamps every bubble to one safe place. */
body #toast,
body .psm-build-feedback,
body .aptool-pointer-toast,
body .aptool-badge-toast,
body .aptool-apply-feedback{
  position:fixed!important;
  z-index:20000!important;
  left:50%!important;right:auto!important;
  top:auto!important;
  bottom:var(--global-notice-bottom)!important;
  width:max-content!important;
  max-width:min(336px,calc(min(430px,100vw) - 28px))!important;
  min-height:34px!important;
  box-sizing:border-box!important;
  padding:8px 12px!important;
  border:1px solid rgba(255,255,255,.095)!important;
  border-radius:12px!important;
  background:rgba(15,21,27,.985)!important;
  box-shadow:0 14px 36px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.025)!important;
  -webkit-backdrop-filter:blur(14px) saturate(115%)!important;
  backdrop-filter:blur(14px) saturate(115%)!important;
  color:#d6dde2!important;
  font-size:10.5px!important;
  font-weight:790!important;
  line-height:1.38!important;
  letter-spacing:.005em!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  pointer-events:none!important;
  transform:translate(-50%,8px) scale(.985)!important;
  transform-origin:center bottom!important;
  opacity:0!important;
  visibility:visible!important;
  transition:opacity .14s ease,transform .18s cubic-bezier(.22,.78,.24,1)!important;
}
body #toast.show,
body .psm-build-feedback.show,
body .aptool-pointer-toast.show,
body .aptool-badge-toast.show,
body .aptool-apply-feedback.show{
  opacity:1!important;
  visibility:visible!important;
  transform:translate(-50%,0) scale(1)!important;
}
body .psm-build-feedback[hidden]{display:none!important}

/* Semantic meaning stays stable across themes. */
body .psm-build-feedback.gain,
body .aptool-pointer-toast.gain,
body .aptool-apply-feedback.gain{
  color:#e0cd8c!important;
  border-color:rgba(var(--semantic-gold-rgb),.26)!important;
  background:rgba(27,25,18,.985)!important;
}
body .psm-build-feedback.loss,
body .aptool-pointer-toast.loss,
body .aptool-apply-feedback.loss{
  color:#e5a29f!important;
  border-color:rgba(207,105,101,.30)!important;
  background:rgba(31,19,20,.985)!important;
}
body .aptool-pointer-toast.info,
body .aptool-badge-toast{
  color:#dcc77f!important;
  border-color:rgba(var(--semantic-gold-rgb),.20)!important;
}

@media(max-width:360px){
  :root{--bottom-tool-gap:4px}
  body .context-toolbar{padding-bottom:2px!important}
  body .nav .nav-icon svg{width:19px!important;height:19px!important;stroke-width:1.32!important}
  body #toast,body .psm-build-feedback,body .aptool-pointer-toast,body .aptool-badge-toast,body .aptool-apply-feedback{
    max-width:calc(100vw - 24px)!important;font-size:10px!important
  }
}
@media(prefers-reduced-motion:reduce){
  body #toast,body .psm-build-feedback,body .aptool-pointer-toast,body .aptool-badge-toast,body .aptool-apply-feedback{transition-duration:.01ms!important}
}


/* v1.25 · adaptive attribute bubbles + one SVG chevron language */

/* Attribute drag bubble: fit the actual content instead of reserving an 84px box.
   Near either end of the slider, clamp the bubble centre inward so 98/99 and compare
   labels cannot be clipped by the category shell. */
#scroll .pop{
  --pop-edge:22px;
  left:clamp(var(--pop-edge),var(--cur),calc(100% - var(--pop-edge)))!important;
  min-width:0!important;
  width:max-content!important;
  max-width:calc(100% - 8px)!important;
  padding:5px 8px!important;
  border-radius:8px!important;
  font-size:10.5px!important;
  line-height:1.1!important;
  font-variant-numeric:tabular-nums!important;
  letter-spacing:0!important;
}
#scroll .pop.is-compare{
  --pop-edge:58px;
  padding-left:9px!important;padding-right:9px!important;
  font-size:9.8px!important;
  letter-spacing:-.01em!important;
}
@media(max-width:360px){
  #scroll .pop{--pop-edge:21px;font-size:10px!important}
  #scroll .pop.is-compare{--pop-edge:55px;font-size:9.4px!important}
}

/* Shared chevron asset. This is an SVG mask rather than a font glyph, so every page gets
   exactly the same geometry regardless of OS/browser font rendering. */
:root{--ui-chevron-mask:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMiA4Ij48cGF0aCBkPSJNMS41IDEuNSA2IDZsNC41LTQuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIxLjY1IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=")}

/* Plain chevron affordances: same hit footprint, no extra mini-card around the arrow. */
.identity>.chev,
.body-inline-arrow,
.catarrow,
.mastery-expand-btn,
.facility-level-chevron,
.aptool-ps-chev,
.aptool-group-chev,
.psm-spec-summary-chevron{
  font-size:0!important;line-height:0!important;
  color:#74808a!important;
}
.identity>.chev::before,
.body-inline-arrow::before,
.catarrow::before,
.mastery-expand-btn::before,
.facility-level-chevron::before,
.aptool-ps-chev::before,
.aptool-group-chev::before,
.psm-spec-summary-chevron::before{
  content:""!important;
  display:block!important;
  width:10px!important;height:7px!important;
  border:0!important;
  background:currentColor!important;
  -webkit-mask:var(--ui-chevron-mask) center/contain no-repeat!important;
  mask:var(--ui-chevron-mask) center/contain no-repeat!important;
  transform:none;
}

/* Header archetype chevron */
.identity>.chev{width:26px!important;height:26px!important;flex:0 0 26px!important}
.identity.dropdown-open>.chev{transform:rotate(180deg)!important;color:#cdb571!important}

/* Body / attribute accordions rotate only the shared SVG, preserving their centred hit zones. */
.body-inline-arrow::before,.catarrow::before{transform:rotate(0deg)!important;transition:transform .26s cubic-bezier(.22,.78,.24,1)!important}
.body.open .body-inline-arrow::before,
.cathead[aria-expanded="true"] .catarrow::before{transform:rotate(180deg)!important}
.cathead[aria-expanded="false"] .catarrow::before{transform:rotate(0deg)!important}

/* Remove the inconsistent boxed-arrow treatments. The parent row/button remains the tap target. */
.mastery-expand-btn,
.aptool-ps-chev,
.psm-spec-summary-chevron{
  width:24px!important;height:24px!important;
  border:0!important;border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  display:grid!important;place-items:center!important;
}
.mastery-summary-top:active .mastery-expand-btn,
.mastery-mobile.open .mastery-expand-btn,
.aptool-ps-toggle:active .aptool-ps-chev{
  border:0!important;background:transparent!important;
}
.mastery-mobile.open .mastery-expand-btn,
.facility-level-button[aria-expanded="true"] .facility-level-chevron,
.aptool-ps-section.open .aptool-ps-chev,
.aptool-group.open .aptool-group-chev,
.psm-spec.open .psm-spec-summary-chevron{
  transform:rotate(180deg)!important;
  color:#cdb571!important;
}
.facility-level-chevron{width:24px!important;height:24px!important;display:grid!important;place-items:center!important;flex:0 0 24px!important}
.aptool-group-chev{width:22px!important;height:22px!important;display:grid!important;place-items:center!important;flex:0 0 22px!important}

/* Native select wrappers use the same SVG geometry. */
.myov-select-wrap:not(.readonly):after,
.myov-pick-input:not(.readonly):after{
  content:""!important;
  position:absolute!important;
  width:9px!important;height:6px!important;
  border:0!important;
  background:#74808a!important;
  -webkit-mask:var(--ui-chevron-mask) center/contain no-repeat!important;
  mask:var(--ui-chevron-mask) center/contain no-repeat!important;
  transform:translateY(-50%)!important;
  pointer-events:none!important;
}
.myov-select-wrap:not(.readonly):after{right:3px!important;top:50%!important}
.myov-pick-input:not(.readonly):after{right:1px!important;top:50%!important}

/* My Builds sort dropdown also drops the text glyph and uses the same SVG asset. */
.my-sort{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;padding-right:9px!important}
.my-sort::after{
  content:"";width:8px;height:5px;flex:0 0 8px;
  background:#74808a;
  -webkit-mask:var(--ui-chevron-mask) center/contain no-repeat;
  mask:var(--ui-chevron-mask) center/contain no-repeat;
}

@media(prefers-reduced-motion:reduce){
  .body-inline-arrow::before,.catarrow::before,.identity>.chev,.mastery-expand-btn,.facility-level-chevron,.aptool-ps-chev,.aptool-group-chev,.psm-spec-summary-chevron{transition:none!important}
}


/* v1.26 · reduce visual hierarchy, tighten headers, restore real AP accordion motion */

/* ---------------------------------------------------------
   1. Build attributes: restore an inner reading margin.
   The page already has an outer gutter; this creates the missing inner gutter
   so labels and rails do not visually touch the category shell edges.
   --------------------------------------------------------- */
#scroll .attrs{padding-left:6px!important;padding-right:6px!important}
#scroll .cathead{padding-left:11px!important;padding-right:10px!important}
#scroll .catbody-inner{padding-left:5px!important;padding-right:5px!important}
#scroll .atop{padding-left:1px!important;padding-right:1px!important}
#scroll .slider{margin-left:1px!important;margin-right:1px!important}
@media(max-width:360px){
  #scroll .attrs{padding-left:4px!important;padding-right:4px!important}
  #scroll .catbody-inner{padding-left:4px!important;padding-right:4px!important}
}

/* ---------------------------------------------------------
   2. Global page titles: atmosphere only, not a 66px content block.
   Keep the typography but reclaim vertical space on every main page.
   --------------------------------------------------------- */
:root{--mobile-context-title-h:58px}
body #scroll>.mobile-context-title,
body #playstylesMobilePage>.mobile-context-title,
body #enhanceMobilePage>.mobile-context-title,
body #apToolsMobilePage>.aptool-page-title,
body #myBuildsMobilePage>.my-page-title{
  height:58px!important;
  padding-top:4px!important;
  gap:10px!important;
}
body #scroll>.mobile-context-title:before,
body #playstylesMobilePage>.mobile-context-title:before,
body #enhanceMobilePage>.mobile-context-title:before,
body #apToolsMobilePage>.aptool-page-title:before,
body #myBuildsMobilePage>.my-page-title:before{
  top:21px!important;height:17px!important;
}
body .mobile-context-title .cn,body .aptool-page-title .cn,body .my-page-title .cn{font-size:18px!important}
body .mobile-context-title .en,body .aptool-page-title .en,body .my-page-title .en{font-size:16.5px!important;margin-top:3px!important}
body .page-theme-btn{top:11px!important;width:46px!important;height:34px!important;border-radius:12px!important}
body .page-theme-btn .theme-palette-icon{width:21px!important;height:21px!important}
body .sticky.mobile-context-selector{top:calc(var(--safe-top) + 58px)!important}
@media(max-width:360px){
  body #scroll>.mobile-context-title,body #playstylesMobilePage>.mobile-context-title,body #enhanceMobilePage>.mobile-context-title,body #apToolsMobilePage>.aptool-page-title,body #myBuildsMobilePage>.my-page-title{height:56px!important;padding-left:12px!important}
  body .sticky.mobile-context-selector{top:calc(var(--safe-top) + 56px)!important}
  body .page-theme-btn{top:10px!important;width:44px!important;height:33px!important}
}

/* ---------------------------------------------------------
   3. Enhance page: Archetype/AP context is irrelevant here.
   Mastery + Facilities become the page itself instead of cards nested in cards.
   --------------------------------------------------------- */
#enhanceMobilePage #enhSticky{display:none!important}
#enhanceMobilePage .enh-section{margin-top:10px!important}
#enhanceMobilePage .enh-section:first-of-type{margin-top:8px!important}

/* Mastery: flat module with a single structural divider. */
#enhanceMobilePage .mastery-mobile{
  border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;
  padding:0 0 12px!important;border-bottom:1px solid rgba(255,255,255,.055)!important;
}
#enhanceMobilePage .mastery-summary-top{min-height:39px!important;padding:0 2px!important}
#enhanceMobilePage .mastery-quickbar{padding:0 0 1px!important;gap:6px!important}
#enhanceMobilePage .mastery-quick{height:31px!important;border-radius:10px!important}
#enhanceMobilePage .mastery-list-shell{margin-top:8px!important}
#enhanceMobilePage .mastery-list{padding-left:2px!important;padding-right:2px!important}

/* Facility heading gets a little more separation from Mastery. */
#enhanceMobilePage .facility-mobile-head{margin-top:3px!important;margin-bottom:9px!important;padding-left:2px!important}

/* Club level + budget are one control strip, not two unrelated cards. */
#enhanceMobilePage .facility-budget-wrap{
  grid-template-columns:minmax(0,.44fr) minmax(0,.56fr)!important;gap:0!important;
  border:1px solid rgba(var(--global-atmo-rgb),.10)!important;border-radius:14px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(var(--global-atmo-rgb),.008))!important;
  overflow:visible!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.016)!important;
}
#enhanceMobilePage .facility-budget-wrap>.facility-info-card{
  min-height:60px!important;padding:9px 10px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
}
#enhanceMobilePage .facility-budget-wrap>.facility-info-card:first-child{border-right:1px solid rgba(255,255,255,.05)!important}
#enhanceMobilePage .facility-level-button{min-height:39px!important}
#enhanceMobilePage .facility-budget-head{margin-bottom:8px!important}
#enhanceMobilePage .facility-budget-rail{height:5px!important}

/* Facility aggregate info is informational, so remove another surrounding card. */
#enhanceMobilePage .facility-summary{
  margin-top:9px!important;padding:10px 2px 7px!important;border:0!important;border-top:1px solid rgba(255,255,255,.045)!important;
  border-radius:0!important;background:transparent!important;box-shadow:none!important;
}
#enhanceMobilePage .facility-summary-top{margin-bottom:8px!important}
#enhanceMobilePage .facility-ps-summary{margin-top:8px!important;padding-top:8px!important}

/* Selected facility cards remain cards because they are individual editable objects,
   but the internal vertical balance is calmer. */
#enhanceMobilePage .facility-grid{gap:8px!important;margin-top:9px!important}
#enhanceMobilePage .facility-card-mobile,#enhanceMobilePage .facility-add-mobile{min-height:132px!important;padding:9px 10px!important}
#enhanceMobilePage .facility-card-icon{width:29px!important;height:29px!important}
#enhanceMobilePage .facility-card-level{height:20px!important;padding:0 7px!important}
#enhanceMobilePage .facility-card-mobile h4{margin:7px 0 5px!important;font-size:11.8px!important}
#enhanceMobilePage .facility-card-boosts{gap:6px!important;min-height:16px!important;line-height:1.35!important}
#enhanceMobilePage .facility-card-foot{
  left:10px!important;right:10px!important;bottom:7px!important;min-height:37px!important;padding-top:9px!important;
  border-top-color:rgba(255,255,255,.045)!important;gap:8px!important;
}
#enhanceMobilePage .facility-delete{
  width:28px!important;height:28px!important;border:0!important;border-radius:8px!important;background:transparent!important;color:#69747d!important;
  display:grid!important;place-items:center!important;flex:0 0 28px!important;
}
#enhanceMobilePage .facility-delete svg{width:14px!important;height:14px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.55!important;stroke-linecap:round!important}
#enhanceMobilePage .facility-delete:active{color:#c9796d!important;background:rgba(201,121,109,.055)!important}

/* ---------------------------------------------------------
   4. AP Calculator attribute accordions: the old click handler rebuilt the
   entire group DOM, which made a CSS transition impossible. v1.26 toggles
   the existing node and adds a small content fade/slide to the height motion.
   --------------------------------------------------------- */
#apToolsMobilePage .aptool-group-body{transition:grid-template-rows .30s cubic-bezier(.22,.78,.24,1)!important}
#apToolsMobilePage .aptool-group-clip{
  min-height:0!important;overflow:hidden!important;opacity:0;transform:translateY(-4px);
  transition:opacity .16s ease,transform .28s cubic-bezier(.22,.78,.24,1)!important;
}
#apToolsMobilePage .aptool-group.open .aptool-group-clip{opacity:1;transform:none}
#apToolsMobilePage .aptool-group-chev{transition:transform .28s cubic-bezier(.22,.78,.24,1),color .16s ease!important}

/* Existing accordions audited in this pass:
   Build body/category, PlayStyles expansion, Mastery, Facility level menu and
   AP PlayStyle shell already use persistent nodes + transitions. */
@media(prefers-reduced-motion:reduce){
  #apToolsMobilePage .aptool-group-body,#apToolsMobilePage .aptool-group-clip,#apToolsMobilePage .aptool-group-chev{transition-duration:.01ms!important}
}


/* v1.27 · one header system, cleaner Enhance hierarchy, centred chevrons, safer external links */
body{--global-header-surface:#0a0f14}
body[data-my-theme="theme2"]{--global-header-surface:#091315}
body[data-my-theme="theme3"]{--global-header-surface:#0d141b}
body #myBuildsMobilePage.my-page{background:transparent!important}
body #myBuildsMobilePage.my-page:before{display:none!important}
body #scroll>.mobile-context-title,
body #playstylesMobilePage>.mobile-context-title,
body #enhanceMobilePage>.mobile-context-title,
body #apToolsMobilePage>.aptool-page-title,
body #myBuildsMobilePage>.my-page-title{
  background:var(--global-header-surface)!important;
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  box-shadow:none!important;gap:10px!important;
}
body #myBuildsMobilePage>.my-page-title{padding-left:14px!important;padding-right:68px!important;padding-top:4px!important}
body #myBuildsMobilePage>.my-page-title .cn{font-size:18px!important;line-height:1!important;font-weight:790!important;letter-spacing:.045em!important;color:#edf1f3!important;text-shadow:0 1px 12px rgba(0,0,0,.20)!important}
body #myBuildsMobilePage>.my-page-title .en{margin-top:3px!important;font-family:"Ink Free","Segoe Print","Segoe Script","Bradley Hand",cursive!important;font-size:16.5px!important;line-height:1!important;font-style:italic!important;font-weight:800!important;text-transform:none!important;letter-spacing:.015em!important;color:rgba(var(--global-atmo-rgb),.82)!important;text-shadow:none!important;transform:rotate(-2deg)!important;transform-origin:left center!important}
body #myBuildsMobilePage>.my-page-title:before{top:21px!important;height:17px!important}
body #scroll>.mobile-context-title:after,body #playstylesMobilePage>.mobile-context-title:after,body #enhanceMobilePage>.mobile-context-title:after,body #apToolsMobilePage>.aptool-page-title:after,body #myBuildsMobilePage>.my-page-title:after{background:linear-gradient(90deg,rgba(var(--global-atmo-rgb),.20),rgba(255,255,255,.04) 40%,transparent 88%)!important}

/* unified Enhance section headers */
#enhanceMobilePage .mastery-summary-top,#enhanceMobilePage .facility-mobile-head{position:relative!important;min-height:38px!important;padding:0 2px 0 12px!important;margin:0!important;display:flex!important;align-items:center!important}
#enhanceMobilePage .mastery-summary-top:before,#enhanceMobilePage .facility-mobile-head:before{content:""!important;position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;width:2px!important;height:19px!important;border-radius:99px!important;background:rgba(var(--global-atmo-rgb),.72)!important;box-shadow:0 0 12px rgba(var(--global-atmo-rgb),.10)!important}
#enhanceMobilePage .mastery-titleline{display:flex!important;align-items:center!important;gap:7px!important;min-width:0!important}
#enhanceMobilePage .mastery-titleline strong,#enhanceMobilePage .facility-mobile-head strong{font-size:14px!important;font-weight:880!important;line-height:1!important;color:#e0e5e9!important}
#enhanceMobilePage .mastery-titleline>span:not(.mastery-expand-btn),#enhanceMobilePage .facility-mobile-head span{font-size:9px!important;font-weight:820!important;letter-spacing:.11em!important;color:rgba(var(--global-atmo-rgb),.65)!important}
#enhanceMobilePage .mastery-expand-btn{margin-left:1px!important;width:18px!important;height:18px!important;flex:0 0 18px!important;color:#74808a!important}
#enhanceMobilePage .mastery-expand-btn::before{width:9px!important;height:6px!important}
#enhanceMobilePage .mastery-count{margin-left:auto!important;font-size:9px!important;font-weight:700!important;color:#6f7a83!important;letter-spacing:.01em!important}
#enhanceMobilePage .mastery-quickbar{margin:7px 0 0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;gap:6px!important}
#enhanceMobilePage .mastery-quick{height:31px!important;border-radius:10px!important}
#enhanceMobilePage .mastery-mobile{padding-bottom:14px!important}
#enhanceMobilePage .facility-mobile-head{margin-top:13px!important;margin-bottom:6px!important}

/* compact club level selector */
#enhanceMobilePage .facility-budget-wrap{grid-template-columns:minmax(0,.35fr) minmax(0,.65fr)!important}
#enhanceMobilePage .facility-level-button{justify-content:flex-start!important;padding-left:9px!important;padding-right:8px!important;gap:0!important}
#enhanceMobilePage .facility-level-chevron{margin-left:8px!important;width:18px!important;height:18px!important;flex-basis:18px!important}
#enhanceMobilePage .facility-level-chevron::before{width:9px!important;height:6px!important}

/* facility card lower-zone balance */
#enhanceMobilePage .facility-card-mobile{min-height:146px!important;padding:9px 10px 45px!important}
#enhanceMobilePage .facility-card-mobile h4{margin:7px 0 0!important;padding-bottom:0!important}
#enhanceMobilePage .facility-card-boosts{margin-top:8px!important;padding-top:9px!important;border-top:1px solid rgba(255,255,255,.045)!important;min-height:43px!important;display:flex!important;align-content:center!important;align-items:center!important;gap:7px!important;line-height:1.4!important}
#enhanceMobilePage .facility-card-foot{left:10px!important;right:10px!important;bottom:8px!important;min-height:30px!important;padding-top:0!important;border-top:0!important;gap:8px!important}
#enhanceMobilePage .facility-card-cost{align-self:center!important}

/* centre shared chevrons geometrically */
.identity>.chev,.body-inline-arrow,.catarrow,.mastery-expand-btn,.facility-level-chevron,.aptool-ps-chev,.aptool-group-chev,.psm-spec-summary-chevron{display:grid!important;place-items:center!important;align-self:center!important;justify-self:center!important;padding:0!important;line-height:0!important;transform-origin:50% 50%!important}
.identity>.chev::before,.body-inline-arrow::before,.catarrow::before,.mastery-expand-btn::before,.facility-level-chevron::before,.aptool-ps-chev::before,.aptool-group-chev::before,.psm-spec-summary-chevron::before{margin:auto!important;position:static!important;inset:auto!important}
#apToolsMobilePage .aptool-group-toggle{align-items:center!important}
#apToolsMobilePage .aptool-group-chev{margin-left:auto!important}
#apToolsMobilePage .aptool-ps-chev{align-self:center!important}

/* external EA link confirmation */
.my-external-sheet{padding-bottom:calc(17px + env(safe-area-inset-bottom,0px))!important}
.my-external-copy{margin:2px 0 14px;padding:12px 13px;border:1px solid rgba(255,255,255,.06);border-radius:13px;background:rgba(255,255,255,.016);display:flex;flex-direction:column;gap:6px}
.my-external-copy strong{font-size:12px;color:#dce2e6;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-external-copy span{font-size:9.5px;line-height:1.55;color:#78838c}
.my-sim-player{text-decoration:none}
@media(max-width:360px){body #myBuildsMobilePage>.my-page-title{padding-left:12px!important;padding-right:62px!important}#enhanceMobilePage .facility-budget-wrap{grid-template-columns:minmax(0,.38fr) minmax(0,.62fr)!important}#enhanceMobilePage .mastery-count{font-size:8.6px!important}#enhanceMobilePage .facility-card-mobile{min-height:144px!important}}


/* v1.28 · consolidated polish: Enhance alignment, header blend, calm chevrons, sticky PS summary */
:root{--mobile-page-gutter:13px;--psm-selector-stack-h:92px}

/* 1) Header should be one continuous full-bleed surface, not a narrower colour slab
      sitting inside the page gutter. Content keeps the same visual alignment. */
body #scroll>.mobile-context-title,
body #playstylesMobilePage>.mobile-context-title,
body #enhanceMobilePage>.mobile-context-title,
body #apToolsMobilePage>.aptool-page-title,
body #myBuildsMobilePage>.my-page-title{
  width:calc(100% + (var(--mobile-page-gutter) * 2))!important;
  margin-left:calc(var(--mobile-page-gutter) * -1)!important;
  margin-right:calc(var(--mobile-page-gutter) * -1)!important;
  padding-left:calc(var(--mobile-page-gutter) + 14px)!important;
  padding-right:calc(var(--mobile-page-gutter) + 68px)!important;
  background:
    radial-gradient(80% 160% at 50% -65%,rgba(var(--global-cloud-rgb),.12),transparent 70%),
    linear-gradient(180deg,var(--global-bg-top,#0a0f14) 0%,var(--global-bg-mid,#080c10) 100%)!important;
  background-clip:border-box!important;
}
body #scroll>.mobile-context-title .page-theme-btn,
body #playstylesMobilePage>.mobile-context-title .page-theme-btn,
body #enhanceMobilePage>.mobile-context-title .page-theme-btn,
body #apToolsMobilePage>.aptool-page-title .page-theme-btn,
body #myBuildsMobilePage>.my-page-title .page-theme-btn{right:calc(var(--mobile-page-gutter) + 8px)!important}

/* 2) Enhance section headers: same compact baseline; state text gets an actual right inset. */
#enhanceMobilePage .enh-section{margin-top:7px!important}
#enhanceMobilePage .enh-section:first-of-type{margin-top:6px!important}
#enhanceMobilePage .mastery-summary-top,
#enhanceMobilePage .facility-mobile-head{
  min-height:34px!important;
  padding:0 12px!important;
  margin:0!important;
  align-items:center!important;
}
#enhanceMobilePage .mastery-summary-top:before,
#enhanceMobilePage .facility-mobile-head:before{
  left:0!important;height:18px!important;
}
#enhanceMobilePage .mastery-titleline{gap:6px!important}
#enhanceMobilePage .mastery-count{
  margin-left:auto!important;margin-right:0!important;
  padding-left:10px!important;
  font-size:8.8px!important;font-weight:700!important;
  color:#74808a!important;
}
#enhanceMobilePage .mastery-mobile{padding-bottom:11px!important}
#enhanceMobilePage .mastery-quickbar{margin-top:6px!important}
#enhanceMobilePage .facility-mobile-head{margin-top:7px!important;margin-bottom:5px!important}

/* Club level strip: compact, with the chevron centred against the full control height. */
#enhanceMobilePage .facility-budget-wrap{grid-template-columns:minmax(0,.34fr) minmax(0,.66fr)!important}
#enhanceMobilePage .facility-budget-wrap>.facility-info-card{min-height:58px!important;padding:8px 10px!important}
#enhanceMobilePage .facility-level-button{
  height:40px!important;min-height:40px!important;
  padding:0 7px 0 9px!important;
  align-items:center!important;
}
#enhanceMobilePage .facility-level-chevron{
  width:18px!important;height:40px!important;flex:0 0 18px!important;
  margin-left:auto!important;align-self:center!important;
  display:grid!important;place-items:center!important;
}

/* Facility aggregate information needs a real reading inset. */
#enhanceMobilePage .facility-summary{
  margin-top:8px!important;
  padding:11px 10px 10px!important;
}
#enhanceMobilePage .facility-summary-top{margin-bottom:9px!important}
#enhanceMobilePage .facility-attr-chips{min-height:28px!important;align-content:center!important}
#enhanceMobilePage .facility-summary-empty{padding:6px 0!important;line-height:1.35!important}
#enhanceMobilePage .facility-ps-summary{margin-top:9px!important;padding-top:10px!important}
#enhanceMobilePage .facility-ps-title{margin-bottom:5px!important}

/* Facility cards: centre the boost copy in the lower content zone instead of pinning it to the divider. */
#enhanceMobilePage .facility-card-boosts{
  min-height:48px!important;
  margin-top:7px!important;
  padding-top:10px!important;padding-bottom:5px!important;
  align-items:center!important;align-content:center!important;
}

/* 3) One calm chevron behaviour: the hit target NEVER rotates.
      Only the symmetric SVG flips vertically in place, so there is no visible orbit/jump. */
.identity>.chev,
.body-inline-arrow,
.catarrow,
.mastery-expand-btn,
.facility-level-chevron,
.aptool-ps-chev,
.aptool-group-chev,
.psm-spec-summary-chevron{transform:none!important;transition:color .12s ease!important}
.identity>.chev::before,
.body-inline-arrow::before,
.catarrow::before,
.mastery-expand-btn::before,
.facility-level-chevron::before,
.aptool-ps-chev::before,
.aptool-group-chev::before,
.psm-spec-summary-chevron::before{
  transform:scaleY(1)!important;
  transform-origin:50% 50%!important;
  transition:transform .12s ease,color .12s ease!important;
}
.identity.dropdown-open>.chev::before,
.body.open .body-inline-arrow::before,
.cathead[aria-expanded="true"] .catarrow::before,
.mastery-mobile.open .mastery-expand-btn::before,
.facility-level-button[aria-expanded="true"] .facility-level-chevron::before,
.aptool-ps-section.open .aptool-ps-chev::before,
.aptool-group.open .aptool-group-chev::before,
.psm-spec.open .psm-spec-summary-chevron::before{transform:scaleY(-1)!important}
.identity.dropdown-open>.chev,
.mastery-mobile.open .mastery-expand-btn,
.facility-level-button[aria-expanded="true"] .facility-level-chevron,
.aptool-ps-section.open .aptool-ps-chev,
.aptool-group.open .aptool-group-chev,
.psm-spec.open .psm-spec-summary-chevron{transform:none!important;color:#cdb571!important}

/* AP group chevron is vertically centred by the row box, not by glyph/font baseline. */
#apToolsMobilePage .aptool-group-toggle{align-items:center!important}
#apToolsMobilePage .aptool-group-chev{
  width:22px!important;height:100%!important;min-height:34px!important;
  align-self:stretch!important;display:grid!important;place-items:center!important;margin-left:auto!important;
}
#apToolsMobilePage .aptool-ps-chev{height:100%!important;min-height:32px!important;align-self:stretch!important}

/* 4) PlayStyles: current loadout is a persistent summary strip. Shorter, opaque and sticky. */
#playstylesMobilePage{--psm-loadout-gap:5px}
#playstylesMobilePage #psmLoadout{
  position:sticky!important;
  top:calc(var(--safe-top) + var(--mobile-context-title-h,58px) + var(--psm-selector-stack-h) + var(--psm-loadout-gap))!important;
  z-index:74!important;
  margin-top:5px!important;margin-bottom:9px!important;
  background:linear-gradient(180deg,rgba(var(--ui-panel),.995),rgba(var(--ui-panel-2),.995))!important;
  box-shadow:0 9px 26px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.018)!important;
  -webkit-backdrop-filter:blur(14px) saturate(110%)!important;backdrop-filter:blur(14px) saturate(110%)!important;
}
#playstylesMobilePage .psm-loadout-row{min-height:60px!important;padding:6px 8px!important;gap:6px!important}
#playstylesMobilePage .psm-source-strip{gap:5px!important}
#playstylesMobilePage .psm-source-sep{height:32px!important;margin:0 1px!important}
#playstylesMobilePage .psm-regular-track{grid-auto-columns:45px!important;gap:3px!important}
#playstylesMobilePage .psm-loadout-slot{width:45px!important;height:46px!important}
#playstylesMobilePage .psm-badge{width:45px!important;height:46px!important;flex-basis:45px!important}
#playstylesMobilePage .psm-badge-shell{width:45px!important;height:45px!important;--badge-h:38px;--badge-w:38px;--icon-box:22px}
#playstylesMobilePage .psm-badge.plus .psm-badge-shell,#playstylesMobilePage .psm-badge-shell.plus{--badge-w:45px;--icon-box:23px}

/* Keep inline detail readable while allowing JS to scroll it into the usable viewport
   when the tapped badge lives near the bottom of the selector. */
#playstylesMobilePage .psm-detail-shell{scroll-margin-top:calc(var(--safe-top) + var(--mobile-context-title-h,58px) + var(--psm-selector-stack-h) + 128px)!important}

@media(max-width:360px){
  :root{--mobile-page-gutter:10px;--mobile-context-title-h:56px}
  body #scroll>.mobile-context-title,
  body #playstylesMobilePage>.mobile-context-title,
  body #enhanceMobilePage>.mobile-context-title,
  body #apToolsMobilePage>.aptool-page-title,
  body #myBuildsMobilePage>.my-page-title{
    padding-left:calc(var(--mobile-page-gutter) + 12px)!important;
    padding-right:calc(var(--mobile-page-gutter) + 62px)!important;
  }
  #enhanceMobilePage .facility-budget-wrap{grid-template-columns:minmax(0,.37fr) minmax(0,.63fr)!important}
  #enhanceMobilePage .mastery-count{padding-left:7px!important;font-size:8.4px!important}
  #playstylesMobilePage .psm-loadout-row{min-height:57px!important;padding:5px 6px!important}
  #playstylesMobilePage .psm-regular-track{grid-auto-columns:42px!important}
  #playstylesMobilePage .psm-loadout-slot,#playstylesMobilePage .psm-badge{width:42px!important;flex-basis:42px!important}
}
@media(prefers-reduced-motion:reduce){
  .identity>.chev::before,.body-inline-arrow::before,.catarrow::before,.mastery-expand-btn::before,.facility-level-chevron::before,.aptool-ps-chev::before,.aptool-group-chev::before,.psm-spec-summary-chevron::before{transition-duration:.01ms!important}
}


/* RC2.5 · discreet creator credit. Kept in My Builds so the global header remains free
   for Theme + language controls. */
#myBuildsMobilePage .site-author-credit{
  margin:18px 2px 2px;
  padding:10px 1px 0;
  border-top:1px solid rgba(255,255,255,.045);
  text-align:right;
  color:#606b74;
  font-size:8.6px;
  font-weight:650;
  line-height:1.2;
  letter-spacing:.015em;
  white-space:nowrap;
}
@media(max-width:360px){
  #myBuildsMobilePage .site-author-credit{font-size:8.3px;margin-top:16px}
}


/* v1.29 · one continuous Top Shell: title, context and page background share one surface */
:root{
  --top-shell-rgb:10,15,20;
  --mobile-page-gutter:13px;
}
body[data-my-theme="theme2"]{--top-shell-rgb:9,19,21}
body[data-my-theme="theme3"]{--top-shell-rgb:13,20,27}

/* The page itself carries the transition from the top shell into the normal app atmosphere.
   This removes the visible horizontal colour cut below the title/context stack. */
body #scroll,
body #playstylesMobilePage,
body #enhanceMobilePage,
body #apToolsMobilePage,
body #myBuildsMobilePage{
  background:
    linear-gradient(180deg,
      rgba(var(--top-shell-rgb),1) 0,
      rgba(var(--top-shell-rgb),1) 168px,
      rgba(var(--top-shell-rgb),.76) 244px,
      rgba(var(--top-shell-rgb),.28) 332px,
      rgba(var(--top-shell-rgb),0) 408px
    )!important;
  background-repeat:no-repeat!important;
}

/* Title shell: no independent gradient, no blur tint. It is exactly the same top surface. */
body #scroll>.mobile-context-title,
body #playstylesMobilePage>.mobile-context-title,
body #enhanceMobilePage>.mobile-context-title,
body #apToolsMobilePage>.aptool-page-title,
body #myBuildsMobilePage>.my-page-title{
  background:rgb(var(--top-shell-rgb))!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
}

/* Context shell is also full-bleed. Only the identity card itself remains inset/card-like. */
body .sticky.mobile-context-selector{
  margin-left:calc(var(--mobile-page-gutter) * -1)!important;
  margin-right:calc(var(--mobile-page-gutter) * -1)!important;
  margin-bottom:11px!important;
  padding-left:var(--mobile-page-gutter)!important;
  padding-right:var(--mobile-page-gutter)!important;
  background:rgb(var(--top-shell-rgb))!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
}

/* Soften the shell exit rather than ending it as a rectangular slab. */
body .sticky.mobile-context-selector:after{
  content:"";
  position:absolute;
  z-index:-1;
  left:0;right:0;bottom:-18px;height:18px;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(var(--top-shell-rgb),.78),rgba(var(--top-shell-rgb),0));
}

/* Pages without a context selector still get a soft continuation below the title. */
body.enh-view #enhanceMobilePage:before,
body.aptool-view #apToolsMobilePage:before,
body.my-view #myBuildsMobilePage:before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:-1!important;
  left:0!important;right:0!important;top:0!important;height:168px!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,rgba(var(--top-shell-rgb),.36),rgba(var(--top-shell-rgb),0))!important;
}

@media(max-width:360px){
  :root{--mobile-page-gutter:10px}
}


/* v1.30 · consolidated correction pass */

/* 1) True collapse: no hidden padding/seam below collapsed attribute headers. */
#scroll .cat.collapsed .catbody{padding-top:0!important;margin:0!important;border:0!important}
#scroll .cat.collapsed .catbody-clip{height:0!important;min-height:0!important}
#scroll .cat.collapsed .catbody-inner{padding-top:0!important;padding-bottom:0!important;margin:0!important}

/* 2) One chevron component: the SVG is centred against the FULL owning row. */
.identity>.chev,.body-inline-arrow,.catarrow,.mastery-expand-btn,.facility-level-chevron,.aptool-ps-chev,.aptool-group-chev,.psm-spec-summary-chevron{
  --chev-flip:1;position:relative!important;display:block!important;font-size:0!important;line-height:0!important;padding:0!important;margin-top:0!important;margin-bottom:0!important;transform:none!important
}
.identity>.chev::before,.body-inline-arrow::before,.catarrow::before,.mastery-expand-btn::before,.facility-level-chevron::before,.aptool-ps-chev::before,.aptool-group-chev::before,.psm-spec-summary-chevron::before{
  content:""!important;position:absolute!important;left:50%!important;top:50%!important;width:10px!important;height:6px!important;margin:0!important;
  background:#74808a!important;-webkit-mask:var(--ui-chevron-mask) center/contain no-repeat!important;mask:var(--ui-chevron-mask) center/contain no-repeat!important;
  transform:translate(-50%,-50%) scaleY(var(--chev-flip))!important;transform-origin:50% 50%!important;transition:transform .11s ease,background .11s ease!important
}
.identity.dropdown-open>.chev,.body.open .body-inline-arrow,.cathead[aria-expanded="true"] .catarrow,.mastery-mobile.open .mastery-expand-btn,.facility-level-button[aria-expanded="true"] .facility-level-chevron,.aptool-ps-section.open .aptool-ps-chev,.aptool-group.open .aptool-group-chev,.psm-spec.open .psm-spec-summary-chevron{--chev-flip:-1}
.identity.dropdown-open>.chev::before,.mastery-mobile.open .mastery-expand-btn::before,.facility-level-button[aria-expanded="true"] .facility-level-chevron::before,.aptool-ps-section.open .aptool-ps-chev::before,.aptool-group.open .aptool-group-chev::before{background:#cdb571!important}
.identity>.chev{height:100%!important;align-self:stretch!important;width:28px!important}
.body-inline-arrow{align-self:stretch!important;height:auto!important;min-height:40px!important;width:20px!important;flex:0 0 20px!important}
.catarrow{align-self:stretch!important;height:100%!important;width:30px!important;margin-left:auto!important}
#enhanceMobilePage .mastery-expand-btn{height:36px!important;width:20px!important;flex:0 0 20px!important}
#enhanceMobilePage .facility-level-chevron{height:40px!important;width:20px!important;flex:0 0 20px!important;margin-left:5px!important}
#apToolsMobilePage .aptool-ps-chev,#apToolsMobilePage .aptool-group-chev{align-self:stretch!important;height:auto!important;min-height:100%!important;width:26px!important}

/* 3) Enhance: clean section headers, no duplicate atmosphere rails, symmetric vertical rhythm. */
#enhanceMobilePage .mastery-summary-top,#enhanceMobilePage .facility-mobile-head{
  min-height:38px!important;height:38px!important;padding:0 10px 0 0!important;margin:0!important;display:flex!important;align-items:center!important;line-height:1!important
}
#enhanceMobilePage .mastery-summary-top:before,#enhanceMobilePage .facility-mobile-head:before{content:none!important;display:none!important}
#enhanceMobilePage .mastery-titleline{height:38px!important;display:flex!important;align-items:center!important;gap:6px!important}
#enhanceMobilePage .mastery-titleline strong,#enhanceMobilePage .facility-mobile-head strong{line-height:1!important;margin:0!important}
#enhanceMobilePage .mastery-titleline>span:not(.mastery-expand-btn),#enhanceMobilePage .facility-mobile-head span{line-height:1!important;margin:0!important}
#enhanceMobilePage .mastery-count{margin-left:auto!important;margin-right:2px!important;padding:0 0 0 10px!important;line-height:1!important}
#enhanceMobilePage .mastery-quickbar{margin-top:4px!important}
#enhanceMobilePage .facility-mobile-head{margin-top:5px!important;margin-bottom:3px!important;padding-left:0!important}
#enhanceMobilePage .facility-budget-wrap{margin-top:0!important}
#enhanceMobilePage .facility-budget-wrap>.facility-info-card{min-height:56px!important}
#enhanceMobilePage .facility-level-button{height:40px!important;min-height:40px!important;display:flex!important;align-items:center!important}

/* Facility aggregate copy gets a proper content inset and vertical breathing. */
#enhanceMobilePage .facility-summary{padding:12px 12px 12px!important}
#enhanceMobilePage .facility-summary-top{margin-bottom:10px!important}
#enhanceMobilePage .facility-attr-chips{min-height:31px!important;align-items:center!important;align-content:center!important}
#enhanceMobilePage .facility-summary-empty{padding:7px 0!important;line-height:1.4!important}
#enhanceMobilePage .facility-ps-summary{margin-top:10px!important;padding-top:11px!important}
#enhanceMobilePage .facility-ps-row{min-height:31px!important;align-items:center!important}
#enhanceMobilePage .facility-card-boosts{min-height:50px!important;padding-top:11px!important;padding-bottom:7px!important;align-content:center!important;align-items:center!important}

/* 4) Build / PlayStyles selector: one shared Context component, Build page is the reference. */
#scroll>.sticky.mobile-context-selector,#playstylesMobilePage>.psm-sticky.mobile-context-selector{margin-top:10px!important;margin-bottom:12px!important;padding-top:0!important;padding-bottom:0!important}
#playstylesMobilePage>.psm-sticky.mobile-context-selector .identity{height:44px!important;padding:8px 10px!important}
#playstylesMobilePage>.psm-sticky.mobile-context-selector .level{min-width:52px!important;font-size:13.5px!important;font-weight:830!important}
#playstylesMobilePage>.psm-sticky.mobile-context-selector .logo{width:27px!important;height:27px!important;flex-basis:27px!important}
#playstylesMobilePage>.psm-sticky.mobile-context-selector .archcn{font-size:13.3px!important;font-weight:820!important}
#playstylesMobilePage>.psm-sticky.mobile-context-selector .archen{font-size:8.6px!important}
#playstylesMobilePage>.psm-sticky.mobile-context-selector .apwrap{margin-top:7px!important;padding:0 3px!important}
#playstylesMobilePage>.psm-sticky.mobile-context-selector .apline{margin-bottom:6px!important}
#playstylesMobilePage>.psm-sticky.mobile-context-selector .apline span{font-size:9.3px!important}
#playstylesMobilePage>.psm-sticky.mobile-context-selector .aptrack{height:4px!important}

/* 5) PlayStyle loadout slots: badge, empty slot and plus slot share one geometry. */
#playstylesMobilePage{--ps-slot-w:42px;--ps-slot-h:44px;--ps-diamond:35px}
#playstylesMobilePage .psm-regular-track{grid-auto-columns:var(--ps-slot-w)!important;gap:4px!important}
#playstylesMobilePage .psm-loadout-slot,#playstylesMobilePage .psm-badge{width:var(--ps-slot-w)!important;height:var(--ps-slot-h)!important;flex-basis:var(--ps-slot-w)!important}
#playstylesMobilePage .psm-badge-shell{width:var(--ps-slot-w)!important;height:var(--ps-slot-h)!important;--badge-h:var(--ps-diamond);--badge-w:var(--ps-diamond);--icon-box:20px}
#playstylesMobilePage .psm-badge.plus .psm-badge-shell,#playstylesMobilePage .psm-badge-shell.plus{--badge-w:41px;--icon-box:21px}
#playstylesMobilePage .psm-badge.empty .psm-badge-shell,#playstylesMobilePage .psm-badge.amp-add .psm-badge-shell{width:var(--ps-slot-w)!important;height:var(--ps-slot-h)!important}
#playstylesMobilePage .psm-badge.empty.addable .psm-badge-shell::after,#playstylesMobilePage .psm-badge.amp-add .psm-badge-shell::after{font-size:17px!important}

/* 6) PlayStyle selector is a real modal sheet with its own scroll container. */
.psm-library-backdrop{position:fixed;z-index:258;inset:0;background:rgba(1,4,7,.66);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .18s ease}
.psm-library-backdrop.open{opacity:1;pointer-events:auto}
#psmLibrary{position:fixed!important;z-index:259!important;left:50%!important;top:calc(env(safe-area-inset-top,0px) + 8px)!important;bottom:calc(env(safe-area-inset-bottom,0px) + 8px)!important;width:min(418px,calc(100vw - 12px))!important;max-height:none!important;margin:0!important;padding:0!important;border:1px solid rgba(255,255,255,.085)!important;border-radius:22px!important;background:linear-gradient(180deg,rgba(var(--ui-panel),.998),rgba(var(--ui-panel-2),.998))!important;box-shadow:0 28px 72px rgba(0,0,0,.56)!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translate(-50%,18px) scale(.985)!important;transition:opacity .18s ease,transform .24s cubic-bezier(.22,.78,.24,1),visibility 0s linear .24s!important;overflow:hidden!important}
#psmLibrary.open{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translate(-50%,0) scale(1)!important;transition-delay:0s!important}
#psmLibrary .psm-library-clip{height:100%!important;min-height:0!important;overflow:hidden!important}
#psmLibrary .psm-library-inner{height:100%!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important;padding:0 10px 20px!important;opacity:1!important;transform:none!important}
.psm-library-sheet-head{position:sticky;z-index:6;top:0;min-height:60px;margin:0 -10px 6px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(255,255,255,.055);background:linear-gradient(180deg,rgba(var(--ui-panel),.998),rgba(var(--ui-panel),.965));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.psm-library-sheet-head small{display:block;font-size:8px;letter-spacing:.14em;color:#66727d;font-weight:850}.psm-library-sheet-head strong{display:block;margin-top:3px;font-size:14px;color:#e8edf0;font-weight:900}
#psmLibrary .psm-library-close{position:static!important;width:34px!important;height:34px!important;flex:0 0 34px!important;padding:0!important;border:1px solid rgba(255,255,255,.065)!important;border-radius:10px!important;background:rgba(255,255,255,.018)!important;color:#87929b!important;font-size:20px!important;line-height:1!important;display:grid!important;place-items:center!important}
#psmLibrary .psm-library-close span{display:none!important}
html.psm-library-open,body.psm-library-open{overscroll-behavior:none!important}
#psmLibrary .psm-detail-shell{scroll-margin-top:72px!important;scroll-margin-bottom:20px!important}

/* 7) AP top area: status is information, actions are actions. Remove 2x2 visual confusion. */
#apToolsMobilePage .aptool-top-card{padding:0!important;margin-top:9px!important;margin-bottom:10px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
#apToolsMobilePage .aptool-stats{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:7px!important}
#apToolsMobilePage .aptool-stat{min-height:54px!important;padding:8px 10px!important;border-radius:12px!important;background:rgba(255,255,255,.014)!important}
#apToolsMobilePage .aptool-stat strong{margin-top:3px!important;font-size:13px!important}
#apToolsMobilePage .aptool-actions{grid-template-columns:minmax(0,.40fr) minmax(0,.60fr)!important;gap:8px!important;margin-top:8px!important}
#apToolsMobilePage .aptool-import-wrap,#apToolsMobilePage .aptool-import-action{width:100%!important;max-width:none!important}
#apToolsMobilePage .aptool-action{height:44px!important;border-radius:12px!important}
#apToolsMobilePage .aptool-action>span{font-size:12px!important}
#apToolsMobilePage .aptool-action>small{font-size:8.5px!important;margin-top:1px!important}

/* 8) My Builds uses the exact same page shell/background as the other four pages. */
body.my-view .app{background:radial-gradient(105% 360px at 50% -95px,rgba(var(--global-cloud-rgb),.19),transparent 66%),radial-gradient(68% 260px at 104% 4%,rgba(var(--global-atmo-rgb),.065),transparent 72%),linear-gradient(180deg,var(--global-bg-top) 0%,var(--global-bg-mid) 43%,var(--global-bg-bottom) 100%)!important}
body.my-view #myBuildsMobilePage.my-page{background:linear-gradient(180deg,rgba(var(--top-shell-rgb),1) 0,rgba(var(--top-shell-rgb),1) 168px,rgba(var(--top-shell-rgb),.76) 244px,rgba(var(--top-shell-rgb),.28) 332px,rgba(var(--top-shell-rgb),0) 408px)!important;background-repeat:no-repeat!important}
body.my-view #myBuildsMobilePage.my-page:before{display:none!important}

@media(max-width:360px){
  #playstylesMobilePage{--ps-slot-w:40px;--ps-slot-h:42px;--ps-diamond:33px}
  #enhanceMobilePage .mastery-count{margin-right:1px!important}
  #apToolsMobilePage .aptool-actions{grid-template-columns:minmax(0,.42fr) minmax(0,.58fr)!important}
}
@media(prefers-reduced-motion:reduce){.psm-library-backdrop,#psmLibrary,.identity>.chev::before,.body-inline-arrow::before,.catarrow::before,.mastery-expand-btn::before,.facility-level-chevron::before,.aptool-ps-chev::before,.aptool-group-chev::before{transition-duration:.01ms!important}}


/* v1.31 · verified correction pass after v1.30 screenshots */

/* A · Style Context must be pixel-identical to Build Context typography/spacing. */
body #playstylesMobilePage>.psm-sticky.mobile-context-selector .identity{
  min-height:54px!important;height:54px!important;padding:8px 10px!important;
}
body #playstylesMobilePage>.psm-sticky.mobile-context-selector .level{
  min-width:0!important;width:100%!important;font-size:14.5px!important;font-weight:830!important;gap:8px!important;
}
body #playstylesMobilePage>.psm-sticky.mobile-context-selector .logo{
  width:27px!important;height:27px!important;flex-basis:27px!important;
}
body #playstylesMobilePage>.psm-sticky.mobile-context-selector .archcn{font-size:14.5px!important;font-weight:820!important}
body #playstylesMobilePage>.psm-sticky.mobile-context-selector .archen{font-size:10px!important}
body #playstylesMobilePage>.psm-sticky.mobile-context-selector .apwrap{margin:7px 3px 0!important;padding:0!important}
body #playstylesMobilePage>.psm-sticky.mobile-context-selector .apline{margin-bottom:6px!important}
body #playstylesMobilePage>.psm-sticky.mobile-context-selector .apline span{font-size:10.5px!important}
body #playstylesMobilePage>.psm-sticky.mobile-context-selector .aptrack{height:4px!important}

/* B · Give the modal a real bottom scroll reserve. GK's final 2 of 6 can always be lifted above browser UI. */
body #psmLibrary .psm-library-inner{
  padding-bottom:max(104px,calc(78px + env(safe-area-inset-bottom,0px)))!important;
  scroll-padding-top:72px!important;
  scroll-padding-bottom:max(104px,calc(78px + env(safe-area-inset-bottom,0px)))!important;
}
body #psmLibraryContent .psm-category:last-child{padding-bottom:8px!important}
/* RC2.4 · real trailing scroll room for the final PlayStyle detail card.
   Safari can make overflow-container padding feel shorter than expected when the
   Bottom System is present, so keep a content spacer inside the actual scroll flow. */
body #psmLibraryContent::after{
  content:"";
  display:block;
  width:100%;
  height:max(76px,calc(var(--bottom-tool-h,42px) + 34px));
  pointer-events:none;
}

/* C · Empty diamonds are rotated squares; their visual footprint is sqrt(2) larger.
   Keep the slot footprint, but use a smaller 29px square + real inter-slot gap. */
body #playstylesMobilePage{--ps-slot-w:42px;--ps-slot-h:44px;--ps-diamond:35px;--ps-empty-square:29px}
body #playstylesMobilePage .psm-regular-track{grid-auto-columns:var(--ps-slot-w)!important;gap:7px!important}
body #playstylesMobilePage .psm-source-strip{gap:7px!important}
body #playstylesMobilePage .psm-source-zone{gap:6px!important;min-width:42px!important}
body #playstylesMobilePage .psm-source-sep{margin:0 2px!important;height:34px!important}
body #playstylesMobilePage .psm-badge.empty .psm-badge-shell,
body #playstylesMobilePage .psm-badge.amp-add .psm-badge-shell{
  width:var(--ps-empty-square)!important;height:var(--ps-empty-square)!important;
}
body #playstylesMobilePage .psm-badge.empty.addable .psm-badge-shell::after,
body #playstylesMobilePage .psm-badge.amp-add .psm-badge-shell::after{font-size:16px!important}

/* D/E/F · Enhance headers: one inset, one baseline, less vertical waste. */
body #enhanceMobilePage .mastery-summary-top{
  min-height:36px!important;height:36px!important;padding:0 12px!important;
}
body #enhanceMobilePage .mastery-titleline{height:36px!important}
body #enhanceMobilePage .mastery-count{margin-right:0!important;padding-left:10px!important}
body #enhanceMobilePage .enh-section:first-of-type{margin-top:6px!important}
body #enhanceMobilePage .enh-section + .enh-section{margin-top:6px!important}
body #enhanceMobilePage .facility-mobile-head{
  min-height:32px!important;height:32px!important;margin:0 0 4px!important;padding:0 12px!important;
  display:flex!important;align-items:center!important;gap:8px!important;
}
body #enhanceMobilePage .facility-mobile-head:before{content:none!important;display:none!important}
body #enhanceMobilePage .facility-budget-wrap{margin-top:0!important}
body #enhanceMobilePage .mastery-quickbar{margin-bottom:5px!important}
body #enhanceMobilePage .mastery-list-shell{margin-top:2px!important}

/* G · Keep the accepted 2x2 AP layout, but put it cleanly inside an inset outer shell. */
body #apToolsMobilePage .aptool-top-card{
  margin-top:9px!important;margin-bottom:10px!important;padding:7px!important;
  border:1px solid rgba(var(--global-atmo-rgb),.10)!important;border-radius:18px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.026),rgba(var(--global-atmo-rgb),.008) 50%,rgba(255,255,255,.007))!important;
  box-shadow:0 14px 32px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.018)!important;
}
body #apToolsMobilePage .aptool-stats{gap:7px!important}
body #apToolsMobilePage .aptool-actions{gap:7px!important;margin-top:7px!important}
body #apToolsMobilePage .aptool-stat,
body #apToolsMobilePage .aptool-action{border-radius:12px!important}

@media(max-width:360px){
  body #playstylesMobilePage{--ps-slot-w:40px;--ps-slot-h:42px;--ps-diamond:33px;--ps-empty-square:28px}
  body #playstylesMobilePage .psm-regular-track{gap:6px!important}
  body #playstylesMobilePage .psm-source-strip{gap:5px!important}
  body #enhanceMobilePage .mastery-summary-top{padding-left:11px!important;padding-right:11px!important}
  body #enhanceMobilePage .facility-mobile-head{padding-left:11px!important;padding-right:11px!important}
}


/* v1.32 · final mobile closeout: Safari bottom containment, in-context EA confirm, compact Facilities */
:root{
  --bottom-runtime-reserve:128px;
  --browser-chrome-cover:240px;
}

/* 1 · Safari: the Bottom System is the visual and scroll boundary, even while browser chrome changes height. */
body .bottom-dock{
  isolation:isolate!important;
  overflow:visible!important;
}
body .bottom-browser-guard{
  position:absolute!important;
  z-index:0!important;
  left:-2px!important;right:-2px!important;top:0!important;
  bottom:calc(0px - var(--browser-chrome-cover))!important;
  pointer-events:none!important;
  background:var(--global-bg-bottom,#070b0f)!important;
}
body .bottom-dock:before,body .bottom-dock:after{z-index:1!important}
body .bottom-dock>.context-toolbar,body .bottom-dock>.nav{z-index:2!important}
body #scroll,body #playstylesMobilePage,body #enhanceMobilePage,body #apToolsMobilePage,body #myBuildsMobilePage{
  padding-bottom:var(--bottom-runtime-reserve)!important;
  scroll-padding-bottom:var(--bottom-runtime-reserve)!important;
}

/* 2 · Similar-player EA confirmation is a local centred dialog above the similarity panel. */
body.my-external-open #myOverlay{
  z-index:230!important;
  left:50%!important;right:auto!important;
  width:min(430px,100vw)!important;
  transform:translateX(-50%)!important;
  background:rgba(1,4,7,.58)!important;
  -webkit-backdrop-filter:blur(3px)!important;backdrop-filter:blur(3px)!important;
}
body #myExternalSheet.my-external-sheet{
  z-index:231!important;
  left:50%!important;top:50%!important;bottom:auto!important;
  width:min(360px,calc(100vw - 30px))!important;
  max-height:min(70dvh,460px)!important;
  padding:15px!important;
  border:1px solid rgba(255,255,255,.085)!important;
  border-radius:18px!important;
  overflow:auto!important;
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;
  transform:translate(-50%,calc(-50% + 12px)) scale(.985)!important;
  transition:opacity .16s ease,transform .20s cubic-bezier(.22,.78,.24,1),visibility 0s linear .20s!important;
  box-shadow:0 26px 70px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,255,255,.024)!important;
}
body #myExternalSheet.my-external-sheet.show{
  opacity:1!important;visibility:visible!important;pointer-events:auto!important;
  transform:translate(-50%,-50%) scale(1)!important;
  transition-delay:0s!important;
}
body #myExternalSheet.my-external-sheet:before{display:none!important}
body #myExternalSheet .my-sheet-head{margin-bottom:10px!important}
body #myExternalSheet .my-external-copy{margin:0 0 11px!important;padding:10px 11px!important}

/* 3 · Facility aggregate: labels sit beside information instead of consuming their own rows. */
body #enhanceMobilePage .facility-summary{
  padding:8px 10px!important;
}
body #enhanceMobilePage .facility-summary-line{
  display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;
  align-items:center!important;column-gap:8px!important;
}
body #enhanceMobilePage .facility-summary-line+.facility-summary-line{
  margin-top:6px!important;padding-top:6px!important;
  border-top:1px solid rgba(255,255,255,.045)!important;
}
body #enhanceMobilePage .facility-summary-top{
  margin:0!important;min-height:25px!important;height:auto!important;
  display:flex!important;align-items:center!important;gap:5px!important;
  white-space:nowrap!important;
}
body #enhanceMobilePage .facility-summary-top strong,
body #enhanceMobilePage .facility-ps-title{
  font-size:9.5px!important;font-weight:820!important;color:#737e87!important;line-height:1!important;white-space:nowrap!important;
}
body #enhanceMobilePage .facility-paused-pill{padding:2px 5px!important;font-size:7.6px!important}
body #enhanceMobilePage .facility-attr-chips{
  min-height:25px!important;gap:4px!important;align-items:center!important;align-content:center!important;
}
body #enhanceMobilePage .facility-attr-chip{height:25px!important;padding:0 7px!important}
body #enhanceMobilePage .facility-summary-empty{padding:2px 0!important;line-height:1.25!important}
body #enhanceMobilePage .facility-ps-summary{
  margin:0!important;padding:0!important;border-top:0!important;
  display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;column-gap:8px!important;
}
body #enhanceMobilePage .facility-ps-row{
  min-height:25px!important;gap:5px!important;align-items:center!important;
}
body #enhanceMobilePage .facility-ps-item.icon-only{gap:0!important;width:27px!important;height:27px!important;display:grid!important;place-items:center!important}
body #enhanceMobilePage .facility-ps-item .facility-ps-badge-mobile{width:26px!important;height:26px!important}

/* 4 · Enabled Facilities are dense information cards, not hero cards. */
body #enhanceMobilePage .facility-grid{gap:7px!important;margin-top:7px!important}
body #enhanceMobilePage .facility-card-mobile,
body #enhanceMobilePage .facility-add-mobile{
  min-height:94px!important;
  padding:7px 9px!important;
  border-radius:13px!important;
}
body #enhanceMobilePage .facility-card-mobile{padding-bottom:30px!important}
body #enhanceMobilePage .facility-card-top{
  min-height:26px!important;display:flex!important;align-items:center!important;gap:7px!important;
}
body #enhanceMobilePage .facility-card-icon{width:25px!important;height:25px!important;flex:0 0 25px!important}
body #enhanceMobilePage .facility-card-mobile h4{
  flex:1 1 auto!important;min-width:0!important;
  margin:0!important;padding:0!important;
  font-size:11.2px!important;line-height:1.15!important;
  white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
body #enhanceMobilePage .facility-card-level{
  flex:0 0 auto!important;height:20px!important;padding:0 6px!important;font-size:8.8px!important;
}
body #enhanceMobilePage .facility-card-boosts{
  min-height:22px!important;margin-top:6px!important;padding:6px 0 0!important;
  border-top:1px solid rgba(255,255,255,.04)!important;
  gap:4px 7px!important;align-items:center!important;align-content:center!important;
  line-height:1.2!important;
}
body #enhanceMobilePage .facility-card-boosts span{font-size:9.2px!important}
body #enhanceMobilePage .facility-card-boosts b{font-size:9.6px!important}
body #enhanceMobilePage .facility-card-foot{
  left:9px!important;right:8px!important;bottom:5px!important;
  min-height:22px!important;height:22px!important;padding:0!important;border:0!important;gap:6px!important;
}
body #enhanceMobilePage .facility-card-cost{font-size:9.5px!important}
body #enhanceMobilePage .facility-card-foot .facility-ps-badge-mobile{width:22px!important;height:22px!important}
body #enhanceMobilePage .facility-delete{width:22px!important;height:22px!important;border-radius:7px!important}
body #enhanceMobilePage .facility-add-mobile .plus{font-size:20px!important}
body #enhanceMobilePage .facility-add-mobile strong{margin-top:2px!important;font-size:10.5px!important}
body #enhanceMobilePage .facility-add-mobile small{margin-top:2px!important;font-size:8.5px!important}

@media(max-width:360px){
  body #enhanceMobilePage .facility-summary{padding-left:8px!important;padding-right:8px!important}
  body #enhanceMobilePage .facility-summary-line{column-gap:6px!important}
  body #enhanceMobilePage .facility-card-mobile,body #enhanceMobilePage .facility-add-mobile{min-height:92px!important;padding-left:8px!important;padding-right:8px!important}
}
@media(prefers-reduced-motion:reduce){body #myExternalSheet.my-external-sheet{transition-duration:.01ms!important}}


/* v1.33 · Structural App Shell
   The browser/document never scrolls. Exactly one page main scrolls inside the shell,
   while Bottom System is a real flex row at the bottom of the app, not a fixed overlay. */
:root{--app-shell-height:100vh}
@supports(height:100dvh){:root{--app-shell-height:100dvh}}

html,body{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
  -webkit-overflow-scrolling:auto!important;
}
body{
  position:relative!important;
  min-height:0!important;
  padding:0!important;
  touch-action:manipulation!important;
}
body .app{
  box-sizing:border-box!important;
  width:min(430px,100vw)!important;
  max-width:430px!important;
  height:var(--app-shell-height)!important;
  min-height:0!important;
  margin:0 auto!important;
  padding-top:var(--safe-top,env(safe-area-inset-top,0px))!important;
  padding-bottom:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}

/* The active page is the ONLY vertical scroller. */
body .app>main#scroll,
body .app>main#playstylesMobilePage,
body .app>main#enhanceMobilePage,
body .app>main#apToolsMobilePage,
body .app>main#myBuildsMobilePage{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  max-height:none!important;
  box-sizing:border-box!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-x:none!important;
  overscroll-behavior-y:contain!important;
  padding-bottom:26px!important;
  scroll-padding-bottom:26px!important;
  touch-action:pan-y!important;
}
body .app>main#myBuildsMobilePage{padding-bottom:24px!important;scroll-padding-bottom:24px!important}
body .app>main[hidden]{display:none!important}

/* Safe-area is owned by App Shell, so sticky offsets are relative to the inner page viewport. */
body #scroll>.mobile-context-title,
body #playstylesMobilePage>.mobile-context-title,
body #enhanceMobilePage>.mobile-context-title,
body #apToolsMobilePage>.aptool-page-title,
body #myBuildsMobilePage>.my-page-title{
  top:0!important;
}
body .sticky.mobile-context-selector{top:var(--mobile-context-title-h,58px)!important}
@media(max-width:360px){body .sticky.mobile-context-selector{top:56px!important}}
#playstylesMobilePage #psmLoadout{
  top:calc(var(--mobile-context-title-h,58px) + var(--psm-selector-stack-h) + var(--psm-loadout-gap,5px))!important;
}
#playstylesMobilePage .psm-detail-shell{
  scroll-margin-top:calc(var(--mobile-context-title-h,58px) + var(--psm-selector-stack-h) + 128px)!important;
}

/* Bottom System is now a genuine layout boundary. No fixed positioning, shields, or viewport chasing. */
body .bottom-dock{
  position:relative!important;
  flex:0 0 var(--bottom-shell-h)!important;
  z-index:120!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  width:100%!important;
  max-width:none!important;
  height:var(--bottom-shell-h)!important;
  min-height:var(--bottom-shell-h)!important;
  margin:0!important;
  transform:none!important;
  overflow:visible!important;
  pointer-events:none!important;
  background:var(--global-bg-bottom,#070b0f)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
body.my-view .bottom-dock{
  flex-basis:calc(var(--bottom-nav-h) + 8px + env(safe-area-inset-bottom,0px))!important;
  height:calc(var(--bottom-nav-h) + 8px + env(safe-area-inset-bottom,0px))!important;
  min-height:calc(var(--bottom-nav-h) + 8px + env(safe-area-inset-bottom,0px))!important;
}
body .bottom-browser-guard,#mobileBottomShield{display:none!important}

/* Old document-scroll compensation must not consume page height anymore. */
body:not(.my-view) .app,body.my-view .app{padding-bottom:0!important}

/* Keep the visual fade just above the real boundary, without covering browser chrome. */
body .bottom-dock:after{
  content:""!important;
  position:absolute!important;
  left:0!important;right:0!important;top:-14px!important;height:14px!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,transparent,var(--global-bg-bottom,#070b0f))!important;
}


/* v1.34 · keep v1.33 shell behavior unchanged; only compact Nav + prioritize Undo/Reset. */
:root{--bottom-nav-h:48px!important}

/* Slightly denser navigation, with the same interaction model and safe-area ownership. */
body .nav{
  height:var(--bottom-nav-h)!important;
  padding:2px 5px!important;
  border-radius:15px!important;
}
body .nav button{gap:1px!important;padding:1px 0!important;font-size:8.4px!important}
body .nav .icon,body .nav button.active .icon{width:24px!important;height:22px!important}
body .nav .nav-icon svg{width:19px!important;height:19px!important}
body .nav button:after{top:-2px!important}

/* Toolbar remains permanently visible/hidden exactly as in v1.33.
   Only the horizontal priority changes: Undo + Reset are the leftmost action group. */
body .context-toolbar{display:flex!important;align-items:center!important}
body .context-toolbar .undo{order:1!important}
body .context-toolbar .reset{order:2!important}
body .context-toolbar .toolbar-spacer{order:3!important;display:block!important;flex:1 1 auto!important}
body .context-toolbar .mode{order:4!important;margin-left:2px!important}
body .context-toolbar .enh-preset-toolbar{order:4!important;margin-left:auto!important}

/* Enhance previously used a grid just for control placement; preserve every control,
   but use the same left-priority language as the other pages. */
body.enh-view .context-toolbar{display:flex!important;justify-content:flex-start!important;column-gap:7px!important}
body.enh-view .context-toolbar .mode{display:none!important}
body.enh-view .context-toolbar .toolbar-spacer{display:block!important;flex:1 1 auto!important}
body.enh-view .enh-preset-toolbar{display:flex!important;align-items:center!important;gap:5px!important}
body.enh-view .enh-preset-save,
body.enh-view [data-enh-preset-load="A"],
body.enh-view [data-enh-preset-load="B"],
body.enh-view [data-enh-preset-load="C"]{grid-column:auto!important}

/* Pages that do not use Base/Match keep the two common actions at the left edge. */
body.psm-view .context-toolbar .mode,body.aptool-view .context-toolbar .mode{display:none!important}

@media(max-width:360px){
  :root{--bottom-nav-h:46px!important}
  body .nav button{font-size:8.1px!important}
  body .nav .nav-icon svg{width:18px!important;height:18px!important}
  body.enh-view .context-toolbar{column-gap:4px!important}
  body.enh-view .enh-preset-toolbar{gap:3px!important}
}


/* v1.35 · lock Context Selector to its original 10px title gap and replace the text glyph with SVG. */
:root{--mobile-context-sticky-gap:10px}
body .sticky.mobile-context-selector{
  top:calc(var(--mobile-context-title-h,58px) + var(--mobile-context-sticky-gap))!important;
}
@media(max-width:360px){
  body .sticky.mobile-context-selector{top:calc(56px + var(--mobile-context-sticky-gap))!important}
}

/* PlayStyles' third sticky row must inherit the same fixed 10px gap so it never jumps when selector pins. */
#playstylesMobilePage #psmLoadout{
  top:calc(var(--mobile-context-title-h,58px) + var(--mobile-context-sticky-gap) + var(--psm-selector-stack-h) + var(--psm-loadout-gap,5px))!important;
}
#playstylesMobilePage .psm-detail-shell{
  scroll-margin-top:calc(var(--mobile-context-title-h,58px) + var(--mobile-context-sticky-gap) + var(--psm-selector-stack-h) + 128px)!important;
}

.level-gesture-hint{
  width:15px!important;
  height:20px!important;
  flex:0 0 15px!important;
  display:inline-grid!important;
  place-items:center!important;
  font-size:0!important;
  line-height:0!important;
  animation:none!important;
  transform:none!important;
  color:#77838c!important;
  opacity:.76!important;
}
.level-gesture-hint .level-gesture-svg{
  width:14px!important;
  height:18px!important;
  display:block!important;
  overflow:visible!important;
}
.level-gesture-hint .level-gesture-svg path{
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.45!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  vector-effect:non-scaling-stroke;
}
.mobile-context-selector .level.level-dragging .level-gesture-hint{
  color:#cdb46d!important;
  opacity:1!important;
}


/* v1.36 · Keep the 10px visual breathing room, but make it an opaque part of the Top Shell.
   This prevents scrolled attribute/content rows from showing through the sticky gap. */
body .sticky.mobile-context-selector::before{
  content:""!important;
  position:absolute!important;
  z-index:2!important;
  pointer-events:none!important;
  left:0!important;
  right:0!important;
  top:calc(-1 * var(--mobile-context-sticky-gap,10px))!important;
  height:var(--mobile-context-sticky-gap,10px)!important;
  background:rgb(var(--top-shell-rgb))!important;
  box-shadow:0 1px 0 rgba(var(--top-shell-rgb),1)!important;
}


/* v1.37 · discoverable level picker + mobile My Build pickers + PC price tiers + live AP category feedback */
:root{
  --price-high:#e49a90;
  --price-medium:#e0b35e;
  --price-low:#a8c0a2;
  --price-discount:#d3db8c;
}

/* Level remains draggable, but now visibly behaves like a tappable control too. */
.mobile-context-selector .level{
  cursor:pointer!important;
  transition:background .16s ease,box-shadow .16s ease,color .16s ease!important;
}
.mobile-context-selector .level:active{background:rgba(199,170,95,.055)!important}
.mobile-context-selector .level.level-discover-pulse{animation:levelDiscoverPulse 1.7s ease 1 both!important}
@keyframes levelDiscoverPulse{
  0%,100%{background:transparent;box-shadow:none}
  38%{background:rgba(199,170,95,.065);box-shadow:inset 0 0 0 1px rgba(199,170,95,.12)}
}

/* Reusable in-app utility sheet. It is absolute to the App Shell, not browser-fixed. */
.mobile-utility-backdrop{
  position:absolute;inset:0;z-index:280;display:block;pointer-events:none;opacity:0;
  background:rgba(2,5,8,.58);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  transition:opacity .16s ease;touch-action:none;
}
.mobile-utility-backdrop.show{opacity:1;pointer-events:auto}
.mobile-utility-sheet{
  position:absolute;z-index:281;left:12px;right:12px;bottom:12px;
  max-height:min(72%,560px);display:flex;flex-direction:column;
  border:1px solid rgba(255,255,255,.09);border-radius:18px;
  background:linear-gradient(180deg,rgba(15,22,28,.995),rgba(8,13,17,.998));
  box-shadow:0 26px 72px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,255,255,.025);
  opacity:0;visibility:hidden;pointer-events:none;transform:translateY(16px) scale(.992);
  transition:opacity .16s ease,transform .20s cubic-bezier(.22,.78,.24,1),visibility 0s linear .20s;
  overflow:hidden;
}
.mobile-utility-sheet.show{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition-delay:0s}
.mobile-utility-head{flex:0 0 auto;min-height:58px;padding:11px 12px 9px 14px;display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.055)}
.mobile-utility-head-copy{min-width:0;display:flex;flex-direction:column;gap:2px}
.mobile-utility-head-copy>span{font-size:7.8px;font-weight:820;letter-spacing:.13em;color:#656f77}
.mobile-utility-head-copy>strong{font-size:13.2px;line-height:1.15;color:#e3e8eb;font-weight:840}
.mobile-utility-head-copy>small{font-size:8.8px;line-height:1.25;color:#69747d;font-weight:650}
.mobile-utility-close{margin-left:auto;width:32px;height:32px;flex:0 0 32px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.02);color:#8d979f;font-size:20px;line-height:1}
.mobile-utility-body{min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;padding:12px 13px calc(13px + env(safe-area-inset-bottom,0px));overscroll-behavior:contain}
.mobile-choice-grid{display:grid;gap:7px}
.mobile-choice-grid.level{grid-template-columns:repeat(5,minmax(0,1fr))}
.mobile-choice-grid.formation{grid-template-columns:repeat(2,minmax(0,1fr))}
.mobile-choice-grid.position{grid-template-columns:repeat(3,minmax(0,1fr))}
.mobile-choice-option{height:38px;border:1px solid rgba(255,255,255,.065);border-radius:10px;background:rgba(255,255,255,.018);color:#aab4bb;font-size:10.5px;font-weight:780;display:grid;place-items:center}
.mobile-choice-option.current{border-color:rgba(199,170,95,.27);background:rgba(199,170,95,.075);color:#dcc47e;box-shadow:inset 0 0 0 1px rgba(199,170,95,.025)}
.mobile-choice-option.locked{opacity:.34}
.mobile-choice-grid.level .mobile-choice-option{height:36px;font-variant-numeric:tabular-nums}
.mobile-choice-grid.formation .mobile-choice-option{font-size:10.2px}
.mobile-choice-grid.position .mobile-choice-option{font-size:11px}

/* My Build: custom tap sheets replace invisible native select hit testing on phones. */
#myCurrentOverview .myov-pick-input:not(.readonly){cursor:pointer!important}
#myCurrentOverview .myov-pick-input select{pointer-events:none!important}
#myCurrentOverview .myov-pick-input:not(.readonly):active{background:rgba(199,170,96,.05)!important;border-color:rgba(199,170,96,.16)!important}

/* Restore PC's verified pricing language: 高 / 中 / 低 / 折 + exact curve colors. */
#scroll .atop{justify-content:flex-start!important;align-items:center!important;gap:5px!important}
#scroll .avalwrap{margin-left:auto!important}
#scroll .attr-price-tier{display:inline-flex;align-items:center;gap:3.5px;flex:0 0 auto;color:#66727e;font-size:8.5px;line-height:1;font-weight:650;opacity:.78;white-space:nowrap}
#scroll .attr-price-tier:before{content:"";width:4.5px;height:4.5px;border-radius:50%;background:#66727e;flex:0 0 auto}
#scroll .attr-price-tier.high:before{background:var(--price-high)}
#scroll .attr-price-tier.medium:before{background:var(--price-medium)}
#scroll .attr-price-tier.low:before{background:var(--price-low)}
#scroll .attr-price-tier.discount:before{background:var(--price-discount)}

/* Category header owns the live drag-cost readout, immediately left of its chevron. */
#scroll .cat-ap-live{
  margin-left:auto;margin-right:7px;width:66px;flex:0 0 66px;text-align:right;
  color:#d7bd72;font-size:9.2px;line-height:1;font-weight:820;font-variant-numeric:tabular-nums;
  opacity:0;transform:translateY(1px);transition:opacity .10s ease,color .10s ease;pointer-events:none;white-space:nowrap;
}
#scroll .cat-ap-live.show{opacity:1}
#scroll .cat-ap-live.refund{color:#8fbd9d}
#scroll .catarrow{margin-left:0!important}

/* AP price help is a compact Build-toolbar utility. */
body .context-toolbar .price-help-tool{
  order:3!important;width:45px!important;min-width:45px!important;height:30px!important;padding:0 5px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:3px!important;
  border-radius:9px!important;color:#7d8992!important;font-size:8.2px!important;font-weight:780!important;
}
body .context-toolbar .price-help-tool svg{width:14px!important;height:14px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.55!important;stroke-linecap:round!important;stroke-linejoin:round!important}
body .context-toolbar .price-help-tool:active{color:#d7bf78!important;border-color:rgba(199,170,95,.18)!important;background:rgba(199,170,95,.05)!important}
body .context-toolbar .toolbar-spacer{order:4!important}
body .context-toolbar .mode{order:5!important}
body.psm-view .context-toolbar .price-help-tool,body.enh-view .context-toolbar .price-help-tool,body.aptool-view .context-toolbar .price-help-tool,body.my-view .context-toolbar .price-help-tool{display:none!important}

.mobile-price-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.mobile-price-card{min-width:0;padding:10px 10px 9px;border:1px solid rgba(255,255,255,.06);border-radius:11px;background:rgba(255,255,255,.018)}
.mobile-price-name{display:flex;align-items:center;gap:6px;color:#c9d0d5;font-size:10.5px;font-weight:800}
.mobile-price-dot{width:6px;height:6px;border-radius:50%}.mobile-price-dot.high{background:var(--price-high)}.mobile-price-dot.medium{background:var(--price-medium)}.mobile-price-dot.low{background:var(--price-low)}.mobile-price-dot.discount{background:var(--price-discount)}
.mobile-price-desc{margin-top:5px;color:#6f7a82;font-size:8.6px;line-height:1.38}
.mobile-price-note{margin-top:10px;padding:9px 10px;border-radius:10px;background:rgba(255,255,255,.016);color:#68737b;font-size:8.7px;line-height:1.5}
@media(max-width:360px){
  .mobile-utility-sheet{left:9px;right:9px;bottom:9px}.mobile-choice-grid.level{grid-template-columns:repeat(5,minmax(0,1fr))}
  body .context-toolbar .price-help-tool{width:41px!important;min-width:41px!important;padding:0 4px!important}
  #scroll .cat-ap-live{width:61px;flex-basis:61px;font-size:8.8px}
}
@media(prefers-reduced-motion:reduce){.mobile-utility-backdrop,.mobile-utility-sheet,.mobile-context-selector .level.level-discover-pulse{transition:none!important;animation:none!important}}


/* v1.38 · compact inline level slider + clickable archetype chevron + preview-only export */
.mobile-context-selector .level{
  background:rgba(199,170,95,.035)!important;
  box-shadow:inset 0 0 0 1px rgba(199,170,95,.055)!important;
}
.mobile-context-selector .level:hover,
.mobile-context-selector .level:active,
.mobile-context-selector .identity.level-dropdown-open .level{
  background:rgba(199,170,95,.065)!important;
  box-shadow:inset 0 0 0 1px rgba(199,170,95,.12)!important;
}
.mobile-context-selector .identity>.chev{
  pointer-events:auto!important;
  cursor:pointer!important;
  border-radius:9px!important;
}
.mobile-context-selector .identity>.chev:active{background:rgba(255,255,255,.028)!important}

.level-inline-pop{
  position:absolute!important;
  z-index:72!important;
  left:8px!important;right:8px!important;
  top:calc(100% + 6px)!important;
  height:43px!important;
  padding:0 10px!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:9px!important;
  border:1px solid rgba(255,255,255,.085)!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,rgba(15,22,28,.995),rgba(8,13,17,.998))!important;
  box-shadow:0 18px 44px rgba(0,0,0,.44),inset 0 1px 0 rgba(255,255,255,.022)!important;
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;
  transform:translateY(-5px) scale(.99)!important;
  transition:opacity .13s ease,transform .16s cubic-bezier(.22,.78,.24,1),visibility 0s linear .16s!important;
}
.identity.level-dropdown-open>.level-inline-pop{
  opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important;transition-delay:0s!important;
}
.level-inline-bound{
  color:#74808a!important;font-size:8.8px!important;font-weight:760!important;white-space:nowrap!important;font-variant-numeric:tabular-nums!important;
}
.level-inline-bound.max{color:#9a8654!important}
.level-inline-range{
  -webkit-appearance:none!important;appearance:none!important;width:100%!important;height:26px!important;margin:0!important;background:transparent!important;touch-action:none!important;
}
.level-inline-range::-webkit-slider-runnable-track{
  height:4px!important;border-radius:999px!important;background:linear-gradient(90deg,rgba(199,170,95,.58),rgba(255,255,255,.08))!important;
}
.level-inline-range::-webkit-slider-thumb{
  -webkit-appearance:none!important;appearance:none!important;width:18px!important;height:18px!important;margin-top:-7px!important;border-radius:50%!important;border:2px solid #d6bd74!important;background:#11181e!important;box-shadow:0 2px 9px rgba(0,0,0,.45)!important;
}
.level-inline-range::-moz-range-track{height:4px;border:0;border-radius:999px;background:rgba(255,255,255,.08)}
.level-inline-range::-moz-range-progress{height:4px;border-radius:999px;background:rgba(199,170,95,.58)}
.level-inline-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;border:2px solid #d6bd74;background:#11181e}
@media(max-width:360px){.level-inline-pop{left:5px!important;right:5px!important;padding-left:8px!important;padding-right:8px!important;gap:7px!important}}

/* Export image preview: no auto-download, just a long-pressable image in the App Shell. */
.mobile-export-preview{
  position:absolute;inset:0;z-index:340;display:flex;align-items:center;justify-content:center;
  padding:calc(14px + env(safe-area-inset-top,0px)) 12px calc(14px + env(safe-area-inset-bottom,0px));
  background:rgba(1,4,7,.88);opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .15s ease,visibility 0s linear .15s;
}
.mobile-export-preview.show{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
.mobile-export-preview-inner{
  position:relative;max-width:100%;max-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
}
.mobile-export-preview-img{
  display:block;max-width:100%;max-height:calc(100dvh - 118px);width:auto;height:auto;object-fit:contain;
  border-radius:8px;box-shadow:0 24px 72px rgba(0,0,0,.55);-webkit-touch-callout:default!important;user-select:auto!important;touch-action:auto!important;
}
.mobile-export-preview-close{
  position:absolute;right:4px;top:4px;width:34px;height:34px;border-radius:11px;border:1px solid rgba(255,255,255,.14);
  background:rgba(6,10,14,.84);color:#d7dde1;font-size:22px;line-height:1;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.35)
}
.mobile-export-preview-hint{font-size:9px;line-height:1.2;font-weight:700;color:#8a949b;letter-spacing:.02em;text-align:center}
@media(prefers-reduced-motion:reduce){.level-inline-pop,.mobile-export-preview{transition-duration:.01ms!important}}


/* v1.39 · Base / Match toggle uses one fixed semantic gold for the selected state. */
body .context-toolbar .mode button{
  color:#7f8a95!important;
  background:transparent!important;
  box-shadow:none!important;
}
body .context-toolbar .mode button.active,
body .context-toolbar .mode button[data-mode="base"].active,
body .context-toolbar .mode button[data-mode="match"].active{
  color:#e2c36f!important;
  background:rgba(199,170,95,.105)!important;
  box-shadow:inset 0 0 0 1px rgba(199,170,95,.20),0 1px 4px rgba(0,0,0,.16)!important;
}


/* v1.40 · My Builds important actions become three independent action cards. */
body #myBuildsMobilePage .my-overview-actions{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;
  margin-top:10px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
body #myBuildsMobilePage .my-overview-actions .my-action,
body #myBuildsMobilePage .my-overview-actions .my-action.primary,
body #myBuildsMobilePage .my-overview-actions .my-action.accent,
body #myBuildsMobilePage .my-overview-actions .my-sim-action{
  position:relative!important;
  height:54px!important;
  min-width:0!important;
  padding:0 7px!important;
  border:1px solid rgba(255,255,255,.072)!important;
  border-radius:14px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.014))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.026),0 7px 18px rgba(0,0,0,.10)!important;
  color:#d5dbe0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  font-size:11px!important;
  font-weight:820!important;
  letter-spacing:0!important;
  overflow:hidden!important;
  transition:transform .10s ease,border-color .13s ease,background .13s ease,color .13s ease!important;
}
body #myBuildsMobilePage .my-overview-actions .my-action+ .my-action:before{display:none!important}
body #myBuildsMobilePage .my-overview-actions .my-action::after{
  content:"";position:absolute;left:10px;right:10px;top:0;height:2px;border-radius:0 0 2px 2px;
  background:rgba(218,224,228,.16);pointer-events:none;
}
body #myBuildsMobilePage .my-overview-actions #mySaveCurrentBtn{
  border-color:rgba(218,190,112,.22)!important;
  background:linear-gradient(180deg,rgba(215,187,109,.105),rgba(215,187,109,.038))!important;
  color:#e1c777!important;
}
body #myBuildsMobilePage .my-overview-actions #mySaveCurrentBtn::after{background:rgba(226,195,111,.72)!important}
body #myBuildsMobilePage .my-overview-actions .my-action-icon{
  width:18px;height:18px;flex:0 0 18px;display:grid;place-items:center;color:#98a3ab;
}
body #myBuildsMobilePage .my-overview-actions #mySaveCurrentBtn .my-action-icon{color:#d7b968}
body #myBuildsMobilePage .my-overview-actions .my-action-icon svg{
  width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;
}
body #myBuildsMobilePage .my-overview-actions .my-action-label{
  min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
body #myBuildsMobilePage .my-overview-actions .my-action:active{
  transform:scale(.975)!important;
  border-color:rgba(226,195,111,.24)!important;
  background:linear-gradient(180deg,rgba(226,195,111,.075),rgba(226,195,111,.025))!important;
  color:#e3cc86!important;
}
body #myBuildsMobilePage .my-overview-actions .my-action:active .my-action-icon{color:#e3c76f!important}
body #myBuildsMobilePage .my-overview-actions .my-sim-action sup{
  position:absolute!important;right:5px!important;top:4px!important;
  padding:2px 4px!important;border-radius:5px!important;
  background:rgba(215,189,119,.10)!important;color:#cdb66d!important;
  font-size:5.4px!important;line-height:1!important;font-weight:900!important;letter-spacing:.06em!important;
}
@media(max-width:360px){
  body #myBuildsMobilePage .my-overview-actions{gap:5px!important}
  body #myBuildsMobilePage .my-overview-actions .my-action,
  body #myBuildsMobilePage .my-overview-actions .my-action.primary,
  body #myBuildsMobilePage .my-overview-actions .my-action.accent,
  body #myBuildsMobilePage .my-overview-actions .my-sim-action{height:51px!important;padding:0 5px!important;gap:4px!important;font-size:10.3px!important}
  body #myBuildsMobilePage .my-overview-actions .my-action-icon{width:16px;height:16px;flex-basis:16px}
  body #myBuildsMobilePage .my-overview-actions .my-action-icon svg{width:16px;height:16px}
}


/* v1.41 · keep v1.40 action-card hierarchy, reduce vertical footprint. */
body #myBuildsMobilePage .my-overview-actions{
  gap:6px!important;
  margin-top:8px!important;
}
body #myBuildsMobilePage .my-overview-actions .my-action,
body #myBuildsMobilePage .my-overview-actions .my-action.primary,
body #myBuildsMobilePage .my-overview-actions .my-action.accent,
body #myBuildsMobilePage .my-overview-actions .my-sim-action{
  height:46px!important;
  padding:0 6px!important;
  border-radius:12px!important;
  gap:5px!important;
  font-size:10.7px!important;
}
body #myBuildsMobilePage .my-overview-actions .my-action::after{
  left:9px!important;right:9px!important;height:1.5px!important;
}
body #myBuildsMobilePage .my-overview-actions .my-action-icon{
  width:16px!important;height:16px!important;flex-basis:16px!important;
}
body #myBuildsMobilePage .my-overview-actions .my-action-icon svg{
  width:16px!important;height:16px!important;
}
body #myBuildsMobilePage .my-overview-actions .my-sim-action sup{
  right:4px!important;top:3px!important;
  padding:1.5px 3.5px!important;
  font-size:5.1px!important;
}
@media(max-width:360px){
  body #myBuildsMobilePage .my-overview-actions{gap:4px!important;margin-top:7px!important}
  body #myBuildsMobilePage .my-overview-actions .my-action,
  body #myBuildsMobilePage .my-overview-actions .my-action.primary,
  body #myBuildsMobilePage .my-overview-actions .my-action.accent,
  body #myBuildsMobilePage .my-overview-actions .my-sim-action{height:44px!important;padding:0 4px!important;gap:3px!important;font-size:10px!important}
  body #myBuildsMobilePage .my-overview-actions .my-action-icon{width:15px!important;height:15px!important;flex-basis:15px!important}
  body #myBuildsMobilePage .my-overview-actions .my-action-icon svg{width:15px!important;height:15px!important}
}


#psmSpecPanel .psm-spec-card:not(.base) .psm-spec-art{
  background:
    radial-gradient(circle at 50% 9%,rgba(103,137,166,.22),transparent 53%),
    radial-gradient(circle at 50% 113%,rgba(211,184,95,.14),transparent 46%),
    linear-gradient(180deg,#121b23,#091016)!important;
}
#psmSpecPanel .psm-spec-card:not(.base) .psm-spec-art::before{
  content:""!important;position:absolute!important;inset:0!important;z-index:1!important;
  opacity:.28!important;filter:none!important;mix-blend-mode:normal!important;
  background-image:
    linear-gradient(rgba(255,255,255,.017) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.017) 1px,transparent 1px)!important;
  background-size:25% 50%!important;pointer-events:none!important;
}
#psmSpecPanel .psm-spec-card:not(.base) .psm-spec-art::after{display:none!important}

/* New IMG is a sibling of .psm-spec-art, not its descendant.
   Every legacy .psm-spec-art img rule is therefore isolated from the new player. */
#psmSpecPanel .psm-spec-portrait-stage-v2{
  position:absolute!important;inset:0 0 39px!important;z-index:1!important;
  overflow:hidden!important;pointer-events:none!important;transform:none!important;animation:none!important;
}
#psmSpecPanel .psm-spec-portrait-stage-v2::after{
  content:"";position:absolute;z-index:3;left:0;right:0;bottom:0;height:55%;
  background:linear-gradient(180deg,transparent,rgba(8,13,18,.96));pointer-events:none;
}
#psmSpecPanel .psm-spec-portrait-v2{
  position:absolute!important;z-index:2!important;
  left:calc(50% + var(--psm-portrait-x,0%))!important;
  top:calc(50% + var(--psm-portrait-y,18%))!important;
  height:var(--psm-portrait-scale,105%)!important;width:auto!important;
  max-width:none!important;max-height:none!important;object-fit:contain!important;
  transform:translate(-50%,-50%)!important;transform-origin:center center!important;
  animation:none!important;pointer-events:none!important;
  transition:filter 420ms ease,opacity 320ms ease!important;
  filter:grayscale(.98) saturate(.16) brightness(.44) contrast(.94) blur(.55px)
         drop-shadow(0 8px 13px rgba(0,0,0,.24))!important;
}
#psmSpecPanel .psm-spec-card.unlocked .psm-spec-portrait-v2{
  filter:saturate(1) brightness(1) contrast(1) drop-shadow(0 8px 13px rgba(0,0,0,.28))!important;
}
#psmSpecPanel .psm-spec-card.equipped .psm-spec-portrait-v2{
  filter:saturate(1.025) brightness(1.01) contrast(1.005) drop-shadow(0 8px 14px rgba(0,0,0,.30))!important;
}
#psmSpecPanel .psm-spec-card:hover .psm-spec-portrait-v2,
#psmSpecPanel .psm-spec-card:active .psm-spec-portrait-v2,
#psmSpecPanel .psm-spec-card.focused .psm-spec-portrait-v2,
#psmSpecPanel .psm-spec-card.newly-equipped .psm-spec-portrait-v2{
  transform:translate(-50%,-50%)!important;
}
#psmSpecPanel .psm-spec-card:not(.base) .psm-spec-player{z-index:4!important}
#psmSpecPanel .psm-spec-card:not(.base) .psm-spec-card-copy{z-index:5!important}
#psmSpecPanel .psm-spec-card:not(.base) .psm-spec-card-badge{z-index:6!important}
#psmSpecPanel .psm-spec-card:not(.base) .psm-spec-status{z-index:7!important}
@media(prefers-reduced-motion:reduce){
  #psmSpecPanel .psm-spec-portrait-v2{transition-duration:.01ms!important}
}


/* RC2.6.1 · language control shares exactly the same shell geometry as Theme. */
body #scroll>.mobile-context-title,
body #playstylesMobilePage>.mobile-context-title,
body #enhanceMobilePage>.mobile-context-title,
body #apToolsMobilePage>.aptool-page-title,
body #myBuildsMobilePage>.my-page-title{
  padding-right:calc(var(--mobile-page-gutter,13px) + 118px)!important;
}
body .page-lang-btn,
body .page-theme-btn{
  top:11px!important;width:46px!important;height:34px!important;border-radius:12px!important;
}
body .page-theme-btn{right:calc(var(--mobile-page-gutter,13px) + 8px)!important}
body .page-lang-btn{
  position:absolute!important;right:calc(var(--mobile-page-gutter,13px) + 61px)!important;
  border:1px solid rgba(235,241,247,.10)!important;
  background:linear-gradient(180deg,rgba(30,37,43,.58),rgba(12,18,23,.48))!important;
  color:#7c8790!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;
  gap:3px!important;box-shadow:0 10px 26px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.055)!important;
  -webkit-backdrop-filter:blur(18px) saturate(118%)!important;backdrop-filter:blur(18px) saturate(118%)!important;
  z-index:40!important;-webkit-tap-highlight-color:transparent!important;transition:transform .11s ease,border-color .16s ease,background .16s ease!important;
}
body .page-lang-btn:active{transform:scale(.965)!important;border-color:rgba(var(--semantic-gold-rgb),.25)!important}
body .page-lang-btn .lang-mini{font-size:10px!important;line-height:1!important;font-weight:850!important;color:#707b84!important;transition:color .15s ease!important}
body .page-lang-btn i{font-style:normal!important;font-size:8.5px!important;color:#454f57!important;font-weight:700!important}
html[lang="zh-CN"] body .page-lang-btn .lang-sc,
html[lang="zh-HK"] body .page-lang-btn .lang-tc{color:#d9c27f!important;text-shadow:0 0 9px rgba(215,189,119,.12)!important}
@media(max-width:360px){
  body #scroll>.mobile-context-title,
  body #playstylesMobilePage>.mobile-context-title,
  body #enhanceMobilePage>.mobile-context-title,
  body #apToolsMobilePage>.aptool-page-title,
  body #myBuildsMobilePage>.my-page-title{padding-right:calc(var(--mobile-page-gutter,10px) + 114px)!important}
  body .page-lang-btn,body .page-theme-btn{top:10px!important;width:44px!important;height:33px!important}
  body .page-theme-btn{right:calc(var(--mobile-page-gutter,10px) + 8px)!important}
  body .page-lang-btn{right:calc(var(--mobile-page-gutter,10px) + 59px)!important}
}


/* RC2.6.11 · Body chevron geometry
   Position the chevron at the true visual midpoint between:
   [weight metric right edge] <-> [gender control left edge].
   This automatically adapts when zh-HK 「長時加速」 makes the right control
   cluster wider, as well as across viewport/unit/font changes. */
#scroll .bodyrow{
  --body-chevron-left:50%;
}
#scroll .body-inline-arrow{
  left:var(--body-chevron-left)!important;
}


/* RC2.6.17 · iOS Safari PlayStyle badge compositing fix. Shell-level filters
   caused a stale/clipped diamond fragment specifically in locked/equipped states. */
#psmLibrary .psm-tile.locked .psm-badge-shell,
#psmLibrary .psm-tile.unreachable .psm-badge-shell,
#psmLibrary .psm-tile.equipped .psm-badge-shell{
  filter:none!important;
  -webkit-filter:none!important;
}
