:root {
  --bg: #07111f;
  --card: rgba(255,255,255,.96);
  --muted: #64748b;
  --text: #0f172a;
  --brand: #0ea5e9;
  --brand-dark: #0369a1;
  --brand-green: #22c55e;
  --line: #e2e8f0;
  --danger: #dc2626;
  --soft: #f8fafc;
  --soft-blue: #e0f2fe;
  --shadow: 0 24px 80px rgba(2, 6, 23, .28);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    linear-gradient(rgba(7,17,31,.86), rgba(7,17,31,.9)),
    url('/assets/branding/coachzippi-app-icon.png'),
    radial-gradient(circle at top left, #155e75 0, #0f172a 44%, #020617 100%);
  background-size: auto, min(520px, 46vw), auto;
  background-position: center, center 58%, center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  min-height: 100vh;
  color: var(--text);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 10% 15%, rgba(14,165,233,.26), transparent 28%), radial-gradient(circle at 90% 8%, rgba(34,197,94,.18), transparent 24%);
}
.shell { width: min(1200px, calc(100% - 32px)); margin: 0 auto; padding: 32px 0; position: relative; }
.card { background: var(--card); border-radius: 28px; box-shadow: var(--shadow); border: 1px solid rgba(255,255,255,.56); backdrop-filter: blur(14px); }
.auth-card { max-width: 540px; margin: 7vh auto; padding: 34px; }
.brand-row { display: flex; gap: 16px; align-items: center; margin-bottom: 24px; }
.brand-row.compact { margin-bottom: 0; }
.brand-logo { width: 66px; height: 66px; border-radius: 18px; object-fit:cover; filter: drop-shadow(0 12px 22px rgba(14,165,233,.22)); }
.brand-logo.small { width: 54px; height: 54px; border-radius: 18px; }
h1, h2, h3, p { margin-top: 0; }
h1 { letter-spacing: -.04em; }
p { color: var(--muted); line-height: 1.5; }
.tabs { display: grid; grid-template-columns: 1fr 1fr; background: var(--soft); padding: 6px; border-radius: 18px; margin-bottom: 20px; border: 1px solid var(--line); }
.tab { border: 0; padding: 12px; border-radius: 13px; background: transparent; cursor: pointer; font-weight: 800; color: #334155; }
.tab.active { background: white; box-shadow: 0 6px 18px rgba(15,23,42,.09); color: var(--brand-dark); }
.stack { display: grid; gap: 14px; }
label { display:grid; gap: 6px; font-weight: 800; color:#334155; }
input, select { width:100%; border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; font: inherit; background: white; color: var(--text); outline: none; }
input:focus, select:focus { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(14,165,233,.14); }
button { border: 0; border-radius: 14px; padding: 12px 16px; font-weight: 900; cursor:pointer; transition: transform .12s ease, box-shadow .12s ease, background .12s ease; }
button:hover { transform: translateY(-1px); }
.primary { background: linear-gradient(135deg, var(--brand), var(--brand-dark)); color: white; box-shadow: 0 10px 22px rgba(14,165,233,.22); }
.secondary { background: #e0f2fe; color: #075985; }
.ghost { background: #f1f5f9; color: #334155; }
.danger { background: #fee2e2; color: var(--danger); }
.full { width: 100%; }
.hidden { display: none !important; }
.hint { font-size: 13px; color: var(--muted); }
.topbar { padding: 20px 24px; display:flex; justify-content:space-between; align-items:center; margin-bottom: 20px; }
.top-actions { display:flex; gap: 10px; flex-wrap: wrap; }
.grid { display:grid; grid-template-columns: 292px 1fr; gap: 20px; }
.sidebar, .workspace { padding: 24px; }
.sidebar { align-self: start; position: sticky; top: 20px; }
.team-list { display:grid; gap: 10px; margin-bottom: 18px; }
.team-button { text-align:left; background: rgba(248,250,252,.9); border: 1px solid var(--line); color: var(--text); }
.team-button small { display:block; color: var(--muted); margin-top: 4px; }
.team-button.active { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(14,165,233,.16); background: white; }
.premium-note { margin-top: 18px; background: linear-gradient(135deg,#ecfdf5,#f0f9ff); color:#166534; border: 1px solid #bbf7d0; border-radius: 18px; padding: 14px; font-size: 13px; }
.empty { text-align:center; padding: 84px 20px; }
.workspace-header { display:flex; justify-content:space-between; gap: 16px; align-items:flex-start; border-bottom: 1px solid var(--line); padding-bottom: 18px; margin-bottom: 18px; }
.eyebrow { color: var(--brand-dark); text-transform: uppercase; letter-spacing: .08em; font-size: 12px; font-weight: 950; display:block; margin-bottom: 6px; }
.workspace-tabs { display:flex; gap: 10px; background: #f1f5f9; border: 1px solid var(--line); border-radius: 18px; padding: 8px; margin: 0 0 18px; overflow-x: auto; }
.workspace-tab { position: relative; background: transparent; color: #334155; white-space: nowrap; display: inline-flex; align-items: center; gap: 8px; }
.workspace-tab.active { background: white; color: var(--brand-dark); box-shadow: 0 8px 22px rgba(15,23,42,.08); }
.active-dot { width: 9px; height: 9px; border-radius: 999px; background: #cbd5e1; display: inline-block; }
.workspace-tab.has-active .active-dot { background: var(--brand-green); box-shadow: 0 0 0 5px rgba(34,197,94,.16); animation: pulse 1.6s infinite; }
@keyframes pulse { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.28); opacity: .72; } }
.tab-panel { display:grid; gap: 18px; }
.panel { background: rgba(248,250,252,.92); border: 1px solid var(--line); border-radius: 22px; padding: 18px; }
.accent-panel { background: linear-gradient(135deg, #ffffff, #eff6ff); }
.coach-form { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.coach-form button { grid-column: 1 / -1; }
.upload-box { display:grid; grid-template-columns: 1fr 1fr auto; gap: 10px; align-items: center; }
.list { display:grid; gap: 10px; margin-top: 14px; }
.item { background:white; border:1px solid var(--line); border-radius: 18px; padding: 13px; display:flex; justify-content:space-between; gap: 12px; align-items:center; box-shadow: 0 6px 18px rgba(15,23,42,.04); }
.item small { color: var(--muted); display:block; margin-top: 4px; }
.item input[type="checkbox"] { width: auto; }
.share-controls { display:grid; grid-template-columns: 1fr 180px 140px; gap: 12px; align-items:start; }
#shareCoachSelect { min-height: 112px; }
.session-header { display:flex; justify-content:space-between; gap:12px; align-items: flex-start; }
.timer-card { display:grid; grid-template-columns: 1.2fr 120px 180px; gap: 16px; align-items:end; background:white; border-radius:20px; border:1px solid var(--line); padding:16px; }
.timer-display { font-size: 52px; font-weight: 950; text-align:center; color:#0f172a; letter-spacing: -.05em; }
.timer-actions { display:flex; gap: 10px; flex-wrap:wrap; margin-top: 14px; }
dialog { border:0; border-radius: 24px; padding:0; width:min(460px, calc(100% - 28px)); box-shadow: var(--shadow); }
dialog::backdrop { background: rgba(2,6,23,.72); backdrop-filter: blur(4px); }
.dialog-card { padding: 24px; }
.dialog-actions { display:flex; justify-content:flex-end; gap: 10px; }
.toast { position: fixed; top:max(18px, env(safe-area-inset-top)); left: 50%; transform: translateX(-50%); z-index: 2000; background:#0f172a; color:white; padding: 12px 16px; border-radius: 16px; box-shadow:0 20px 50px rgba(0,0,0,.35); width:max-content; max-width:min(760px, calc(100% - 32px)); text-align:center; }

.preference-card {
  padding: 18px 22px;
  margin-bottom: 20px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}
.preference-card h2 { font-size: 18px; margin-bottom: 4px; }
.communication-form { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.check-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 10px 13px;
  font-weight: 900;
  color: #334155;
}
.check-label input { width: auto; }
.pref-note { color: #166534 !important; }
button:disabled { opacity: .66; cursor: wait; transform: none; }

@media (max-width: 960px) {
  .grid, .timer-card, .share-controls, .upload-box { grid-template-columns: 1fr; }
  .coach-form { grid-template-columns: 1fr; }
  .topbar, .workspace-header, .session-header, .preference-card { flex-direction: column; align-items: stretch; }
  .sidebar { position: static; }
}

.success-banner {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  background: #16a34a;
  color: white;
  padding: 18px 24px;
  border-radius: 20px;
  box-shadow: 0 24px 80px rgba(2, 6, 23, .32);
  font-weight: 900;
  max-width: min(620px, calc(100% - 32px));
  text-align: center;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,.32);
}

.badge {
  display: inline-block;
  background: #dcfce7;
  color: #166534;
  border: 1px solid #bbf7d0;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-right: 8px;
}

.interactive-plan-item {
  align-items: center;
}

.active-drill-details {
  margin-top: 18px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 16px;
}

.active-drill-topline {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.active-drill-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1.15fr) minmax(220px, .85fr) minmax(220px, .85fr);
  gap: 16px;
  align-items: start;
}

.active-drill-diagram {
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  background: #f8fafc;
}

.active-drill-diagram img {
  display: block;
  width: 100%;
  height: auto;
}

.active-drill-details h4 {
  margin: 0 0 8px;
  color: var(--brand-dark);
}

.active-drill-details ul {
  margin: 0 0 14px 18px;
  padding: 0;
  color: #334155;
  line-height: 1.45;
}

@media (max-width: 960px) {
  .active-drill-grid { grid-template-columns: 1fr; }
}


/* Active Practice Mode v2A.1 / v2A.2 */
.session-panel.active-practice-focus {
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.session-panel.active-practice-focus > .session-header,
.session-panel.active-practice-focus > .timer-card,
.session-panel.active-practice-focus > .timer-actions {
  display: none;
}

.session-panel.active-practice-focus .active-drill-details {
  margin-top: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.active-practice-fullscreen {
  min-height: calc(100vh - 210px);
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.active-practice-topbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto minmax(460px, auto);
  gap: 16px;
  align-items: center;
  padding: 14px;
  border-radius: 20px;
  background: #ffffff;
  border: 1px solid var(--line);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

.active-drill-count {
  font-size: 12px;
  font-weight: 950;
  opacity: 0.65;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.active-practice-title h1 {
  margin: 4px 0 0;
  font-size: clamp(22px, 2.4vw, 34px);
  color: var(--brand-dark);
}

.active-timer-wrap {
  text-align: center;
}

.active-practice-timer {
  font-size: clamp(48px, 7vw, 86px);
  font-weight: 950;
  line-height: 0.95;
  font-variant-numeric: tabular-nums;
  color: var(--brand-dark);
}

.active-timer-status {
  margin-top: 4px;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  opacity: 0.65;
}

.active-practice-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.active-practice-controls button {
  min-width: 92px;
  white-space: nowrap;
  padding: 10px 12px;
}

.active-practice-drill-layout {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(420px, 1.3fr) minmax(300px, 0.7fr);
  gap: 14px;
}

.active-practice-diagram {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px;
  border-radius: 20px;
  background: #ffffff;
  border: 1px solid var(--line);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
  overflow: hidden;
}

.active-practice-diagram img {
  width: 100%;
  height: 100%;
  max-height: calc(100vh - 330px);
  object-fit: contain;
}

.active-practice-detail {
  display: grid;
  gap: 14px;
  min-height: 0;
}

.active-detail-card {
  padding: 16px;
  border-radius: 20px;
  background: #ffffff;
  border: 1px solid var(--line);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
  overflow: auto;
}

.active-detail-card.compact {
  max-height: 180px;
}

.active-detail-card h2 {
  margin: 0 0 10px;
  font-size: 18px;
  color: var(--brand-dark);
}

.active-detail-card ul {
  margin: 0;
  padding-left: 20px;
}

.active-detail-card li {
  margin-bottom: 8px;
  line-height: 1.35;
  font-size: 16px;
  color: #334155;
}

.diagram-placeholder {
  padding: 40px;
  text-align: center;
  color: #64748b;
}

@media (max-width: 1100px) {
  .active-practice-topbar {
    grid-template-columns: 1fr;
  }

  .active-practice-controls {
    justify-content: stretch;
  }

  .active-practice-controls button {
    flex: 1;
  }

  .active-practice-drill-layout {
    grid-template-columns: 1fr;
  }

  .active-practice-diagram img {
    max-height: 48vh;
  }
}


/* v2A.4: full-screen active drill mode and mobile optimization */
body.active-practice-tab.active-drill-mode .preference-card,
body.active-practice-tab.active-drill-mode .sidebar,
body.active-practice-tab.active-drill-mode .workspace-header,
body.active-practice-tab.active-drill-mode .workspace-tabs {
  display: none !important;
}

body.active-practice-tab.active-drill-mode .shell {
  max-width: none;
  width: 100%;
  padding: 8px;
}

body.active-practice-tab.active-drill-mode .grid {
  display: block;
}

body.active-practice-tab.active-drill-mode .workspace {
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

body.active-practice-tab.active-drill-mode .topbar {
  padding: 8px 12px;
  margin-bottom: 8px;
}

body.active-practice-tab.active-drill-mode .topbar .brand-row p,
body.active-practice-tab.active-drill-mode .topbar .top-actions {
  display: none;
}

body.active-practice-tab.active-drill-mode .brand-logo {
  width: 34px;
  height: 34px;
}

body.active-practice-tab.active-drill-mode .brand-row h1 {
  font-size: 18px;
}

body.active-practice-tab.active-drill-mode .active-practice-fullscreen {
  min-height: calc(100vh - 80px);
}

.practice-card-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.practice-plan-item {
  align-items: center;
}

button.small,
.small {
  padding: 8px 10px;
  font-size: 12px;
}

@media (max-width: 720px) {
  .shell {
    padding: 8px;
  }

  .card {
    border-radius: 16px;
  }

  body.active-practice-tab.active-drill-mode .topbar {
    display: none;
  }

  body.active-practice-tab.active-drill-mode .active-practice-fullscreen {
    min-height: 100vh;
    gap: 8px;
  }

  .active-practice-topbar {
    position: sticky;
    top: 0;
    z-index: 5;
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 10px;
    border-radius: 16px;
  }

  .active-practice-title h1 {
    font-size: 18px;
    line-height: 1.1;
  }

  .active-drill-count {
    font-size: 11px;
  }

  .active-practice-timer {
    font-size: 54px;
  }

  .active-practice-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .active-practice-controls button {
    min-width: 0;
    width: 100%;
    padding: 11px 8px;
    font-size: 13px;
  }

  .active-practice-drill-layout {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .active-practice-diagram {
    padding: 8px;
    border-radius: 16px;
  }

  .active-practice-diagram img {
    max-height: 44vh;
  }

  .active-practice-detail {
    gap: 8px;
  }

  .active-detail-card {
    padding: 12px;
    border-radius: 16px;
  }

  .active-detail-card h2 {
    font-size: 16px;
    margin-bottom: 8px;
  }

  .active-detail-card li {
    font-size: 14px;
    margin-bottom: 6px;
  }

  .practice-card-actions {
    width: 100%;
    justify-content: stretch;
  }

  .practice-card-actions button {
    flex: 1;
  }
}

@media (orientation: landscape) and (max-height: 520px) {
  body.active-practice-tab.active-drill-mode .topbar {
    display: none;
  }

  .active-practice-topbar {
    grid-template-columns: minmax(180px, 1fr) auto minmax(320px, auto);
    padding: 8px;
  }

  .active-practice-timer {
    font-size: 42px;
  }

  .active-practice-controls button {
    padding: 8px;
    font-size: 12px;
  }

  .active-practice-diagram img {
    max-height: calc(100vh - 155px);
  }

  .active-detail-card li {
    font-size: 13px;
  }
}


/* v2A.5: tab visibility hotfix */
[hidden] {
  display: none !important;
}

[data-tab-panel].hidden {
  display: none !important;
}


/* v2A.6: prevent active-drill full-screen state from affecting other tabs */
body:not(.active-practice-tab).active-drill-mode {
  /* JS should remove this immediately, but this keeps the layout safe if state arrives late. */
}

body:not(.active-practice-tab) .sidebar,
body:not(.active-practice-tab) .workspace-header,
body:not(.active-practice-tab) .workspace-tabs,
body:not(.active-practice-tab) .preference-card {
  display: initial;
}

body:not(.active-practice-tab) .sidebar {
  display: block;
}

body:not(.active-practice-tab) .workspace-tabs {
  display: flex;
}


/* v2A.7: deletion feedback + button layout */
.practice-card-actions .danger,
.practice-plan-item .danger {
  white-space: nowrap;
}

.item.practice-plan-item {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

@media (max-width: 720px) {
  .item.practice-plan-item {
    align-items: stretch;
  }

  .item.practice-plan-item .danger {
    width: 100%;
  }
}


/* v2A.8: reliable launch button feedback */
button[disabled] {
  opacity: .62;
}

.practice-card-actions button {
  min-height: 40px;
}


/* v2A.11: robust import progress */
.practice-import-note {
  font-size: 13px;
  color: #64748b;
}


/* v3.1 Drill Library Foundation */
.drill-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.drill-form textarea {
  min-height: 88px;
  resize: vertical;
}

.drill-form textarea,
.drill-form .drill-depth-chart-check,
.drill-form button[type="submit"] {
  grid-column: 1 / -1;
}

.drill-skill-picker{position:relative;margin:0!important;padding:0!important;border:1px solid var(--line)!important;border-radius:12px!important;background:#fff!important}
.drill-skill-picker summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:10px 12px;list-style:none;cursor:pointer;color:var(--brand-dark);font-weight:850}
.drill-skill-picker summary::-webkit-details-marker{display:none}
.drill-skill-picker summary::after{content:'⌄';font-size:1rem;color:var(--muted);transition:transform .16s ease}
.drill-skill-picker[open] summary::after{transform:rotate(180deg)}
.drill-skill-picker summary small{margin-left:auto;color:var(--muted);font-size:.7rem;font-weight:750}
.drill-skill-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;max-height:230px;padding:8px 10px 10px;border-top:1px solid var(--line);overflow-y:auto}
.drill-skill-checklist .check-label{min-width:0;padding:6px 7px;border-radius:8px;background:#f8fafc;font-size:.72rem;line-height:1.15}
.drill-skill-checklist .check-label input{width:16px;height:16px;min-height:0;flex:0 0 auto}
@media(max-width:720px){.drill-skill-checklist{grid-template-columns:repeat(2,minmax(0,1fr));max-height:190px}.drill-skill-picker summary{min-height:40px;padding:8px 10px}}

.panel-header-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: start;
  margin-bottom: 14px;
}

.drill-library-item {
  align-items: stretch;
}

.drill-library-main {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.drill-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.drill-library-item details {
  margin-top: 6px;
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 8px 10px;
}

.drill-library-item summary {
  cursor: pointer;
  font-weight: 900;
  color: var(--brand-dark);
}

.drill-library-item ul {
  margin: 8px 0 0 18px;
  padding: 0;
  color: #334155;
  line-height: 1.4;
}

@media (max-width: 720px) {
  .drill-form {
    grid-template-columns: 1fr;
  }

  .panel-header-row {
    flex-direction: column;
  }

  .drill-library-item {
    gap: 12px;
  }
}


/* v3.1.2 Drill Library Uploads */
.drill-upload-form {
  display: grid;
  gap: 12px;
}

.drill-thumb-wrap {
  margin-top: 8px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 14px;
  padding: 8px;
  max-width: 320px;
}

.drill-thumb-wrap img {
  width: 100%;
  max-height: 180px;
  object-fit: contain;
  display: block;
}

.drill-form input[type="file"],
.drill-upload-form input[type="file"] {
  background: #fff;
  border: 1px dashed #94a3b8;
}

@media (max-width: 720px) {
  .drill-thumb-wrap {
    max-width: 100%;
  }
}


/* v3.1.3 Drill Library Search, Detail, and Practice Draft */
.drill-search-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  gap: 10px;
  margin-bottom: 14px;
}

.drill-detail-panel {
  border: 2px solid rgba(14, 165, 233, .28);
}

.drill-detail-layout {
  display: grid;
  grid-template-columns: minmax(280px, .95fr) minmax(280px, 1.05fr);
  gap: 16px;
}

.drill-detail-diagram {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 260px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px;
}

.drill-detail-diagram img {
  width: 100%;
  max-height: 440px;
  object-fit: contain;
}

.drill-detail-content h4 {
  margin: 12px 0 6px;
  color: var(--brand-dark);
}

.drill-detail-content ul {
  margin-top: 4px;
  padding-left: 20px;
  line-height: 1.4;
}

.practice-draft-fields {
  display: grid;
  grid-template-columns: 1fr 170px 150px;
  gap: 10px;
  margin-bottom: 12px;
}

.practice-library-builder {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  margin-bottom: 12px;
}

.compact-list {
  margin-bottom: 12px;
}

.compact-draft-item {
  align-items: center;
}

@media (max-width: 850px) {
  .drill-search-grid,
  .drill-detail-layout,
  .practice-draft-fields,
  .practice-library-builder {
    grid-template-columns: 1fr;
  }
}


/* v3.1.4 Practice Builder creation reliability */
.practice-from-library-panel button[disabled],
.practice-draft-panel button[disabled] {
  opacity: .65;
  cursor: wait;
}


/* v3.2 AI Practice Builder */
.ai-practice-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.ai-practice-form textarea {
  grid-column: 1 / -1;
  min-height: 130px;
  resize: vertical;
}

.ai-practice-form .check-label,
.ai-practice-form button[type="submit"] {
  grid-column: 1 / -1;
}

.disabled-check {
  opacity: .62;
}

.ai-status-box {
  padding: 14px;
  border-radius: 16px;
  background: #f8fafc;
  border: 1px solid var(--line);
}

.ai-status-box.error-box {
  background: #fef2f2;
  border-color: #fecaca;
}

@media (max-width: 850px) {
  .ai-practice-form {
    grid-template-columns: 1fr;
  }
}


/* v3.2.1 AI button diagnostics */
.ai-status-box strong {
  color: var(--brand-dark);
}


/* v3.2.3 AI Practice Builder loading fixes */
.ai-status-box p {
  margin: 0 0 8px;
}

.ai-status-box p:last-child {
  margin-bottom: 0;
}


/* v3.2.4 AI Practice Builder server-side drill loading */
.ai-status-box {
  overflow-wrap: anywhere;
}


/* v3.2.7 no browser-side drill preload for AI Builder */
.ai-status-box {
  overflow-wrap: anywhere;
}


/* v3.2.8 diagnostic fallback */
.ai-status-box {
  overflow-wrap: anywhere;
}


/* v3.2.9 service role fallback diagnostics */
.ai-status-box {
  overflow-wrap: anywhere;
}


/* v3.2.10 direct AI generate click */
.ai-status-box {
  overflow-wrap: anywhere;
}


/* v3.2.11 nonblocking drill library */
.ai-status-box,
#drillLibraryList {
  overflow-wrap: anywhere;
}


/* v3.3 server-side drill retrieval */
#drillLibraryList,
.ai-status-box {
  overflow-wrap: anywhere;
}


/* v3.3.2 server-side practice plans and launch retrieval */
#planList,
#planBuilderDraftList,
#practiceDraftList {
  overflow-wrap: anywhere;
}


/* v3.4 Diagram Asset Pipeline */
.diagram-load-error {
  padding: 24px;
  text-align: center;
  color: #9f1239;
  background: #fff1f2;
  border: 1px solid #fecdd3;
  border-radius: 14px;
  font-weight: 800;
}

.diagram-load-error.hidden {
  display: none;
}

.drill-thumb-wrap .diagram-load-error {
  padding: 10px;
  font-size: 12px;
}

.active-practice-diagram .diagram-load-error,
.drill-detail-diagram .diagram-load-error {
  width: 100%;
}


/* v3.4.1 server-side Drill Library upload */
.drill-upload-form button[disabled] {
  opacity: .7;
  cursor: wait;
}


/* v3.4.2 Fresh signed diagram URLs */
.drill-diagram-img,
.active-drill-diagram img,
.drill-card-diagram img {
  max-width: 100%;
  height: auto;
  border-radius: 14px;
  border: 1px solid var(--line, #d8e2ef);
  background: #fff;
}

.diagram-placeholder,
.diagram-error {
  padding: 18px;
  border-radius: 14px;
  border: 1px dashed #cbd5e1;
  background: #f8fafc;
  color: #64748b;
  text-align: center;
  font-weight: 700;
}

.diagram-error {
  border-color: #fecaca;
  background: #fef2f2;
  color: #b91c1c;
}


/* v3.4.4b uploaded date on drill cards */
.drill-upload-date {
  display: block;
  font-size: 0.78rem;
  color: #7a8aa0;
  margin-top: 2px;
}

/* v3.4.4a uploaded date on Drill Library cards */
.drill-upload-date {
  display: block;
  font-size: 0.78rem;
  color: #7a8aa0;
  margin-top: 2px;
}


/* v3.5 uploaded drill enhancement */
.drill-edit-panel {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid #d8e2ef;
  border-radius: 18px;
  background: #f8fbff;
}

.drill-edit-panel summary {
  cursor: pointer;
  font-weight: 800;
  color: #0f3a5f;
  margin-bottom: 14px;
}

.drill-edit-form {
  display: grid;
  gap: 14px;
  margin-top: 14px;
}

.drill-edit-form label {
  display: grid;
  gap: 6px;
  font-weight: 700;
}

.drill-edit-form input,
.drill-edit-form textarea {
  width: 100%;
}


/* v3.8 station eligibility fields */
.station-edit-fieldset {
  border: 1px solid #d8e2ef;
  border-radius: 16px;
  padding: 14px;
  background: #f8fbff;
  display: grid;
  gap: 12px;
}

.station-edit-fieldset legend {
  font-weight: 900;
  color: #0f3a5f;
  padding: 0 6px;
}

.station-goalie-check {
  align-self: end;
}




/* v3.9B import review queue */
.import-review-panel {
  border: 1px solid #bfdbfe;
  background: #eff6ff;
}

.import-review-item {
  border-left: 4px solid #2563eb;
}

.duplicate-warning {
  color: #b45309 !important;
  font-weight: 900;
}




/* v3.9C processing queue */
.processing-status-v39c {
  display: block;
  color: #0f766e !important;
  font-weight: 800;
  margin-top: 4px;
}




/* v3.9D AI categorization */
button[data-ai-categorize-v39d] {
  white-space: nowrap;
}



/* v3.9D.1 AI categorize running state */
button.ai-categorize-running-v39d1 {
  opacity: 0.75;
  cursor: wait;
}

.ai-categorize-status-v39d1 {
  display: block;
  margin-top: 6px;
  color: #0f766e;
  font-weight: 900;
}




/* v3.9D.2 extract-first missing info prompts */
.missing-info-panel-v39d2 {
  border: 1px solid #d8e2ef;
  border-radius: 18px;
  padding: 14px 16px;
  margin: 12px 0 18px;
  background: #f8fbff;
}

.missing-info-panel-v39d2.needs-input {
  border-color: #f59e0b;
  background: #fffbeb;
}

.missing-info-panel-v39d2 h4 {
  margin: 0 0 8px;
  color: #0f3a5f;
}

.missing-info-panel-v39d2 ul {
  margin: 8px 0 0 18px;
}

.missing-info-panel-v39d2 li {
  margin: 8px 0;
}

.voice-input-button-v39d2 {
  margin-top: 6px;
  width: fit-content;
}



/* CoachZippi v3.10H Needs Info Diagram Review Visibility */
.zanplan-review-panel-v310h {
  margin: 12px 0;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  font-size: 0.92rem;
  line-height: 1.35;
}

.zanplan-review-panel-v310h.zanplan-review-diagram {
  border-color: rgba(239, 68, 68, 0.45);
  background: linear-gradient(180deg, #fff7f7 0%, #ffffff 100%);
}

.zanplan-review-panel-v310h.zanplan-review-info {
  border-color: rgba(245, 158, 11, 0.45);
  background: linear-gradient(180deg, #fffbeb 0%, #ffffff 100%);
}

.zanplan-review-panel-header {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #0f172a;
  margin-bottom: 5px;
}

.zanplan-review-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #f59e0b;
}

.zanplan-review-diagram .zanplan-review-dot {
  background: #ef4444;
}

.zanplan-review-lead {
  color: #475569;
  margin-bottom: 8px;
}

.zanplan-review-panel-v310h ul {
  margin: 6px 0 0 18px;
  padding: 0;
  color: #334155;
}

.zanplan-review-panel-v310h li {
  margin: 3px 0;
}

.zanplan-review-note,
.zanplan-review-empty {
  margin-top: 8px;
  color: #64748b;
  font-size: 0.85rem;
}


/* CoachZippi v3.10I Review Queue Filters */
.zanplan-review-filterbar-v310i {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 12px 0 16px;
  padding: 14px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 18px;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06);
}

.zanplan-review-filter-title {
  display: flex;
  flex-direction: column;
  gap: 2px;
  color: #0f172a;
}

.zanplan-review-filter-title span {
  color: #64748b;
  font-size: 0.86rem;
}

.zanplan-review-filter-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.zanplan-review-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(148, 163, 184, 0.55);
  background: #ffffff;
  color: #334155;
  border-radius: 999px;
  padding: 8px 11px;
  font-weight: 800;
  cursor: pointer;
}

.zanplan-review-filter-chip span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #0f172a;
  font-size: 0.78rem;
}

.zanplan-review-filter-chip.active {
  border-color: #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}

.zanplan-review-status-badge-v310i {
  margin-left: 8px;
}

.badge-warning {
  background: #fef3c7;
  color: #92400e;
  border: 1px solid rgba(245, 158, 11, 0.45);
}

.badge-danger {
  background: #fee2e2;
  color: #991b1b;
  border: 1px solid rgba(239, 68, 68, 0.45);
}

.badge-success {
  background: #dcfce7;
  color: #166534;
  border: 1px solid rgba(34, 197, 94, 0.45);
}



/* CoachZippi v3.10J Review Queue Checklist Export */
.zanplan-review-checklist-button-v310j {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(37, 99, 235, 0.45);
  background: #2563eb;
  color: #ffffff;
  border-radius: 999px;
  padding: 8px 13px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.18);
}

.zanplan-review-checklist-button-v310j:disabled {
  opacity: 0.72;
  cursor: wait;
}

.zanplan-review-checklist-modal-v310j {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(15, 23, 42, 0.48);
  padding: 20px;
}

.zanplan-review-checklist-dialog-v310j {
  width: min(720px, 96vw);
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.32);
  overflow: hidden;
}

.zanplan-review-checklist-header-v310j {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 18px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.35);
}

.zanplan-review-checklist-header-v310j button {
  border: none;
  background: #f1f5f9;
  border-radius: 999px;
  width: 32px;
  height: 32px;
  cursor: pointer;
  font-size: 20px;
}

.zanplan-review-checklist-dialog-v310j textarea {
  width: 100%;
  min-height: 420px;
  border: none;
  padding: 16px 18px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13px;
  color: #0f172a;
  resize: vertical;
  outline: none;
}

.zanplan-review-checklist-footer-v310j {
  padding: 12px 18px;
  color: #64748b;
  border-top: 1px solid rgba(148, 163, 184, 0.35);
  font-size: 0.9rem;
}



/* CoachZippi v3.10K Mark Drill Reviewed / Ready */
.zanplan-mark-reviewed-box-v310k {
  margin: 16px 0;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(37, 99, 235, 0.35);
  background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.07);
}

.zanplan-mark-reviewed-box-v310k strong {
  display: block;
  color: #1e3a8a;
  margin-bottom: 3px;
}

.zanplan-mark-reviewed-box-v310k p {
  margin: 0 0 10px;
  color: #475569;
  font-size: 0.92rem;
}

.zanplan-mark-reviewed-button-v310k {
  width: 100%;
}

.zanplan-mark-reviewed-button-v310k:disabled {
  opacity: 0.72;
  cursor: wait;
}



/* CoachZippi v3.10K.1 Review Status Clarity */
.zanplan-review-status-badge-v310k1 {
  margin-left: 8px;
  white-space: nowrap;
}

.zanplan-inline-mark-reviewed-v310k1 {
  margin-top: 10px;
  width: 100%;
  border-color: rgba(37, 99, 235, 0.45);
}

.zanplan-inline-mark-reviewed-v310k1:disabled {
  opacity: 0.72;
  cursor: wait;
}



/* CoachZippi v3.10K.2 Review Status Truth */
.zanplan-review-status-badge-v310k2 {
  margin-left: 8px;
  white-space: nowrap;
}

.zanplan-clear-diagram-review-v310k2 {
  margin-top: 10px;
  width: 100%;
}

.zanplan-clear-diagram-review-v310k2:disabled {
  opacity: 0.72;
  cursor: wait;
}



/* CoachZippi v3.10K.4 Coach Ready Label De-Dupe */
.zanplan-coach-ready-label-v310k4 {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}






/* CoachZippi v3.10T.12 Reset UI Watchers + Restore Action Safety */
.zanplan-raw-ai-cleaned-v310t12 {
  white-space: normal !important;
  overflow-wrap: break-word !important;
}

.zanplan-hide-diagram-only-coach-info-v310t8:not(#drillDetailPanel *) {
  display: initial !important;
}


/* CoachZippi v3.10X - Coach Review Missing Info Display */
.coach-review-card-v310x {
  border: 1px solid #f59e0b;
  background: #fffbeb;
  border-radius: 14px;
  padding: 10px 12px;
  margin: 10px 0;
  display: grid;
  gap: 5px;
}

.coach-review-card-v310x strong {
  color: #92400e;
  font-size: 0.95rem;
}

.coach-review-card-v310x small {
  color: #78350f;
}

.coach-review-card-v310x ul {
  margin: 2px 0 2px 18px;
  padding: 0;
}

.coach-review-card-v310x li {
  color: #78350f;
  font-size: 0.9rem;
  margin: 2px 0;
}

.coach-review-hint-v310x {
  opacity: 0.85;
}

/* CoachZippi v3.10Y - Edit Missing Info mini-form */
.missing-info-form-v310y {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(146, 64, 14, 0.25);
  display: grid;
  gap: 8px;
}

.missing-info-form-v310y strong {
  color: #78350f;
}

.missing-info-grid-v310y {
  display: grid;
  gap: 8px;
}

.missing-info-grid-v310y label {
  display: grid;
  gap: 4px;
  color: #78350f;
  font-weight: 700;
}

.missing-info-grid-v310y input,
.missing-info-grid-v310y textarea {
  width: 100%;
  border: 1px solid rgba(146, 64, 14, 0.25);
  border-radius: 10px;
  padding: 8px 10px;
  font: inherit;
  background: #fff;
  color: #111827;
}

.missing-info-actions-v310y {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.missing-info-actions-v310y small {
  color: #78350f;
}

.practice-draft-panel{scroll-margin-top:150px}
.practice-header-needs-attention .practice-draft-fields{padding:8px;border:2px solid #f59e0b;border-radius:12px;background:#fffbeb;box-shadow:0 0 0 4px rgba(245,158,11,.12)}
.practice-header-needs-attention .practice-draft-fields input:focus{outline:3px solid rgba(14,165,233,.32);border-color:#0284c7}

@media (max-width: 640px) {
  .zanplan-diagnostics-button {
    left: 8px;
    bottom: 8px;
    font-size: 10px;
  }

  .zanplan-diagnostics-panel {
    left: 8px;
    bottom: 44px;
    width: calc(100vw - 16px);
  }
}

/* CoachZippi v3.10Z diagram review source-preview label styles */
.diagram-review-notice-v310z {
  border: 1px solid rgba(245, 158, 11, 0.45);
  background: rgba(245, 158, 11, 0.10);
  border-radius: 14px;
  padding: 10px 12px;
  margin-bottom: 10px;
  font-size: 13px;
  line-height: 1.35;
}

.diagram-review-notice-v310z strong {
  display: block;
  font-weight: 700;
  margin-bottom: 2px;
}

.diagram-review-notice-v310z span {
  display: block;
  opacity: 0.88;
}

/* CoachZippi v3.11A - source preview accepted workflow */
.diagram-source-action-v311a,
.diagram-source-accepted-v311a {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 12px 0;
  padding: 12px 14px;
  border: 1px solid rgba(59, 130, 246, 0.28);
  border-radius: 14px;
  background: rgba(239, 246, 255, 0.96);
  color: #1e3a8a;
}

.diagram-source-action-v311a strong,
.diagram-source-accepted-v311a strong {
  display: block;
  margin-bottom: 3px;
}

.diagram-source-action-v311a span,
.diagram-source-accepted-v311a span {
  display: block;
  font-size: 0.88rem;
  line-height: 1.35;
}

.diagram-source-action-v311a button {
  flex: 0 0 auto;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .diagram-source-action-v311a,
  .diagram-source-accepted-v311a {
    align-items: stretch;
    flex-direction: column;
  }

  .diagram-source-action-v311a button {
    width: 100%;
  }
}

/* CoachZippi v3.11B - clean diagram review/source preview layout */
.diagram-status-banner-v311b {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0 0 16px 0;
  padding: 14px 16px;
  border-radius: 16px;
  line-height: 1.35;
}

.diagram-status-banner-v311b strong {
  display: block;
  margin-bottom: 3px;
  font-size: 0.98rem;
}

.diagram-status-banner-v311b span {
  display: block;
  font-size: 0.9rem;
  opacity: 0.9;
}

.diagram-status-banner-v311b.review {
  border: 1px solid rgba(245, 158, 11, 0.45);
  background: rgba(255, 251, 235, 0.96);
  color: #78350f;
}

.diagram-status-banner-v311b.accepted {
  border: 1px solid rgba(59, 130, 246, 0.28);
  background: rgba(239, 246, 255, 0.96);
  color: #1e3a8a;
}

.diagram-status-banner-v311b button {
  flex: 0 0 auto;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .diagram-status-banner-v311b {
    align-items: stretch;
    flex-direction: column;
  }

  .diagram-status-banner-v311b button {
    width: 100%;
  }
}

/* CoachZippi v3.12 - Drill Library diagram status badges */
.diagram-status-row-v312 {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0 6px 0;
}

.diagram-status-pill-v312 {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  border: 1px solid transparent;
}

.diagram-status-detail-v312 {
  font-size: 0.82rem;
  color: #64748b;
}

.diagram-status-row-v312.review .diagram-status-pill-v312 {
  background: #fffbeb;
  border-color: rgba(245, 158, 11, 0.45);
  color: #92400e;
}

.diagram-status-row-v312.accepted .diagram-status-pill-v312 {
  background: #eff6ff;
  border-color: rgba(59, 130, 246, 0.35);
  color: #1d4ed8;
}

.diagram-status-row-v312.ready .diagram-status-pill-v312 {
  background: #ecfdf5;
  border-color: rgba(16, 185, 129, 0.35);
  color: #047857;
}

.diagram-status-row-v312.pending .diagram-status-pill-v312 {
  background: #f8fafc;
  border-color: rgba(148, 163, 184, 0.45);
  color: #475569;
}

@media (max-width: 720px) {
  .diagram-status-row-v312 {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* CoachZippi v3.10AA - Drill Library diagram status filter */
.zanplan-diagram-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 0.75rem 0 0.75rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.04);
}

.zanplan-diagram-filter-label {
  font-weight: 700;
  font-size: 0.9rem;
  margin-right: 0.25rem;
}

.zanplan-diagram-filter-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.zanplan-diagram-filter-btn {
  border: 1px solid rgba(148, 163, 184, 0.65);
  background: #fff;
  border-radius: 999px;
  padding: 0.35rem 0.65rem;
  font-size: 0.85rem;
  cursor: pointer;
}

.zanplan-diagram-filter-btn.active {
  background: #0f172a;
  border-color: #0f172a;
  color: #fff;
}

.zanplan-diagram-filter-count {
  margin-left: auto;
  color: #64748b;
  font-size: 0.82rem;
}

.zanplan-diagram-filter-hidden {
  display: none !important;
}

.zanplan-diagram-filter-empty {
  margin-top: 0.75rem;
}

@media (max-width: 700px) {
  .zanplan-diagram-filter-bar {
    align-items: flex-start;
    flex-direction: column;
  }

  .zanplan-diagram-filter-count {
    margin-left: 0;
  }
}

/* CoachZippi v3.10AB - Drill Library diagram review counter */
.zanplan-diagram-review-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
  margin: 0.8rem 0 0.55rem;
  padding: 0.7rem 0.85rem;
  border: 1px solid rgba(148, 163, 184, 0.38);
  border-radius: 14px;
  background: rgba(248, 250, 252, 0.95);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}

.zanplan-diagram-review-summary-title {
  font-weight: 800;
  font-size: 0.92rem;
  color: #0f172a;
}

.zanplan-diagram-review-summary-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.zanplan-diagram-review-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.28rem 0.58rem;
  font-size: 0.82rem;
  font-weight: 700;
  border: 1px solid rgba(148, 163, 184, 0.5);
  background: #fff;
  color: #334155;
}

.zanplan-diagram-review-pill.needs-review {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #9a3412;
}

.zanplan-diagram-review-pill.source-accepted {
  background: #ecfeff;
  border-color: #a5f3fc;
  color: #155e75;
}

.zanplan-diagram-review-pill.official-ready {
  background: #f0fdf4;
  border-color: #bbf7d0;
  color: #166534;
}

.zanplan-diagram-review-summary-total {
  margin-left: auto;
  font-size: 0.82rem;
  color: #64748b;
}

@media (max-width: 700px) {
  .zanplan-diagram-review-summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .zanplan-diagram-review-summary-total {
    margin-left: 0;
  }
}

/* CoachZippi v3.10AD - stable diagram status rendering */
.zanplan-diagram-review-summary {
  contain: layout paint;
}

.diagram-status-row-v312 {
  min-height: 30px;
}

.zanplan-diagram-review-summary[aria-live="off"] .zanplan-diagram-review-pill,
.diagram-status-row-v312 .diagram-status-pill-v312 {
  backface-visibility: hidden;
}

/* CoachZippi v3.10AE - restored diagram counter visibility */
#zanplanDiagramReviewSummary.zanplan-diagram-review-summary {
  display: block;
}
/* CoachZippi v3.11C - reset source preview accepted back to review */
.diagram-status-banner-actions-v311c {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 0 0 auto;
}

.diagram-reset-review-button-v311c {
  white-space: nowrap;
}

@media (max-width: 720px) {
  .diagram-status-banner-actions-v311c {
    width: 100%;
    justify-content: stretch;
  }

  .diagram-reset-review-button-v311c {
    width: 100%;
  }
}

/* ZANPLAN_STEP12_PRACTICE_DRAFT_REORDER_STYLES */
.practice-draft-reorder-item {
  gap: 12px;
}

.practice-draft-reorder-item > span {
  min-width: 0;
  flex: 1 1 auto;
}

.practice-draft-reorder-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
  align-items: center;
}

.practice-draft-reorder-actions .small[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}

@media (max-width: 640px) {
  .practice-draft-reorder-item {
    align-items: stretch;
  }

  .practice-draft-reorder-actions {
    justify-content: flex-start;
  }
}

/* ZANPLAN_STEP13_PRACTICE_DRAFT_SUMMARY_STYLES */
.practice-draft-summary-card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
  margin: 0 0 12px 0;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 14px;
  background: rgba(15, 23, 42, 0.04);
}

.practice-draft-summary-card > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.practice-draft-summary-card strong {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  opacity: 0.75;
}

.practice-draft-summary-card span {
  font-weight: 800;
}

.practice-draft-summary-card small {
  grid-column: 1 / -1;
  opacity: 0.74;
}

@media (max-width: 640px) {
  .practice-draft-summary-card {
    grid-template-columns: 1fr;
  }
}

/* ZANPLAN_STEP14_PRACTICE_TARGET_DURATION_STYLES */
.practice-draft-target-card {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.practice-target-control {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 140px;
}

.practice-target-control input {
  width: 76px;
  padding: 6px 8px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  font-weight: 800;
}

.practice-target-control span {
  font-weight: 800;
}

.practice-target-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 0.92rem;
}

.practice-target-status.remaining {
  background: rgba(59, 130, 246, 0.12);
}

.practice-target-status.exact {
  background: rgba(34, 197, 94, 0.14);
}

.practice-target-status.over {
  background: rgba(239, 68, 68, 0.14);
}

@media (max-width: 900px) {
  .practice-draft-target-card {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .practice-draft-target-card {
    grid-template-columns: 1fr;
  }
}

/* ZANPLAN_STEP15_V2_PRACTICE_DRAFT_DRILL_DURATIONS */
.practice-draft-duration-item > span {
  gap: 0.35rem;
}

.practice-draft-duration-control {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.35rem;
  font-size: 0.84rem;
  color: var(--muted, #64748b);
}

.practice-draft-duration-control input {
  width: 4.25rem;
  min-width: 4.25rem;
  padding: 0.28rem 0.38rem;
  border-radius: 0.45rem;
  border: 1px solid rgba(148, 163, 184, 0.65);
  background: rgba(255, 255, 255, 0.9);
  font: inherit;
}

@media (max-width: 720px) {
  .practice-draft-duration-control {
    width: 100%;
  }
}

/* ZANPLAN_STEP16_PRACTICE_DRAFT_SETUP_WATER_STYLES */
.practice-draft-setup-water-card {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.practice-setup-water-control input {
  width: 72px;
}

@media (max-width: 900px) {
  .practice-draft-setup-water-card {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .practice-draft-setup-water-card {
    grid-template-columns: 1fr;
  }
}

/* ZANPLAN_STEP17_CREATED_PRACTICE_SUMMARY */
.created-practice-summary-panel {
  margin: 12px 0 16px;
}

.created-practice-summary-panel.hidden {
  display: none;
}

.created-practice-summary-card {
  position: relative;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
  padding: 14px;
}

.created-practice-summary-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  min-width: 38px;
  padding: 0;
  border-radius: 50%;
  font-size: 1.65rem;
  line-height: 1;
  color: #075985;
  background: #e0f2fe;
}

.created-practice-summary-header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin: 0 44px 12px 0;
}

.created-practice-summary-header h3 {
  margin: 6px 0 2px;
}

.created-practice-summary-header p {
  margin: 0;
  color: #64748b;
}

.created-practice-summary-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  min-width: 150px;
  color: #475569;
}

.created-practice-summary-actions button {
  margin-top: 6px;
}

.created-practice-summary-table-wrap {
  overflow-x: auto;
}

.created-practice-summary-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.94rem;
}

.created-practice-summary-table th,
.created-practice-summary-table td {
  text-align: left;
  border-top: 1px solid rgba(148, 163, 184, 0.35);
  padding: 9px 8px;
  vertical-align: top;
}

.created-practice-summary-table th {
  color: #475569;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.created-practice-summary-table small {
  display: block;
  color: #64748b;
  margin-top: 2px;
}

.created-practice-drill-list {
  display: grid;
  gap: 10px;
}

.created-practice-drill-row {
  display: grid;
  grid-template-columns: auto 120px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 12px;
  background: #fff;
}

.created-practice-drill-number {
  width: 24px;
  color: #64748b;
  font-weight: 800;
  text-align: center;
}

.created-practice-drill-diagram {
  display: grid;
  place-items: center;
  width: 120px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid #dbe4ef;
  border-radius: 9px;
  background: #f8fafc;
}

.created-practice-drill-diagram img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.created-practice-drill-diagram img.diagram-load-failed {
  display: none;
}

.created-practice-drill-no-diagram {
  color: #94a3b8;
  font-size: 0.72rem;
  font-weight: 700;
}

.created-practice-drill-info,
.created-practice-drill-timing {
  min-width: 0;
}

.created-practice-drill-info strong,
.created-practice-drill-info small,
.created-practice-drill-timing strong,
.created-practice-drill-timing small {
  display: block;
}

.created-practice-drill-info small,
.created-practice-drill-timing small {
  margin-top: 3px;
  color: #64748b;
}

.created-practice-drill-timing {
  text-align: right;
  white-space: nowrap;
}

.created-practice-drill-empty {
  margin: 0;
  padding: 18px;
  color: #64748b;
  text-align: center;
}

button[data-view-created-practice-summary].active {
  font-weight: 700;
}

@media (max-width: 720px) {
  .created-practice-summary-header {
    flex-direction: column;
  }

  .created-practice-summary-actions {
    align-items: flex-start;
  }

  .created-practice-summary-actions button {
    width: auto;
  }

  .created-practice-drill-row {
    grid-template-columns: auto 92px minmax(0, 1fr);
    gap: 8px;
    padding: 8px;
  }

  .created-practice-drill-diagram {
    width: 92px;
  }

  .created-practice-drill-timing {
    grid-column: 3;
    text-align: left;
  }
}

/* ZANPLAN_STEP18_OPTION_A_CONDENSED_PRACTICE_CARDS */
.interactive-plan-item {
  align-items: flex-start;
  gap: 18px;
}

.interactive-plan-item > div:first-child {
  flex: 1 1 520px;
  min-width: 280px;
}

.practice-card-inline-summary {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(148, 163, 184, 0.28);
}

.practice-card-inline-metrics {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.practice-card-inline-metrics span {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(14, 116, 144, 0.16);
  background: rgba(240, 249, 255, 0.82);
  color: #0f4f67;
  border-radius: 999px;
  padding: 4px 9px;
  font-size: 12px;
  font-weight: 800;
}

.practice-card-drill-list {
  display: grid;
  gap: 4px;
  max-width: 560px;
}

.practice-card-drill-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #1f2937;
  line-height: 1.35;
}

.practice-card-drill-num {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #dbeafe;
  color: #1d4ed8;
  font-size: 11px;
  font-weight: 950;
}

.practice-card-drill-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.practice-card-drill-duration {
  color: #334155;
  font-weight: 850;
  white-space: nowrap;
}

.practice-card-more-drills,
.practice-card-drill-loading,
.practice-card-drill-empty {
  margin: 7px 0 0;
  color: #64748b;
  font-size: 13px;
}

.practice-card-more-drills {
  color: #075985;
  font-weight: 800;
}

@media (max-width: 720px) {
  .interactive-plan-item {
    flex-direction: column;
  }

  .practice-card-actions {
    justify-content: flex-start;
  }

  .practice-card-drill-row {
    grid-template-columns: 22px minmax(0, 1fr) auto;
  }
}

/* ZANPLAN_STEP19A_MODIFY_PRACTICE_TO_DRAFT */
.modify-practice-btn {
  white-space: nowrap;
}

.practice-draft-duration-item small::after {
  content: "";
}

/* ZANPLAN_STEP19C_MODIFY_PRACTICE_SAFE_FLOW_STYLES */
.modify-copy-notice {
  display: grid;
  gap: 0.25rem;
  margin: 0.75rem 0 1rem;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(14, 116, 144, 0.22);
  border-radius: 1rem;
  background: rgba(224, 242, 254, 0.62);
  color: #0f3f56;
}
.modify-copy-notice strong {
  font-weight: 800;
  color: #0c4a6e;
}
.modify-copy-notice span {
  color: #53647a;
  line-height: 1.35;
}

/* ZANPLAN_STEP19G_V4_RETURN_TO_CREATED_PRACTICE */
.zanplan-new-practice-highlight {
  outline: 3px solid rgba(37, 99, 235, 0.65);
  box-shadow: 0 0 0 6px rgba(37, 99, 235, 0.14);
  border-radius: 14px;
  transition: outline-color 0.25s ease, box-shadow 0.25s ease;
}
/* ZANPLAN_STEP20_CLEAR_PRACTICE_DRAFT */
.practice-draft-clear-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0 12px;
  padding: 8px 10px;
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 10px;
  background: rgba(248, 250, 252, 0.82);
}

.practice-draft-clear-row small {
  color: #64748b;
  line-height: 1.25;
}

.practice-draft-clear-btn {
  white-space: nowrap;
}

@media (max-width: 640px) {
  .practice-draft-clear-row {
    align-items: flex-start;
    flex-direction: column;
  }
}
/* ZANPLAN_STEP21_UNSAVED_DRAFT_INDICATOR_CSS */
.practice-draft-unsaved-indicator {
  border: 1px solid rgba(245, 158, 11, 0.45);
  background: rgba(245, 158, 11, 0.10);
  border-radius: 12px;
  padding: 10px 12px;
  margin: 10px 0;
}

.practice-draft-unsaved-main {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 3px;
}

.practice-draft-unsaved-main strong {
  font-size: 0.95rem;
}

.practice-draft-unsaved-main span,
.practice-draft-unsaved-indicator small {
  color: var(--muted, #64748b);
}


/* ZANPLAN_STEP22A_CONFIRM_SOURCE_FOR_REDRAW_CSS */
.diagram-status-banner-v322a.confirmed {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  border-radius: 12px;
  color: #1e3a8a;
}

.diagram-status-banner-v322a.review {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px solid #fed7aa;
  background: #fff7ed;
  border-radius: 12px;
  color: #9a3412;
}

.diagram-status-banner-v322a strong,
.diagram-status-banner-v311b strong {
  display: block;
  margin-bottom: 3px;
}

.diagram-status-banner-actions-v322a,
.diagram-status-banner-actions-v311c {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.diagram-confirm-redraw-button-v322a {
  white-space: nowrap;
}

.diagram-status-row-v312.source-confirmed {
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  color: #1e3a8a;
}

@media (max-width: 720px) {
  .diagram-status-banner-v322a.confirmed,
  .diagram-status-banner-v322a.review {
    align-items: flex-start;
    flex-direction: column;
  }

  .diagram-confirm-redraw-button-v322a {
    width: 100%;
  }
}


/* CoachZippi v3.22B - Manual official diagram upload */
.official-diagram-upload-v322b,
.official-diagram-ready-v322b {
  margin: 12px 0 14px;
  padding: 14px;
  border: 1px solid rgba(59, 130, 246, 0.28);
  border-radius: 14px;
  background: rgba(59, 130, 246, 0.07);
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.official-diagram-ready-v322b {
  border-color: rgba(34, 197, 94, 0.35);
  background: rgba(34, 197, 94, 0.08);
}

.official-diagram-upload-copy-v322b,
.official-diagram-ready-v322b {
  color: var(--text, #0f172a);
}

.official-diagram-upload-copy-v322b strong,
.official-diagram-ready-v322b strong {
  display: block;
  margin-bottom: 4px;
}

.official-diagram-upload-copy-v322b span,
.official-diagram-ready-v322b span {
  display: block;
  color: var(--muted, #64748b);
  font-size: 0.92rem;
  line-height: 1.35;
}

.official-diagram-upload-controls-v322b {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.official-diagram-upload-controls-v322b input[type="file"] {
  max-width: 260px;
}

@media (max-width: 720px) {
  .official-diagram-upload-v322b,
  .official-diagram-ready-v322b,
  .official-diagram-upload-controls-v322b {
    align-items: stretch;
    flex-direction: column;
  }

  .official-diagram-upload-controls-v322b input[type="file"],
  .official-diagram-upload-controls-v322b button {
    width: 100%;
    max-width: 100%;
  }
}


/* CoachZippi v3.22B-1 - Hide internal source extraction/debug text when official diagram is ready */
.zanplan-source-extraction-hidden-v322b1 {
  display: none !important;
}

/* ZANPLAN_STEP22C_V2_EXISTING_ROUTE_CSS */
.diagram-draft-card-v322c2 {
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  border-radius: 18px;
  padding: 16px;
  margin: 14px 0;
  display: grid;
  gap: 12px;
}

.diagram-draft-copy-v322c2 {
  display: grid;
  gap: 4px;
  color: #1e3a8a;
}

.diagram-draft-copy-v322c2 span,
.diagram-draft-preview-header-v322c2 span,
.diagram-draft-loading-v322c2,
.diagram-draft-error-v322c2 span {
  color: #475569;
}

.diagram-draft-actions-v322c2 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.diagram-draft-preview-v322c2 {
  display: grid;
  gap: 10px;
}

.diagram-draft-preview-v322c2 img {
  max-width: 100%;
  border-radius: 14px;
  border: 1px solid #dbeafe;
  background: white;
}

.diagram-draft-preview-header-v322c2 {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: baseline;
}

.diagram-draft-loading-v322c2,
.diagram-draft-error-v322c2 {
  border-radius: 14px;
  padding: 12px;
  background: rgba(255,255,255,0.7);
}

.diagram-draft-error-v322c2 {
  border: 1px solid #fecaca;
  background: #fef2f2;
  color: #991b1b;
  display: grid;
  gap: 4px;
}


/* CoachZippi Step 22E-1 source image for redraw */
.source-image-redraw-upload-v322e1,
.source-image-redraw-ready-v322e1 {
  margin: 16px 0;
  padding: 16px 18px;
  border: 1px solid #bfdbfe;
  border-radius: 16px;
  background: #eff6ff;
  color: #1e3a8a;
}

.source-image-redraw-ready-v322e1 {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}

.source-image-redraw-copy-v322e1,
.source-image-redraw-upload-v322e1 > strong,
.source-image-redraw-ready-v322e1 > strong {
  display: block;
  font-weight: 800;
  margin-bottom: 6px;
}

.source-image-redraw-copy-v322e1 span,
.source-image-redraw-ready-v322e1 span {
  display: block;
  color: #475569;
  line-height: 1.45;
}

.source-image-redraw-controls-v322e1 {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 14px;
}

.source-image-redraw-controls-v322e1 input[type="file"] {
  max-width: 100%;
}



/* CoachZippi Step 22E-2 source-image-ready view cleanup */
.source-image-ready-banner-v322e2 {
  margin: 16px 0;
  padding: 16px 18px;
  border: 1px solid #bbf7d0;
  border-radius: 16px;
  background: #f0fdf4;
  color: #166534;
}

.source-image-ready-banner-v322e2 strong {
  display: block;
  font-weight: 900;
  margin-bottom: 6px;
}

.source-image-ready-banner-v322e2 span {
  display: block;
  color: #475569;
  line-height: 1.45;
}

.zanplan-hidden-source-extraction-v322e2 {
  display: none !important;
}

.source-ready-draft-card-v322e2 {
  border-color: #bfdbfe;
  background: #eff6ff;
}


/* ZANPLAN_STEP22F_HIGH_FIDELITY_SOURCE_STYLES */
.high-fidelity-source-card-v322f {
  margin: 18px 0;
  padding: 18px 20px;
  border: 1px solid rgba(34, 119, 179, 0.26);
  background: rgba(233, 247, 255, 0.72);
  border-radius: 18px;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.high-fidelity-source-copy-v322f {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 260px;
  flex: 1;
}

.high-fidelity-source-copy-v322f strong {
  color: #17407f;
  font-size: 1.02rem;
}

.high-fidelity-source-copy-v322f span {
  color: #526176;
  line-height: 1.35;
}

.high-fidelity-source-btn-v322f {
  white-space: normal;
  min-width: 230px;
}

@media (max-width: 720px) {
  .high-fidelity-source-card-v322f {
    align-items: stretch;
  }
  .high-fidelity-source-btn-v322f {
    width: 100%;
    min-width: 0;
  }
}


/* Step 22G - Hide experimental AI redraw from coach UI */
.diagram-draft-card-v322c2,
.source-ready-draft-card-v322e2,
[data-diagram-draft-card-v322c2] {
  display: none !important;
}
.high-fidelity-source-card-v322f {
  border: 1px solid rgba(34, 197, 94, 0.35);
  background: rgba(240, 253, 244, 0.72);
}
.high-fidelity-source-copy-v322f strong::before {
  content: "Recommended: ";
}
/* ZANPLAN_STEP22H_AUTO_OFFICIAL_AFTER_SOURCE_UPLOAD */
.source-image-redraw-auto-v322h {
  border-color: rgba(34, 197, 94, 0.35) !important;
  background: rgba(236, 253, 245, 0.95) !important;
}

/* ZANPLAN_STEP22I_PDF_PAGE_SOURCE_IMAGE_CSS */
.pdf-source-prepare-v322i {
  border: 1px solid rgba(14, 116, 144, 0.22);
  background: rgba(236, 254, 255, 0.72);
  border-radius: 18px;
  padding: 18px;
  margin: 18px 0;
  display: grid;
  gap: 12px;
}
.pdf-source-prepare-copy-v322i {
  display: grid;
  gap: 6px;
  color: #334155;
}
.pdf-source-prepare-copy-v322i strong {
  color: #155e75;
  font-size: 1.04rem;
}
.pdf-source-prepare-btn-v322i {
  justify-self: start;
}
.pdf-source-prepare-hint-v322i {
  font-size: 0.9rem;
  color: #64748b;
}
@media (max-width: 700px) {
  .pdf-source-prepare-btn-v322i { width: 100%; }
}


/* ZANPLAN_STEP22J_PDF_DIAGRAM_CROP_SOURCE */
.pdf-crop-modal-v322j {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(15, 23, 42, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
}

.pdf-crop-dialog-v322j {
  width: min(1120px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  overflow: auto;
  background: #ffffff;
  color: #0f172a;
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.35);
  padding: 18px;
}

.pdf-crop-header-v322j {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 12px;
}

.pdf-crop-header-v322j strong {
  display: block;
  font-size: 18px;
  margin-bottom: 4px;
}

.pdf-crop-header-v322j span {
  display: block;
  color: #475569;
  font-size: 14px;
  line-height: 1.35;
}

.pdf-crop-toolbar-v322j {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 12px 0;
  flex-wrap: wrap;
}

.pdf-crop-stage-wrap-v322j {
  overflow: auto;
  border: 1px solid rgba(148, 163, 184, 0.5);
  border-radius: 14px;
  background: #f8fafc;
  padding: 12px;
}

.pdf-crop-stage-v322j {
  position: relative;
  display: inline-block;
  line-height: 0;
  user-select: none;
  touch-action: none;
}

.pdf-crop-canvas-v322j {
  display: block;
  max-width: 100%;
  height: auto;
  background: #ffffff;
  border-radius: 8px;
}

.pdf-crop-selection-v322j {
  position: absolute;
  border: 3px solid #2563eb;
  background: rgba(37, 99, 235, 0.12);
  box-shadow: 0 0 0 9999px rgba(15, 23, 42, 0.28);
  border-radius: 6px;
  pointer-events: none;
}

.pdf-crop-hint-v322j {
  margin-top: 10px;
  color: #64748b;
}


/* ZANPLAN_STEP22K_PDF_CROP_PREVIEW */
.pdf-crop-dialog-v322k {
  width: min(1280px, calc(100vw - 32px));
}

.pdf-crop-grid-v322k {
  display: grid;
  grid-template-columns: minmax(320px, 1.7fr) minmax(260px, 1fr);
  gap: 16px;
  align-items: start;
}

.pdf-crop-label-v322k {
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 8px;
  font-size: 13px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.pdf-crop-preview-panel-v322k {
  border: 1px solid rgba(148, 163, 184, 0.5);
  border-radius: 14px;
  background: #f8fafc;
  padding: 12px;
  min-height: 260px;
}

.pdf-crop-preview-empty-v322k {
  color: #64748b;
  background: #ffffff;
  border: 1px dashed rgba(100, 116, 139, 0.45);
  border-radius: 12px;
  padding: 18px;
  line-height: 1.4;
}

.pdf-crop-preview-canvas-v322k {
  display: block;
  width: 100%;
  height: auto;
  max-height: 60vh;
  object-fit: contain;
  background: #ffffff;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.4);
}

.pdf-crop-preview-hint-v322k {
  margin-top: 10px;
  color: #64748b;
}

@media (max-width: 900px) {
  .pdf-crop-grid-v322k {
    grid-template-columns: 1fr;
  }
}



/* ZANPLAN_STEP22L_AUTO_PDF_DIAGRAM_DETECT_STYLES */
.pdf-source-prepare-v322i .pdf-source-prepare-btn-v322i:disabled {
  opacity: 0.72;
  cursor: progress;
}

/* ZANPLAN_STEP22M_AUTO_RUN_DIAGRAM_DETECTION_AFTER_UPLOAD_STYLES */
.processing-intake-panel-v310b.processing-done-v310b small[data-processing-message-v310b] {
  line-height: 1.35;
}


/* ZANPLAN_STEP22S_REDRAW_LAYER_DIAGNOSTIC_STYLES */
.redraw-diagnostic-card-v322s {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 14px 0;
  padding: 14px 16px;
  border: 1px solid #cfe3ef;
  border-radius: 16px;
  background: #f4fbff;
}
.redraw-diagnostic-card-v322s div { display: grid; gap: 4px; }
.redraw-diagnostic-card-v322s strong { color: #075d83; }
.redraw-diagnostic-card-v322s span { color: #5d6b80; font-size: 0.92rem; }
.redraw-diagnostic-modal-v322s {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background: rgba(15, 23, 42, 0.46);
}
.redraw-diagnostic-modal-v322s.is-open { display: flex; }
.redraw-diagnostic-dialog-v322s {
  width: min(1280px, 96vw);
  max-height: 92vh;
  overflow: auto;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
  padding: 20px;
}
.redraw-diagnostic-head-v322s {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.redraw-diagnostic-head-v322s div { display: grid; gap: 4px; }
.redraw-diagnostic-head-v322s strong { font-size: 1.2rem; color: #0f172a; }
.redraw-diagnostic-head-v322s span,
.redraw-diagnostic-status-v322s,
.redraw-diagnostic-output-v322s p { color: #64748b; }
.redraw-diagnostic-status-v322s { margin: 8px 0 14px; }
.redraw-diagnostic-grid-v322s {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.redraw-diagnostic-output-v322s {
  border: 1px solid #dbe7f0;
  border-radius: 16px;
  background: #f8fafc;
  padding: 12px;
}
.redraw-diagnostic-output-v322s h4 { margin: 0 0 10px; color: #0f5f82; }
.redraw-diagnostic-output-v322s img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid #d8e2eb;
  border-radius: 12px;
  background: #fff;
}
.redraw-diagnostic-output-v322s p { margin: 10px 0 0; font-size: 0.9rem; line-height: 1.35; }
@media (max-width: 900px) {
  .redraw-diagnostic-card-v322s { flex-direction: column; align-items: stretch; }
  .redraw-diagnostic-grid-v322s { grid-template-columns: 1fr; }
}
/* ZANPLAN_STEP22T_HIDE_REDRAW_DIAGNOSTICS_FROM_COACHES
   Keep the redraw-layer diagnostic available for development, but hide it from coach-facing UI by default. */
body:not(.zanplan-dev-diagnostics-enabled) .redraw-layer-diagnostic-actions-v322s {
  display: none !important;
}

body.zanplan-dev-diagnostics-enabled .redraw-layer-diagnostic-actions-v322s {
  display: flex !important;
}
/* ZANPLAN_STEP22T_V2_HIDE_REDRAW_DIAGNOSTIC_CARD
   Hide the Step 22S redraw diagnostic card from coach-facing UI by default.
   It can be re-enabled for development from the browser console with enableCoachZippiRedrawDiagnostics(). */
body:not(.zanplan-dev-diagnostics-enabled) .redraw-diagnostic-card-v322s,
body:not(.zanplan-dev-diagnostics-enabled) [data-redraw-diagnostic-v322s],
body:not(.zanplan-dev-diagnostics-enabled) button[onclick*="openRedrawLayerDiagnosticV322S"] {
  display: none !important;
}

body.zanplan-dev-diagnostics-enabled .redraw-diagnostic-card-v322s,
body.zanplan-dev-diagnostics-enabled [data-redraw-diagnostic-v322s] {
  display: flex !important;
}


/* ZANPLAN_STEP22W_SIMPLE_DIAGRAM_PROCESSING_STATUS_CSS */
.diagram-processing-status-v322w {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.92);
  padding: 8px 10px;
  margin: 8px 0;
  color: #0f172a;
}

.diagram-processing-status-v322w.detail {
  margin: 12px 0 14px;
  padding: 10px 12px;
}

.diagram-processing-dot-v322w {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  margin-top: 4px;
  border-radius: 999px;
  background: #64748b;
  box-shadow: 0 0 0 3px rgba(100, 116, 139, 0.14);
}

.diagram-processing-status-v322w.ready .diagram-processing-dot-v322w {
  background: #16a34a;
  box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.14);
}

.diagram-processing-status-v322w.processing .diagram-processing-dot-v322w {
  background: #0284c7;
  box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.14);
}

.diagram-processing-status-v322w.review .diagram-processing-dot-v322w {
  background: #f97316;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.16);
}

.diagram-processing-status-v322w.pending .diagram-processing-dot-v322w {
  background: #64748b;
}

.diagram-processing-copy-v322w {
  display: grid;
  gap: 2px;
  line-height: 1.25;
}

.diagram-processing-copy-v322w strong {
  font-size: 0.88rem;
  font-weight: 750;
}

.diagram-processing-copy-v322w span {
  font-size: 0.78rem;
  color: #475569;
}
/* END ZANPLAN_STEP22W_SIMPLE_DIAGRAM_PROCESSING_STATUS_CSS */

/* ZANPLAN_STEP22X_MISSING_METADATA_REVIEW_STYLES */
.metadata-review-status-v322x,
.metadata-review-panel-v322x {
  border: 1px solid #dbeafe;
  border-radius: 12px;
  background: #eff6ff;
  color: #1e3a8a;
  margin-top: 8px;
  padding: 10px 12px;
}

.metadata-review-status-v322x {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.metadata-review-status-v322x.card {
  font-size: 0.9rem;
}

.metadata-review-status-v322x.detail,
.metadata-review-panel-v322x {
  margin: 10px 0 14px;
}

.metadata-review-copy-v322x {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}

.metadata-review-copy-v322x span,
.metadata-review-panel-v322x p,
.metadata-review-panel-v322x li {
  font-size: 0.88rem;
}

.metadata-review-dot-v322x {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #2563eb;
  flex: 0 0 auto;
  margin-top: 5px;
}

.metadata-review-status-v322x.ready,
.metadata-review-panel-v322x.ready {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}
.metadata-review-status-v322x.ready .metadata-review-dot-v322x { background: #059669; }

.metadata-review-status-v322x.recommended,
.metadata-review-panel-v322x.recommended {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}
.metadata-review-status-v322x.recommended .metadata-review-dot-v322x { background: #d97706; }

.metadata-review-status-v322x.review,
.metadata-review-panel-v322x.review {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #9a3412;
}
.metadata-review-status-v322x.review .metadata-review-dot-v322x { background: #ea580c; }

.metadata-review-status-v322x .small,
.metadata-review-panel-v322x .small {
  white-space: nowrap;
  padding: 5px 9px;
  font-size: 0.78rem;
}

.metadata-review-panel-head-v322x {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.metadata-review-panel-v322x h4 {
  margin: 0 0 4px;
}

.metadata-review-panel-v322x ul {
  margin: 10px 0 6px 18px;
  padding: 0;
}

.metadata-review-panel-v322x li {
  margin: 6px 0;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.metadata-review-panel-v322x li em {
  font-style: normal;
  font-weight: 500;
  opacity: 0.8;
}

.metadata-field-focus-v322x {
  outline: 3px solid #f97316 !important;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.14);
}

@media (max-width: 720px) {
  .metadata-review-status-v322x,
  .metadata-review-panel-head-v322x,
  .metadata-review-panel-v322x li {
    flex-direction: column;
    align-items: stretch;
  }
}

/* ZANPLAN_STEP22X3_HIDE_OLD_NEEDS_INFO_DUPLICATES */
[data-needs-info-v310d14],
[data-needs-info-v310d15] {
  display: none !important;
}

/* ZANPLAN_STEP23A_COACH_ZIPPY_UI_V2 */
.coach-zippy-builder-panel {
  position: relative;
  overflow: hidden;
}

.coach-zippy-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}

.coach-zippy-hero h3 {
  margin: 4px 0 6px;
  font-size: 1.35rem;
}

.coach-zippy-badge {
  width: 52px;
  height: 52px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 1.4rem;
  color: #ffffff;
  background: linear-gradient(135deg, var(--brand), var(--brand-dark));
  box-shadow: 0 12px 30px rgba(14, 165, 233, .24);
  flex: 0 0 auto;
}

.coach-zippy-form label {
  display: grid;
  gap: 6px;
  font-weight: 700;
  color: var(--text);
}

.coach-zippy-focus-field,
.coach-zippy-prompt-field,
.coach-zippy-quick-focus {
  grid-column: 1 / -1;
}

.coach-zippy-quick-focus {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 0 2px;
}

.chip-button {
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--brand-dark);
  border-radius: 999px;
  padding: 7px 11px;
  font-size: .9rem;
  font-weight: 800;
  cursor: pointer;
}

.chip-button:hover {
  border-color: var(--brand);
  box-shadow: 0 6px 16px rgba(14, 165, 233, .12);
}

.coach-zippy-status-panel h3 {
  margin-top: 0;
}

@media (max-width: 850px) {
  .coach-zippy-hero {
    align-items: center;
  }
}


/* ZANPLAN_STEP23B_GENERATE_DRAFT_FROM_TEAM_DRILLS */
.zippy-draft-result-list {
  margin: 0.75rem 0;
  padding: 0.75rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 0.75rem;
  background: rgba(15, 23, 42, 0.03);
  line-height: 1.6;
}


/* CoachZippi v3.11H - saved drill return highlight */
.zanplan-saved-drill-highlight-v311h {
  outline: 4px solid rgba(34, 197, 94, 0.45);
  box-shadow: 0 0 0 8px rgba(34, 197, 94, 0.12);
  transition: outline 0.2s ease, box-shadow 0.2s ease;
}

/* Coach diagram editor */
.diagram-drawing-launch { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.diagram-drawer-dialog { width:min(1500px, calc(100vw - 24px)); max-width:none; max-height:calc(100vh - 24px); overflow:auto; }
.diagram-drawer-shell { padding:20px; background:#f8fafc; }
.diagram-drawer-header, .diagram-drawer-actions, .diagram-editor-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.diagram-drawer-header { border-bottom:1px solid var(--line); padding-bottom:14px; }
.diagram-drawer-header h2 { margin-bottom:4px; }
.diagram-drawer-header p { margin-bottom:0; }
.diagram-drawer-layout { display:grid; grid-template-columns:250px minmax(0,1fr); gap:16px; margin:16px 0; }
.diagram-toolbox { display:grid; gap:14px; align-content:start; }
.diagram-tool-group { display:grid; grid-template-columns:1fr 1fr; gap:7px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:12px; }
.diagram-tool-group strong { grid-column:1/-1; color:#334155; }
.diagram-tool-group button { padding:9px 8px; background:#e0f2fe; color:#075985; font-size:13px; }
.diagram-tool-group button.active { color:#fff; background:linear-gradient(135deg,var(--brand),var(--brand-dark)); box-shadow:0 0 0 4px rgba(14,165,233,.18); }
.diagram-numbering { display:grid; gap:9px; padding:12px; background:#fff; border:1px solid var(--line); border-radius:16px; }
.diagram-numbering label { font-size:13px; }
.diagram-colours { display:grid; gap:9px; padding:12px; background:#fff; border:1px solid var(--line); border-radius:16px; color:#334155; }
.diagram-colour-options { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.diagram-colour-options button { min-width:0; aspect-ratio:1; padding:0; border-radius:999px; background:var(--draw-colour); border:3px solid #fff; box-shadow:0 0 0 1px #cbd5e1; }
.diagram-colour-options button.active { box-shadow:0 0 0 3px #0ea5e9, 0 0 0 6px rgba(14,165,233,.18); transform:scale(.9); }
.diagram-canvas-panel { min-width:0; }
.diagram-editor-toolbar { margin-bottom:10px; justify-content:flex-end; flex-wrap:wrap; }
#activeDiagramTool { margin-right:auto; font-weight:900; color:#075985; }
.diagram-canvas-wrap { background:#dbeafe; border:1px solid #bfdbfe; border-radius:18px; overflow:auto; padding:10px; touch-action:none; }
#diagramDrawingCanvas { display:block; width:100%; min-width:700px; height:auto; background:#fff; border-radius:12px; box-shadow:0 10px 30px rgba(15,23,42,.12); touch-action:none; cursor:crosshair; }
.diagram-drawer-actions { border-top:1px solid var(--line); padding-top:14px; justify-content:flex-end; }
@media (max-width:900px) {
  .diagram-drawer-layout { grid-template-columns:1fr; }
  .diagram-toolbox { grid-template-columns:1fr 1fr; }
  .diagram-numbering, .diagram-colours { grid-column:1/-1; }
}
@media (max-width:600px) {
  .diagram-drawer-dialog { width:100vw; height:100vh; max-height:none; border-radius:0; }
  .diagram-drawer-shell { padding:12px; }
  .diagram-drawer-header { align-items:flex-start; }
  .diagram-toolbox { grid-template-columns:1fr; }
  .diagram-numbering, .diagram-colours { grid-column:auto; }
  #diagramDrawingCanvas { min-width:760px; }
}

/* Responsive CoachZippi application shell — UI only */
.brand-logo-mark{display:block;flex:0 0 auto;border-radius:14px;background:#061c49;color:#fff;box-shadow:0 8px 18px rgba(3,105,161,.22)}
.brand-logo-mark.small{border-radius:11px}

/* AI Builder hierarchy: AI request first, compact supporting details second. */
.coach-zippy-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(230px,.65fr);gap:22px;align-items:start}
.coach-zippy-ai-column{display:grid;gap:14px;min-width:0}
.coach-zippy-ai-column .coach-zippy-prompt-field{font-size:1.08rem}
.coach-zippy-ai-column .coach-zippy-prompt-field textarea{min-height:190px;font-size:1rem;line-height:1.55;padding:16px}
.coach-zippy-ai-column .coach-zippy-focus-field input{min-height:42px}
.coach-zippy-ai-column .coach-zippy-quick-focus{padding:0}
.coach-zippy-options{display:grid;gap:8px}
.coach-zippy-generate{justify-self:start;min-width:230px}
.coach-zippy-details-column{display:grid;gap:11px;padding:15px;border:1px solid var(--line);border-radius:18px;background:rgba(248,250,252,.86)}
.coach-zippy-details-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding-bottom:7px;border-bottom:1px solid var(--line)}
.coach-zippy-details-heading small,.coach-zippy-details-column label span{color:var(--muted);font-size:.72rem;font-weight:650}
.coach-zippy-details-column label{gap:4px;font-size:.78rem}
.coach-zippy-details-column input{min-height:36px;padding:7px 9px;font-size:.88rem}
.coach-zippy-detail-pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.coach-zippy-number-pair input{max-width:100%}
@media(max-width:900px){.coach-zippy-layout{grid-template-columns:minmax(0,1fr) minmax(210px,.58fr);gap:14px}.coach-zippy-detail-pair{grid-template-columns:1fr}}
@media(max-width:720px){.coach-zippy-layout{grid-template-columns:1fr}.coach-zippy-details-column{grid-row:2}.coach-zippy-ai-column .coach-zippy-prompt-field textarea{min-height:170px}.coach-zippy-detail-pair{grid-template-columns:1fr 1fr}.coach-zippy-generate{width:100%;min-width:0}}

/* Drill workspace sub-navigation. */
.drills-subtabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:16px;padding:6px;border:1px solid var(--line);border-radius:18px;background:#f8fafc;position:sticky;top:92px;z-index:8}
.drills-subtabs button{min-height:44px;border:0;border-radius:13px;background:transparent;color:var(--muted);font-weight:850;cursor:pointer;padding:9px 12px}
.drills-subtabs button.active{background:#fff;color:var(--brand-dark);box-shadow:0 5px 15px rgba(15,23,42,.1)}
.drills-subpanel{animation:drillsSubpanelIn .16s ease-out}
@keyframes drillsSubpanelIn{from{opacity:.35;transform:translateY(3px)}to{opacity:1;transform:none}}
.drill-upload-type-radios{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0;padding:0;border:0}
.drill-upload-type-radios legend{width:100%;margin-bottom:2px;font-weight:800;color:var(--text)}
.drill-upload-type-radios label{display:flex;align-items:center;gap:7px;min-height:42px;padding:8px 13px;border:1px solid var(--line);border-radius:13px;background:#fff;cursor:pointer;font-weight:800}
.drill-upload-type-radios label:has(input:checked){border-color:var(--brand);background:#effaff;color:var(--brand-dark);box-shadow:0 0 0 3px rgba(14,165,233,.1)}
.drill-upload-type-radios input{width:17px;height:17px;margin:0;accent-color:var(--brand)}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.create-diagram-actions{padding:12px;border:1px dashed #b9ccdc;border-radius:15px;background:#f8fbfd}
.diagram-upload-button{display:inline-flex!important;align-items:center;justify-content:center;min-height:42px;cursor:pointer}
.diagram-upload-button input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.repository-filter-bar{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.repository-filter-bar button{min-height:40px;padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-weight:800;cursor:pointer}
.repository-filter-bar button.active{border-color:var(--brand);background:#eaf9ff;color:var(--brand-dark);box-shadow:0 4px 12px rgba(14,165,233,.12)}
@media(max-width:720px){.drills-subtabs{top:74px;grid-template-columns:repeat(3,minmax(106px,1fr));overflow-x:auto;scrollbar-width:none;margin-inline:-4px}.drills-subtabs::-webkit-scrollbar{display:none}.drills-subtabs button{font-size:.79rem;padding-inline:8px}.repository-filter-bar{display:grid;grid-template-columns:1fr}.repository-filter-bar button{text-align:left}.create-diagram-actions .secondary{flex:1 1 135px}}

.community-impact-card{grid-column:1/-1;border-top:1px solid var(--line);padding-top:16px;display:grid;gap:12px}
.community-impact-content{display:grid;gap:10px}
.community-impact-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.community-impact-metrics strong{display:grid;gap:2px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#fff}
.community-impact-metrics span{font-size:1.3rem;color:var(--brand-dark)}
.community-impact-metrics small{color:var(--muted);font-weight:700}
.community-impact-badges{display:flex;flex-wrap:wrap;gap:6px}.community-impact-badges span{padding:5px 9px;border-radius:999px;background:#eef8ff;color:var(--brand-dark);font-size:.78rem;font-weight:800;border:1px solid #b9def5}
@media(max-width:720px){.repository-filter-bar{grid-template-columns:repeat(4,minmax(0,1fr))!important}.community-impact-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Community adds a fourth compact repository source on phones. This later
   override intentionally wins over the older three-source mobile layout. */
@media(max-width:720px){
  .repository-filter-bar{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .repository-filter-bar button{font-size:clamp(.48rem,2vw,.62rem)!important;padding-inline:1px!important}
}

/* Z prompt controls and voice dictation. */
.coach-zippy-prompt-field{display:grid;gap:8px}
.coach-zippy-prompt-field>strong{font-size:1.08rem}
.coach-zippy-prompt-input{position:relative}
.coach-zippy-prompt-input textarea{width:100%;padding-right:62px!important;padding-bottom:54px!important}
.coach-zippy-mic-button{position:absolute;right:12px;bottom:12px;width:44px;height:44px;display:grid;place-items:center;border:1px solid #b8d5e5;border-radius:50%;background:#fff;color:var(--brand-dark);font-size:1.15rem;cursor:pointer;box-shadow:0 5px 16px rgba(15,23,42,.12)}
.coach-zippy-mic-button:hover{border-color:var(--brand);background:#effaff}
.coach-zippy-mic-button.listening{color:#fff;background:#dc2626;border-color:#dc2626;animation:zippyMicPulse 1.25s ease-in-out infinite}
.coach-zippy-mic-button svg{display:block;width:23px;height:23px;margin:auto;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.coach-zippy-mic-status{color:var(--muted);font-size:.78rem;font-weight:650}
@keyframes zippyMicPulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,.25)}50%{box-shadow:0 0 0 9px rgba(220,38,38,0)}}
@media(prefers-reduced-motion:reduce){.coach-zippy-mic-button.listening{animation:none}}

/* Compact drill repository built for large libraries. */
.repository-skill-filters{display:grid;gap:10px;margin:12px 0 16px;padding:12px;border:1px solid var(--line);border-radius:15px;background:#f8fafc}
.repository-skill-filters>div{display:grid;grid-template-columns:120px minmax(0,1fr);align-items:start;gap:10px}
.repository-skill-filters strong{padding-top:7px;font-size:.78rem;color:var(--muted)}
.repository-skill-chip-row{display:flex;gap:6px;flex-wrap:wrap;max-height:84px;overflow:auto}
.repository-skill-chip-row button{min-height:32px;padding:5px 10px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-size:.76rem;font-weight:800;cursor:pointer}
.repository-skill-chip-row button.active{border-color:var(--brand);background:#e8f8ff;color:var(--brand-dark)}
#drillLibraryList{gap:7px}
.repository-bulk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:7px 0;padding:7px 9px;border:1px solid var(--line);border-radius:11px;background:#f8fafc}
.repository-bulk-toolbar label{display:flex;align-items:center;gap:7px;color:var(--brand-dark);font-size:.72rem;font-weight:850}
.repository-bulk-toolbar input{width:17px;height:17px;margin:0;accent-color:var(--brand)}
.repository-bulk-toolbar select{width:auto;min-width:126px;min-height:32px;padding:4px 28px 4px 9px;border:1px solid #b8d5e5;border-radius:9px;background-color:#fff;color:var(--brand-dark);font-size:.72rem;font-weight:850}
.repository-bulk-toolbar select:disabled{opacity:.5;cursor:not-allowed}
.drill-library-item.compact-drill-card{position:relative;display:grid;grid-template-columns:112px minmax(0,1fr) 42px;gap:10px;align-items:center;min-height:104px;padding:9px 10px;border-radius:14px}
.compact-drill-select{display:flex!important;align-items:flex-start!important;gap:8px!important;color:var(--brand-dark);font-size:.69rem;font-weight:800;line-height:1.22;cursor:pointer}
.compact-drill-select input{flex:0 0 17px;width:17px;height:17px;margin:0;accent-color:var(--brand)}
.compact-drill-select span{display:block;min-width:0;padding-top:1px}
.repository-loading{display:grid;place-items:center;gap:7px;min-height:150px;padding:22px;text-align:center;color:var(--brand-dark)}
.repository-loading small{color:var(--muted)}
.repository-loading-spinner{width:28px;height:28px;border:3px solid #dbeafe;border-top-color:var(--brand);border-radius:50%;animation:repositoryLoadingSpin .8s linear infinite}
@keyframes repositoryLoadingSpin{to{transform:rotate(360deg)}}
.compact-drill-card .drill-library-main{display:grid;grid-template-columns:92px minmax(0,1fr);gap:10px;align-items:center}
.compact-drill-card .drill-thumb-wrap{grid-column:1;margin:0;padding:3px;width:92px;height:72px;overflow:hidden;border-radius:9px}
.compact-drill-card .drill-thumb-wrap img{width:100%;height:100%;object-fit:cover;display:block}
.compact-drill-copy{grid-column:2;display:flex;align-items:baseline;align-content:center;gap:3px 9px;flex-wrap:wrap;min-width:0}
.compact-drill-copy .drill-title-row{width:100%;gap:6px;flex-wrap:nowrap}
.compact-drill-copy .drill-title-row strong{font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compact-drill-copy .badge{font-size:.62rem;padding:3px 6px;white-space:nowrap}
.compact-drill-copy>small{display:none}
.compact-drill-copy>small strong{color:#475569}
.compact-drill-copy .drill-upload-date,.compact-drill-copy details,.compact-drill-copy .coach-review-card-v310x{display:none}
.compact-drill-copy .zanplan-crop-confidence-v5{font-size:.6rem;padding:3px 6px}
.compact-drill-attributes{display:flex;gap:3px 9px;flex-wrap:wrap;min-width:0}
.compact-drill-attributes small{font-size:.65rem;line-height:1.22;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:210px}
.compact-drill-no-diagram{display:grid!important;place-items:center;background:#f1f5f9;color:#94a3b8;text-align:center}
.compact-drill-no-diagram span{font-size:.61rem;font-weight:800}
.compact-drill-card.repository-skill-filtered-out{display:none!important}
.repository-filter-bar button:disabled,.repository-filter-bar button[aria-disabled="true"]{opacity:.42;filter:grayscale(1);cursor:not-allowed;box-shadow:none}
.compact-drill-menu{position:relative;display:block!important;align-self:center}
.compact-drill-menu-trigger{width:38px;height:38px;padding:0;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--brand-dark);font-size:1rem;font-weight:950;line-height:1;cursor:pointer}
.compact-drill-menu>button:not(.compact-drill-menu-trigger){display:none}
.compact-drill-menu.open{position:absolute;right:9px;top:50%;z-index:30;width:190px;padding:7px;border:1px solid var(--line);border-radius:13px;background:#fff;box-shadow:0 16px 38px rgba(15,23,42,.2)}
.compact-drill-menu.open .compact-drill-menu-trigger{position:absolute;right:0;top:-43px}
.compact-drill-menu.open>button:not(.compact-drill-menu-trigger):not(.compact-original-add-button){display:block;width:100%;min-height:38px;margin:2px 0;padding:7px 10px;border-radius:9px;text-align:left}
.compact-menu-confidence{display:none}
.compact-drill-menu.open>.compact-menu-confidence{display:block;margin-top:6px;padding:8px 9px;border-top:1px solid var(--line);font-size:.72rem;font-weight:900;text-align:center}
.compact-menu-confidence.green{color:#07846e}.compact-menu-confidence.yellow{color:#a16207}.compact-menu-confidence.red{color:#b91c1c}
@keyframes compactRecropPulse{0%,100%{box-shadow:0 0 0 0 rgba(245,158,11,.1)}50%{box-shadow:0 0 0 5px rgba(245,158,11,.28);background:#fff7ed}}
.compact-drill-menu.open>.compact-recrop-warning{animation:compactRecropPulse 1.05s ease-in-out infinite;border-color:#f59e0b!important;color:#9a3412!important}
.practice-draft-scroll-hint{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));z-index:1200;display:flex;align-items:center;gap:10px;max-width:min(92vw,420px);padding:10px 15px;border:1px solid rgba(255,255,255,.55);border-radius:999px;background:#075985;color:#fff;font-size:.78rem;font-weight:900;line-height:1.2;box-shadow:0 12px 34px rgba(15,23,42,.3);opacity:0;transform:translate(-50%,22px);pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.practice-draft-scroll-hint.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.practice-draft-scroll-arrow{font-size:1.25rem;line-height:1;animation:draftHintBounce .9s ease-in-out infinite}
@keyframes draftHintBounce{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}
@media(prefers-reduced-motion:reduce){.compact-drill-menu.open>.compact-recrop-warning,.practice-draft-scroll-arrow{animation:none}.practice-draft-scroll-hint{transition:none}}
.compact-original-add-button,[data-ai-categorize-v39d]{display:none!important}
@media(max-width:720px){.repository-skill-filters>div{grid-template-columns:1fr;gap:4px}.repository-skill-filters strong{padding-top:0}.drill-library-item.compact-drill-card{grid-template-columns:74px minmax(0,1fr) 38px;padding:8px;gap:7px}.compact-drill-select{grid-template-columns:17px 1fr;font-size:.62rem}.compact-drill-card .drill-library-main{grid-template-columns:72px minmax(0,1fr);gap:7px}.compact-drill-card .drill-thumb-wrap{width:72px;height:60px}.compact-drill-attributes small{font-size:.6rem;max-width:150px}.compact-drill-copy .drill-title-row strong{font-size:.84rem}.compact-drill-menu.open{right:7px}}

/* AI repository choices and reduced duplicate team context. */
body.ai-builder-tab .workspace-header{display:none!important}
.coach-zippy-repository-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;align-items:stretch;margin:0;padding:10px;border:1px solid var(--line);border-radius:15px;background:#f8fafc}
.coach-zippy-repository-options legend{grid-column:1/-1;width:100%;padding:0 0 4px;font-size:.82rem;font-weight:850;color:var(--text)}
.coach-zippy-repository-options .check-label{min-width:0;min-height:34px;padding:5px 6px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:.68rem;line-height:1.15}
.coach-zippy-repository-options .check-label input{flex:0 0 auto;width:14px;height:14px;margin:0}
.coach-zippy-repository-options .check-label:has(input:checked){border-color:var(--brand);background:#eaf9ff;color:var(--brand-dark)}
@media(max-width:720px){.coach-zippy-repository-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:7px}.coach-zippy-repository-options .check-label{width:100%;padding:4px 3px;font-size:clamp(.52rem,2.25vw,.64rem)}}

/* Team-level AI quick-focus preferences. */
.quick-focus-settings-panel form{display:grid;gap:13px}
.quick-focus-selection-count{min-width:58px;padding:6px 10px;border-radius:999px;background:#e0f2fe;color:#075985;text-align:center;font-size:.78rem}
.quick-focus-skill-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.quick-focus-skill-groups fieldset{min-width:0;margin:0;padding:10px;border:1px solid var(--line);border-radius:14px;background:#f8fafc}
.quick-focus-skill-groups legend{padding:0 5px;color:var(--text);font-size:.8rem;font-weight:850}
.quick-focus-option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
.quick-focus-option-grid .check-label{min-width:0;min-height:32px;padding:5px 7px;border:1px solid var(--line);border-radius:9px;background:#fff;font-size:.7rem;line-height:1.15}
.quick-focus-option-grid .check-label:has(input:checked){border-color:var(--brand);background:#eaf9ff;color:#075985}
.quick-focus-option-grid input{flex:0 0 auto;width:14px;height:14px;margin:0}
.quick-focus-option-grid input:disabled+span{opacity:.48}
@media(max-width:720px){.quick-focus-skill-groups{grid-template-columns:1fr}.quick-focus-option-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.quick-focus-option-grid .check-label{padding:4px;font-size:.62rem}}

/* CoachZippi team season plan workspace and practice alignment. */
.team-switcher-wrap{display:flex;align-items:center;gap:8px}
.season-plan-header-actions{display:flex;align-items:center;gap:5px;padding:4px 6px;border-left:1px solid #dbe4ee}
.season-plan-header-actions>strong{font-size:.7rem;color:#475569;white-space:nowrap}
.season-plan-header-actions>button{border:0;background:transparent;color:#0877a6;font-size:.7rem;font-weight:850;text-decoration:underline;text-underline-offset:3px;padding:4px}
.season-plan-settings-card{display:flex;align-items:center;justify-content:space-between;gap:16px}
.season-plan-settings-actions{display:flex;gap:7px;align-items:center}
.season-plan-settings-card h3{margin:3px 0}
.season-plan-dialog{width:min(920px,calc(100vw - 24px));max-width:920px;max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:22px;box-shadow:0 28px 80px rgba(15,23,42,.35)}
.season-plan-dialog::backdrop{background:rgba(15,23,42,.72)}
.season-plan-dialog-shell{display:grid;gap:13px;padding:18px;max-height:calc(100dvh - 24px);overflow:auto;background:#f8fafc}
.season-plan-dialog-header,.season-plan-status-row,.season-plan-footer,.season-plan-ai-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}
.season-plan-dialog-header h2{margin:2px 0}
.season-plan-dialog label{display:grid;gap:5px;color:#334155;font-weight:800}
.season-plan-dialog input,.season-plan-dialog textarea{width:100%;box-sizing:border-box;border:1px solid #cbd5e1;border-radius:12px;background:#fff;padding:10px;color:#0f172a;font:inherit}
.season-plan-dialog textarea{resize:vertical;line-height:1.45}
.season-plan-status-badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:#e2e8f0;color:#475569;font-size:.76rem;font-weight:900;text-transform:capitalize}
.season-plan-status-badge.accepted{background:#dcfce7;color:#166534}
.season-plan-status-badge.draft{background:#fef3c7;color:#92400e}
.season-plan-ai-box{display:grid;gap:8px;padding:12px;border:1px solid #bae6fd;border-radius:16px;background:#eff8ff}
.season-plan-sample-box{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr) auto;align-items:center;gap:9px;padding:10px;border:1px dashed #94a3b8;border-radius:14px;background:#fff}
.season-plan-sample-box p{margin:3px 0}.season-plan-sample-box small{grid-column:1/-1}
.season-plan-footer{justify-content:flex-end;position:sticky;bottom:-18px;padding:10px 0 2px;background:linear-gradient(to bottom,rgba(248,250,252,0),#f8fafc 28%)}
.season-plan-validate-chip{border-color:#86efac!important;background:#f0fdf4!important;color:#166534!important}
.season-alignment-result{margin-top:9px;padding:11px;border:1px solid #bae6fd;border-radius:14px;background:#f0f9ff;color:#0f172a}
.season-alignment-result.caution{border-color:#fcd34d;background:#fffbeb}
.season-alignment-result.off-track{border-color:#fca5a5;background:#fff1f2}
.season-alignment-result.aligned{border-color:#86efac;background:#f0fdf4}
.season-alignment-result h4{margin:0 0 5px}
.season-alignment-result p{margin:4px 0}
.season-alignment-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
.season-plan-view-dialog{width:min(1100px,calc(100vw - 20px));height:min(920px,calc(100dvh - 20px));padding:0;border:0;border-radius:20px;box-shadow:0 28px 80px rgba(15,23,42,.38)}
.season-plan-view-dialog::backdrop{background:rgba(15,23,42,.72)}
.season-plan-view-shell{height:100%;box-sizing:border-box;display:flex;flex-direction:column;padding:12px;background:#f8fafc}
.season-plan-view-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 4px 10px}.season-plan-view-header h2{margin:2px 0}
.season-plan-view-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.season-plan-view-actions a{text-decoration:none}
.season-plan-view-dialog iframe{width:100%;flex:1;min-height:0;border:1px solid #cbd5e1;border-radius:12px;background:#fff}
.season-plan-pdf-empty{flex:1;display:grid;place-content:center;text-align:center;gap:8px}.season-plan-pdf-empty.hidden+.season-plan-view-dialog iframe{display:block}
@media(max-width:760px){
  .team-switcher-wrap{gap:2px}.season-plan-header-actions{display:grid;grid-template-columns:1fr 1fr;padding:2px;gap:0}.season-plan-header-actions>strong{grid-column:1/-1;font-size:.55rem;text-align:center}.season-plan-header-actions>button{font-size:.6rem;padding:2px}
  .season-plan-settings-card{align-items:flex-start;flex-direction:column}.season-plan-settings-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.season-plan-settings-card button{width:100%}
  .season-plan-dialog{width:calc(100vw - 10px);max-height:calc(100dvh - 10px)}
  .season-plan-dialog-shell{padding:11px;max-height:calc(100dvh - 10px);gap:9px}
  .season-plan-footer{bottom:-11px;display:grid;grid-template-columns:1fr 1fr}.season-plan-footer button{min-width:0}
  .season-plan-ai-actions{display:grid;grid-template-columns:1fr 1fr}.season-plan-ai-actions button{min-width:0;padding-left:6px;padding-right:6px}
  .season-plan-sample-box{grid-template-columns:1fr auto}.season-plan-sample-box>div{grid-column:1/-1}.season-plan-sample-box input{min-width:0;font-size:.7rem}
  .season-plan-view-dialog{width:calc(100vw - 8px);height:calc(100dvh - 8px)}.season-plan-view-shell{padding:7px}.season-plan-view-header{align-items:flex-start}.season-plan-view-header h2{font-size:1rem}.season-plan-view-actions{justify-content:flex-end}.season-plan-view-actions .secondary{font-size:.68rem;padding:6px}
}

/* Single readiness light replaces verbose drill status banners. */
#drillLibraryList [data-diagram-processing-status-v322w],#drillLibraryList [data-metadata-review-status-v322x],#drillLibraryList [data-diagram-status-badge-v312],#drillLibraryList .diagram-status-badge-v312{display:none!important}
.drill-readiness-light{position:relative;flex:0 0 auto;width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 3px rgba(148,163,184,.15);cursor:help}
.drill-readiness-light.green{background:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.13)}
.drill-readiness-light.yellow{background:#eab308;box-shadow:0 0 0 3px rgba(234,179,8,.15)}
.drill-readiness-light.red{background:#dc2626;box-shadow:0 0 0 3px rgba(220,38,38,.13)}
.drill-readiness-light::after{content:attr(data-readiness-message);position:absolute;left:0;bottom:calc(100% + 10px);z-index:40;width:max-content;max-width:280px;padding:8px 10px;border-radius:9px;background:#0f172a;color:#fff;font-size:.7rem;font-weight:700;line-height:1.35;box-shadow:0 10px 24px rgba(15,23,42,.24);opacity:0;visibility:hidden;transform:translateY(3px);transition:.14s ease;pointer-events:none;white-space:normal}
.drill-readiness-light:hover::after,.drill-readiness-light:focus-visible::after{opacity:1;visibility:visible;transform:none}
.drill-readiness-light.open::after{opacity:1;visibility:visible;transform:none}
.drill-readiness-light{padding:0;border:0}

/* Repository cleanup: skill dropdowns, status light, and compact confidence. */
#zanplanDiagramReviewSummary,#zanplanDiagramStatusFilterBar{display:none!important}
.repository-skill-dropdowns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:7px 0}
.repository-skill-dropdowns label{display:grid;gap:3px;color:var(--muted);font-size:.66rem;font-weight:800}
.repository-skill-dropdowns select{width:100%;min-height:34px;padding:5px 26px 5px 8px;border-radius:9px;font-size:.72rem;background-color:#fff}
.compact-drill-copy .drill-title-row strong{font-size:1.04rem!important;font-weight:900;color:#0f172a}
.compact-drill-card .drill-thumb-wrap{position:relative}
.compact-drill-card .zanplan-crop-confidence-v5.compact-confidence{position:absolute!important;right:2px!important;bottom:2px!important;z-index:4;min-width:24px!important;width:24px!important;max-width:24px!important;height:16px!important;margin:0!important;padding:0!important;display:grid!important;place-items:center;border:1px solid currentColor!important;border-radius:999px!important;background:rgba(255,255,255,.94)!important;font-size:7px!important;font-weight:950!important;line-height:1!important;white-space:nowrap;cursor:pointer;box-shadow:0 1px 3px rgba(15,23,42,.14)!important}
.compact-confidence.green{color:#07846e!important}
.compact-confidence.yellow{color:#a16207!important}
.compact-confidence.red{color:#b91c1c!important}
.compact-drill-card .zanplan-crop-confidence-v5.compact-confidence.expanded{height:auto!important;min-height:25px!important;max-width:190px!important;padding:4px 7px!important;white-space:normal;line-height:1.15!important;text-align:center}
.compact-drill-card .drill-thumb-wrap:has(.compact-confidence.expanded){overflow:visible!important;z-index:8}
@media(max-width:720px){.repository-skill-dropdowns{gap:4px;margin:5px 0}.repository-skill-dropdowns label{font-size:.58rem}.repository-skill-dropdowns select{min-height:31px;padding:3px 20px 3px 5px;font-size:.62rem}.compact-drill-copy .drill-title-row strong{font-size:.92rem!important}}
@media(max-width:720px){.repository-bulk-toolbar{margin:5px 0;padding:5px 7px}.repository-bulk-toolbar label,.repository-bulk-toolbar select{font-size:.62rem}.repository-bulk-toolbar select{min-width:112px;min-height:29px}.compact-drill-select span{display:none}}
.compact-drill-card>.zanplan-choose-source-crop-button-v5,.compact-drill-copy>.zanplan-choose-source-crop-button-v5{display:none!important}

/* Strict two-line repository rows; override legacy tall action-button rules. */
.drill-library-item.compact-drill-card{min-height:74px!important;padding:7px 9px!important;grid-template-columns:104px minmax(0,1fr) 38px!important;gap:8px!important}
.compact-drill-card .drill-library-main{grid-template-columns:72px minmax(0,1fr)!important;gap:8px!important;min-height:54px!important}
.compact-drill-card .drill-thumb-wrap{width:72px!important;height:54px!important;margin:0!important;padding:2px!important}
.compact-drill-copy{display:grid!important;grid-template-rows:25px 20px!important;gap:2px!important;align-content:center!important;overflow:hidden!important}
.compact-drill-copy .drill-title-row{height:25px!important;min-height:0!important;overflow:visible!important;flex-wrap:nowrap!important}
.compact-drill-copy .drill-title-row strong{line-height:22px!important}
.compact-drill-attributes{height:20px!important;overflow:hidden!important;flex-wrap:nowrap!important;align-items:center!important}
.compact-drill-attributes small{flex:0 1 auto;max-width:190px!important}
.compact-drill-select{align-self:center!important;max-height:42px!important;overflow:hidden!important}
.compact-drill-menu{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;margin:0!important;padding:0!important;overflow:visible!important}
.compact-drill-menu:not(.open)>button:not(.compact-drill-menu-trigger){display:none!important;width:0!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;overflow:hidden!important}
.compact-drill-menu>.compact-drill-menu-trigger{display:grid!important;place-items:center!important;width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;margin:0!important;padding:0!important;border-radius:50%!important}
.compact-drill-menu.open{width:190px!important;height:auto!important;min-height:0!important;padding:7px!important;overflow:visible!important}
.compact-drill-menu.open>button:not(.compact-drill-menu-trigger):not(.compact-original-add-button){display:block!important;width:100%!important;height:auto!important;min-height:38px!important;margin:2px 0!important;padding:7px 10px!important;border-width:1px!important;overflow:visible!important;writing-mode:horizontal-tb!important;word-break:normal!important}
@media(max-width:720px){.drill-library-item.compact-drill-card{grid-template-columns:70px minmax(0,1fr) 36px!important;min-height:68px!important}.compact-drill-card .drill-library-main{grid-template-columns:58px minmax(0,1fr)!important}.compact-drill-card .drill-thumb-wrap{width:58px!important;height:46px!important}.compact-drill-select span{line-height:1.1}.compact-drill-attributes small{max-width:110px!important}}
:root { --app-nav-width: 238px; --mobile-nav-height: 72px; }
#appView { min-width: 0; }

/* CoachZippi licensing foundation */
.license-payment-banner,
.license-trial-banner {
  position: sticky;
  top: 0;
  z-index: 120;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 9px 16px;
  text-align: center;
  font-weight: 700;
}

.license-payment-banner { color: #fff; background: #b91c1c; }
.license-trial-banner { color: #0c4a6e; background: #e0f2fe; border-bottom: 1px solid #7dd3fc; }
.license-payment-banner button,
.license-trial-banner button { min-height: 32px; padding: 4px 10px; background: #fff; color: inherit; }

.licensing-dialog {
  width: min(1180px, calc(100vw - 24px));
  max-height: calc(100dvh - 24px);
  padding: 0;
  border: 0;
  border-radius: 22px;
  overflow: hidden;
}

.licensing-dialog::backdrop { background: rgba(15, 23, 42, .68); backdrop-filter: blur(3px); }
.licensing-dialog-shell { display: flex; flex-direction: column; max-height: calc(100dvh - 24px); background: #f8fbff; }
.licensing-dialog-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 20px; border-bottom: 1px solid #dbe4ef; background: #fff; }
.licensing-dialog-header h2 { margin: 2px 0 0; }
.licensing-dialog-body { overflow: auto; padding: 18px; }

.license-current-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
  padding: 16px;
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(115deg, #0b3768, #168ed1);
}
.license-current-summary h3,
.license-current-summary p { margin: 2px 0; }

.license-tier-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.license-tier-card { display: flex; flex-direction: column; min-width: 0; padding: 15px; border: 1px solid #dbe4ef; border-radius: 16px; background: #fff; }
.license-tier-card.current { border: 2px solid #168ed1; box-shadow: 0 8px 24px rgba(22, 142, 209, .14); }
.license-tier-card header { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.license-tier-card header h3 { margin: 0; }
.license-tier-card header span { padding: 3px 7px; border-radius: 999px; font-size: .68rem; color: #075985; background: #e0f2fe; }
.license-price-placeholder { min-height: 38px; color: #64748b; font-size: .8rem; }
.license-tier-card ul { flex: 1; display: grid; align-content: start; gap: 7px; margin: 8px 0 14px; padding: 0; list-style: none; font-size: .78rem; }
.license-tier-card li { display: grid; grid-template-columns: 20px 1fr; gap: 5px; align-items: start; }
.license-tier-card li.unavailable { color: #94a3b8; }
.license-tier-card li.highlight { padding: 5px; margin: -5px; border-radius: 8px; background: #fff7d6; color: #92400e; }

.license-comparison-intro { margin: 0 0 12px; }
.license-comparison-intro h3,
.license-comparison-intro p { margin: 2px 0; }
.license-comparison-intro p { color: #64748b; font-size: .86rem; }
.license-comparison-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: stretch; }
.license-comparison-tier { display: flex; flex-direction: column; min-width: 0; padding: 16px; border: 1px solid #dbe4ef; border-radius: 16px; background: #fff; }
.license-comparison-tier.current { border: 2px solid #168ed1; box-shadow: 0 8px 24px rgba(22, 142, 209, .14); }
.license-comparison-tier > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.license-comparison-tier h3,
.license-comparison-tier header p { margin: 0; }
.license-comparison-tier header p { margin-top: 3px; color: #64748b; font-size: .72rem; line-height: 1.3; }
.license-comparison-tier header > span { flex: 0 0 auto; padding: 3px 7px; border-radius: 999px; color: #075985; background: #e0f2fe; font-size: .66rem; font-weight: 800; }
.license-comparison-tier ul { flex: 1; display: grid; align-content: start; gap: 8px; margin: 8px 0 16px; padding: 0; list-style: none; }
.license-comparison-tier li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 5px; align-items: start; color: #334155; font-size: .78rem; line-height: 1.35; }
.license-comparison-tier li > span:first-child { color: #0f9f6e; font-weight: 900; }
.license-comparison-tier li.highlight { padding: 6px; margin: -6px; border-radius: 8px; color: #92400e; background: #fff7d6; }
.license-comparison-tier > button { margin-top: auto; }

.license-feature-locked { position: relative; filter: grayscale(.7); opacity: .62; }
.license-feature-locked:hover { opacity: .9; }
.license-tier-lock {
  display: inline-grid;
  flex: 0 0 auto;
  justify-items: center;
  align-content: center;
  gap: 2px;
  min-width: 30px;
  margin-left: auto;
  padding: 4px 5px;
  border-radius: 9px;
  color: #475569;
  background: #e2e8f0;
  line-height: 1;
}
.license-tier-lock small { font-size: .48rem; line-height: 1; font-weight: 850; white-space: nowrap; }
.license-lock-glyph { position: relative; display: block; width: 10px; height: 8px; border: 2px solid currentColor; border-radius: 2px; }
.license-lock-glyph::before { content: ''; position: absolute; left: 1px; top: -7px; width: 4px; height: 6px; border: 2px solid currentColor; border-bottom: 0; border-radius: 5px 5px 0 0; }
.license-resource-locked { position: relative; opacity: .58; filter: grayscale(.7); }
.license-resource-locked .compact-drill-select,
.license-resource-locked .compact-drill-menu { pointer-events: none; }
.license-resource-lock-label { position: absolute; inset: auto 8px 8px auto; z-index: 4; min-height: 30px; padding: 4px 9px; font-size: .7rem; color: #7f1d1d; background: #fee2e2; }

.license-admin-console { margin-top: 18px; padding: 16px; border: 1px solid #bfdbfe; border-radius: 16px; background: #eff6ff; }
.license-admin-console h3 { margin: 3px 0; }
.license-admin-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 12px 0; }
.license-admin-metrics span { padding: 10px; border-radius: 10px; background: #fff; color: #475569; }
.license-admin-metrics strong { display: block; color: #0f172a; font-size: 1.2rem; }
.license-admin-console details { margin-top: 9px; padding: 10px; border: 1px solid #dbe4ef; border-radius: 12px; background: #fff; }
.license-admin-console summary { cursor: pointer; font-weight: 800; }
.license-admin-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-top: 12px; }
.license-admin-form label { display: grid; align-content: start; gap: 4px; color: #475569; font-size: .75rem; font-weight: 700; }
.license-admin-form .wide { grid-column: 1 / -1; }
.license-admin-form textarea { min-height: 70px; }
.license-admin-form button { align-self: end; }

@media (max-width: 900px) {
  .license-tier-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .license-comparison-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .license-admin-metrics,
  .license-admin-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
  .license-payment-banner,
  .license-trial-banner { align-items: flex-start; padding: 7px 9px; font-size: .72rem; }
  .licensing-dialog { width: 100vw; max-width: none; max-height: 100dvh; border-radius: 0; }
  .licensing-dialog-shell { max-height: 100dvh; }
  .licensing-dialog-body { padding: 10px; }
  .license-current-summary { align-items: flex-start; padding: 12px; }
  .license-tier-grid { grid-template-columns: 1fr; }
  .license-comparison-grid { grid-template-columns: 1fr; }
  .license-comparison-tier { padding: 13px; }
  .license-admin-metrics,
  .license-admin-form { grid-template-columns: 1fr; }
  .license-admin-form .wide { grid-column: auto; }
}
.app-header { position: sticky; top: 10px; z-index: 40; gap: 18px; }
.app-brand-button { padding: 0; border-radius: 18px; background: transparent; color: var(--text); text-align: left; }
.app-brand-button:hover { transform: none; }
.app-brand-button > span { display: grid; gap: 2px; }
.app-brand-button strong { font-size: 1.16rem; letter-spacing: -.025em; }
.app-brand-button small { color: var(--muted); font-weight: 700; }
.app-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-width: 0; }
.header-menu-wrap { position: relative; }
.team-switcher-button { min-height: 52px; min-width: min(340px, 40vw); padding: 8px 14px; display: flex; align-items: center; gap: 10px; background: #f8fafc; border: 1px solid var(--line); color: var(--text); text-align: left; }
.team-switcher-button > span:last-child { min-width: 0; display: grid; gap: 1px; }
.team-switcher-button small, .team-switcher-button em { color: var(--muted); font-size: .72rem; font-style: normal; font-weight: 750; }
.team-switcher-button strong { max-width: 265px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-switcher-icon { width: 26px; height: 26px; border-radius: 9px; display: grid; place-items: center; color: #075985; background: var(--soft-blue); font-size: 1.1rem; }
.account-menu-button { width: 52px; height: 52px; padding: 0; border-radius: 50%; display: grid; place-items: center; color: white; background: linear-gradient(135deg,var(--brand),var(--brand-dark)); border: 3px solid white; box-shadow: 0 6px 18px rgba(14,165,233,.24); }
.account-menu-button span { width: 23px; height: 23px; border-radius: 50%; display: grid; place-items: center; color: rgba(255,255,255,.95); }
.header-menu { position: absolute; top: calc(100% + 10px); right: 0; width: min(390px, calc(100vw - 28px)); max-height: min(620px, calc(100vh - 100px)); overflow: auto; padding: 12px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.99); box-shadow: 0 24px 70px rgba(15,23,42,.24); }
.team-switcher-menu { right: 0; }
.header-menu-heading, .account-identity { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 6px 12px; border-bottom: 1px solid var(--line); margin-bottom: 10px; }
.header-menu-heading > span, .account-identity div { display: grid; gap: 2px; }
.header-menu-heading small, .account-identity small { color: var(--muted); font-size: .76rem; }
.icon-button { width: 40px; height: 40px; padding: 0; border-radius: 50%; background: #f1f5f9; color: var(--text); font-size: 1.25rem; }
.account-menu { width: 290px; }
.account-identity { justify-content: flex-start; }
.account-avatar { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; color: white; background: linear-gradient(135deg,var(--brand),var(--brand-dark)); }
.account-menu > button { width: 100%; min-height: 44px; text-align: left; color: #334155; background: transparent; border-radius: 12px; }
.account-menu > button:hover, .account-menu > button:focus-visible { background: #f1f5f9; }
.account-menu > .account-logout { color: var(--danger); border-top: 1px solid var(--line); border-radius: 0 0 12px 12px; margin-top: 6px; }
.link-button{min-height:38px;padding:6px 10px;border:0;background:transparent;color:var(--brand-dark);text-decoration:underline;text-underline-offset:3px}
.security-dialog{width:min(520px,calc(100vw - 24px));padding:0;border:0;border-radius:22px;background:transparent;box-shadow:0 28px 80px rgba(15,23,42,.3)}
.security-dialog::backdrop{background:rgba(15,23,42,.58);backdrop-filter:blur(3px)}
.security-card{margin:0;padding:22px;border:1px solid var(--line);border-radius:22px;background:#fff}
.security-dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:13px;border-bottom:1px solid var(--line)}
.security-dialog-heading h2{margin:3px 0 0}.security-dialog-heading small{color:var(--brand);font-weight:900;letter-spacing:.08em}
.security-card label{display:grid;gap:7px;font-weight:800}.security-card input{width:100%}
.security-request-status{margin:0;padding:10px 12px;border-radius:12px;font-size:.92rem;font-weight:800;line-height:1.35}
.security-request-status.is-working{display:block;background:#eff6ff;color:#075985;border:1px solid #bae6fd}
.security-request-status.is-error{display:block;background:#fff1f2;color:#9f1239;border:1px solid #fecdd3}
@media(max-width:720px){.security-card{padding:17px}.security-dialog{width:calc(100vw - 18px)}}
.team-list { max-height: min(420px, 55vh); overflow: auto; padding: 2px; }
.team-button { width: 100%; min-height: 58px; }
.team-name-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.team-name-row strong { overflow-wrap: anywhere; }
.organization-badge { flex: 0 0 auto; padding: 3px 6px; border-radius: 999px; color: #166534; background: #dcfce7; font-size: .61rem; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; }
.account-settings-panel { scroll-margin-top: 100px; }
.app-layout { grid-template-columns: var(--app-nav-width) minmax(0,1fr); align-items: start; transition: grid-template-columns .2s ease; }
.app-sidebar { min-height: 430px; top: 104px; padding: 12px; display: flex; flex-direction: column; gap: 10px; overflow: hidden; }
.sidebar-toggle { min-height: 44px; display: flex; align-items: center; gap: 10px; justify-content: flex-start; color: var(--muted); background: #f8fafc; }
.primary-navigation { display: grid; gap: 7px; }
.primary-navigation button, .sidebar-team-settings { min-height: 50px; width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px 13px; text-align: left; color: #334155; background: transparent; }
.primary-navigation button > span, .sidebar-team-settings > span { width: 24px; flex: 0 0 24px; text-align: center; font-size: 1.25rem; }
.navigation-brand-icon { width: 24px; height: 24px; flex: 0 0 24px; display: block; object-fit: cover; border-radius: 7px; box-shadow: 0 3px 8px rgba(3,105,161,.2); }
.primary-navigation button.active, .sidebar-team-settings.active { color: #075985; background: #e0f2fe; box-shadow: inset 3px 0 0 var(--brand); }
.primary-navigation .ai-navigation-item { color: #5b21b6; background: linear-gradient(135deg,rgba(224,242,254,.66),rgba(243,232,255,.72)); }
.primary-navigation .ai-navigation-item.active { color: #ffffff; background: linear-gradient(135deg,#7c3aed,#0284c7); box-shadow: 0 10px 24px rgba(124,58,237,.2); }
.sidebar-team-settings { margin-top: auto; border-top: 1px solid var(--line); border-radius: 0 0 14px 14px; }
body.sidebar-collapsed { --app-nav-width: 76px; }
body.sidebar-collapsed .app-sidebar strong, body.sidebar-collapsed .sidebar-toggle span { display: none; }
body.sidebar-collapsed .primary-navigation button, body.sidebar-collapsed .sidebar-team-settings, body.sidebar-collapsed .sidebar-toggle { justify-content: center; padding-inline: 8px; }
.workspace { min-width: 0; }
.home-hero { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: clamp(20px,4vw,38px); color: white; background: linear-gradient(135deg,#075985,#0ea5e9 58%,#22c55e); border: 0; overflow: hidden; }
.home-hero h3 { margin-bottom: 8px; font-size: clamp(1.45rem,3vw,2.15rem); }
.home-hero p, .home-hero .eyebrow { color: rgba(255,255,255,.88); }
.home-hero .primary { flex: 0 0 auto; background: white; color: #075985; }
.home-action-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.home-action-grid button { min-height: 132px; display: grid; grid-template-columns: 42px 1fr; grid-template-rows: auto auto; align-content: center; column-gap: 12px; padding: 20px; text-align: left; color: var(--text); background: white; border: 1px solid var(--line); box-shadow: 0 8px 24px rgba(15,23,42,.06); }
.home-action-grid button > span { grid-row: 1 / 3; width: 42px; height: 42px; display: grid; place-items: center; align-self: center; border-radius: 14px; color: #075985; background: #e0f2fe; font-size: 1.25rem; }
.home-action-grid button strong { font-size: 1.02rem; }
.home-action-grid button small { color: var(--muted); line-height: 1.35; font-weight: 650; }
.mobile-bottom-navigation { display: none; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(14,165,233,.45); outline-offset: 2px; }

@media (max-width: 960px) {
  .app-header { flex-direction: row; align-items: center; }
  .app-layout { grid-template-columns: 82px minmax(0,1fr); }
  .app-sidebar strong, .sidebar-toggle span { display: none; }
  .primary-navigation button, .sidebar-team-settings, .sidebar-toggle { justify-content: center; padding-inline: 8px; }
}

@media (max-width: 720px) {
  body { background-attachment: scroll; padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom)); }
  .shell { width: 100%; padding: 0; }
  .app-header { top: 0; margin: 0; padding: 10px 12px; border-radius: 0 0 20px 20px; }
  .app-brand-button .brand-logo { width: 44px; height: 44px; border-radius: 14px; }
  .app-brand-button > span { display: none; }
  .app-header-actions { flex: 1; }
  .team-switcher-wrap { flex: 1; min-width: 0; }
  .team-switcher-button { width: 100%; min-width: 0; min-height: 46px; padding: 6px 10px; }
  .team-switcher-button strong { max-width: calc(100vw - 190px); font-size: .88rem; }
  .team-switcher-button em { display: none; }
  .account-menu-button { width: 46px; height: 46px; }
  .header-menu { position: fixed; top: 72px; left: 10px; right: 10px; width: auto; max-height: calc(100vh - 92px - var(--mobile-nav-height)); }
  .app-layout { display: block; }
  .app-sidebar { display: none; }
  .workspace { padding: 14px 12px 22px; border-radius: 0; border-inline: 0; box-shadow: none; }
  .workspace-header { gap: 10px; padding-bottom: 12px; margin-bottom: 14px; }
  .workspace-header h2 { font-size: 1.25rem; margin-bottom: 4px; }
  .workspace-header #teamEmail { display: none; }
  .workspace-header #copyTeamEmailBtn { align-self: flex-start; }
  .account-settings-panel { margin: 10px; padding: 16px; }
  .home-hero { align-items: stretch; flex-direction: column; }
  .home-action-grid { grid-template-columns: 1fr; }
  .home-action-grid button { min-height: 104px; }
  .mobile-bottom-navigation { position: fixed; z-index: 50; left: 0; right: 0; bottom: 0; min-height: var(--mobile-nav-height); padding: 7px max(8px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 3px; background: rgba(255,255,255,.97); border-top: 1px solid var(--line); box-shadow: 0 -12px 30px rgba(15,23,42,.12); backdrop-filter: blur(16px); }
  .mobile-bottom-navigation button { min-width: 0; min-height: 54px; padding: 5px 2px; display: grid; justify-items: center; align-content: center; gap: 3px; color: #64748b; background: transparent; border-radius: 12px; }
  .mobile-bottom-navigation button > span { min-height: 19px; font-size: 1.15rem; }
  .mobile-bottom-navigation .navigation-brand-icon { width: 21px; height: 21px; min-height: 21px; border-radius: 6px; }
  .mobile-bottom-navigation button small { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: clamp(.57rem,2.5vw,.72rem); font-weight: 850; }
  .mobile-bottom-navigation button.active { color: #075985; background: #e0f2fe; }
  .mobile-bottom-navigation button.has-active .active-dot { background: var(--brand-green); }
  .panel { padding: 15px; border-radius: 18px; }
  .toast { top: 78px; }
}

/* Phone and tablet diagram editor: portrait guidance, landscape workspace. */
.diagram-orientation-prompt{display:none}
@media (max-width:1100px) and (orientation:portrait){
  .diagram-drawer-dialog[open]{width:100vw;height:100dvh;max-height:none;margin:0;border:0;border-radius:0;background:#f8fafc}
  .diagram-drawer-dialog[open] .diagram-drawer-shell{display:none}
  .diagram-drawer-dialog[open] .diagram-orientation-prompt{min-height:100dvh;display:grid;place-content:center;justify-items:center;gap:12px;padding:28px;text-align:center;background:linear-gradient(155deg,#effaff,#f8fafc 62%,#ecfdf5)}
  .diagram-orientation-prompt .diagram-rotate-icon{width:72px;height:72px;display:grid;place-items:center;border-radius:22px;color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-dark));font-size:2.7rem;line-height:1;box-shadow:0 14px 30px rgba(3,105,161,.2)}
  .diagram-orientation-prompt strong{font-size:1.45rem;color:var(--text)}
  .diagram-orientation-prompt p{max-width:430px;margin:0;color:var(--muted);line-height:1.5}
  .diagram-orientation-prompt button{margin-top:5px}
}
@media (max-width:1100px) and (orientation:landscape), (min-width:1101px) and (max-width:1366px) and (orientation:landscape) and (pointer:coarse){
  .diagram-drawer-dialog[open]{width:100vw;height:100dvh;max-height:none;margin:0;border:0;border-radius:0;overflow:hidden}
  .diagram-drawer-shell{height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:7px 9px}
  .diagram-drawer-header{min-height:44px;padding:0 0 5px;gap:8px}
  .diagram-drawer-header .eyebrow,.diagram-drawer-header p{display:none}
  .diagram-drawer-header h2{margin:0;font-size:1rem}
  .diagram-drawer-header button{min-height:32px;padding:4px 9px;font-size:.7rem}
  .diagram-drawer-layout{min-height:0;display:grid;grid-template-columns:190px minmax(0,1fr);gap:8px;margin:6px 0}
  .diagram-toolbox{min-height:0;display:block;overflow-y:auto;padding-right:3px;scrollbar-width:thin}
  .diagram-tool-group{grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;margin-bottom:5px;padding:5px;border-radius:9px}
  .diagram-tool-group strong{font-size:.63rem;line-height:1.15}
  .diagram-tool-group button{min-height:25px;padding:2px 3px;border-radius:6px;font-size:.55rem;line-height:1.05}
  .diagram-tool-group button.active{box-shadow:0 0 0 2px rgba(14,165,233,.18)}
  .diagram-numbering{margin-bottom:5px;padding:5px;border-radius:9px}
  .diagram-numbering label{min-height:27px;gap:5px;padding:2px;font-size:.56rem;line-height:1.1}
  .diagram-numbering input{width:13px;height:13px;margin:0}
  .diagram-colours{gap:4px;padding:5px;border-radius:9px}
  .diagram-colours>strong{font-size:.62rem}
  .diagram-colour-options{display:flex;flex-wrap:wrap;gap:5px}
  .diagram-colour-options button{width:22px;height:22px;min-width:22px;min-height:22px;aspect-ratio:auto;border-width:2px}
  .diagram-colour-options button.active{box-shadow:0 0 0 2px #0ea5e9,0 0 0 3px rgba(14,165,233,.16)}
  #activeDiagramColour{font-size:.53rem}
  .diagram-canvas-panel{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr)}
  .diagram-editor-toolbar{min-height:31px;margin-bottom:4px;gap:4px;flex-wrap:nowrap}
  #activeDiagramTool{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.68rem}
  .diagram-editor-toolbar button{min-height:28px;padding:3px 7px;border-radius:7px;font-size:.6rem}
  .diagram-canvas-wrap{min-height:0;display:grid;place-items:center;padding:4px;border-radius:10px;overflow:hidden}
  #diagramDrawingCanvas{width:auto;height:auto;min-width:0!important;max-width:100%;max-height:100%;aspect-ratio:12/7;object-fit:fill;border-radius:7px}
  .diagram-canvas-panel>.hint{display:none}
  .diagram-drawer-actions{min-height:37px;padding-top:5px;gap:5px}
  .diagram-drawer-actions button{min-height:31px;padding:4px 10px;font-size:.66rem}
}
@media (max-width:760px) and (orientation:landscape){
  .diagram-drawer-layout{grid-template-columns:164px minmax(0,1fr)}
  .diagram-tool-group button{font-size:.49rem}
  .diagram-colour-options button{width:19px;height:19px;min-width:19px;min-height:19px}
}

@media (max-width: 390px) {
  .team-switcher-icon { display: none; }
  .team-switcher-button strong { max-width: calc(100vw - 150px); }
  .workspace-header { flex-direction: column; }
}

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

/* Compact import queue: one line until a coach chooses to review it. */
.compact-import-review { padding: 0 !important; overflow: hidden; }
.compact-import-review-toggle { width: 100%; min-height: 46px; display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 9px; padding: 9px 13px; color: #075985; background: transparent; text-align: left; }
.compact-import-review-count { min-width: 25px; height: 25px; padding: 0 7px; display: grid; place-items: center; border-radius: 999px; color: white; background: #0284c7; font-size: .75rem; font-weight: 900; }
.compact-import-review-toggle > span:last-child { font-size: 1.35rem; transition: transform .18s ease; }
.compact-import-review-body { display: none; padding: 0 13px 13px; }
.compact-import-review.open .compact-import-review-body { display: block; }
.compact-import-review.open .compact-import-review-toggle > span:last-child { transform: rotate(90deg); }
.mobile-repository-filters-toggle { display: none; }

/* Compact saved-practice rows and action menus. */
#planList .compact-practice-plan-card{position:relative;display:grid!important;grid-template-columns:minmax(0,1fr) 38px;align-items:center;gap:9px;min-height:58px;padding:9px 10px!important;border-radius:14px}
.compact-practice-plan-copy{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;min-width:0}
.compact-practice-plan-copy>.badge,.compact-practice-plan-copy>small:not(.compact-practice-plan-date),.compact-practice-plan-copy>.practice-card-inline-summary{display:none!important}
.compact-practice-plan-copy>strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.98rem;line-height:1.15;color:#0f172a}
.compact-practice-plan-date{display:block!important;color:var(--muted);font-size:.72rem;line-height:1.2}
.compact-practice-plan-menu{position:relative!important;display:block!important;width:38px!important;height:38px!important;min-width:38px!important;margin:0!important;padding:0!important;overflow:visible!important}
.compact-practice-plan-trigger{display:grid!important;place-items:center;width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;margin:0!important;padding:0!important;border:1px solid var(--line)!important;border-radius:50%!important;background:#fff!important;color:var(--brand-dark)!important;font-size:1rem!important;font-weight:950!important;line-height:1!important}
.compact-practice-plan-menu:not(.open)>button:not(.compact-practice-plan-trigger){display:none!important}
.compact-practice-plan-menu.open{position:absolute!important;right:8px!important;top:48px!important;z-index:60;width:190px!important;height:auto!important;padding:7px!important;border:1px solid var(--line)!important;border-radius:13px!important;background:#fff!important;box-shadow:0 16px 38px rgba(15,23,42,.2)!important}
.compact-practice-plan-menu.open>.compact-practice-plan-trigger{position:absolute!important;right:0;top:-46px}
.compact-practice-plan-menu.open>button:not(.compact-practice-plan-trigger){display:block!important;width:100%!important;min-height:38px!important;margin:2px 0!important;padding:7px 10px!important;border-radius:9px!important;text-align:left!important;writing-mode:horizontal-tb!important;word-break:normal!important}
.compact-practice-plan-menu>[data-view-created-practice-summary]{order:1}.compact-practice-plan-menu>[data-send-practice-coaches]{order:2}.compact-practice-plan-menu>[data-launch-practice]{order:3}.compact-practice-plan-menu>[data-modify-created-practice]{order:4}.compact-practice-plan-menu>[data-delete-interactive-practice]{order:5}
@media(max-width:720px){#planList .compact-practice-plan-card{min-height:54px;padding:7px 8px!important}.compact-practice-plan-menu.open{right:5px!important}.compact-practice-plan-copy>strong{font-size:.9rem}}
.practice-control-icon{display:inline-grid!important;place-items:center!important;width:44px!important;min-width:44px!important;height:40px!important;min-height:40px!important;padding:0!important;font-size:1.15rem!important;line-height:1!important}
.active-practice-controls{gap:6px!important;justify-content:flex-end}
@media(max-width:720px){.active-practice-controls{display:flex!important;flex-flow:row nowrap!important;justify-content:center!important;align-items:center!important;gap:5px!important;width:100%!important;overflow-x:auto}.active-practice-controls .practice-control-icon{flex:0 0 42px!important;width:42px!important;min-width:42px!important;height:38px!important;min-height:38px!important;padding:0!important}}
@media(prefers-reduced-motion:reduce){.repository-loading-spinner{animation:none}}

/* First-login PWA notification onboarding. */
.notification-permission-dialog{width:min(540px,calc(100vw - 24px));padding:0;border:0;border-radius:22px;background:transparent;box-shadow:0 24px 70px rgba(15,23,42,.28)}
.notification-permission-dialog::backdrop{background:rgba(15,23,42,.55);backdrop-filter:blur(3px)}
.notification-permission-card{display:grid;grid-template-columns:58px minmax(0,1fr);gap:14px;padding:22px;background:#fff;color:var(--text)}
.notification-permission-card h2{margin:0 0 7px;font-size:1.2rem;line-height:1.2}
.notification-permission-card p{margin:0;line-height:1.45;color:var(--muted)}
.notification-permission-card .hint{margin-top:9px;padding:9px;border-radius:10px;background:#eff6ff;color:#075985;font-weight:700}
.notification-permission-icon{display:block;width:54px;height:54px;border-radius:17px;object-fit:cover;background:#061c49;box-shadow:0 8px 20px rgba(14,165,233,.28)}
.notification-permission-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
.notification-permission-actions button{min-height:42px}
@media(max-width:520px){.notification-permission-card{grid-template-columns:44px minmax(0,1fr);gap:10px;padding:17px}.notification-permission-icon{width:42px;height:42px;border-radius:13px;font-size:.78rem}.notification-permission-card h2{font-size:1.05rem}.notification-permission-actions{display:grid;grid-template-columns:1fr 1.4fr}.notification-permission-actions button{width:100%;padding-inline:8px;font-size:.78rem}}

/* Z draft refinements: compact, touch-friendly replacement choices. */
.zippy-alternatives-panel{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.zippy-alternatives-panel h4{margin:0 0 4px;color:var(--brand-dark)}
.zippy-alternative-request{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
.zippy-alternative-request textarea{width:100%;min-height:74px;resize:vertical}
.zippy-alternative-prompt-input{position:relative;min-width:0}
.zippy-alternative-prompt-input textarea{padding-right:58px}
.zippy-alternative-prompt-input .coach-zippy-mic-button{right:8px;bottom:8px;width:38px;height:38px}
.zippy-alternative-prompt-input .coach-zippy-mic-button svg{width:20px;height:20px}
.zippy-alternative-request button{min-height:44px}
.zippy-alternative-options{margin-top:10px}
.zippy-replacing-label{margin:0 0 7px;color:var(--muted)}
.zippy-alternative-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.zippy-alternative-grid button{display:grid;gap:3px;min-height:72px;padding:9px 10px;border:1px solid #bae6fd;border-radius:12px;background:#f0f9ff;color:#075985;text-align:left}
.zippy-alternative-grid button:hover,.zippy-alternative-grid button:focus-visible{border-color:#0284c7;background:#e0f2fe}
.zippy-alternative-grid button strong{font-size:.84rem;line-height:1.16}
.zippy-alternative-grid button small{color:var(--muted);font-size:.68rem;line-height:1.25}
.zippy-alternative-grid button em{color:#047857;font-size:.64rem;font-style:normal;font-weight:800}
.zippy-alternative-success{margin:0;padding:8px 10px;border-radius:10px;background:#ecfdf5;color:#047857}
.team-practice-defaults-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:10px;align-items:end}
.team-practice-defaults-form label{display:grid;gap:5px;color:var(--muted);font-size:.78rem;font-weight:800}
.team-practice-defaults-form input{min-height:42px}
.team-practice-defaults-form button{min-height:42px;white-space:nowrap}
.zanplan-new-practice-highlight{outline:3px solid #38bdf8;outline-offset:3px;box-shadow:0 0 0 7px rgba(56,189,248,.16)!important}
@media(max-width:720px){
  .zippy-alternatives-panel{margin-top:9px;padding-top:9px}
  .zippy-alternative-request{grid-template-columns:1fr}
  .zippy-alternative-request textarea{min-height:66px}
  .zippy-alternative-request button{width:100%;min-height:39px}
  .zippy-alternative-grid{grid-template-columns:1fr}
  .zippy-alternative-grid button{min-height:62px;padding:8px}
  .team-practice-defaults-form{grid-template-columns:repeat(3,minmax(0,1fr))}
  .team-practice-defaults-form button{grid-column:1/-1;width:100%}
}

@media (max-width: 720px) {
  body { padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom)) !important; }
  .app-sidebar { display: none !important; }
  .app-layout { display: block !important; }
  .workspace-header { display: none !important; }
  .mobile-bottom-navigation {
    position: fixed !important;
    z-index: 100;
    top: auto !important;
    bottom: 0 !important;
    min-height: var(--mobile-nav-height);
    padding: 4px 6px calc(4px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    border-bottom: 0;
    box-shadow: 0 -7px 18px rgba(15,23,42,.1);
  }
  .mobile-bottom-navigation button { min-height: 47px; padding: 3px 1px; border-radius: 10px; }
  .mobile-bottom-navigation button > span { min-height: 16px; font-size: 1rem; }
  .mobile-bottom-navigation button small { font-size: clamp(.56rem,2.45vw,.69rem); }
  .workspace { padding: 8px 8px calc(var(--mobile-nav-height) + 22px); }
  .drills-subtabs { top: 66px; margin-bottom: 8px; }
  body.active-practice-tab.active-drill-mode .active-practice-fullscreen {
    padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));
  }
  .drills-subpanel[data-drills-subpanel="repositories"] { padding: 9px !important; }
  .drills-subpanel[data-drills-subpanel="repositories"] > .panel-header-row { flex-direction: row; align-items: center; margin-bottom: 3px; }
  .drills-subpanel[data-drills-subpanel="repositories"] > .panel-header-row h3 { margin: 0; font-size: 1rem; }
  .drills-subpanel[data-drills-subpanel="repositories"] > .panel-header-row .hint { display: none; }
  #refreshDrillsBtn { width: 32px; min-width: 32px; min-height: 32px; padding: 0; overflow: hidden; font-size: 0; }
  #refreshDrillsBtn::before { content: "↻"; font-size: 1rem; }
  .repository-filter-bar { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 4px !important; margin: 5px 0 6px !important; }
  .repository-filter-bar button { min-height: 33px !important; padding: 3px 2px !important; text-align: center !important; line-height: 1.08; font-size: clamp(.52rem,2.25vw,.66rem); }
  .mobile-repository-filters-toggle { display: block; width: 100%; min-height: 31px; margin: 0 0 6px; padding: 3px 8px; font-size: .68rem; }
  .drills-subpanel[data-drills-subpanel="repositories"] > .repository-skill-filters,
  .drills-subpanel[data-drills-subpanel="repositories"] > .drill-search-grid { display: none; }
  .drills-subpanel.mobile-filters-open > .repository-skill-filters { display: grid; margin: 6px 0; padding: 7px; }
  .drills-subpanel.mobile-filters-open > .drill-search-grid { display: grid; margin-bottom: 7px; }
  .compact-import-review { margin: 7px 0 !important; border-radius: 12px !important; background: #fff !important; }
  .compact-import-review-toggle { min-height: 38px; padding: 5px 10px; font-size: .78rem; }
  .compact-import-review-count { min-width: 22px; height: 22px; font-size: .68rem; }
}
.coachzippy-duplicate-decision-overlay {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(7, 20, 39, 0.68);
}

.coachzippy-duplicate-decision {
  width: min(620px, 100%);
  max-height: min(760px, 90vh);
  overflow: auto;
  padding: 22px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(7, 20, 39, 0.32);
}

.coachzippy-duplicate-decision h2 { margin: 0 0 8px; }
.coachzippy-duplicate-decision p { color: #5d6f89; }
.coachzippy-duplicate-comparison {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr);
  gap: 12px;
  margin: 18px 0;
}
.coachzippy-duplicate-comparison > div {
  display: grid;
  gap: 7px;
  align-content: start;
  padding: 14px;
  border: 1px solid #dce6f2;
  border-radius: 16px;
  background: #f8fbff;
}
.coachzippy-duplicate-comparison img {
  display: block;
  width: 100%;
  max-height: 260px;
  object-fit: contain;
  border-radius: 12px;
  background: #fff;
}
.coachzippy-duplicate-no-diagram { color: #74839a; font-size: .9rem; }
.coachzippy-duplicate-actions { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }

@media (max-width: 560px) {
  .coachzippy-duplicate-comparison { grid-template-columns: 1fr; }
  .coachzippy-duplicate-decision { padding: 17px; border-radius: 18px; }
  .coachzippy-duplicate-actions button { flex: 1 1 100%; }
}
.community-disclosure-dialog {
  width: min(92vw, 620px);
  max-height: 90vh;
  padding: 0;
  border: 0;
  border-radius: 24px;
  box-shadow: 0 24px 70px rgba(15, 31, 55, .28);
}

.community-disclosure-dialog::backdrop {
  background: rgba(10, 25, 45, .68);
  backdrop-filter: blur(3px);
}

.community-disclosure-card {
  display: grid;
  gap: 16px;
  padding: clamp(22px, 5vw, 38px);
  color: #14223a;
}

.community-disclosure-card h2,
.community-disclosure-card p,
.community-disclosure-card ul { margin: 0; }

.community-disclosure-card ul {
  display: grid;
  gap: 8px;
  padding-left: 22px;
  color: #52647e;
}

.community-disclosure-confirm {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 10px;
  padding: 14px;
  border: 1px solid #a9d9f5;
  border-radius: 14px;
  background: #f0f9ff;
  font-weight: 700;
}

.community-disclosure-confirm input { margin-top: 3px; }

.community-disclosure-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

@media (max-width: 520px) {
  .community-disclosure-actions > button { flex: 1 1 100%; }
}

@media (max-width: 720px) {
  .repository-filter-bar { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .repository-filter-bar button { font-size: clamp(.48rem, 2vw, .62rem) !important; padding-inline: 1px !important; }
}
