/* === editor.html :: inline-style-1 === */
:root{
      --bg:#070f0b; --panel:#0b1220; --panel2:#0f172a; --line:#1f2937; --text:#e5e7eb; --muted:#94a3b8;
      --accent:#16a34a; --accent-dark:#15803d; --sidebar-w:168px; --topbar-h:72px;
      --container-bg: radial-gradient(circle at 20% 0%, #0b1f17 0%, #070f0b 60%);
      --panel-glass: rgba(11,18,32,0.85);
      --topbar-bg: linear-gradient(180deg,#0b1220,#020617);
      --button-bg: linear-gradient(180deg,#0f172a,#020617);
    }
    body.theme-light{
      --bg:#edf5ef; --panel:#ffffff; --panel2:#f8faf8; --line:#d7e2da; --text:#0f172a; --muted:#475569;
      --accent:#16a34a; --accent-dark:#15803d;
      --container-bg: radial-gradient(circle at 20% 0%, #eff7f1 0%, #dbe9de 60%);
      --panel-glass: rgba(255,255,255,0.86);
      --topbar-bg: linear-gradient(180deg,#ffffff,#f3f7f4);
      --button-bg: linear-gradient(180deg,#ffffff,#f2f7f3);
    }
    *{ box-sizing:border-box; }
    html,body{ width:100%; height:100%; }
    body{
      margin:0; background:var(--container-bg); font-family:Arial, Helvetica, sans-serif;
      color:var(--text); overflow:hidden; transition: background .25s ease, color .25s ease;
    }
    body.presentation #topbar, body.presentation #leftbar, body.presentation #rightbar{ display:none; }
    body.presentation #container{ top:0; left:0; right:0; bottom:0; }
    #topbar{
      overflow:visible !important;
      position:fixed; top:0; left:0; right:0; min-height:56px; display:flex; align-items:center; justify-content:space-between;
      gap:8px; padding:6px 10px; overflow:hidden; white-space:nowrap; background:var(--topbar-bg);
      border-bottom:1px solid rgba(255,255,255,0.06); z-index:20; flex-wrap:nowrap; backdrop-filter:blur(8px);
      box-shadow:0 8px 20px rgba(0,0,0,.18); transition: background .25s ease;
    }
    body.theme-light #topbar{ border-bottom:1px solid rgba(15,23,42,0.08); box-shadow:0 8px 20px rgba(15,23,42,.08); }
    #topbar .bar-section{ display:flex; align-items:center; gap:4px; min-width:0; flex-wrap:nowrap; white-space:nowrap; }
    #topbar .bar-section:first-child{ flex:1 1 auto; }
    #topbar .bar-section:last-child{ margin-left:auto; flex:1 1 auto; justify-content:flex-end; }
    #leftbar,#rightbar{
      overflow-x:hidden;
      position:fixed; top:var(--topbar-h); bottom:0; width:var(--sidebar-w); padding:12px 10px; background:var(--panel-glass);
      backdrop-filter:blur(12px); overflow:auto; z-index:15; border-color:rgba(255,255,255,0.05); transition:background .25s ease;
    }
    #leftbar{ left:0; border-right:1px solid rgba(255,255,255,0.05); display:flex; flex-direction:column; justify-content:space-between; }
    #rightbar{ right:0; border-left:1px solid rgba(255,255,255,0.05); }
    body.theme-light #leftbar, body.theme-light #rightbar{ border-color: rgba(15,23,42,0.08); }
    .panel-group{ margin-bottom:18px; }
    .panel-title{ font-weight:700; color:#86efac; margin-bottom:10px; font-size:13px; letter-spacing:.5px; }
    body.theme-light .panel-title{ color:#15803d; }
    button, input[type="text"], input[type="color"], select{
      height:28px; border-radius:8px; border:1px solid var(--line); background:var(--button-bg); color:var(--text);
      padding:0 10px; outline:none; font:inherit; font-size:12px; backdrop-filter:blur(4px); transition:all .2s ease;
    }
    select option{
      background:#0f172a;
      color:#e5eefb;
    }
    body.theme-light select option{
      background:#ffffff;
      color:#0f172a;
    }
    button{ cursor:pointer; font-weight:600; }
    button:hover{ background:var(--accent-dark); color:white; border-color:var(--accent-dark); }
    button.active{ background:var(--accent); border-color:var(--accent); color:white; box-shadow:0 0 10px rgba(22,163,74,0.5), inset 0 0 6px rgba(255,255,255,0.1); }
    button:active{ transform:scale(0.96); }
    button.danger{ background:linear-gradient(180deg,#3a1616,#210c0c); border-color:#6b1b1b; color:#fecaca; }
    #leftbar .tool, #rightbar .tool{ width:100%; margin-bottom:8px; display:block; text-align:left; }
    #playerName{ width:90px; }
    #container{ position:absolute; top:var(--topbar-h); left:var(--sidebar-w); right:var(--sidebar-w); bottom:0; background:var(--container-bg); transition:background .25s ease; }
    #branding{
      margin-top:auto;
      display:flex;
      align-items:center;
      justify-content:center;
      padding:12px;
      border-radius:16px;
      background:rgba(17,24,39,.95);
      border:1px solid #1f2937;
      box-shadow:0 8px 20px rgba(0,0,0,.25);
      transition:all .2s ease;
    }
    body.theme-light #branding{
      background:rgba(255,255,255,.95);
      border-color:#dbe6dd;
      box-shadow:0 8px 18px rgba(15,23,42,.08);
    }
    #branding:hover{ transform:translateY(-2px); }
    #branding img{
      width:100%;
      max-width:140px;
      height:auto;
      display:block;
      object-fit:contain;
      margin:0 auto;
      background:transparent;
      border-radius:0;
      flex:none;
    }
    .icon-btn{ width:28px; min-width:28px; padding:0; display:inline-flex; align-items:center; justify-content:center; font-size:13px; }
    .icon-btn i{ pointer-events:none; }
.matchday-text-btn{
  width:auto !important;
  min-width:108px !important;
  padding:0 14px !important;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}
@media (max-width: 1280px){
  .matchday-text-btn{
    min-width:96px !important;
    padding:0 12px !important;
    font-size:11px;
  }
}

    .icon-sep{ width:1px; height:24px; background:rgba(255,255,255,0.08); margin:0 2px; }
    body.theme-light .icon-sep{ background:rgba(15,23,42,0.1); }
    .tool:hover{ background:rgba(22,163,74,0.2); border-color:var(--accent); }
    .toolbar-title{ font-weight:700; color:var(--text); margin-right:2px; font-size:12px; align-self:center; }
    .small-select{ width:82px; }
    .zone-opacity-popover{
      position:fixed;
      z-index:32;
      display:none;
      padding:10px 12px;
      border-radius:12px;
      border:1px solid rgba(34,197,94,.28);
      background:rgba(8,15,29,.96);
      box-shadow:0 14px 28px rgba(0,0,0,.35);
      backdrop-filter:blur(10px);
      min-width:148px;
    }
    .zone-opacity-popover.is-visible{ display:block; }
#animationTargetPopover{
  z-index:132;
  max-width:calc(100vw - 16px);
  max-height:calc(100vh - 16px);
  max-height:calc(100dvh - 16px);
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
#animationTargetPopover.is-pending-points{ opacity:1; pointer-events:auto; }
#animationTargetPopover.is-pending-points .anim-target-point-controls,
#animationTargetPopover.is-pending-points #removeLastAnimationTarget,
#animationTargetPopover.is-pending-points #clearAnimationTarget{ opacity:.45; pointer-events:none; }
    .zone-opacity-popover .zone-opacity-popover-label{
      margin:0 0 8px;
      font-size:11px;
      font-weight:800;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#9fb0c6;
    }
    .zone-opacity-popover select{
      width:100%;
      height:34px;
      font-size:13px;
      font-weight:700;
    }
    .zone-opacity-popover-row{
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:8px;
      align-items:center;
    }
    .zone-delete-btn, .selection-delete-btn{
      height:34px;
      min-width:88px;
      border-radius:10px;
      border:1px solid #6b1b1b;
      background:linear-gradient(180deg,#3a1616,#210c0c);
      color:#fecaca;
      font-weight:800;
      cursor:pointer;
    }
    .selection-delete-popover{
      position:fixed;
      z-index:32;
      display:none;
      padding:10px 12px;
      border-radius:12px;
      border:1px solid rgba(239,68,68,.28);
      background:rgba(8,15,29,.96);
      box-shadow:0 14px 28px rgba(0,0,0,.35);
      backdrop-filter:blur(10px);
    }
    .selection-delete-popover.is-visible{ display:block; }
    .animation-order-popover{ min-width:168px; }
    #perfBadge{ min-width:52px; text-align:center; font-size:11px; color:var(--muted); padding:0 6px; user-select:none; }
    .hint{ font-size:11px; color:var(--muted); line-height:1.35; padding:8px 2px 0; }
.anim-target-actions{ display:grid; gap:8px; }
.anim-target-actions button{ width:100%; text-align:center; }
.anim-target-actions button.is-pending{ background:var(--accent); border-color:var(--accent); color:#fff; }
.anim-target-actions button.is-subtle{ background:linear-gradient(180deg,#111827,#020617); color:var(--muted); }
.anim-target-actions button.is-subtle:hover{ color:#fff; }
    .library-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
    .drag-item{
      border:1px solid var(--line); border-radius:10px; min-height:54px; background:var(--button-bg);
      display:flex; align-items:center; justify-content:center; cursor:grab; user-select:none; position:relative; overflow:hidden;
      padding:6px; transition:transform .12s ease, border-color .12s ease, background .12s ease;
    }
    button.zone-tool-button{
      width:100%;
      color:inherit;
      font:inherit;
      cursor:pointer;
      touch-action:none;
      -ms-touch-action:none;
      -webkit-tap-highlight-color:transparent;
      -webkit-user-select:none;
      user-select:none;
    }
    .zone-tool-button.is-touch-pressed{
      border-color:var(--accent);
      background:rgba(22,163,74,.14);
      transform:translateY(0);
    }
    .drag-item:hover{ transform:translateY(-1px); border-color:var(--accent); background:rgba(22,163,74,0.14); }
    .drag-item:active{ cursor:grabbing; }
    .drag-item img{ max-width:38px; max-height:38px; object-fit:contain; pointer-events:none; filter:drop-shadow(0 3px 6px rgba(0,0,0,.28)); }
    .drag-item span{
      position:absolute; left:4px; right:4px; bottom:3px; font-size:10px; text-align:center; color:var(--text);
      pointer-events:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
    }

    .drag-item.material-selected{
      border-color: var(--accent) !important;
      background: rgba(22,163,74,0.18) !important;
      box-shadow: 0 0 0 1px rgba(22,163,74,0.35) inset, 0 0 12px rgba(22,163,74,0.28);
    }

    .continuous-placement-overlay{
      position:fixed;
      left:50%;
      bottom:24px;
      z-index:40;
      display:none;
      align-items:center;
      gap:10px;
      max-width:min(560px,calc(100vw - 36px));
      padding:9px 10px 9px 14px;
      border:1px solid rgba(34,197,94,.42);
      border-radius:14px;
      background:rgba(8,15,29,.94);
      color:#f8fafc;
      box-shadow:0 16px 34px rgba(0,0,0,.38), 0 0 0 1px rgba(255,255,255,.04) inset;
      backdrop-filter:blur(12px);
      transform:translateX(-50%);
    }
    .continuous-placement-overlay.is-visible{ display:flex; }
    .continuous-placement-overlay__status{
      min-width:0;
      display:flex;
      align-items:center;
      gap:8px;
      font-size:12px;
      font-weight:800;
    }
    .continuous-placement-overlay__status i{
      flex:0 0 auto;
      color:#4ade80;
    }
    .continuous-placement-overlay__status span{
      min-width:0;
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }
    #continuousPlacementStop{
      flex:0 0 auto;
      height:34px;
      padding:0 14px;
      border-color:#22c55e;
      background:linear-gradient(180deg,#22c55e,#15803d);
      color:#fff;
      font-size:12px;
      font-weight:900;
    }
    #continuousPlacementStop:hover{
      border-color:#4ade80;
      background:linear-gradient(180deg,#4ade80,#16a34a);
    }
    body.theme-light .continuous-placement-overlay{
      border-color:rgba(21,128,61,.28);
      background:rgba(255,255,255,.96);
      color:#0f172a;
      box-shadow:0 16px 34px rgba(15,23,42,.18);
    }
    body.presentation .continuous-placement-overlay{ display:none !important; }
    @media (max-width: 680px){
      .continuous-placement-overlay{
        bottom:88px;
        width:calc(100vw - 24px);
        justify-content:space-between;
      }
      .continuous-placement-overlay__status{ font-size:11px; }
      #continuousPlacementStop{ padding:0 12px; font-size:11px; }
    }

    .drop-ghost{
      position:fixed; width:58px; height:58px; pointer-events:none; z-index:9999; transform:translate(-50%,-50%);
      opacity:.92; filter:drop-shadow(0 8px 12px rgba(0,0,0,.35)); object-fit:contain;
    }
    @media (max-width: 1280px){
      :root{ --sidebar-w:148px; }
      #topbar .bar-section{ gap:3px; }
      button, input[type="text"], input[type="color"], select{ font-size:10px; height:26px; padding:0 6px; }
      .icon-btn{ width:26px; min-width:26px; }
      #playerName{ width:68px; }
      .small-select{ width:74px; }
      .drag-item img{ max-width:40px; max-height:40px; }
    }
    @media (max-width: 980px){
      :root{ --sidebar-w:132px; }
      .toolbar-title{ display:none; }
      .small-select{ width:68px; }
      .library-grid{ grid-template-columns:1fr; }
    }
  
.player-preview{display:flex;align-items:center;justify-content:center;}
.player-preview.circle{width:26px;height:26px;border-radius:50%;background:#ff5b00;border:2px solid white;}
.player-preview.shirt{width:30px;height:30px;background:linear-gradient(135deg,rgba(255,255,255,.24),rgba(255,91,0,.10) 38%,rgba(0,0,0,.18)),#ff5b00;clip-path:polygon(35% 6%,65% 6%,73% 12%,83% 18%,87% 30%,77% 39%,73% 92%,27% 92%,23% 39%,13% 30%,17% 18%,27% 12%);border:2px solid white;box-shadow:inset 0 0 0 2px rgba(255,255,255,.12),0 3px 8px rgba(0,0,0,.28);}


.action-preview{
  width:42px;
  height:42px;
  position:relative;
}

/* contínua */
.action-preview.line::before{
  content:"";
  position:absolute;
  left:6px;
  right:6px;
  top:50%;
  height:3px;
  background:white;
  border-radius:999px;
  transform:translateY(-50%);
}

/* contínua + seta */
.action-preview.arrow::before{
  content:"";
  position:absolute;
  left:6px;
  right:13px;
  top:50%;
  height:3px;
  background:white;
  border-radius:999px;
  transform:translateY(-50%);
}
.action-preview.arrow::after{
  content:"";
  position:absolute;
  right:6px;
  top:50%;
  width:0;
  height:0;
  border-left:8px solid white;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  transform:translateY(-50%);
}

/* tracejada */
.action-preview.pass::before{
  content:"";
  position:absolute;
  left:6px;
  right:6px;
  top:50%;
  height:0;
  border-top:3px dashed white;
  transform:translateY(-50%);
}

/* tracejada + seta */
.action-preview.pass-arrow::before{
  content:"";
  position:absolute;
  inset:0;
  background:center/34px 18px no-repeat url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 24'%3E%3Cpath d='M3 12 H34' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-dasharray='8 6'/%3E%3Cpath d='M33 6 L43 12 L33 18 Z' fill='white'/%3E%3C/svg%3E");
}

/* curva */
.action-preview.curve-only::before{
  content:"";
  position:absolute;
  inset:0;
  background:center/34px 26px no-repeat url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 32'%3E%3Cpath d='M6 25 C15 7, 28 7, 40 18' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* curva + seta */
.action-preview.curve-arrow::before{
  content:"";
  position:absolute;
  inset:0;
  background:center/34px 26px no-repeat url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 32'%3E%3Cpath d='M6 25 C15 7, 28 7, 37 16' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M34 10 L44 16 L34 22 Z' fill='white'/%3E%3C/svg%3E");
}

/* mantidos */
.action-preview.run::before{
  content:"";
  position:absolute;
  top:50%;
  left:5px;
  right:5px;
  height:3px;
  background:white;
  box-shadow:0 0 6px lime;
}
.action-preview.dribble::before{
  content:"";
  position:absolute;
  top:50%;
  left:5px;
  right:5px;
  height:3px;
  border-top:3px dotted white;
}


.action-preview.zoneRect::before{
  content:"";
  position:absolute;
  left:6px;
  right:6px;
  top:8px;
  bottom:8px;
  border:2px dashed #60a5fa;
}
.action-preview.zoneCircle::before{
  content:"";
  position:absolute;
  width:28px;
  height:28px;
  border-radius:50%;
  border:2px dashed #86efac;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}

.shape-preview{
  width:40px;
  height:40px;
  position:relative;
}
.shape-preview.triangle::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:0;
  height:0;
  border-left:14px solid transparent;
  border-right:14px solid transparent;
  border-bottom:26px solid #fbbf24;
  transform:translate(-50%,-45%);
}
.shape-preview.pentagon::before,
.shape-preview.hexagon::before,
.shape-preview.octagon::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:28px;
  height:28px;
  border:3px solid #fbbf24;
  transform:translate(-50%,-50%);
}
.shape-preview.pentagon::before{ clip-path:polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%); }
.shape-preview.hexagon::before{ clip-path:polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%); }
.shape-preview.octagon::before{ clip-path:polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%); }
.shape-preview.freeDraw::before{
  content:"";
  position:absolute;
  left:5px;
  right:5px;
  top:8px;
  bottom:8px;
  border-top:3px dashed #fbbf24;
  border-radius:12px;
  transform:rotate(-14deg);
}
.vertex-handle{
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.35));
}


.field-btn::before{
  content:"";
  width:30px;
  height:30px;
  display:block;
  margin:0 auto 4px;
  border-radius:6px;
}
.field-btn[data-field="default"]::before{
  background: repeating-linear-gradient(90deg,#2e7d32,#2e7d32 10px,#27692a 10px,#27692a 20px);
}
.field-btn[data-field="horizontal"]::before{
  background: repeating-linear-gradient(0deg,#2e7d32,#2e7d32 10px,#27692a 10px,#27692a 20px);
}
.field-btn[data-field="plain"]::before{
  background:#2e7d32;
}
.field-btn[data-field="white"]::before{
  background:#fff;border:1px solid #ccc;
}





/* FIX SVG previews that ignore currentColor */
body.theme-dark .action-preview{
  color:#ffffff;
}

body.theme-dark .action-preview::before,
body.theme-dark .action-preview::after{
  filter: invert(0);
}

body.theme-light .action-preview::before,
body.theme-light .action-preview::after{
  filter: invert(1);
}


/* ===== TABLET UX ONLY ===== */
@media (max-width: 1024px) {
  :root{
    --sidebar-w: 124px;
  }

  #topbar{
    overflow:visible !important;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding:8px 8px;
    gap:6px;
  }
  #topbar::-webkit-scrollbar{ display:none; }

  #leftbar,
  #rightbar{
    width:var(--sidebar-w);
    padding:10px 8px;
    -webkit-overflow-scrolling:touch;
  }

  #container{
    left:var(--sidebar-w);
    right:var(--sidebar-w);
  }

  .library-grid{
    grid-template-columns:1fr;
    gap:10px;
  }

  .drag-item{
    min-height:60px;
    padding:8px;
    border-radius:12px;
    touch-action:manipulation;
  }

  .drag-item img{
    max-width:42px;
    max-height:42px;
  }

  #leftbar .tool,
  #rightbar .tool{
    min-height:42px;
    font-size:13px;
  }

  .icon-btn{
    width:34px;
    min-width:34px;
    height:34px;
    font-size:15px;
  }

  .panel-title{
    font-size:12px;
    margin-bottom:8px;
  }

  #branding{
    padding:10px;
    border-radius:14px;
  }

  #branding img{
    max-width:110px;
  }
}


.color-palette{
  display:grid;
  grid-template-columns:repeat(5, minmax(0,1fr));
  gap:6px;
  margin-bottom:8px;
}
.color-swatch{
  width:100%;
  aspect-ratio:1 / 1;
  border-radius:8px;
  border:2px solid rgba(255,255,255,0.35);
  cursor:pointer;
  padding:0;
  min-height:28px;
}
body.theme-light .color-swatch{
  border-color:rgba(15,23,42,0.22);
}
.color-swatch[data-color="#ffffff"]{
  border-color:#94a3b8;
}
.color-swatch.is-active{
  border-color:#86efac !important;
  box-shadow:0 0 0 2px rgba(var(--workspace-accent-rgb,34,197,94),.28), 0 0 0 1px rgba(var(--workspace-accent-rgb,34,197,94),.85) inset;
}
#formationSelect{
  width:100%;
  height:40px;
  padding:0 34px 0 12px;
  border-radius:12px;
  background:linear-gradient(180deg,#07111f,#020617) !important;
  color:#f8fafc !important;
  border:1px solid rgba(100,116,139,.45) !important;
  font-weight:700;
  font-size:13px;
  letter-spacing:0;
  box-shadow:0 8px 18px rgba(2,6,23,.16);
}
#formationSelect:focus{
  border-color:#22c55e !important;
  box-shadow:0 0 0 3px rgba(34,197,94,.15), 0 10px 24px rgba(2,6,23,.18);
}
#formationSelect option{
  background:#0b1220;
  color:#f8fafc;
  font-weight:700;
}
body.theme-light #formationSelect{
  background:linear-gradient(180deg,#ffffff,#f2f7f3) !important;
  color:#0f172a !important;
  border-color:rgba(100,116,139,.3) !important;
}
body.theme-light #formationSelect option{
  background:#ffffff;
  color:#0f172a;
}
@media (max-width: 980px){
  #formationSelect{
    height:38px;
    padding:0 32px 0 10px;
    font-size:12px;
  }
}

input[type="color"]{
  display:none !important;
}
    #container.perspective-tv{ overflow:hidden; pointer-events:auto; }
    #container.perspective-tv .konvajs-content{ will-change:transform; backface-visibility:hidden; }
    #togglePerspectiveTV.active, #toggleFieldOrientation.active{ background:var(--accent); border-color:var(--accent); color:white; box-shadow:0 0 10px rgba(22,163,74,0.5), inset 0 0 6px rgba(255,255,255,0.1); }

#topbar, #leftbar, #rightbar{ pointer-events:auto; }
/* === editor.html :: inline-style-2 === */
.locked-feature { position: relative; opacity: 0.6; }
.locked-feature::after {
  content: "🔒";
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  line-height: 1;
  pointer-events: none;
}
.icon-btn.locked-feature::after,
.view-trigger.locked-feature::after,
.export-trigger.locked-feature::after,
.project-trigger.locked-feature::after {
  top: -5px;
  right: -5px;
  transform: none;
  background: #0b1220;
  border-radius: 999px;
  padding: 2px;
  border: 1px solid #2a3a5a;
}
.export-dropdown button.locked-feature,
.project-dropdown button.locked-feature,
.view-dropdown button.locked-feature {
  padding-right: 28px;
}
.upgrade-btn{
  display:none; align-items:center; gap:8px; height:34px; padding:0 16px; border:none;
  border-radius:999px; background:linear-gradient(135deg,#22c55e 0%, #16a34a 55%, #15803d 100%);
  color:#fff; font-weight:800; font-size:12px; letter-spacing:.3px;
  box-shadow:0 8px 18px rgba(34,197,94,.28), inset 0 1px 0 rgba(255,255,255,.15);
}
.upgrade-btn:hover{
  background:linear-gradient(135deg,#4ade80 0%, #22c55e 55%, #16a34a 100%);
  border:none; color:#fff; transform:translateY(-1px);
}
.upgrade-modal{
  position:fixed; inset:0; background:var(--workspace-modal-backdrop); display:none; align-items:center;
  justify-content:center; z-index:9999; backdrop-filter:blur(8px);
}
.upgrade-box{
  width:min(420px, calc(100vw - 32px)); padding:26px 24px 20px; border-radius:22px;
  background: radial-gradient(circle at top, rgba(var(--workspace-accent-rgb,34,197,94),.14), transparent 35%), var(--workspace-modal-card-bg);
  border:1px solid var(--workspace-modal-soft-border); box-shadow:var(--workspace-modal-shadow); color:var(--workspace-modal-text);
}
.upgrade-badge{
  display:inline-flex; align-items:center; gap:8px; min-height:30px; padding:0 12px; border-radius:999px;
  background:rgba(var(--workspace-accent-rgb,34,197,94),.14); color:var(--workspace-accent-text,#86efac); border:1px solid rgba(var(--workspace-accent-rgb,34,197,94),.3); font-size:12px; font-weight:800;
  letter-spacing:.4px; text-transform:uppercase;
}
.upgrade-title{ margin:16px 0 8px; font-size:28px; line-height:1.1; font-weight:900; color:var(--workspace-modal-title); }
.upgrade-subtitle{ margin:0 0 18px; color:var(--workspace-modal-subtle); font-size:14px; line-height:1.55; }
.upgrade-list{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.upgrade-list li{ display:flex; align-items:flex-start; gap:10px; font-size:14px; color:var(--workspace-modal-text); }
.upgrade-list li::before{ content:"✓"; color:var(--workspace-accent,#22c55e); font-weight:900; font-size:14px; line-height:1.4; margin-top:1px; }
.upgrade-actions{ display:flex; gap:10px; margin-top:18px; }
.upgrade-actions button{ flex:1 1 0; height:40px; border-radius:12px; font-weight:800; font-size:14px; cursor:pointer; }
.btn-upgrade{ background:linear-gradient(135deg,var(--workspace-accent,#22c55e) 0%, var(--workspace-accent-dark,#16a34a) 55%, var(--workspace-accent-dark,#15803d) 100%); border:none; color:var(--workspace-accent-contrast,#fff); box-shadow:0 10px 18px rgba(var(--workspace-accent-rgb,34,197,94),.22); }
.btn-upgrade:hover{ background:linear-gradient(135deg,var(--workspace-accent,#22c55e) 0%, var(--workspace-accent,#22c55e) 55%, var(--workspace-accent-dark,#16a34a) 100%); border:none; color:#fff; }
.btn-close{ background:var(--workspace-modal-input-bg); border:1px solid var(--workspace-modal-border); color:var(--workspace-modal-subtle); }
.btn-close:hover{ background:var(--workspace-modal-hover-bg); color:#fff; border-color:var(--workspace-modal-border-strong); }

@media (max-width:480px){
  .upgrade-box{padding:22px 18px 18px; border-radius:18px;}
  .upgrade-title{font-size:24px;}
  .upgrade-actions{display:grid; grid-template-columns:1fr;}
  .upgrade-actions button{width:100%; min-height:42px; height:auto; padding:10px 12px;}
}


/* === editor.html :: inline-style-3 === */
#userMenu{
  position:relative;
}
#userDropdown{
  display:none;
  position:absolute !important;
  right:0 !important;
  top:calc(100% + 6px) !important;
  min-width:170px;
  opacity:0;
  visibility:hidden;
  transform:translateY(-8px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
}
#userDropdown.show{
  display:block !important;
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}


/* === editor.html :: inline-style-4 === */
#userDropdown {
  display:flex !important;
  flex-direction:column;
  gap:6px;
}
#userDropdown button {
  display:block !important;
  width:100%;
}


/* === editor.html :: mfe-premium-modals === */
.mfe-modal-anim{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease, visibility .22s ease;
}
.mfe-modal-anim.show{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.mfe-modal-anim .mfe-modal-card{
  opacity:0;
  transform:translateY(18px) scale(.985);
  transition:transform .24s cubic-bezier(.22,1,.36,1), opacity .24s ease;
}
.mfe-modal-anim.show .mfe-modal-card{
  opacity:1;
  transform:translateY(0) scale(1);
}
#exportNameModal,
#confirmActionModal{
  z-index:10060;
}
#exportNameModal .mfe-export-card,
#confirmActionModal .mfe-export-card,
#editorLoadProgressModal .mfe-load-progress-card{
  width:min(420px, calc(100vw - 32px));
  padding:22px;
  border-radius:20px;
  background:
    radial-gradient(circle at top, rgba(var(--workspace-accent-rgb,34,197,94),.12), transparent 42%),
    var(--workspace-modal-card-bg);
  border:1px solid var(--workspace-modal-soft-border);
  box-shadow:var(--workspace-modal-shadow);
  color:var(--workspace-modal-text);
}
#exportNameModal .mfe-export-badge,
#confirmActionModal .mfe-export-badge,
#editorLoadProgressModal .mfe-export-badge{
  display:inline-flex;
  align-items:center;
  justify-self:start;
  width:max-content;
  max-width:100%;
  gap:8px;
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(var(--workspace-accent-rgb,34,197,94),.14);
  color:var(--workspace-accent-text,#86efac);
  border:1px solid rgba(var(--workspace-accent-rgb,34,197,94),.28);
  font-size:12px;
  font-weight:800;
  letter-spacing:.35px;
  text-transform:uppercase;
}
#exportNameModal .mfe-export-title,
#confirmActionModal .mfe-export-title{
  margin:14px 0 8px;
  font-size:24px;
  line-height:1.1;
  font-weight:900;
  color:var(--workspace-modal-title);
}
#exportNameModal .mfe-export-subtitle,
#confirmActionModal .mfe-export-subtitle{
  margin:0 0 16px;
  color:var(--workspace-modal-subtle);
  font-size:14px;
  line-height:1.5;
}
#exportNameModal .mfe-export-input{
  width:100%;
  height:42px;
  border-radius:12px;
  border:1px solid var(--workspace-modal-border);
  background:var(--workspace-modal-input-bg);
  color:var(--workspace-modal-text);
  padding:0 14px;
  font-size:14px;
  margin-bottom:14px;
}
#exportNameModal .mfe-export-input:focus{
  border-color:var(--workspace-accent,#22c55e);
  box-shadow:0 0 0 3px rgba(var(--workspace-accent-rgb,34,197,94),.16);
}


#exportNameModal .mfe-export-option-wrap{
  margin-top:14px;
  margin-bottom:14px;
}
#exportNameModal .mfe-export-option{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:58px;
  padding:0 16px;
  border-radius:12px;
  border:1px solid var(--workspace-modal-border);
  background:var(--workspace-modal-input-bg);
  cursor:pointer;
}
#exportNameModal .mfe-export-option-label{
  flex:1 1 auto;
  font-size:14px;
  line-height:1.4;
  font-weight:800;
  color:var(--workspace-modal-text);
}
#exportNameModal .mfe-export-option-control{
  flex:0 0 auto;
  width:22px;
  height:22px;
  border-radius:7px;
  border:2px solid rgba(148,163,184,.78);
  background:var(--workspace-modal-backdrop);
  box-shadow:inset 0 0 0 2px rgba(2,6,23,.86);
}
#exportNameModal .mfe-export-option-checkbox{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}
#exportNameModal .mfe-export-option:has(.mfe-export-option-checkbox:checked){
  border-color:rgba(var(--workspace-accent-rgb,34,197,94),.64);
}
#exportNameModal .mfe-export-option:has(.mfe-export-option-checkbox:checked) .mfe-export-option-control{
  border-color:var(--workspace-accent,#22c55e);
  background:linear-gradient(135deg,var(--workspace-accent,#22c55e),var(--workspace-accent-dark,#16a34a));
}
#exportNameModal .mfe-export-option:has(.mfe-export-option-checkbox:checked) .mfe-export-option-control::after{
  content:"";
  display:block;
  width:6px;
  height:10px;
  margin:2px auto 0;
  border:solid #fff;
  border-width:0 3px 3px 0;
  transform:rotate(45deg);
}
#exportNameModal .mfe-export-actions,
#confirmActionModal .mfe-export-actions{
  display:flex;
  gap:10px;
}
#exportNameModal .mfe-export-actions button,
#confirmActionModal .mfe-export-actions button{
  flex:1 1 0;
  height:40px;
  border-radius:12px;
  font-size:14px;
  font-weight:800;
}
#exportNameModal .mfe-btn-primary,
#confirmActionModal .mfe-btn-primary{
  background:linear-gradient(135deg,var(--workspace-accent,#22c55e) 0%, var(--workspace-accent-dark,#16a34a) 55%, var(--workspace-accent-dark,#15803d) 100%);
  border:none;
  color:var(--workspace-accent-contrast,#fff);
  box-shadow:0 10px 18px rgba(var(--workspace-accent-rgb,34,197,94),.22);
}
#exportNameModal .mfe-btn-primary:hover,
#confirmActionModal .mfe-btn-primary:hover{
  background:linear-gradient(135deg,var(--workspace-accent,#22c55e) 0%, var(--workspace-accent,#22c55e) 55%, var(--workspace-accent-dark,#16a34a) 100%);
  border:none;
  color:#fff;
}
#exportNameModal .mfe-btn-secondary,
#confirmActionModal .mfe-btn-secondary{
  background:var(--workspace-modal-input-bg);
  border:1px solid var(--workspace-modal-border);
  color:var(--workspace-modal-subtle);
}
#exportNameModal .mfe-btn-secondary:hover,
#confirmActionModal .mfe-btn-secondary:hover{
  background:var(--workspace-modal-hover-bg);
  color:#fff;
  border-color:var(--workspace-modal-border-strong);
}
#editorLoadProgressModal{
  z-index:10080;
}
#editorLoadProgressModal .mfe-load-progress-card{
  width:min(420px, calc(100vw - 32px));
  padding:22px;
  border-radius:20px;
  color:var(--workspace-modal-text);
  display:grid;
  gap:12px;
}
#editorLoadProgressModal .mfe-load-progress-title{
  margin:14px 0 8px;
  font-size:24px;
  font-weight:900;
  line-height:1.1;
  color:var(--workspace-modal-title);
}
#editorLoadProgressModal .mfe-load-progress-subtitle{
  margin:0 0 4px;
  color:var(--workspace-modal-subtle);
  font-size:14px;
  line-height:1.5;
}
#editorLoadProgressModal .mfe-load-progress-bar{
  position:relative;
  width:100%;
  height:16px;
  margin-top:6px;
  overflow:hidden;
  border-radius:999px;
  background:var(--workspace-modal-track-bg);
  border:1px solid var(--workspace-modal-soft-border);
}
#editorLoadProgressModal .mfe-load-progress-bar-fill{
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:0%;
  border-radius:999px;
  background:linear-gradient(90deg,var(--workspace-accent,#22c55e) 0%, var(--workspace-accent-text,#86efac) 100%);
  box-shadow:0 0 18px rgba(var(--workspace-accent-rgb,34,197,94),.28);
  transition:width .12s linear;
}
#editorLoadProgressModal .mfe-load-progress-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--workspace-modal-subtle);
  font-size:12px;
  font-weight:700;
}
#editorLoadProgressModal .mfe-load-progress-status{
  min-width:0;
  color:var(--workspace-modal-subtle);
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#editorLoadProgressModal .mfe-load-progress-percent{
  color:var(--workspace-modal-subtle);
  font-size:12px;
  font-weight:700;
}
#editorLoadProgressModal .mfe-load-progress-foot{
  color:var(--workspace-modal-muted);
  font-size:12px;
  line-height:1.45;
  margin-top:2px;
}
@media (max-width: 640px){
  #editorLoadProgressModal .mfe-load-progress-card{
    width:min(100vw - 20px, 420px);
    padding:20px;
    border-radius:20px;
  }
  #editorLoadProgressModal .mfe-load-progress-title{
    font-size:22px;
  }
}

#accountModal .mfe-account-modal-card{
  width:min(340px,calc(100vw - 32px));
  padding:20px;
  border-radius:18px;
  background:var(--workspace-modal-card-bg);
  border:1px solid var(--workspace-modal-soft-border);
  box-shadow:var(--workspace-modal-shadow);
  color:var(--workspace-modal-text);
}
#accountModal .mfe-account-modal-card h3{margin:0 0 14px;color:var(--workspace-modal-title);}
#accountModal .mfe-account-modal-card input{
  height:42px;
  border:1px solid var(--workspace-modal-border);
  border-radius:11px;
  background:var(--workspace-modal-input-bg);
  color:var(--workspace-modal-text);
  padding:0 12px;
}
#accountModal .mfe-account-modal-card input:focus{
  outline:none;
  border-color:var(--workspace-accent);
  box-shadow:0 0 0 3px rgba(var(--workspace-accent-rgb),.14);
}
#accountModal .mfe-account-modal-card button{
  min-height:40px;
  border:1px solid var(--workspace-modal-border);
  border-radius:11px;
  background:var(--workspace-modal-input-bg);
  color:var(--workspace-modal-text);
  font:inherit;
  font-weight:800;
}
#accountModal .mfe-account-modal-card button:hover{
  background:var(--workspace-modal-hover-bg);
  border-color:var(--workspace-modal-border-strong);
}
#exerciseModal{
  z-index:10010;
}
#exerciseModal .mfe-exercise-card{
  width:min(620px, calc(100vw - 32px));
  max-height:min(88vh, 860px);
  overflow:auto;
  padding:24px;
  border-radius:22px;
  background:
    radial-gradient(circle at top, rgba(var(--workspace-accent-rgb,34,197,94),.12), transparent 42%),
    var(--workspace-modal-card-bg);
  border:1px solid var(--workspace-modal-soft-border);
  box-shadow:var(--workspace-modal-shadow);
  color:var(--workspace-modal-text);
}
#exerciseModal .mfe-exercise-badge{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(var(--workspace-accent-rgb,34,197,94),.14);
  color:var(--workspace-accent-text,#86efac);
  border:1px solid rgba(var(--workspace-accent-rgb,34,197,94),.26);
  font-size:12px;
  font-weight:800;
  letter-spacing:.35px;
  text-transform:uppercase;
}
#exerciseModal .mfe-exercise-title{
  margin:14px 0 8px;
  font-size:24px;
  line-height:1.1;
  font-weight:900;
  color:var(--workspace-modal-title);
}
#exerciseModal .mfe-exercise-subtitle{
  margin:0 0 18px;
  color:var(--workspace-modal-muted);
  font-size:14px;
  line-height:1.5;
}
#exerciseModal .mfe-exercise-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
#exerciseModal .mfe-exercise-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}
#exerciseModal .mfe-exercise-field.full{
  grid-column:1 / -1;
}
#exerciseModal .mfe-exercise-label{
  font-size:12px;
  font-weight:800;
  letter-spacing:.35px;
  text-transform:uppercase;
  color:var(--workspace-accent-text,#86efac);
}
#exerciseModal input,
#exerciseModal textarea{
  width:100%;
  border-radius:12px;
  border:1px solid var(--workspace-modal-border);
  background:var(--workspace-modal-input-bg);
  color:var(--workspace-modal-text);
  padding:0 14px;
  font-size:14px;
  font-family:inherit;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
#exerciseModal input{
  height:44px;
}
#exerciseModal textarea{
  min-height:140px;
  resize:vertical;
  padding:12px 14px;
}
#exerciseModal input::placeholder,
#exerciseModal textarea::placeholder{
  color:var(--workspace-modal-placeholder);
}
#exerciseModal input:focus,
#exerciseModal textarea:focus{
  outline:none;
  border-color:var(--workspace-accent,#22c55e);
  box-shadow:0 0 0 3px rgba(var(--workspace-accent-rgb,34,197,94),.14);
  background:var(--workspace-modal-hover-bg);
}
#exerciseModal .mfe-exercise-actions{
  display:flex;
  gap:10px;
  margin-top:16px;
}
#exerciseModal .mfe-exercise-actions button{
  min-width:128px;
  height:42px;
  padding:0 16px;
  border-radius:14px;
  font-size:14px;
  font-weight:800;
}
#exerciseModal #saveExercise{
  background:linear-gradient(135deg,var(--workspace-accent,#22c55e) 0%, var(--workspace-accent-dark,#16a34a) 55%, var(--workspace-accent-dark,#15803d) 100%);
  border:1px solid rgba(var(--workspace-accent-rgb,34,197,94),.24);
  color:var(--workspace-accent-contrast,#fff);
  box-shadow:0 10px 18px rgba(var(--workspace-accent-rgb,34,197,94),.22);
}
#exerciseModal #cancelExercise{
  background:var(--workspace-modal-input-bg);
  border:1px solid var(--workspace-modal-border);
  color:var(--workspace-modal-text);
}
@media (hover:hover){
  #exerciseModal #saveExercise:hover{
    filter:brightness(1.06);
    transform:translateY(-1px);
  }
  #exerciseModal #cancelExercise:hover{
    background:var(--workspace-modal-hover-bg);
    border-color:var(--workspace-modal-border-strong);
    color:#fff;
    transform:translateY(-1px);
  }
}
@media (max-width: 640px){
  #exerciseModal .mfe-exercise-card{
    width:min(100vw - 20px, 620px);
    padding:18px;
    border-radius:18px;
  }
  #exerciseModal .mfe-exercise-grid{
    grid-template-columns:1fr;
  }
  #exerciseModal .mfe-exercise-actions{
    flex-direction:column;
  }
  #exerciseModal .mfe-exercise-actions button{
    width:100%;
  }
}


/* === editor.html :: exercise-library-scrollbar-tweaks === */
#exerciseLibraryModal ::-webkit-scrollbar{
  width:10px;
  height:10px;
}
#exerciseLibraryModal ::-webkit-scrollbar-track{
  background:rgba(15,23,42,.45);
  border-radius:999px;
}
#exerciseLibraryModal ::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#1f3b2d,#15803d);
  border-radius:999px;
  border:2px solid rgba(15,23,42,.32);
}
#exerciseLibraryModal{
  scrollbar-color:#15803d rgba(15,23,42,.45);
  scrollbar-width:thin;
}
#exerciseLibraryList{
  scrollbar-color:#15803d rgba(15,23,42,.45);
  scrollbar-width:thin;
}


/* === editor.html :: exercise-library-layout-tweaks === */
#exerciseLibraryModal .exercise-library-modal-card{
  width:min(1320px,96vw) !important;
  max-height:88vh;
}
#exerciseLibraryModal #exerciseLibraryList.exercise-library-list-grid{
  display:grid;
  grid-template-columns:repeat(5, minmax(0,1fr)) !important;
  gap:12px;
  align-content:start;
  grid-auto-rows:max-content;
}
@media (max-width: 1280px){
  #exerciseLibraryModal #exerciseLibraryList.exercise-library-list-grid{
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  }
}
@media (max-width: 1080px){
  #exerciseLibraryModal #exerciseLibraryList.exercise-library-list-grid{
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  }
}
@media (max-width: 780px){
  #exerciseLibraryModal #exerciseLibraryList.exercise-library-list-grid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}
@media (max-width: 560px){
  #exerciseLibraryModal #exerciseLibraryList.exercise-library-list-grid{
    grid-template-columns:1fr !important;
  }
}


/* === editor.html :: training-plan-ui-tweaks === */
#trainingPlanModal input[type="text"],
#trainingPlanModal input[type="date"],
#trainingPlanModal input[type="datetime-local"],
#trainingPlanModal input[type="number"],
#trainingPlanModal select{
  height:36px;
  font-size:13px;
}
#trainingPlanModal textarea{
  font-size:14px;
}
#planNotes{
  min-height:84px !important;
}

#planLibraryPickerModal .mfe-plan-picker-card{
  width:min(1320px,96vw) !important;
  height:min(88vh,860px) !important;
  max-height:88vh !important;
}
.mfe-plan-library-browser{
  display:grid;
  grid-template-columns:240px minmax(0,1fr);
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
}
.mfe-plan-library-folders{
  min-width:0;
  min-height:0;
  padding:18px 14px;
  border-right:1px solid var(--workspace-modal-soft-border);
  background:var(--workspace-modal-panel-bg);
  overflow:auto;
}
.mfe-plan-library-folders-heading{
  margin:0 8px 12px;
  color:var(--workspace-accent-text,#86efac);
  font-size:12px;
  font-weight:800;
  letter-spacing:.35px;
  text-transform:uppercase;
}
.mfe-plan-library-folder-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}
#planLibraryPickerModal .mfe-plan-library-folder-button{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 12px !important;
  text-align:left;
}
#planLibraryPickerModal .mfe-plan-library-folder-button.is-active{
  background:rgba(var(--workspace-accent-rgb,34,197,94),.16) !important;
  border-color:rgba(var(--workspace-accent-rgb,34,197,94),.42) !important;
  color:var(--workspace-accent-text,#86efac) !important;
}
.mfe-plan-library-folder-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.mfe-plan-library-folder-count{
  min-width:26px;
  height:24px;
  padding:0 7px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  background:var(--workspace-modal-hover-bg);
  color:var(--workspace-modal-muted);
  font-size:11px;
  font-weight:800;
}
#planLibraryPickerModal .mfe-plan-library-folder-button.is-active .mfe-plan-library-folder-count{
  background:rgba(var(--workspace-accent-rgb,34,197,94),.22);
  color:var(--workspace-accent-text,#86efac);
}
.mfe-plan-library-content{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
}
#planLibraryPickerList{
  min-height:0;
  overflow:auto;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  align-content:start;
  grid-auto-rows:max-content;
}
#planLibraryPickerList .mfe-plan-library-card{
  min-height:330px;
  display:flex;
  flex-direction:column;
}
.mfe-plan-library-card-body{
  min-height:0;
  padding:12px;
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  gap:10px;
}
.mfe-plan-library-card-copy{
  min-height:0;
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  gap:7px;
}
.mfe-plan-library-card-title{
  font-weight:800;
  line-height:1.3;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.mfe-plan-library-card-subtitle,
.mfe-plan-library-card-meta{
  color:var(--workspace-modal-muted);
  font-size:12px;
  line-height:1.35;
}
.mfe-plan-library-card-date{
  margin-top:auto;
  color:var(--workspace-modal-placeholder);
  font-size:12px;
}
#planLibraryPickerList [data-plan-library-add]{
  width:100%;
  min-height:40px;
  margin-top:auto;
  flex:0 0 auto;
}
.mfe-plan-library-empty{
  grid-column:1/-1;
  padding:28px !important;
  border:1px dashed var(--workspace-modal-border-strong) !important;
  background:transparent !important;
  color:var(--workspace-modal-muted);
  text-align:center;
  box-shadow:none !important;
}
.mfe-plan-library-empty--error{
  color:#fecaca;
  border-color:#7f1d1d !important;
}

#trainingPlanLeftScroll{
  overflow-x:hidden !important;
}
#trainingPlanLeftScroll input,
#trainingPlanLeftScroll textarea,
#trainingPlanLeftScroll button,
#trainingPlanLeftScroll select{
  min-width:0;
  max-width:100%;
}
#trainingPlanLeftScroll > div[style*="grid-template-columns:1fr 1fr"]{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
}
#trainingPlanLeftScroll > div[style*="grid-template-columns:1fr 1fr 1fr"]{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) !important;
}
#trainingPlanModal ::-webkit-scrollbar,
#planLibraryPickerModal ::-webkit-scrollbar{
  width:10px;
  height:10px;
}
#trainingPlanModal ::-webkit-scrollbar-track,
#planLibraryPickerModal ::-webkit-scrollbar-track{
  background:rgba(15,23,42,.45);
  border-radius:999px;
}
#trainingPlanModal ::-webkit-scrollbar-thumb,
#planLibraryPickerModal ::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#1f3b2d,#15803d);
  border-radius:999px;
  border:2px solid rgba(15,23,42,.32);
}
#trainingPlanModal, #planLibraryPickerModal{
  scrollbar-color:#15803d rgba(15,23,42,.45);
  scrollbar-width:thin;
}


/* === editor.html :: inline-style-9 === */
.export-menu{position:relative;display:inline-flex;align-items:center;margin-left:6px;}
.export-trigger{
  height:28px;
  padding:0 10px;
  border-radius:8px;
  border:1px solid var(--line);
  background:var(--button-bg);
  color:var(--text);
  font-weight:600;
  cursor:pointer;
}
.export-dropdown{
  display:none;
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  background:#0b1220;
  border:1px solid #1f2937;
  border-radius:10px;
  padding:6px;
  z-index:9999;
  flex-direction:column;
  gap:6px;
}
.export-menu.open .export-dropdown{display:flex;}
.export-dropdown, .project-dropdown, .view-dropdown{ overflow:visible; }
.export-dropdown button, .project-dropdown button, .view-dropdown button{ position:relative; }

.export-dropdown button{width:120px;}


/* === editor.html :: inline-style-10 === */
.project-menu{position:relative;display:inline-flex;align-items:center;margin-left:6px;}
.project-trigger{
  height:28px;padding:0 10px;border-radius:8px;border:1px solid var(--line);
  background:var(--button-bg);color:var(--text);font-weight:600;cursor:pointer;
}
.project-dropdown{
  display:none;position:absolute;top:calc(100% + 6px);left:0;
  background:#0b1220;border:1px solid #1f2937;border-radius:10px;
  padding:6px;z-index:9999;flex-direction:column;gap:6px;
}
.project-menu.open .project-dropdown{display:flex;}
.project-dropdown button{width:140px;}


/* === editor.html :: inline-style-11 === */
.view-menu{position:relative;display:inline-flex;align-items:center;margin-left:6px;}
.view-trigger{
  height:28px;padding:0 10px;border-radius:8px;border:1px solid var(--line);
  background:var(--button-bg);color:var(--text);font-weight:600;cursor:pointer;
}
.view-dropdown{
  display:none;position:absolute;top:calc(100% + 6px);left:0;
  background:#0b1220;border:1px solid #1f2937;border-radius:10px;
  padding:6px;z-index:9999;flex-direction:column;gap:6px;
}
.view-menu.open .view-dropdown{display:flex;}
.view-dropdown button{width:160px;}



/* Mobile editor shell — phone only */
html,body{-webkit-text-size-adjust:100%;}
body,#topbar,#leftbar,#rightbar,#container{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
button,input,select,textarea{-webkit-appearance:none;appearance:none;}
.konvajs-content,.konvajs-content canvas,#container{-webkit-transform:translateZ(0);transform:translateZ(0);}
#container,.konvajs-content{touch-action:none;-ms-touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;}
.konvajs-content{pointer-events:auto;}
.konvajs-content canvas{touch-action:none;pointer-events:none;}

@media(min-width:768px) and (max-width:1180px){
  #topbar,#leftbar,#rightbar{-webkit-overflow-scrolling:touch;}
  #topbar{overscroll-behavior-x:contain;scrollbar-width:none;}
  #topbar::-webkit-scrollbar{display:none;}
  #leftbar,#rightbar{overscroll-behavior:contain;}
  button,.tool,.icon-btn,select,input[type="text"]{touch-action:manipulation;}
  .drag-item{touch-action:manipulation;}
}
.mfe-phone-backdrop,.mfe-phone-sheet,.mfe-phone-bottombar,.mfe-mobile-header-popover{display:none;}

@media(max-width:767px){
  :root{--topbar-h:60px;--workspace-topbar-h:60px;}
  html,body{width:100%;height:100%;}
  body{overflow:hidden;}

  #leftbar,#rightbar{display:none!important;}
  #topbar{
    position:fixed;
    top:0;left:0;right:0;
    height:60px;
    min-height:60px;
    padding:0 8px!important;
    z-index:80;
    overflow:visible!important;
  }
  body.workspace-redesign #topbar{left:0!important;padding:0 8px!important;}
  body.workspace-redesign .workspace-header{
    display:grid;
    grid-template-columns:minmax(92px,1fr) auto;
    align-items:center;
    gap:6px;
  }
  body.workspace-redesign .workspace-header-brand{min-width:0;overflow:hidden;}
  body.workspace-redesign .workspace-header-title-wrap{min-width:0;}
  body.workspace-redesign .workspace-header-title{font-size:12px;}
  body.workspace-redesign .workspace-header-status{display:none!important;}
  body.workspace-redesign .workspace-header-nav{display:none!important;}
  body.workspace-redesign .workspace-header-actions{
    min-width:0;
    max-width:none;
    overflow:visible!important;
    justify-content:flex-end;
    gap:4px;
  }
  body.workspace-redesign .workspace-header-actions>.icon-btn,
  body.workspace-redesign .workspace-header-actions>#undo,
  body.workspace-redesign .workspace-header-actions>#redo,
  body.workspace-redesign .workspace-header-actions>#duplicate,
  body.workspace-redesign .workspace-header-actions>#cloneAll,
  body.workspace-redesign .workspace-header-actions>#delete,
  body.workspace-redesign .workspace-header-actions>#animate,
  body.workspace-redesign .workspace-header-actions>.workspace-more-menu,
  body.workspace-redesign .workspace-header-actions>#upgradeBtn{display:none!important;}
  body.workspace-redesign .workspace-header-actions .view-menu,
  body.workspace-redesign .workspace-header-actions .project-menu,
  body.workspace-redesign .workspace-header-actions .export-menu{display:inline-flex!important;margin:0!important;}
  body.workspace-redesign .workspace-header-actions .view-trigger,
  body.workspace-redesign .workspace-header-actions .project-trigger,
  body.workspace-redesign .workspace-header-actions .export-trigger{
    height:34px!important;
    min-width:0!important;
    padding:0 8px!important;
    border-radius:9px!important;
    font-size:10.5px!important;
    line-height:1!important;
  }
  body.workspace-redesign .workspace-header-actions .view-dropdown,
  body.workspace-redesign .workspace-header-actions .project-dropdown,
  body.workspace-redesign .workspace-header-actions .export-dropdown{display:none!important;}

  #container,
  body.workspace-redesign #container{
    position:fixed;
    top:60px;
    left:0!important;
    right:0!important;
    bottom:74px;
    width:auto;
    height:auto;
    overflow:hidden;
  }

  .mfe-phone-backdrop{
    display:none;
    position:fixed;
    inset:0;
    z-index:89;
    background:rgba(2,6,23,.58);
    backdrop-filter:blur(6px);
  }
  .mfe-phone-backdrop.show{display:block;}

  .mfe-phone-sheet{
    display:block;
    position:fixed;
    top:60px;
    bottom:0;
    width:min(380px,94vw);
    overflow:auto;
    padding:12px 10px calc(86px + env(safe-area-inset-bottom));
    z-index:90;
    background:var(--panel-glass,#0b1720);
    backdrop-filter:blur(14px);
    box-shadow:0 18px 42px rgba(0,0,0,.38);
    transition:transform .22s ease;
  }
  .mfe-phone-sheet.left{left:0;border-right:1px solid rgba(255,255,255,.08);transform:translateX(-105%);}
  .mfe-phone-sheet.right{right:0;border-left:1px solid rgba(255,255,255,.08);transform:translateX(105%);}
  .mfe-phone-sheet.show{transform:translateX(0);}
  .mfe-phone-sheet-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:12px;
    padding-bottom:10px;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .mfe-phone-sheet-title{font-size:14px;font-weight:850;color:var(--text,#f3f7f9);}
  .mfe-phone-sheet-close{
    width:36px;
    min-width:36px;
    height:36px;
    padding:0;
    border:1px solid var(--line,#29404c);
    border-radius:10px;
    background:var(--button-bg,#11222c);
    color:var(--text,#f3f7f9);
    cursor:pointer;
  }
  .mfe-phone-sheet-body{min-height:0;}
  .mfe-phone-sheet button,
  .mfe-phone-sheet input[type="text"],
  .mfe-phone-sheet input[type="number"],
  .mfe-phone-sheet select,
  .mfe-phone-sheet textarea{font-size:14px;border-radius:11px;}
  .mfe-phone-sheet .panel-group{margin-bottom:10px;}
  .mfe-phone-sheet .library-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;}
  .mfe-phone-sheet .drag-item{
    min-height:66px;
    padding:6px;
    border-radius:11px;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
  }
  .mfe-phone-sheet button.zone-tool-button{touch-action:none;-ms-touch-action:none;}
  .mfe-phone-sheet .drag-item img{max-width:54px;max-height:46px;}
  .mfe-phone-sheet .drag-item>.mfe-phone-item-label{
    display:block!important;
    position:static!important;
    margin-top:4px;
    color:#c9d7dc!important;
    font-size:9px!important;
    line-height:1.1!important;
    text-align:center!important;
    white-space:normal!important;
  }
  .mfe-phone-sheet .player-preview{display:flex!important;align-items:center!important;justify-content:center!important;}
  .mfe-phone-sheet .player-preview.circle{width:28px!important;height:28px!important;border-radius:50%!important;border:2px solid #fff!important;}
  .mfe-phone-sheet .player-preview.pro{width:46px!important;height:48px!important;background-size:contain!important;background-position:center!important;background-repeat:no-repeat!important;}
  .mfe-phone-sheet .action-preview,.mfe-phone-sheet .shape-preview{width:42px!important;height:42px!important;position:relative!important;display:block!important;}

  .mfe-phone-quick-actions{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin-bottom:10px;
  }
  .mfe-phone-quick-action{
    min-width:0;
    min-height:44px!important;
    height:auto!important;
    padding:8px 5px!important;
    display:grid!important;
    place-items:center;
    gap:4px;
    border:1px solid #29404c!important;
    border-radius:11px!important;
    background:#10212b!important;
    color:#eaf3f5!important;
    font-size:10px!important;
    font-weight:850!important;
    line-height:1.1!important;
    text-align:center!important;
  }
  .mfe-phone-quick-action i{font-size:14px;color:var(--workspace-accent,#22c55e);}

  .mfe-phone-tool-tabs{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
    margin-bottom:10px;
    padding:6px;
    border:1px solid #223640;
    border-radius:13px;
    background:#09161e;
  }
  .mfe-phone-tool-tab{
    min-width:0;
    min-height:38px!important;
    height:auto!important;
    padding:7px 4px!important;
    border:1px solid transparent!important;
    border-radius:9px!important;
    background:transparent!important;
    color:#90a5af!important;
    font-size:10px!important;
    font-weight:850!important;
    line-height:1.1!important;
    text-align:center!important;
  }
  .mfe-phone-tool-tab.active{
    border-color:rgba(var(--workspace-accent-rgb,34,197,94),.35)!important;
    background:var(--workspace-accent-surface,#173d2b)!important;
    color:var(--workspace-accent-text,#dcffe8)!important;
  }
  .mfe-phone-tool-content .workspace-tool-panel{
    display:block!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    padding:0!important;
  }
  .mfe-phone-tool-content .panel-group{
    margin:0 0 9px!important;
    padding:9px!important;
    border:1px solid #223640!important;
    border-radius:13px!important;
    background:linear-gradient(180deg,#101f29,#0c1820)!important;
  }
  .mfe-phone-tool-content .panel-title{
    display:block!important;
    margin:0 0 8px!important;
    color:var(--workspace-accent,#22c55e)!important;
    font-size:10px!important;
    font-weight:900!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
  }
  .mfe-phone-tool-content .workspace-color-control,
  .mfe-phone-tool-content .workspace-text-insert-controls{width:100%;}
  .mfe-phone-tool-content .workspace-color-swatches{grid-template-columns:repeat(5,minmax(0,1fr));}
  .mfe-phone-tool-content .tool{
    width:100%;
    min-height:42px;
    padding:9px 10px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    border-radius:10px;
  }

  .mfe-phone-actions-section{
    margin:0 0 10px;
    padding:10px;
    border:1px solid #223640;
    border-radius:13px;
    background:#0e1c25;
  }
  .mfe-phone-actions-heading{
    margin:0 0 8px;
    color:var(--workspace-accent,#22c55e);
    font-size:10px;
    font-weight:900;
    letter-spacing:.1em;
    text-transform:uppercase;
  }
  .mfe-phone-actions-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}
  .mfe-phone-action-button{
    width:100%;
    min-height:42px!important;
    height:auto!important;
    padding:8px!important;
    border:1px solid #29404c!important;
    border-radius:10px!important;
    background:#11222c!important;
    color:#eaf3f5!important;
    font-size:11px!important;
    font-weight:800!important;
    line-height:1.2!important;
    text-align:center!important;
  }
  .mfe-phone-action-button.active{
    border-color:var(--workspace-accent,#22c55e)!important;
    background:var(--workspace-accent-surface,#173d2b)!important;
    color:var(--workspace-accent-text,#dcffe8)!important;
  }

  .mfe-phone-properties-source{overflow:visible!important;padding:0!important;}
  .mfe-phone-properties-source .workspace-inspector{display:grid;gap:9px;}
  .mfe-phone-properties-source .workspace-inspector-card{
    margin:0!important;
    padding:11px!important;
    border:1px solid #223640!important;
    border-radius:13px!important;
    background:#0e1c25!important;
  }
  .mfe-phone-properties-source .workspace-inspector-empty{
    padding:16px;
    border:1px dashed #2b414c;
    border-radius:13px;
    color:#8fa4ae;
    font-size:12px;
    line-height:1.45;
    text-align:center;
  }
  .mfe-phone-properties-source .workspace-slider-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) 58px;
    gap:8px;
    align-items:center;
  }
  .mfe-phone-properties-source input[type="range"]{width:100%;}
  .mfe-phone-properties-source .workspace-inspector-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:7px;}
  .mfe-phone-properties-source .workspace-inspector-actions .full{grid-column:1/-1;}
  .mfe-phone-properties-source .workspace-color-swatches{grid-template-columns:repeat(5,minmax(0,1fr));}
  .mfe-phone-properties-source .workspace-native-color-input{width:100%;}

  .mfe-mobile-header-popover{
    display:block;
    position:fixed;
    top:67px;
    left:8px;
    right:8px;
    z-index:96;
    max-height:calc(100dvh - 159px);
    overflow:auto;
    padding:12px;
    border:1px solid #29404c;
    border-radius:16px;
    background:linear-gradient(180deg,#10202a,#09151d);
    box-shadow:0 24px 60px rgba(0,0,0,.5);
  }
  .mfe-mobile-header-popover-title{
    margin:0 0 9px;
    color:var(--workspace-accent,#22c55e);
    font-size:10px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
  }
  .mfe-mobile-header-popover-list{display:grid;gap:7px;}
  .mfe-mobile-header-popover-list button{
    width:100%;
    min-height:42px;
    padding:9px 12px;
    border:1px solid #29404c;
    border-radius:11px;
    background:#11222c;
    color:#eef6f8;
    font:inherit;
    font-size:13px;
    font-weight:800;
    text-align:center;
  }
  .mfe-mobile-header-popover-list button.active{
    border-color:var(--workspace-accent,#22c55e);
    background:var(--workspace-accent-surface,#173d2b);
    color:var(--workspace-accent-text,#dcffe8);
  }

  .mfe-phone-bottombar{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    min-height:74px;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom));
    z-index:91;
    background:linear-gradient(180deg,rgba(2,6,23,.96),rgba(2,6,23,.99));
    border-top:1px solid rgba(255,255,255,.08);
  }
  body.theme-light .mfe-phone-bottombar,
  html[data-mfe-theme="light"] .mfe-phone-bottombar{
    background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(248,250,252,.99));
    border-top-color:rgba(15,23,42,.08);
  }
  .mfe-phone-bottombar button{
    height:48px;
    min-height:48px;
    padding:0 3px;
    display:grid;
    place-items:center;
    gap:2px;
    border-radius:13px;
    font-size:9px;
    font-weight:850;
    line-height:1.1;
  }
  .mfe-phone-bottombar .mb-icon{font-size:14px;line-height:1;}
}

@media(max-width:420px){
  body.workspace-redesign .workspace-header{grid-template-columns:minmax(76px,1fr) auto;}
  body.workspace-redesign .workspace-header-title{font-size:11px;}
  body.workspace-redesign .workspace-dashboard-btn{width:30px!important;min-width:30px!important;height:30px!important;}
  body.workspace-redesign .workspace-header-actions .view-trigger,
  body.workspace-redesign .workspace-header-actions .project-trigger,
  body.workspace-redesign .workspace-header-actions .export-trigger{padding:0 6px!important;font-size:9.5px!important;}
}

/* === editor.html :: animation-player-styles === */
#animationPlayer{
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  z-index:120;
  display:none;
  width:min(620px,calc(100vw - 16px));
  min-width:0;
  max-width:calc(100vw - 16px);
  max-height:calc(100vh - 16px);
  max-height:calc(100dvh - 16px);
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:10px 12px;
  box-sizing:border-box;
  border-radius:16px;
  background:rgba(8,15,29,.94);
  border:1px solid rgba(34,197,94,.26);
  box-shadow:0 18px 40px rgba(0,0,0,.34);
  backdrop-filter:blur(12px);
  color:#e5e7eb;
  user-select:none;
  touch-action:pan-y;
}
#animationPlayer.show{ display:block; }
#animationPlayer .ap-header{ display:flex; align-items:center; justify-content:space-between; gap:8px; cursor:move; touch-action:none; }
#animationPlayer .ap-title{ font-size:13px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#86efac; }
#animationPlayer .ap-close{ width:30px; min-width:30px; height:30px; }
#animationPlayer .ap-body{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px; }
#animationPlayer .ap-speed-wrap{ display:flex; align-items:center; gap:8px; min-width:150px; }
#animationPlayer .ap-speed-wrap label{ font-size:12px; font-weight:700; color:#cbd5e1; }
#animationPlayer .ap-speed{ width:88px; }
#animationPlayer .ap-order-controls{ display:flex; align-items:center; gap:8px; margin-left:auto; }
#animationPlayer .ap-order-controls label{ font-size:12px; font-weight:700; color:#cbd5e1; }
#animationPlayer .ap-order-select{ width:88px; }
#animationPlayer .ap-order{ min-width:140px; padding:8px 10px; border-radius:10px; background:rgba(15,23,42,.82); border:1px solid rgba(148,163,184,.18); font-size:12px; font-weight:700; color:var(--workspace-modal-text); text-align:center; }
#animationPlayer .ap-progress-wrap{ width:100%; display:grid; gap:6px; margin-top:2px; }
#animationPlayer .ap-progress-meta{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:11px; font-weight:700; color:#cbd5e1; }
#animationPlayer .ap-progress-track{ position:relative; width:100%; height:10px; border-radius:999px; overflow:hidden; background:rgba(15,23,42,.78); border:1px solid rgba(148,163,184,.18); }
#animationPlayer .ap-progress-bar{ position:absolute; left:0; top:0; bottom:0; width:0%; border-radius:999px; background:linear-gradient(90deg,#22c55e 0%, #86efac 100%); box-shadow:0 0 14px rgba(34,197,94,.28); transition:width .08s linear; }
@media(max-width:640px){
  #animationPlayer .ap-body{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;}
  #animationPlayer .ap-speed-wrap{min-width:0;grid-column:1 / -1;}
  #animationPlayer .ap-body>button{width:100%;min-width:0;}
  #animationPlayer .ap-progress-wrap{grid-column:1 / -1;}
  #animationTargetPopover{width:min(300px,calc(100vw - 16px));box-sizing:border-box;}
}
@media(max-width:420px){
  #animationPlayer .ap-body{grid-template-columns:1fr;}
  #animationPlayer .ap-progress-wrap,#animationPlayer .ap-speed-wrap{grid-column:1;}
}
body.theme-light #animationPlayer{ background:rgba(255,255,255,.96); color:#0f172a; border-color:rgba(34,197,94,.2); }
body.theme-light #animationPlayer .ap-title{ color:#15803d; }
body.theme-light #animationPlayer .ap-order-controls label{ color:#334155; }
body.theme-light #animationPlayer .ap-order{ background:#f8fafc; color:#0f172a; border-color:rgba(100,116,139,.2); }
body.theme-light #animationPlayer .ap-progress-meta{ color:#334155; }
body.theme-light #animationPlayer .ap-progress-track{ background:#f8fafc; border-color:rgba(100,116,139,.2); }


/* === editor.html :: mfe-modal-layout-harmonize === */
#exerciseLibraryModal,
#trainingPlanModal,
#planLibraryPickerModal{
  backdrop-filter:blur(8px);
}
#exerciseLibraryModal .mfe-library-card,
#trainingPlanModal .mfe-training-plan-card,
#planLibraryPickerModal .mfe-plan-picker-card{
  background:
    radial-gradient(circle at top, rgba(var(--workspace-accent-rgb,34,197,94),.12), transparent 42%),
    var(--workspace-modal-card-bg) !important;
  border:1px solid var(--workspace-modal-soft-border) !important;
  border-radius:22px !important;
  box-shadow:var(--workspace-modal-shadow) !important;
  color:var(--workspace-modal-text) !important;
}
#trainingPlanModal .mfe-training-plan-card{
  grid-template-columns:minmax(340px,400px) 1fr !important;
}
#exerciseLibraryModal .mfe-library-header,
#trainingPlanModal .mfe-training-plan-hero,
#planLibraryPickerModal .mfe-plan-picker-header{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:20px 22px 18px !important;
  border-bottom:1px solid var(--workspace-modal-soft-border) !important;
}
#trainingPlanModal .mfe-training-plan-main-header{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto auto auto;
  align-items:center !important;
  gap:10px !important;
  padding:18px 20px 16px !important;
  border-bottom:1px solid var(--workspace-modal-soft-border) !important;
}
#trainingPlanModal .mfe-training-plan-main-header .mfe-training-plan-add-action{
  min-height:38px;
  padding:0 14px;
  white-space:nowrap;
}
#trainingPlanModal .mfe-training-plan-sidebar{
  border-right:1px solid var(--workspace-modal-soft-border) !important;
}
.mfe-modal-surface-heading{
  display:grid;
  gap:8px;
  min-width:0;
}
.mfe-modal-surface-heading--compact{
  gap:6px;
}
.mfe-modal-surface-badge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(var(--workspace-accent-rgb,34,197,94),.14);
  color:var(--workspace-accent-text,#86efac);
  border:1px solid rgba(var(--workspace-accent-rgb,34,197,94),.28);
  font-size:12px;
  font-weight:800;
  letter-spacing:.35px;
  text-transform:uppercase;
}
.mfe-modal-surface-title{
  margin:0;
  font-size:24px;
  line-height:1.1;
  font-weight:900;
  color:var(--workspace-modal-title);
}
.mfe-modal-surface-title--sm{
  font-size:20px;
}
.mfe-modal-surface-subtitle{
  margin:0;
  color:var(--workspace-modal-muted);
  font-size:14px;
  line-height:1.5;
}
.mfe-modal-surface-subtitle--sm{
  font-size:13px;
}
#exerciseLibraryModal .mfe-library-search-row,
#planLibraryPickerModal .mfe-plan-picker-search-row,
#exerciseLibraryFolderBar{
  padding:16px 22px !important;
  border-bottom:1px solid var(--workspace-modal-soft-border) !important;
}
#exerciseLibraryModal input[type="text"],
#trainingPlanModal input[type="text"],
#trainingPlanModal input[type="date"],
#trainingPlanModal input[type="datetime-local"],
#trainingPlanModal input[type="number"],
#trainingPlanModal select,
#trainingPlanModal textarea,
#planLibraryPickerModal input[type="text"],
#planLibraryPickerModal select{
  border-radius:12px !important;
  border:1px solid var(--workspace-modal-border) !important;
  background:var(--workspace-modal-input-bg) !important;
  color:var(--workspace-modal-text) !important;
  padding:0 14px !important;
  font-size:14px !important;
  font-family:inherit !important;
  transition:border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
}
#exerciseLibraryModal input[type="text"],
#trainingPlanModal input[type="text"],
#trainingPlanModal input[type="date"],
#trainingPlanModal input[type="datetime-local"],
#trainingPlanModal input[type="number"],
#trainingPlanModal select,
#planLibraryPickerModal input[type="text"],
#planLibraryPickerModal select{
  height:44px !important;
}

#trainingPlanModal #planDate{
  padding-right:12px !important;
  accent-color:var(--workspace-accent,#22c55e);
}
#trainingPlanModal #planDate::-webkit-calendar-picker-indicator{
  width:20px;
  height:20px;
  margin-left:8px;
  padding:6px;
  border-radius:9px;
  border:1px solid rgba(var(--workspace-accent-rgb,34,197,94),.72);
  background-color:var(--workspace-accent-dark,#16a34a);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3Ccircle cx='16.5' cy='15.5' r='2.5'/%3E%3Cpath d='M16.5 14v1.7l1.2.8'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center;
  background-size:18px 18px;
  opacity:1;
  cursor:pointer;
  box-shadow:0 0 0 3px rgba(var(--workspace-accent-rgb,34,197,94),.10);
}
#trainingPlanModal #planDate::-webkit-calendar-picker-indicator:hover{
  background-color:var(--workspace-accent,#22c55e);
  box-shadow:0 0 0 4px rgba(var(--workspace-accent-rgb,34,197,94),.16);
}
#trainingPlanModal textarea{
  min-height:120px !important;
  padding:12px 14px !important;
}
#exerciseLibraryModal input[type="text"]::placeholder,
#trainingPlanModal input[type="text"]::placeholder,
#trainingPlanModal textarea::placeholder,
#planLibraryPickerModal input[type="text"]::placeholder{
  color:var(--workspace-modal-placeholder) !important;
}
#exerciseLibraryModal input[type="text"]:focus,
#trainingPlanModal input[type="text"]:focus,
#trainingPlanModal input[type="date"]:focus,
#trainingPlanModal input[type="datetime-local"]:focus,
#trainingPlanModal input[type="number"]:focus,
#trainingPlanModal select:focus,
#trainingPlanModal textarea:focus,
#planLibraryPickerModal input[type="text"]:focus,
#planLibraryPickerModal select:focus{
  outline:none !important;
  border-color:var(--workspace-accent,#22c55e) !important;
  box-shadow:0 0 0 3px rgba(var(--workspace-accent-rgb,34,197,94),.14) !important;
  background:var(--workspace-modal-hover-bg) !important;
}
#exerciseLibraryModal button,
#trainingPlanModal button,
#planLibraryPickerModal button{
  height:42px !important;
  border-radius:14px !important;
  border:1px solid var(--workspace-modal-border) !important;
  background:var(--workspace-modal-input-bg) !important;
  color:var(--workspace-modal-text) !important;
  padding:0 16px !important;
  font-size:13px !important;
  font-weight:800 !important;
  box-shadow:none !important;
}
#exerciseLibraryModal button.icon-btn,
#trainingPlanModal button.icon-btn,
#planLibraryPickerModal button.icon-btn{
  width:42px !important;
  min-width:42px !important;
  padding:0 !important;
}
#exerciseLibraryModal button:hover,
#trainingPlanModal button:hover,
#planLibraryPickerModal button:hover{
  background:var(--workspace-modal-hover-bg) !important;
  color:#fff !important;
  border-color:var(--workspace-modal-border-strong) !important;
  transform:translateY(-1px);
}
#exerciseLibraryModal button.danger,
#trainingPlanModal button.danger,
#planLibraryPickerModal button.danger{
  background:linear-gradient(180deg,#3a1616,#210c0c) !important;
  border-color:#6b1b1b !important;
  color:#fecaca !important;
}
#libraryNewSaveBtn,
#planAddCurrentBtn,
#planAddFromLibraryBtn,
#planSaveBtn,
#planSaveAsBtn,
#planExportPDFBtn,
#planLibraryPickerList [data-plan-library-add]{
  background:linear-gradient(135deg,var(--workspace-accent,#22c55e) 0%, var(--workspace-accent-dark,#16a34a) 55%, var(--workspace-accent-dark,#15803d) 100%) !important;
  border:1px solid rgba(var(--workspace-accent-rgb,34,197,94),.24) !important;
  color:var(--workspace-accent-contrast,#fff) !important;
  box-shadow:0 10px 18px rgba(var(--workspace-accent-rgb,34,197,94),.18) !important;
}
#libraryNewSaveBtn:hover,
#planAddCurrentBtn:hover,
#planAddFromLibraryBtn:hover,
#planSaveBtn:hover,
#planSaveAsBtn:hover,
#planExportPDFBtn:hover,
#planLibraryPickerList [data-plan-library-add]:hover{
  filter:brightness(1.06);
  border-color:rgba(var(--workspace-accent-rgb,34,197,94),.32) !important;
}
#exerciseLibraryList,
#trainingPlanList,
#planLibraryPickerList{
  padding:20px !important;
  gap:14px !important;
}
#exerciseLibraryList > div,
#trainingPlanList > div,
#planLibraryPickerList > div{
  border:1px solid var(--workspace-modal-border) !important;
  background:var(--workspace-modal-panel-bg) !important;
  border-radius:18px !important;
  overflow:hidden !important;
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}
#exerciseLibraryList > div > div:first-child,
#trainingPlanList > div > div:first-child,
#planLibraryPickerList > div > div:first-child{
  border-bottom:1px solid var(--workspace-modal-soft-border) !important;
  background:var(--workspace-modal-preview-bg) !important;
}
#trainingPlanLeftScroll{
  padding:18px 20px !important;
  gap:12px !important;
}
#trainingPlanLeftScroll > div[style*="border:1px solid var(--workspace-modal-border)"],
#trainingPlanLeftScroll > div[style*="margin-top:4px; border-top:1px solid var(--workspace-modal-border)"]{
  border:1px solid var(--workspace-modal-soft-border) !important;
  border-top:1px solid var(--workspace-modal-soft-border) !important;
  border-radius:16px !important;
  background:var(--workspace-modal-panel-bg) !important;
  padding:14px !important;
  margin-top:0 !important;
}
#trainingPlanLeftScroll > div[style*="grid-template-columns"]{
  gap:10px !important;
}
#trainingPlanLeftScroll > div[style*="margin-top:4px; border-top:1px solid var(--workspace-modal-border)"] > div:first-child,
#trainingPlanLeftScroll > div[style*="border:1px solid var(--workspace-modal-border)"] > div:first-child{
  color:var(--workspace-accent-text,#86efac) !important;
  font-size:12px !important;
  font-weight:800 !important;
  letter-spacing:.35px !important;
  text-transform:uppercase !important;
}
#trainingPlanSummary{
  color:var(--workspace-modal-muted) !important;
}
@media (max-width: 960px){
  #trainingPlanModal .mfe-training-plan-card{
    grid-template-columns:1fr !important;
    height:min(92vh, 980px) !important;
  }
  #trainingPlanModal .mfe-training-plan-sidebar{
    border-right:none !important;
    border-bottom:1px solid var(--workspace-modal-soft-border) !important;
    max-height:48vh;
  }
}

@media (max-width: 720px){
  #planLibraryPickerModal .mfe-plan-picker-card{
    height:min(92vh,900px) !important;
    max-height:92vh !important;
  }
  .mfe-plan-library-browser{
    grid-template-columns:1fr;
    grid-template-rows:auto minmax(0,1fr);
  }
  .mfe-plan-library-folders{
    padding:12px 18px;
    border-right:none;
    border-bottom:1px solid var(--workspace-modal-soft-border);
    overflow-x:auto;
    overflow-y:hidden;
  }
  .mfe-plan-library-folders-heading{
    margin:0 0 8px;
  }
  .mfe-plan-library-folder-list{
    flex-direction:row;
    gap:8px;
    width:max-content;
    min-width:100%;
  }
  #planLibraryPickerModal .mfe-plan-library-folder-button{
    width:auto;
    min-width:max-content;
    flex:0 0 auto;
  }
  #planLibraryPickerList{
    grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  }
}

@media (max-width: 640px){
  #exerciseLibraryModal .mfe-library-header,
  #trainingPlanModal .mfe-training-plan-hero,
  #trainingPlanModal .mfe-training-plan-main-header,
  #planLibraryPickerModal .mfe-plan-picker-header{
    padding:18px 18px 16px !important;
    flex-direction:column !important;
  }
  #exerciseLibraryModal .mfe-library-search-row,
  #planLibraryPickerModal .mfe-plan-picker-search-row,
  #exerciseLibraryFolderBar,
  #trainingPlanLeftScroll,
  #exerciseLibraryList,
  #trainingPlanList,
  #planLibraryPickerList{
    padding-left:18px !important;
    padding-right:18px !important;
  }
  #exerciseLibraryFolderBar{
    grid-template-columns:1fr 1fr !important;
  }
  .mfe-modal-surface-title{ font-size:22px; }
  .mfe-modal-surface-title--sm{ font-size:18px; }
}


/* === editor.html :: editor-edit-picker-spacing-v113 === */
#playerEditModal label,
#sharedColorEditModal label,
#textEditModal label{
  margin-bottom:8px !important;
}
#playerEditModal .color-palette,
#sharedColorEditModal .color-palette,
#textEditModal .color-palette{
  margin-top:0 !important;
  margin-bottom:16px !important;
}
#playerEditPreset{
  margin-top:0 !important;
}
.zone-opacity-popover .zone-opacity-popover-label{
  margin-bottom:8px !important;
}


/* Stable free/pro toolbar state: avoid unlocked flash and keep upgrade visible when features are locked. */
body.editor-access-pending #exportPNG,
body.editor-access-pending #exportPDF,
body.editor-access-pending #saveLocalExercise,
body.editor-access-pending #openExerciseLibrary,
body.editor-access-pending #openTrainingPlan,
body.editor-access-pending #saveJSON,
body.editor-access-pending #togglePerspectiveTV,
body.editor-access-pending #toggleFieldOrientation,
body.editor-access-pending #exportAnimation,
body.editor-access-pending .export-trigger,
body.editor-access-pending .project-trigger,
body.editor-access-pending .view-trigger,
body.editor-access-pending .export-dropdown button,
body.editor-access-pending .project-dropdown button,
body.editor-access-pending .view-dropdown button{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
body.editor-access-pending .locked-feature::after{
  display:none !important;
}
body.editor-access-pending #upgradeBtn{
  display:none !important;
}
body.editor-free-plan #upgradeBtn{
  display:inline-flex !important;
  flex:0 0 auto;
  position:relative;
  inset:auto;
  z-index:3;
  order:98;
  margin-left:8px;
  white-space:nowrap;
}
body.editor-pro-plan #upgradeBtn{
  display:none !important;
}
@media (max-width: 860px){
  body.editor-free-plan #upgradeBtn{
    height:30px;
    padding:0 12px;
    font-size:11px;
    margin-left:6px;
  }
}





/* Training plan available players — overlay modal, refactor-safe */
#trainingPlanModal .mfe-training-plan-card{
  width:min(1280px,96vw) !important;
  grid-template-columns:minmax(340px,400px) minmax(0,1fr) !important;
  grid-template-rows:minmax(0,1fr) !important;
  overflow:hidden !important;
}
#trainingPlanModal .mfe-training-plan-workspace{
  min-width:0;
  min-height:0;
  height:100%;
  overflow:hidden;
  display:block;
}
#trainingPlanModal .mfe-training-plan-exercises-panel{
  min-width:0;
  min-height:0;
  height:100%;
  overflow:hidden;
  border-right:0;
}
#planAvailablePlayersModal,
#planPlayerChangesModal{backdrop-filter:blur(8px);}
#planAvailablePlayersModal .mfe-training-plan-available-dialog,
#planPlayerChangesModal .mfe-training-plan-player-changes-dialog{
  background:
    radial-gradient(circle at top, rgba(var(--workspace-accent-rgb,34,197,94),.12), transparent 42%),
    var(--workspace-modal-card-bg) !important;
  border:1px solid var(--workspace-modal-soft-border) !important;
  border-radius:22px !important;
  box-shadow:var(--workspace-modal-shadow) !important;
  color:var(--workspace-modal-text) !important;
}
#planAvailablePlayersModal .mfe-training-plan-available-dialog{
  width:min(1500px,98vw) !important;
  height:min(94vh,920px) !important;
  max-height:94vh !important;
}
#planAvailablePlayersModal .mfe-training-plan-available-dialog-header,
#planPlayerChangesModal .mfe-training-plan-player-changes-header{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:18px 20px 16px !important;
  border-bottom:1px solid var(--workspace-modal-soft-border) !important;
}
#planAvailablePlayersModal .mfe-training-plan-available-dialog-body{
  min-height:0;
  flex:1 1 auto;
  overflow:hidden;
  display:block;
}
#planAvailablePlayersModal .mfe-training-plan-available-panel{
  min-width:0;
  min-height:0;
  height:100%;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(560px,1.45fr) minmax(360px,.75fr);
  grid-template-rows:auto minmax(0,1fr);
  align-items:stretch;
  background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(2,6,23,.96));
}
#planAvailablePlayersModal .mfe-training-plan-available-header{
  padding:14px 16px;
  border-bottom:1px solid var(--workspace-modal-border);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  flex:0 0 auto;
}
#planAvailablePlayersModal .mfe-training-plan-available-controls{
  grid-column:1 / -1;
  grid-row:1;
  padding:12px 16px;
  border-bottom:1px solid var(--workspace-modal-border);
  display:grid;
  grid-template-columns:minmax(220px,360px) auto;
  gap:10px;
  align-items:end;
  flex:0 0 auto;
}
#planAvailablePlayersModal .mfe-training-plan-available-control-group{display:grid; gap:6px; min-width:0;}
#planAvailablePlayersModal .mfe-training-plan-available-control-label{font-size:11px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:var(--workspace-accent-text,#86efac);}
#planAvailablePlayersModal .mfe-training-plan-available-actions{display:grid; grid-template-columns:max-content max-content; gap:8px; align-items:center;}
#planAvailablePlayersModal .mfe-training-plan-available-actions button{height:36px; padding:0 12px; white-space:nowrap; min-width:0;}
#planAvailablePlayersModal .mfe-training-plan-pitch-wrap{
  grid-column:1;
  grid-row:2;
  min-width:0;
  min-height:0;
  height:100%;
  padding:14px 16px 14px;
  border-bottom:0;
  border-right:1px solid var(--workspace-modal-border);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
#planAvailablePlayersModal .mfe-training-plan-pitch{
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  min-height:0;
  height:auto;
  max-height:100%;
  border-radius:0;
  border:1px solid rgba(230,255,238,.56);
  overflow:hidden;
  background:#11803b;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.12), 0 16px 35px rgba(0,0,0,.18);
  touch-action:none;
}
#planAvailablePlayersModal .mfe-training-plan-pitch-lines{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:0;
}
#planAvailablePlayersModal .mfe-training-plan-pitch-lines-stroke{
  fill:none;
  stroke:rgba(255,255,255,.38);
  stroke-width:4;
  stroke-linecap:butt;
  stroke-linejoin:miter;
}
#planAvailablePlayersModal .mfe-training-plan-pitch-lines-stroke .is-filled{
  fill:rgba(255,255,255,.56);
  stroke:none;
}
#planAvailablePlayersModal .mfe-training-plan-pitch:before,
#planAvailablePlayersModal .mfe-training-plan-pitch:after{content:none;}
#planAvailablePlayersModal .mfe-training-plan-position-node{
  position:absolute;
  width:46px;
  min-height:36px;
  border-radius:999px;
  transform:translate(-50%,-50%) !important;
  border:2px solid var(--mfe-plan-position-stroke,rgba(255,255,255,.92));
  background:var(--mfe-plan-position-fill,var(--mfe-plan-position-color,var(--workspace-accent,#22c55e)));
  color:var(--mfe-plan-position-text,#fff);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  padding:4px 7px;
  font-size:10px;
  font-weight:900;
  line-height:1.05;
  box-shadow:0 9px 18px rgba(0,0,0,.32);
  cursor:grab;
  user-select:none;
  z-index:2;
  box-sizing:border-box;
  touch-action:none;
}
#planAvailablePlayersModal .mfe-training-plan-position-node.has-players{width:106px; min-height:50px; align-items:stretch; border-radius:16px; background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(2,6,23,.94));}
#planAvailablePlayersModal .mfe-training-plan-position-node.is-active{z-index:5; border-color:var(--mfe-plan-position-stroke,var(--workspace-accent-text,#86efac)); box-shadow:0 0 0 3px rgba(var(--workspace-accent-rgb,34,197,94),.18), 0 12px 24px rgba(0,0,0,.38);}
#planAvailablePlayersModal .mfe-training-plan-position-node:hover,
#planAvailablePlayersModal .mfe-training-plan-position-node:focus{
  transform:translate(-50%,-50%) !important;
  outline:none;
  filter:brightness(1.04);
}
#planAvailablePlayersModal .mfe-training-plan-position-node:active{cursor:grabbing;}
#planAvailablePlayersModal .mfe-training-plan-position-node-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:30px;
  min-height:24px;
  padding:0 7px;
  border-radius:999px;
  background:var(--mfe-plan-position-fill,var(--mfe-plan-position-color,var(--workspace-accent,#22c55e)));
  border:1px solid rgba(255,255,255,.86);
  color:var(--mfe-plan-position-text,#fff);
  text-align:center;
  flex:0 0 auto;
}
#planAvailablePlayersModal .mfe-training-plan-position-node:not(.has-players) .mfe-training-plan-position-node-label{
  min-width:34px;
  min-height:28px;
  padding:0 8px;
  border:0;
  background:transparent;
}
#planAvailablePlayersModal .mfe-training-plan-position-node-players{
  display:grid;
  gap:2px;
  min-width:0;
  width:100%;
}
#planAvailablePlayersModal .mfe-training-plan-position-player-name{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  border-radius:7px;
  background:var(--mfe-plan-position-fill,rgba(255,255,255,.12));
  border:1px solid var(--mfe-plan-position-stroke,rgba(255,255,255,.22));
  padding:2px 5px;
  color:var(--mfe-plan-position-text,#f8fafc);
  font-size:8.2px;
  font-weight:800;
  text-align:left;
}
#planAvailablePlayersModal .mfe-training-plan-position-player-name--empty{
  color:rgba(255,255,255,.72);
  text-align:center;
  font-size:8px;
  background:rgba(255,255,255,.08);
}
#planAvailablePlayersModal .mfe-training-plan-pitch-hint{margin-top:8px; font-size:11px; color:var(--workspace-modal-muted); line-height:1.35;}
#planAvailablePlayersModal .mfe-training-plan-position-list{
  grid-column:2;
  grid-row:2;
  min-width:0;
  min-height:0;
  height:100%;
  padding:14px 16px 14px;
  display:flex;
  flex-direction:column;
  overflow:visible;
}
#planAvailablePlayersModal .mfe-training-plan-selected-card{
  border:1px solid var(--workspace-modal-border);
  border-radius:16px;
  background:linear-gradient(180deg,rgba(15,23,42,.9),rgba(2,6,23,.78));
  padding:12px;
  display:grid;
  gap:9px;
  min-height:0;
  height:100%;
  align-content:start;
  overflow:visible;
}
#planAvailablePlayersModal .mfe-training-plan-selected-head{
  display:grid;
  grid-template-columns:minmax(116px,140px) minmax(0,1fr);
  gap:10px;
  align-items:end;
}
#planAvailablePlayersModal .mfe-training-plan-selected-kicker{
  color:var(--workspace-accent-text,#86efac);
  font-size:11px;
  font-weight:900;
  line-height:1.2;
  letter-spacing:.03em;
  text-transform:uppercase;
}
#planAvailablePlayersModal .mfe-training-plan-selected-help{font-size:12px; line-height:1.35; color:var(--workspace-modal-muted);}
#planAvailablePlayersModal .mfe-training-plan-selected-card{overflow:visible;}
#planAvailablePlayersModal .mfe-training-plan-global-colors{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  min-width:0;
  overflow:visible;
}
#planAvailablePlayersModal .mfe-training-plan-global-color-card{
  display:grid;
  gap:8px;
  min-width:0;
  padding:10px;
  border-radius:16px;
  border:1px solid rgba(31,41,55,.95);
  background:linear-gradient(180deg,rgba(15,23,42,.76),rgba(2,6,23,.46));
  overflow:visible;
}
#planAvailablePlayersModal .mfe-training-plan-global-color-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
}
#planAvailablePlayersModal .mfe-training-plan-global-color-title{
  font-size:12px;
  font-weight:950;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--workspace-accent-text,#86efac);
}
#planAvailablePlayersModal .mfe-training-plan-color-preview{
  min-width:44px;
  min-height:28px;
  padding:0 12px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:2px solid var(--mfe-plan-preview-stroke,#fff);
  background:var(--mfe-plan-preview-fill,var(--workspace-accent,#22c55e));
  color:var(--mfe-plan-preview-text,#fff);
  font-size:11px;
  font-weight:950;
  line-height:1;
  box-shadow:0 8px 18px rgba(0,0,0,.24);
}
#planAvailablePlayersModal .mfe-training-plan-global-color-picker-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  overflow:visible;
}
#planAvailablePlayersModal .mfe-training-plan-color-popover{
  position:relative;
  min-width:0;
  overflow:visible;
}
#planAvailablePlayersModal .mfe-training-plan-color-popover summary{list-style:none;}
#planAvailablePlayersModal .mfe-training-plan-color-popover summary::-webkit-details-marker{display:none;}
#planAvailablePlayersModal .mfe-training-plan-color-trigger{
  min-height:36px;
  padding:6px 8px;
  border-radius:13px;
  border:1px solid #243044;
  background:var(--workspace-modal-backdrop);
  color:var(--workspace-modal-text);
  cursor:pointer;
  display:grid;
  gap:5px;
  align-content:center;
  min-width:0;
  user-select:none;
}
#planAvailablePlayersModal .mfe-training-plan-color-trigger:hover,
#planAvailablePlayersModal .mfe-training-plan-color-trigger:focus{
  outline:none;
  border-color:var(--workspace-accent-text,#86efac);
  background:rgba(15,23,42,.9);
}
#planAvailablePlayersModal .mfe-training-plan-color-popover[open] .mfe-training-plan-color-trigger{
  border-color:var(--workspace-accent-text,#86efac);
  box-shadow:0 0 0 3px rgba(var(--workspace-accent-rgb,34,197,94),.14);
}
#planAvailablePlayersModal .mfe-training-plan-color-trigger-label{
  display:block;
  font-size:9px;
  font-weight:950;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--workspace-modal-muted);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#planAvailablePlayersModal .mfe-training-plan-color-trigger-current{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  font-size:11px;
  font-weight:900;
  color:var(--workspace-modal-title);
  overflow:hidden;
}
#planAvailablePlayersModal .mfe-training-plan-color-trigger-current span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#planAvailablePlayersModal .mfe-training-plan-color-dot{
  width:17px;
  height:17px;
  min-width:17px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.72);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.2);
}
#planAvailablePlayersModal .mfe-training-plan-color-popover-panel{
  position:absolute;
  z-index:80;
  top:calc(100% + 8px);
  left:0;
  min-width:220px;
  padding:8px;
  border-radius:14px;
  border:1px solid rgba(var(--workspace-accent-rgb,34,197,94),.34);
  background:#07111f;
  box-shadow:0 18px 40px rgba(0,0,0,.42);
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
}
#planAvailablePlayersModal .mfe-training-plan-color-popover:nth-child(3n) .mfe-training-plan-color-popover-panel{right:0; left:auto;}
#planAvailablePlayersModal .mfe-training-plan-color-option{
  min-height:32px !important;
  padding:5px 8px !important;
  border-radius:10px !important;
  border:1px solid rgba(148,163,184,.28) !important;
  background:rgba(15,23,42,.88) !important;
  color:var(--workspace-modal-text) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:7px !important;
  font-size:11px !important;
  font-weight:850 !important;
  line-height:1.1 !important;
  text-align:left !important;
  transform:none !important;
  box-shadow:none !important;
  white-space:nowrap !important;
  cursor:pointer !important;
}
#planAvailablePlayersModal .mfe-training-plan-color-option:hover,
#planAvailablePlayersModal .mfe-training-plan-color-option:focus{
  outline:none !important;
  border-color:var(--workspace-accent-text,#86efac) !important;
  background:rgba(21,128,61,.28) !important;
  transform:none !important;
}
#planAvailablePlayersModal .mfe-training-plan-color-option.is-active{
  border-color:var(--workspace-accent-text,#86efac) !important;
  background:rgba(var(--workspace-accent-rgb,34,197,94),.18) !important;
  box-shadow:0 0 0 2px rgba(var(--workspace-accent-rgb,34,197,94),.12) !important;
}
#planAvailablePlayersModal .mfe-training-plan-selected-slots{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
#planAvailablePlayersModal .mfe-training-plan-selected-slot{display:grid; gap:5px; min-width:0;}
#planAvailablePlayersModal .mfe-training-plan-selected-slot span{font-size:10px; font-weight:900; letter-spacing:.03em; text-transform:uppercase; color:var(--workspace-modal-muted);}
#planAvailablePlayersModal .mfe-training-plan-position-label{
  height:34px !important;
  min-width:0 !important;
  width:100% !important;
  box-sizing:border-box;
  font-weight:800;
  text-transform:uppercase;
  font-size:12px !important;
}
#planAvailablePlayersModal .mfe-training-plan-slot-input{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  height:36px !important;
  box-sizing:border-box !important;
  font-size:13px !important;
  line-height:1.2 !important;
  color:var(--workspace-modal-text) !important;
  background:var(--workspace-modal-input-bg) !important;
  border:1px solid var(--workspace-modal-border) !important;
  border-radius:11px !important;
  padding:0 11px !important;
}
#planAvailablePlayersModal .mfe-training-plan-slot-input:focus,
#planAvailablePlayersModal .mfe-training-plan-position-label:focus{
  outline:none;
  border-color:var(--workspace-accent-text,#86efac) !important;
  box-shadow:0 0 0 2px rgba(var(--workspace-accent-rgb,34,197,94),.12);
}
#planAvailablePlayersModal .mfe-training-plan-empty-panel{border:1px dashed #334155; border-radius:14px; padding:16px; text-align:center; color:var(--workspace-modal-muted); font-size:13px; line-height:1.45;}

#planAvailablePlayersModal .mfe-training-plan-available-panel{width:100%;}
#planAvailablePlayersModal .mfe-training-plan-available-header{display:none;}
#planAvailablePlayersModal .mfe-training-plan-available-actions{justify-content:flex-end;}
#planPlayerChangesModal .mfe-training-plan-player-changes-body{padding:16px; display:grid; gap:12px; overflow:auto;}
#planPlayerChangesModal #planPlayerChangesText{width:100%; min-height:220px; resize:vertical; border-radius:14px; border:1px solid var(--workspace-modal-border); background:var(--workspace-modal-input-bg); color:var(--workspace-modal-text); padding:12px; font:inherit; font-size:14px; line-height:1.45; box-sizing:border-box;}
#planPlayerChangesModal #planPlayerChangesText:focus{outline:none; border-color:var(--workspace-accent-text,#86efac); box-shadow:0 0 0 2px rgba(var(--workspace-accent-rgb,34,197,94),.12);}
#planPlayerChangesModal .mfe-training-plan-player-changes-actions{display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap;}
@media (max-width:900px){
  #trainingPlanModal{
    padding:6px !important;
    align-items:stretch !important;
    justify-content:stretch !important;
  }
  #trainingPlanModal .mfe-training-plan-card{
    width:calc(100vw - 12px) !important;
    height:calc(100dvh - 12px) !important;
    max-height:calc(100dvh - 12px) !important;
    display:flex !important;
    flex-direction:column !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  #trainingPlanModal .mfe-training-plan-main{
    order:1;
    flex:0 0 auto;
    width:100%;
    min-height:0 !important;
    height:auto !important;
    overflow:visible !important;
  }
  #trainingPlanModal .mfe-training-plan-main-header{
    position:sticky;
    top:0;
    z-index:8;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px !important;
    padding:11px 12px 10px !important;
    align-items:center !important;
    background:inherit;
  }
  #trainingPlanModal .mfe-training-plan-main-header .mfe-modal-surface-heading{
    grid-column:1;
    grid-row:1;
  }
  #trainingPlanModal .mfe-training-plan-main-header #closeTrainingPlan{
    grid-column:2;
    grid-row:1;
    justify-self:end;
  }
  #trainingPlanModal .mfe-training-plan-main-header #planAddCurrentBtn{
    grid-column:1;
    grid-row:2;
  }
  #trainingPlanModal .mfe-training-plan-main-header #planAddFromLibraryBtn{
    grid-column:2;
    grid-row:2;
  }
  #trainingPlanModal .mfe-training-plan-main-header .mfe-training-plan-add-action{
    width:100%;
    min-width:0;
    min-height:40px;
    padding:7px 10px;
    white-space:normal;
    line-height:1.15;
  }
  #trainingPlanModal .mfe-training-plan-main-header .mfe-modal-surface-badge{
    display:none;
  }
  #trainingPlanModal .mfe-training-plan-main-header .mfe-modal-surface-title--sm{
    font-size:18px;
  }
  #trainingPlanModal .mfe-training-plan-workspace,
  #trainingPlanModal .mfe-training-plan-exercises-panel{
    min-height:0 !important;
    height:auto !important;
    overflow:visible !important;
  }
  #trainingPlanModal .mfe-training-plan-sidebar{
    order:2;
    flex:0 0 auto;
    width:100%;
    min-height:0 !important;
    max-height:none !important;
    border-right:0 !important;
    border-top:1px solid var(--workspace-modal-soft-border) !important;
  }
  #trainingPlanModal .mfe-training-plan-hero{
    padding:14px 16px 12px !important;
  }
  #trainingPlanModal #trainingPlanLeftScroll{
    flex:none !important;
    min-height:0 !important;
    overflow:visible !important;
    padding:14px !important;
  }
  #trainingPlanModal #trainingPlanLeftScroll div[style*="grid-template-columns:minmax"],
  #trainingPlanModal #trainingPlanLeftScroll div[style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr !important;
  }
  #trainingPlanModal textarea{
    min-height:96px !important;
  }
}
@media (max-width:980px){
  #planAvailablePlayersModal .mfe-training-plan-available-dialog{height:min(94vh,980px) !important;}
  #planAvailablePlayersModal .mfe-training-plan-available-panel{
    display:flex;
    flex-direction:column;
    overflow:auto;
  }
  #planAvailablePlayersModal .mfe-training-plan-available-controls{grid-template-columns:1fr;}
  #planAvailablePlayersModal .mfe-training-plan-available-actions{grid-template-columns:1fr;}
  #planAvailablePlayersModal .mfe-training-plan-available-actions button{width:100%;}
  #planAvailablePlayersModal .mfe-training-plan-pitch-wrap{border-right:0; border-bottom:1px solid var(--workspace-modal-border); height:auto;}
  #planAvailablePlayersModal .mfe-training-plan-pitch{min-height:320px; max-height:none;}
  #planAvailablePlayersModal .mfe-training-plan-position-list{height:auto; min-height:auto; padding:14px 16px 18px;}
  #planAvailablePlayersModal .mfe-training-plan-selected-card{height:auto;}
  #planAvailablePlayersModal .mfe-training-plan-selected-head{grid-template-columns:1fr;}
  #planAvailablePlayersModal .mfe-training-plan-selected-slots{grid-template-columns:1fr;}
}


@media (max-width:720px){
  #trainingPlanModal .mfe-training-plan-selected-head{grid-template-columns:1fr;}
  #trainingPlanModal .mfe-training-plan-selected-slots{grid-template-columns:1fr;}
}

@media (max-width: 820px){
  #trainingPlanModal .mfe-training-plan-global-colors{grid-template-columns:1fr;}
}



/* Regresso seguro ao plano após editar um exercício */
.mfe-plan-return-overlay{
  display:none;
  position:fixed;
  top:calc(var(--topbar-h, 72px) + 10px);
  left:var(--mfe-plan-return-x, 50vw);
  right:auto;
  bottom:auto;
  z-index:10010;
  width:max-content;
  max-width:min(520px, calc(100vw - 32px));
  min-height:36px;
  height:auto!important;
  padding:7px 14px;
  align-items:center;
  justify-content:center;
  border:1px solid var(--accent);
  border-radius:10px;
  background:var(--panel2);
  background:color-mix(in srgb, var(--panel2) 90%, transparent);
  color:var(--text);
  font-size:12px;
  font-weight:900;
  line-height:1.15;
  text-align:center;
  white-space:nowrap;
  box-shadow:0 8px 22px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.05) inset;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  cursor:pointer;
  pointer-events:auto;
  transform:translateX(-50%);
  transition:opacity .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
body.mfe-plan-exercise-editing .mfe-plan-return-overlay:not([hidden]){display:inline-flex;}
.mfe-plan-return-overlay:hover{
  background:color-mix(in srgb, var(--panel2) 78%, var(--accent) 22%);
  border-color:var(--accent-dark);
  color:var(--text);
  transform:translateX(-50%) translateY(-1px);
}
.mfe-plan-return-overlay:active{transform:translateX(-50%);}
.mfe-plan-return-overlay:disabled{
  cursor:wait;
  opacity:.78;
  transform:translateX(-50%);
}
.mfe-plan-return-overlay.is-passive{
  opacity:.24;
  pointer-events:none;
  box-shadow:none;
}
body.presentation .mfe-plan-return-overlay{top:10px;}
@media (max-width:760px){
  .mfe-plan-return-overlay{
    top:calc(var(--topbar-h, 60px) + 8px);
    left:var(--mfe-plan-return-x, 50vw);
    right:auto;
    bottom:auto;
    width:max-content;
    max-width:calc(100vw - 24px);
    min-height:34px;
    padding:7px 11px;
    border-radius:9px;
    font-size:clamp(10.5px, 2.9vw, 11.5px);
  }
}

/* Training plan exercise cards — compact, stable and responsive */
#trainingPlanModal .mfe-training-plan-list{
  min-width:0;
  min-height:0;
  height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px !important;
  align-content:start;
  align-items:stretch;
  grid-auto-rows:max-content;
  padding:14px !important;
}
#trainingPlanModal .mfe-training-plan-exercise-card{
  min-width:0;
  border:1px solid var(--workspace-modal-border) !important;
  border-radius:16px !important;
  background:var(--workspace-modal-panel-bg) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.16) !important;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  cursor:pointer;
  transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
#trainingPlanModal .mfe-training-plan-exercise-card:hover{
  border-color:var(--workspace-modal-border-strong) !important;
  transform:translateY(-1px);
}
#trainingPlanModal .mfe-training-plan-exercise-card.is-active{
  border-color:var(--workspace-accent,#22c55e) !important;
  box-shadow:0 0 0 1px rgba(var(--workspace-accent-rgb,34,197,94),.24) inset,0 10px 26px rgba(var(--workspace-accent-rgb,34,197,94),.13) !important;
}
#trainingPlanModal .mfe-training-plan-exercise-preview{
  flex:0 0 auto;
  width:100%;
  border-bottom:1px solid var(--workspace-modal-soft-border) !important;
  background:var(--workspace-modal-preview-bg) !important;
}
#trainingPlanModal .mfe-training-plan-exercise-preview > div{
  width:100%;
  height:auto !important;
  aspect-ratio:16 / 9;
  box-sizing:border-box;
  padding:8px !important;
  border-bottom:0 !important;
  background:transparent !important;
  overflow:hidden;
}
#trainingPlanModal .mfe-training-plan-exercise-preview img{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
}
#trainingPlanModal .mfe-training-plan-exercise-body{
  flex:1 1 auto;
  min-height:0;
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
#trainingPlanModal .mfe-training-plan-exercise-copy{
  flex:1 1 auto;
  min-height:125px;
  display:flex;
  flex-direction:column;
  gap:5px;
}
#trainingPlanModal .mfe-training-plan-exercise-heading{
  min-width:0;
}
#trainingPlanModal .mfe-training-plan-exercise-number{
  margin-bottom:3px;
  color:var(--workspace-accent-text,#86efac);
  font-size:11px;
  font-weight:800;
  line-height:1.2;
}
#trainingPlanModal .mfe-training-plan-exercise-title{
  min-width:0;
  min-height:34px;
  color:inherit;
  font-size:14px;
  font-weight:800;
  line-height:1.25;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
#trainingPlanModal .mfe-training-plan-exercise-meta{
  min-width:0;
  display:grid;
  gap:3px;
}
#trainingPlanModal .mfe-training-plan-exercise-meta-line{
  min-width:0;
  color:var(--workspace-modal-muted);
  font-size:11px;
  line-height:1.3;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
#trainingPlanModal .mfe-training-plan-exercise-specific{
  min-height:29px;
  color:var(--workspace-modal-subtle);
  font-size:11px;
  line-height:1.35;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
#trainingPlanModal .mfe-training-plan-exercise-player-status{
  color:var(--workspace-accent-text,#86efac);
  font-size:10px;
  font-weight:800;
  line-height:1.25;
}
#trainingPlanModal .mfe-training-plan-exercise-actions{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:5px;
}
#trainingPlanModal .mfe-training-plan-exercise-actions button{
  width:100%;
  min-width:0;
  height:34px !important;
  border-radius:10px !important;
  padding:0 8px !important;
  font-size:11px !important;
}
#trainingPlanModal .mfe-training-plan-empty{
  grid-column:1 / -1;
  min-height:112px;
  padding:24px !important;
  border:1px dashed #334155 !important;
  border-radius:14px !important;
  background:transparent !important;
  box-shadow:none !important;
  color:var(--workspace-modal-muted);
  text-align:center;
  line-height:1.5;
  display:flex;
  align-items:center;
  justify-content:center;
}
#trainingPlanModal .mfe-training-plan-empty strong{
  color:var(--workspace-modal-text);
}
@media (max-width:1180px){
  #trainingPlanModal .mfe-training-plan-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:900px){
  #trainingPlanModal .mfe-training-plan-list{
    height:auto;
    overflow:visible;
    grid-template-columns:repeat(2,minmax(0,1fr));
    padding:10px !important;
    gap:10px !important;
  }
}
@media (max-width:620px){
  #trainingPlanModal .mfe-training-plan-list{
    grid-template-columns:1fr;
  }
  #trainingPlanModal .mfe-training-plan-exercise-body{
    padding:10px;
  }
}



.mfe-training-plan-available-actions:has(#planAvailableImportLastBtn){
  display:grid;
  grid-template-columns:repeat(3, 204px);
  gap:12px;
  align-items:stretch;
  justify-content:end;
  justify-self:end;
  margin-left:auto;
  width:max-content;
  max-width:100%;
}
.mfe-training-plan-available-actions:has(#planAvailableImportLastBtn) button{
  width:100%;
  min-width:0;
  height:42px;
  white-space:nowrap;
}
@media (max-width: 1180px){
  .mfe-training-plan-available-actions:has(#planAvailableImportLastBtn){
    grid-template-columns:repeat(3, minmax(160px, 1fr));
    width:100%;
  }
}
@media (max-width: 760px){
  .mfe-training-plan-available-actions:has(#planAvailableImportLastBtn){
    grid-template-columns:1fr;
    width:100%;
  }
}

/* MFA safe root overscroll boundary — 2026-06-29
   Keeps normal wheel/touch scrolling. Only the document/root page containers stop browser rubber-band; inner cards/lists/tables are left free to pass wheel scroll to the page. */
html,
body{
  overscroll-behavior:none!important;
  overscroll-behavior-x:none!important;
  overscroll-behavior-y:none!important;
  scroll-behavior:auto!important;
}
.app,
.app-shell,
.shell,
.page-shell,
.page,
.main,
main,
.content,
.workspace,
.gps-page-shell{
  overscroll-behavior-y:none!important;
  overscroll-behavior-x:none!important;
  scroll-behavior:auto!important;
}
/* MFA wheel-safe inner scroll recovery — 2026-06-29
   Inner panels/lists/tables must not trap mouse-wheel scrolling at their edges; root containers above still stop the browser bounce. */
.panel,
.card,
.module,
.list,
.history-list,
.table-wrap,
.modal,
.modal-card,
.drawer,
.mobile-drawer,
.panel-roster .list,
.match-stats-list-inline,
.editor-scroll,
.preview-panel,
.daily-report-body,
.dropdown-menu,
.select-menu,
.roster-list{
  overscroll-behavior:auto!important;
  overscroll-behavior-x:auto!important;
  overscroll-behavior-y:auto!important;
}

/* Mobile editor viewport and field controls — canonical phone layout */
@media(max-width:767px){
  :root{
    --mfe-phone-bottombar-height:calc(74px + env(safe-area-inset-bottom));
  }

  #container,
  body.workspace-redesign #container{
    bottom:var(--mfe-phone-bottombar-height)!important;
  }

  .mfe-phone-bottombar{
    box-sizing:border-box!important;
    height:var(--mfe-phone-bottombar-height)!important;
    min-height:var(--mfe-phone-bottombar-height)!important;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom))!important;
  }

  .mfe-phone-sheet{
    width:min(400px,100vw)!important;
    max-width:100vw!important;
    box-sizing:border-box!important;
  }

  .mfe-phone-tool-content .workspace-tool-panel[data-workspace-category="field"]{
    display:grid!important;
    gap:10px!important;
  }

  .mfe-phone-tool-content .workspace-tool-panel[data-workspace-category="field"] > .panel-group{
    margin:0!important;
    padding:11px!important;
    border-radius:15px!important;
  }

  .mfe-phone-tool-content .workspace-tool-panel[data-workspace-category="field"] > .panel-group:first-of-type .library-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }

  .mfe-phone-tool-content .workspace-tool-panel[data-workspace-category="field"] > .panel-group:first-of-type .drag-item.field-btn{
    width:100%!important;
    min-width:0!important;
    min-height:82px!important;
    height:82px!important;
    padding:8px!important;
    display:grid!important;
    grid-template-rows:48px auto!important;
    align-items:center!important;
    justify-items:center!important;
    gap:5px!important;
    border-radius:13px!important;
  }

  .mfe-phone-tool-content .workspace-tool-panel[data-workspace-category="field"] > .panel-group:first-of-type .drag-item.field-btn::before{
    width:100%!important;
    max-width:92px!important;
    height:44px!important;
    margin:0!important;
    border-radius:9px!important;
    box-sizing:border-box!important;
  }

  .mfe-phone-tool-content .workspace-tool-panel[data-workspace-category="field"] > .panel-group:first-of-type .mfe-phone-item-label{
    margin:0!important;
    font-size:10.5px!important;
    line-height:1.1!important;
    font-weight:850!important;
    color:#dbe7ec!important;
  }

  .mfe-phone-tool-content .workspace-field-control-group{
    padding:11px!important;
  }

  .mfe-phone-tool-content .workspace-field-control-group > .panel-title{
    margin:0 0 9px!important;
    font-size:10px!important;
    line-height:1!important;
    letter-spacing:.1em!important;
  }

  .mfe-phone-tool-content .workspace-field-choice-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }

  .mfe-phone-tool-content .workspace-field-toggle-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }

  .mfe-phone-tool-content .workspace-field-toggle-grid .workspace-field-option-wide{
    grid-column:auto!important;
  }

  .mfe-phone-tool-content .workspace-field-option{
    position:relative!important;
    width:100%!important;
    min-width:0!important;
    height:82px!important;
    min-height:82px!important;
    margin:0!important;
    padding:8px 6px!important;
    display:grid!important;
    grid-template-rows:46px auto!important;
    align-items:center!important;
    justify-items:center!important;
    gap:4px!important;
    overflow:hidden!important;
    border:1px solid #2b414c!important;
    border-radius:13px!important;
    background:#10212b!important;
    color:#dce8ec!important;
    box-shadow:none!important;
    font-size:10.5px!important;
    font-weight:900!important;
    line-height:1.08!important;
    text-align:center!important;
    touch-action:manipulation!important;
  }

  .mfe-phone-tool-content .workspace-field-option::before,
  .mfe-phone-tool-content .workspace-field-option::after{
    content:none!important;
    display:none!important;
  }

  .mfe-phone-tool-content .workspace-field-choice-icon{
    width:68px!important;
    max-width:100%!important;
    height:44px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:currentColor!important;
    pointer-events:none!important;
  }

  .mfe-phone-tool-content .workspace-field-choice-icon svg{
    display:block!important;
    width:100%!important;
    height:100%!important;
    overflow:visible!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:2.2!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
  }

  .mfe-phone-tool-content .workspace-field-choice-label{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    color:inherit!important;
    font-size:10.5px!important;
    font-weight:900!important;
    line-height:1.08!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    pointer-events:none!important;
  }

  .mfe-phone-tool-content .workspace-field-option:hover,
  .mfe-phone-tool-content .workspace-field-option.active,
  .mfe-phone-tool-content .workspace-field-option[aria-pressed="true"]{
    border-color:var(--workspace-accent,#22c55e)!important;
    background:var(--workspace-accent-surface,#173d2b)!important;
    color:var(--workspace-accent-text,#dcffe8)!important;
    box-shadow:0 0 0 2px rgba(var(--workspace-accent-rgb,34,197,94),.12)!important;
    transform:none!important;
  }

  .mfe-phone-tool-content .workspace-field-toggle-grid .workspace-field-option{
    height:88px!important;
    min-height:88px!important;
    padding-inline:4px!important;
  }

  .mfe-phone-tool-content .workspace-field-toggle-grid .workspace-field-choice-icon{
    width:54px!important;
    height:42px!important;
  }

  .mfe-phone-tool-content .workspace-field-toggle-grid .workspace-field-choice-label{
    white-space:normal!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }
}

@media(max-width:380px){
  .mfe-phone-tool-content .workspace-field-option{
    height:78px!important;
    min-height:78px!important;
  }
  .mfe-phone-tool-content .workspace-field-toggle-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .mfe-phone-tool-content .workspace-field-toggle-grid .workspace-field-option-wide{
    grid-column:1 / -1!important;
  }
}