:root{color-scheme:dark;--bg:#101217;--panel:#1b1f29;--line:#343a48;--text:#f2f4f8;--accent:#7fc7ff}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--text);overscroll-behavior:none}
button,select{border:1px solid var(--line);background:#252a36;color:var(--text);border-radius:8px;padding:7px 10px;font-weight:700;touch-action:manipulation}
button:active,.active{background:#3a4355;transform:translateY(1px)}
.hidden{display:none!important}
#app{height:100%;height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr)}
#topbar{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;align-items:center;padding:6px 8px;background:rgba(18,21,28,.97);border-bottom:1px solid var(--line);z-index:20}
.brand{font-weight:900;letter-spacing:.06em;white-space:nowrap;font-size:15px}.brand small{font-size:11px;opacity:.85}
.primaryToolbar{display:flex;gap:5px;justify-content:flex-end;min-width:0}.primaryToolbar button{white-space:nowrap}
.toolbar{grid-column:1/-1;display:flex;gap:5px;overflow-x:auto;padding:1px 0 2px;scrollbar-width:thin}.toolbar>*{flex:0 0 auto}
#topbar select{min-height:34px;border:1px solid rgba(255,255,255,.18);background:#252b38;color:#f4f6fb;padding:0 8px;font:inherit}
#gameWrap{position:relative;min-height:0;overflow:hidden;background:#111621}
#game{display:block;width:100%;height:100%;touch-action:none;background:#8cc7e8}
#showUiBtn{position:absolute;z-index:30;top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));background:rgba(22,26,36,.9)}
#hud{pointer-events:none;position:absolute;z-index:4;left:0;right:0;top:8px;display:flex;justify-content:space-between;align-items:flex-start;padding:0 12px;font-weight:900;text-shadow:0 2px 3px #000}
.fighterHud{display:flex;gap:8px;align-items:center;background:rgba(0,0,0,.35);padding:7px 10px;border-radius:10px}.fighterHud span:nth-child(2){font-size:26px}.p1{border-left:4px solid #68b7ff}.p2{border-right:4px solid #ff7777}
#modeLabel{background:rgba(0,0,0,.35);padding:6px 10px;border-radius:8px;font-size:13px}
#editorPanel{position:absolute;left:50%;transform:translateX(-50%);bottom:10px;max-width:95%;min-width:min(720px,95%);max-height:min(52vh,520px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;background:rgba(20,23,31,.94);border:1px solid var(--line);border-radius:12px;padding:8px;z-index:7}.panelRow{display:flex;flex-wrap:wrap;gap:6px;overflow:visible}.hint{font-size:12px;opacity:.8;margin-top:6px;text-align:center}.toolRow{padding-bottom:6px;margin-bottom:6px;border-bottom:1px solid var(--line)}.toolRow button.active{background:#49617b;border-color:#8ed0ff}
#touchControls,#touchControls *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;touch-action:none}
#touchControls{position:absolute;z-index:10;inset:0;pointer-events:none;overflow:hidden}.touchCluster{pointer-events:auto}
.leftCluster{pointer-events:auto!important;position:absolute;left:10px;bottom:8px;display:block;width:186px;height:186px;border-radius:50%;background:rgba(15,18,25,.42);border:1px solid rgba(255,255,255,.16)}
.leftCluster .dir{pointer-events:auto!important;position:absolute;width:54px;height:54px;border-radius:50%;padding:0;font-size:21px;display:grid;place-items:center;opacity:.42;transition:opacity .08s,background .08s,transform .08s}.leftCluster .dir.active{opacity:.95;background:rgba(95,170,230,.72);transform:scale(1.05)}.leftCluster .dir-up{left:66px;top:4px}.leftCluster .dir-up-right{right:13px;top:20px}.leftCluster .dir-right{right:4px;top:66px}.leftCluster .dir-down-right{right:13px;bottom:20px}.leftCluster .dir-down{left:66px;bottom:4px}.leftCluster .dir-down-left{left:13px;bottom:20px}.leftCluster .dir-left{left:4px;top:66px}.leftCluster .dir-up-left{left:13px;top:20px}.dpadCenter{position:absolute;left:63px;top:63px;width:60px;height:60px;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.42),rgba(105,142,180,.72) 46%,rgba(32,47,68,.92));border:2px solid rgba(255,255,255,.5);box-shadow:0 4px 12px rgba(0,0,0,.42),inset 0 1px 3px rgba(255,255,255,.34);pointer-events:none;transform:translate(var(--stick-x,0px),var(--stick-y,0px));transition:transform .09s ease-out}.leftCluster.joystick-active .dpadCenter{transition:none;box-shadow:0 3px 9px rgba(0,0,0,.48),0 0 0 4px rgba(105,190,255,.16),inset 0 1px 3px rgba(255,255,255,.38)}
.rightCluster{position:absolute;inset:0;pointer-events:none;z-index:2}.rightCluster button{position:absolute;width:62px;height:54px;font-size:11px;pointer-events:auto;display:block;opacity:1;visibility:visible}.rightCluster [data-key=jump]{right:10px;bottom:8px;height:112px}.rightCluster [data-key=attack]{right:78px;bottom:66px}.rightCluster [data-key=special]{right:146px;bottom:66px}.rightCluster [data-key=fireball]{right:214px;bottom:66px}.rightCluster [data-key=shield]{right:78px;bottom:8px}.rightCluster [data-key=grab]{right:146px;bottom:8px}
#touchControls.controls-customizing{pointer-events:auto;background:rgba(8,12,18,.18);z-index:25}#touchControls.controls-customizing .leftCluster,#touchControls.controls-customizing .rightCluster button{outline:3px dashed rgba(255,255,255,.9);outline-offset:3px;cursor:move}#touchControls.controls-customizing .leftCluster::after{content:'DRAG PAD';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:10px;font-weight:900;white-space:nowrap;pointer-events:none;color:#fff;text-shadow:0 1px 2px #000}#controlsBtn.active{background:#49617b;border-color:#8ed0ff}
body.ui-hidden #topbar{display:none}body.ui-hidden #app{grid-template-rows:minmax(0,1fr)}body.ui-hidden #showUiBtn{display:block!important}
:fullscreen #app{-webkit-user-select:none;user-select:none}
@media (pointer:fine){#touchControls{display:none}}
@media (max-width:1100px){
  #topbar{grid-template-columns:1fr;padding:4px 6px}.brand{display:none}.primaryToolbar{justify-content:flex-start;overflow-x:auto}.primaryToolbar button{font-size:12px;padding:6px 8px}.toolbar{grid-column:1}
  .fighterHud span:nth-child(2){font-size:20px}
}
@media (max-width:600px){
  .leftCluster{transform:scale(.82);transform-origin:left bottom}
  .rightCluster button{width:54px;height:48px;font-size:10px}.rightCluster [data-key=jump]{height:100px}.rightCluster [data-key=attack]{right:70px;bottom:60px}.rightCluster [data-key=special]{right:130px;bottom:60px}.rightCluster [data-key=fireball]{right:190px;bottom:60px}.rightCluster [data-key=shield]{right:70px}.rightCluster [data-key=grab]{right:130px}
  #modeLabel{font-size:11px}.fighterHud{padding:5px 7px;gap:5px}
}


/* v5.17 tabletop two-player layout */
#touchControls,#topTouchControls,#touchControls *,#topTouchControls *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;touch-action:none}
.tabletopControls{position:absolute;z-index:10;left:0;right:0;pointer-events:none;overflow:hidden}
.tabletopControls .touchCluster{pointer-events:auto}
#touchControls{top:50%;bottom:0}
#topTouchControls{top:0;bottom:50%;transform:rotate(180deg);transform-origin:center center;border-bottom:2px solid rgba(255,255,255,.45)}
#topTouchControls .leftCluster,#touchControls .leftCluster{bottom:8px}
#topTouchControls .rightCluster,#touchControls .rightCluster{bottom:12px}
.playerSideLabel{position:absolute;left:50%;top:8px;transform:translateX(-50%);font-size:12px;font-weight:900;letter-spacing:.12em;background:rgba(0,0,0,.38);padding:4px 8px;border-radius:7px;pointer-events:none}
#hud{top:50%;transform:translateY(-50%);align-items:center;padding:0 8px}
#modeLabel{font-size:11px}
body.tabletop-mode #game{height:100%}
@media (max-height:700px){
  .leftCluster{width:150px;height:150px;transform:scale(.82);transform-origin:left bottom}
  #topTouchControls .leftCluster{transform:scale(.82);transform-origin:left bottom}
  .rightCluster{transform:scale(.82);transform-origin:right bottom}
}

@media (pointer:fine){#topTouchControls{display:none}}


/* v5.18: tabletop mode is opt-in. Normal play uses the full screen. */
body:not(.tabletop-mode) #topTouchControls{display:none!important}
body:not(.tabletop-mode) #touchControls{top:0;bottom:0}
body.tabletop-mode #touchControls{top:50%;bottom:0}
body.tabletop-mode #topTouchControls{display:block;top:0;bottom:50%}
body:not(.tabletop-mode) #hud{top:8px}


/* v5.25 editor palette icons */
.tileRow button,.slopeRow button{display:inline-flex;align-items:center;gap:7px;min-height:44px;white-space:nowrap}
.blockIcon{width:30px;height:30px;flex:0 0 30px;border-radius:4px;image-rendering:pixelated;box-shadow:0 0 0 1px rgba(255,255,255,.18),0 2px 4px rgba(0,0,0,.35)}
.tileRow button.active,.slopeRow button.active{background:#49617b;border-color:#8ed0ff}
@media (max-width:600px){.tileRow button,.slopeRow button{padding:5px 7px;min-height:40px}.blockIcon{width:27px;height:27px;flex-basis:27px}}

/* v5.30: wheel-scrollable editor palette */
#editorPanel::-webkit-scrollbar{width:10px}#editorPanel::-webkit-scrollbar-thumb{background:rgba(160,190,220,.45);border-radius:8px}#editorPanel::-webkit-scrollbar-track{background:rgba(0,0,0,.18);border-radius:8px}

.fighterHud .meter{width:112px;height:7px;border:1px solid rgba(255,255,255,.55);background:rgba(0,0,0,.45);overflow:hidden;border-radius:5px;margin-top:2px}
.fighterHud .meter i{display:block;height:100%;width:0;transition:width .12s linear}
.fighterHud .meter.power i{background:linear-gradient(90deg,#ffd45c,#fff5a8)}
.fighterHud .meter.resolve i{background:linear-gradient(90deg,#5ea6ff,#c5e3ff)}
.fighterHud .meter.stamina i{background:linear-gradient(90deg,#62d978,#d9ef70)}
.fighterHud.staminaExhausted .meter.stamina{opacity:.78}
.fighterHud.staminaExhausted .meter.stamina i{filter:saturate(.55) brightness(.92)}

/* v5.59.6: in customization mode the pad is one draggable object. */
#touchControls.controls-customizing .leftCluster *{pointer-events:none!important}
#touchControls.controls-customizing .leftCluster{pointer-events:auto!important;touch-action:none!important}

/* v5.59.7: reliable whole-control dragging and corner resizing. */
.leftCluster,.rightCluster button{--user-scale:1;transform:scale(var(--user-scale));transform-origin:center center}
#touchControls.controls-customizing .leftCluster *,#touchControls.controls-customizing .rightCluster button *{pointer-events:none!important}
#touchControls.controls-customizing .controlResizeHandle{display:block!important;pointer-events:auto!important;position:absolute;right:-7px;bottom:-7px;width:30px;height:30px;border-radius:50%;background:#fff;border:4px solid #315f83;box-shadow:0 2px 7px rgba(0,0,0,.65);z-index:50}
#touchControls.controls-customizing .controlResizeHandle::before{content:'↘';display:grid;place-items:center;width:100%;height:100%;color:#172534;font-size:17px;font-weight:1000}
#touchControls:not(.controls-customizing) .controlResizeHandle{display:none!important}
#touchControls.controls-customizing .moving-control{outline-color:#7fc7ff!important}
#touchControls.controls-customizing .resizing-control{outline-color:#ffe27c!important}
@media (max-width:600px){.leftCluster{transform:scale(calc(.82 * var(--user-scale)))}.rightCluster button{transform:scale(var(--user-scale))}}
@media (max-height:700px){.leftCluster,#topTouchControls .leftCluster{transform:scale(calc(.82 * var(--user-scale)))}.rightCluster{transform:none}.rightCluster button{transform:scale(calc(.82 * var(--user-scale)))}}

/* Combat Lab shell */
#topbar .brand{font-size:15px}
/* v3.2.1M1: keep the Combat Lab shell, but restore the custom-map editor controls. */
#topbar{height:auto;min-height:48px;padding:6px 8px;background:#111722;border-bottom:1px solid #334155}
.brand{margin-right:auto}.brand small{color:#8fd3ff}.primaryToolbar{gap:6px}.primaryToolbar button{font-size:12px;padding:7px 9px}
#gameWrap{height:calc(100vh - 48px)}
#labPanel{position:absolute;z-index:45;left:8px;top:58px;width:min(360px,calc(100vw - 16px));max-height:44vh;overflow:auto;background:rgba(9,14,24,.94);border:1px solid #40506a;border-radius:12px;padding:9px;color:#e8eef8;box-shadow:0 8px 30px rgba(0,0,0,.25)}
#labPanel.collapsed .labBody{display:none}.labHead{display:flex;align-items:center;gap:7px}.labHead strong{flex:1}.labGrid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.labGrid button,.labGrid select{min-height:36px;border-radius:8px;border:1px solid #45556f;background:#1b2638;color:#fff;padding:6px;font-size:12px}.labGrid button.active{background:#28587d}.labWide{grid-column:1/-1}.labStats{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:8px}.labStat{background:#172133;border-radius:7px;padding:5px;text-align:center;font-size:10px}.labStat b{display:block;font-size:14px}.labStatus{font-size:11px;color:#b9c7d9;margin-top:7px;white-space:pre-wrap}.labHidden{display:none!important}
@media(max-width:700px){#labPanel{top:52px;max-height:39vh;width:min(330px,calc(100vw - 12px));left:6px}.labStats{grid-template-columns:repeat(2,1fr)}#controlsBtn,#fullscreenBtn{display:none!important}}


/* v2.0.35 icon controls, adjustable opacity, and restored tabletop PvP */
:root{--control-opacity:.75}
.tabletopControls .leftCluster,.tabletopControls .rightCluster button{opacity:var(--control-opacity)}
.tabletopControls .leftCluster.joystick-active,.tabletopControls .rightCluster button.active{opacity:1}
.rightCluster button{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:1px;line-height:1.05;font-weight:800;text-shadow:0 1px 2px rgba(0,0,0,.8)}
.controlIcon{display:block;font-size:25px;line-height:1;font-weight:900;pointer-events:none}
.controlText{display:block;font-size:9px;letter-spacing:.02em;pointer-events:none}

.rightCluster [data-key=jump] .controlIcon{font-size:31px}
.controlSettings{position:absolute;z-index:40;left:50%;top:58px;transform:translateX(-50%);width:min(360px,calc(100vw - 20px));padding:10px 12px;border:1px solid rgba(150,195,235,.65);border-radius:12px;background:rgba(10,16,27,.94);color:#fff;pointer-events:auto;box-shadow:0 6px 24px rgba(0,0,0,.35)}
.controlSettings label{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:800}.controlSettings output{color:#9ed8ff}.controlSettings input{width:100%;margin:8px 0 4px;accent-color:#75bfff}.controlSettings small{display:block;font-size:10px;opacity:.8}
body.tabletop-mode #labPanel{max-height:31vh}
@media(max-width:700px){#controlsBtn{display:inline-flex!important}.controlSettings{top:52px}.controlIcon{font-size:22px}.controlText{font-size:8px}}


/* v3.2.1M1 mobile editor menu repair */
#modeBtn{display:inline-flex!important;background:#244a68;border-color:#6fb9e8;font-weight:800}
#toolbarDrawer:not(.hidden){display:flex!important}
#editorPanel:not(.hidden){display:block!important}
@media(max-width:700px){
  #modeBtn{display:inline-flex!important}
  #menuBtn{display:inline-flex!important}
  #toolbarDrawer{max-height:34vh;overflow-y:auto;overscroll-behavior:contain;padding-bottom:8px}
  #editorPanel{left:6px;right:6px;transform:none;max-width:none;min-width:0;width:auto;bottom:6px;max-height:48vh;padding:7px}
  #editorPanel .panelRow{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding-bottom:5px}
  #editorPanel .panelRow button{flex:0 0 auto}
  #editorPanel .hint{display:none}
}

.drawerSectionLabel{flex-basis:100%;padding:8px 4px 2px;color:#aebbd0;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;border-top:1px solid rgba(255,255,255,.12);margin-top:4px}
#toolbarDrawer{max-height:min(68vh,560px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
#toolbarDrawer button,#toolbarDrawer select{min-height:40px}
@media(max-width:700px){#menuBtn{display:inline-flex!important}#toolbarDrawer{position:absolute;left:6px;right:6px;top:50px;max-height:72vh;padding-bottom:16px;background:rgba(12,18,29,.98);border:1px solid #40506a;border-radius:12px;z-index:90}#labPanel{top:104px;width:min(250px,calc(100vw - 12px));max-height:24vh}.drawerSectionLabel{font-size:10px}}

/* v3.2.1M2.4 desktop-style categorized menu bar */
#topbar{position:relative;display:flex;align-items:center;gap:10px;overflow:visible;z-index:120;padding:5px 8px;min-height:48px}
.desktopMenuBar{display:flex!important;align-items:center;gap:2px;min-width:0;overflow-x:auto;overflow-y:visible;padding:0;scrollbar-width:none}
.desktopMenuBar::-webkit-scrollbar{display:none}
.menuCompatibilityButton{display:none!important}
.menuCategory{position:relative;flex:0 0 auto}
.menuCategory>summary{list-style:none;cursor:pointer;user-select:none;padding:8px 11px;border:1px solid transparent;border-radius:6px;color:#eef4ff;font-weight:700;white-space:nowrap}
.menuCategory>summary::-webkit-details-marker{display:none}
.menuCategory>summary:hover,.menuCategory[open]>summary{background:#293244;border-color:#46536c}
.menuDropdown{position:absolute;left:0;top:calc(100% + 4px);display:flex;flex-direction:column;gap:3px;width:max-content;min-width:220px;max-width:min(88vw,340px);max-height:70vh;overflow-y:auto;padding:7px;background:rgba(14,19,29,.99);border:1px solid #46536c;border-radius:8px;box-shadow:0 12px 28px rgba(0,0,0,.45);z-index:500}
.menuCategory:last-of-type .menuDropdown,.menuCategory:nth-last-of-type(2) .menuDropdown{left:auto;right:0}
.menuDropdown button,.menuDropdown select{width:100%;min-height:38px;text-align:left;white-space:normal}
.menuDropdown button{justify-content:flex-start}
.menuDivider{height:1px;background:#344056;margin:5px 2px}
.menuHeading{padding:3px 7px;color:#9fb0c8;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.menuNote{display:block;padding:7px;color:#aebbd0;font-size:12px;line-height:1.35;max-width:290px}
.menuSelectLabel{display:flex;align-items:center;gap:8px;padding:4px 6px;color:#dbe6f7;font-size:12px}
.menuSelectLabel select{flex:1}
#toolbarDrawer:not(.hidden){display:flex!important}
@media(max-width:700px){
  #topbar{display:flex;min-height:48px;padding:4px 6px;overflow:visible}
  #topbar .brand{display:none}
  .desktopMenuBar{width:100%;gap:1px}
  .menuCategory>summary{padding:8px 10px;font-size:13px}
  .menuDropdown{position:fixed;left:6px!important;right:6px!important;top:54px;width:auto;min-width:0;max-width:none;max-height:68vh;border-radius:10px}
  .menuDropdown button,.menuDropdown select{min-height:44px;font-size:14px}
  #labPanel{top:108px}
}

/* v3.2.1M2.4: true floating desktop-style dropdown menus. */
#topbar{
  height:48px;
  min-height:48px;
  max-height:48px;
  flex-wrap:nowrap;
  overflow:visible!important;
}
#toolbarDrawer.desktopMenuBar{
  position:relative!important;
  inset:auto!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  width:auto;
  max-height:none!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  z-index:130;
}
.menuCategory{position:relative!important}
.menuDropdown{
  position:fixed!important;
  top:48px!important;
  bottom:auto!important;
  z-index:1000!important;
  max-height:calc(100dvh - 58px)!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
}
#gameWrap{height:auto!important;min-height:0}
#labPanel{top:58px!important}
@media(max-width:700px){
  #topbar{height:48px;min-height:48px;max-height:48px;padding:4px 6px}
  #toolbarDrawer.desktopMenuBar{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    width:100%!important;
    max-height:none!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
  }
  .menuDropdown{
    position:fixed!important;
    top:48px!important;
    left:6px!important;
    right:6px!important;
    width:auto!important;
    max-height:calc(100dvh - 58px)!important;
  }
  #labPanel{top:58px!important}
}


/* v3.2.1M2.6: menu-contained diagnostics; never intercept the arena when closed */
#toolbarDrawer.desktopMenuBar{display:flex!important;align-items:stretch!important;gap:2px!important;overflow-x:auto!important;overflow-y:visible!important;touch-action:pan-x!important}
.menuCategory{flex:0 0 auto!important}
.menuCategory>summary{touch-action:manipulation!important;user-select:none!important;-webkit-user-select:none!important}
.diagnosticsCategory summary{display:flex!important;align-items:center;gap:7px;white-space:nowrap}
.diagnosticsCategory summary small{font:10px/1 monospace;opacity:.75}
.diagnosticsDropdown{width:min(360px,calc(100vw - 16px));padding:0!important}
#labPanel{position:static!important;inset:auto!important;width:auto!important;max-width:none!important;max-height:none!important;overflow:visible!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;padding:10px!important;pointer-events:auto!important}
#labPanel .labHead{margin-bottom:7px}
#labPanel .labStats{grid-template-columns:repeat(4,1fr)!important}
.menuBuildBadge{display:inline-flex;align-items:center;align-self:center;margin-left:auto;padding:5px 8px;border-radius:7px;background:#b30000;color:#fff;font:bold 11px/1 monospace;white-space:nowrap;pointer-events:none;flex:0 0 auto}
#buildBadge{display:none!important}
@media(max-width:700px){.diagnosticsCategory summary small{display:none}.menuBuildBadge{font-size:10px;padding:5px 6px}.diagnosticsDropdown{left:auto!important;right:6px!important;width:min(330px,calc(100vw - 12px))}}

/* v3.2.1M2.17 dockable creative workspace */
#editorPanel{
  --editor-panel-height:46vh;
  --editor-panel-width:min(860px,94vw);
  position:absolute;
  z-index:30;
  display:flex;
  flex-direction:column;
  width:var(--editor-panel-width);
  height:var(--editor-panel-height);
  min-width:320px;
  min-height:150px;
  max-width:calc(100% - 12px);
  max-height:calc(100% - 56px);
  padding:0;
  overflow:hidden;
  resize:both;
  left:50%;
  bottom:8px;
  transform:translateX(-50%);
  background:rgba(20,23,31,.96);
}
#editorPanel.editorDocked{
  left:0!important;
  right:0!important;
  bottom:0!important;
  top:auto!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  transform:none!important;
  border-radius:12px 12px 0 0;
  resize:vertical;
}
#editorPanel.editorFloating{right:auto}
#editorPanel.editorCollapsed{height:auto!important;min-height:0!important;resize:none}
#editorPanel.editorCollapsed .editorPanelContent{display:none}
.editorPanelChrome{
  min-height:40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:6px 8px;
  background:rgba(35,40,53,.98);
  border-bottom:1px solid var(--line);
  cursor:grab;
  touch-action:none;
  user-select:none;
}
.editorPanelChrome:active{cursor:grabbing}
.editorPanelTitle{font-weight:800;letter-spacing:.03em}
.editorPanelActions{display:flex;gap:5px}
.editorPanelActions button{padding:6px 10px;min-width:auto}
.editorPanelContent{
  flex:1 1 auto;
  overflow:auto;
  overscroll-behavior:contain;
  padding:8px;
}
.editorQuickRow{
  position:sticky;
  top:0;
  z-index:3;
  padding-bottom:7px;
  margin-bottom:7px;
  background:rgba(20,23,31,.98);
  border-bottom:1px solid var(--line);
}
.editorQuickRow button{font-weight:700}
@media(max-width:760px){
  #editorPanel{
    --editor-panel-width:calc(100% - 12px);
    --editor-panel-height:44vh;
    left:6px;
    right:6px;
    bottom:6px;
    width:auto;
    min-width:0;
    max-width:none;
    transform:none;
  }
  #editorPanel.editorFloating{left:6px!important;right:6px!important;width:auto!important}
  #editorPanel .panelRow{flex-wrap:wrap;overflow:visible}
  .editorPanelActions button{padding:6px 8px}
}


/* v3.2.1M2.18 permanent creative tools menu-bar action */
.menuBarAction{
  appearance:none;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  font-weight:700;
  padding:10px 12px;
  border-radius:7px;
  white-space:nowrap;
}
.menuBarAction:hover,.menuBarAction.active{background:#2c3444}
@media(max-width:700px){.menuBarAction{padding:9px 8px;font-size:13px}}


/* v3.2.1M2.20 touch-friendly creative panel resize handles */
.editorDockResizeHandle{
  position:absolute;
  left:0;
  right:0;
  top:-7px;
  height:18px;
  z-index:8;
  cursor:ns-resize;
  touch-action:none;
  display:none;
}
.editorDockResizeHandle::before{
  content:'';
  position:absolute;
  left:50%;
  top:5px;
  width:74px;
  height:5px;
  transform:translateX(-50%);
  border-radius:99px;
  background:rgba(180,205,230,.78);
  border:1px solid rgba(255,255,255,.28);
}
#editorPanel.editorDocked:not(.editorCollapsed) .editorDockResizeHandle{display:block}
.editorFloatResizeHandle{
  position:absolute;
  right:1px;
  bottom:1px;
  width:34px;
  height:34px;
  z-index:9;
  cursor:nwse-resize;
  touch-action:none;
  display:none;
  border-radius:10px 0 10px 0;
  background:linear-gradient(135deg,transparent 42%,rgba(185,210,235,.85) 43% 50%,transparent 51% 61%,rgba(185,210,235,.85) 62% 69%,transparent 70%);
}
#editorPanel.editorFloating:not(.editorCollapsed) .editorFloatResizeHandle{display:block}
body.editorPanelResizing{user-select:none;overscroll-behavior:none}
body.editorPanelResizing #editorPanel{transition:none!important}
@media(max-width:760px){
  #editorPanel.editorFloating{
    right:auto!important;
    width:min(92vw,760px)!important;
    min-width:300px!important;
  }
  .editorDockResizeHandle{height:24px;top:-10px}
  .editorDockResizeHandle::before{top:8px;width:92px;height:6px}
  .editorFloatResizeHandle{width:42px;height:42px}
}

/* v3.2.1M2.20 functional touch resize targets */
#editorPanel{overflow:hidden!important}
.editorDockResizeHandle{
  top:0!important;
  height:30px!important;
  z-index:60!important;
  pointer-events:auto!important;
  background:transparent;
}
.editorDockResizeHandle::before{
  top:5px!important;
  width:96px!important;
  height:7px!important;
  background:rgba(205,225,245,.95)!important;
  box-shadow:0 0 0 2px rgba(0,0,0,.28);
}
#editorPanel.editorDocked .editorPanelChrome{padding-top:17px!important}
.editorFloatResizeHandle{
  display:none;
  right:0!important;
  bottom:0!important;
  width:52px!important;
  height:52px!important;
  z-index:70!important;
  pointer-events:auto!important;
  border:2px solid rgba(220,235,250,.9)!important;
  border-left:0!important;
  border-top:0!important;
  border-radius:0 0 10px 0!important;
  background:
    linear-gradient(135deg,transparent 48%,rgba(220,235,250,.95) 49% 55%,transparent 56% 66%,rgba(220,235,250,.95) 67% 73%,transparent 74%)!important;
}
#editorPanel.editorFloating:not(.editorCollapsed) .editorFloatResizeHandle{display:block!important}
@media(max-width:760px){
  #editorPanel.editorFloating{
    right:auto!important;
    min-width:300px!important;
    max-width:calc(100vw - 12px)!important;
  }
}

/* v3.2.1M2.22 — single-shell dock/floating panel geometry */
#editorPanel{
  resize:none!important;
  contain:layout paint;
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
#editorPanel *{-webkit-user-drag:none}
#editorPanel .editorPanelContent{
  -webkit-user-select:auto;
  user-select:auto;
}
.editorDockResizeHandle{
  display:none!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:0!important;
  height:26px!important;
  z-index:100!important;
  touch-action:none!important;
  cursor:ns-resize!important;
}
.editorDockResizeHandle::before{
  content:'';
  position:absolute;
  left:50%;
  top:6px;
  width:104px;
  height:7px;
  transform:translateX(-50%);
  border-radius:999px;
  background:rgba(220,235,250,.95);
  box-shadow:0 0 0 2px rgba(0,0,0,.35);
}
#editorPanel.editorDocked:not(.editorCollapsed)>.editorDockResizeHandle{display:block!important}
#editorPanel.editorDocked .editorPanelChrome{padding-top:19px!important}
#editorPanel.editorFloating .editorPanelChrome{padding-top:6px!important}
.editorResizeCorner{
  display:none;
  position:absolute;
  width:38px;
  height:38px;
  z-index:110;
  touch-action:none;
  background:rgba(180,210,235,.16);
  border-color:rgba(225,240,255,.95);
  border-style:solid;
}
#editorPanel.editorFloating:not(.editorCollapsed)>.editorResizeCorner{display:block}
.editorResizeCorner.nw{left:0;top:0;border-width:3px 0 0 3px;border-radius:10px 0 0 0;cursor:nwse-resize}
.editorResizeCorner.ne{right:0;top:0;border-width:3px 3px 0 0;border-radius:0 10px 0 0;cursor:nesw-resize}
.editorResizeCorner.sw{left:0;bottom:0;border-width:0 0 3px 3px;border-radius:0 0 0 10px;cursor:nesw-resize}
.editorResizeCorner.se{right:0;bottom:0;border-width:0 3px 3px 0;border-radius:0 0 10px 0;cursor:nwse-resize}
#editorFloatResizeHandle{display:none!important}
body.editorPanelManipulating,
body.editorPanelManipulating *{
  user-select:none!important;
  -webkit-user-select:none!important;
  -webkit-user-drag:none!important;
}
@media(max-width:760px){
  #editorPanel.editorFloating{
    left:12px!important;
    right:auto!important;
    width:min(88vw,760px)!important;
    min-width:260px!important;
    max-width:calc(100vw - 24px)!important;
  }
  .editorResizeCorner{width:46px;height:46px}
}

/* v3.2.1M2.22 Minecraft-style icon inventory */
.creativeInventoryHeader{position:sticky;top:0;z-index:12;background:rgba(20,23,31,.99);padding-bottom:6px;border-bottom:1px solid var(--line)}
.iconToolRow{gap:5px;margin:0 0 6px;padding:0 0 6px!important;flex-wrap:wrap}
.iconOnly,.creativeCategoryTabs button{width:44px;height:42px;min-width:44px!important;padding:0!important;display:inline-grid!important;place-items:center;font-size:23px;line-height:1;font-weight:800}
.iconOnly.active,.creativeCategoryTabs button.active{background:#49617b!important;border-color:#8ed0ff!important;box-shadow:inset 0 0 0 1px rgba(142,208,255,.45)}
.creativeCategoryTabs{display:flex;gap:5px;overflow-x:auto;overscroll-behavior-x:contain;padding:2px 0 4px;scrollbar-width:thin}
.creativeCategoryTabs button{flex:0 0 48px;font-size:22px}
.creativePages{padding-top:8px}
.creativePage{display:none}
.creativePage.active{display:block}
.creativeGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:7px;align-items:start}
.creativeGrid button.inventoryIconButton{position:relative;aspect-ratio:1;width:100%;min-width:0!important;min-height:52px!important;padding:5px!important;display:grid!important;place-items:center!important;overflow:hidden;white-space:normal!important}
.creativeGrid button.inventoryIconButton .blockIcon{width:min(42px,80%);height:min(42px,80%);flex:none;margin:0}
.creativeGrid button.inventoryIconButton.active{background:#49617b;border-color:#8ed0ff;box-shadow:inset 0 0 0 2px rgba(142,208,255,.4)}
.shapeInventoryGroup{display:grid;grid-template-columns:minmax(110px,150px) 1fr;gap:8px;align-items:start;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.08)}
.shapeInventoryGroup label{font-size:12px;font-weight:800;display:flex;flex-direction:column;gap:4px}
.shapeInventoryGroup select{width:100%;min-width:0}
.shapeGrid{grid-template-columns:repeat(4,minmax(52px,72px));justify-content:start}
.compactHint{font-size:11px;opacity:.72;margin-top:10px}
#creativeTooltip{position:fixed;z-index:9999;left:0;top:0;pointer-events:none;opacity:0;transform:translateY(3px);transition:opacity .1s ease,transform .1s ease;background:#080b12;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:5px;padding:6px 9px;font:700 12px/1.2 system-ui,sans-serif;box-shadow:0 5px 18px rgba(0,0,0,.5);max-width:220px;text-align:center}
#creativeTooltip.show{opacity:1;transform:none}
@media(max-width:620px){
  .iconOnly,.creativeCategoryTabs button{width:42px;height:40px;min-width:42px!important}
  .creativeGrid{grid-template-columns:repeat(auto-fill,minmax(48px,1fr));gap:5px}
  .creativeGrid button.inventoryIconButton{min-height:48px!important;padding:4px!important}
  .shapeInventoryGroup{grid-template-columns:1fr}
  .shapeGrid{grid-template-columns:repeat(4,minmax(46px,1fr))}
}


/* v3.2.1M2.23 match announcer */
.matchAnnouncer{position:fixed;left:50%;top:42%;z-index:2600;transform:translate(-50%,-50%) scale(.78);opacity:0;pointer-events:none;text-align:center;filter:drop-shadow(0 5px 10px rgba(0,0,0,.65));transition:opacity .16s ease,transform .18s cubic-bezier(.2,.9,.25,1.25);max-width:min(88vw,760px)}
.matchAnnouncer.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.matchAnnouncerMain{font-weight:1000;font-size:clamp(34px,8vw,82px);line-height:.95;letter-spacing:.045em;text-transform:uppercase;color:#fff;text-shadow:0 4px 0 #111827,0 0 20px rgba(255,255,255,.45);white-space:nowrap}
.matchAnnouncerSub{margin-top:10px;display:inline-block;padding:7px 14px;border-radius:999px;background:rgba(8,15,29,.86);border:2px solid rgba(255,255,255,.32);font-weight:800;font-size:clamp(14px,2.8vw,23px);color:#fff}
.matchAnnouncerSub:empty{display:none}
.matchAnnouncer.ko .matchAnnouncerMain{color:#ffd34d;text-shadow:0 4px 0 #7b3f00,0 0 24px rgba(255,184,0,.72)}
.matchAnnouncer.winner .matchAnnouncerMain{color:#7dff9a;text-shadow:0 4px 0 #064e2a,0 0 28px rgba(31,255,111,.72)}
.matchAnnouncer.warning .matchAnnouncerMain{color:#ff7474;text-shadow:0 4px 0 #6f1010,0 0 26px rgba(255,50,50,.68)}
.matchAnnouncer.start .matchAnnouncerMain{color:#7edcff;text-shadow:0 4px 0 #073c61,0 0 28px rgba(28,189,255,.7)}
@media (max-width:600px){.matchAnnouncer{top:38%}.matchAnnouncerMain{white-space:normal;min-width:88vw}.matchAnnouncerSub{max-width:82vw}}

/* v3.2.1M2.24 controlled bot-analysis sessions */
.testClock{position:absolute;left:50%;top:38px;transform:translateX(-50%);padding:4px 10px;border-radius:999px;background:rgba(8,11,18,.8);border:1px solid rgba(255,255,255,.2);font:700 14px/1 monospace;letter-spacing:.08em;pointer-events:none}
.testSessionOverlay{position:absolute;inset:0;z-index:4700;display:grid;place-items:center;padding:18px;background:rgba(5,8,14,.66);backdrop-filter:blur(4px);pointer-events:auto}
.testSessionOverlay.hidden{display:none}
.testSessionCard{width:min(520px,94vw);max-height:86vh;overflow:auto;padding:24px;border:1px solid rgba(255,255,255,.22);border-radius:18px;background:linear-gradient(180deg,rgba(30,36,49,.98),rgba(14,18,27,.98));box-shadow:0 24px 80px rgba(0,0,0,.55);text-align:center}
.testSessionEyebrow{font:800 11px/1.2 system-ui;letter-spacing:.18em;opacity:.72}
.testSessionCard h1{margin:10px 0 8px;font:900 clamp(28px,7vw,48px)/1 system-ui}
.testSessionCard p{margin:0 auto 18px;max-width:420px;line-height:1.45;opacity:.84}
.testSessionSelect{display:grid;gap:7px;margin:0 auto 18px;text-align:left;font-weight:700;max-width:360px}
.testSessionSelect select{width:100%;padding:12px;border-radius:10px;background:#111722;color:#fff;border:1px solid rgba(255,255,255,.22);font:inherit}
.testSessionActions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.testSessionActions button{min-height:44px;padding:10px 16px}
.testSessionActions .primaryAction{font-weight:900;font-size:16px;background:#e9f1ff;color:#111827}
.testSessionSummary{margin:12px 0 18px;padding:12px;border-radius:12px;background:rgba(0,0,0,.24);white-space:pre-line;text-align:left;font:13px/1.45 system-ui}
@media (max-width:700px){.testClock{top:34px}.testSessionCard{padding:18px}.testSessionActions button{flex:1 1 44%}}


/* v3.2.1M2.24 authoritative match gate and analysis-session UI */
.matchGateOverlay{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:18px;background:rgba(4,8,18,.72);backdrop-filter:blur(5px);pointer-events:auto}
.matchGateOverlay.hidden{display:none}
.matchGateCard{width:min(520px,94vw);padding:24px;border:2px solid rgba(154,211,255,.5);border-radius:18px;background:linear-gradient(180deg,rgba(24,34,53,.98),rgba(10,16,28,.98));box-shadow:0 24px 70px rgba(0,0,0,.6);color:#fff;text-align:center}
.matchGateEyebrow{font-size:12px;font-weight:900;letter-spacing:.18em;color:#86d8ff}
.matchGateCard h1{margin:8px 0 6px;font-size:clamp(28px,7vw,48px)}
.matchGateCard p{margin:0 auto 18px;max-width:42ch;color:#c8d4e8;line-height:1.45}
.matchGateLabel{display:grid;gap:7px;text-align:left;font-weight:800}
.matchGateLabel select{width:100%;padding:12px;border-radius:10px;border:1px solid #62728f;background:#111a2a;color:#fff;font:inherit}
.matchGateRules{margin:14px 0 18px;padding:10px;border-radius:10px;background:rgba(94,164,255,.1);color:#bcdcff;font-size:13px;line-height:1.4}
.matchGateActions{display:flex;justify-content:center;gap:10px}.matchGateActions.stacked{flex-direction:column}
.matchGateActions button{min-height:48px;padding:11px 18px;border-radius:11px;font-weight:900;font-size:15px}
.primaryMatchButton{background:#78dcff!important;color:#07111d!important;border-color:#b9efff!important}
.analysisTimerHud{position:fixed;z-index:2200;top:58px;left:50%;transform:translateX(-50%);padding:6px 13px;border-radius:999px;background:rgba(8,15,29,.86);border:1px solid rgba(255,255,255,.3);color:#fff;font:900 18px/1 monospace;pointer-events:none}
.analysisTimerHud.warning{color:#ffd45f}.analysisTimerHud.critical{color:#ff7777;animation:timerPulse .7s infinite alternate}
@keyframes timerPulse{to{transform:translateX(-50%) scale(1.08)}}
@media(max-width:600px){.matchGateCard{padding:19px}.analysisTimerHud{top:52px;font-size:16px}}

/* v3.2.1M2.25 — keep desktop menus usable while the match gate is open */
.testSessionOverlay,
.matchGateOverlay{
  top:58px!important;
  right:0!important;
  bottom:0!important;
  left:0!important;
  z-index:110!important;
}
#topbar{
  z-index:5200!important;
  pointer-events:auto!important;
}
.menuDropdown{
  z-index:5300!important;
}
@media(max-width:600px){
  .testSessionOverlay,
  .matchGateOverlay{top:50px!important}
}
/* v3.2.1M2.28 restored authoritative start gate */
#topbar{position:relative;z-index:8000}
#gameWrap{position:relative}
.testSessionOverlay{top:0!important;z-index:4700!important}
.testSessionSummary{max-height:180px;overflow:auto;text-align:left;white-space:pre-wrap;padding:10px;border-radius:10px;background:rgba(0,0,0,.28);color:#dceaff;font:12px/1.45 monospace}
.analysisTimerHud{position:absolute;z-index:4600;top:8px;left:50%;transform:translateX(-50%);padding:5px 10px;border-radius:10px;background:rgba(8,13,24,.78);color:#fff;font-weight:900;pointer-events:none}

/* M2.29: the announcer is a real top-level overlay rather than a script-only target. */
.matchAnnouncer[hidden]{display:none!important}
.matchAnnouncer:not([hidden]){display:block!important}
.matchAnnouncer{z-index:10020!important;top:36%;width:max-content;max-width:92vw}
.matchAnnouncerMain,.matchAnnouncerSub{position:relative;z-index:1}

/* M2.60 character select */
.characterSelectHeading{font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}
.rosterGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:10px 0 14px}
.rosterSlot{display:grid;gap:7px;padding:10px;border:1px solid rgba(255,255,255,.18);border-radius:10px;background:rgba(0,0,0,.2)}
.rosterSlot select{width:100%;padding:8px;border-radius:7px;background:#202633;color:#fff;border:1px solid rgba(255,255,255,.2)}
#confirmRoster,#editRoster{width:100%;margin-top:8px}
@media(max-width:620px){.rosterGrid{grid-template-columns:1fr}.matchGateCard{max-height:88vh;overflow:auto}}

/* v3.2.1M2.63 Character Workshop */
.characterWorkshop{position:fixed;inset:44px 0 0;z-index:50000;background:#111722;color:#eef5ff;display:flex;flex-direction:column;font:14px/1.25 system-ui,sans-serif}.characterWorkshop.hidden{display:none}.cwTopbar{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border-bottom:1px solid #334055;background:#1a2230}.cwTopbar small{color:#9baac0;margin-left:8px}.cwTopActions,.cwStageTools{display:flex;gap:6px}.cwIcon,.cwStageTools button,.cwSidebar button{min-width:42px;min-height:38px;border:1px solid #41516a;border-radius:8px;background:#222d3e;color:#eef5ff}.cwIcon.primary{background:#356ca8}.cwBody{display:grid;grid-template-columns:180px minmax(260px,1fr) 230px;min-height:0;flex:1}.cwSidebar,.cwInspector{overflow:auto;padding:10px;background:#171f2c}.cwSidebar{border-right:1px solid #334055}.cwInspector{border-left:1px solid #334055}.cwSectionTitle{text-transform:uppercase;letter-spacing:.08em;font-size:11px;color:#9eb2ca;margin:8px 0 6px}.cwRigGrid,.cwToolGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.cwRigGrid button{display:flex;flex-direction:column;align-items:center;font-size:22px}.cwRigGrid span{font-size:10px;margin-top:2px}.cwToolGrid button{font-size:20px}.cwSidebar button.active,.cwStageTools button.active{outline:2px solid #7fc8ff;background:#304762}.cwStageWrap{position:relative;min-width:0;min-height:0;background-color:#c3d0da;background-image:repeating-linear-gradient(0deg,rgba(31,52,70,.10) 0 1px,transparent 1px 24px),repeating-linear-gradient(90deg,rgba(31,52,70,.10) 0 1px,transparent 1px 24px),linear-gradient(180deg,#d8e2e9 0%,#b7c6d2 100%);display:flex;align-items:center;justify-content:center;overflow:hidden}.cwStageWrap canvas{width:100%;height:100%;touch-action:none}.cwStageTools{position:absolute;left:10px;bottom:10px}.cwInspector label{display:grid;gap:4px;margin:8px 0;color:#b9c8dc;font-size:12px}.cwInspector input,.cwInspector select{width:100%;box-sizing:border-box;background:#222d3e;color:#fff;border:1px solid #41516a;border-radius:7px;padding:7px}.cwInspector input[type=color]{height:38px;padding:3px}.cwInspector input[type=range]{padding:0}.cwHint{margin-top:14px;padding:9px;border:1px solid #35445b;border-radius:8px;background:#202a39;color:#aebed2;font-size:11px}@media(max-width:720px){.cwBody{grid-template-columns:118px minmax(180px,1fr) 170px}.cwSidebar,.cwInspector{padding:6px}.cwRigGrid span{display:none}.cwRigGrid button{font-size:20px}.cwTopbar small{display:none}}@media(max-width:500px){.cwBody{grid-template-columns:94px 1fr}.cwInspector{position:absolute;right:0;top:46px;bottom:0;width:170px;opacity:.96}.cwStageWrap{margin-right:170px}.cwRigGrid,.cwToolGrid{grid-template-columns:1fr}.cwSidebar button{min-width:36px}}

/* v3.2.1M2.67 workshop scale and action test stage */
.cwStageTools select{min-height:38px;max-width:150px;border:1px solid #41516a;border-radius:8px;background:#222d3e;color:#eef5ff;padding:0 7px}.cwSizeGuide{margin:5px 0 10px;color:#8fa4bd;font-size:10px}.cwInspector label span{float:right;color:#9ee3ff}.cwStageTools{flex-wrap:wrap;right:10px}.cwStageTools button{padding:0 10px}@media(max-width:600px){.cwStageTools select{max-width:115px}.cwStageTools{right:4px;left:4px;gap:4px}.cwStageTools button{min-width:36px;padding:0 6px}}

/* v3.2.1M2.70 frame-by-frame animation editor */
.cwTimeline{position:absolute;left:8px;right:8px;bottom:58px;padding:8px;border:1px solid #41516a;border-radius:10px;background:rgba(20,28,40,.97);z-index:4}.cwTimeline.hidden{display:none}.cwTimelineRow{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.cwTimeline button{min-height:32px;min-width:34px;border:1px solid #41516a;border-radius:7px;background:#263449;color:#eef5ff}.cwFrameStrip{display:flex;gap:5px;overflow-x:auto;overflow-y:hidden;max-width:100%;padding:7px 2px 10px;scroll-behavior:smooth;overscroll-behavior-x:contain;scrollbar-width:auto}.cwFrameStrip::-webkit-scrollbar{height:10px}.cwFrameStrip::-webkit-scrollbar-thumb{background:#526782;border-radius:999px}.cwFrameStrip::-webkit-scrollbar-track{background:#182233;border-radius:999px}.cwFrameStrip button{min-width:44px;flex:0 0 44px}.cwFrameStrip button.active{outline:2px solid #7fc8ff;background:#365374}.cwBoneEdit{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr auto;gap:7px;align-items:end}.cwBoneEdit label{display:grid;gap:3px;font-size:11px;color:#b9c8dc}.cwBoneEdit select,.cwBoneEdit input{width:100%;box-sizing:border-box}.cwTimelineHint{font-size:10px;color:#9db0c8;margin-top:5px}@media(max-width:720px){.cwBoneEdit{grid-template-columns:1fr 1fr}.cwTimeline{bottom:102px}.cwTimelineHint{display:none}}

/* M2.71: separated Build and Animate workspaces */
.cwTitleGroup{display:flex;align-items:center;gap:14px;min-width:0}.cwModeSwitch{display:flex;gap:4px}.cwModeSwitch button{min-height:34px;padding:0 12px;border:1px solid #41516a;border-radius:8px;background:#222d3e;color:#eef5ff}.cwModeSwitch button.active{outline:2px solid #7fc8ff;background:#304762}.characterWorkshop.animateMode .cwBuildOnly{display:none!important}.characterWorkshop:not(.animateMode) .cwAnimateOnly{display:none!important}.characterWorkshop.animateMode .cwAnimateOnly{display:block!important}.characterWorkshop.animateMode .cwBody{grid-template-columns:minmax(260px,1fr) 230px}.characterWorkshop.animateMode .cwStageWrap{grid-column:1}.characterWorkshop.animateMode .cwTimeline{display:block}.characterWorkshop.animateMode .cwStageTools select{display:none}.characterWorkshop.animateMode .cwStageTools #cwToggleRig{display:inline-flex}.characterWorkshop.animateMode .cwInspector{grid-column:2}.characterWorkshop.animateMode #cwCanvas{cursor:crosshair}@media(max-width:720px){.cwTitleGroup{gap:7px}.cwModeSwitch button{padding:0 8px;font-size:12px}.characterWorkshop.animateMode .cwBody{grid-template-columns:minmax(180px,1fr) 170px}}

/* v3.2.1M2.72 workshop hub, separate create/animate interfaces, and loading */
.cwHomeScreen{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-content:center;padding:28px;max-width:900px;width:100%;margin:auto}.cwHomeScreen button{min-height:180px;border:1px solid #40516b;border-radius:16px;background:#1f2a3a;color:#eef5ff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:18px}.cwHomeScreen button span{font-size:40px}.cwHomeScreen button b{font-size:18px}.cwHomeScreen button small{color:#adbbce;text-align:center}.cwHomeScreen button:active{transform:scale(.98)}.cwLoadPanel{position:absolute;inset:54px 0 0;z-index:8;background:rgba(8,13,23,.86);display:flex;align-items:center;justify-content:center;padding:20px}.cwLoadCard{width:min(520px,100%);background:#1b2636;border:1px solid #40516b;border-radius:14px;padding:18px}.cwLoadCard select{width:100%;min-height:44px;margin:10px 0 14px;background:#263449;color:#eef5ff;border:1px solid #536783;border-radius:8px;padding:8px}.cwLoadActions{display:flex;gap:8px;flex-wrap:wrap}.cwLoadActions button{flex:1;min-width:130px;min-height:42px}.cwWorkspaceLabel{}@media(max-width:720px){.cwHomeScreen{grid-template-columns:1fr;padding:16px;align-content:start}.cwHomeScreen button{min-height:120px}.cwHomeScreen button span{font-size:30px}.cwLoadPanel{inset:50px 0 0}}

/* v3.2.1M2.75 temporary tracing references */
.cwReferenceButtons{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.cwReferenceButtons button,.cwGifFrameRow button{min-height:38px}.cwReferenceControls{padding:8px 0}.cwReferenceControls label{display:block;margin:7px 0}.cwGifFrameRow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:7px 0}.cwGifFrameRow span{min-width:64px;text-align:center}.cwReferenceButtons button.active{outline:2px solid #7ecbff;background:#29435e}

/* v3.2.1M2.79 editor zoom controls */
.cwZoomReadout{min-width:48px;text-align:center;font-size:12px;color:#dce8f7;align-self:center}.cwStageTools #cwZoomOut,.cwStageTools #cwZoomIn{font-size:20px;line-height:1;min-width:42px}


/* v3.2.1M2.82 direct rig-node editing and immediate icon names */
.cwToolTip{position:fixed;z-index:100000;pointer-events:none;display:none;max-width:220px;padding:6px 9px;border:1px solid rgba(150,190,235,.55);border-radius:7px;background:rgba(10,20,35,.96);color:#f2f7ff;font:12px/1.25 system-ui,sans-serif;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.cwToolTip.show{display:block}

/* M2.85 proper app navigation */
#lbMainMenu{position:fixed;inset:0;z-index:12000;background:linear-gradient(180deg,#111827,#0b1220);color:#eef5ff;display:flex;align-items:center;justify-content:center;padding:24px;overflow:auto}
#lbMainMenu.hidden{display:none}.lbMenuShell{width:min(920px,100%)}.lbMenuTitle{text-align:center;margin-bottom:22px}.lbMenuTitle h1{margin:0;font-size:clamp(32px,7vw,64px);letter-spacing:.08em}.lbMenuTitle p{margin:8px 0;color:#aebcd0}
.lbModeGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.lbModeCard{min-height:140px;border:1px solid #40516b;border-radius:18px;background:#182338;color:#fff;text-align:left;padding:20px;display:flex;gap:16px;align-items:center;cursor:pointer}.lbModeCard:hover,.lbModeCard:focus{background:#21304b;border-color:#76b9ff}.lbModeIcon{font-size:42px;width:58px;text-align:center}.lbModeCard b{display:block;font-size:22px;margin-bottom:5px}.lbModeCard small{display:block;color:#b7c5d8;line-height:1.35}.lbMenuFooter{text-align:center;color:#8190a6;margin-top:18px;font-size:12px}
#lbPageBar{position:fixed;left:0;right:0;top:0;z-index:11000;height:54px;background:#111a2a;border-bottom:1px solid #34435c;display:none;align-items:center;padding:7px 10px;gap:10px;color:#fff}body.lb-page-active #lbPageBar{display:flex}#lbPageBack{font-size:18px;padding:7px 12px}.lbPageTitle{font-weight:700;flex:1}.lbPageStatus{font-size:12px;color:#9fb0c5}
body.lb-page-active #topbar{display:none}body.lb-page-active #app{padding-top:54px}body.lb-page-character #gameWrap{display:none!important}body.lb-page-character #characterWorkshop{top:54px!important;height:calc(100dvh - 54px)!important}body.lb-page-map #hud,body.lb-page-map .touchControls,body.lb-page-map #testClock,body.lb-page-map #testSessionOverlay{display:none!important}body.lb-page-map #gameWrap{height:calc(100dvh - 54px)}body.lb-page-battle #editorPanel{display:none!important}
#lbSimplePage{position:fixed;inset:54px 0 0 0;z-index:10500;background:#101827;color:#eef5ff;padding:22px;overflow:auto;display:none}#lbSimplePage.show{display:block}.lbSimpleInner{max-width:760px;margin:auto}.lbSimpleInner h2{font-size:28px}.lbSimpleInner button{display:block;width:100%;margin:10px 0;padding:14px;text-align:left}
@media(max-width:640px){.lbModeGrid{grid-template-columns:1fr}.lbModeCard{min-height:110px}.lbModeIcon{font-size:34px}}


/* M2.86 Battle setup flow */
.lbBattleFlow{position:fixed;inset:0;z-index:9000;background:#0c1424;padding:72px 18px 24px;overflow:auto;color:#eef5ff}.lbFlowShell{max-width:1120px;margin:auto}.lbFlowTop{display:flex;align-items:center;gap:16px;margin-bottom:20px}.lbFlowTop button,.lbFlowActions button{border:1px solid #526887;background:#1d2a3e;color:#fff;border-radius:12px;padding:12px 18px;font-weight:800}.lbFlowTop div{display:flex;flex-direction:column}.lbFlowTop b{font-size:24px}.lbFlowTop small,.lbFlowHeading p,.lbGameMode small,.lbReviewMode small,.lbReviewFighter small{color:#aebdd1}.lbFlowHeading{text-align:center;margin:12px 0 24px}.lbFlowHeading h2{font-size:32px;margin:0 0 6px}.lbGameModeGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}.lbGameMode{min-height:180px;border:2px solid #354b6b;background:linear-gradient(180deg,#1f3049,#142238);color:#fff;border-radius:18px;padding:20px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left}.lbGameMode:hover,.lbGameMode:focus{border-color:#77c4ff;transform:translateY(-2px)}.lbGameMode>span{font-size:40px}.lbGameMode b{font-size:22px}.lbSmashRoster{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;max-width:900px;margin:0 auto 22px}.lbRosterPortrait{background:#1b2a42;border:3px solid #354b6b;border-radius:10px;padding:6px;color:#fff;min-height:112px;display:flex;flex-direction:column;gap:5px;align-items:center}.lbRosterPortrait.selected{border-color:#ffd65a;background:#3c3420}.lbPortraitArt{width:68px;height:68px;border-radius:8px;display:grid;place-items:center;font-size:25px;font-weight:900;background:#34577d}.lbPortraitArt.p1{background:#6a476f}.lbPortraitArt.p2{background:#6b6136}.lbPortraitArt.p3{background:#356a5a}.lbPortraitArt.p4{background:#70433b}.lbPortraitArt.p5{background:#3e4f78}.lbPlayerSlots{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.lbPlayerCard{background:#17253a;border:2px solid #3b5273;border-radius:14px;padding:10px}.lbPlayerCard.active{border-color:#72c8ff}.lbPlayerCard.disabled{opacity:.55}.lbPlayerPick{width:100%;background:transparent;color:#fff;border:0;display:grid;grid-template-columns:auto 50px 1fr;align-items:center;gap:8px;text-align:left}.lbPlayerNum{font-size:18px;font-weight:900}.lbPlayerFace{height:48px;border-radius:8px;background:#304a6d;display:grid;place-items:center;font-weight:900}.lbPlayerCard label,.lbFlowField{display:block;font-size:12px;color:#b9c7d8;margin-top:8px}.lbPlayerCard select,.lbFlowField select{width:100%;margin-top:3px;background:#0e1929;color:#fff;border:1px solid #526887;border-radius:8px;padding:8px}.lbFlowActions{display:flex;justify-content:center;gap:12px;margin-top:22px}.lbFlowActions .primary{background:#2f7fc1;border-color:#72c8ff}.lbMatchReview{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.lbReviewMode,.lbReviewFighter{background:#17253a;border:1px solid #405777;border-radius:12px;padding:12px;min-width:150px;display:grid;grid-template-columns:42px 1fr;column-gap:8px}.lbReviewMode{display:flex;flex-direction:column}.lbReviewFighter span{grid-row:1/3;width:42px;height:42px;background:#304a6d;border-radius:8px;display:grid;place-items:center;font-weight:900}.lbFlowField{max-width:360px;margin:24px auto 0;font-size:14px}@media(max-width:760px){.lbPlayerSlots{grid-template-columns:repeat(2,1fr)}.lbBattleFlow{padding-top:58px}.lbFlowHeading h2{font-size:25px}}@media(max-width:430px){.lbPlayerSlots{grid-template-columns:1fr}.lbSmashRoster{grid-template-columns:repeat(3,1fr)}}
/* v3.2.1M2.87 — actual fighter artwork on the battle character-select screen */
.lbRosterPortrait{min-height:132px;justify-content:flex-end;overflow:hidden}
.lbPortraitCanvas{width:100%;height:88px;display:block;object-fit:contain;background:linear-gradient(180deg,rgba(105,150,200,.16),rgba(20,32,52,.08));border-radius:7px}
.lbRosterPortrait b{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;font-size:12px}
.lbPlayerPick{grid-template-columns:auto 58px 1fr}
.lbPlayerFaceCanvas{width:58px;height:54px;border-radius:8px;background:#304a6d;display:block}

/* v3.2.1M2.90 — reports live inside Battle instead of the main menu */
.lbBattleReportsBtn{margin-left:auto;margin-right:10px;padding:9px 14px;border:1px solid #40536f;border-radius:9px;background:#24344d;color:#f2f6ff;font-weight:800}
.lbBattleReportsPanel{position:fixed;inset:0;z-index:16000;background:rgba(4,9,18,.72);display:grid;place-items:center;padding:18px}
.lbBattleReportsPanel[hidden]{display:none!important}
.lbBattleReportsCard{width:min(560px,100%);background:#111b2b;border:1px solid #40536f;border-radius:16px;padding:18px;color:#eef5ff}
.lbBattleReportsHead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
.lbBattleReportsHead b{display:block;font-size:22px}.lbBattleReportsHead small{display:block;color:#aebbd0;margin-top:4px}.lbBattleReportsHead button{width:42px;height:42px;border-radius:10px}
.lbReportDecision,.lbReportTools{display:grid;gap:10px}.lbReportDecision button{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:15px}.lbReportDecision small{opacity:.76;margin-top:4px}.lbReportTools button{padding:13px;text-align:left}


/* v3.2.1M2.91 — workspace ownership and stale-layout cleanup audit
   Every app page now owns the whole viewport below the page bar. Legacy
   editor, setup, HUD, and overlay elements cannot reserve or paint space on
   another page. */
html,body{width:100%;height:100%;height:100dvh;min-height:100%;margin:0;overflow:hidden}
body.lb-page-active{height:100dvh;overflow:hidden}
body.lb-page-active #app{
  position:fixed!important;
  inset:54px 0 0!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  padding:0!important;
  display:grid!important;
  grid-template-rows:minmax(0,1fr)!important;
  overflow:hidden!important;
}
body.lb-page-active #gameWrap{
  grid-row:1!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  overflow:hidden!important;
}
body.lb-page-active #game{width:100%!important;height:100%!important}
#lbBattleFlow{inset:54px 0 0!important;padding:18px 18px 28px!important;min-height:0!important;max-height:none!important;overflow:auto!important}
#lbSimplePage{inset:54px 0 0!important;min-height:0!important;max-height:none!important}
#lbBattleReportsPanel{inset:54px 0 0!important;min-height:0!important;max-height:none!important;overflow:auto!important}
body.lb-page-character #characterWorkshop{
  position:fixed!important;
  inset:54px 0 0!important;
  top:54px!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
}
/* Exclusive workspace visibility. Hidden legacy elements are removed from
   layout rather than merely covered or made transparent. */
body:not(.lb-page-map) #editorPanel{display:none!important}
body:not(.lb-page-character) #characterWorkshop{display:none!important}
body:not(.lb-page-battle) #lbBattleFlow,
body:not(.lb-page-battle) #lbBattleReportsPanel{display:none!important}
body.lb-page-character #gameWrap,
body.lb-page-settings #gameWrap{display:none!important}
body.lb-page-map #testSessionOverlay,
body.lb-page-map #touchControls,
body.lb-page-map #topTouchControls,
body.lb-page-map #hud,
body.lb-page-map #testClock{display:none!important}
body.lb-page-battle.lb-battle-setup #gameWrap{display:none!important}
body.lb-page-battle.lb-battle-running #gameWrap{display:block!important}
body.lb-page-battle.lb-battle-results #gameWrap{display:block!important}
body.lb-page-battle.lb-battle-running #testSessionOverlay{display:none!important}
body.lb-page-battle.lb-battle-reporting #testSessionOverlay{display:none!important}
body.lb-page-battle.lb-battle-results #testSessionOverlay{display:grid!important}
body.lb-page-battle.lb-battle-results #touchControls,
body.lb-page-battle.lb-battle-results #topTouchControls{display:none!important}
body.lb-page-battle.lb-battle-reporting #touchControls,
body.lb-page-battle.lb-battle-reporting #topTouchControls{display:none!important}
/* The old top-bar Reports dropdown is compatibility-only and no longer part
   of the reorganized interface. */
#legacyReportsMenu{display:none!important}
@media(max-width:760px){
  #lbBattleFlow{padding:14px 10px 24px!important}
  body.lb-page-character #characterWorkshop{inset:54px 0 0!important}
}

/* M2.93: report decision and result views must truly replace one another. */
#lbReportDecision[hidden],#lbReportTools[hidden]{display:none!important}
.lbReportSummary{margin:0 0 4px;padding:14px;max-height:42vh;overflow:auto;white-space:pre-wrap;background:#0a1322;border:1px solid #344967;border-radius:10px;color:#e9f2ff;font:13px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace}


/* M2.94 — restore editor-only dropdown menus and isolate Map Editor from battle state. */
body.lb-page-map #topbar{
  display:flex!important;
  position:fixed!important;
  left:0!important;
  right:0!important;
  top:54px!important;
  width:100%!important;
  height:48px!important;
  min-height:48px!important;
  max-height:48px!important;
  z-index:10950!important;
}
body.lb-page-map #app{
  inset:102px 0 0!important;
}
/* Only controls useful for construction belong on the Map Editor page. */
body.lb-page-map #gameMenu,
body.lb-page-map #characterWorkshopBtn,
body.lb-page-map #legacyReportsMenu{
  display:none!important;
}
body.lb-page-map #mapMenu,
body.lb-page-map #creativeToolsBtn,
body.lb-page-map #viewMenu,
body.lb-page-map #controlsMenu,
body.lb-page-map #diagnosticsMenu{
  display:block!important;
}
body.lb-page-map #toolbarDrawer{
  display:flex!important;
  width:100%!important;
}
body.lb-page-map #menuBuildBadge{margin-left:auto}
@media(max-width:700px){
  body.lb-page-map #app{inset:102px 0 0!important}
  body.lb-page-map .menuDropdown{top:104px!important}
}

/* M2.95 — page-owned editor and live-battle toolbars. */
#lbMapQuickActions{display:none}
body.lb-page-map #lbMapQuickActions{
  display:flex!important;align-items:center;gap:7px;flex:0 0 auto;
}
#lbMapQuickActions .menuSelectLabel{display:flex;align-items:center;gap:6px;margin:0;padding:0;background:none;border:0}
#lbMapQuickActions select,#lbMapQuickActions button{
  min-height:36px;padding:7px 10px;border-radius:8px;white-space:nowrap;
}
body.lb-page-map #mapMenu,
body.lb-page-map #controlsMenu,
body.lb-page-map #diagnosticsMenu{display:none!important}
body.lb-page-map #viewMenu #announcerSoundBtn,
body.lb-page-map #viewMenu #sfxSoundBtn,
body.lb-page-map #viewMenu #musicSoundBtn,
body.lb-page-map #viewMenu .menuSelectLabel:has(#musicVolume){display:none!important}
body.lb-page-map #toolbarDrawer{overflow-x:auto!important;overflow-y:visible!important;scrollbar-width:thin}

/* Battle owns sound, controls, and combat diagnostics. */
body.lb-page-battle.lb-battle-running #topbar{
  display:flex!important;position:fixed!important;left:0!important;right:0!important;
  top:54px!important;width:100%!important;height:48px!important;min-height:48px!important;
  max-height:48px!important;z-index:10950!important;
}
body.lb-page-battle.lb-battle-running #app{inset:102px 0 0!important}
body.lb-page-battle.lb-battle-running #toolbarDrawer{display:flex!important;width:100%!important}
body.lb-page-battle.lb-battle-running #gameMenu,
body.lb-page-battle.lb-battle-running #mapMenu,
body.lb-page-battle.lb-battle-running #creativeToolsBtn,
body.lb-page-battle.lb-battle-running #characterWorkshopBtn,
body.lb-page-battle.lb-battle-running #legacyReportsMenu{display:none!important}
body.lb-page-battle.lb-battle-running #viewMenu,
body.lb-page-battle.lb-battle-running #controlsMenu,
body.lb-page-battle.lb-battle-running #diagnosticsMenu{display:block!important}
body.lb-page-battle.lb-battle-running #menuBuildBadge{margin-left:auto}

/* Keep setup screens clean: these controls appear only once battle is live. */
body.lb-page-battle:not(.lb-battle-running) #topbar{display:none!important}
@media(max-width:700px){
  body.lb-page-map #app,body.lb-page-battle.lb-battle-running #app{inset:102px 0 0!important}
  body.lb-page-map .menuDropdown,body.lb-page-battle.lb-battle-running .menuDropdown{top:104px!important}
  #lbMapQuickActions{gap:5px}
  #lbMapQuickActions select,#lbMapQuickActions button{min-height:34px;padding:6px 8px;font-size:13px}
}


/* M2.96 — direct page-bar Sky and Fullscreen controls. */
#lbSharedViewQuickActions{display:none;align-items:center;gap:7px;flex:0 0 auto}
body.lb-page-map #lbSharedViewQuickActions,
body.lb-page-battle.lb-battle-running #lbSharedViewQuickActions{display:flex!important}
#lbSharedViewQuickActions button{
  min-height:36px;padding:7px 10px;border-radius:8px;white-space:nowrap
}
/* These actions now live directly on the page bar rather than inside View. */
body.lb-page-map #viewMenu #skyBtn,
body.lb-page-map #viewMenu #fullscreenBtn,
body.lb-page-battle.lb-battle-running #viewMenu #skyBtn,
body.lb-page-battle.lb-battle-running #viewMenu #fullscreenBtn{display:none!important}
@media(max-width:700px){
  #lbSharedViewQuickActions{gap:5px}
  #lbSharedViewQuickActions button{min-height:34px;padding:6px 8px;font-size:13px}
}

/* v3.2.1M2.97 — one horizontally scrollable Map Editor header. */
body.lb-page-map #topbar{display:none!important}
body.lb-page-map #app{inset:54px 0 0!important}
#lbPageBar{overflow:hidden;gap:10px}
#lbPageTitle{flex:0 0 auto}
#lbPageStatus{flex:0 0 auto}
#lbPageActions{
  display:none;
  flex:1 1 auto;
  min-width:0;
  align-items:center;
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-x:contain;
  scrollbar-width:thin;
  touch-action:pan-x;
  -webkit-overflow-scrolling:touch;
  cursor:grab;
  padding:4px 2px;
  user-select:none;
}
#lbPageActions.lbDragging{cursor:grabbing;scroll-behavior:auto}
body.lb-page-map #lbPageActions{display:flex}
body.lb-page-map #lbPageStatus{display:none}
#lbPageActions button,#lbPageActions label{
  flex:0 0 auto;
  white-space:nowrap;
  margin:0!important;
}
#lbPageActions label{display:flex;align-items:center;gap:5px}
#lbPageActions select{width:auto;min-width:74px}
#lbPageActions #lbMapQuickActions,
#lbPageActions #lbSharedViewQuickActions{display:contents}
@media(max-width:760px){
  #lbPageBar{gap:6px}
  #lbPageTitle{display:none}
  #lbPageActions{gap:6px}
  #lbPageActions button{padding:8px 10px}
}
/* M3.02 four-slot unified battle setup */
.lbBattleSetupTools{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:-8px auto 18px;max-width:980px}
.lbBattleSetupTools button{border:1px solid #405777;background:#17253a;color:#eef5ff;border-radius:10px;padding:9px 13px;font-weight:800}
.lbPlayerSlots{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1100px){.lbPlayerSlots{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.lbPlayerSlots{grid-template-columns:1fr}}

/* v3.2.1M3.12: four-fighter compact HUD */
body:not(.tabletop-mode) #hud{display:block;padding:0 10px;top:8px;transform:none}
#fighterHudGrid{display:grid;grid-template-columns:1fr 1fr;gap:4px 10px;width:100%}
#fighterHudGrid .fighterHud{min-width:0;justify-content:flex-start;padding:4px 7px;gap:5px;background:rgba(0,0,0,.43)}
#fighterHudGrid .fighterHud span:nth-child(2){font-size:18px}
#fighterHudGrid .fighterHud .meter{flex:1;min-width:28px;max-width:150px;width:auto}
#fighterHudGrid .p2,#fighterHudGrid .p4{border-right:4px solid #ff7777;border-left:0}
#fighterHudGrid .p3{border-left:4px solid #71df8a}
#fighterHudGrid .p4{border-right-color:#e5a5ff}
body:not(.tabletop-mode) #modeLabel{position:absolute;left:50%;top:0;transform:translateX(-50%);font-size:10px;background:rgba(0,0,0,.55);padding:2px 6px;border-radius:0 0 7px 7px}
@media(max-width:700px){#fighterHudGrid{gap:3px 5px}#fighterHudGrid .fighterHud{font-size:11px;padding:3px 4px;gap:3px}#fighterHudGrid .fighterHud span:nth-child(2){font-size:15px}#fighterHudGrid .fighterHud .meter{height:5px}}

/* v3.2.1M3.29 — portable text-code character exchange. */
.cwExchangePanel{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:12px;background:rgba(5,9,16,.82)}
.cwExchangePanel.hidden{display:none!important}.cwExchangeCard{width:min(760px,100%);max-height:92dvh;overflow:auto;background:#101a29;border:1px solid #49627f;border-radius:14px;padding:14px;color:#eef5ff;box-shadow:0 16px 60px rgba(0,0,0,.55)}
.cwExchangeHead{display:flex;align-items:center;justify-content:space-between;gap:12px}.cwExchangeHead small{display:block;color:#b8c6d8;margin-top:3px}.cwExchangeTabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:14px 0 10px}.cwExchangeTabs button,.cwExchangeActions button{min-height:42px;border-radius:9px;border:1px solid #455a75;background:#1b2a3f;color:#fff;font-weight:700}.cwExchangeTabs button.active{background:#315f83;border-color:#84c8f5}.cwExchangeActions button.primary{background:#2f6f95;border-color:#8bd1ff}
.cwExchangePane textarea{display:block;width:100%;min-height:210px;resize:vertical;box-sizing:border-box;border:1px solid #455a75;border-radius:9px;background:#08111e;color:#dff2ff;padding:10px;font:12px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace;word-break:break-all}.cwExchangeActions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px;flex-wrap:wrap}.cwExchangeActions button{padding:8px 13px}.cwImportName{display:block;margin-top:10px;color:#cbd9e9}.cwImportName input{display:block;width:100%;box-sizing:border-box;margin-top:5px;border:1px solid #455a75;border-radius:8px;background:#0c1726;color:#fff;padding:9px}.cwExchangeStatus{min-height:22px;margin-top:8px;color:#a9d9aa}.cwExchangeStatus.error{color:#ff9a9a}
@media(max-width:600px){.cwExchangeCard{padding:10px}.cwExchangePane textarea{min-height:180px}.cwExchangeActions button{flex:1 1 150px}}

/* M3.32.1 combat readability: pulse only when a human-controlled fighter is in range. */
.rightCluster button.range-ready{opacity:1!important;outline:3px solid rgba(255,218,92,.96);outline-offset:3px;filter:brightness(1.22);animation:lbRangeReadyPulse .62s ease-in-out infinite alternate}
.rightCluster button[data-key="attack"].range-ready{outline-color:rgba(158,232,255,.98)}
@keyframes lbRangeReadyPulse{from{box-shadow:0 0 0 rgba(255,218,92,0)}to{box-shadow:0 0 18px rgba(255,218,92,.72)}}


/* v3.2.1M3.37 — responsive official title artwork behind the main menu */
#lbMainMenu{
  isolation:isolate;
  background:#081225 url("assets/menu/title_landscape.jpg") center center / cover no-repeat;
}
#lbMainMenu::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(5,11,25,.20),rgba(5,11,25,.45) 44%,rgba(5,11,25,.76)),
    radial-gradient(circle at center,rgba(5,11,25,.05),rgba(5,11,25,.40));
}
#lbMainMenu .lbMenuShell{
  position:relative;
  z-index:1;
  padding:18px;
  border-radius:24px;
  background:rgba(7,15,31,.46);
  border:1px solid rgba(190,218,255,.22);
  box-shadow:0 18px 55px rgba(0,0,0,.42);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
}
#lbMainMenu .lbMenuTitle h1{
  text-shadow:0 3px 14px rgba(0,0,0,.95),0 0 30px rgba(43,101,180,.55);
}
#lbMainMenu .lbMenuTitle p,#lbMainMenu .lbMenuFooter{
  color:#e2ebf8;
  text-shadow:0 2px 5px #000;
}
#lbMainMenu .lbModeCard{
  background:rgba(14,28,52,.86);
  border-color:rgba(155,194,242,.42);
  box-shadow:0 7px 20px rgba(0,0,0,.28);
}
#lbMainMenu .lbModeCard:hover,#lbMainMenu .lbModeCard:focus{
  background:rgba(28,53,89,.94);
}
@media (orientation:portrait){
  #lbMainMenu{
    background-image:url("assets/menu/title_portrait.jpg");
    background-position:center center;
  }
  #lbMainMenu .lbMenuShell{
    width:min(760px,100%);
  }
}
@media (orientation:landscape) and (max-height:720px){
  #lbMainMenu{padding:10px;background-position:center center}
  #lbMainMenu .lbMenuShell{width:min(980px,100%);padding:12px}
  #lbMainMenu .lbMenuTitle{margin-bottom:10px}
  #lbMainMenu .lbMenuTitle h1{font-size:clamp(26px,5vw,48px)}
  #lbMainMenu .lbMenuTitle p{margin:4px 0;font-size:13px}
  #lbMainMenu .lbModeGrid{gap:9px}
  #lbMainMenu .lbModeCard{min-height:94px;padding:12px 15px;border-radius:14px}
  #lbMainMenu .lbModeIcon{font-size:30px;width:44px}
  #lbMainMenu .lbModeCard b{font-size:18px}
  #lbMainMenu .lbModeCard small{font-size:11px}
  #lbMainMenu .lbMenuFooter{margin-top:8px}
}

/* v3.2.1M3.38 — revised user artwork, translucent controls, orientation-aware layout */
#lbMainMenu{
  background-color:#081225;
  background-image:url("assets/menu/title_landscape.jpg");
  background-position:center center;
  background-size:cover;
  padding:clamp(10px,2vw,24px);
}
#lbMainMenu::before{
  background:linear-gradient(180deg,rgba(4,9,22,.08),rgba(4,9,22,.14) 48%,rgba(4,9,22,.28));
}
#lbMainMenu .lbMenuShell{
  width:min(780px,48vw);
  margin-left:auto;
  margin-right:2vw;
  padding:14px;
  border-radius:20px;
  background:rgba(5,13,29,.18);
  border:1px solid rgba(205,225,255,.20);
  box-shadow:0 14px 40px rgba(0,0,0,.25);
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
}
#lbMainMenu .lbMenuTitle{margin-bottom:10px}
#lbMainMenu .lbMenuTitle h1{font-size:clamp(25px,4vw,46px);line-height:1}
#lbMainMenu .lbMenuTitle p{font-size:12px;margin:6px 0}
#lbMainMenu .lbModeGrid{grid-template-columns:1fr;gap:8px}
#lbMainMenu .lbModeCard{
  min-height:72px;
  padding:10px 14px;
  border-radius:14px;
  background:rgba(9,22,45,.58);
  border-color:rgba(190,216,250,.38);
  box-shadow:0 5px 16px rgba(0,0,0,.22);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
}
#lbMainMenu .lbModeCard:hover,#lbMainMenu .lbModeCard:focus{
  background:rgba(24,49,84,.76);
  border-color:rgba(151,204,255,.85);
}
#lbMainMenu .lbModeIcon{font-size:28px;width:40px}
#lbMainMenu .lbModeCard b{font-size:18px;margin-bottom:2px}
#lbMainMenu .lbModeCard small{font-size:10px;line-height:1.25;color:#d3dfef}
#lbMainMenu .lbMenuFooter{margin-top:7px;font-size:10px}

@media (orientation:portrait){
  #lbMainMenu{
    background-image:url("assets/menu/title_portrait.jpg");
    background-position:center center;
    align-items:flex-start;
    justify-content:center;
    padding:12px 10px 18px;
  }
  #lbMainMenu .lbMenuShell{
    width:min(94vw,560px);
    margin:0;
    margin-top:4vh;
    padding:10px;
    background:rgba(5,13,29,.12);
  }
  #lbMainMenu .lbMenuTitle{margin-bottom:7px}
  #lbMainMenu .lbMenuTitle h1{font-size:clamp(24px,8vw,40px)}
  #lbMainMenu .lbMenuTitle p{display:none}
  #lbMainMenu .lbModeGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  #lbMainMenu .lbModeCard{
    min-height:62px;
    padding:8px 10px;
    gap:8px;
    background:rgba(8,20,42,.54);
  }
  #lbMainMenu .lbModeIcon{font-size:23px;width:29px}
  #lbMainMenu .lbModeCard b{font-size:14px}
  #lbMainMenu .lbModeCard small{display:none}
  #lbMainMenu .lbMenuFooter{font-size:9px;margin-top:5px}
}

@media (orientation:landscape) and (max-height:720px){
  #lbMainMenu .lbMenuShell{width:min(560px,44vw);margin-right:1vw;padding:9px}
  #lbMainMenu .lbMenuTitle{margin-bottom:6px}
  #lbMainMenu .lbMenuTitle h1{font-size:clamp(22px,3.4vw,38px)}
  #lbMainMenu .lbMenuTitle p{display:none}
  #lbMainMenu .lbModeGrid{gap:6px}
  #lbMainMenu .lbModeCard{min-height:58px;padding:7px 10px;gap:8px}
  #lbMainMenu .lbModeIcon{font-size:23px;width:30px}
  #lbMainMenu .lbModeCard b{font-size:15px}
  #lbMainMenu .lbModeCard small{display:none}
  #lbMainMenu .lbMenuFooter{margin-top:5px;font-size:9px}
}

/* M3.39 saved-character browser */
.cwLoadCard{width:min(760px,92vw);max-height:min(82vh,700px);overflow:auto}
.cwCharacterBrowser{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:10px;align-items:center;margin:12px 0}
.cwCharacterViewport{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;padding:4px 0 10px}
.cwCharacterRail{display:flex;gap:10px;min-width:max-content}
.cwCharacterCard{width:150px;min-height:116px;padding:12px 10px;border:1px solid rgba(150,185,230,.3);border-radius:14px;background:rgba(23,38,61,.82);color:#eef5ff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;scroll-snap-align:center;text-align:center;transition:transform .15s,border-color .15s,background .15s}
.cwCharacterCard.selected{transform:translateY(-3px);border-color:#79b7ff;background:rgba(48,76,112,.95);box-shadow:0 0 0 2px rgba(94,165,255,.18)}
.cwCharacterCardIcon{font-size:30px;line-height:1}.cwCharacterCard b{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cwCharacterCard small{opacity:.7}
.cwBrowserArrow{height:64px;font-size:32px;border-radius:12px}.cwSelectedCharacterInfo{display:flex;flex-direction:column;gap:3px;padding:10px 12px;background:rgba(20,31,50,.65);border-radius:10px}.cwSelectedCharacterInfo small{opacity:.72}
.cwCharacterManageActions{display:flex;gap:10px;margin-top:10px}.cwCharacterManageActions button{flex:1}.cwCharacterManageActions .danger{border-color:rgba(255,99,115,.55);color:#ffb5bd}
@media(max-width:600px){.cwLoadCard{width:94vw}.cwCharacterBrowser{grid-template-columns:36px minmax(0,1fr) 36px;gap:5px}.cwCharacterCard{width:128px;min-height:104px}.cwLoadActions,.cwCharacterManageActions{display:grid;grid-template-columns:1fr 1fr}.cwLoadActions #cwCancelLoad{grid-column:1/-1}}

/* M3.43 — permanent Create / Animate workspace tabs */
.cwWorkspaceTabs{display:flex;gap:8px;padding:8px 12px;background:rgba(8,16,30,.84);border-bottom:1px solid rgba(145,174,220,.28)}
.cwWorkspaceTabs.hidden{display:none}
.cwWorkspaceTabs button{min-width:120px;padding:9px 16px;border:1px solid rgba(145,174,220,.35);border-radius:10px;background:rgba(31,45,68,.78);color:#dce8fb;font-weight:700}
.cwWorkspaceTabs button.active{background:#356fa8;border-color:#7ebcff;color:white}
@media(max-width:600px){.cwWorkspaceTabs{padding:6px 8px}.cwWorkspaceTabs button{flex:1;min-width:0;padding:8px}}

/* M3.47.11: animation frames can be dragged to rearrange their playback order. */
.cwFrameStrip button{touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.cwFrameStrip.reordering button{cursor:grabbing}
.cwFrameStrip button.frameDragSource{opacity:.45;outline:2px dashed #ffd36a}
.cwFrameStrip button.frameDropTarget{transform:translateY(-3px);box-shadow:0 0 0 3px #7fc8ff;background:#456b91}

/* M3.47.13 — copy/paste selected limb pose between animation frames. */
.cwLimbPoseStatus{margin-top:5px;font-size:10px;color:#9db0c8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cwBoneEdit button:disabled{opacity:.45;cursor:not-allowed}
.cwPuppetControls{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px;padding-top:6px;border-top:1px solid rgba(100,126,158,.35)}.cwPuppetControls button{min-height:32px}.cwPuppetControls button.active{outline:2px solid #ffd95a;background:#4d4321;color:#fff8cf}.cwPuppetControls label{display:flex;align-items:center;gap:5px;font-size:10px;color:#b9c8dc;white-space:nowrap}.cwPuppetControls input[type=range]{width:110px}.cwPuppetControls #cwPuppetStatus{font-size:10px;color:#a9bdd5;min-width:170px;flex:1 1 220px}.cwPuppetControls .pinned{outline:2px solid #ffcf5a;background:#533f1d}
@media(max-width:720px){.cwPuppetControls{flex-wrap:nowrap;overflow-x:auto;padding-bottom:3px}.cwPuppetControls label{min-width:150px}.cwPuppetControls #cwPuppetStatus{min-width:220px}}


/* M3.47.14 — keep the animation timeline out of the character viewport.
   The timeline now occupies its own row instead of covering the fighter. */
.characterWorkshop.animateMode .cwStageWrap{
  display:grid;
  grid-template-rows:minmax(260px,1fr) auto;
  align-items:stretch;
  justify-content:stretch;
  overflow:hidden;
}
.characterWorkshop.animateMode #cwCanvas{
  grid-row:1;
  min-width:0;
  min-height:0;
  width:100%;
  height:100%;
}
.characterWorkshop.animateMode .cwTimeline{
  position:relative;
  grid-row:2;
  left:auto;
  right:auto;
  bottom:auto;
  width:auto;
  margin:8px;
  max-height:min(310px,42vh);
  overflow-y:auto;
  box-sizing:border-box;
}
.characterWorkshop.animateMode .cwStageTools{
  bottom:calc(min(310px,42vh) + 18px);
}
@media(max-height:760px){
  .characterWorkshop.animateMode .cwStageWrap{grid-template-rows:minmax(210px,1fr) auto}
  .characterWorkshop.animateMode .cwTimeline{max-height:250px}
  .characterWorkshop.animateMode .cwStageTools{bottom:268px}
}

/* M3.47.30 — clickable bot spectator meters */
#fighterHudGrid .fighterHud.spectateSelectable{pointer-events:auto;cursor:pointer;user-select:none;transition:background .12s,border-color .12s,transform .12s,box-shadow .12s}
#fighterHudGrid .fighterHud.spectateSelectable:hover{background:rgba(36,52,70,.72)}
#fighterHudGrid .fighterHud.spectateSelectable:focus-visible{outline:2px solid #fff;outline-offset:2px}
#fighterHudGrid .fighterHud.spectated{background:rgba(48,76,105,.86);box-shadow:0 0 0 2px rgba(255,255,255,.9) inset;transform:translateY(1px)}
#fighterHudGrid .fighterHud.spectated::after{content:'WATCHING';font-size:9px;letter-spacing:.08em;opacity:.95}

/* M3.47.57 rig editing and whole-model opacity */
.cwModelOpacity{display:flex!important;flex-direction:column;gap:5px;margin-top:12px;padding:10px;background:rgba(10,20,34,.55);border:1px solid rgba(158,227,255,.18);border-radius:9px}.cwModelOpacity span{float:right;color:#9ee3ff}.cwModelOpacity input{width:100%}.cwToolGrid #cwAddBone,.cwToolGrid #cwEditRig{font-size:12px;line-height:1.1;padding:8px 4px}.cwToolGrid #cwEditRig.active{background:#ffe27a;color:#17130a;border-color:#fff0a8}

/* M3.47.58 rig touch handles, two-stage grouping, and color eyedroppers */
.cwColorRow{display:grid;grid-template-columns:1fr 42px;gap:7px;align-items:center;margin-top:4px}.cwColorRow input[type=color]{width:100%;min-height:38px}.cwEyedropper{min-height:38px;font-size:18px}.cwEyedropper.active{outline:2px solid #ffe27a;background:#5d4c20}

/* M3.47.76 map-building reference overlay */
.mapReferencePanel{margin:6px 0 9px;padding:7px 9px;border:1px solid rgba(150,190,235,.25);border-radius:9px;background:rgba(34,46,66,.68)}
.mapReferencePanel summary{cursor:pointer;font-weight:900;color:#dcecff;margin-bottom:7px}.mapReferenceButtons{margin-bottom:7px}.mapReferenceButtons button.active{background:#2d77ad;border-color:#8fd5ff;box-shadow:0 0 0 2px rgba(100,190,255,.18)}
.mapReferenceSliders{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:8px}.mapReferenceSliders label{display:grid;grid-template-columns:1fr auto;gap:3px 8px;font-size:11px;font-weight:800;color:#c4d4e8}.mapReferenceSliders input{grid-column:1/-1;width:100%;accent-color:#75bfff}.mapReferenceSliders output{color:#9ed8ff}.mapReferencePanel small{display:block;opacity:.72;margin-top:5px}
@media(max-width:720px){.mapReferenceSliders{grid-template-columns:1fr}.mapReferencePanel{padding:6px}}
body.mapReferenceMoving #gameCanvas{cursor:move}


/* M3.47.77 — visual custom-asset library cards */
#lbCreativeAssetList.assetPreviewGrid{
  grid-template-columns:repeat(auto-fill,minmax(112px,1fr));
  gap:9px;
  align-items:stretch;
}
#lbCreativeAssetList .assetPreviewCard{
  position:relative;
  min-width:0!important;
  min-height:154px!important;
  padding:7px!important;
  border:1px solid #34445b;
  border-radius:9px;
  background:#172131;
  color:#edf5ff;
  display:flex!important;
  flex-direction:column;
  align-items:stretch!important;
  justify-content:flex-start!important;
  gap:5px;
  overflow:hidden;
  white-space:normal!important;
  text-align:center;
}
#lbCreativeAssetList .assetPreviewCard:hover{background:#202d40;border-color:#597493}
#lbCreativeAssetList .assetPreviewCard.active{background:#294763;border-color:#8ed0ff;box-shadow:inset 0 0 0 2px rgba(142,208,255,.32)}
#lbCreativeAssetList .assetPreviewCanvas{
  width:100%;height:96px;object-fit:contain;display:block;
  background:linear-gradient(180deg,#101a29,#121d2c);
  border:1px solid #2b3b50;border-radius:6px;
}
#lbCreativeAssetList .assetPreviewName{font-size:12px;font-weight:750;line-height:1.12;min-height:27px;display:grid;place-items:center}
#lbCreativeAssetList .assetPreviewMeta{font-size:10px;color:#a9bad0;line-height:1}
#lbCreativeAssetList .assetPreviewBadges{position:absolute;top:12px;right:11px;display:flex;gap:4px;pointer-events:none}
#lbCreativeAssetList .assetPreviewBadges span{min-width:20px;height:20px;padding:0 4px;border-radius:10px;background:rgba(8,15,26,.88);border:1px solid #6f829b;display:grid;place-items:center;font-size:12px;font-weight:800;color:#dff2ff}
@media(max-width:700px){
  #lbCreativeAssetList.assetPreviewGrid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:7px}
  #lbCreativeAssetList .assetPreviewCard{min-height:136px!important;padding:5px!important}
  #lbCreativeAssetList .assetPreviewCanvas{height:82px}
  #lbCreativeAssetList .assetPreviewName{font-size:11px;min-height:24px}
}

/* M3.47.78 — keep editor tools fixed while inventory scrolls independently */
#editorPanel .editorPanelContent{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  min-height:0;
}
#editorPanel .editorQuickRow,
#editorPanel .mapReferencePanel,
#editorPanel .creativeInventoryHeader{
  flex:0 0 auto;
}
#editorPanel .creativeInventoryHeader{
  position:relative;
  top:auto;
  z-index:12;
}
#editorPanel .creativePages{
  flex:1 1 auto;
  min-height:110px;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  padding:8px 3px 14px 0;
  scrollbar-gutter:stable;
}
#editorPanel .creativePage[data-page="assets"]{
  min-height:100%;
}
#editorPanel .creativePage[data-page="assets"] > .creativeGrid:first-child,
#editorPanel .creativePage[data-page="assets"] .assetOrderControls,
#editorPanel .creativePage[data-page="assets"] > small{
  position:relative;
  z-index:1;
}
@media(max-width:760px){
  #editorPanel .creativePages{min-height:120px;padding-bottom:max(18px,env(safe-area-inset-bottom))}
  #editorPanel .mapReferencePanel:not([open]){padding-bottom:4px;margin-bottom:5px}
}

/* M3.47.81 map prefab library */
.mapPrefabSection{display:grid;gap:7px;padding:9px 3px 11px;border-bottom:1px solid rgba(140,170,210,.2)}
.mapPrefabSection>small{opacity:.72}.mapPrefabList{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.mapPrefabCard{position:relative;min-width:0}.mapPrefabUse{width:100%;min-height:64px;display:grid;gap:3px;text-align:left;padding:10px 34px 10px 10px}.mapPrefabUse small{opacity:.72}
.mapPrefabDelete{position:absolute;right:5px;top:5px;width:28px;height:28px;padding:0;border-radius:50%;font-size:18px}.assetLibraryActions{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}




/* M3.48.00 — one bounded Creative Tools scroll body. */
#editorPanel{
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  overflow:hidden!important;
}
#editorPanel.editorCollapsed{grid-template-rows:auto!important}
#editorPanel .editorPanelChrome{grid-row:1;min-height:0}
#editorPanel .editorPanelContent{
  grid-row:2;
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  box-sizing:border-box!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  touch-action:none!important;
  -webkit-overflow-scrolling:touch!important;
}
#editorPanel .creativePages{
  display:block!important;
  min-height:0!important;
  overflow:visible!important;
  touch-action:auto!important;
}

/* M3.48.06 — Character all-frame animation offset controls. */
.cwAllFrameOffset{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px 0}.cwAllFrameOffset label{display:grid;gap:4px}.cwAllFrameOffset input,.cwAllFrameOffset select{width:100%;min-width:0}
@media(max-width:700px){.cwAllFrameOffset{grid-template-columns:1fr}}

/* M3.48.08 — visible map capacity readout. */
.mapCapacityBadge{display:inline-flex;align-items:center;min-height:34px;padding:0 10px;border:1px solid rgba(150,200,235,.28);border-radius:9px;background:rgba(34,48,66,.72);color:#cfeaff;font-size:12px;font-weight:700;white-space:nowrap}


/* M3.48.11 — deep map-editor zoom and adjustable battle camera settings */
.mapEditorZoomControls{flex:1 0 100%;display:grid;grid-template-columns:auto auto minmax(120px,1fr) auto auto auto;align-items:center;gap:6px;margin-top:6px}
.mapEditorZoomControls label{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:800;color:#c4d4e8;white-space:nowrap}
.mapEditorZoomControls output{color:#9ed8ff;min-width:42px;text-align:right}
.mapEditorZoomControls input{width:100%;min-width:80px;accent-color:#75bfff}
.mapEditorZoomControls button{padding:6px 9px;min-width:40px}
.lbSettingsSection{margin:18px 0;padding:16px;border:1px solid rgba(135,170,210,.28);border-radius:12px;background:rgba(28,42,61,.72)}
.lbSettingsSection h3{margin:0 0 12px;font-size:18px}
.lbSettingsSection small{display:block;margin-top:10px;color:#b9c8d9;line-height:1.45}
.lbSettingsRange{display:grid;gap:8px;margin-bottom:12px}
.lbSettingsRange span{display:flex;justify-content:space-between;gap:12px;font-weight:800}
.lbSettingsRange output{color:#9ed8ff}
.lbSettingsRange input{width:100%;accent-color:#75bfff}
.lbSettingsButtonRow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.lbSimpleInner .lbSettingsButtonRow button{margin:0;text-align:center}
@media(max-width:620px){.mapEditorZoomControls{grid-template-columns:auto minmax(90px,1fr) auto auto}.mapEditorZoomControls label{grid-column:1/-1;justify-content:space-between}.mapEditorZoomControls input{grid-column:1/-1}.lbSettingsButtonRow{grid-template-columns:1fr}}

/* M3.48.22 — persistent battle camera pan and zoom controls. */
.battleCameraMenuZoom{flex-wrap:wrap;justify-content:space-between}
.battleCameraMenuZoom output{color:#9ed8ff;font-weight:800;min-width:46px;text-align:right}
.battleCameraMenuZoom input{flex:1 0 100%;width:100%;accent-color:#75bfff}
body.battle-camera-pan-enabled #game{cursor:grab}
body.battle-camera-panning #game{cursor:grabbing}
#lbBattleCameraPanMode.active,#battleCameraPanBtn.active{background:#236ca8!important;border-color:#67baff!important}


/* M3.48.40 — per-frame drawn animation effects. */
.cwEffectModeRow{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:6px;margin:7px 0}
.cwEffectModeRow button{min-height:38px;border:1px solid #41516a;border-radius:8px;background:#222d3e;color:#eef5ff;font-weight:800}
.cwEffectModeRow button.active{outline:2px solid #7fc8ff;background:#304f70}
.cwEffectGrid{display:grid;grid-template-columns:1fr;gap:2px;padding:8px;border:1px solid rgba(135,177,220,.25);border-radius:9px;background:rgba(12,23,38,.48)}
.cwEffectGrid label{margin:4px 0}
.cwEffectActions{margin-top:7px}
.cwEffectActions button{flex:1;min-width:0}
.characterWorkshop.effectDrawMode #cwCanvas{cursor:crosshair}
.characterWorkshop.effectEraseMode #cwCanvas{cursor:cell}
.characterWorkshop.effectDrawMode .cwTimeline,
.characterWorkshop.effectEraseMode .cwTimeline{user-select:none}
@media(max-width:720px){
  .cwEffectModeRow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cwEffectActions{display:grid;grid-template-columns:1fr}
}

/* M3.48.42 — geometric Character Frame Effect tools. */
.cwEffectModeRow button{padding:7px 6px;line-height:1.15}
@media(max-width:430px){.cwEffectModeRow{grid-template-columns:1fr}}

/* M3.48.43 — movable frame effects and explicit transparency control. */
.characterWorkshop.effectMoveMode #cwCanvas{cursor:move}
.characterWorkshop.effectMoveMode .cwTimeline{user-select:none}

/* M3.48.44 — optional independent outlines for Character Frame Effects. */
.cwEffectToggleLabel{display:flex!important;align-items:center;justify-content:space-between;gap:10px}
.cwEffectToggleLabel input[type="checkbox"]{width:22px;height:22px;accent-color:#78c8ff;flex:0 0 auto}
.cwEffectGrid label.effectControlDisabled{opacity:.45}

/* M3.48.65 — readable JSON file controls. */
.cwJsonFileButton{min-width:68px;padding:0 7px;font-size:11px;font-weight:800;white-space:nowrap}
.cwTopActions{min-width:0;overflow-x:auto;scrollbar-width:thin;padding-bottom:2px}
@media(max-width:720px){.cwJsonFileButton{min-width:62px;padding:0 5px;font-size:10px}}

/* M3.48.68 — body-region colors for the Character Animation rig. */
.cwRigColorLegend{
  display:flex;
  flex-wrap:wrap;
  gap:5px 9px;
  align-items:center;
  margin:5px 0 3px;
  padding:6px 7px;
  border:1px solid rgba(157,190,228,.28);
  border-radius:8px;
  background:rgba(8,18,31,.55);
  color:#dcecff;
  font-size:10px;
  line-height:1.15;
}
.cwRigColorLegend span{
  display:inline-flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
}
.cwRigSwatch{
  width:9px;
  height:9px;
  flex:0 0 9px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.8);
  box-shadow:0 0 0 1px rgba(0,0,0,.55);
}
.cwRigRoot{background:#ffd166}
.cwRigTorso{background:#4cc9f0}
.cwRigHead{background:#ff5ca8}
.cwRigLeftArm{background:#45e0b7}
.cwRigRightArm{background:#ff9f43}
.cwRigLeftLeg{background:#9be33d}
.cwRigRightLeg{background:#a78bfa}
.cwRigTail{background:#ff6b6b}

/* M3.48.70 — colored Character Maker rig guide. */
.cwBuildRigColorLegend{
  margin-top:7px;
  max-height:92px;
  overflow-y:auto;
}
.cwBuildRigColorLegend span{
  flex:1 1 92px;
}

/* M3.48.75 — editable keyboard controls. */
.lbKeyboardBindings{
  display:grid;
  grid-template-columns:repeat(2,minmax(230px,1fr));
  gap:12px;
  margin:10px 0;
}
.lbKeyboardPlayer{
  min-width:0;
  padding:10px;
  border:1px solid rgba(142,181,226,.28);
  border-radius:10px;
  background:rgba(8,19,34,.48);
}
.lbKeyboardPlayer h4{margin:0 0 8px;color:#eaf4ff}
.lbKeyboardGrid{display:grid;gap:6px}
.lbKeyboardRow{
  display:grid;
  grid-template-columns:minmax(120px,1fr) minmax(94px,auto);
  gap:8px;
  align-items:center;
}
.lbKeyboardRow>span{font-size:12px;color:#d5e5f7}
.lbKeyboardBindButton{
  min-width:94px;
  padding:6px 9px;
  white-space:nowrap;
  font-weight:800;
}
.lbKeyboardBindButton.listening{
  outline:2px solid #8fd3ff;
  background:rgba(79,157,220,.34);
}
@media(max-width:720px){
  .lbKeyboardBindings{grid-template-columns:1fr}
  .lbKeyboardRow{grid-template-columns:minmax(120px,1fr) minmax(88px,auto)}
}

/* M3.48.78 — per-animation playback speed controls. */
.cwAnimationSpeedPanel{
  display:grid;
  gap:7px;
  margin:7px 0 10px;
  padding:9px;
  border:1px solid rgba(139,195,255,.26);
  border-radius:10px;
  background:rgba(7,18,34,.42);
}
.cwAnimationSpeedPanel > label{
  display:grid;
  gap:5px;
}
.cwAnimationSpeedPanel input[type="range"]{
  width:100%;
}
.cwAnimationSpeedExact{
  display:flex;
  align-items:end;
  gap:7px;
  flex-wrap:wrap;
}
.cwAnimationSpeedExact label{
  flex:1 1 125px;
  display:grid;
  gap:4px;
}
.cwAnimationSpeedExact input[type="number"]{
  width:100%;
}
.cwAnimationSpeedExact button{
  flex:0 0 auto;
}
#cwAnimationSpeedReadout{
  color:#bfe4ff;
  font-weight:700;
}


/* M3.48.83 — manual damage boxes plus automatic inset body-part box preview. */
.cwHitboxPanel{margin-top:10px;padding:10px;border:1px solid rgba(255,128,72,.35);border-radius:10px;background:rgba(45,18,13,.42)}
.cwHitboxActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:7px 0 10px}
.cwHitboxActions button{min-height:38px;white-space:normal}
.cwHitboxProperties{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.cwHitboxProperties label{min-width:0}
.cwHitboxProperties input[type=number],.cwHitboxProperties select{width:100%;min-height:38px}
.cwHitboxProperties label:nth-child(6){grid-column:1/-1}
.cwHitboxEnabled{display:flex!important;align-items:center;justify-content:space-between;gap:10px;min-height:40px;padding:7px 9px;border:1px solid rgba(255,255,255,.12);border-radius:7px}
.cwHitboxEnabled input{width:24px;height:24px}
.characterWorkshop.hitboxEditMode #cwCanvas{cursor:move;touch-action:none}
.characterWorkshop.hitboxEditMode .cwTimelineHint{border-color:rgba(255,128,72,.36)}
#cwHitboxMode.active{background:#a83e22;border-color:#ff9b69;color:#fff}
#cwHurtboxMode.active{background:#155b70;border-color:#72d8f1;color:#fff;box-shadow:0 0 0 2px rgba(114,216,241,.18) inset}
.characterWorkshop.hurtboxEditMode .cwHitboxPanel{border-color:rgba(91,216,244,.42);background:rgba(10,38,48,.5)}
.characterWorkshop.hurtboxEditMode .cwTimelineHint{border-color:rgba(91,216,244,.4)}
@media(max-width:760px){
 .cwHitboxPanel{padding:8px}
 .cwHitboxActions{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cwHitboxProperties{grid-template-columns:1fr 1fr}
 .cwHitboxActions button,.cwHitboxProperties input[type=number],.cwHitboxProperties select{min-height:44px}
}

/* M3.48.83 — phone layout for real damage-box editing. The normal inspector stays
   unchanged outside Hitbox mode; while editing boxes it becomes a full-width
   scroll section below a usable stage instead of covering most of the canvas. */
@media (max-width:500px){
  .characterWorkshop.hitboxEditMode .cwBody{
    grid-template-columns:76px minmax(0,1fr);
    grid-template-rows:minmax(300px,48vh) auto;
    overflow:auto;
  }
  .characterWorkshop.hitboxEditMode .cwSidebar{
    grid-column:1;
    grid-row:1;
    min-height:300px;
  }
  .characterWorkshop.hitboxEditMode .cwStageWrap{
    grid-column:2;
    grid-row:1;
    min-height:300px;
    margin-right:0;
  }
  .characterWorkshop.hitboxEditMode .cwInspector{
    position:relative;
    inset:auto;
    grid-column:1 / -1;
    grid-row:2;
    width:auto;
    max-height:none;
    opacity:1;
    border-left:0;
    border-top:1px solid #334055;
    padding:10px;
  }
  .characterWorkshop.hitboxEditMode .cwHitboxPanel{
    width:auto;
  }
  .characterWorkshop.hitboxEditMode .cwHitboxActions{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .characterWorkshop.hitboxEditMode .cwHitboxProperties{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* M3.48.88 — device-fit presets without transforming the document body.
   Phone mode uses a wide virtual viewport, so the existing tablet/desktop
   composition remains intact and naturally scales to the phone's real aspect. */
.lbDisplayPresetGrid{display:grid;grid-template-columns:minmax(220px,360px) 1fr;gap:12px;align-items:center}
.lbDisplayPresetGrid select{width:100%;padding:9px;border-radius:8px;background:#111a27;color:#fff;border:1px solid rgba(255,255,255,.2)}
.lbDisplayPresetReadout{color:rgba(235,245,255,.78);line-height:1.4}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .menuDropdown,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) #editorPanel,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .cwBody{font-size:12px}
@media(max-width:620px){.lbDisplayPresetGrid{grid-template-columns:1fr}}

/* M3.48.98 — phone-first Character Workshop trays.
   Tablet and PC layouts are unchanged. On phones the stage owns the workspace;
   build tools, animation settings, and the frame timeline open only on demand. */
.cwPhonePanelToggles{display:none}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop{
  font-size:10px;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwTopbar{
  flex:0 0 34px;
  height:34px;
  min-height:34px;
  gap:5px;
  padding:0 5px;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwTitleGroup{
  flex:0 0 auto;
  gap:4px;
  max-width:31%;
  white-space:nowrap;
  overflow:hidden;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwTitleGroup b{font-size:10px;letter-spacing:.02em}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwTopActions{
  min-width:0;
  flex:1 1 auto;
  justify-content:flex-start;
  gap:3px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwTopActions::-webkit-scrollbar{display:none}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwIcon{
  flex:0 0 auto;
  min-width:29px;
  min-height:27px;
  height:27px;
  padding:0 5px;
  border-radius:6px;
  font-size:10px;
  line-height:1;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwJsonFileButton{min-width:44px;font-size:8px;padding:0 4px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwWorkspaceTabs{
  flex:0 0 35px;
  min-height:35px;
  gap:4px;
  padding:3px 5px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  align-items:stretch;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwWorkspaceTabs::-webkit-scrollbar{display:none}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwWorkspaceTabs>button{
  flex:0 0 auto;
  min-width:78px;
  min-height:28px;
  padding:3px 8px;
  font-size:10px;
  border-radius:7px;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwPhonePanelToggles{
  display:flex;
  flex:0 0 auto;
  gap:4px;
  margin-left:auto;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwPhonePanelToggles button{
  min-width:72px;
  min-height:28px;
  padding:3px 7px;
  border:1px solid #41516a;
  border-radius:7px;
  background:#222d3e;
  color:#eef5ff;
  font-size:9px;
  white-space:nowrap;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwPhonePanelToggles button.active{background:#356fa8;border-color:#8acaff}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop.animateMode #cwPhoneTools{display:none}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop:not(.animateMode) #cwPhoneFrames{display:none}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwBody,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop.animateMode .cwBody{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:minmax(0,1fr)!important;
  min-height:0;
  overflow:hidden;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwStageWrap,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop.animateMode .cwStageWrap{
  grid-column:1!important;
  grid-row:1!important;
  display:block!important;
  min-width:0;
  min-height:0;
  width:100%;
  height:100%;
  margin:0!important;
  overflow:hidden;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop #cwCanvas,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop.animateMode #cwCanvas{
  display:block;
  width:100%!important;
  height:100%!important;
  min-width:0;
  min-height:0;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwSidebar,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwInspector{
  display:block!important;
  position:absolute!important;
  top:0!important;
  bottom:0!important;
  z-index:30;
  width:210px!important;
  max-width:72%;
  min-width:0;
  padding:7px!important;
  margin:0!important;
  overflow:auto;
  opacity:1!important;
  background:rgba(20,29,43,.985);
  box-shadow:0 0 26px rgba(0,0,0,.5);
  transition:transform .15s ease;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwSidebar{
  left:0!important;
  right:auto!important;
  border-right:1px solid #4b607c;
  transform:translateX(-105%);
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwInspector{
  left:auto!important;
  right:0!important;
  border-left:1px solid #4b607c;
  transform:translateX(105%);
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop.phoneToolsOpen .cwSidebar{transform:translateX(0)}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop.phoneInspectorOpen .cwInspector{transform:translateX(0)}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop.animateMode .cwBuildOnly{display:none!important}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwSectionTitle{font-size:9px;margin:6px 0 4px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwHint{font-size:9px;margin-top:7px;padding:6px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwInspector label{font-size:9px;margin:5px 0;gap:2px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwInspector input,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwInspector select{
  min-height:27px;
  padding:4px 5px;
  font-size:9px;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwInspector button,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwSidebar button{
  min-height:28px;
  min-width:28px;
  padding:4px 5px;
  font-size:9px;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwRigGrid,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwToolGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwRigGrid button{font-size:15px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwRigColorLegend{display:none}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwModelOpacity{padding:6px;margin-top:6px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwStageTools{
  left:4px!important;
  right:4px!important;
  top:4px!important;
  bottom:auto!important;
  z-index:18;
  flex-wrap:nowrap;
  gap:3px;
  max-width:calc(100% - 8px);
  padding:3px;
  overflow-x:auto;
  overflow-y:hidden;
  border:1px solid rgba(122,160,205,.25);
  border-radius:7px;
  background:rgba(15,24,38,.82);
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwStageTools::-webkit-scrollbar{display:none}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwStageTools button,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwStageTools select{
  flex:0 0 auto;
  min-width:29px;
  min-height:27px;
  height:27px;
  max-width:110px;
  padding:2px 6px;
  border-radius:6px;
  font-size:9px;
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwZoomReadout{flex:0 0 auto;font-size:8px;align-self:center}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop.animateMode .cwTimeline{
  display:none!important;
  position:absolute!important;
  left:4px!important;
  right:4px!important;
  bottom:4px!important;
  top:auto!important;
  z-index:35;
  width:auto!important;
  max-height:min(47%,310px)!important;
  margin:0!important;
  padding:6px;
  overflow:auto;
  background:rgba(18,27,41,.99);
  box-shadow:0 -8px 28px rgba(0,0,0,.48);
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop.animateMode.phoneTimelineOpen .cwTimeline{display:block!important}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwTimelineRow{gap:3px;flex-wrap:nowrap;overflow-x:auto}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwTimelineRow strong{font-size:9px;white-space:nowrap}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwTimeline button{min-width:27px;min-height:26px;font-size:9px;padding:2px 5px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwFrameStrip{padding:4px 1px 6px;gap:3px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwFrameStrip button{min-width:34px;flex-basis:34px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwBoneEdit{grid-template-columns:repeat(4,minmax(85px,1fr));gap:4px;overflow-x:auto}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwBoneEdit label{font-size:8px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwTimelineHint,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwLimbPoseStatus{display:none}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwAnimationSpeedPanel{padding:6px;gap:4px;margin:5px 0}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwHitboxPanel{padding:6px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwHitboxActions,
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwHitboxProperties{gap:4px}

/* M3.48.98 — complete phone workspace pass.
   The native phone viewport stays intact for reliable touch coordinates, but
   each major screen uses a compact tablet-like composition instead of stacking
   oversized mobile panels. */

/* Character Workshop drawers use body-backed state so switching between Create
   and Animate cannot leave the inspector translated offscreen. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lbCwPhoneToolsOpen .characterWorkshop .cwSidebar,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lbCwPhoneInspectorOpen .characterWorkshop .cwInspector{
  transform:translate3d(0,0,0)!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lbCwPhoneTimelineOpen .characterWorkshop.animateMode .cwTimeline{
  display:block!important;
  transform:translate3d(0,0,0)!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .characterWorkshop.animateMode .cwInspector{
  right:0!important;
  left:auto!important;
  top:0!important;
  bottom:0!important;
  width:min(250px,74vw)!important;
  max-width:none!important;
  margin:0!important;
  contain:layout paint;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .characterWorkshop .cwSidebar,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .characterWorkshop .cwInspector{
  will-change:transform;
}

/* Shared compact page chrome. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-active #lbPageBar{
  height:42px!important;
  min-height:42px!important;
  padding:3px 6px!important;
  gap:5px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-active #lbPageBack{
  min-height:34px!important;
  padding:4px 9px!important;
  border-radius:8px!important;
  font-size:12px!important;
  white-space:nowrap;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-active .lbBattleReportsBtn{
  min-height:32px!important;
  margin:0!important;
  padding:4px 9px!important;
  font-size:10px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-active .lbPageTitle{
  font-size:11px!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-active .lbPageStatus{
  max-width:36%;
  font-size:9px!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-character #characterWorkshop{
  inset:42px 0 0!important;
  top:42px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-active #lbSimplePage,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-active #lbBattleReportsPanel{
  inset:42px 0 0!important;
}

/* Main menu and settings: compact two-column cards rather than tall stacked
   phone buttons. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu{
  padding:7px!important;
  align-items:center!important;
  overflow:auto!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbMenuShell{
  width:min(98vw,620px)!important;
  max-height:96dvh!important;
  margin:0!important;
  padding:8px!important;
  overflow:auto!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbMenuTitle{
  margin:0 0 6px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbMenuTitle h1{
  font-size:24px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbMenuTitle p{display:none!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeGrid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeCard{
  min-height:58px!important;
  padding:7px 8px!important;
  gap:6px!important;
  border-radius:10px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeIcon{
  width:25px!important;
  font-size:20px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeCard b{font-size:12px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeCard small{display:none!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbMenuFooter{
  margin-top:5px!important;
  font-size:8px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbSimplePage{
  padding:8px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbSimplePage .lbSimpleInner{
  max-width:none!important;
  font-size:10px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbSimplePage h2{
  margin:4px 0 6px!important;
  font-size:18px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbSimplePage h3{
  margin:7px 0 4px!important;
  font-size:12px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbSimplePage button{
  margin:5px 0!important;
  padding:7px!important;
  min-height:32px!important;
  font-size:10px!important;
}

/* Battle setup, roster, stage select, and rules pages. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbBattleFlow{
  inset:42px 0 0!important;
  padding:6px 7px 12px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowShell{max-width:none!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowTop{
  gap:6px!important;
  margin:0 0 5px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowTop button,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowActions button{
  min-height:32px!important;
  padding:5px 9px!important;
  border-radius:8px!important;
  font-size:10px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowTop b{font-size:14px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowTop small{font-size:8px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowHeading{
  margin:3px 0 7px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowHeading h2{
  margin:0!important;
  font-size:17px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowHeading p{
  margin:2px auto!important;
  max-width:96%!important;
  font-size:9px!important;
  line-height:1.25!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbBattleSetupTools{
  justify-content:flex-start!important;
  flex-wrap:nowrap!important;
  gap:5px!important;
  max-width:none!important;
  margin:0 0 7px!important;
  overflow-x:auto!important;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbBattleSetupTools::-webkit-scrollbar{display:none}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbBattleSetupTools button{
  flex:0 0 auto!important;
  min-height:30px!important;
  padding:4px 8px!important;
  font-size:9px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbGameModeGrid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbGameMode{
  min-height:82px!important;
  padding:8px!important;
  gap:3px!important;
  border-radius:10px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbGameMode>span{font-size:23px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbGameMode b{font-size:12px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbGameMode small{font-size:8px!important;line-height:1.2!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbSmashRoster{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:5px!important;
  max-width:none!important;
  margin:0 auto 8px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbRosterPortrait{
  min-width:0!important;
  min-height:91px!important;
  padding:4px!important;
  gap:2px!important;
  border-width:2px!important;
  border-radius:8px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbRosterPortrait .lbPortraitCanvas{
  height:59px!important;
  min-height:59px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbRosterPortrait b{
  font-size:9px!important;
  line-height:1.05!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbPlayerSlots{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbPlayerCard{
  padding:6px!important;
  border-radius:9px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbPlayerPick{
  grid-template-columns:auto 40px minmax(0,1fr)!important;
  gap:4px!important;
  font-size:9px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbPlayerFaceCanvas{
  width:40px!important;
  height:38px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbPlayerCard label{
  margin-top:4px!important;
  font-size:8px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbPlayerCard select,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowField select{
  min-height:28px!important;
  padding:4px!important;
  font-size:9px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbFlowActions{
  position:sticky;
  bottom:0;
  z-index:5;
  margin-top:8px!important;
  padding:5px!important;
  background:rgba(12,20,36,.94);
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbStageGrid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:6px!important;
  margin:7px 0!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbStageCard{
  gap:3px!important;
  padding:5px!important;
  border-radius:8px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbStageCard b{font-size:9px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbStageCard small{font-size:7px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbStagePreview{
  grid-template-columns:minmax(0,2fr) minmax(80px,1fr)!important;
  gap:6px!important;
  padding:6px!important;
  border-radius:9px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbStagePreview b{font-size:10px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbStagePreview small{font-size:7px!important}

/* Map editor: one thin action rail and a shallower bottom tool sheet. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #app{
  inset:42px 0 0!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #lbPageActions{
  height:35px!important;
  gap:4px!important;
  padding:1px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #lbPageActions button,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #lbPageActions select{
  min-height:30px!important;
  height:30px!important;
  padding:3px 7px!important;
  font-size:9px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorDocked:not(.editorCollapsed){
  height:min(32dvh,360px)!important;
  max-height:36dvh!important;
  border-radius:9px 9px 0 0!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorPanelChrome{
  min-height:34px!important;
  height:34px!important;
  padding:3px 7px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorPanelTitle{font-size:10px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorPanelActions{
  gap:3px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorPanelActions button{
  min-height:27px!important;
  padding:2px 7px!important;
  font-size:9px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorPanelContent{
  padding:5px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorQuickRow{
  flex-wrap:nowrap!important;
  gap:4px!important;
  margin-bottom:4px!important;
  padding-bottom:4px!important;
  overflow-x:auto!important;
  scrollbar-width:none;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorQuickRow::-webkit-scrollbar{display:none}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorQuickRow>*{
  flex:0 0 auto!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .mapReferencePanel{
  margin:0 0 4px!important;
  padding:4px!important;
  font-size:8px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .creativeInventoryHeader{
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
  overflow-x:auto!important;
  padding:2px 0!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .iconToolRow,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .creativeCategoryTabs{
  flex:0 0 auto!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  gap:3px!important;
  padding:0!important;
  margin:0!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .iconOnly,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .creativeCategoryTabs button{
  width:29px!important;
  height:28px!important;
  min-width:29px!important;
  min-height:28px!important;
  padding:0!important;
  font-size:12px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .creativePages{
  padding:4px 0 10px!important;
}

/* Live battle: reclaim vertical room from the two top bars. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #topbar{
  top:42px!important;
  height:34px!important;
  min-height:34px!important;
  max-height:34px!important;
  padding:2px 5px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #app{
  inset:76px 0 0!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #toolbarDrawer{
  min-height:30px!important;
  height:30px!important;
  max-height:30px!important;
  gap:3px!important;
  padding:0!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  flex-wrap:nowrap!important;
  scrollbar-width:none;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #toolbarDrawer::-webkit-scrollbar{display:none}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #toolbarDrawer summary,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #toolbarDrawer>button,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #lbSharedViewQuickActions button{
  min-height:28px!important;
  height:28px!important;
  padding:3px 7px!important;
  font-size:9px!important;
  white-space:nowrap!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #menuBuildBadge{display:none!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #hud{
  top:3px!important;
  padding:0 5px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #fighterHudGrid{
  gap:2px 4px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #fighterHudGrid .fighterHud{
  padding:2px 3px!important;
  gap:2px!important;
  border-radius:6px!important;
  font-size:8px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #fighterHudGrid .fighterHud span:nth-child(2){font-size:12px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #testClock{
  top:7px!important;
  font-size:20px!important;
  padding:2px 7px!important;
}

/* Clean analog joystick. The eight invisible directional hit regions remain in
   place for the existing movement code, but the player sees one base and one
   thumb stick instead of nine overlapping circles. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster{
  width:136px!important;
  height:136px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at 42% 38%,rgba(92,133,173,.22),rgba(22,34,50,.58) 64%,rgba(8,14,23,.68))!important;
  border:2px solid rgba(181,218,247,.28)!important;
  box-shadow:inset 0 0 0 10px rgba(12,24,39,.18),0 5px 17px rgba(0,0,0,.25)!important;
  transform:scale(var(--user-scale))!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster::before{
  content:"";
  position:absolute;
  inset:17px;
  border-radius:50%;
  border:1px solid rgba(196,226,250,.18);
  background:radial-gradient(circle,rgba(120,177,222,.08),rgba(13,25,40,.18));
  pointer-events:none;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  padding:0!important;
  opacity:0!important;
  color:transparent!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir-up{left:46px!important;top:0!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir-up-right{right:8px!important;top:8px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir-right{right:0!important;top:46px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir-down-right{right:8px!important;bottom:8px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir-down{left:46px!important;bottom:0!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir-down-left{left:8px!important;bottom:8px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir-left{left:0!important;top:46px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir-up-left{left:8px!important;top:8px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .dpadCenter{
  left:50%!important;
  top:50%!important;
  width:52px!important;
  height:52px!important;
  margin:0!important;
  border:2px solid rgba(231,246,255,.62)!important;
  background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.6),rgba(95,157,207,.82) 42%,rgba(31,55,80,.96))!important;
  transform:translate(calc(-50% + var(--stick-x,0px)),calc(-50% + var(--stick-y,0px)))!important;
  box-shadow:0 4px 11px rgba(0,0,0,.42),inset 0 1px 4px rgba(255,255,255,.38)!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster.joystick-active .dpadCenter{
  transition:none!important;
}
@media (orientation:portrait){
  :is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .rightCluster button{
    width:54px!important;
    height:48px!important;
    font-size:8px!important;
  }
  :is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .controlIcon{font-size:20px!important}
  :is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .controlText{font-size:7px!important}
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorQuickRow>button,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .editorQuickRow>.mapCapacityBadge{
  min-height:28px!important;
  height:28px!important;
  padding:3px 7px!important;
  font-size:9px!important;
  line-height:1!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .mapEditorZoomControls{
  flex:0 0 auto!important;
  height:28px!important;
  gap:3px!important;
  flex-wrap:nowrap!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .mapEditorZoomControls button{
  min-height:28px!important;
  height:28px!important;
  padding:2px 6px!important;
  font-size:9px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .mapEditorZoomControls label,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel .mapEditorZoomControls input{
  display:none!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .dir{
  transition:none!important;
}


/* STREETMADE M3.48.107 — unified hideable touch controls and editor panels. */
.lbTouchVisibilityToggle{position:fixed;right:max(8px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));z-index:10020;min-height:38px;padding:7px 10px;border-radius:10px;background:rgba(15,28,45,.9);color:#eef8ff;border:1px solid #6abaff;box-shadow:0 5px 18px rgba(0,0,0,.4)}
body.lbTouchControlsHidden #touchControls,body.lbTouchControlsHidden #topTouchControls{display:none!important}
.characterWorkshop.cwPanelsCollapsed .cwSidebar,.characterWorkshop.cwPanelsCollapsed .cwInspector{display:none!important}.characterWorkshop.cwPanelsCollapsed .cwBody{grid-template-columns:minmax(0,1fr)!important}.characterWorkshop.cwPanelsCollapsed .cwStageWrap{grid-column:1!important}
.characterWorkshop.cwTouchUiHidden .cwTouchTransform{display:none!important}
.cwTouchTransform{position:absolute;right:10px;bottom:10px;z-index:80;width:min(255px,43vw);padding:8px;border:1px solid rgba(105,188,255,.7);border-radius:12px;background:rgba(13,25,41,.94);box-shadow:0 10px 28px rgba(0,0,0,.42);color:#eef8ff;touch-action:manipulation;user-select:none}
.cwTouchHead{display:grid;grid-template-columns:auto 1fr auto;gap:6px;align-items:center;margin-bottom:6px}.cwTouchHead span{font-size:10px;color:#bfd7ea;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cwTouchHead button{min-width:30px;padding:3px}
.cwTouchStep{display:flex!important;align-items:center;gap:6px;margin:0 0 5px!important}.cwTouchStep select{width:64px;margin:0!important;padding:3px!important}.cwTouchMove{display:grid;grid-template-columns:repeat(3,40px);justify-content:center;gap:4px;margin-bottom:5px}.cwTouchMove button{height:37px;padding:0;font-size:19px;font-weight:900}.cwTouchRows{display:grid;grid-template-columns:1fr 38px 38px;gap:4px;align-items:center}.cwTouchRows span{font-size:10px;font-weight:800}.cwTouchRows button{min-height:31px;padding:2px;font-size:16px;font-weight:900}.cwTouchTransform.collapsed{width:auto}.cwTouchTransform.collapsed>:not(.cwTouchHead){display:none}.cwTouchTransform.collapsed .cwTouchHead{margin:0}.cwTouchTransform.collapsed .cwTouchHead span{display:none}
.characterWorkshop.cwAnimateWorkspace .cwBuildWidget{display:none!important}
.cwShapeLibrary button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:49px;font-size:18px}.cwShapeLibrary button span{font-size:9px;font-weight:700;line-height:1.05}
.cwStageTools .cwEyedropper.active{background:#216fa8!important;border-color:#8bd4ff!important;box-shadow:0 0 0 2px rgba(91,190,255,.22)}
.cwInspector .cwEyedropper{display:none!important}
@media(max-width:760px){.cwTouchTransform{right:5px;bottom:5px;width:210px;max-height:64vh;overflow:auto;padding:6px}.cwTouchMove{grid-template-columns:repeat(3,36px)}.cwTouchMove button{height:33px}.cwTouchRows{grid-template-columns:1fr 34px 34px}.lbTouchVisibilityToggle{font-size:10px;min-height:31px;padding:4px 7px}}
body.lbEditorPanelsHidden.lb-page-map #toolbarDrawer,body.lbEditorPanelsHidden.lb-page-map #editorPanel{display:none!important}


/* STREETMADE M3.48.108 — direct canvas handles and edge-nub drawers. */
.cwTouchTransform{display:none!important}
.characterWorkshop .cwBody,.characterWorkshop.animateMode .cwBody{position:relative!important;display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important;overflow:hidden!important}
.characterWorkshop .cwStageWrap,.characterWorkshop.animateMode .cwStageWrap{grid-column:1!important;grid-row:1!important;width:100%!important;height:100%!important;margin:0!important}
.characterWorkshop .cwSidebar,.characterWorkshop .cwInspector{display:block!important;position:absolute!important;top:0!important;bottom:0!important;z-index:75!important;width:min(255px,78vw)!important;max-width:none!important;height:auto!important;margin:0!important;padding:10px!important;overflow:auto!important;overflow-x:visible!important;background:rgba(23,31,44,.985)!important;box-shadow:0 0 28px rgba(0,0,0,.48)!important;transition:transform .2s ease!important;will-change:transform}
.characterWorkshop .cwSidebar{left:0!important;right:auto!important;border-right:1px solid #516783!important;transform:translate3d(0,0,0)!important}
.characterWorkshop .cwInspector{right:0!important;left:auto!important;border-left:1px solid #516783!important;transform:translate3d(0,0,0)!important}
.characterWorkshop.cwToolsDrawerClosed .cwSidebar{transform:translate3d(-100%,0,0)!important}
.characterWorkshop.cwInspectorDrawerClosed .cwInspector{transform:translate3d(100%,0,0)!important}
.characterWorkshop.cwPanelsCollapsed .cwSidebar,.characterWorkshop.cwPanelsCollapsed .cwInspector{display:block!important}
.editorDrawerNub{position:absolute!important;z-index:95!important;width:35px!important;height:70px!important;min-width:35px!important;padding:0!important;border:1px solid #6dbdff!important;background:rgba(17,34,55,.98)!important;color:#fff7ad!important;font-size:25px!important;font-weight:900!important;box-shadow:0 5px 16px rgba(0,0,0,.4)!important;touch-action:manipulation!important}
.cwToolsDrawerNub{right:-35px!important;left:auto!important;top:42%!important;border-left:0!important;border-radius:0 12px 12px 0!important}
.cwInspectorDrawerNub{left:-35px!important;right:auto!important;top:42%!important;border-right:0!important;border-radius:12px 0 0 12px!important}
@media(max-width:760px){.characterWorkshop .cwSidebar,.characterWorkshop .cwInspector{width:min(230px,82vw)!important}.editorDrawerNub{width:31px!important;min-width:31px!important;height:62px!important;font-size:22px!important}.cwToolsDrawerNub{right:-31px!important}.cwInspectorDrawerNub{left:-31px!important}}

.characterWorkshop .cwSidebar,.characterWorkshop .cwInspector{overflow:visible!important}.characterWorkshop .editorDrawerScroll{height:100%;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}

/* M3.48.108 compact-device drawer authority. */
#cwPhoneTools,#cwPhoneControls{display:none!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body .characterWorkshop.cwToolsDrawerClosed .cwSidebar{transform:translate3d(-100%,0,0)!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body .characterWorkshop.cwInspectorDrawerClosed .cwInspector{transform:translate3d(100%,0,0)!important}


/* STREETMADE M3.48.115 — resizable bottom-docked map tools; floating removed. */
body.lb-page-map #editorPanel{
  display:flex!important;
  position:fixed!important;
  left:0!important;right:0!important;bottom:0!important;top:auto!important;
  width:100%!important;min-width:0!important;max-width:none!important;
  height:var(--streetmade-map-panel-height,min(44vh,520px))!important;max-height:72vh!important;min-height:120px!important;
  margin:0!important;padding:0!important;
  border-radius:12px 12px 0 0!important;
  transform:none!important;overflow:hidden!important;
  z-index:90!important;box-shadow:0 -12px 30px rgba(0,0,0,.42)!important;
}
body.lb-page-map #editorPanel.editorCollapsed{height:auto!important}
body.lb-page-map #editorPanel .editorPanelContent{flex:1 1 auto!important;min-height:0!important;overflow:auto!important}
body.lb-page-map #editorDockBottom,body.lb-page-map #editorFloat,.mapDrawerNub{display:none!important}
body.lb-page-map.lbMapDrawerClosed #editorPanel{transform:none!important}
@media(max-width:760px){body.lb-page-map #editorPanel{height:var(--streetmade-map-panel-height,min(46vh,480px))!important;max-height:76vh!important}}

/* STREETMADE M3.48.135P5P43 — let the phone drawer resize handle travel all the way down. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorDocked:not(.editorCollapsed){
  min-height:44px!important;
}

/* STREETMADE M3.48.135P5P42 — phone map drawer can collapse to a tiny restore pill so the lower left rail stays visible. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorCollapsed{
  height:18px!important;min-height:18px!important;max-height:18px!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  overflow:visible!important;pointer-events:none!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorCollapsed>.editorDockResizeHandle,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorCollapsed .editorPanelTitle,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorCollapsed .editorPanelActions button:not(#editorMinimize){display:none!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorCollapsed .editorPanelChrome{
  min-height:18px!important;height:18px!important;padding:0!important;border:0!important;
  background:transparent!important;justify-content:center!important;cursor:default!important;pointer-events:none!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorCollapsed .editorPanelActions{display:flex!important;gap:0!important;pointer-events:auto!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorCollapsed #editorMinimize{
  pointer-events:auto!important;width:68px!important;min-width:68px!important;height:18px!important;min-height:18px!important;
  padding:0!important;border-radius:12px 12px 0 0!important;border:1px solid rgba(186,214,239,.65)!important;
  background:rgba(28,39,56,.96)!important;color:transparent!important;box-shadow:0 -2px 8px rgba(0,0,0,.28)!important;
  position:relative!important;overflow:hidden!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-map #editorPanel.editorCollapsed #editorMinimize::before{
  content:'▴';position:absolute;inset:0;display:grid;place-items:center;color:#dbeafe;font-size:13px;line-height:1;
}


/* M3.48.115 map-panel authority. */
body.lb-page-map #editorPanel>.editorDockResizeHandle{display:block!important;pointer-events:auto!important;touch-action:none!important;z-index:130!important}
body.lb-page-map #editorFloat,body.lb-page-map #editorDockBottom{display:none!important}


/* STREETMADE M3.48.115 — clean Workshop hub and compact victory showcase. */
.characterWorkshop .cwWorkspace.hidden{display:none!important}
.characterWorkshop .cwHomeScreen.hidden{display:none!important}
.characterWorkshop.cwHomeMode .cwTopActions .cwIcon:not(#cwClose){display:none!important}
.characterWorkshop.cwHomeMode .cwWorkspaceTabs{display:none!important}
.characterWorkshop.cwHomeMode .cwHomeScreen{display:grid!important}
.characterWorkshop.cwHomeMode .cwBody{display:none!important}
.characterWorkshop.cwHomeMode .editorDrawerNub{display:none!important}
body.lb-page-battle.lb-battle-results #testSessionOverlay{display:none!important}
body.lb-page-battle.lb-battle-results #hud,
body.lb-page-battle.lb-battle-results #testClock{display:none!important}
.lbMatchResultShowcase{position:absolute;inset:0;z-index:4850;pointer-events:none;display:flex;align-items:flex-end;justify-content:center;padding:18px 18px max(18px,env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent 0 52%,rgba(3,7,15,.12) 68%,rgba(3,7,15,.64) 100%)}
.lbMatchResultShowcase.hidden{display:none!important}
.lbMatchResultCard{pointer-events:auto;width:min(760px,94vw);display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;border:1px solid rgba(137,206,255,.56);border-radius:17px;background:linear-gradient(180deg,rgba(19,31,50,.93),rgba(9,16,29,.96));box-shadow:0 18px 55px rgba(0,0,0,.48);backdrop-filter:blur(8px);color:#fff}
.lbMatchResultCopy{min-width:0}.lbMatchResultEyebrow{font-size:11px;letter-spacing:.18em;font-weight:900;color:#83dbff}.lbMatchResultCard h1{margin:3px 0 4px;font-size:clamp(25px,5vw,42px);line-height:1}.lbMatchResultCard p{margin:0;color:#dbe7f8;font-weight:700}.lbMatchResultMeta{margin-top:5px;color:#9fb2cc;font-size:13px}.lbMatchResultActions{display:flex;gap:8px;flex:0 0 auto}.lbMatchResultActions button{min-height:44px;padding:9px 15px;border-radius:10px;font-weight:900}.lbMatchResultActions .primary{background:#397cc2;border-color:#72b7f3}
@media(max-width:680px){.lbMatchResultShowcase{padding:10px 10px max(10px,env(safe-area-inset-bottom))}.lbMatchResultCard{display:block;padding:13px 14px}.lbMatchResultActions{margin-top:11px;display:grid;grid-template-columns:1.25fr 1fr 1fr}.lbMatchResultActions button{padding:8px 9px}.lbMatchResultMeta{font-size:12px}}


/* Streetmade M3.48.115 — large live idle-animation portraits on fighter select. */
.lbSmashRoster{grid-template-columns:repeat(auto-fill,minmax(124px,1fr));max-width:1040px}
.lbRosterPortrait{min-height:166px;padding:7px;gap:4px}
.lbPortraitCanvas{height:124px;background:linear-gradient(180deg,rgba(105,150,200,.19),rgba(20,32,52,.06));box-shadow:inset 0 0 0 1px rgba(130,185,235,.09)}
.lbRosterPortrait b{font-size:13px}
.lbPlayerPick{grid-template-columns:auto 72px minmax(0,1fr)}
.lbPlayerFaceCanvas{width:72px;height:66px}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbRosterPortrait{min-height:123px!important;padding:4px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbRosterPortrait .lbPortraitCanvas{height:91px!important;min-height:91px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbRosterPortrait b{font-size:10px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbPlayerPick{grid-template-columns:auto 50px minmax(0,1fr)!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) .lbPlayerFaceCanvas{width:50px!important;height:46px!important}


/* STREETMADE M3.48.118 — Character Workshop left quick colors, eyedropper and shape picker. */
.cwQuickRail{
 position:absolute;left:8px;top:12px;z-index:68;
 display:flex;flex-direction:column;align-items:center;gap:5px;
 width:46px;padding:5px 4px;border:1px solid rgba(111,188,255,.68);
 border-radius:12px;background:rgba(12,24,39,.94);box-shadow:0 8px 24px rgba(0,0,0,.34);
 backdrop-filter:blur(5px);touch-action:manipulation;user-select:none;
}
.cwQuickColorTarget{display:grid;grid-template-columns:1fr 1fr;gap:2px;width:100%}
.cwQuickColorTarget button,.cwQuickIcon{
 min-width:0!important;width:100%;height:36px;min-height:36px!important;padding:0!important;
 display:grid;place-items:center;border-radius:8px!important;font-size:20px!important;line-height:1!important;
 border:1px solid #41516a;background:#222d3e;color:#eef5ff;
}
.cwQuickColorTarget button{height:27px;min-height:27px!important;font-size:16px!important}
.cwQuickColorTarget button.active,.cwQuickIcon.active{background:#236ca8!important;border-color:#8bd2ff!important;color:#fff!important;outline:1px solid rgba(139,210,255,.55)}
.cwQuickSwatches{display:flex;flex-direction:column;align-items:center;gap:4px;max-height:calc(100dvh - 285px);overflow-y:auto;overflow-x:hidden;padding:1px;scrollbar-width:none}
.cwQuickSwatches::-webkit-scrollbar{display:none}
.cwQuickSwatches button{
 position:relative;flex:0 0 auto;width:31px!important;height:31px!important;min-width:31px!important;min-height:31px!important;padding:0!important;
 border-radius:8px!important;border:2px solid rgba(255,255,255,.42)!important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.28),0 1px 3px rgba(0,0,0,.35);
}
.cwQuickSwatches button.active{border-color:#fff!important;box-shadow:0 0 0 2px #55b9ff,inset 0 0 0 1px rgba(0,0,0,.28)!important}
.cwQuickSwatches button.active::after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-weight:1000;font-size:18px;text-shadow:0 1px 3px #000,0 0 2px #000}
.cwQuickIcon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cwQuickShapePalette{
 position:absolute;left:61px;top:12px;z-index:69;width:min(285px,calc(100% - 78px));max-height:calc(100% - 24px);
 overflow:hidden;border:1px solid rgba(111,188,255,.72);border-radius:13px;background:rgba(14,27,44,.985);
 box-shadow:0 14px 34px rgba(0,0,0,.48);color:#eef7ff;touch-action:pan-y;
}
.cwQuickShapePalette[hidden]{display:none!important}
.cwQuickShapeHead{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 9px;border-bottom:1px solid #30445f;background:#18263a}
.cwQuickShapeHead button{min-width:32px!important;width:32px;height:32px;min-height:32px!important;padding:0!important;font-size:22px!important;border:1px solid #41516a;border-radius:8px;background:#222d3e;color:#eef5ff}
.cwQuickShapeGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:7px;max-height:calc(100dvh - 190px);overflow:auto;-webkit-overflow-scrolling:touch}
.cwQuickShapeGrid button{min-width:0!important;min-height:58px!important;padding:5px 3px!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid #41516a;border-radius:8px!important;background:#222d3e;color:#eef5ff}
.cwQuickShapeGrid button span{font-size:22px;line-height:1}.cwQuickShapeGrid button small{font-size:9px;color:#d8e8f8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.characterWorkshop.cwTouchUiHidden .cwQuickRail,.characterWorkshop.cwTouchUiHidden .cwQuickShapePalette{display:none!important}
.characterWorkshop .cwStageTools .cwEyedropper{display:none!important}
.characterWorkshop.animateMode .cwQuickRail,.characterWorkshop.animateMode .cwQuickShapePalette{display:none!important}
@media(max-width:780px){
 .cwQuickRail{left:5px;top:8px;width:42px;padding:4px 3px;gap:4px}
 .cwQuickSwatches button{width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important}
 .cwQuickColorTarget button{height:25px;min-height:25px!important}.cwQuickIcon{height:33px;min-height:33px!important}
 .cwQuickShapePalette{left:52px;top:8px;width:min(250px,calc(100% - 62px));max-height:calc(100% - 16px)}
 .cwQuickShapeGrid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:calc(100dvh - 160px)}
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .cwQuickRail{top:6px;left:4px;width:38px;padding:3px 2px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .cwQuickSwatches{max-height:calc(100dvh - 245px);gap:3px}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .cwQuickSwatches button{width:25px!important;height:25px!important;min-width:25px!important;min-height:25px!important;border-radius:6px!important}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .cwQuickIcon{height:30px;min-height:30px!important;font-size:17px!important}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .cwQuickShapePalette{left:46px;top:6px;width:min(230px,calc(100% - 54px));max-height:calc(100% - 12px)}


/* STREETMADE M3.48.120 — Character Create bottom tool rail and no left drawer. */
.characterWorkshop:not(.animateMode) .cwSidebar,
.characterWorkshop:not(.animateMode) #cwToolsDrawerNub{display:none!important}
.characterWorkshop:not(.animateMode) .cwStageWrap{margin-left:0!important}
.cwBuildBottomTools{
 position:absolute;left:8px;right:8px;bottom:8px;z-index:72;
 display:flex;align-items:stretch;gap:5px;padding:5px;
 overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;
 border:1px solid rgba(118,171,224,.5);border-radius:10px;
 background:rgba(14,24,39,.92);box-shadow:0 7px 22px rgba(0,0,0,.35);
 backdrop-filter:blur(5px);touch-action:pan-x;overscroll-behavior-x:contain;
}
.cwBuildBottomTools::-webkit-scrollbar{display:none}
.cwBuildBottomTools .cwBottomRigPresets{
 display:flex!important;grid-template-columns:none!important;align-items:stretch;gap:4px;flex:0 0 auto;
}
.cwBuildBottomTools .cwBottomRigPresets button,
.cwBuildBottomTools .cwBottomToolButton{
 flex:0 0 auto;min-width:62px!important;height:48px!important;min-height:48px!important;
 padding:4px 6px!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:1px;
 border:1px solid #41516a;border-radius:8px;background:#222d3e;color:#eef5ff;font-size:17px!important;line-height:1!important;
}
.cwBuildBottomTools .cwBottomRigPresets button span,
.cwBuildBottomTools .cwBottomToolButton small{display:block!important;margin:0!important;font-size:9px!important;line-height:1.05!important;color:#dce9f8;white-space:nowrap}
.cwBuildBottomTools .cwBottomRigPresets button.active,
.cwBuildBottomTools .cwBottomToolButton.active{outline:2px solid #7fc8ff;background:#304762}
.cwBuildBottomTools #cwEditRig.active{background:#ffe27a!important;color:#17130a!important;border-color:#fff0a8!important}
.cwBuildBottomTools .cwBottomOpacity{
 flex:0 0 190px;min-width:190px;margin:0!important;padding:5px 8px!important;
 display:grid!important;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:7px;row-gap:2px;
 align-content:center;border:1px solid #41516a;border-radius:8px;background:#202a39;color:#dce9f8;font-size:10px!important;
}
.cwBuildBottomTools .cwBottomOpacityLabel{grid-column:1;grid-row:1;color:#dce9f8;font-weight:800;white-space:nowrap}
.cwBuildBottomTools .cwBottomOpacity span:not(.cwBottomOpacityLabel){grid-column:2;grid-row:1;color:#9ee3ff}
.cwBuildBottomTools .cwBottomOpacity input{grid-column:1 / -1;grid-row:2;width:100%;margin:0;padding:0}
.characterWorkshop:not(.animateMode) .cwStageTools{bottom:72px!important}
.characterWorkshop.animateMode .cwBuildBottomTools{display:none!important}

/* Lower the quick color rail enough to clear the compact stage toolbar. */
@media(max-width:780px){
 .characterWorkshop:not(.animateMode) .cwQuickRail{top:48px!important}
 .characterWorkshop:not(.animateMode) .cwQuickShapePalette{top:48px!important}
 .cwBuildBottomTools{left:4px;right:4px;bottom:4px;gap:3px;padding:4px;border-radius:8px}
 .cwBuildBottomTools .cwBottomRigPresets{gap:3px}
 .cwBuildBottomTools .cwBottomRigPresets button,
 .cwBuildBottomTools .cwBottomToolButton{min-width:54px!important;height:42px!important;min-height:42px!important;padding:3px 5px!important;font-size:15px!important}
 .cwBuildBottomTools .cwBottomOpacity{flex-basis:150px;min-width:150px;padding:4px 6px!important}
 .characterWorkshop:not(.animateMode) .cwStageTools{bottom:auto!important}
}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop:not(.animateMode) .cwQuickRail{top:45px!important}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop:not(.animateMode) .cwQuickShapePalette{top:45px!important}


/* STREETMADE M3.48.124 — animation action is always accessible from the open editor toolbar. */
.cwAnimActionDock{display:none;align-items:center;gap:6px;margin:0;padding:0 6px;height:42px;flex:0 0 auto;border:1px solid #41516a;border-radius:8px;background:#1c2a3e;color:#dce9f8;font-size:11px;font-weight:800}
.characterWorkshop.animateMode .cwStageTools .cwAnimActionDock{display:flex!important}
.characterWorkshop.animateMode .cwStageTools .cwAnimActionDock #cwAnimAction{display:block!important;width:auto!important;min-width:150px!important;max-width:220px!important;height:34px!important;min-height:34px!important;margin:0!important;padding:4px 28px 4px 8px!important;background:#222d3e;color:#eef5ff;border:1px solid #41516a;border-radius:7px}
@media(max-width:600px){.cwAnimActionDock{height:38px;padding:0 4px}.cwAnimActionDock>span{display:none}.characterWorkshop.animateMode .cwStageTools .cwAnimActionDock #cwAnimAction{min-width:132px!important;max-width:165px!important;height:32px!important;min-height:32px!important;font-size:12px!important}}

/* M3.48.124 editor mouse navigation */
#cwCanvas.cwCameraPanning{cursor:grabbing!important}

/* M3.48.134 — real procedural thumbnails in Character Create's shape picker. */
.cwQuickShapeGrid button .shapePreviewCanvas{display:block;width:48px;height:38px;max-width:78%;flex:0 0 auto;pointer-events:none}
.cwQuickShapeGrid button small{margin-top:1px}


/* M3.48.135 — editor strips own their scroll gestures. Reaching either end
   cannot chain into side drawers or the page. */
.characterWorkshop .cwStageTools,
.characterWorkshop .cwBuildBottomTools,
.characterWorkshop .cwTopActions,
.characterWorkshop .cwTimelineRow,
.characterWorkshop .cwFrameStrip,
.characterWorkshop .cwBoneEdit,
#toolbarDrawer,
.stageTools{
  overscroll-behavior-x:contain!important;
}
.characterWorkshop .cwStageTools,
.characterWorkshop .cwBuildBottomTools,
.characterWorkshop .cwTopActions,
.characterWorkshop .cwTimelineRow,
.characterWorkshop .cwFrameStrip,
.characterWorkshop .cwBoneEdit{
  touch-action:pan-x!important;
}
.characterWorkshop .editorDrawerScroll,
.characterWorkshop .cwInspector,
#editorPanel{
  overscroll-behavior-y:contain!important;
}
/* M3.48.135 — drawers are controlled only by their edge nubs. Keeping the old
   Panels buttons out of scrolling toolbars prevents an accidental scroll/tap
   at the end of a tool strip from toggling a drawer. */
#cwPanelsToggle,#assetPanelsToggle{display:none!important}

/* M3.48.135P4 — transform/snap buttons stay in one swipeable Create toolbar. */
.characterWorkshop:not(.animateMode) .cwStageTools{flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;max-width:calc(100% - 20px)!important;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.characterWorkshop:not(.animateMode) .cwStageTools>*{flex:0 0 auto!important}

/* STREETMADE M3.48.135P5 — compact Character Create Pen / Edit Nodes UI. */
.characterWorkshop .cwPathToolbar{position:absolute;z-index:74;top:10px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:5px;max-width:calc(100% - 130px);padding:5px 7px;border:1px solid #4d6c8c;border-radius:10px;background:rgba(13,27,44,.96);box-shadow:0 8px 20px rgba(0,0,0,.35);overflow-x:auto;overflow-y:hidden;white-space:nowrap;touch-action:pan-x;overscroll-behavior-x:contain}
.characterWorkshop .cwPathToolbar[hidden]{display:none!important}.characterWorkshop .cwPathToolbar b{font-size:10px;color:#bfe7ff;flex:0 0 auto}.characterWorkshop .cwPathToolbar button{flex:0 0 auto;min-height:36px!important;padding:5px 8px!important}.characterWorkshop .cwEditNodes{width:100%;margin:0 0 7px;border:1px solid #6ebfe8;border-radius:8px;background:#173854;color:#eef8ff;min-height:38px}.characterWorkshop #cwColor:disabled{opacity:.42;cursor:not-allowed}
@media(max-width:760px){.characterWorkshop .cwPathToolbar{top:5px;left:48px;right:5px;transform:none;max-width:none;padding:4px}.characterWorkshop .cwPathToolbar button{min-height:38px!important}.characterWorkshop .cwPathToolbar b{font-size:9px}}
:where(html[data-lb-display-profile="phone"],html.lbCompactEditor) .characterWorkshop .cwPathToolbar{top:4px;left:43px;right:4px}

/* M3.48.135P5P7 — paint-style draw and eraser cursors */
.streetmadeEraserCursor{position:fixed;z-index:2147483000;pointer-events:none;user-select:none;font-size:24px;line-height:1;filter:drop-shadow(0 1px 1px rgba(0,0,0,.65));transform:rotate(-18deg)}
.characterWorkshop.effectEraseMode #cwCanvas{cursor:none!important}
#cwCreateEraser.active,#cwQuickEraser.active,#cwToolGrid [data-shape].active,.cwQuickShapeGrid [data-cw-quick-shape].active{outline:2px solid #8bd4ff!important;outline-offset:1px}

/* STREETMADE M3.48.135P5P8 — primitive style controls shared by Character Create. */
.cwShapeStyleRow{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 8px}
.cwQuickShapePalette .cwShapeStyleRow{padding:7px 8px;margin:0;border-bottom:1px solid rgba(255,255,255,.12)}
.cwShapeStyleRow button{flex:1 1 72px;min-height:34px}
.cwShapeStyleRow button.active{outline:2px solid #ffe57a;outline-offset:-2px}

/* M3.48.135P5P9 — compact character custom paint popover. */
.cwPaintPopover{position:absolute;left:70px;top:72px;z-index:73;width:min(300px,calc(100% - 88px));padding:10px;border:1px solid rgba(120,170,220,.34);border-radius:12px;background:rgba(12,27,44,.97);box-shadow:0 10px 28px rgba(0,0,0,.28);color:#eef6ff}
.cwPaintPopover[hidden]{display:none!important}.cwPaintHead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.cwPaintHead button{min-width:34px}.cwPaintModes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:9px}.cwPaintModes button.active{outline:2px solid #ffe57a}.cwPaintColors{display:grid;grid-template-columns:1fr 1fr;gap:8px}.cwPaintColors label,.cwPaintPopover>label{display:flex;align-items:center;justify-content:space-between;gap:8px}.cwPaintColors input[type=color]{width:54px;min-width:54px;height:36px;padding:2px}.cwPaintPopover input[type=range]{width:150px;max-width:55%}#cwPaintInspector{width:100%;margin:6px 0 2px}

/* M3.48.135P5P11 — direct custom-color pickers in Character Create and Animate Effects. */
.cwQuickCustomColor{position:relative;display:block;flex:0 0 auto;width:33px;height:33px;margin:0;padding:0;border-radius:9px;background:conic-gradient(#ff4d4d,#ffd84d,#63d55e,#49c9e8,#6d79ff,#d15ee8,#ff4d4d);box-shadow:0 0 0 1px rgba(255,255,255,.42),0 1px 3px rgba(0,0,0,.35);overflow:hidden}
.cwQuickCustomColor input[type=color]{position:absolute;inset:3px;width:27px;height:27px;min-width:0;min-height:0;margin:0;padding:0;border:2px solid #132033;border-radius:6px;background:transparent;cursor:pointer}
.cwQuickCustomColor input[type=color]::-webkit-color-swatch-wrapper{padding:0}.cwQuickCustomColor input[type=color]::-webkit-color-swatch{border:0;border-radius:4px}.cwQuickCustomColor input[type=color]::-moz-color-swatch{border:0;border-radius:4px}
.cwQuickCustomColor::after{content:'+';position:absolute;right:1px;bottom:-2px;pointer-events:none;color:white;font:bold 12px/1 system-ui;text-shadow:0 1px 3px #000}
.cwEffectQuickColor{display:flex!important;align-items:center;justify-content:center;gap:5px;min-height:38px;padding:4px 7px!important;border:1px solid #41516a;border-radius:8px;background:#222d3e;color:#eef5ff;font-weight:800}
.cwEffectQuickColor input[type=color]{width:38px;height:28px;min-width:38px;min-height:28px;padding:1px;border:1px solid #657996;border-radius:6px;background:#172337}
@media(max-width:430px){.cwEffectQuickColor{min-height:40px}.cwEffectQuickColor input[type=color]{width:44px;height:30px}}

/* STREETMADE M3.48.135P5P16 — Pen paths can switch Solid / Ring / Line in Edit Nodes. */
.characterWorkshop .cwPathToolbar button.pathStyleActive{outline:2px solid #ffe57a!important;outline-offset:-2px;background:#29445f!important}
.characterWorkshop .cwPathToolbar button:disabled{opacity:.42;cursor:not-allowed}

/* P5P16 bucket modes */
.characterWorkshop.effectBucketMode #cwCanvas{cursor:default}

/* STREETMADE M3.48.135P5P23 — precision native arrow cursor for animation-effect Bucket. */
.characterWorkshop.effectBucketMode #cwCanvas{cursor:default!important}

/* STREETMADE M3.48.135P5P29 — Character Create parity layout */
.characterWorkshop.cwCreateParityLayout .cwTopbar{align-items:center;gap:8px;min-height:52px;padding:6px 10px;overflow:visible}
.characterWorkshop.cwCreateParityLayout .cwTitleGroup{flex:0 0 auto;min-width:max-content}
.characterWorkshop.cwCreateParityLayout .cwTopActions{display:flex;align-items:center;gap:5px;flex:1 1 auto;min-width:0;overflow:visible;justify-content:flex-start}
.characterWorkshop.cwCreateParityLayout .cwCommandMenu{position:relative;flex:0 0 auto}
.characterWorkshop.cwCreateParityLayout .cwCommandMenu>summary{list-style:none;cursor:pointer;user-select:none;min-height:38px;display:flex;align-items:center;padding:0 11px;border:1px solid #3d506a;border-radius:8px;background:#16243a;color:#edf5ff;font-weight:800;font-size:12px;white-space:nowrap}
.characterWorkshop.cwCreateParityLayout .cwCommandMenu>summary::-webkit-details-marker{display:none}
.characterWorkshop.cwCreateParityLayout .cwCommandMenu[open]>summary{background:#294762;outline:2px solid rgba(126,200,255,.55)}
.characterWorkshop.cwCreateParityLayout .cwCommandMenuPanel{position:absolute;z-index:85;top:calc(100% + 5px);left:0;min-width:220px;max-width:min(380px,90vw);max-height:min(68vh,600px);overflow:auto;display:flex;flex-direction:column;gap:7px;padding:9px;border:1px solid #47617e;border-radius:10px;background:#132136;box-shadow:0 10px 26px rgba(0,0,0,.38)}
.characterWorkshop.cwCreateParityLayout .cwCommandMenuPanel button,.characterWorkshop.cwCreateParityLayout .cwCommandMenuPanel select{min-height:38px}
.characterWorkshop.cwCreateParityLayout .cwCommandButtonRow{display:flex;gap:6px;flex-wrap:wrap}
.characterWorkshop.cwCreateParityLayout .cwCommandButtonRow>*{flex:1 1 auto}
.characterWorkshop.cwCreateParityLayout .cwCommandField,.characterWorkshop.cwCreateParityLayout .cwCommandRange{display:grid;gap:4px;color:#d9e7f7;font-size:12px}
.characterWorkshop.cwCreateParityLayout .cwCommandField select,.characterWorkshop.cwCreateParityLayout .cwCommandRange input{width:100%}
.characterWorkshop.cwCreateParityLayout .cwCommandRigGrid{display:grid!important;grid-template-columns:repeat(3,minmax(62px,1fr));gap:5px!important}
.characterWorkshop.cwCreateParityLayout .cwCommandRigGrid button{min-width:0!important}
.characterWorkshop.cwCreateParityLayout .cwHeaderExportAll,.characterWorkshop.cwCreateParityLayout .cwHeaderClose{flex:0 0 auto;min-height:38px!important;padding:0 10px!important}
.characterWorkshop.cwCreateParityLayout .cwHeaderClose{margin-left:auto}

.characterWorkshop.cwCreateParityLayout:not(.animateMode) .cwStageTools{display:none!important}
.characterWorkshop.cwCreateParityLayout:not(.animateMode) .cwBuildBottomTools{display:none!important}
.characterWorkshop.cwCreateParityLayout:not(.animateMode) .cwCreateActionBar{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:6px 10px;background:#111d30;border-bottom:1px solid #30445d;z-index:30}
.characterWorkshop.cwCreateParityLayout.animateMode .cwCreateActionBar{display:none!important}
.characterWorkshop.cwCreateParityLayout .cwCreateActionBar button{min-height:40px;padding:0 11px;border-radius:8px;white-space:nowrap;font-weight:800}
.characterWorkshop.cwCreateParityLayout .cwCreateActionBar button.active{background:#2d78b1;outline:2px solid #8bd4ff}

.characterWorkshop.cwCreateParityLayout:not(.animateMode) .cwStageWrap{padding-bottom:142px!important}
.characterWorkshop.cwCreateParityLayout:not(.animateMode) .cwQuickRail{top:8px!important;bottom:auto!important}
.characterWorkshop.cwCreateParityLayout .cwQuickShapePalette{display:flex!important;position:absolute!important;z-index:34!important;left:58px!important;right:118px!important;top:auto!important;bottom:6px!important;width:auto!important;height:126px!important;max-height:none!important;overflow:hidden!important;flex-direction:column!important;padding:5px!important;border-radius:10px!important;background:#122137!important;border:1px solid #38516d!important;box-shadow:0 4px 16px rgba(0,0,0,.28)!important}
.characterWorkshop.cwCreateParityLayout.animateMode .cwQuickShapePalette{display:none!important}
.characterWorkshop.cwCreateParityLayout .cwQuickShapeHead{display:none!important}
.characterWorkshop.cwCreateParityLayout .cwQuickShapePalette .cwShapeStyleRow{display:flex!important;align-items:center;gap:5px;padding:0 0 5px!important;border-bottom:1px solid rgba(255,255,255,.12)!important;flex:0 0 auto}
.characterWorkshop.cwCreateParityLayout .cwQuickShapePalette .cwShapeStyleRow button{height:34px;min-width:82px;padding:0 10px;border-radius:8px}
.characterWorkshop.cwCreateParityLayout .cwShapeDockRing{display:flex!important;align-items:center;gap:6px;min-width:190px;padding:0 8px;height:34px;border:1px solid #314863;border-radius:8px;color:#dce9f8;font-size:11px;white-space:nowrap}
.characterWorkshop.cwCreateParityLayout .cwShapeDockRing b{color:#9ee3ff}
.characterWorkshop.cwCreateParityLayout .cwShapeDockRing input{width:110px;margin:0}
.characterWorkshop.cwCreateParityLayout .cwQuickShapeGrid{display:flex!important;flex:1 1 auto!important;gap:5px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:5px 0 0!important;scrollbar-width:thin!important;-webkit-overflow-scrolling:touch;grid-template-columns:none!important}
.characterWorkshop.cwCreateParityLayout .cwQuickShapeGrid>button{flex:0 0 78px!important;width:78px!important;min-width:78px!important;height:66px!important;min-height:66px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;padding:4px!important;border-radius:8px!important}
.characterWorkshop.cwCreateParityLayout .cwQuickShapeGrid>button span{font-size:24px;line-height:1}
.characterWorkshop.cwCreateParityLayout .cwQuickShapeGrid>button small{display:block!important;font-size:9px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70px}
.characterWorkshop.cwCreateParityLayout .cwQuickShapeGrid>button.active{background:#2d78b1!important;outline:2px solid #8bd4ff!important}
.characterWorkshop.cwCreateParityLayout .cwShapeShelfPen span{font-size:20px!important}
.characterWorkshop.cwCreateParityLayout .cwCreateBoxMarquee{position:absolute;z-index:50;pointer-events:none;border:2px dashed #ffe27a;background:rgba(255,226,122,.12);box-sizing:border-box}

/* Keep the permanent shelf out from under the global Notes button. */
@media(max-width:720px){
 .characterWorkshop.cwCreateParityLayout .cwTopbar{padding:4px 5px;gap:4px;flex-wrap:wrap}
 .characterWorkshop.cwCreateParityLayout .cwTitleGroup{font-size:11px}
 .characterWorkshop.cwCreateParityLayout .cwTopActions{gap:3px;overflow-x:auto;overflow-y:visible;scrollbar-width:none}
 .characterWorkshop.cwCreateParityLayout .cwCommandMenu>summary{min-height:34px;padding:0 8px;font-size:10px}
 .characterWorkshop.cwCreateParityLayout .cwCreateActionBar{padding:4px!important;gap:3px!important}
 .characterWorkshop.cwCreateParityLayout .cwCreateActionBar button{min-height:36px;padding:0 8px;font-size:11px}
 .characterWorkshop.cwCreateParityLayout .cwQuickShapePalette{left:50px!important;right:72px!important;height:118px!important;bottom:4px!important}
 .characterWorkshop.cwCreateParityLayout .cwQuickShapeGrid>button{flex-basis:68px!important;width:68px!important;min-width:68px!important;height:60px!important;min-height:60px!important}
 .characterWorkshop.cwCreateParityLayout .cwQuickShapePalette .cwShapeStyleRow button{min-width:68px;height:31px;font-size:10px}
 .characterWorkshop.cwCreateParityLayout .cwShapeDockRing{min-width:155px;height:31px;padding:0 5px}
 .characterWorkshop.cwCreateParityLayout .cwShapeDockRing input{width:78px}
 .characterWorkshop.cwCreateParityLayout:not(.animateMode) .cwStageWrap{padding-bottom:130px!important}
}
.characterWorkshop.cwCreateParityLayout.cwHomeMode .cwCreateActionBar,
.characterWorkshop.cwCreateParityLayout.cwHomeMode .cwCreateReferenceMenu,
.characterWorkshop.cwCreateParityLayout.cwHomeMode #cwCreateViewMenu,
.characterWorkshop.cwCreateParityLayout.cwHomeMode #cwCreateRigMenu,
.characterWorkshop.cwCreateParityLayout.cwHomeMode #cwCreateTransformMenu{display:none!important}
.characterWorkshop.cwCreateParityLayout.cwHomeMode #cwCreateReferenceMenu{display:none!important}

/* STREETMADE M3.48.135P5P30 — reusable Character Asset drawer. */
.cwCreateDrawerTabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;position:sticky;top:0;z-index:3;padding:2px 0 8px;background:rgba(23,31,44,.985)}
.cwCreateDrawerTabs button{min-height:38px;border:1px solid #455a75;border-radius:8px;background:#1c293b;color:#eaf3ff;font-weight:800}
.cwCreateDrawerTabs button.active{background:#2f6f9d;border-color:#81cfff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.cwCharacterAssetPane{padding-bottom:18px}
.cwCharacterAssetHead{display:grid;gap:7px;margin:2px 0 8px}
.cwCharacterAssetHead button,.cwCharacterAssetHead select{min-height:40px;border:1px solid #455a75;border-radius:8px;background:#1d2b3e;color:#eef5ff;font-weight:750}
.cwCharacterAssetList{display:grid;gap:8px;margin-top:9px}
.cwCharacterAssetCard{display:grid;grid-template-columns:88px minmax(0,1fr);gap:8px;padding:7px;border:1px solid #40516a;border-radius:10px;background:#111c2b}
.cwCharacterAssetPreview{width:88px;height:72px;border:1px solid #4d617c;border-radius:8px;background:#c3d0da;grid-row:1 / span 2}
.cwCharacterAssetInfo{min-width:0;display:flex;flex-direction:column;justify-content:center}
.cwCharacterAssetInfo b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.cwCharacterAssetInfo small{color:#aebed1;margin-top:3px;line-height:1.25}
.cwCharacterAssetActions{display:flex;gap:6px;align-items:center}
.cwCharacterAssetActions button{min-height:34px;border:1px solid #455a75;border-radius:7px;background:#223149;color:#fff;font-weight:750}
.cwCharacterAssetActions button:first-child{flex:1;background:#2d6f9d;border-color:#76c7ff}
.cwCharacterAssetEmpty{padding:16px 10px;border:1px dashed #516783;border-radius:9px;color:#afbdd0;text-align:center;line-height:1.35}
@media(max-width:760px){.cwCharacterAssetCard{grid-template-columns:76px minmax(0,1fr)}.cwCharacterAssetPreview{width:76px;height:66px}.cwCreateDrawerTabs button{font-size:11px}}

/* STREETMADE M3.48.135P5P31 — Character Create + Animate canvas theme.
   View-only: artwork/export colors are untouched. */
html[data-streetmade-editor-canvas-theme="dark"] .characterWorkshop .cwStageWrap{
 background-color:#1c2732!important;
 background-image:
  repeating-linear-gradient(0deg,rgba(202,224,240,.095) 0 1px,transparent 1px 24px),
  repeating-linear-gradient(90deg,rgba(202,224,240,.095) 0 1px,transparent 1px 24px),
  linear-gradient(180deg,#263542 0%,#17212b 100%)!important;
}

/* STREETMADE M3.48.135P5P37 — Character Create + Animate share one direct fullscreen control. */
.characterWorkshop.cwCreateParityLayout .cwHeaderFullscreen{
  flex:0 0 auto;min-height:38px!important;padding:0 10px!important;border:1px solid #3d506a;border-radius:8px;
  background:#16243a;color:#edf5ff;font-weight:800;white-space:nowrap;
}
.characterWorkshop.cwCreateParityLayout .cwHeaderFullscreen.active{background:#294762;outline:2px solid rgba(126,200,255,.55)}
@media(max-width:720px){.characterWorkshop.cwCreateParityLayout .cwHeaderFullscreen{min-height:34px!important;padding:0 8px!important;font-size:10px}}

/* STREETMADE M3.48.135P5P44 — isolated spawn editor + map-linked parallax editor. */
.lbSpawnModePalette{
  position:fixed;z-index:13040;left:64px;top:62px;display:flex;align-items:center;gap:6px;
  padding:6px 8px;border:1px solid #4a607d;border-radius:11px;background:rgba(15,28,45,.97);
  color:#eef5ff;box-shadow:0 8px 24px rgba(0,0,0,.38);font-size:11px
}
.lbSpawnModePalette[hidden]{display:none!important}
.lbSpawnModePalette .lbSpawnTeamButtons{display:flex;gap:4px}
.lbSpawnModePalette button{min-width:38px;min-height:34px;padding:4px 7px}
.lbSpawnModePalette button.active{background:#2d82c5;border-color:#8ed0ff}
.lbSpawnModePalette .lbSpawnCount{opacity:.75;white-space:nowrap}
body.lbSpawnEditMode #lbMapToolRail [data-tool],
body.lbSpawnEditMode #lbMapToolRail #copyBtn,
body.lbSpawnEditMode #lbMapToolRail #pasteBtn{opacity:.35;pointer-events:none}
body.lbSpawnEditMode #lbMapToolRail #mapSpawnEditBtn,
body.lbSpawnEditMode #lbMapToolRail #eraseBtn{opacity:1;pointer-events:auto}

#streetmadeParallaxEditor{
  position:fixed;inset:0;z-index:15050;display:grid;grid-template-rows:auto minmax(0,1fr) auto;
  background:#101824;color:#eef5ff;font-family:system-ui,sans-serif;touch-action:none
}
#streetmadeParallaxEditor[hidden]{display:none!important}
.parallaxTopBar,.parallaxBottomDock{
  display:flex;align-items:center;gap:6px;padding:7px 8px;background:#142238;border-color:#405477;
  overflow-x:auto;overflow-y:hidden;overscroll-behavior:contain;scrollbar-width:none
}
.parallaxTopBar{border-bottom:1px solid #405477}.parallaxBottomDock{border-top:1px solid #405477}
.parallaxTopBar::-webkit-scrollbar,.parallaxBottomDock::-webkit-scrollbar{display:none}
.parallaxTopBar button,.parallaxBottomDock button,.parallaxTopBar input{flex:0 0 auto;min-height:36px}
.parallaxTopBar button.active,.parallaxBottomDock button.active{background:#2d82c5;border-color:#8ed0ff}
.parallaxLayerTabs{display:flex;gap:4px}.parallaxLayerTabs button{min-width:58px}
.parallaxStageWrap{position:relative;min-height:0;overflow:hidden;background:#bdccd7}
#streetmadeParallaxCanvas{display:block;width:100%;height:100%;touch-action:none;user-select:none;-webkit-user-select:none}
.parallaxColorBar{
  position:absolute;left:8px;top:8px;bottom:8px;width:42px;display:flex;flex-direction:column;gap:5px;
  padding:5px;border:1px solid #405477;border-radius:11px;background:rgba(15,28,45,.94);overflow-y:auto
}
.parallaxColorSwatch{width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important;padding:0!important;border-radius:8px!important;position:relative}
.parallaxColorSwatch.active::after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:white;font-weight:900;text-shadow:0 1px 3px #000}
.parallaxInspector{
  position:absolute;right:8px;top:8px;width:min(230px,38vw);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;
  padding:8px;border:1px solid #405477;border-radius:11px;background:rgba(15,28,45,.94)
}
.parallaxInspector label{display:grid;gap:3px;font-size:10px}.parallaxInspector input{min-width:0;width:100%;box-sizing:border-box;padding:5px}
.parallaxInspector .parallaxLayerControls{grid-column:1/-1;display:grid;grid-template-columns:1fr;gap:4px;border-top:1px solid #405477;padding-top:6px}
.parallaxInspector .parallaxLayerControls label{grid-template-columns:auto 1fr auto;align-items:center}
.parallaxSelectionStatus{grid-column:1/-1;font-size:10px;opacity:.78}
.parallaxShapeBtn{min-width:62px}.parallaxShapeBtn span{display:block;font-size:17px}.parallaxShapeBtn small{display:block;font-size:9px}
body.lbParallaxEditing #lbPageActions,body.lbParallaxEditing #lbMapToolRail,body.lbParallaxEditing #editorPanel,body.lbParallaxEditing .lbSpawnModePalette{visibility:hidden!important}
@media(max-width:760px){
  .lbSpawnModePalette{left:51px;right:5px;top:49px;padding:4px 5px;gap:4px;overflow-x:auto}.lbSpawnModePalette b{display:none}.lbSpawnModePalette button{min-height:30px;min-width:34px;padding:3px 5px}.lbSpawnModePalette .lbSpawnCount{font-size:9px}
  #streetmadeParallaxEditor{grid-template-rows:44px minmax(0,1fr) 88px}
  .parallaxTopBar{padding:4px;gap:4px}.parallaxTopBar button{min-height:34px;padding:4px 7px;font-size:10px}
  .parallaxLayerTabs button{min-width:44px}
  .parallaxColorBar{left:5px;top:5px;bottom:5px;width:35px;padding:3px;gap:3px}.parallaxColorSwatch{width:27px!important;height:27px!important;min-width:27px!important;min-height:27px!important}
  .parallaxInspector{right:5px;top:5px;width:170px;padding:5px;gap:4px}.parallaxInspector label{font-size:8px}.parallaxInspector input{padding:3px;font-size:10px}
  .parallaxBottomDock{padding:4px 5px;gap:4px}.parallaxBottomDock button{min-height:72px;padding:4px 8px}.parallaxShapeBtn{min-width:58px}.parallaxShapeBtn span{font-size:16px}.parallaxShapeBtn small{font-size:8px}
}

/* STREETMADE M3.48.135P5P46 — optional score-zone scoreboard. */
#arcadeScoreboard{position:absolute;z-index:26;top:58px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:9px;padding:6px 11px;border:1px solid rgba(255,226,122,.72);border-radius:10px;background:rgba(12,17,27,.86);box-shadow:0 5px 18px rgba(0,0,0,.32);color:#fff;font:800 13px/1 system-ui,sans-serif;pointer-events:none;white-space:nowrap}
#arcadeScoreboard[hidden]{display:none!important}#arcadeScoreboard b{font-size:10px;letter-spacing:.11em;color:#ffe27a}#arcadeScoreboard.scoreFlash{transform:translateX(-50%) scale(1.07);box-shadow:0 0 0 2px rgba(255,226,122,.5),0 6px 22px rgba(0,0,0,.38)}
body.lb-page-map #arcadeScoreboard,body:not(.lb-page-battle) #arcadeScoreboard,body:not(.lb-battle-running) #arcadeScoreboard{display:none!important}
@media(max-width:700px){#arcadeScoreboard{top:51px;padding:5px 8px;font-size:11px;gap:6px}}


/* STREETMADE M3.48.135P5P60 — deliberate gameplay-plane controls.
   These are independent buttons; dragging the analog stick across them does
   not trigger a layer change because only a fresh button press is consumed. */
.leftCluster .layerShiftButton{
  position:absolute!important;left:50%!important;z-index:12!important;
  width:58px!important;height:24px!important;min-width:58px!important;min-height:24px!important;
  padding:1px 3px!important;transform:translateX(-50%)!important;
  border-radius:12px!important;border:1px solid rgba(210,235,255,.72)!important;
  background:rgba(14,31,49,.91)!important;color:#eef8ff!important;
  box-shadow:0 2px 7px rgba(0,0,0,.45)!important;opacity:.86!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:2px!important;
  font:800 7px/1 system-ui,sans-serif!important;text-transform:uppercase!important;letter-spacing:.03em!important;
  pointer-events:auto!important;touch-action:none!important;
}
.leftCluster .layerShiftButton .layerShiftIcon{font-size:12px;line-height:1}
.leftCluster .layerShiftBack{top:-31px!important}
.leftCluster .layerShiftFront{bottom:-31px!important}
.leftCluster .layerShiftButton.active{opacity:1!important;background:rgba(57,116,160,.96)!important;border-color:#d7f1ff!important;transform:translateX(-50%) scale(1.06)!important}
/* P5P122: while Fireball is held, the SAME main-joystick finger can slide into
   Back/Front and hand off to upper-hemisphere depth aim without lifting. This
   halo marks the active lane target; sliding back into the main stick cancels it. */
.leftCluster .layerShiftButton.depthAimActive{
  opacity:1!important;background:rgba(39,111,157,.98)!important;border-color:#fff0a6!important;
  box-shadow:0 0 0 18px rgba(76,170,225,.10),0 0 0 2px rgba(255,238,150,.72),0 3px 12px rgba(0,0,0,.48)!important;
}
.leftCluster .layerShiftButton.depthAimActive::after{
  content:attr(data-depth-label);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  min-width:78px;padding:25px 4px 0;color:#fff2a3;font:900 7px/1 system-ui,sans-serif;letter-spacing:.05em;
  text-shadow:0 1px 3px #000;pointer-events:none;white-space:nowrap;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .layerShiftButton{
  width:54px!important;height:22px!important;min-width:54px!important;min-height:22px!important;font-size:6px!important;border-radius:11px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster .layerShiftButton .layerShiftIcon{font-size:10px}


/* STREETMADE M3.48.135P5P65 — full-screen battle camera with low-cost floating bubble toolbar.
   P5P65 removes live backdrop blur because repeatedly blurring the animated canvas
   behind every bubble is disproportionately expensive on Android GPUs.
   The arena owns the entire viewport in either orientation. Navigation and live-battle
   menus float over the canvas instead of reserving two permanent header rows. */
body.lb-page-battle.lb-battle-running #lbPageBar{
  display:none!important;
}
body.lb-page-battle.lb-battle-running #app{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:0!important;
  padding:0!important;
  grid-template-rows:minmax(0,1fr)!important;
  overflow:hidden!important;
}
body.lb-page-battle.lb-battle-running #gameWrap{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
}
body.lb-page-battle.lb-battle-running #game{
  width:100%!important;
  height:100%!important;
}
body.lb-page-battle.lb-battle-running #topbar{
  display:flex!important;
  position:fixed!important;
  top:max(5px,env(safe-area-inset-top))!important;
  left:max(5px,env(safe-area-inset-left))!important;
  right:max(5px,env(safe-area-inset-right))!important;
  width:auto!important;
  height:38px!important;
  min-height:38px!important;
  max-height:38px!important;
  padding:0!important;
  margin:0!important;
  gap:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  pointer-events:none!important;
  overflow:visible!important;
  z-index:10950!important;
}
body.lb-page-battle.lb-battle-running #topbar .brand,
body.lb-page-battle.lb-battle-running #menuBuildBadge{
  display:none!important;
}
body.lb-page-battle.lb-battle-running #toolbarDrawer.desktopMenuBar{
  display:flex!important;
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:38px!important;
  min-height:38px!important;
  max-height:38px!important;
  align-items:center!important;
  gap:5px!important;
  padding:0 2px!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  scrollbar-width:none!important;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x!important;
  pointer-events:auto!important;
}
body.lb-page-battle.lb-battle-running #toolbarDrawer.desktopMenuBar::-webkit-scrollbar{
  display:none!important;
}
body.lb-page-battle.lb-battle-running #toolbarDrawer>.menuCategory,
body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbPageBack,
body.lb-page-battle.lb-battle-running #toolbarDrawer>.lbBattleReportsBtn,
body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbSharedViewQuickActions{
  flex:0 0 auto!important;
}
body.lb-page-battle.lb-battle-running #toolbarDrawer .menuCategory>summary,
body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbPageBack,
body.lb-page-battle.lb-battle-running #toolbarDrawer>.lbBattleReportsBtn,
body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbSharedViewQuickActions button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  min-height:34px!important;
  height:34px!important;
  max-height:34px!important;
  margin:0!important;
  padding:5px 10px!important;
  border:1px solid rgba(220,235,255,.25)!important;
  border-radius:18px!important;
  background:rgba(12,22,38,.66)!important;
  color:#f5f8ff!important;
  box-shadow:0 1px 3px rgba(0,0,0,.14)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  white-space:nowrap!important;
  font-size:11px!important;
  line-height:1!important;
  transform:none!important;
}
body.lb-page-battle.lb-battle-running #toolbarDrawer .menuCategory[open]>summary,
body.lb-page-battle.lb-battle-running #toolbarDrawer .menuCategory>summary:active,
body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbPageBack:active,
body.lb-page-battle.lb-battle-running #toolbarDrawer>.lbBattleReportsBtn:active,
body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbSharedViewQuickActions button:active{
  background:rgba(39,64,92,.68)!important;
  border-color:rgba(150,205,255,.55)!important;
}
body.lb-page-battle.lb-battle-running #toolbarDrawer>.lbBattleReportsBtn{
  margin:0!important;
}
body.lb-page-battle.lb-battle-running #lbSharedViewQuickActions{
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
}
body.lb-page-battle.lb-battle-running .menuDropdown{
  top:48px!important;
  max-height:calc(100dvh - 58px)!important;
}
/* Keep HUD information readable without giving up camera space; it overlays the arena too. */
body.lb-page-battle.lb-battle-running #hud{
  top:46px!important;
}
/* Compact phones and short landscape screens use the same single floating row. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #topbar{
  top:max(4px,env(safe-area-inset-top))!important;
  left:max(4px,env(safe-area-inset-left))!important;
  right:max(4px,env(safe-area-inset-right))!important;
  height:36px!important;
  min-height:36px!important;
  max-height:36px!important;
  padding:0!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #app{
  inset:0!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #toolbarDrawer{
  width:100%!important;
  height:36px!important;
  min-height:36px!important;
  max-height:36px!important;
  padding:0!important;
  gap:4px!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #toolbarDrawer .menuCategory>summary,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbPageBack,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #toolbarDrawer>.lbBattleReportsBtn,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbSharedViewQuickActions button{
  min-height:32px!important;
  height:32px!important;
  max-height:32px!important;
  padding:4px 8px!important;
  border-radius:17px!important;
  font-size:10px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running #hud{
  top:42px!important;
}
@media (orientation:portrait){
  body.lb-page-battle.lb-battle-running #toolbarDrawer.desktopMenuBar{gap:4px!important}
  body.lb-page-battle.lb-battle-running #toolbarDrawer .menuCategory>summary,
  body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbPageBack,
  body.lb-page-battle.lb-battle-running #toolbarDrawer>.lbBattleReportsBtn,
  body.lb-page-battle.lb-battle-running #toolbarDrawer>#lbSharedViewQuickActions button{
    padding-left:8px!important;
    padding-right:8px!important;
  }
}

/* P5P65 phone battle compositor trim: keep range feedback readable without
   continuously animating blur-like shadows/filters over the moving canvas. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running .rightCluster button.range-ready{
  animation:none!important;
  filter:none!important;
  box-shadow:none!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle.lb-battle-running .leftCluster .dpadCenter{
  box-shadow:inset 0 1px 2px rgba(255,255,255,.22)!important;
}

/* STREETMADE M3.48.135P5P68 — COD-style movable/shrinkable battle HUD controls + draggable editor panel. */
.controlSettingsHead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;cursor:move;touch-action:none;user-select:none;padding:3px 2px;border-bottom:1px solid rgba(150,205,240,.18)}.controlSettingsHead b{font-size:12px;letter-spacing:.08em}.controlSettingsHead span{font-size:11px;color:#a9ddff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.controlQuickRow{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:5px;margin:2px 0 8px}.controlQuickRow button{min-height:32px;padding:5px 7px;font-size:10px}.lbHudEditToggle{position:fixed;right:max(8px,env(safe-area-inset-right));bottom:calc(max(8px,env(safe-area-inset-bottom)) + 40px);z-index:10021;min-height:34px;padding:5px 8px;border-radius:10px;background:rgba(15,28,45,.88);color:#eef8ff;border:1px solid #6abaff;box-shadow:0 3px 10px rgba(0,0,0,.28);font-size:10px}.lbHudEditToggle.active{background:rgba(48,92,126,.94);border-color:#b7e5ff}.lb-hud-editing .lbTouchVisibilityToggle{display:none!important}.lb-hud-editing .lbHudEditToggle{bottom:max(8px,env(safe-area-inset-bottom));font-size:11px;min-height:36px}.lb-hud-editing #topbar{opacity:.28;pointer-events:none!important}.lb-hud-editing #arcadeScoreboard,.lb-hud-editing #hud{opacity:.35}.lb-hud-editing #touchControls.controls-customizing{background:rgba(4,9,16,.24)!important}.lb-hud-editing #touchControls.controls-customizing .leftCluster,.lb-hud-editing #touchControls.controls-customizing .rightCluster button{outline:2px dashed rgba(230,242,255,.75)!important;outline-offset:3px}.lb-hud-editing #touchControls.controls-customizing .hud-control-selected{outline:4px solid #ffe46e!important;outline-offset:4px!important}.lb-hud-editing #touchControls.controls-customizing .controlResizeHandle{width:26px;height:26px;right:-8px;bottom:-8px;border-width:3px}.lb-hud-editing #touchControls.controls-customizing .controlResizeHandle::before{font-size:14px}.lb-hud-editing .controlSettings{position:fixed!important;z-index:10080!important;top:auto!important;left:50%!important;bottom:max(8px,env(safe-area-inset-bottom))!important;transform:translateX(-50%)!important;width:min(390px,calc(100vw - 140px))!important;max-height:46dvh;overflow:auto;padding:8px 10px!important;background:rgba(8,15,26,.93)!important;box-shadow:0 4px 14px rgba(0,0,0,.28)!important}.lb-hud-editing .controlSettings input{margin:4px 0 3px}.lb-hud-editing .controlSettings small{font-size:9px;line-height:1.25}.lb-hud-editing .controlSettings label{font-size:11px}
@media (orientation:landscape) and (max-height:650px){.lb-hud-editing .controlSettings{left:50%!important;bottom:5px!important;width:min(420px,46vw)!important;max-height:42dvh}.controlQuickRow button{min-height:28px}.lbHudEditToggle{right:max(6px,env(safe-area-inset-right));bottom:calc(max(6px,env(safe-area-inset-bottom)) + 34px)}.lbTouchVisibilityToggle{right:max(6px,env(safe-area-inset-right));bottom:max(6px,env(safe-area-inset-bottom))}}
@media (max-width:760px){.lbHudEditToggle{min-height:31px;padding:4px 7px}.lb-hud-editing .controlSettings{width:min(360px,calc(100vw - 118px))!important}.controlSettingsHead span{max-width:170px}}

/* P5P68 — compact map lighting / score-victory controls. */
.mapCompactField{display:grid;grid-template-columns:auto minmax(90px,1fr) auto;align-items:center;gap:7px;margin:6px 0;font-size:11px}
.mapCompactField select,.mapCompactField input[type="color"]{min-height:30px}
.mapCompactField input[type="range"]{grid-column:1/-1;width:100%}
.mapLightingSection .creativeGrid{margin:6px 0}
.mapLightingSection button.active{outline:2px solid #ffe27a;outline-offset:1px}

/* STREETMADE M3.48.135P5P68 — editor-only depth-plane opacity controls. */
.mapLayerViewPanel summary{color:#ffe58a}.mapLayerViewPanel small{color:#aebfd4}


/* P5P112 — both human halves are independently editable in tabletop HUD mode. */
.tabletopControls.controls-customizing{pointer-events:auto;background:rgba(8,12,18,.18);z-index:25}
.tabletopControls.controls-customizing .leftCluster,.tabletopControls.controls-customizing .rightCluster button{outline:3px dashed rgba(255,255,255,.9);outline-offset:3px;cursor:move}
.tabletopControls.controls-customizing .leftCluster::after{content:'DRAG PAD';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:10px;font-weight:900;white-space:nowrap;pointer-events:none;color:#fff;text-shadow:0 1px 2px #000}
.tabletopControls.controls-customizing .leftCluster *,.tabletopControls.controls-customizing .rightCluster button *{pointer-events:none!important}
.tabletopControls.controls-customizing .leftCluster{pointer-events:auto!important;touch-action:none!important}
.tabletopControls.controls-customizing .controlResizeHandle{display:block!important;pointer-events:auto!important;position:absolute;right:-7px;bottom:-7px;width:30px;height:30px;border-radius:50%;background:#fff;border:4px solid #315f83;box-shadow:0 2px 7px rgba(0,0,0,.65);z-index:50}
.tabletopControls.controls-customizing .controlResizeHandle::before{content:'↘';display:grid;place-items:center;width:100%;height:100%;color:#172534;font-size:17px;font-weight:1000}
.tabletopControls:not(.controls-customizing) .controlResizeHandle{display:none!important}
.tabletopControls.controls-customizing .moving-control{outline-color:#7fc7ff!important}
.tabletopControls.controls-customizing .resizing-control{outline-color:#ffe27c!important}
.lb-hud-editing #topTouchControls.controls-customizing,.lb-hud-editing #touchControls.controls-customizing{background:rgba(4,9,16,.24)!important}
.lb-hud-editing .tabletopControls.controls-customizing .leftCluster,.lb-hud-editing .tabletopControls.controls-customizing .rightCluster button{outline:2px dashed rgba(230,242,255,.75)!important;outline-offset:3px}
.lb-hud-editing .tabletopControls.controls-customizing .hud-control-selected{outline:4px solid #ffe46e!important;outline-offset:4px!important}
.lb-hud-editing .tabletopControls.controls-customizing .controlResizeHandle{width:26px;height:26px;right:-8px;bottom:-8px;border-width:3px}
.lb-hud-editing .tabletopControls.controls-customizing .controlResizeHandle::before{font-size:14px}


/* P5P113 — tabletop 2P: keep the universal in-match menu on the neutral
   center divider between both human control halves instead of crowding P2's
   outer/top edge. One-human battle layouts remain unchanged. */
body.tabletop-mode.lb-page-battle.lb-battle-running #topbar{
  top:50dvh!important;
  bottom:auto!important;
  left:max(5px,env(safe-area-inset-left))!important;
  right:max(5px,env(safe-area-inset-right))!important;
  transform:translateY(-50%)!important;
}
/* The compact/phone rules normally pin the bar back to the device top, so
   tabletop gets an explicit final override as well. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.tabletop-mode.lb-page-battle.lb-battle-running #topbar{
  top:50dvh!important;
  bottom:auto!important;
  transform:translateY(-50%)!important;
}
/* On narrow screens the menu dropdown is position:fixed. Keep it attached to
   the centered tabletop bar rather than opening back at the top edge. */
body.tabletop-mode.lb-page-battle.lb-battle-running .menuDropdown{
  top:calc(50dvh + 22px)!important;
  bottom:auto!important;
  max-height:calc(50dvh - 34px)!important;
}
@media (orientation:landscape) and (max-height:650px){
  body.tabletop-mode.lb-page-battle.lb-battle-running .menuDropdown{
    top:calc(50dvh + 20px)!important;
    max-height:calc(50dvh - 28px)!important;
  }
}


/* P5P116 — compact tabletop center dock.
   Split-screen gets one Menu button on the divider, a vertical touch-safe menu
   drawer, and all match-status information in the neutral middle band. */
body.tabletop-mode.lb-page-battle.lb-battle-running #topbar{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:0!important;
  max-height:none!important;
  transform:none!important;
  padding:0!important;
  margin:0!important;
  background:transparent!important;
  border:0!important;
  pointer-events:none!important;
  overflow:visible!important;
  z-index:10950!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running #menuBtn{
  display:flex!important;
  position:fixed!important;
  left:50%!important;
  top:50dvh!important;
  right:auto!important;
  bottom:auto!important;
  transform:translate(-50%,-50%)!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:82px!important;
  width:auto!important;
  height:38px!important;
  min-height:38px!important;
  padding:5px 15px!important;
  border:1px solid rgba(220,235,255,.42)!important;
  border-radius:19px!important;
  background:rgba(12,22,38,.92)!important;
  color:#fff!important;
  box-shadow:0 4px 14px rgba(0,0,0,.38)!important;
  font-size:13px!important;
  font-weight:900!important;
  pointer-events:auto!important;
  z-index:11010!important;
  touch-action:manipulation!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running #toolbarDrawer.desktopMenuBar{
  display:none!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer.desktopMenuBar{
  display:flex!important;
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  top:calc(50dvh + 25px)!important;
  bottom:auto!important;
  transform:translateX(-50%)!important;
  width:min(520px,calc(100vw - 24px))!important;
  height:auto!important;
  min-height:0!important;
  max-height:calc(50dvh - 38px)!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:5px!important;
  padding:8px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  border:1px solid rgba(125,175,220,.5)!important;
  border-radius:14px!important;
  background:rgba(8,16,29,.97)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.52)!important;
  pointer-events:auto!important;
  touch-action:pan-y!important;
  z-index:11000!important;
}
/* Keep the split-screen menu about live play, not editor creation tools. */
body.tabletop-mode.lb-page-battle.lb-battle-running #toolbarDrawer>#mapMenu,
body.tabletop-mode.lb-page-battle.lb-battle-running #toolbarDrawer>#creativeToolsBtn,
body.tabletop-mode.lb-page-battle.lb-battle-running #toolbarDrawer>#characterWorkshopBtn,
body.tabletop-mode.lb-page-battle.lb-battle-running #toolbarDrawer>#legacyReportsMenu,
body.tabletop-mode.lb-page-battle.lb-battle-running #toolbarDrawer>#menuBuildBadge{
  display:none!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer>.menuCategory,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer>#lbPageBack,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer>.lbBattleReportsBtn,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer>#lbSharedViewQuickActions{
  width:100%!important;
  flex:0 0 auto!important;
  margin:0!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer .menuCategory>summary,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer>#lbPageBack,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer>.lbBattleReportsBtn,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer>#lbSharedViewQuickActions button{
  width:100%!important;
  min-height:42px!important;
  height:auto!important;
  max-height:none!important;
  justify-content:flex-start!important;
  padding:9px 12px!important;
  border-radius:10px!important;
  font-size:13px!important;
  text-align:left!important;
  pointer-events:auto!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer>#lbSharedViewQuickActions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:5px!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer .menuDropdown{
  position:static!important;
  inset:auto!important;
  transform:none!important;
  display:flex!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  max-height:32dvh!important;
  margin:4px 0 0!important;
  padding:6px!important;
  overflow-y:auto!important;
  border-radius:9px!important;
  box-shadow:none!important;
  background:rgba(18,28,43,.98)!important;
  pointer-events:auto!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer .menuDropdown button,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer .menuDropdown select{
  min-height:40px!important;
  font-size:12px!important;
  pointer-events:auto!important;
}
/* Neutral-center match information. Keep the player controls at the outer
   halves and put health/stamina/score around the divider instead. */
body.tabletop-mode.lb-page-battle.lb-battle-running #hud{
  display:block!important;
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  top:calc(50dvh - 27px)!important;
  width:min(96vw,760px)!important;
  transform:translate(-50%,-100%)!important;
  padding:0!important;
  margin:0!important;
  z-index:10920!important;
  pointer-events:none!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running #fighterHudGrid{
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  width:100%!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running #fighterHudGrid .fighterHud{
  flex:1 1 0!important;
  min-width:0!important;
  max-width:190px!important;
  gap:3px!important;
  padding:3px 5px!important;
  border-radius:8px!important;
  font-size:10px!important;
  white-space:nowrap!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running #fighterHudGrid .fighterHud span:nth-child(2){font-size:14px!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #fighterHudGrid .fighterHud .meter{height:5px!important;min-width:18px!important;max-width:54px!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #modeLabel{display:none!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #arcadeScoreboard{
  position:fixed!important;
  left:50%!important;
  top:calc(50dvh + 24px)!important;
  right:auto!important;
  bottom:auto!important;
  transform:translateX(-50%)!important;
  padding:4px 8px!important;
  font-size:11px!important;
  z-index:10920!important;
}
/* These floating utility buttons crowd one human side and are intentionally
   absent from split-screen. Controls remain available through the center Menu. */
body.tabletop-mode.lb-page-battle.lb-battle-running #lbGlobalNotesToggle,
body.tabletop-mode.lb-page-battle.lb-battle-running #lbGlobalNotesPanel,
body.tabletop-mode.lb-page-battle.lb-battle-running .lbHudEditToggle,
body.tabletop-mode.lb-page-battle.lb-battle-running .lbTouchVisibilityToggle{
  display:none!important;
}
@media(max-width:760px){
  body.tabletop-mode.lb-page-battle.lb-battle-running #menuBtn{height:36px!important;min-height:36px!important;min-width:76px!important;font-size:12px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #toolbarDrawer.desktopMenuBar{width:min(460px,calc(100vw - 14px))!important;padding:6px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #hud{top:calc(50dvh - 25px)!important;width:98vw!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #fighterHudGrid .fighterHud{font-size:9px!important;padding:2px 3px!important;gap:2px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #fighterHudGrid .fighterHud span:nth-child(2){font-size:12px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #fighterHudGrid .fighterHud .meter{max-width:40px!important;height:4px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #arcadeScoreboard{top:calc(50dvh + 22px)!important;font-size:10px!important;padding:3px 6px!important}
}

/* P5P116 — TRUE TABLETOP CENTER DIVIDER DOCK.
   P114 visually repositioned legacy header children. On some Android/desktop-
   mode combinations those children still inherited incompatible viewport/header
   layout behavior. P115 physically reparents them into this body-level dock. */
#tabletopCenterDock{display:none}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock.active{
  display:flex!important;
  position:fixed!important;
  left:50%!important;
  top:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:min(98vw,840px)!important;
  max-width:98vw!important;
  transform:translate(-50%,-50%)!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  z-index:60000!important;
  pointer-events:none!important;
  overflow:visible!important;
}
/* The old header is intentionally absent in split screen. Its useful children
   have moved into #tabletopCenterDock; this also removes the stale hit region. */
body.tabletop-mode.lb-page-battle.lb-battle-running #topbar{display:none!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock .tabletopCenterStatusSlot{
  display:flex!important;width:100%!important;align-items:center!important;justify-content:center!important;pointer-events:none!important
}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #hud{
  display:block!important;
  position:static!important;
  inset:auto!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  width:min(100%,820px)!important;
  max-width:100%!important;
  transform:none!important;
  padding:0 3px!important;
  margin:0!important;
  pointer-events:none!important;
  z-index:auto!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #fighterHudGrid{
  display:flex!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;gap:4px!important;width:100%!important
}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #fighterHudGrid .fighterHud{
  flex:1 1 0!important;min-width:0!important;max-width:198px!important;gap:3px!important;padding:3px 5px!important;border-radius:8px!important;font-size:10px!important;white-space:nowrap!important
}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #fighterHudGrid .fighterHud span:nth-child(2){font-size:13px!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #fighterHudGrid .fighterHud .meter{height:5px!important;min-width:16px!important;max-width:50px!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #modeLabel{display:none!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock .tabletopCenterActionSlot{
  display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-height:32px!important;pointer-events:none!important
}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock .tabletopCenterScoreSlot,
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock .tabletopCenterMenuButtonSlot{display:flex!important;align-items:center!important;justify-content:center!important;pointer-events:none!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #arcadeScoreboard{
  display:flex!important;
  position:static!important;
  inset:auto!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  transform:none!important;
  margin:0!important;
  padding:4px 8px!important;
  font-size:10px!important;
  z-index:auto!important;
  pointer-events:none!important;
}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #arcadeScoreboard[hidden]{display:none!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #arcadeScoreboard.scoreFlash{transform:scale(1.05)!important}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #menuBtn{
  display:flex!important;
  position:static!important;
  inset:auto!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  transform:none!important;
  align-items:center!important;justify-content:center!important;
  width:auto!important;min-width:70px!important;height:32px!important;min-height:32px!important;
  margin:0!important;padding:4px 12px!important;border-radius:17px!important;
  font-size:11px!important;font-weight:900!important;
  pointer-events:auto!important;touch-action:manipulation!important;z-index:auto!important
}
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock .tabletopCenterMenuSlot{position:static!important;width:0!important;height:0!important;overflow:visible!important;pointer-events:none!important}
/* The opened drawer is a true viewport-centered overlay, not a descendant of
   either player's half. This guarantees that "open" also means visible. */
body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #toolbarDrawer.desktopMenuBar{display:none!important}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer.desktopMenuBar:not(.hidden){
  display:flex!important;
  position:fixed!important;
  left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;
  transform:translate(-50%,-50%)!important;
  width:min(92vw,520px)!important;
  height:auto!important;min-height:0!important;max-height:min(72dvh,720px)!important;
  flex-direction:column!important;align-items:stretch!important;gap:6px!important;
  margin:0!important;padding:10px!important;
  overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain!important;
  border:1px solid rgba(135,190,235,.62)!important;border-radius:15px!important;
  background:rgba(7,15,27,.985)!important;box-shadow:0 18px 60px rgba(0,0,0,.68)!important;
  pointer-events:auto!important;touch-action:pan-y!important;z-index:60100!important
}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer>.menuCategory,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer>#lbPageBack,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer>.lbBattleReportsBtn,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer>#lbSharedViewQuickActions{width:100%!important;flex:0 0 auto!important;margin:0!important}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer .menuCategory>summary,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer>#lbPageBack,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer>.lbBattleReportsBtn,
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer>#lbSharedViewQuickActions button{
  display:flex!important;width:100%!important;min-height:42px!important;height:auto!important;max-height:none!important;
  align-items:center!important;justify-content:flex-start!important;padding:9px 12px!important;border-radius:10px!important;font-size:13px!important;text-align:left!important;pointer-events:auto!important
}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer>#lbSharedViewQuickActions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:5px!important}
body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer .menuDropdown{
  position:static!important;inset:auto!important;transform:none!important;display:flex!important;width:100%!important;min-width:0!important;max-width:none!important;max-height:34dvh!important;margin:4px 0 0!important;padding:6px!important;overflow-y:auto!important;border-radius:9px!important;background:rgba(18,28,43,.98)!important;pointer-events:auto!important
}
/* Preserve P114's split-screen cleanup. */
body.tabletop-mode.lb-page-battle.lb-battle-running #lbGlobalNotesToggle,
body.tabletop-mode.lb-page-battle.lb-battle-running #lbGlobalNotesPanel,
body.tabletop-mode.lb-page-battle.lb-battle-running .lbHudEditToggle,
body.tabletop-mode.lb-page-battle.lb-battle-running .lbTouchVisibilityToggle{display:none!important}
@media(max-width:760px){
  body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock.active{width:99vw!important;gap:2px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #fighterHudGrid{gap:2px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #fighterHudGrid .fighterHud{font-size:8px!important;padding:2px 3px!important;gap:2px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #fighterHudGrid .fighterHud span:nth-child(2){font-size:11px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #fighterHudGrid .fighterHud .meter{height:4px!important;max-width:36px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #arcadeScoreboard{font-size:9px!important;padding:3px 6px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running #tabletopCenterDock #menuBtn{min-width:64px!important;height:30px!important;min-height:30px!important;padding:3px 10px!important;font-size:10px!important}
  body.tabletop-mode.lb-page-battle.lb-battle-running.lb-tabletop-menu-open #tabletopCenterDock #toolbarDrawer.desktopMenuBar:not(.hidden){width:min(94vw,480px)!important;max-height:76dvh!important;padding:7px!important}
}
\n\n/* STREETMADE M3.48.135P5P119 — rotation-safe, truly resizable analog stick.\n   The stick's outer ring is always circular; --user-scale owns its size in every\n   orientation instead of older max-height rules multiplying a hidden .82 scale. */\nbody.lb-page-battle .leftCluster{aspect-ratio:1/1!important;transform:scale(var(--user-scale))!important;transform-origin:center center!important}\n@media (max-height:700px){body.lb-page-battle .leftCluster,body.lb-page-battle #topTouchControls .leftCluster{transform:scale(var(--user-scale))!important;transform-origin:center center!important}}\n:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) body.lb-page-battle .leftCluster{transform:scale(var(--user-scale))!important;transform-origin:center center!important}\n.controlSettings #joystickDeadzone{accent-color:#ffd76a}\n.lbSettingsSection #lbJoystickDeadzone{width:100%;accent-color:#ffd76a}\n

/* STREETMADE M3.48.135P5P124 — wraparound depth-control ring.
   The normal joystick ends first, then a visible transparent/no-action gap,
   then the full top BACK / bottom FRONT annulus. Pointer hit-testing is done
   from rendered coordinates in JS so the empty center/gap never steals stick input. */
.leftCluster .layerShiftButton{display:none!important;pointer-events:none!important}
.leftCluster .layerDepthRingVisual,.leftCluster .layerDepthFarRingVisual{
  position:absolute!important;border-radius:50%!important;z-index:3!important;pointer-events:none!important;box-sizing:border-box!important;
  border:1px solid rgba(196,229,249,.15)!important;
  box-shadow:0 0 0 1px rgba(10,22,36,.22)!important;
}
/* First outer band: adjacent/next layer. Inactive is deliberately dim. */
.leftCluster .layerDepthRingVisual{
  inset:calc(-1 * var(--lane-near-outer-extra-px,65px))!important;
  background:linear-gradient(to bottom,rgba(75,141,180,.13) 0 49.5%,rgba(79,122,174,.13) 50.5% 100%)!important;
  -webkit-mask:radial-gradient(circle at center,transparent 0 calc(100% - var(--lane-near-width-px,52px)),#000 calc(100% - var(--lane-near-width-px,52px) + 1px) 100%)!important;
  mask:radial-gradient(circle at center,transparent 0 calc(100% - var(--lane-near-width-px,52px)),#000 calc(100% - var(--lane-near-width-px,52px) + 1px) 100%)!important;
}
/* Second outer band: farthest layer. Also dim until actually touched. */
.leftCluster .layerDepthFarRingVisual{
  inset:calc(-1 * var(--lane-far-outer-extra-px,108px))!important;
  background:linear-gradient(to bottom,rgba(88,151,190,.09) 0 49.5%,rgba(91,130,181,.09) 50.5% 100%)!important;
  -webkit-mask:radial-gradient(circle at center,transparent 0 calc(100% - var(--lane-far-width-px,43px)),#000 calc(100% - var(--lane-far-width-px,43px) + 1px) 100%)!important;
  mask:radial-gradient(circle at center,transparent 0 calc(100% - var(--lane-far-width-px,43px)),#000 calc(100% - var(--lane-far-width-px,43px) + 1px) 100%)!important;
}
.leftCluster .layerDepthRingLabel{
  position:absolute!important;left:50%!important;z-index:4!important;transform:translateX(-50%)!important;pointer-events:none!important;
  color:rgba(220,236,246,.55)!important;font:900 8px/1 system-ui,sans-serif!important;letter-spacing:.09em!important;
  text-shadow:0 1px 3px rgba(0,0,0,.9)!important;
}
.leftCluster .layerDepthRingBackLabel{top:calc(-1 * var(--lane-label-extra-px,118px))!important}
.leftCluster .layerDepthRingFrontLabel{bottom:calc(-1 * var(--lane-label-extra-px,118px))!important}
/* Visible no-action moat between the normal stick and first lane band. */
.leftCluster::before{
  content:'';position:absolute;inset:calc(-1 * var(--lane-gap-px,13px));border-radius:50%;border:2px solid rgba(164,211,241,.30);pointer-events:none;z-index:2;
  box-shadow:0 0 0 5px rgba(8,18,30,.24);
}
/* P5P132: only the exact band + half physically under the finger lights. */
.leftCluster.lane-touch-back.lane-touch-near .layerDepthRingVisual{
  background:linear-gradient(to bottom,rgba(73,180,239,.82) 0 49.5%,rgba(79,122,174,.13) 50.5% 100%)!important;
  box-shadow:0 0 0 2px rgba(255,237,153,.55),0 0 16px rgba(71,180,240,.26)!important;
}
.leftCluster.lane-touch-front.lane-touch-near .layerDepthRingVisual{
  background:linear-gradient(to bottom,rgba(75,141,180,.13) 0 49.5%,rgba(73,180,239,.82) 50.5% 100%)!important;
  box-shadow:0 0 0 2px rgba(255,237,153,.55),0 0 16px rgba(71,180,240,.26)!important;
}
.leftCluster.lane-touch-back.lane-touch-far .layerDepthFarRingVisual{
  background:linear-gradient(to bottom,rgba(92,194,245,.86) 0 49.5%,rgba(91,130,181,.09) 50.5% 100%)!important;
  box-shadow:0 0 0 2px rgba(255,237,153,.62),0 0 18px rgba(71,180,240,.30)!important;
}
.leftCluster.lane-touch-front.lane-touch-far .layerDepthFarRingVisual{
  background:linear-gradient(to bottom,rgba(88,151,190,.09) 0 49.5%,rgba(92,194,245,.86) 50.5% 100%)!important;
  box-shadow:0 0 0 2px rgba(255,237,153,.62),0 0 18px rgba(71,180,240,.30)!important;
}
.leftCluster.lane-touch-back .layerDepthRingBackLabel,
.leftCluster.lane-touch-front .layerDepthRingFrontLabel{color:#fff2a3!important;font-size:9px!important}
.leftCluster.depth-ring-back-active::after,.leftCluster.depth-ring-front-active::after{
  content:attr(data-depth-label)!important;position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;
  color:#fff2a3!important;font:900 8px/1 system-ui,sans-serif!important;letter-spacing:.05em!important;text-shadow:0 1px 3px #000!important;pointer-events:none!important;
}
#touchControls.controls-customizing .leftCluster .layerDepthRingVisual,
#touchControls.controls-customizing .leftCluster .layerDepthFarRingVisual,
#touchControls.controls-customizing .leftCluster .layerDepthRingLabel,
#topTouchControls.controls-customizing .leftCluster .layerDepthRingVisual,
#topTouchControls.controls-customizing .leftCluster .layerDepthFarRingVisual,
#topTouchControls.controls-customizing .leftCluster .layerDepthRingLabel{pointer-events:none!important}


/* STREETMADE M3.48.135P5P126 — fat-finger lane ring.
   Keep the inner joystick and neutral gap unchanged while making the BACK/FRONT
   annulus dramatically thicker and easier to enter with a large thumb. */

/* STREETMADE M3.48.135P5P130 — even thicker outer lane ring + wider neutral gap.
   Increase both the visible annulus size and the empty buffer between it and the
   normal joystick so fat-finger slides are more deliberate and less error-prone. */

/* P5P129: grab-direction safety is implemented in game JS; P128 solo-practice behavior is preserved. */

/* STREETMADE M3.48.135P5P131 — live-customizable lane ring geometry. */
/* STREETMADE M3.48.135P5P132 — ring bands remain dim until touched; exact touched half/band lights. */
.controlSettings #laneRingGap,.controlSettings #laneRingNearWidth,.controlSettings #laneRingFarWidth,.lbSettingsSection #lbLaneRingGap,.lbSettingsSection #lbLaneRingNearWidth,.lbSettingsSection #lbLaneRingFarWidth{width:100%;accent-color:#ffd76a}

/* STREETMADE M3.48.135P5P133 — gap-only click + expanded gap scaling.
   The moat is a true neutral touch zone; entering it briefly brightens its edge. */
.leftCluster.lane-gap-touch::before{
  border-color:rgba(255,235,152,.72)!important;
  box-shadow:0 0 0 5px rgba(8,18,30,.24),0 0 10px rgba(255,226,120,.20)!important;
}


/* STREETMADE M3.48.135P5P144 — always-visible ruler marks around the outer aiming ring.
   This is a separate overlay instead of a pseudo-element inside the masked FAR
   band, so the marks cannot disappear under the annulus mask. */
.leftCluster .layerAimRulerTicks{
  position:absolute!important;
  inset:calc(-1 * var(--lane-far-outer-extra-px,108px))!important;
  border-radius:50%!important;
  z-index:6!important;
  pointer-events:none!important;
  background:
    repeating-conic-gradient(from -90deg,rgba(255,255,255,.98) 0deg 1.15deg,transparent 1.15deg 30deg),
    repeating-conic-gradient(from -90deg,rgba(214,246,255,.88) 0deg .72deg,transparent .72deg 7.5deg)!important;
  -webkit-mask:radial-gradient(circle at center,transparent 0 calc(100% - 18px),#000 calc(100% - 17px) 100%)!important;
  mask:radial-gradient(circle at center,transparent 0 calc(100% - 18px),#000 calc(100% - 17px) 100%)!important;
  opacity:.98!important;
}
.leftCluster .layerAimRulerTicks::after{
  content:''!important;position:absolute!important;inset:0!important;border-radius:50%!important;pointer-events:none!important;
  background:repeating-conic-gradient(from -90deg,rgba(255,244,156,1) 0deg 1.8deg,transparent 1.8deg 30deg)!important;
  -webkit-mask:radial-gradient(circle at center,transparent 0 calc(100% - 25px),#000 calc(100% - 24px) 100%)!important;
  mask:radial-gradient(circle at center,transparent 0 calc(100% - 25px),#000 calc(100% - 24px) 100%)!important;
}
#touchControls.controls-customizing .leftCluster .layerAimRulerTicks,
#topTouchControls.controls-customizing .leftCluster .layerAimRulerTicks{pointer-events:none!important}


/* STREETMADE M3.48.135P5P169 — ergonomic rotatable movement pad on P166 performance baseline.
   Rotate only the inner visual/input assembly; the draggable HUD control box
   stays axis-aligned so placement, scaling and resize handles remain stable. */
body.lb-page-battle .leftCluster>.dpadRotator{
  position:absolute!important;inset:0!important;border-radius:50%!important;
  transform-origin:50% 50%!important;pointer-events:auto!important;
}
body.lb-page-battle .leftCluster.dpad-rotated>.dpadRotator{
  transform:rotate(var(--dpad-rotation,0deg))!important;
}
.controlSettings #controlRotation,
.lbSettingsSection #lbDpadRotationP1,
.lbSettingsSection #lbDpadRotationP2{width:100%;accent-color:#ffd76a}
.controlSettings #controlRotation:disabled{opacity:.35}

/* STREETMADE M3.48.135P5P171 — tablet battle HUD compositor flattening.
   The game loop is already finishing in only a few milliseconds; Android is
   missing presentation deadlines while compositing the translucent touch HUD.
   Keep every control, hit area, rotation, lane-ring setting and label, but use
   inexpensive borders/outlines instead of live masks, conic/radial effects,
   filters, animated shadows and transition-driven repaints during battle. */
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .rightCluster button.range-ready{
  animation:none!important;
  filter:none!important;
  box-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .rightCluster button,
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster .dir{
  transition:none!important;
  text-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster .dir.active{
  box-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster .dpadCenter{
  transition:none!important;
  background:rgba(84,116,151,.90)!important;
  border:2px solid rgba(220,239,255,.72)!important;
  box-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster.joystick-active .dpadCenter{
  box-shadow:none!important;
}
/* The old masked gradients describe two annuli whose widths already line up
   exactly with these border widths. A normal circular border preserves the
   same visual geometry without allocating mask/compositor surfaces. */
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster .layerDepthRingVisual{
  background:transparent!important;
  -webkit-mask:none!important;
  mask:none!important;
  border:var(--lane-near-width-px,52px) solid rgba(75,141,180,.17)!important;
  box-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster .layerDepthFarRingVisual{
  background:transparent!important;
  -webkit-mask:none!important;
  mask:none!important;
  border:var(--lane-far-width-px,43px) solid rgba(88,151,190,.12)!important;
  box-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster.lane-touch-near .layerDepthRingVisual{
  border-color:rgba(73,180,239,.72)!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster.lane-touch-far .layerDepthFarRingVisual{
  border-color:rgba(92,194,245,.76)!important;
}
/* Preserve an angular reference ring without the two repeating-conic gradients
   and radial masks. Dashed circular borders are static and cheap to composite. */
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster .layerAimRulerTicks{
  background:none!important;
  -webkit-mask:none!important;
  mask:none!important;
  border:2px dashed rgba(225,246,255,.78)!important;
  box-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster .layerAimRulerTicks::after{
  display:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster::before,
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .leftCluster.lane-gap-touch::before{
  box-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running #hud{
  text-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running #fighterHudGrid .fighterHud{
  background:#111722!important;
  box-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running .fighterHud .meter i{
  transition:none!important;
  filter:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running #modeLabel,
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running #arcadeScoreboard{
  background:#101722!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
html[data-lb-display-profile="tablet"] body.lb-page-battle.lb-battle-running #arcadeScoreboard.scoreFlash{
  box-shadow:none!important;
}


/* STREETMADE P182 — private developer tuning panel. */
.lbDevSettingsSection details>summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:18px;list-style-position:inside}
.lbDevSettingsSection details>summary span{font-size:12px;color:#9eb3ca;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.lbDevTuningGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 18px;margin-top:14px}
.lbDevTuningRange{margin-bottom:10px}
.lbDevTuningRange input{accent-color:#ffd76a}
.lbDevPresetButtons{margin-top:10px}
#lbDevPresetStatus.error{color:#ffadad}
@media(max-width:720px){.lbDevTuningGrid{grid-template-columns:1fr}}

/* STREETMADE P183 — World / Map tuning group headings. */
.lbWorldTuningGroup{grid-column:1/-1;margin:10px 0 2px;padding-top:8px;border-top:1px solid rgba(125,160,205,.22);font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#8db9df}
.lbMapHeaderPopover .lbDevTuningGrid{grid-template-columns:1fr!important;gap:3px!important;margin-top:4px!important}

/* STREETMADE P196 — private developer flight toggle. */
.lbDevToolToggle{display:flex;align-items:flex-start;gap:10px;margin:12px 0 8px;padding:10px 12px;border:1px solid rgba(255,215,106,.22);border-radius:10px;background:rgba(255,215,106,.055);cursor:pointer}
.lbDevToolToggle>input{margin-top:3px;accent-color:#ffd76a;transform:scale(1.1)}
.lbDevToolToggle>span{display:grid;gap:3px}.lbDevToolToggle small{color:#9eb3ca;line-height:1.35}


/* STREETMADE P208 — LAN guest control-surface lock preserved from P204.
   Guest touch controls are local hardware UI. They must not disappear because a
   host packet, resize, pointer media-query, workspace class, or generic hidden
   state changed. Keep only the bottom/local control set interactive. */
body.sm-lan-guest-live #touchControls,
body.sm-lan-guest-live #touchControls.hidden,
body.sm-lan-guest-live.lbTouchControlsHidden #touchControls,
body.sm-lan-guest-live.lb-page-battle.lb-battle-running #touchControls{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:none!important;
}
body.sm-lan-guest-live #touchControls .leftCluster,
body.sm-lan-guest-live #touchControls .rightCluster button{
  display:block!important;
  visibility:visible!important;
  pointer-events:auto!important;
}
body.sm-lan-guest-live #topTouchControls{display:none!important;pointer-events:none!important}
body.sm-lan-guest-live .lbTouchVisibilityToggle{display:none!important}

/* STREETMADE P222 — post-match replay controls. Hidden during live combat. */
#streetmadeReplayControls{position:fixed;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:6200;display:grid;grid-template-columns:auto minmax(150px,44vw) auto auto auto;align-items:center;gap:8px;width:min(760px,94vw);padding:9px 10px;border:1px solid rgba(126,205,255,.65);border-radius:14px;background:rgba(8,17,30,.94);box-shadow:0 12px 35px rgba(0,0,0,.45);color:#eaf6ff;backdrop-filter:blur(8px)}
#streetmadeReplayControls[hidden]{display:none!important}#streetmadeReplayControls button{min-height:40px;padding:7px 11px;border-radius:9px;font-weight:900}#streetmadeReplayControls input{width:100%}#streetmadeReplayControls [data-replay-time]{font:800 12px/1 system-ui;white-space:nowrap;color:#b9cce0}#streetmadeReplayControls>b{font:900 11px/1 system-ui;letter-spacing:.14em;color:#72d5ff}#streetmadeReplayControls.exporting>b::after{content:' · EXPORTING';color:#ffd970}.streetmade-replay-playing #touchControls,.streetmade-replay-playing #topTouchControls{display:none!important}
@media(max-width:680px){#streetmadeReplayControls{grid-template-columns:auto minmax(90px,1fr) auto auto;padding:8px;gap:6px}#streetmadeReplayControls>b{display:none}#streetmadeReplayControls button{min-height:38px;padding:6px 8px}.lbMatchResultActions{grid-template-columns:repeat(2,1fr)!important;flex-wrap:wrap}}
.streetmade-replay-playing #testClock{display:none!important}

/* STREETMADE P222 — result replay controls are static HTML and stay visible on phones. */
.lbMatchResultActions [data-sm-replay-watch],.lbMatchResultActions [data-sm-replay-video],.lbMatchResultActions [data-sm-replay-save]{display:block!important}
.lbMatchResultActions button:disabled{opacity:.46;filter:saturate(.55);cursor:not-allowed}
@media(max-width:680px){.lbMatchResultActions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}.lbMatchResultActions button{min-width:0!important;font-size:12px!important;padding:8px 5px!important;white-space:normal!important}}

/* P226E — Character header/action rails are genuinely swipeable on touch and wheel-scrollable on wide tablet layouts. */
.characterWorkshop.cwCreateParityLayout .cwTopActions{overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-x!important;overscroll-behavior-x:contain!important}
.characterWorkshop.cwCreateParityLayout .cwTopActions>*{flex:0 0 auto!important}
.characterWorkshop.cwCreateParityLayout .cwTopActions:has(.cwCommandMenu[open]){overflow:visible!important}
.characterWorkshop.cwCreateParityLayout .cwCreateActionBar{flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-x!important;overscroll-behavior-x:contain!important}
.characterWorkshop.cwCreateParityLayout .cwCreateActionBar>*{flex:0 0 auto!important}


/* STREETMADE P226K — itch windowed Character Workshop keeps its real proportions and controls usable. */
@media(max-width:840px){
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwTopbar{
    height:46px!important;min-height:46px!important;flex:0 0 46px!important;
    flex-wrap:nowrap!important;padding:4px 6px!important;gap:4px!important;overflow:visible!important
  }
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwTitleGroup{flex:0 0 auto!important;min-width:38px!important;max-width:38px!important;overflow:visible!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwTitleGroup>div{display:none!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow #cwHome{display:inline-flex!important;min-width:34px!important;width:34px!important;height:34px!important;min-height:34px!important;padding:0!important;align-items:center;justify-content:center}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwTopActions{gap:3px!important;min-width:0!important;overflow-x:auto!important;overflow-y:hidden!important;white-space:nowrap!important;scrollbar-width:thin!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwCommandMenu>summary{min-height:34px!important;height:34px!important;padding:0 7px!important;font-size:10px!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwHeaderExportAll,
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwHeaderFullscreen,
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwHeaderClose{min-height:34px!important;height:34px!important;padding:0 7px!important;font-size:10px!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwWorkspaceTabs{flex:0 0 40px!important;min-height:40px!important;padding:3px 6px!important;gap:5px!important;overflow-x:auto!important;overflow-y:hidden!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwWorkspaceTabs>button{flex:0 0 112px!important;min-width:112px!important;min-height:32px!important;height:32px!important;padding:4px 8px!important;font-size:10px!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow:not(.animateMode) .cwCreateActionBar{
    flex-wrap:wrap!important;overflow:visible!important;padding:3px 5px!important;gap:3px!important;align-content:center!important
  }
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwCreateActionBar button{min-height:32px!important;height:32px!important;padding:0 7px!important;font-size:10px!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwQuickShapePalette{left:50px!important;right:58px!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwQuickShapeGrid>button{flex-basis:66px!important;width:66px!important;min-width:66px!important}
  .characterWorkshop.cwCreateParityLayout.cwEmbeddedWindow .cwFreeformShelfPen span{font-size:20px!important}
}

/* STREETMADE P226U — Character lasso actions */
.characterWorkshop .cwLassoActions{position:absolute;z-index:68;top:12px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:5px;padding:6px 8px;border:1px solid #7a6b35;border-radius:10px;background:rgba(17,29,48,.96);box-shadow:0 8px 24px rgba(0,0,0,.32);color:#fff3b0}
.characterWorkshop .cwLassoActions[hidden]{display:none!important}.characterWorkshop .cwLassoActions button{min-height:34px;padding:0 9px;border:1px solid #536781;border-radius:7px;background:#203149;color:#eef5ff;font-weight:800}.characterWorkshop .cwLassoActions button:active{background:#315b80}
@media(max-width:700px){.characterWorkshop .cwLassoActions{top:6px;padding:4px;gap:3px}.characterWorkshop .cwLassoActions b{display:none}.characterWorkshop .cwLassoActions button{min-height:30px;padding:0 7px;font-size:10px}}


/* P226V — long-form saved fighter browser, inspired by community creation lists. */
.cwLoadPanel{align-items:stretch;justify-content:center;padding:16px}
.cwLoadCard{width:min(980px,96vw);height:min(86vh,840px);max-height:none;display:flex;flex-direction:column;overflow:hidden;padding:18px}
.cwCharacterBrowser{display:block;min-height:0;flex:1;margin:12px 0}
.cwBrowserArrow{display:none!important}
.cwCharacterViewport{height:100%;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y proximity;padding:2px 6px 12px 2px;scrollbar-width:thin}
.cwCharacterRail{display:flex;flex-direction:column;gap:12px;min-width:0;width:100%}
.cwCharacterCard{width:100%;min-height:142px;padding:10px;border:1px solid rgba(150,185,230,.28);border-radius:13px;background:rgba(20,34,55,.9);color:#eef5ff;display:grid;grid-template-columns:180px minmax(0,1fr) 34px;gap:16px;align-items:center;justify-items:stretch;scroll-snap-align:start;text-align:left;transform:none!important;transition:border-color .15s,background .15s,box-shadow .15s}
.cwCharacterCard:hover,.cwCharacterCard:focus-visible{border-color:#6899d3;background:rgba(29,48,76,.96)}
.cwCharacterCard.selected{border-color:#79b7ff;background:rgba(39,65,99,.97);box-shadow:inset 5px 0 0 #79b7ff,0 0 0 2px rgba(94,165,255,.13)}
.cwCharacterCardPreview{width:180px;height:112px;display:block;border-radius:9px;background:linear-gradient(180deg,rgba(90,130,180,.18),rgba(10,18,30,.12));object-fit:contain}
.cwCharacterCardMeta{min-width:0;display:flex;flex-direction:column;gap:5px;align-items:flex-start}
.cwCharacterCardMeta b{max-width:100%;font-size:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cwCharacterCardMeta small{font-size:12px;opacity:.78}
.cwCharacterCardMeta em{font-size:11px;font-style:normal;color:#8fb6df}
.cwCharacterCardType{display:flex;align-items:center;gap:7px;text-transform:uppercase;letter-spacing:.06em;font-size:10px;color:#a9bdd5}
.cwCharacterCardType i{font-style:normal;font-size:18px;color:#d8e8fa}
.cwCharacterCardArrow{font-size:34px;opacity:.55;text-align:center}
.cwSelectedCharacterInfo{flex:0 0 auto}
.cwCharacterManageActions,.cwLoadActions{flex:0 0 auto}
@media(max-width:640px){.cwLoadPanel{padding:8px}.cwLoadCard{width:98vw;height:min(88vh,820px);padding:10px}.cwCharacterCard{grid-template-columns:108px minmax(0,1fr) 20px;gap:9px;min-height:112px;padding:8px}.cwCharacterCardPreview{width:108px;height:86px}.cwCharacterCardMeta b{font-size:16px}.cwCharacterCardMeta em{display:none}.cwCharacterCardArrow{font-size:25px}}

/* Shared right-click editor image paste menu. */

/* STREETMADE P226Z15 — clear-glass fighter showcase main menu.
   The arena is zoomed farther out while the fighter remains close. Mode cards
   are truly see-through: no black card fill, only accent graphics and text. */
#lbMainMenu{
  isolation:isolate!important;
  display:block!important;
  padding:0!important;
  overflow:hidden!important;
  background:#07101b!important;
  color:#f4f8ff;
}
#lbMainMenu.hidden{display:none!important}
#lbMenuWorldCanvas,#lbMenuFighterCanvas{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  pointer-events:none;
}
#lbMenuFighterCanvas{z-index:2}
#lbMainMenu::before{display:none!important}
#lbMainMenu .lbMenuSceneShade{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(3,8,17,.76) 0%,rgba(3,8,17,.24) 27%,rgba(3,8,17,.01) 50%,rgba(3,8,17,.24) 73%,rgba(3,8,17,.76) 100%),
    linear-gradient(180deg,rgba(3,8,17,.50) 0%,transparent 19%,transparent 70%,rgba(3,8,17,.64) 100%);
}
#lbMainMenu .lbMenuShell{
  position:absolute!important;
  inset:0!important;
  z-index:4!important;
  width:auto!important;
  max-width:none!important;
  margin:0!important;
  padding:clamp(10px,1.8vw,22px)!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  display:grid!important;
  grid-template-rows:auto 1fr auto auto;
  gap:10px;
  pointer-events:none;
}
#lbMainMenu .lbMenuShell button{pointer-events:auto}
#lbMainMenu .lbMenuTopbar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
#lbMainMenu .lbMenuBrandLockup{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:7px 10px 8px;
  border-left:4px solid #ffcc39;
  background:linear-gradient(90deg,rgba(5,12,24,.82),rgba(5,12,24,.10));
  text-shadow:0 2px 8px #000;
}
#lbMainMenu .lbMenuBrandLockup strong{
  font-size:clamp(24px,4.1vw,50px);
  line-height:.95;
  font-weight:1000;
  letter-spacing:.035em;
  font-style:italic;
}
#lbMainMenu .lbMenuBrandLockup span{
  color:#dce8f6;
  font-size:clamp(8px,1vw,11px);
  font-weight:800;
  letter-spacing:.13em;
}
#lbMainMenu .lbMenuTopActions{display:flex;gap:7px;justify-content:flex-end}
#lbMainMenu .lbMenuUtility{
  min-width:78px;
  min-height:42px;
  padding:5px 10px;
  border:1px solid rgba(221,235,255,.32);
  border-radius:5px;
  background:rgba(7,16,30,.72);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  box-shadow:0 5px 16px rgba(0,0,0,.28);
}
#lbMainMenu .lbMenuUtility span{font-size:17px}
#lbMainMenu .lbMenuUtility b{font-size:11px;text-transform:uppercase;letter-spacing:.04em}
#lbMainMenu .lbMenuUtility:hover,#lbMainMenu .lbMenuUtility:focus-visible{border-color:#ffd24d;background:rgba(25,37,53,.93)}
#lbMainMenu .lbMenuModeLayout{
  min-height:0;
  display:grid;
  grid-template-columns:minmax(180px,24vw) minmax(180px,1fr) minmax(180px,24vw);
  gap:clamp(8px,2vw,24px);
  align-items:center;
}
#lbMainMenu .lbMenuSide{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:clamp(6px,1.1vh,11px);
  pointer-events:auto;
}
#lbMainMenu .lbMenuCenterStage{height:100%;min-height:230px;position:relative;pointer-events:none}
#lbMainMenu .lbMenuFighterPlate{
  position:absolute;
  left:50%;
  bottom:1.5%;
  transform:translateX(-50%);
  min-width:160px;
  max-width:75%;
  padding:7px 14px 8px;
  text-align:center;
  background:linear-gradient(90deg,transparent,rgba(6,14,27,.82) 16%,rgba(6,14,27,.82) 84%,transparent);
  text-shadow:0 2px 6px #000;
}
#lbMainMenu .lbMenuFighterPlate small,#lbMainMenu .lbMenuFighterPlate span{display:block;color:#cbd9ea;font-size:8px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
#lbMainMenu .lbMenuFighterPlate b{display:block;margin:2px 0;font-size:clamp(14px,1.7vw,22px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#lbMainMenu .lbModeCard.lbMenuVisualCard,#lbMainMenu .lbModeCard.lbMenuDockCard{
  --menu-accent:#ffd34d;
  position:relative;
  overflow:hidden;
  width:100%;
  min-height:0!important;
  height:clamp(64px,10.6vh,92px);
  padding:0!important;
  border:1px solid color-mix(in srgb,var(--menu-accent) 46%,rgba(224,236,255,.24))!important;
  border-radius:7px!important;
  background:linear-gradient(90deg,color-mix(in srgb,var(--menu-accent) 7%,transparent) 0%,color-mix(in srgb,var(--menu-accent) 3%,transparent) 44%,transparent 78%)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.055),0 0 14px color-mix(in srgb,var(--menu-accent) 5%,transparent)!important;
  display:block!important;
  color:#fff;
  text-align:left;
  transform:translateZ(0);
}
#lbMainMenu .lbModeCard.lbMenuPrimaryCard{height:clamp(84px,14vh,118px);border-width:2px!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.075),0 0 22px color-mix(in srgb,var(--menu-accent) 12%,transparent)!important}
#lbMainMenu .lbMenuBattleCard{--menu-accent:#ffcc43}
#lbMainMenu .lbMenuOnlineCard{--menu-accent:#5be5ff}
#lbMainMenu .lbMenuMapCard{--menu-accent:#ffad47}
#lbMainMenu .lbMenuCharacterCard{--menu-accent:#62efcd}
#lbMainMenu .lbMenuLanCard{--menu-accent:#a5ef66}
#lbMainMenu .lbMenuExchangeCard{--menu-accent:#bc83ff}
#lbMainMenu .lbMenuAssetCard{--menu-accent:#ffe36b}
#lbMainMenu .lbModeThumb{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  filter:none;
  transform:none;
  transition:transform .18s ease,filter .18s ease;
}
#lbMainMenu .lbModeOverlay{
  position:absolute;
  inset:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  padding:10px 12px 9px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--menu-accent) 8%,transparent) 0%,color-mix(in srgb,var(--menu-accent) 3%,transparent) 38%,transparent 72%);
  text-shadow:0 2px 5px #000;
}
#lbMainMenu .lbModeOverlay b{font-size:clamp(14px,1.8vw,21px);line-height:1.02;margin:2px 0 0;font-weight:1000;letter-spacing:.01em}
#lbMainMenu .lbModeCard.lbMenuPrimaryCard .lbModeOverlay b{font-size:clamp(19px,2.35vw,28px);text-transform:uppercase;font-style:italic;letter-spacing:.025em}
#lbMainMenu .lbModeOverlay small{
  display:block!important;
  max-width:62%;
  color:var(--menu-accent)!important;
  font-size:clamp(7px,.8vw,9px)!important;
  line-height:1.05!important;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.10em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#lbMainMenu .lbModeCard.lbMenuPrimaryCard .lbModeOverlay small{font-size:clamp(8px,.9vw,10px)!important}
#lbMainMenu .lbModeCard.lbMenuVisualCard::before,#lbMainMenu .lbModeCard.lbMenuDockCard::before{
  content:"";
  position:absolute;
  z-index:3;
  left:0;top:0;bottom:0;
  width:4px;
  background:var(--menu-accent);
  box-shadow:0 0 13px color-mix(in srgb,var(--menu-accent) 65%,transparent);
  pointer-events:none;
}
#lbMainMenu .lbModeCard.lbMenuVisualCard::after,#lbMainMenu .lbModeCard.lbMenuDockCard::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  border-bottom:3px solid color-mix(in srgb,var(--menu-accent) 40%,transparent);
  clip-path:polygon(0 0,100% 0,100% 76%,95% 100%,0 100%);
  pointer-events:none;
  transition:border-color .15s ease,box-shadow .15s ease;
}
#lbMainMenu .lbModeCard.lbMenuVisualCard:hover,#lbMainMenu .lbModeCard.lbMenuVisualCard:focus-visible,#lbMainMenu .lbModeCard.lbMenuDockCard:hover,#lbMainMenu .lbModeCard.lbMenuDockCard:focus-visible{
  border-color:var(--menu-accent)!important;
  outline:none;
  transform:translateY(-2px);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--menu-accent) 24%,transparent),0 0 24px color-mix(in srgb,var(--menu-accent) 22%,transparent)!important;
}
#lbMainMenu .lbModeCard.lbMenuVisualCard:hover .lbModeThumb,#lbMainMenu .lbModeCard.lbMenuVisualCard:focus-visible .lbModeThumb,#lbMainMenu .lbModeCard.lbMenuDockCard:hover .lbModeThumb,#lbMainMenu .lbModeCard.lbMenuDockCard:focus-visible .lbModeThumb{transform:scale(1.025);filter:brightness(1.12) saturate(1.08)}
#lbMainMenu .lbModeCard.lbMenuVisualCard:hover::after,#lbMainMenu .lbModeCard.lbMenuVisualCard:focus-visible::after,#lbMainMenu .lbModeCard.lbMenuDockCard:hover::after,#lbMainMenu .lbModeCard.lbMenuDockCard:focus-visible::after{border-bottom-color:var(--menu-accent);box-shadow:inset 0 -10px 20px color-mix(in srgb,var(--menu-accent) 12%,transparent)}
#lbMainMenu .lbMenuBottomDock{
  width:min(280px,27vw);
  justify-self:start;
  pointer-events:auto;
}
#lbMainMenu .lbMenuDockCard{height:clamp(56px,8.8vh,76px)!important}
#lbMainMenu .lbMenuFooter{
  margin:0!important;
  padding:2px 0!important;
  color:rgba(224,234,247,.78)!important;
  font-size:8px!important;
  letter-spacing:.035em;
  text-align:center!important;
  text-shadow:0 1px 4px #000;
}
@media (orientation:landscape) and (max-height:620px){
  #lbMainMenu .lbMenuShell{padding:8px 10px!important;gap:6px}
  #lbMainMenu .lbMenuModeLayout{grid-template-columns:minmax(160px,23vw) 1fr minmax(160px,23vw);gap:10px}
  #lbMainMenu .lbMenuSide{gap:5px}
  #lbMainMenu .lbModeCard.lbMenuVisualCard{height:58px}
  #lbMainMenu .lbModeCard.lbMenuPrimaryCard{height:76px}
  #lbMainMenu .lbMenuBottomDock{width:min(230px,24vw)}
  #lbMainMenu .lbMenuDockCard{height:48px!important}
  #lbMainMenu .lbModeOverlay{padding:6px 8px}
  #lbMainMenu .lbModeOverlay b{font-size:14px}
  #lbMainMenu .lbMenuFighterPlate{bottom:0;padding:4px 10px}
}
@media (orientation:portrait), (max-width:700px){
  #lbMainMenu .lbMenuSceneShade{background:linear-gradient(180deg,rgba(3,8,17,.58),rgba(3,8,17,.05) 26%,rgba(3,8,17,.10) 48%,rgba(3,8,17,.80) 72%)}
  #lbMainMenu .lbMenuShell{padding:9px!important;grid-template-rows:auto 1fr auto auto}
  #lbMainMenu .lbMenuBrandLockup strong{font-size:29px}
  #lbMainMenu .lbMenuTopActions{gap:4px}
  #lbMainMenu .lbMenuUtility{min-width:48px;padding:4px 7px}.lbMenuUtility b{display:none}
  #lbMainMenu .lbMenuModeLayout{grid-template-columns:1fr 1fr;gap:7px;align-content:end;padding-top:32vh}
  #lbMainMenu .lbMenuCenterStage{position:absolute;left:22%;right:22%;top:12%;height:43%;min-height:0}
  #lbMainMenu .lbMenuFighterPlate{bottom:0;max-width:100%;min-width:120px}
  #lbMainMenu .lbMenuSide{gap:6px}
  #lbMainMenu .lbModeCard.lbMenuVisualCard{height:64px}
  #lbMainMenu .lbModeCard.lbMenuPrimaryCard{height:82px}
  #lbMainMenu .lbModeOverlay{padding:7px 8px 6px}
  #lbMainMenu .lbModeOverlay b{font-size:13px}
  #lbMainMenu .lbModeOverlay small{font-size:7px!important}
  #lbMainMenu .lbMenuBottomDock{width:50%;justify-self:start}
  #lbMainMenu .lbMenuDockCard{height:58px!important}
  #lbMainMenu .lbMenuFooter{font-size:7px!important}
}

/* P226Z15 wins over the legacy compact-menu rules on phone profiles too. */
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu{
  padding:0!important;
  overflow:hidden!important;
  align-items:initial!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbMenuShell{
  position:absolute!important;
  inset:0!important;
  width:auto!important;
  max-height:none!important;
  margin:0!important;
  padding:8px!important;
  overflow:hidden!important;
  display:grid!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeCard.lbMenuVisualCard,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeCard.lbMenuDockCard{
  min-height:0!important;
  padding:0!important;
  gap:0!important;
  border-radius:6px!important;
}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeCard.lbMenuVisualCard b,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeCard.lbMenuDockCard b{font-size:13px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeCard.lbMenuVisualCard small,
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbModeCard.lbMenuDockCard small{display:block!important;font-size:7px!important}
:is(html.lbCompactEditor,html[data-lb-display-profile="phone"]) #lbMainMenu .lbMenuFooter{margin:0!important;font-size:7px!important}
