@font-face {
  font-family: "Raleway";
  src: url("/assets/v2/fonts/Raleway-VariableFont_wght.ttf") format("truetype");
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

:root,
[data-bs-theme="dark"] {
  --ap-primary: #0080E2;
  --ap-primary-hover: #0276CF;
  --ap-primary-active: #0269B8;
  --ap-deep: #003DA6;
  --ap-link-on-dark: #1A8DE5;
  --ap-success: #198754;
  --ap-warning: #FFC107;
  --ap-danger: #DC3545;
  --ap-info: #0DCAF0;
  --ap-brand-gradient: linear-gradient(115deg, rgba(0,128,226,0) 55%, rgba(0,128,226,.85) 100%);
  --ap-radius-pill: 50rem;
  --ap-radius-card: 14px;
  --ap-radius-login: 16px;
  --ap-radius-modal: 12px;
  --ap-radius-input: 10px;
  --ap-radius-icon: 8px;
  --ap-space-1: 4px;
  --ap-space-2: 8px;
  --ap-space-3: 12px;
  --ap-space-4: 16px;
  --ap-space-6: 24px;
  --ap-space-8: 32px;
  --ap-space-12: 48px;
  --ap-shadow-sm: 0 1px 2px rgba(0,0,0,.06), 0 1px 3px rgba(0,0,0,.08);
  --ap-shadow-md: 0 .5rem 1rem rgba(0,0,0,.12);
  --ap-shadow-lg: 0 1rem 3rem rgba(0,0,0,.2);
  --ap-focus: 0 0 0 .25rem rgba(0,128,226,.35);
  --ap-font-family: "Raleway", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ap-gutter: 32px;
  --bs-primary: var(--ap-primary);
  --bs-primary-rgb: 0, 128, 226;
  --bs-success: var(--ap-success);
  --bs-success-rgb: 25, 135, 84;
  --bs-warning: var(--ap-warning);
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger: var(--ap-danger);
  --bs-danger-rgb: 220, 53, 69;
  --bs-info: var(--ap-info);
  --bs-info-rgb: 13, 202, 240;
  --bs-body-font-family: var(--ap-font-family);
  --bs-body-font-size: 14px;
  --bs-body-line-height: 1.5;
  --bs-border-width: 1px;
  --bs-border-radius: var(--ap-radius-input);
  --bs-border-radius-sm: 8px;
  --bs-border-radius-lg: var(--ap-radius-card);
  --bs-border-radius-xl: 16px;
  --bs-border-radius-xxl: 24px;
  --bs-border-radius-pill: var(--ap-radius-pill);
  --bs-focus-ring-color: rgba(0,128,226,.35);
  --bs-focus-ring-opacity: .35;
  --bs-focus-ring-width: .25rem;
}

:root,
[data-bs-theme="dark"] {
  color-scheme: dark;
  --ap-bg: #000000;
  --ap-surface: #1C1C1D;
  --ap-elevated: #262626;
  --ap-table-head: #262626;
  --ap-border: #2E2E30;
  --ap-border-strong: #404040;
  --ap-text: #FFFFFF;
  --ap-text-strong: #FFFFFF;
  --ap-secondary: #CBCBCB;
  --ap-subtle: #A5A5A5;
  --ap-placeholder: #8C8C8C;
  --ap-row-hover: rgba(255,255,255,.04);
  --ap-primary-soft: rgba(0,128,226,.16);
  --ap-active: #2DD55B;
  --ap-link: #56AFF2;
  --ap-link-hover: #8EC9F8;
  --ap-chip-text: #64B8F7;
  --ap-danger-text: #FF8290;
  --ap-success-text: #2DD55B;
  --ap-subtle-contrast: #A5A5A5;
  --ap-form-bg: #262626;
  --ap-card-shadow: none;
  --ap-menu-shadow: 0 12px 36px rgba(0,0,0,.48);
  --ap-tooltip-bg: #262626;
  --bs-body-bg: var(--ap-bg);
  --bs-body-bg-rgb: 0, 0, 0;
  --bs-body-color: var(--ap-text);
  --bs-body-color-rgb: 255, 255, 255;
  --bs-emphasis-color: var(--ap-text-strong);
  --bs-emphasis-color-rgb: 255, 255, 255;
  --bs-secondary-color: var(--ap-secondary);
  --bs-secondary-color-rgb: 203, 203, 203;
  --bs-secondary-bg: var(--ap-surface);
  --bs-secondary-bg-rgb: 28, 28, 29;
  --bs-tertiary-color: var(--ap-subtle);
  --bs-tertiary-bg: var(--ap-elevated);
  --bs-tertiary-bg-rgb: 38, 38, 38;
  --bs-border-color: var(--ap-border);
  --bs-border-color-translucent: var(--ap-border);
  --bs-link-color: var(--ap-link);
  --bs-link-color-rgb: 86, 175, 242;
  --bs-link-hover-color: var(--ap-link-hover);
  --bs-link-hover-color-rgb: 142, 201, 248;
  --bs-primary-text-emphasis: var(--ap-chip-text);
  --bs-primary-bg-subtle: var(--ap-primary-soft);
  --bs-primary-border-subtle: #254966;
  --bs-success-text-emphasis: #77E594;
  --bs-success-bg-subtle: #132D1B;
  --bs-success-border-subtle: #2A5135;
  --bs-danger-text-emphasis: #FF98A3;
  --bs-danger-bg-subtle: #3A1C21;
  --bs-danger-border-subtle: #67313A;
  --bs-warning-text-emphasis: #FFD66A;
  --bs-warning-bg-subtle: #342B16;
  --bs-warning-border-subtle: #5F4A1C;
  --bs-info-text-emphasis: #7FDFEF;
  --bs-info-bg-subtle: #152E34;
  --bs-info-border-subtle: #29525A;
}

/* Local component variables override Bootstrap's fixed component defaults. */
.btn-primary {
  --bs-btn-color: #000000;
  --bs-btn-bg: var(--ap-primary);
  --bs-btn-border-color: var(--ap-primary);
  --bs-btn-hover-color: #FFFFFF;
  --bs-btn-hover-bg: var(--ap-primary-hover);
  --bs-btn-hover-border-color: var(--ap-primary-hover);
  --bs-btn-active-color: #FFFFFF;
  --bs-btn-active-bg: var(--ap-primary-active);
  --bs-btn-active-border-color: var(--ap-primary-active);
  --bs-btn-disabled-color: #000000;
  --bs-btn-disabled-bg: var(--ap-primary);
  --bs-btn-disabled-border-color: var(--ap-primary);
  --bs-btn-focus-shadow-rgb: 0, 128, 226;
}
.btn-outline-secondary,
.ap-btn-secondary {
  --bs-btn-color: var(--ap-text);
  --bs-btn-border-color: var(--ap-border-strong);
  --bs-btn-hover-color: var(--ap-text-strong);
  --bs-btn-hover-bg: var(--ap-row-hover);
  --bs-btn-hover-border-color: var(--ap-border-strong);
  --bs-btn-active-color: var(--ap-text);
  --bs-btn-active-bg: var(--ap-elevated);
  --bs-btn-active-border-color: var(--ap-border-strong);
  --bs-btn-disabled-color: var(--ap-subtle-contrast);
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--ap-border-strong);
  --bs-btn-focus-shadow-rgb: 0, 128, 226;
}
.btn-outline-primary {
  --bs-btn-color: var(--ap-link);
  --bs-btn-border-color: var(--ap-primary);
  --bs-btn-hover-color: #FFFFFF;
  --bs-btn-hover-bg: var(--ap-primary-hover);
  --bs-btn-hover-border-color: var(--ap-primary-hover);
  --bs-btn-active-color: #FFFFFF;
  --bs-btn-active-bg: var(--ap-primary-active);
  --bs-btn-active-border-color: var(--ap-primary-active);
}
.dropdown-menu {
  --bs-dropdown-font-size: 14px;
  --bs-dropdown-color: var(--ap-text);
  --bs-dropdown-bg: var(--ap-elevated);
  --bs-dropdown-border-color: var(--ap-border-strong);
  --bs-dropdown-border-radius: var(--ap-radius-modal);
  --bs-dropdown-box-shadow: var(--ap-menu-shadow);
  --bs-dropdown-link-color: var(--ap-text);
  --bs-dropdown-link-hover-color: var(--ap-text-strong);
  --bs-dropdown-link-hover-bg: var(--ap-row-hover);
  --bs-dropdown-link-active-color: var(--ap-text);
  --bs-dropdown-link-active-bg: var(--ap-primary-soft);
  --bs-dropdown-link-disabled-color: var(--ap-subtle-contrast);
  --bs-dropdown-divider-bg: var(--ap-border);
}
.modal {
  --bs-modal-color: var(--ap-text);
  --bs-modal-bg: var(--ap-elevated);
  --bs-modal-border-color: var(--ap-border-strong);
  --bs-modal-border-radius: var(--ap-radius-modal);
  --bs-modal-box-shadow: var(--ap-menu-shadow);
  --bs-modal-header-border-color: transparent;
  --bs-modal-footer-border-color: var(--ap-border);
}
.table {
  --bs-table-color: var(--ap-text);
  --bs-table-bg: var(--ap-surface);
  --bs-table-border-color: var(--ap-border);
  --bs-table-hover-color: var(--ap-text-strong);
  --bs-table-hover-bg: var(--ap-row-hover);
  --bs-table-active-color: var(--ap-text);
  --bs-table-active-bg: var(--ap-primary-soft);
  --bs-table-striped-color: var(--ap-text);
  --bs-table-striped-bg: var(--ap-row-hover);
}
.form-control,
.form-select {
  --bs-body-bg: var(--ap-form-bg);
  --bs-body-color: var(--ap-text);
  --bs-border-color: var(--ap-border-strong);
}
.nav-tabs {
  --bs-nav-tabs-border-color: var(--ap-border);
  --bs-nav-tabs-border-radius: var(--ap-radius-input);
  --bs-nav-tabs-link-hover-border-color: var(--ap-border);
  --bs-nav-tabs-link-active-color: var(--ap-text-strong);
  --bs-nav-tabs-link-active-bg: var(--ap-surface);
  --bs-nav-tabs-link-active-border-color: var(--ap-border) var(--ap-border) var(--ap-surface);
  --bs-nav-link-color: var(--ap-subtle-contrast);
  --bs-nav-link-hover-color: var(--ap-link);
}
.pagination {
  --bs-pagination-color: var(--ap-text);
  --bs-pagination-bg: var(--ap-surface);
  --bs-pagination-border-color: var(--ap-border);
  --bs-pagination-border-radius: var(--ap-radius-icon);
  --bs-pagination-hover-color: var(--ap-text-strong);
  --bs-pagination-hover-bg: var(--ap-row-hover);
  --bs-pagination-hover-border-color: var(--ap-border-strong);
  --bs-pagination-focus-color: var(--ap-text-strong);
  --bs-pagination-focus-bg: var(--ap-row-hover);
  --bs-pagination-focus-box-shadow: var(--ap-focus);
  --bs-pagination-active-color: #000000;
  --bs-pagination-active-bg: var(--ap-primary);
  --bs-pagination-active-border-color: var(--ap-primary);
  --bs-pagination-disabled-color: var(--ap-subtle-contrast);
  --bs-pagination-disabled-bg: var(--ap-surface);
  --bs-pagination-disabled-border-color: var(--ap-border);
}
.toast {
  --bs-toast-color: var(--ap-text);
  --bs-toast-bg: var(--ap-elevated);
  --bs-toast-border-color: var(--ap-border-strong);
  --bs-toast-border-radius: var(--ap-radius-modal);
  --bs-toast-box-shadow: var(--ap-menu-shadow);
  --bs-toast-header-color: var(--ap-text);
  --bs-toast-header-bg: var(--ap-elevated);
  --bs-toast-header-border-color: var(--ap-border);
}
.tooltip {
  --bs-tooltip-font-size: 12.5px;
  --bs-tooltip-color: #FFFFFF;
  --bs-tooltip-bg: var(--ap-tooltip-bg);
  --bs-tooltip-border-radius: 6px;
  --bs-tooltip-opacity: 1;
}

@media (max-width: 991.98px) {
  :root { --ap-gutter: 20px; }
}

/* Aplifit private area: shared visual system, independent of mock data.
 * Mescles F03: ESPECIFICACIÓ F1-2 §10.1-2; REGLAMENT 1.7, E1-5/E1-6. */
html { min-height: 100%; scroll-padding-top: 84px; }
body {
  margin: 0;
  min-height: 100vh;
  background: var(--ap-bg);
  color: var(--ap-text);
  font: 400 14px/1.5 var(--ap-font-family);
  font-feature-settings: "lnum" 1, "tnum" 1;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, input, select, textarea { font-family: inherit; }
a { text-decoration: none; }
a:hover { text-decoration: none; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--ap-primary); outline-offset: 3px; }
::selection { background: var(--ap-primary); color: #000; }
[hidden] { display: none !important; }
.bi { display: inline-block; flex-shrink: 0; line-height: 1; }
.bi::before { vertical-align: -.125em; }
h1, .h1 { font-size: 28px; line-height: 1.2; font-weight: 800; }
h2, .h2 { font-size: 17px; line-height: 1.35; font-weight: 700; }
h3, .h3 { font-size: 15px; line-height: 1.4; font-weight: 700; }
small, .small, .form-text, .invalid-feedback, .valid-feedback { font-size: 12.5px; }
.text-secondary { color: var(--ap-subtle-contrast) !important; }
.text-danger { color: var(--ap-danger-text) !important; }
.text-success { color: var(--ap-success-text) !important; }
.ap-eyebrow {
  display: block;
  margin-bottom: 8px;
  color: var(--ap-link);
  font-size: 11px;
  line-height: 1.5;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .14em;
}
.ap-page-title, .ap-page-heading h1, .ap-h1 {
  margin: 0;
  color: var(--ap-text-strong);
  font-size: 28px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.ap-page-title::after, .ap-page-heading h1::after, .ap-h1::after {
  content: "";
  display: block;
  width: 48px;
  height: 5px;
  margin-top: 10px;
  border-radius: 3px;
  background: var(--ap-primary);
}
.ap-numeric { font-feature-settings: "lnum" 1, "tnum" 1; font-variant-numeric: lining-nums tabular-nums; }
.ap-subtext { color: var(--ap-subtle-contrast); font-size: 12.5px; }
.btn {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 18px;
  border-radius: var(--ap-radius-pill);
  font-size: 13px;
  line-height: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  white-space: nowrap;
  transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s;
}
.btn .bi { font-size: 16px; }
.btn:focus-visible { box-shadow: var(--ap-focus); outline: none; }
.btn-sm { min-height: 32px; padding: 5px 13px; font-size: 13px; }
.btn-ap-soft {
  --bs-btn-color: #1A8DE5;
  --bs-btn-bg: rgba(0,128,226,.16);
  --bs-btn-border-color: transparent;
  --bs-btn-hover-color: #FFF;
  --bs-btn-hover-bg: var(--ap-primary-hover);
  --bs-btn-hover-border-color: transparent;
  --bs-btn-active-color: #FFF;
  --bs-btn-active-bg: var(--ap-primary-hover);
  --bs-btn-active-border-color: transparent;
  --bs-btn-disabled-color: #1A8DE5;
  --bs-btn-disabled-bg: rgba(0,128,226,.16);
  --bs-btn-disabled-border-color: transparent;
}

.btn-ap-soft:focus {
  background: var(--ap-primary-hover);
  color: #FFF;
  border-color: transparent;
}
.btn-lg { min-height: 46px; padding: 12px 24px; font-size: 13px; }
.btn .spinner-border { width: 14px; height: 14px; border-width: 2px; }
.btn:disabled, .btn.disabled { cursor: not-allowed; }
.btn-link { color: var(--ap-link); text-transform: none; letter-spacing: 0; }
.ap-iconbtn {
  display: inline-flex;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--ap-subtle-contrast);
  font-size: 16px;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .15s, color .15s, box-shadow .15s;
}
.ap-iconbtn .bi { font-size: 16px; line-height: 1; }
.ap-iconbtn:hover, .ap-iconbtn.ap-is-hover, .ap-iconbtn.is-hover {
  background: var(--ap-row-hover);
  color: var(--ap-text-strong);
}
.ap-iconbtn:focus-visible, .ap-iconbtn.ap-is-focus, .ap-iconbtn.is-focus {
  outline: none;
  border-color: var(--ap-primary);
  background: var(--ap-row-hover);
  color: var(--ap-text-strong);
  box-shadow: var(--ap-focus);
}
.ap-iconbtn:disabled { opacity: .45; cursor: not-allowed; }
.dropdown-menu { padding: 6px; box-shadow: var(--ap-menu-shadow); }
.dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  padding: 9px 12px;
  border-radius: 7px;
  font-size: 14px;
}
.dropdown-item .bi { font-size: 16px; }
.dropdown-item small { display: block; margin-top: 2px; color: var(--ap-subtle-contrast); font-size: 12.5px; font-weight: 400; }
.dropdown-divider { margin: 6px 2px; }
.card {
  --bs-card-bg: var(--ap-surface);
  --bs-card-color: var(--ap-text);
  --bs-card-border-color: var(--ap-border);
  --bs-card-border-radius: var(--ap-radius-card);
  --bs-card-inner-border-radius: 13px;
  padding: 24px;
  border-radius: 14px;
  box-shadow: var(--ap-card-shadow);
}
.card-body { padding: 0; }
.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 0 20px;
  border: 0;
  background: transparent;
}
.card-header h2 { margin: 0; }
.ap-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.ap-kpi-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; }
.ap-kpi { display: flex; flex-direction: row; align-items: center; gap: 16px; min-height: 100px; padding: 20px 24px; }
.ap-kpi-icon {
  display: inline-flex;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: var(--ap-primary-soft);
  color: var(--ap-chip-text);
  font-size: 20px;
}
.ap-kpi-value, .ap-kpi-number { display: block; margin: 0; color: var(--ap-text-strong); font-size: 26px; line-height: 1.25; font-weight: 800; letter-spacing: -.02em; }
.ap-kpi-value > span { font-size: 15px; font-weight: 600; }
.ap-kpi-label, .ap-kpi small { display: block; margin: 3px 0 0; color: var(--ap-subtle-contrast); font-size: 12.5px; line-height: 1.5; }
.ap-chip {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  gap: 5px;
  padding: 2px 10px;
  border-radius: 50rem;
  background: var(--ap-primary-soft);
  color: var(--ap-chip-text);
  font-size: 12.5px;
  line-height: 20px;
  font-weight: 600;
  white-space: nowrap;
}
.ap-chip-success { background: var(--bs-success-bg-subtle); color: var(--bs-success-text-emphasis); }
.ap-chip-danger { background: var(--bs-danger-bg-subtle); color: var(--bs-danger-text-emphasis); }
.ap-chip-muted { background: var(--ap-row-hover); color: var(--ap-subtle-contrast); border: 1px solid var(--ap-border); }
.ap-chip .bi { font-size: 12.5px; }
.ap-avatar {
  display: inline-flex;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  border-radius: 50rem;
  background: var(--ap-primary-hover);
  color: #FFF;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1;
}
.ap-avatar-lg, .ap-avatar--40 { width: 40px; height: 40px; flex-basis: 40px; font-size: 14px; }
.ap-avatar-xl, .ap-avatar--56 { width: 56px; height: 56px; flex-basis: 56px; font-size: 20px; }
.ap-segmented {
  display: inline-flex;
  min-height: 38px;
  align-items: stretch;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--ap-border);
  border-radius: 10px;
  background: var(--ap-table-head);
}
.ap-segmented > button, .ap-segmented > a {
  display: inline-flex;
  min-width: 32px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 4px 11px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--ap-subtle-contrast);
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}
.ap-segmented > .active, .ap-segmented > [aria-pressed="true"], .ap-segmented > [aria-selected="true"] {
  border-color: var(--ap-border-strong);
  background: var(--ap-surface);
  color: var(--ap-text-strong);
  box-shadow: var(--ap-shadow-sm);
}
.ap-segmented > button:hover, .ap-segmented > a:hover { color: var(--ap-text-strong); }
.ap-segmented .bi { font-size: 16px; }
.form-label, .ap-field > label { margin-bottom: 7px; color: var(--ap-text); font-size: 12.5px; font-weight: 700; }
.form-control, .form-select {
  min-height: 42px;
  padding: 10px 13px;
  border-color: var(--ap-border-strong);
  border-radius: 10px;
  background-color: var(--ap-form-bg);
  color: var(--ap-text);
  font-size: 14px;
  line-height: 20px;
}
[data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select { border-color: var(--ap-border); }
.form-select { padding-right: 36px; }
.form-control::placeholder { color: var(--ap-subtle-contrast); opacity: 1; }
.form-control:focus, .form-select:focus { border-color: var(--ap-primary); background-color: var(--ap-form-bg); color: var(--ap-text); box-shadow: var(--ap-focus); }
.form-control:disabled, .form-select:disabled { color: var(--ap-subtle-contrast); background-color: var(--ap-row-hover); }
.form-check-input { width: 16px; height: 16px; margin-top: 2px; border-color: var(--ap-border-strong); background-color: var(--ap-form-bg); cursor: pointer; }
.form-check-input:checked { background-color: var(--ap-primary-hover); border-color: var(--ap-primary-hover); }
.form-check-input:focus { border-color: var(--ap-primary); box-shadow: var(--ap-focus); }
.form-check-label { font-size: 14px; }
.form-switch .form-check-input { width: 34px; height: 19px; margin-top: 1px; }
.invalid-feedback { color: var(--ap-danger-text); }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--ap-danger); }
.ap-search { position: relative; }
.ap-search > .bi { position: absolute; top: 50%; left: 14px; z-index: 1; transform: translateY(-50%); color: var(--ap-subtle-contrast); font-size: 16px; }
.ap-search .form-control { padding-left: 41px; }
.ap-combobox { position: relative; min-width: 0; }
.ap-combobox .form-control { padding-right: 36px; }
.ap-combobox > .bi, .ap-combobox .ap-combobox-caret { position: absolute; top: 50%; right: 13px; transform: translateY(-50%); color: var(--ap-subtle-contrast); pointer-events: none; }
.ap-combobox-menu {
  position: absolute;
  z-index: 1060;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 250px;
  overflow-y: auto;
  margin: 0;
  padding: 6px;
  border: 1px solid var(--ap-border-strong);
  border-radius: 12px;
  background: var(--ap-elevated);
  color: var(--ap-text);
  box-shadow: var(--ap-menu-shadow);
  list-style: none;
}
.ap-combobox-menu [role="option"] { display: flex; align-items: center; min-height: 38px; padding: 8px 10px; border-radius: 7px; font-size: 14px; cursor: pointer; }
.ap-combobox-menu [role="option"]:hover, .ap-combobox-menu [role="option"].active, .ap-combobox-menu [aria-selected="true"] { background: var(--ap-primary-soft); color: var(--ap-text-strong); }
.ap-combobox-menu .ap-combobox-empty { padding: 10px; color: var(--ap-subtle-contrast); }
.ap-filterbar { display: flex; flex-direction: row; align-items: flex-end; gap: 16px; margin-bottom: 24px; padding: 20px 24px; }
.ap-filterbar .ap-field { flex: 1 1 0; min-width: 0; }
.ap-filterbar .ap-field:first-child { flex: 1.6 1 0; }
.ap-filterbar .ap-field > label { display: block; }
.ap-filterbar .ap-density-field { flex: 0 0 auto; margin-left: auto; }
.ap-table-card { padding: 0; overflow: visible; }
.ap-table-wrap { width: 100%; border-radius: 14px 14px 0 0; }
.ap-table { width: 100%; margin: 0; border-collapse: separate; border-spacing: 0; }
.ap-table > :not(caption) > * > * { padding: 10px 14px; border-bottom: 1px solid var(--ap-border); background-color: var(--ap-surface); box-shadow: none; vertical-align: middle; }
.ap-table thead th {
  position: sticky;
  z-index: 2;
  top: 64px;
  height: 42px;
  padding-block: 10px;
  background: var(--ap-table-head);
  color: var(--ap-subtle-contrast);
  font-size: 11px;
  line-height: 18px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  white-space: nowrap;
}
.ap-table thead th:first-child { border-top-left-radius: 14px; }
.ap-table thead th:last-child { border-top-right-radius: 14px; }
.ap-table th button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-transform: inherit;
  letter-spacing: inherit;
  cursor: pointer;
}
.ap-table th button:hover { color: var(--ap-text); }
.ap-table th .bi { font-size: 12px; }
.ap-table tbody tr { height: 56px; }
.ap-table tbody td { height: 56px; color: var(--ap-text); font-size: 14px; }
.ap-table tbody tr:hover > td, .ap-table tbody tr:focus-within > td { background-color: var(--ap-row-hover); }
.ap-table tbody tr.ap-selected > td, .ap-table tbody tr:has(input[name="pistes"]:checked) > td { background-color: var(--ap-primary-soft); }
.ap-table--compact tbody tr, .ap-table--compact tbody td { height: 44px; }
.ap-table--compact > tbody > tr > td { padding-block: 6px; }
.ap-table .ap-row-select { width: 48px; padding-left: 20px; padding-right: 8px; }
.ap-table .form-check-input { display: block; margin: 0; }
.ap-session-title { display: inline-block; color: var(--ap-text-strong); font-size: 14px; line-height: 20px; font-weight: 700; }
.ap-session-title:hover { color: var(--ap-link); }
.ap-session-category { margin-top: 4px; }
.ap-session-meta { display: none; }
.ap-table .ap-chip { min-height: 20px; padding: 0 8px; line-height: 20px; }
.ap-table--compact .ap-session-category { margin-top: 2px; }
.ap-table .ap-center-cell { color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-table .ap-numeric { text-align: right; white-space: nowrap; }
.ap-table .ap-actions-cell { width: 245px; padding-right: 20px; text-align: right; }
.ap-actions { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.ap-actions .ap-iconbtn { flex-basis: 32px; width: 32px; height: 32px; min-height: 32px; opacity: .7; }
tr:hover .ap-actions .ap-iconbtn, tr:focus-within .ap-actions .ap-iconbtn { opacity: 1; }
.ap-table-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 24px; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.pagination { display: flex; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
.pagination > li > a, .pagination > li > span {
  display: inline-flex;
  min-width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  padding: 4px 9px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--ap-subtle-contrast);
  font-size: 12.5px;
  font-weight: 600;
}
.pagination > li > a:hover { border-color: var(--ap-border); background: var(--ap-row-hover); color: var(--ap-text); }
.pagination > li.active > a { border-color: var(--ap-primary); background: var(--ap-primary); color: #000; }
.pagination > li.disabled > a { color: var(--ap-subtle-contrast); opacity: .5; pointer-events: none; }
.pagination > li > a:focus-visible { outline: none; box-shadow: var(--ap-focus); }
.modal-header { padding: 24px 24px 8px; border: 0; }
.modal-header .ap-iconbtn { margin-left: auto; }
.modal-title { color: var(--ap-text-strong); font-size: 18px; font-weight: 700; }
.modal-body { padding: 16px 24px 24px; }
.modal-footer { gap: 8px; padding: 16px 24px 24px; border-top: 0; }
.modal-footer > * { margin: 0; }
.ap-confirm-icon { display: inline-flex; width: 48px; height: 48px; align-items: center; justify-content: center; margin-bottom: 20px; border-radius: 12px; background: var(--bs-danger-bg-subtle); color: var(--ap-danger-text); font-size: 23px; }
.ap-toast-container { z-index: 1090; position: fixed; top: 80px !important; right: 24px; width: min(360px, calc(100% - 40px)); }
.toast { border-left: 3px solid var(--ap-primary); font-size: 14px; }
.toast.ap-toast-success { border-left-color: var(--ap-active); }
.toast.ap-toast-danger { border-left-color: var(--ap-danger); }
.toast.ap-toast-warning { border-left-color: var(--ap-warning); }
.toast-body { display: flex; align-items: center; gap: 12px; padding: 16px; }
.toast-body .bi { font-size: 19px; }
.tooltip-inner { padding: 7px 10px; font-weight: 600; }
.alert { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 16px; padding: 14px 16px; border-radius: 10px; font-size: 14px; }
.alert .bi { margin-top: 3px; font-size: 17px; }
.ap-bulkbar {
  position: fixed;
  z-index: 1040;
  bottom: max(24px, var(--ap-demo-clearance, 24px));
  left: calc(50% + 128px);
  display: flex;
  align-items: center;
  gap: 20px;
  max-width: calc(100vw - 300px);
  padding: 14px 20px;
  border: 1px solid #404040;
  border-radius: 14px;
  background: #262626;
  color: #FFF;
  box-shadow: var(--ap-shadow-lg);
  transform: translateX(-50%);
}
.ap-bulkbar .btn-outline-secondary { --bs-btn-color: #FFF; --bs-btn-border-color: #666; --bs-btn-hover-color: #FFF; --bs-btn-hover-bg: #404040; }
.ap-bulkbar .ap-iconbtn { color: #CBCBCB; }
.ap-bulkbar .ap-iconbtn:hover { background: #404040; color: #FFF; }
.ap-layout.ap-sidebar-collapsed .ap-bulkbar { left: calc(50% + 38px); }
.ap-empty { display: flex; min-height: 340px; flex-direction: column; align-items: center; justify-content: center; padding: 48px 24px; text-align: center; }
.ap-empty-icon { display: inline-flex; width: 64px; height: 64px; align-items: center; justify-content: center; margin-bottom: 20px; border-radius: 16px; background: var(--ap-primary-soft); color: var(--ap-chip-text); font-size: 28px; }
.ap-empty h2 { margin-bottom: 8px; font-size: 17px; }
.ap-empty p { max-width: 380px; margin-bottom: 24px; color: var(--ap-subtle-contrast); font-size: 14px; }
.ap-row-removing { opacity: 0; transform: translateX(8px); transition: opacity .18s, transform .18s; }
.ap-sidebar {
  --bs-offcanvas-width: 256px;
  --bs-offcanvas-bg: #000;
  z-index: 1045;
  display: flex;
  flex-direction: column;
  width: 256px;
  border-right: 1px solid #1C1C1D;
  background: linear-gradient(155deg, rgba(0,128,226,0) 65%, rgba(0,128,226,.14) 100%), #000 !important;
  color: #CBCBCB;
}
.ap-sidebar .offcanvas-body { display: flex; flex: 1 1 auto; flex-direction: column; padding: 0; overflow-y: auto; }
.ap-sidebar-head { display: flex; height: 80px; min-height: 80px; align-items: center; justify-content: space-between; gap: 12px; padding: 24px; }
.ap-sidebar-head img, .ap-sidebar-logo img { display: block; width: auto; height: 30px; }
.ap-sidebar .ap-iconbtn { color: #A5A5A5; }
.ap-sidebar .ap-iconbtn:hover, .ap-sidebar .ap-iconbtn:focus-visible { background: #262626; color: #FFF; }
.ap-nav { display: flex; flex-direction: column; gap: 24px; padding: 8px 16px 20px; }
.ap-nav-group { display: flex; flex-direction: column; gap: 4px; }
.ap-nav-group-title, .ap-nav-group > .ap-eyebrow { margin: 0 12px 7px; color: #A5A5A5; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.ap-nav-item {
  position: relative;
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  color: #CBCBCB;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
.ap-nav-item > .bi { width: 20px; font-size: 18px; text-align: center; }
.ap-nav-item:hover, .ap-nav-item:focus-visible { background: #141415; color: #FFF; }
.ap-nav-item.active, .ap-nav-item[aria-current="page"] { background: #1C1C1D; color: #FFF; }
.ap-nav-item.active::before, .ap-nav-item[aria-current="page"]::before { content: ""; position: absolute; top: 10px; bottom: 10px; left: 0; width: 3px; border-radius: 2px; background: var(--ap-primary); }
.ap-sidebar-bottom { margin-top: auto; padding: 16px; border-top: 1px solid #1C1C1D; }
.ap-user-card { display: flex; width: 100%; align-items: center; gap: 10px; padding: 12px 8px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: #FFF; text-align: left; }
.ap-user-card:hover { border-color: #2E2E30; background: #141415; }
.ap-user-card.active { border-color: #404040; background: #1C1C1D; box-shadow: inset 3px 0 #0080E2; }
.ap-user-card strong { display: block; overflow: hidden; font-size: 14px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.ap-user-card small { display: block; margin-top: 2px; color: #A5A5A5; font-size: 12.5px; }
.ap-user-card > .bi { margin-left: auto; color: #A5A5A5; font-size: 14px; }
.ap-languages { display: flex; align-items: center; gap: 4px; }
.ap-languages a, .ap-languages button { display: inline-flex; min-width: 30px; min-height: 27px; align-items: center; justify-content: center; padding: 3px 7px; border: 1px solid transparent; border-radius: 50rem; background: transparent; color: #A5A5A5; font-size: 12.5px; font-weight: 700; }
.ap-languages a:hover, .ap-languages button:hover { border-color: #404040; color: #FFF; }
.ap-languages .active, .ap-languages [aria-current="true"] { border-color: #404040; background: #1C1C1D; color: #FFF; }
.ap-sidebar .ap-languages { justify-content: center; flex-wrap: nowrap; margin-top: 14px; }
.ap-topbar {
  position: sticky;
  z-index: 1030;
  top: 0;
  display: flex;
  height: 64px;
  align-items: center;
  gap: 20px;
  padding: 0 32px;
  border-bottom: 1px solid #1C1C1D;
  background: #000;
}
.ap-topbar .breadcrumb { margin: 0; font-size: 12.5px; }
.ap-topbar .breadcrumb a { color: var(--ap-subtle-contrast); }
.ap-topbar .breadcrumb-item.active { color: var(--ap-text); font-weight: 600; }
.ap-topbar .breadcrumb-item + .breadcrumb-item::before { color: var(--ap-subtle-contrast); }
.ap-topbar-right { display: flex; align-items: center; gap: 16px; margin-left: auto; }
.ap-legacy-link { color: var(--ap-subtle-contrast); font-size: 12.5px; font-weight: 500; white-space: nowrap; }
.ap-legacy-link:hover { color: var(--ap-text); }
.ap-topbar .ap-combobox { width: 228px; }
.ap-topbar .form-control { min-height: 36px; height: 36px; padding-block: 7px; font-size: 12.5px; }
.ap-main { width: auto; padding: 32px; padding-bottom: 104px; }
.ap-layout .ap-main { max-width: 1504px; }
.ap-page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.ap-heading-actions { display: flex; align-items: center; gap: 12px; padding-bottom: 4px; }
.ap-page-description { margin-top: 12px; margin-bottom: 0; color: var(--ap-subtle-contrast); font-size: 14px; }
.ap-demo-bar {
  position: fixed;
  z-index: 1046;
  right: 16px;
  bottom: 16px;
}
.ap-demo-panel {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: calc(100vw - 32px);
  padding: 10px 12px;
  border: 1px solid #404040;
  border-radius: 10px;
  background: #262626;
  color: #CBCBCB;
  box-shadow: 0 4px 18px rgba(0,0,0,.25);
}
.ap-demo-bar .ap-demo-toggle { display: none; width: 34px; height: 34px; min-height: 34px; border: 1px solid #404040; background: #262626; color: #FFF; }
.ap-demo-control { display: flex; align-items: center; gap: 7px; font-size: 12.5px; }
.ap-demo-control > span, .ap-demo-control > label { color: #CBCBCB; font-weight: 600; }
.ap-demo-control .ap-segmented { min-height: 28px; padding: 2px; border-color: #404040; border-radius: 7px; background: #1C1C1D; }
.ap-demo-control .ap-segmented > button { min-width: 26px; padding: 1px 7px; border-radius: 5px; color: #CBCBCB; font-size: 12.5px; }
.ap-demo-control .ap-segmented > [aria-pressed="true"] { border-color: #565656; background: #404040; color: #FFF; box-shadow: none; }
.ap-demo-control select { min-height: 28px; padding: 2px 24px 2px 8px; border: 1px solid #565656; border-radius: 6px; background-color: #1C1C1D; color: #FFF; font-size: 12.5px; }
.ap-demo-bar .ap-iconbtn:not(.ap-demo-toggle) { width: 28px; height: 28px; min-height: 28px; flex-basis: 28px; color: #CBCBCB; }
.ap-demo-bar .ap-iconbtn:hover { background: #404040; color: #FFF; }
.ap-login { position: relative; display: flex; min-height: 100vh; min-height: 100svh; align-items: center; justify-content: center; overflow: hidden; padding: 96px 24px 112px; background: #000; color: #FFF; }
.ap-login-photo { position: absolute; inset: -12px; width: calc(100% + 24px); height: calc(100% + 24px); object-fit: cover; object-position: center 35%; background: url("/assets/v2/img/login-sala.4290b5ca.jpg") center 35% / cover no-repeat; filter: blur(3px); transform: scale(1.04); }
.ap-login-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.48) 0%, rgba(0,0,0,.22) 38%, rgba(0,0,0,.78) 76%, rgba(0,0,0,.94) 100%); }
.ap-login-overlay::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 90% 45%, rgba(0,128,226,.22), transparent 58%); }
.ap-login-panel { position: relative; z-index: 1; width: 420px; max-width: 100%; }
.ap-login-brand { margin-bottom: 40px; text-align: center; }
.ap-login-brand img { display: block; width: 170px; height: auto; margin: 0 auto 24px; }
.ap-login-brand h1, .ap-login-brand .ap-login-tagline { margin: 0 0 8px; color: #FFF; font-size: 16px; line-height: 22px; font-weight: 600; }
.ap-login-brand p { margin: 0; color: #CBCBCB; font-size: 14px; }
.ap-login-fields { overflow: hidden; border: 1px solid #2E2E30; border-radius: 16px; background: rgba(28,28,29,.92); }
.ap-login-field { display: flex; min-height: 52px; align-items: center; gap: 10px; padding: 0 12px 0 16px; }
.ap-login-field + .ap-login-field { border-top: 1px solid #2E2E30; }
.ap-login-field > .bi { color: #CBCBCB; font-size: 17px; }
.ap-login-field .form-control { flex: 1; width: 0; height: 52px; min-height: 52px; padding: 0; border: 0; border-radius: 0; background: transparent; color: #FFF; font-size: 16px; box-shadow: none; }
.ap-login-field .form-control::placeholder { color: #A5A5A5; }
.ap-login-field:focus-within { background: rgba(0,128,226,.08); box-shadow: inset 3px 0 0 var(--ap-primary); }
.ap-login-field .ap-iconbtn { color: #CBCBCB; }
.ap-login-field .ap-iconbtn:hover { background: #404040; color: #FFF; }
.ap-login-forgot { display: flex; min-height: 44px; align-items: center; justify-content: flex-end; margin: 4px 0 16px; color: #56AFF2; font-size: 14px; font-weight: 600; }
.ap-login-forgot:hover { color: #8EC9F8; }
.ap-login-actions { display: flex; flex-direction: column; gap: 12px; }
.ap-login-cta.btn { width: 100%; min-height: 52px; font-size: 15px; font-weight: 800; letter-spacing: .08em; }
.ap-login .btn-primary { --bs-btn-color: #FFF; --bs-btn-bg: #0276CF; --bs-btn-border-color: #0276CF; --bs-btn-hover-bg: #0269B8; --bs-btn-hover-border-color: #0269B8; --bs-btn-disabled-color: #FFF; --bs-btn-disabled-bg: #0276CF; --bs-btn-disabled-border-color: #0276CF; }
.ap-login .btn-outline-secondary { --bs-btn-color: #FFF; --bs-btn-border-color: #404040; --bs-btn-hover-color: #FFF; --bs-btn-hover-bg: #262626; --bs-btn-hover-border-color: #666; border-width: 1.5px; }
.ap-login-languages { position: absolute; z-index: 1; top: 28px; right: 32px; display: flex; gap: 4px; }
.ap-login-languages a { display: inline-flex; min-width: 30px; min-height: 28px; align-items: center; justify-content: center; padding: 3px 7px; border: 1px solid transparent; border-radius: 50rem; color: #CBCBCB; font-size: 12.5px; font-weight: 700; }
.ap-login-languages a.active, .ap-login-languages a:hover { border-color: #404040; background: #1C1C1D; color: #FFF; }
.ap-login-footer { position: absolute; z-index: 1; right: 24px; bottom: 34px; left: 24px; display: flex; justify-content: center; gap: 20px; color: #A5A5A5; font-size: 12.5px; text-align: center; }
.ap-login-footer a { color: #CBCBCB; }
.ap-login .alert { color: #FFB3BA; border-color: #67313A; background: rgba(58,28,33,.94); }
.ap-login-error-sim { position: absolute; z-index: 1; left: 24px; bottom: 24px; min-height: 32px; border: 1px solid #404040; border-radius: 8px; background: #262626; color: #CBCBCB; font-size: 12.5px; }
.ap-component-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 24px; }
.ap-component-section { min-width: 0; }
.ap-component-section > h2 { margin-bottom: 20px; }
.ap-component-section.ap-span-2 { grid-column: 1 / -1; }
.ap-component-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 16px; }
.ap-component-row:last-child { margin-bottom: 0; }
.ap-palette { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ap-swatch { overflow: hidden; border: 1px solid var(--ap-border); border-radius: 10px; }
.ap-swatch-color { height: 56px; border-bottom: 1px solid var(--ap-border); }
.ap-swatch-label { display: flex; flex-direction: column; gap: 3px; padding: 10px; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-swatch-label strong { color: var(--ap-text); font-weight: 600; }
.ap-static-modal { position: relative; inset: auto; z-index: auto; display: block; overflow: visible; }
.ap-static-modal .modal-dialog { max-width: 480px; margin: 0 auto; }
.ap-static-modal .modal-content { background: var(--ap-elevated); border-color: var(--ap-border-strong); box-shadow: none; }
.ap-static-dropdown { position: static !important; display: block; width: 280px; transform: none !important; }
.ap-preview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ap-preview-card { display: flex; min-height: 190px; flex-direction: column; padding: 24px; border: 1px solid var(--ap-border); border-radius: 14px; background: var(--ap-surface); color: var(--ap-text); box-shadow: var(--ap-card-shadow); transition: border-color .15s, transform .15s; }
.ap-preview-card:hover { transform: translateY(-3px); border-color: var(--ap-primary); color: var(--ap-text); }
.ap-preview-card > .bi { align-self: flex-start; margin-bottom: 24px; color: var(--ap-chip-text); font-size: 24px; }
.ap-preview-card h2 { margin-bottom: 8px; }
.ap-preview-card p { margin: 0; color: var(--ap-subtle-contrast); }
.ap-preview-card .ap-preview-link { display: flex; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 20px; color: var(--ap-link); font-weight: 600; }
.ap-comparison-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.ap-comparison-grid figure { min-width: 0; margin: 0; overflow: hidden; border: 1px solid var(--ap-border); border-radius: 14px; background: var(--ap-surface); }
.ap-comparison-grid img { display: block; width: 100%; aspect-ratio: 16 / 10; border-bottom: 1px solid var(--ap-border); background: #000; object-fit: contain; }
.ap-comparison-grid figcaption { padding: 16px 20px; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-decision-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 32px; margin: 0; padding-left: 22px; }
.ap-section { margin-top: 40px; }
.ap-section > h2 { margin-bottom: 20px; }

/* Markup shared by the mock pages and their generated layout. */
.ap-muted, .ap-help { color: var(--ap-subtle-contrast); }
.ap-help { font-size: 12.5px; line-height: 1.5; }
.ap-danger-text { color: var(--ap-danger-text); }
.ap-skip-link { position: fixed; z-index: 1100; top: 12px; left: 12px; padding: 10px 16px; border-radius: 8px; background: var(--ap-primary-hover); color: #FFF; font-weight: 700; }
.ap-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.ap-chip--success { background: var(--bs-success-bg-subtle); color: var(--bs-success-text-emphasis); }
.ap-chip--danger { background: var(--bs-danger-bg-subtle); color: var(--bs-danger-text-emphasis); }
.ap-chip--muted, .ap-chip--neutral { border: 1px solid var(--ap-border); background: var(--ap-row-hover); color: var(--ap-subtle-contrast); }
.ap-component-section--wide { grid-column: 1 / -1; }
.ap-component-example { display: flex; min-width: 76px; flex-direction: column; align-items: center; gap: 12px; padding: 8px; }
.ap-type-specimen { display: flex; flex-direction: column; gap: 16px; margin-top: 24px; }
.ap-type-specimen > * { margin-bottom: 0; }
.ap-type-specimen .ap-page-title { margin-bottom: 8px; }
.ap-swatch > strong, .ap-swatch > code, .ap-swatch > span { display: block; padding-inline: 12px; font-size: 12.5px; }
.ap-swatch > strong { margin-top: 12px; color: var(--ap-text); font-weight: 700; }
.ap-swatch > code { margin-top: 4px; color: var(--ap-subtle-contrast); font-family: inherit; }
.ap-swatch > span { margin-top: 5px; margin-bottom: 12px; color: var(--ap-subtle-contrast); line-height: 1.5; }
.ap-forced-hover { background: var(--ap-row-hover); color: var(--ap-text-strong); }
.ap-forced-focus { border-color: var(--ap-primary); background: var(--ap-row-hover); color: var(--ap-text-strong); box-shadow: var(--ap-focus); }
.ap-avatar--sm { width: 32px; height: 32px; flex-basis: 32px; }
.ap-component-row > .ap-avatar:not(.ap-avatar--sm):not(.ap-avatar--lg) { width: 40px; height: 40px; flex-basis: 40px; font-size: 14px; }
.ap-avatar--lg { width: 56px; height: 56px; flex-basis: 56px; font-size: 20px; }
.ap-static-toast { width: 100%; }
.ap-toast--success { border-left-color: var(--ap-active); }
.ap-toast--success .bi:first-child { color: var(--ap-success-text); }
.ap-empty h3 { font-size: 17px; }
.ap-session-name { display: block; margin-bottom: 4px; color: var(--ap-text-strong); font-weight: 700; }
.ap-session-name:hover { color: var(--ap-link); }
.ap-table-actions { white-space: nowrap; }
.ap-table-actions .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; margin-left: 3px; }
.ap-sidebar-brand { display: flex; flex: 0 0 80px; align-items: center; justify-content: space-between; gap: 12px; padding: 24px; }
.ap-sidebar-brand img { display: block; width: auto; max-width: 152px; height: 30px; }
.ap-sidebar-brand .ap-sidebar-close { display: none; }
.ap-sidebar > .ap-nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #404040 transparent; }
.ap-nav-group-label { margin: 0 12px 7px !important; color: #A5A5A5 !important; }
.ap-user-info { min-width: 0; }
.ap-user-info > span { display: block; margin-top: 2px; color: #A5A5A5; font-size: 12.5px; }
.ap-topbar-actions { display: flex; align-items: center; gap: 16px; margin-left: auto; }
.ap-old-view { display: inline-flex; align-items: center; gap: 7px; color: var(--ap-subtle-contrast); font-size: 12.5px; font-weight: 500; white-space: nowrap; }
.ap-old-view:hover { color: var(--ap-text); }
.ap-table-intro { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 24px; border-bottom: 1px solid var(--ap-border); }
.ap-table-intro h2 { display: flex; align-items: center; gap: 12px; margin: 0; }
.ap-table-hint { color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-table-intro + .ap-table th, .ap-session-play-legend + .ap-table th { border-radius: 0 !important; }
.ap-table > tbody > tr > td { padding-block: 7px; }
.ap-table--compact > tbody > tr > td { padding-block: 3px; }
.ap-session-cell > .ap-chip { display: flex; width: fit-content; margin-top: 2px; }
.ap-table--compact .ap-session-cell > .ap-chip { min-height: 18px; margin-top: 0; line-height: 18px; }
.ap-table .ap-centre-cell { color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-actions-heading { text-align: right; padding-right: 24px !important; }
.ap-table th.ap-numeric button { justify-content: flex-end; }
.ap-table-footer p { margin: 0; }
.ap-density-field > .form-label { display: block; }
.ap-combobox .ap-search > .ap-combobox-caret { right: 13px; left: auto; font-size: 12.5px; }
.ap-combobox .ap-search:has(.ap-combobox-caret) .form-control { padding-left: 13px; }
.ap-combobox-option--active, .ap-combobox-menu .is-active { background: var(--ap-primary-soft); color: var(--ap-text-strong); }
.ap-demo-panel > div { display: flex; align-items: center; gap: 7px; }
.ap-demo-panel > div > span { color: #CBCBCB; font-size: 12.5px; }
.ap-demo-bar button.ap-demo-control { display: inline-flex; min-height: 30px; align-items: center; justify-content: center; padding: 4px 8px; border: 1px solid #565656; border-radius: 6px; background: #1C1C1D; color: #FFF; font-size: 12.5px; font-weight: 600; }
.ap-demo-bar button.ap-demo-control:hover { border-color: #8C8C8C; background: #404040; }
.ap-demo-home { display: inline-flex; width: 34px; height: 34px; align-items: center; justify-content: center; border-radius: 8px; color: #CBCBCB; }
.ap-demo-home:hover { background: #404040; color: #FFF; }
.ap-overview-hero { position: relative; margin-bottom: 40px; padding: 32px 0 24px; }
.ap-overview-hero .ap-h1 { max-width: 700px; }
.ap-overview-lead { margin: 28px 0 16px; color: var(--ap-text-strong); font-size: clamp(30px, 3vw, 44px); line-height: 1.15; font-weight: 800; letter-spacing: -.035em; }
.ap-overview-settings { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 24px; }
.ap-overview-settings > div { display: flex; flex-direction: column; gap: 8px; }
.ap-overview-settings .form-label { margin: 0; }
.ap-overview-section { margin-top: 40px; }
.ap-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.ap-section-heading h2 { margin: 0; }
.ap-page-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ap-page-link { min-height: 224px; color: var(--ap-text); transition: border-color .15s, transform .15s; }
.ap-page-link > .ap-kpi-icon { margin-bottom: 20px; }
.ap-page-link h3 { margin-bottom: 8px; font-size: 17px; }
.ap-page-link p { margin-bottom: 20px; color: var(--ap-subtle-contrast); }
.ap-page-link:hover { border-color: var(--ap-primary); color: var(--ap-text); transform: translateY(-3px); }
.ap-page-link-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; color: var(--ap-link); font-size: 12.5px; font-weight: 700; }
.ap-comparison-grid { grid-template-columns: repeat(5, minmax(240px, 1fr)); gap: 16px; overflow-x: auto; padding-bottom: 12px; scrollbar-color: var(--ap-border-strong) transparent; scrollbar-width: thin; }
.ap-reference { padding: 0; }
.ap-reference a { display: block; }
.ap-reference figcaption { display: flex; flex-direction: column; gap: 6px; padding: 16px; font-size: 12.5px; }
.ap-reference figcaption strong { color: var(--ap-text); font-size: 14px; }
.ap-reference--app img { object-position: top; }
.ap-decisions { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 40px; padding: 28px; }
.ap-decisions h2 { margin-bottom: 12px; }
.ap-decisions ol { display: flex; flex-direction: column; gap: 12px; margin: 0; padding-left: 22px; }
.ap-player-preview { text-align: center; }
.ap-player-preview > strong { display: block; margin-bottom: 8px; color: var(--ap-text-strong); font-size: 32px; font-weight: 800; }
.ap-player-preview > p:not(.ap-eyebrow) { color: var(--ap-subtle-contrast); }
.ap-intensity-preview { display: flex; height: 120px; align-items: flex-end; gap: 5px; margin: 24px 0; padding: 12px; border: 1px solid var(--ap-border); border-radius: 12px; background: var(--ap-surface); }
.ap-intensity-preview > span { flex: 1; border-radius: 3px 3px 0 0; background: var(--ap-primary); }
.ap-intensity-preview > span:nth-child(3n) { background: var(--ap-primary-active); }
.ap-playlist-preview { display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0; list-style: none; }
.ap-playlist-preview li { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--ap-border); }

@media (min-width: 992px) {
  .ap-sidebar.offcanvas-lg { position: fixed; top: 0; bottom: 0; left: 0; width: 256px; height: 100vh !important; height: 100dvh !important; visibility: visible; }
  .ap-sidebar.offcanvas-lg .offcanvas-body { background: transparent !important; }
  .ap-mobile-menu { display: none; }
  .ap-layout .ap-main, .ap-layout .ap-topbar { margin-left: 256px; }
  .ap-sidebar-collapsed .ap-sidebar { width: 76px; }
  .ap-layout.ap-sidebar-collapsed .ap-main, .ap-layout.ap-sidebar-collapsed .ap-topbar { margin-left: 76px; }
  .ap-sidebar-collapsed .ap-sidebar-head { height: 80px; padding: 20px 21px; }
  .ap-sidebar-collapsed .ap-sidebar-head img { display: none; }
  .ap-sidebar-collapsed .ap-sidebar-brand { flex-basis: 80px; padding: 20px 21px; }
  .ap-sidebar-collapsed .ap-sidebar-brand > a { display: none; }
  .ap-sidebar-collapsed .ap-nav { gap: 14px; padding-inline: 12px; }
  .ap-sidebar-collapsed .ap-nav-group { gap: 6px; }
  .ap-sidebar-collapsed .ap-nav-group-title, .ap-sidebar-collapsed .ap-nav-group > .ap-eyebrow, .ap-sidebar-collapsed .ap-nav-label { display: none; }
  .ap-sidebar-collapsed .ap-nav-item { justify-content: center; padding: 11px 0; }
  .ap-sidebar-collapsed .ap-nav-item > .bi { width: auto; }
  .ap-sidebar-collapsed .ap-sidebar-bottom { padding: 12px; }
  .ap-sidebar-collapsed .ap-user-card { justify-content: center; padding: 8px 0; }
  .ap-sidebar-collapsed .ap-user-card > :not(.ap-avatar) { display: none; }
  .ap-sidebar-collapsed .ap-languages { display: none; }
}
@media (min-width: 1760px) {
  .ap-layout .ap-main { margin-right: auto; margin-left: calc(256px + (100vw - 256px - 1504px) / 2); }
  .ap-layout.ap-sidebar-collapsed .ap-main { margin-left: calc(76px + (100vw - 76px - 1504px) / 2); }
}
@media (max-width: 1439.98px) {
  .ap-table > :not(caption) > * > * { padding-inline: 10px; }
  .ap-table .ap-actions-cell { width: 226px; padding-right: 16px; }
  .ap-actions { gap: 3px; }
}
@media (max-width: 1279.98px) {
  .ap-filterbar { gap: 12px; padding: 20px; }
  .ap-filterbar .ap-field:first-child { flex: 1.25 1 0; }
  .ap-filterbar .ap-segmented > button { padding-inline: 8px; }
  .ap-density-label { display: none; }
  .ap-table .ap-actions-cell { width: 214px; }
}
@media (max-width: 991.98px) {
  .ap-demo-bar .ap-demo-toggle { display: inline-flex; }
  .ap-demo-panel { position: absolute; right: 0; bottom: 56px; display: none; flex-direction: column; align-items: stretch; gap: 12px; width: max-content; }
  .ap-demo-open .ap-demo-panel { display: flex; }
  .ap-demo-panel > div { justify-content: space-between; gap: 16px; }
  .ap-sidebar { width: 256px; }
  .ap-sidebar-brand .ap-sidebar-close { display: inline-flex; }
  .ap-sidebar-brand .ap-sidebar-collapse { display: none; }
  .ap-sidebar-brand { flex-basis: 80px; padding: 24px; }
  .ap-sidebar .offcanvas-header { padding: 0; }
  .ap-sidebar-head { width: 100%; }
  .ap-sidebar .offcanvas-body { padding: 0; }
  .ap-topbar { gap: 12px; padding-inline: 20px; }
  .ap-topbar .ap-combobox { display: none; }
  .ap-topbar-right { gap: 10px; }
  .ap-main{ padding: 28px 20px 108px; }
  .ap-page-heading { margin-bottom: 24px; }
  .ap-kpi { gap: 12px; padding: 18px; }
  .ap-kpi-value { font-size: 23px; }
  .ap-filterbar { flex-wrap: wrap; align-items: flex-end; gap: 16px; padding: 20px; }
  .ap-filterbar .ap-field, .ap-filterbar .ap-field:first-child { flex: 1 1 calc(50% - 8px); }
  .ap-filterbar .ap-density-field { flex: 0 1 auto; margin-left: 0; }
  .ap-density-label { display: inline; }
  .ap-table-card { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .ap-table-wrap { border-radius: 0; }
  .ap-table, .ap-table tbody { display: block; }
  .ap-table thead { display: none; }
  .ap-table tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .ap-table tbody tr {
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto;
    align-content: start;
    gap: 12px;
    height: auto;
    padding: 20px;
    border: 1px solid var(--ap-border);
    border-radius: 14px;
    background: var(--ap-surface);
    box-shadow: var(--ap-card-shadow);
  }
  .ap-table tbody tr:hover, .ap-table tbody tr:focus-within { border-color: var(--ap-border-strong); background: var(--ap-surface); }
  .ap-table tbody td { height: auto; padding: 0; border: 0; background: transparent !important; }
  .ap-table tbody tr.ap-selected, .ap-table tbody tr:has(input[name="pistes"]:checked) { border-color: var(--ap-primary); }
  .ap-table tbody .ap-row-select { position: absolute; top: 21px; right: 20px; display: block; width: 16px; height: 16px; padding: 0; }
  .ap-table tbody .ap-title-cell { grid-column: 1 / -1; padding-right: 26px; }
  .ap-table tbody .ap-session-cell, .ap-table tbody td[data-label="Sessió"] { grid-column: 1 / -1; padding-right: 26px; }
  .ap-table tbody .ap-centre-cell, .ap-table tbody td[data-label="Pistes"], .ap-table tbody td[data-label="Reproduccions"] { display: none; }
  .ap-table tbody .ap-center-cell { grid-column: 1 / -1; }
  .ap-table tbody .ap-tracks-cell, .ap-table tbody .ap-plays-cell { display: none; }
  .ap-table tbody .ap-duration-cell { grid-column: 1 / -1; color: var(--ap-subtle-contrast); text-align: left; }
  .ap-table tbody .ap-session-duration { display: none; }
  .ap-table tbody .ap-session-meta { display: inline; white-space: normal; font-size: 12.5px; }
  .ap-table tbody .ap-actions-cell { grid-column: 1 / -1; width: auto; padding-top: 4px; }
  .ap-table tbody .ap-table-actions { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; padding-top: 4px; }
  .ap-table tbody td[data-label="Durada"] { grid-column: 1 / -1; color: var(--ap-subtle-contrast); text-align: left !important; }
  .ap-table tbody td[data-label="Durada"]:not(.ap-duration-cell)::before { content: "Durada · "; }
  .ap-actions { justify-content: flex-end; gap: 8px; }
  .ap-actions > .ap-edit-action { margin-left: auto; }
  .ap-actions > .ap-playlist-action { display: none; }
  .ap-actions .ap-iconbtn { opacity: 1; }
  .ap-table--compact tbody tr { padding: 16px; }
  .ap-table--compact tbody .ap-row-select { top: 17px; right: 16px; }
  .ap-table .ap-session-title { font-size: 15px; }
  .ap-table-footer { padding: 20px 0; }
  .ap-empty { border: 1px solid var(--ap-border); border-radius: 14px; background: var(--ap-surface); }
  .ap-bulkbar, .ap-layout.ap-sidebar-collapsed .ap-bulkbar { left: 50%; max-width: calc(100vw - 40px); bottom: max(88px, var(--ap-demo-clearance, 88px)); }
  .ap-table-intro { padding: 0 0 18px; border: 0; }
  .ap-table-hint { display: none; }
  .ap-component-grid { grid-template-columns: 1fr; }
  .ap-component-section.ap-span-2 { grid-column: auto; }
  .ap-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .ap-main{ padding-top: 24px; }
  .ap-page-heading { align-items: flex-start; flex-direction: column; gap: 20px; }
  .ap-page-header { align-items: flex-start; flex-direction: column; gap: 20px; }
  .ap-heading-actions { width: 100%; gap: 8px; padding-bottom: 0; }
  .ap-heading-actions > .btn-primary { flex: 1; }
  .ap-heading-actions .btn { padding-inline: 13px; }
  .ap-page-title, .ap-page-heading h1 { font-size: 26px; }
  .ap-kpi-grid { grid-template-columns: 1fr; gap: 8px; margin-bottom: 20px; }
  .ap-kpi { min-height: 74px; padding: 14px 18px; }
  .ap-kpi-icon { width: 36px; height: 36px; flex-basis: 36px; font-size: 18px; }
  .ap-kpi-value { font-size: 22px; }
  .ap-kpi-label { margin-top: 0; }
  .ap-filterbar { gap: 14px; padding: 18px; margin-bottom: 20px; }
  .ap-filterbar .ap-field, .ap-filterbar .ap-field:first-child { flex-basis: 100%; }
  .ap-filterbar .ap-density-field { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; }
  .ap-filterbar .ap-density-field > label { margin: 0; }
  .ap-table tbody { grid-template-columns: 1fr; gap: 12px; }
  .ap-table-footer { align-items: center; flex-direction: column; gap: 14px; }
  .ap-topbar .ap-legacy-link { display: none; }
  .ap-topbar .ap-old-view{ display: none; }
  .ap-topbar .breadcrumb { font-size: 12.5px; }
  .ap-topbar .breadcrumb-item:first-child { display: none; }
  .ap-topbar .breadcrumb-item + .breadcrumb-item::before { content: none; }
  .ap-bulkbar { width: calc(100vw - 40px); flex-wrap: wrap; justify-content: space-between; gap: 12px; padding: 14px 16px; }
  .ap-bulkbar > span, .ap-bulkbar .ap-bulk-count { flex-basis: 100%; }
  .ap-bulkbar .btn { min-height: 32px; padding-block: 5px; }
  .ap-login { padding-top: 108px; padding-bottom: 136px; align-items: flex-start; }
  .ap-login-brand { margin-bottom: 48px; }
  .ap-login-brand img { margin-bottom: 20px; }
  .ap-login-languages { top: 24px; right: 20px; }
  .ap-login-footer { bottom: 74px; }
  .ap-login-error-sim { bottom: 24px; left: 24px; }
  .ap-toast-container { top: 80px !important; right: 20px; }
  .ap-preview-grid, .ap-comparison-grid, .ap-decision-list { grid-template-columns: 1fr; }
  .ap-comparison-grid { grid-template-columns: repeat(5, minmax(280px, 1fr)); }
  .ap-page-grid { grid-template-columns: 1fr; }
  .ap-overview-hero { padding-top: 12px; }
  .ap-overview-hero .ap-h1 { font-size: 26px; }
  .ap-overview-lead { font-size: 34px; }
  .ap-overview-settings { gap: 20px; }
  .ap-overview-settings > div { width: 100%; }
  .ap-overview-settings .ap-segmented { align-self: flex-start; }
  .ap-decisions { grid-template-columns: 1fr; gap: 24px; padding: 24px; }
  .ap-section-heading { align-items: flex-start; }
  .ap-section-heading > .ap-chip { display: none; }
  .ap-table-intro h2 { flex-wrap: wrap; gap: 8px; }
  .ap-login-footer { flex-wrap: wrap; gap: 8px 16px; }
  .ap-preview-card { min-height: 170px; }
  .ap-palette { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .card { padding: 20px; }
  .ap-table-card { padding: 0; }
  .ap-component-row { gap: 10px; }
  .modal-dialog { margin: 20px; }
  .modal-header { padding: 20px 20px 8px; }
  .modal-body { padding: 16px 20px 20px; }
  .modal-footer { padding: 12px 20px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Round 2: layouts composed from the approved cards, tables and controls. */
.ap-form-card { width: 100%; max-width: 760px; }
.ap-form-section + .ap-form-section { margin-top: 28px; padding-top: 28px; border-top: 1px solid var(--ap-border); }
.ap-form-section h2 { margin-bottom: 20px; }
.ap-form-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--ap-border); }
.ap-option-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ap-option { display: flex; align-items: flex-start; gap: 12px; padding: 14px; border: 1px solid var(--ap-border); border-radius: 10px; background: var(--ap-elevated); cursor: pointer; }
.ap-option:has(input:checked) { border-color: var(--ap-primary); background: var(--ap-primary-soft); }
.ap-option .form-check-input { flex: 0 0 16px; margin: 3px 0 0; }
.ap-option strong, .ap-option .ap-help { display: block; }
.ap-option strong { font-size: 14px; font-weight: 700; }
.ap-option .ap-help { margin-top: 3px; }
.ap-form-card fieldset legend { float: none; width: auto; margin-bottom: 12px; }
.ap-option, .ap-option > span { min-width: 0; }
.ap-create-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); align-items: start; gap: 24px; }
.ap-next-steps { display: flex; flex-direction: column; gap: 24px; padding: 0; margin: 24px 0 0; list-style: none; }
.ap-next-steps li { display: flex; align-items: flex-start; gap: 14px; }
.ap-next-steps strong { display: block; margin-bottom: 4px; font-weight: 700; }
.ap-step-number { display: inline-flex; flex: 0 0 32px; height: 32px; justify-content: center; align-items: center; border-radius: 8px; background: var(--ap-primary-soft); color: var(--ap-chip-text); font-weight: 700; }
.ap-spotify-mark { color: #1DB954; font-size: 20px; }
.ap-spotify-panel { margin-top: 20px; padding: 20px; border: 1px solid var(--ap-border); border-radius: 12px; background: var(--ap-elevated); }
.ap-tracks-preview { margin-top: 20px; font-size: 14px; }
.ap-tracks-preview > :not(caption) > * > * { padding: 12px 8px; background: transparent; }
.ap-tracks-preview th { color: var(--ap-secondary); font-size: 12.5px; }
.ap-tutorial-video { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; aspect-ratio: 16 / 9; border: 1px solid var(--ap-border); border-radius: 10px; background: #000; color: var(--ap-secondary); }
.ap-tutorial-video > .bi { font-size: 44px; color: var(--ap-link); }
.ap-user-identity { display: flex; align-items: center; gap: 12px; }
.ap-user-details { min-width: 0; }
.ap-user-details strong { display: block; font-size: 14px; font-weight: 700; }
.ap-user-details span { display: block; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-users-table .ap-actions-cell { width: 124px; }
.ap-users-table td { overflow-wrap: anywhere; }
.activacion { display: inline-flex; align-items: center; gap: 8px; padding: 6px 0; }
.activacion .form-switch { min-height: 19px; padding: 0; margin: 0; }
.activacion .form-check-input { display: block; margin: 0; pointer-events: none; }
a.activacion[aria-checked="true"] .form-check.form-switch .form-check-input {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
  background-color: var(--ap-primary-hover);
  border-color: var(--ap-primary-hover);
  background-position: right center;
}
.ap-groups-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ap-group-card { display: flex; min-height: 215px; }
.ap-group-card h2, .ap-group-card h3 { font-size: 15px; font-weight: 700; }
.ap-group-description { min-height: 40px; color: var(--ap-secondary); font-size: 13px; }
.ap-group-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ap-group-card footer, .ap-group-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 20px; }
.ap-group-card .ap-actions { margin-left: auto; }
.ap-group-card .btn-ap-soft, .ap-spotify-panel .btn-ap-soft { --bs-btn-color: var(--ap-chip-text); --bs-btn-disabled-color: var(--ap-chip-text); }
.ap-download-name { display: flex; align-items: flex-start; gap: 10px; }
.ap-download-name strong { display: block; font-size: 14px; font-weight: 700; }
.ap-download-languages { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.ap-download-languages.mt-2 { margin-top: 2px !important; }
.ap-download-languages a:hover { color: #FFF; background: var(--ap-primary-active); }
.ap-download-url { display: inline-flex; align-items: center; gap: 8px; max-width: 280px; }
.ap-download-url span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ap-download-row .ap-actions-cell { width: 104px; }
.ap-download-details > td { padding: 24px !important; background: var(--ap-elevated) !important; }
.ap-download-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ap-download-language { min-width: 0; padding: 14px; border: 1px solid var(--ap-border); border-radius: 10px; background: var(--ap-surface); }
.ap-download-language strong { display: block; margin-bottom: 6px; }
.ap-download-language a { overflow-wrap: anywhere; font-size: 12.5px; }
.ap-profile-heading { display: flex; align-items: center; gap: 20px; }
.ap-profile-tabs { flex-wrap: wrap; gap: 8px 20px; margin-bottom: 28px; border-bottom: 1px solid var(--ap-border); }
.ap-profile-tabs .nav-link { position: relative; padding: 12px 0; border: 0 !important; border-radius: 0; background: transparent; color: var(--ap-secondary); font-size: 14px; font-weight: 600; }
.ap-profile-tabs .nav-link:hover { color: var(--ap-text); }
.ap-profile-tabs .nav-link::after { content: ""; position: absolute; right: 0; bottom: -1px; left: 0; height: 3px; background: transparent; }
.ap-profile-tabs .nav-link[aria-selected="true"] { background: transparent; color: var(--ap-text); }
.ap-profile-tabs .nav-link[aria-selected="true"]::after { background: var(--ap-primary); }
.btn-outline-danger { --bs-btn-color: var(--ap-danger-text); --bs-btn-disabled-color: var(--ap-danger-text); }
.ap-profile-switch { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 16px 0; }
.ap-profile-switch + .ap-profile-switch { border-top: 1px solid var(--ap-border); }
.ap-profile-switch label { cursor: pointer; }
.ap-profile-switch strong, .ap-profile-switch .ap-help { display: block; }
.ap-profile-switch .ap-help { margin-top: 4px; }
.ap-profile-switch .form-switch { flex: 0 0 34px; margin: 0; padding: 0; }
.ap-profile-switch .form-check-input { margin: 0; }
.ap-sticky-actions { position: sticky; z-index: 1020; bottom: max(20px, var(--ap-demo-clearance, 20px)); display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 24px; padding: 16px 20px; border: 1px solid var(--ap-border-strong); border-radius: 14px; background: var(--ap-elevated); box-shadow: var(--ap-menu-shadow); }
.ap-password-strength { display: flex; gap: 6px; margin-top: 12px; }
.ap-password-strength span { flex: 1; height: 5px; border-radius: 3px; background: var(--ap-border-strong); }
.ap-password-strength[data-strength="1"] span:first-child { background: var(--ap-danger-text); }
.ap-password-strength[data-strength="2"] span:nth-child(-n+2) { background: var(--ap-warning); }
.ap-password-strength[data-strength="3"] span:nth-child(-n+3), .ap-password-strength[data-strength="4"] span { background: var(--ap-success-text); }
.ap-logo-previews { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ap-logo-preview { display: flex; min-height: 180px; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 24px; border: 1px solid var(--ap-border); border-radius: 12px; }
.ap-logo-preview img { max-width: min(200px, 100%); max-height: 90px; object-fit: contain; }
.ap-logo-preview--dark { background: #000; color: #CBCBCB; }
.ap-logo-preview--light { background: #F3F5F7; color: #343A40; }
.ap-logo-dropzone { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 24px; padding: 28px; border: 1px dashed var(--ap-border-strong); border-radius: 12px; background: var(--ap-elevated); text-align: center; }
.ap-logo-dropzone > .bi { color: var(--ap-link); font-size: 28px; }
.ap-logo-dropzone.is-dragging, .ap-logo-dropzone:focus-within { border-color: var(--ap-primary); box-shadow: var(--ap-focus); }
.ap-logo-dropzone .form-control { max-width: 440px; }
.ap-color-swatches { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 24px 0; }
.ap-color-swatches > div > span { display: block; height: 56px; margin-bottom: 10px; border: 1px solid var(--ap-border-strong); border-radius: 8px; background: var(--zone-color); }
.ap-color-swatches strong { font-size: 12.5px; }

@media (max-width: 1199.98px) {
  .ap-create-grid { grid-template-columns: 1fr; }
  .ap-groups-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ap-users-table .ap-actions-cell { width: 112px; padding-right: 12px; }
  .ap-download-url { max-width: 190px; }
}
@media (max-width: 991.98px) {
  .ap-users-table td[data-label="Centre"], .ap-users-table td[data-label="Correu"], .ap-users-table td[data-label="Telèfon"] { grid-column: 1 / -1; }
  .ap-users-table td[data-label="Estat"]::before, .ap-users-table td[data-label="Admin"]::before { content: attr(data-label) " · "; color: var(--ap-subtle-contrast); font-size: 12.5px; }
  .ap-users-table .ap-actions-cell { width: auto; }
  .ap-download-table tbody { grid-template-columns: 1fr; }
  .ap-download-table td { grid-column: 1 / -1; }
  .ap-download-table .ap-download-details { padding: 0; }
  .ap-download-table .ap-download-details > td { border-radius: 14px; }
  .ap-download-url { max-width: 100%; }
  .ap-download-table .ap-actions-cell { width: auto; }
  .ap-profile-heading { gap: 16px; }
  .ap-profile-tabs { gap: 0 16px; }
}
@media (max-width: 767.98px) {
  .ap-groups-grid, .ap-option-grid, .ap-download-grid, .ap-logo-previews { grid-template-columns: 1fr; }
  .ap-color-swatches { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ap-form-actions { gap: 8px; }
  .ap-form-actions .btn { white-space: normal; text-align: center; }
  .ap-spotify-panel { padding: 16px; }
  .ap-profile-heading h1 { font-size: 24px; overflow-wrap: anywhere; }
  .ap-sticky-actions { padding: 14px; gap: 8px; }
  .ap-sticky-actions > span { flex-basis: 100%; }
}

.ap-table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; }
.ap-users-table .ap-iconbtn:disabled { opacity: .8; }
.ap-users-table .ap-iconbtn .spinner-border { width: 14px; height: 14px; border-width: 2px; }
.ap-users-filters .ap-field:nth-child(2) { flex: 0 0 auto; }
.ap-tracks-preview { display: table; width: 100%; }
.ap-tracks-preview thead { display: table-header-group; }
.ap-tracks-preview tbody { display: table-row-group; }
.ap-tracks-preview tbody tr { display: table-row; height: auto; padding: 0; border: 0; background: transparent; }
.ap-tracks-preview tbody td { display: table-cell; height: auto; padding: 12px 8px; border-bottom: 1px solid var(--ap-border); }
.ap-tracks-preview thead th { position: static; background: transparent; border-radius: 0 !important; }
.ap-tracks-preview .ap-numeric { white-space: nowrap; }
@media (max-width: 991.98px) {
  .ap-download-table .ap-download-details { display: block; }
  .ap-download-table .ap-download-details > td { display: block; }
  .ap-users-filters .ap-field:nth-child(2) { flex: 1 1 auto; }
}
@media (max-width: 575.98px) {
  .ap-topbar .ap-old-view { display: inline-flex; }
  .ap-users-filters .ap-field:nth-child(2) { flex-basis: 100%; }
  .ap-tracks-preview tbody td, .ap-tracks-preview thead th { padding-inline: 4px; font-size: 12.5px; }
}

/* Editor de sessió */
.ap-editor-heading { align-items: center; }
.ap-editor-title-line { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.ap-editor-heading-actions { display: flex; flex-shrink: 0; align-items: center; gap: 12px; }
.ap-editor-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.ap-editor-kpis .ap-kpi { padding: 16px; min-height: 100px; gap: 12px; }
.ap-editor-intensity-value { display: flex; align-items: center; gap: 8px; }
.ap-editor-intensity-value #editor-intensity { font-size: 26px; font-weight: 800; }
.ap-editor-zone-dot, .ap-zone-dot { display: inline-block; flex: 0 0 14px; width: 14px; height: 14px; border-radius: 4px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.ap-editor-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); grid-template-areas: "profile sidebar" "tracks sidebar"; align-items: start; gap: 24px; }
.ap-editor-profile { grid-area: profile; min-width: 0; }
.ap-editor-tracks { grid-area: tracks; min-width: 0; }
.ap-editor-sidebar { grid-area: sidebar; position: sticky; top: 80px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.ap-editor-sidebar .card { padding: 20px; }
.ap-editor-sidebar .ap-card-heading { margin-bottom: 16px; }
.ap-editor-sidebar .ap-card-heading > .bi { font-size: 18px; }
.ap-editor-sidebar .ap-muted { font-size: 14px; }
@media (min-width: 1200px) {
  /* Cada columna es desplaça per separat; el marge interior protegeix el focus. */
  .ap-editor-sidebar { max-height: calc(100vh - 80px - 16px); max-height: calc(100dvh - 80px - 16px); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding: 6px; }
  .ap-editor-sidebar > .card { flex: 0 0 auto; }
}
.ap-editor-mode { display: flex; width: fit-content; }
.ap-editor .btn-link, .ap-editor-offcanvas .btn-link { text-transform: uppercase; letter-spacing: .06em; }
.ap-editor .btn-ap-soft, .ap-editor-offcanvas .btn-ap-soft { --bs-btn-color: var(--ap-chip-text); --bs-btn-disabled-color: var(--ap-chip-text); }
.ap-editor-graph-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.ap-editor-graph-options { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ap-editor-graph-options .ap-segmented { min-height: 34px; }
.ap-editor-graph-options .ap-segmented > button { font-size: 12.5px; padding: 4px 8px; }
.ap-editor-palette .form-select { min-height: 34px; font-size: 12.5px; padding-block: 6px; }
.ap-editor-graph-player { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.ap-editor-preview-play { width: 40px; height: 40px; min-height: 40px; flex-basis: 40px; background: #0080E2; color: #FFF; }
.ap-editor-preview-play:hover { background: #0276CF; color: #FFF; }
.ap-editor-graph-time { margin-left: 8px; font-size: 12.5px; white-space: nowrap; }
.ap-editor-chart { position: relative; height: 260px; overflow: hidden; border-radius: 10px; background: #141415; }
.ap-editor-chart svg { display: block; width: 100%; height: 260px; }
.ap-graph-empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 40px; background: rgba(20,20,21,.8); color: #CBCBCB; text-align: center; }
.ap-editor-zone-stats { margin-top: 16px; }
.ap-zone-stack { display: flex; height: 10px; overflow: hidden; border-radius: 5px; background: #262626; }
.ap-zone-stack > span { height: 10px; }
.ap-zone-legend { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.ap-zone-chip { font-size: 12.5px; font-weight: 700; }
.ap-editor-tracks .ap-card-heading { flex-wrap: wrap; margin-bottom: 16px; }
#listacanciones { display: flex; flex-direction: column; gap: 8px; }
.cajarow { min-width: 0; border: 1px solid #2E2E30; border-radius: 12px; background: #1C1C1D; transition: border-color .2s, opacity .2s, background-color .2s; }
.infopista { display: grid; grid-template-columns: 20px 28px minmax(0, 1fr) 110px 88px 100px; grid-template-rows: 21px 19px; align-items: center; align-content: center; height: 58px; padding: 8px 4px; column-gap: 3px; }
.infopista .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; }
.ap-track-info, .ap-track-meta { display: contents; }
.ap-track-number { grid-column: 2; grid-row: 1 / 3; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; background: #262626; font-weight: 700; }
.ap-track-title { grid-column: 3; grid-row: 1; min-width: 0; overflow: hidden; font-size: 14px; line-height: 21px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.ap-track-duration { grid-column: 4; grid-row: 1 / 3; text-align: right; font-size: 12.5px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ap-track-duration--accumulated .ap-track-time { display: none; }
.infopista .ap-zone-chip { grid-column: 5; grid-row: 1 / 3; justify-content: center; width: 88px; padding-inline: 6px; }
.ap-track-actions { grid-column: 6; grid-row: 1 / 3; display: flex; align-items: center; width: 100px; gap: 2px; }
.ap-track-play-space { width: 32px; flex: 0 0 32px; }
.infopista .ap-track-grip { grid-column: 1; grid-row: 1 / 3; width: 20px; flex-basis: 20px; cursor: grab; }
.ap-track-grip:active { cursor: grabbing; }
.ap-track-slope { grid-column: 3; grid-row: 2; display: flex; align-items: center; min-width: 0; gap: 4px; color: var(--ap-secondary); font-size: 12.5px; line-height: 19px; white-space: nowrap; }
.ap-track-slope-icon, .ap-slope-label { flex-shrink: 0; }
.ap-track-video { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.ap-track-separator { display: none; }
.ap-has-editing .cajarow:not(.ap-track-editing) { border-color: #262626; background: #141415; }
.ap-track-editing { border-color: #0080E2; }
.ap-track-current { border-color: #0080E2; background: rgba(0,128,226,.09); box-shadow: inset 3px 0 #0080E2; }
.ap-track-dragging { opacity: .3; }
.ap-track-ghost { display: flex; align-items: center; justify-content: center; height: 60px; flex-shrink: 0; border: 1px dashed #0080E2; border-radius: 12px; background: rgba(0,128,226,.08); color: #CBCBCB; font-size: 12.5px; }
.editpista { padding: 16px; overflow: hidden; border-top: 1px solid #2E2E30; animation: ap-editor-expand .2s ease-out; }
#add-pista-area { margin-bottom: 16px; }
#add-pista-area .editpista { border-top: 0; }
.ap-track-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 16px 12px; }
.ap-track-name-field { grid-column: 1 / -1; }
.ap-track-fields .form-control, .ap-track-fields .form-select { min-height: 38px; height: 38px; padding-block: 8px; }
.ap-editor-clock { display: flex; align-items: center; gap: 4px; }
.ap-editor-clock > input, .ap-editor-clock > select { min-width: 0; flex: 1 1 0; padding-inline: 8px; }
.ap-editor-clock > select { padding-right: 24px; }
.ap-editor-intensity-field { display: flex; align-items: center; gap: 8px; }
.ap-editor-intensity-field .form-control, .ap-editor-intensity-field .form-select { min-width: 0; }
.ap-editor-intensity-field > .ap-combobox { flex: 1; }
.ap-track-slope-field { min-width: 0; margin: 0; }
.ap-track-slope-field legend { float: none; width: auto; padding: 0; }
.ap-slope-control { gap: 0; padding: 2px; height: 38px; }
.ap-slope-option { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 8px; color: #CBCBCB; cursor: pointer; }
.ap-slope-option:has(input:checked) { background: #0080E2; color: #FFF; }
.ap-slope-option:has(input:focus-visible) { outline: 2px solid #0080E2; outline-offset: 3px; }
.ap-slope-option input { position: absolute; width: 100%; height: 100%; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.ap-slope-option .bi { pointer-events: none; }
.ap-slope-option:has(input[value="-1"]) .bi, .ap-slope-option:has(input[value="1"]) .bi { opacity: .6; }
.ap-track-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.ap-track-error { margin: 12px 0 0; color: var(--ap-danger-text); }
.ap-editor-reorder-help { display: flex; align-items: flex-start; gap: 8px; margin-top: 16px; }
.ap-editor-audio-drop { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 20px 12px; border: 1px dashed #404040; border-radius: 10px; background: #141415; text-align: center; cursor: pointer; }
.ap-editor-audio-drop > .bi { font-size: 28px; color: var(--ap-link); }
.ap-editor-audio-drop strong { font-size: 14px; line-height: 1.5; }
.ap-editor-audio-drop:hover, .ap-drop-active .ap-editor-audio-drop { border-color: #0080E2; background: rgba(0,128,226,.08); }
#audio-upload-area:has(input:focus-visible) .ap-editor-audio-drop { outline: 2px solid #0080E2; outline-offset: 3px; }
.ap-editor-upload-progress { margin-top: 12px; }
.ap-editor-waveform-row { display: flex; align-items: center; gap: 12px; }
.ap-editor-waveform { position: relative; height: 64px; flex: 1; min-width: 0; cursor: pointer; }
.ap-waveform-bars { position: absolute; inset: 0; display: flex; align-items: center; justify-content: space-between; gap: 0; overflow: hidden; }
.ap-waveform-bars > span { width: 3px; flex: 0 0 3px; border-radius: 2px; background: #404040; }
#waveform-progress-fill > span { background: #0080E2; }
.ap-editor-audio-time { display: flex; justify-content: space-between; margin: 6px 0 12px 46px; }
.ap-editor-audio-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ap-editor-ai-card { border-top: 2px solid #0080E2; background-image: linear-gradient(115deg, rgba(0,128,226,0) 55%, rgba(0,128,226,.12) 100%); }
.ap-editor-mixmeister { color: #FFF; font-style: italic; }
.ap-editor-file-name { min-width: 0; overflow-wrap: anywhere; }
.ap-editor-offcanvas { --bs-offcanvas-width: 520px; max-width: 100vw; background: #141415; }
.ap-editor-offcanvas .offcanvas-header { padding: 24px 24px 0; align-items: start; justify-content: space-between; gap: 16px; }
.ap-editor-offcanvas .offcanvas-body { padding: 24px; }
.ap-editor-offcanvas .form-label { display: block; }
.ap-editor-offcanvas textarea { height: auto; }
.ap-editor-ai-guide { border: 1px solid #2E2E30; border-radius: 10px; padding: 14px; background: #1C1C1D; }
.ap-editor-ai-guide summary { cursor: pointer; font-weight: 700; }
.ap-editor-ai-input-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ap-editor-ai-status { display: flex; align-items: center; gap: 8px; margin-top: 20px; padding: 12px; border-radius: 10px; background: rgba(0,128,226,.12); font-size: 14px; }
.ap-editor-ai-preview, .ap-editor-ai-changes { margin-top: 24px; }
.ap-editor-ai-footer { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.ap-ia-table-scroll { overflow-x: auto; }
.ap-ia-table { table-layout: fixed; width: 100%; margin-bottom: 16px; }
.ap-ia-table th { font-size: 12.5px; color: #CBCBCB; }
.ap-ia-table td, .ap-ia-table th { padding: 8px 4px; border-bottom: 1px solid #2E2E30; background: transparent; }
.ap-ia-table th:first-child { width: 36%; }
.ap-ia-table th:nth-child(2) { width: 19%; }
.ap-ia-table th:nth-child(3) { width: 17%; }
.ap-ia-table th:nth-child(4) { width: 17%; }
.ap-ia-table th:last-child { width: 36px; }
.ap-ia-table .form-control, .ap-ia-table .form-select { min-height: 38px; padding: 8px 6px; font-size: 12.5px; }
.ap-ia-table .form-select { padding-right: 18px; }
.ap-ia-table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; }
.ap-editor-ai-voice { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-bottom: 24px; padding: 24px; border: 1px solid #2E2E30; border-radius: 12px; background: #1C1C1D; }
.ap-editor-large-mic { background: rgba(0,128,226,.16); color: #1A8DE5; }
.ap-recording { color: #FFF; background: #DC3545; animation: ap-editor-record 1s infinite; }
.ap-ia-change { padding: 14px 0; border-bottom: 1px solid #2E2E30; }
.ap-ia-change p { margin: 8px 0 0; }
.ap-ia-change del { color: #A5A5A5; }
.ap-ia-change ins { text-decoration: none; color: #1A8DE5; font-weight: 700; }
.ap-editor-featured { display: flex; flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 24px; margin: 32px 0; background-image: linear-gradient(115deg, rgba(0,128,226,0) 55%, rgba(0,128,226,.14) 100%); border-color: #404040; }
.ap-editor-featured h2 { font-size: 22px; }
.ap-editor-featured-variants { display: flex; flex-wrap: wrap; gap: 8px; }
@keyframes ap-editor-expand { from { max-height: 0; opacity: 0; transform: translateY(-8px); } to { max-height: 800px; opacity: 1; transform: translateY(0); } }
@keyframes ap-editor-record { 50% { box-shadow: 0 0 0 5px rgba(220,53,69,.2); } }
@media (min-width: 1200px) and (max-width: 1550px) {
  .ap-track-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1199.98px) {
  .ap-editor-layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "profile" "sidebar" "tracks"; }
  .ap-editor-sidebar { position: static; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .ap-editor-kpis .ap-kpi-icon { display: none; }
}
@media (max-width: 991.98px) {
  .infopista { grid-template-columns: 20px 28px minmax(0, 1fr) auto; grid-template-rows: 32px 24px; height: 76px; padding: 8px; gap: 4px; }
  .infopista .ap-track-grip, .ap-track-number { grid-row: 1; }
  .ap-track-title { grid-column: 3; grid-row: 1; }
  .ap-track-actions { grid-column: 4; grid-row: 1; width: auto; }
  .ap-track-play-space { display: none; }
  .ap-track-meta { grid-column: 3 / -1; grid-row: 2; display: flex; align-items: center; min-width: 0; gap: 3px; font-size: 12px; }
  .ap-track-duration { flex-shrink: 0; text-align: left; font-size: inherit; }
  /* Al mòbil la durada és compacta; l'interval acumulat es conserva al title. */
  .ap-track-duration--accumulated .ap-track-time { display: inline; }
  .ap-track-range { display: none; }
  .infopista .ap-zone-chip { flex-shrink: 0; width: auto; padding-inline: 4px; gap: 3px; font-size: inherit; }
  .infopista .ap-zone-chip .bi { font-size: 12px; }
  .ap-track-slope { font-size: inherit; }
  .ap-track-video { display: none; }
  .ap-track-separator { display: inline; flex-shrink: 0; color: var(--ap-secondary); }
}
@media (max-width: 575.98px) {
  .ap-editor-heading-actions { width: 100%; justify-content: space-between; }
  .ap-editor-title-line .ap-h1 { font-size: 25px; overflow-wrap: anywhere; }
  .ap-editor-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .ap-editor-kpis .ap-kpi { min-height: 90px; padding: 12px; }
  .ap-editor-kpis .ap-kpi-value, .ap-editor-intensity-value #editor-intensity { font-size: 24px; }
  .ap-editor-sidebar { display: flex; align-items: stretch; }
  .ap-editor-profile, .ap-editor-tracks { padding: 16px; }
  .ap-editor-graph-toolbar { gap: 8px; }
  .ap-editor-graph-player { width: 100%; margin-left: 0; }
  .ap-editor-graph-time { margin-left: auto; }
  .ap-editor-graph-options { width: 100%; justify-content: space-between; }
  .ap-editor-graph-options .ap-segmented > button { padding-inline: 6px; }
  .ap-editor-tracks .ap-card-heading { gap: 12px; }
  .ap-track-fields { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .editpista { padding: 12px; }
  .ap-track-form-actions { flex-wrap: wrap; }
  .ap-editor-reorder-help { font-size: 12.5px; }
  .ap-editor-offcanvas .offcanvas-header { padding: 20px 16px 0; }
  .ap-editor-offcanvas .offcanvas-body { padding: 20px 16px; }
  .ap-editor-offcanvas .ap-ia-table-scroll { margin-inline: -4px; }
  .ap-editor-featured { padding: 20px; }
  .ap-editor-featured h2 { font-size: 19px; }
  .ap-editor-featured-variants .btn { white-space: normal; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .editpista, .ap-recording { animation: none; }
  .cajarow { transition: none; }
}

/* Planificació — Ronda 4. Regles limitades a les tres pàgines noves. */
.ap-planning-family .ap-eyebrow,
.ap-planning-family .ap-chip,
.ap-planning-family .ap-table thead th { font-size: 12.5px; }
.ap-planning-family .btn-link { text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }
.ap-planning-family .btn-ap-soft { --bs-btn-color: #65B9FF; }
.ap-planning-family .ap-heading-actions { flex-wrap: wrap; }
.ap-planning-title { display: flex; align-items: center; gap: 14px; }
.ap-planning-title > .ap-chip { margin-top: -8px; }
.ap-planning-centre { width: min(380px, 100%); margin: -4px 0 24px; }
.ap-planning-family .form-control, .ap-planning-family .form-select { min-height: 42px; border-radius: 10px; border-color: #2E2E30; background-color: #262626; }
.ap-planning-family .form-control:focus, .ap-planning-family .form-select:focus { border-color: #0080E2; box-shadow: 0 0 0 3px rgba(0,128,226,.28); }
.ap-planning-family .form-control[type="time"] { color-scheme: dark; }
.ap-planning-options { display: grid; grid-template-columns: minmax(100px,1fr) minmax(0,3fr); align-items: start; gap: 20px; margin-bottom: 20px; }
.ap-planning-options .form-label { display: block; }
.ap-planning-range { min-width: 0; }
.ap-planning-range-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 12px; }
.ap-planning-range-heading .form-label { flex: 1; margin: 0; }
.ap-planning-range-heading output { white-space: nowrap; font-weight: 600; }
.ap-planning-range-heading .ap-help { margin: 0; }
.ap-planning-range-track { position: relative; height: 44px; touch-action: none; }
.ap-planning-range-rail { position: absolute; top: 18px; right: 22px; left: 22px; height: 8px; border-radius: 4px; background: linear-gradient(to right, var(--ap-border-strong) 0 var(--ap-range-start), var(--ap-primary) var(--ap-range-start) var(--ap-range-end), var(--ap-border-strong) var(--ap-range-end) 100%); }
.ap-planning-range-unavailable { position: absolute; top: 18px; left: 22px; width: calc((100% - 44px) / 24); height: 8px; border-radius: 4px 0 0 4px; background: var(--ap-surface); opacity: .8; }
.ap-planning-range-track input[type="range"] { appearance: none; -webkit-appearance: none; position: absolute; inset: 0; width: 100%; height: 44px; margin: 0; padding: 0; border: 0; background: transparent; pointer-events: none; }
.ap-planning-range-track input[type="range"]::-webkit-slider-runnable-track { height: 44px; background: transparent; }
.ap-planning-range-track input[type="range"]::-moz-range-track { height: 44px; background: transparent; }
.ap-planning-range-track input[type="range"]::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: radial-gradient(circle, var(--ap-primary) 0 9px, var(--ap-text-strong) 9px 11px, transparent 11px); cursor: ew-resize; pointer-events: auto; }
.ap-planning-range-track input[type="range"]::-moz-range-thumb { width: 44px; height: 44px; border: 0; border-radius: 50%; background: radial-gradient(circle, var(--ap-primary) 0 9px, var(--ap-text-strong) 9px 11px, transparent 11px); cursor: ew-resize; pointer-events: auto; }
.ap-planning-range-track input[type="range"]:focus-visible { outline: none; }
.ap-planning-range-track input[type="range"]:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--ap-primary); outline-offset: -6px; }
.ap-planning-range-track input[type="range"]:focus-visible::-moz-range-thumb { outline: 2px solid var(--ap-primary); outline-offset: -6px; }
.ap-planning-range-track input[type="range"]:disabled { opacity: .5; }
.ap-planning-range-ticks { position: relative; height: 20px; margin-inline: 22px; color: var(--ap-subtle-contrast); font-size: 12px; }
.ap-planning-range-ticks span { position: absolute; transform: translateX(-50%); }
.ap-planning-range-ticks span:nth-child(1) { left: 0; }
.ap-planning-range-ticks span:nth-child(2) { left: 25%; }
.ap-planning-range-ticks span:nth-child(3) { left: 50%; }
.ap-planning-range-ticks span:nth-child(4) { left: 75%; }
.ap-planning-range-ticks span:nth-child(5) { left: 100%; }
.ap-planning-year-nav { display: flex; min-height: 42px; align-items: center; gap: 12px; width: fit-content; }
.ap-planning-year-nav strong { min-width: 50px; text-align: center; font-size: 17px; }
.ap-planning-options .ap-segmented { min-height: 42px; width: fit-content; }
.ap-planning-date-option { max-width: 210px; }
.ap-planning-option-help { grid-column: 2 / -1; align-self: end; }
.ap-planning-pc { margin-bottom: 20px; padding: 18px 24px; }
.ap-planning-pc summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; list-style: none; }
.ap-planning-pc summary::-webkit-details-marker { display: none; }
.ap-planning-pc summary > span:first-child { display: flex; align-items: center; gap: 12px; }
.ap-planning-pc summary::after { content: "+"; margin-left: auto; color: var(--ap-subtle-contrast); font-size: 20px; }
.ap-planning-pc[open] summary::after { content: "−"; }
.ap-planning-pc-content { margin-top: 20px; padding-top: 20px; border-top: 1px solid #2E2E30; }
.ap-planning-file { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid #2E2E30; border-radius: 10px; background: #141415; }
.ap-planning-file a { min-width: 0; flex: 1; overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }
.ap-planning-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }
.ap-planning-warning strong { display: block; margin-bottom: 4px; }
.ap-planning-table-card { overflow: visible; }
.ap-planning-table { margin-bottom: 0; }
.ap-planning-table thead { position: sticky; top: 64px; z-index: 5; background: #141415; }
.ap-planning-table > thead > tr > th { background: #141415; }
.ap-planning-table tbody th { font-size: 14px; font-weight: 600; padding: 8px 12px; vertical-align: middle; border-color: #2E2E30; }
.ap-planning-table .ap-planning-month { height: 38px; }
.ap-planning-table .ap-planning-month th { height: 38px; padding: 10px 20px; background: #141415; color: var(--ap-subtle-contrast); text-transform: capitalize; font-size: 12.5px; font-weight: 700; letter-spacing: .04em; }
.ap-planning-week-number { color: var(--ap-text-strong); font-weight: 700; }
.ap-planning-dates strong { font-weight: 600; }
.ap-planning-days { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 5px; }
.ap-planning-day-dot { display: inline-flex; align-items: center; gap: 4px; color: var(--ap-subtle-contrast); font-size: 12.5px; line-height: 16px; }
.ap-planning-day-dot > span { height: 4px; width: 4px; border-radius: 50%; background: #6B6B6F; }
.ap-planning-day-dot.is-active > span { background: #65B9FF; }
.ap-planning-day-dot.is-active { color: #D0E8FA; }
.ap-planning-programming .ap-chip { max-width: 100%; white-space: normal; text-align: left; }
.ap-planning-programming .ap-subtext { margin-top: 3px; }
.ap-planning-actions { width: 136px; padding-right: 20px !important; }
.ap-planning-table .ap-selected > th { background: var(--ap-primary-soft); }
.ap-planning-kpi a, .ap-planning-family .ap-kpi-value a { color: var(--ap-text-strong); }
.ap-planning-family .ap-kpi-value a:hover { color: var(--ap-link); }
.ap-planning-savebar { position: fixed; z-index: 1039; bottom: max(20px,var(--ap-demo-clearance,20px)); left: calc(50% + 128px); transform: translateX(-50%); width: min(780px,calc(100vw - 320px)); display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 20px; border: 1px solid #414145; border-radius: 14px; background: #202022; box-shadow: var(--ap-shadow-lg); }
.ap-planning-savebar > span { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.ap-planning-savebar > span > .bi { color: #FFD16A; font-size: 8px; }
.ap-planning-savebar .ap-subtext { flex-basis: 100%; padding-left: 16px; }
.ap-planning-dirty .ap-planning-bulkbar { bottom: calc(max(20px,var(--ap-demo-clearance,20px)) + 94px); }
.ap-sidebar-collapsed .ap-planning-savebar { left: calc(50% + 38px); width: min(780px,calc(100vw - 140px)); }
.ap-planning-saving .ap-planning-table, .ap-planning-saving .ap-planning-options, .ap-planning-saving .ap-planning-pc, .ap-planning-saving .ap-planning-centre { pointer-events: none; opacity: .65; }
.ap-planning-offcanvas { --bs-offcanvas-width: 520px; background: #141415; }
.ap-planning-panel-section + .ap-planning-panel-section { margin-top: 28px; padding-top: 24px; border-top: 1px solid #2E2E30; }
.ap-planning-panel-fields { display: grid; grid-template-columns: minmax(0,1fr) 145px; gap: 12px; }
.ap-planning-panel-fields > * { min-width: 0; }
.ap-planning-day-picker { display: flex; width: 100%; }
.ap-planning-day-picker > button { flex: 1; min-width: 0; padding-inline: 4px; }
.ap-planning-panel-day { margin-top: 20px; }
.ap-planning-panel-day h3 { color: var(--ap-subtle-contrast); font-size: 12.5px; font-weight: 700; }
.ap-planning-day-empty { padding: 12px; border: 1px dashed #2E2E30; border-radius: 10px; }
.ap-planning-panel-class { display: flex; align-items: center; gap: 10px; padding: 10px; margin-top: 6px; border: 1px solid #2E2E30; border-radius: 10px; background: #1C1C1D; }
.ap-planning-panel-class > strong { flex: 1; min-width: 0; overflow-wrap: anywhere; font-size: 14px; font-weight: 600; }
.ap-planning-panel-class .ap-chip { flex-shrink: 0; }
.ap-planning-inline { display: grid; grid-template-columns: minmax(0,1fr) 115px; align-items: end; gap: 10px; margin-top: 6px; padding: 12px; border: 1px solid #0080E2; border-radius: 10px; background: #1C1C1D; }
.ap-planning-inline .form-control, .ap-planning-inline .form-select { height: 38px; min-height: 38px; padding-block: 6px; }
.ap-planning-inline-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 6px; }
.ap-planning-panel-footer { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding: 18px 24px; border-top: 1px solid #2E2E30; background: #141415; }
.ap-planning-preview-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 10px; }
.ap-planning-preview-day { min-height: 200px; border: 1px solid #2E2E30; border-radius: 10px; background: #141415; padding: 12px; }
.ap-planning-preview-day h3 { display: flex; flex-direction: column; gap: 4px; margin-bottom: 18px; }
.ap-planning-preview-day h3 span { color: var(--ap-subtle-contrast); font-size: 12.5px; font-weight: 400; }
.ap-planning-preview-class { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; border: 1px solid #2E2E30; border-radius: 8px; padding: 10px; margin-top: 8px; background: #1C1C1D; }
.ap-planning-preview-class strong { font-size: 12.5px; font-weight: 600; overflow-wrap: anywhere; }
.ap-planning-family .ap-main { padding-bottom: 220px; }
@media (max-width: 1199.98px) {
  .ap-planning-family .ap-page-heading { align-items: flex-start; flex-wrap: wrap; }
  .ap-planning-preview-grid { grid-template-columns: repeat(7,minmax(125px,1fr)); min-width: 940px; }
  #planning-week-modal .modal-body { overflow-x: auto; }
  .ap-planning-bulkbar { gap: 10px; max-width: calc(100vw - 300px); flex-wrap: wrap; }
  .ap-planning-bulkbar > span { flex-basis: 100%; }
}
@media (max-width: 991.98px) {
  .ap-planning-savebar, .ap-sidebar-collapsed .ap-planning-savebar { left: 50%; width: calc(100vw - 32px); }
  .ap-planning-bulkbar { max-width: calc(100vw - 32px); width: max-content; }
}
@media (max-width: 575.98px) {
  .ap-planning-family[data-ap-page="planificacio"] .ap-heading-actions { display: grid; grid-template-columns: minmax(0,1fr) auto; }
  .ap-planning-family[data-ap-page="planificacio"] .ap-heading-actions > a { grid-column: 1 / -1; justify-self: start; }
  .ap-planning-family[data-ap-page="planificacio"] .ap-heading-actions > .btn-primary { grid-column: 1; }
  .ap-planning-family[data-ap-page="planificacio"] .ap-heading-actions > .dropdown { grid-column: 2; }
  .ap-planning-family .ap-heading-actions { gap: 8px; width: 100%; }
  .ap-planning-family .ap-heading-actions .btn { padding-inline: 12px; }
  .ap-planning-family .ap-h1 { font-size: 26px; }
  .ap-planning-title { gap: 10px; }
  .ap-planning-options { padding: 16px; grid-template-columns: minmax(0,1fr); gap: 16px; }
  .ap-planning-range-heading .form-label { flex-basis: 100%; }
  .ap-planning-range-heading output { flex: 1; }
  .ap-planning-option-help { grid-column: 1 / -1; padding-bottom: 0; }
  .ap-planning-pc { padding: 16px; }
  .ap-planning-pc summary { flex-wrap: wrap; }
  .ap-planning-pc summary > .ap-chip { order: 3; }
  .ap-planning-pc summary::after { margin-left: auto; }
  .ap-planning-table thead { position: static; display: block; }
  .ap-planning-table thead tr { display: flex; align-items: center; min-height: 46px; }
  .ap-planning-table thead th:not(:first-child) { display: none; }
  .ap-planning-table thead tr::after { content: "Selecciona les setmanes"; color: var(--ap-subtle-contrast); font-size: 12.5px; }
  .ap-planning-table, .ap-planning-table tbody { display: block; width: 100%; }
  .ap-planning-table tbody tr { display: grid; grid-template-columns: 30px minmax(0,1fr) auto; gap: 8px 10px; height: auto; padding: 14px 16px; border-bottom: 1px solid #2E2E30; }
  .ap-planning-table tbody tr > td, .ap-planning-table tbody tr > th { display: block; width: auto; height: auto; padding: 0 !important; border: 0; background: transparent; }
  .ap-planning-table tbody tr > .ap-row-select { grid-column: 1; grid-row: 1; padding-top: 5px !important; }
  .ap-planning-table tbody tr > th { grid-column: 2; grid-row: 1; padding-top: 3px !important; }
  .ap-planning-table .ap-planning-dates { grid-column: 2 / -1; grid-row: 2; }
  .ap-planning-table .ap-planning-programming { grid-column: 2 / -1; grid-row: 3; }
  .ap-planning-table .ap-planning-actions { grid-column: 3; grid-row: 1; }
  .ap-planning-table tbody .ap-planning-month { display: block; height: auto; padding: 12px 16px; background: #141415; }
  .ap-planning-table .ap-selected { background: var(--ap-primary-soft); }
  .ap-planning-table .ap-planning-month th { height: auto; }
  .ap-planning-table .ap-actions { gap: 2px; }
  .ap-planning-table .ap-chip { font-size: 12.5px; }
  .ap-planning-days { gap: 8px; }
  .ap-planning-savebar { flex-direction: column; align-items: stretch; gap: 12px; padding: 14px 16px; }
  .ap-planning-savebar .btn { align-self: flex-end; }
  .ap-planning-dirty .ap-planning-bulkbar { bottom: calc(max(20px,var(--ap-demo-clearance,20px)) + 150px); }
  .ap-planning-bulkbar { padding: 12px; gap: 8px; }
  .ap-planning-bulkbar .btn { padding-inline: 10px; }
  .ap-planning-panel-fields { grid-template-columns: minmax(0,1fr); }
  .ap-planning-panel-class { flex-wrap: wrap; }
  .ap-planning-panel-class > strong { flex-basis: calc(100% - 80px); }
  .ap-planning-panel-class .ap-actions { width: 100%; }
  .ap-planning-panel-footer { padding: 16px; gap: 8px; }
  .ap-planning-panel-footer .btn { padding-inline: 12px; }
  .ap-planning-inline { grid-template-columns: minmax(0,1fr); }
}
/* Planificació — plantilles i editor d'horari. */
.ap-planning-family .ap-chip { font-size: 12.5px; }
.ap-planning-family .ap-template-filters { display: grid; grid-template-columns: minmax(220px, 1fr) auto minmax(220px, .75fr); align-items: end; gap: 20px; margin-bottom: 24px; }
.ap-planning-family .ap-template-filters .form-label { display: block; }
.ap-planning-family .ap-template-search { min-width: 0; }
.ap-planning-family .ap-template-filters .ap-segmented { min-height: 42px; }
.ap-planning-family .ap-template-filters .ap-segmented > button { font-size: 12.5px; }
.ap-planning-family .ap-template-name-button { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0; border: 0; background: transparent; color: #fff; text-align: left; font: inherit; }
.ap-planning-family .ap-template-name-button > .bi { color: #A5A5A5; flex: 0 0 16px; }
.ap-planning-family .ap-template-name-button strong { display: block; font-size: 14px; font-weight: 700; }
.ap-planning-family .ap-template-name-button small { display: block; margin-top: 4px; font-size: 12.5px; color: #CBCBCB; }
.ap-planning-family .ap-template-name-button:hover strong { color: #1A8DE5; }
.ap-planning-family .ap-template-name-button:focus-visible { outline: 2px solid #0080E2; outline-offset: 4px; border-radius: 8px; }
.ap-planning-family .ap-template-table .ap-template-number { width: 96px; }
.ap-planning-family .ap-template-table .ap-actions-cell { width: 156px; }
.ap-planning-family .ap-template-detail-row td { padding: 20px 24px; background: #141415; }
.ap-planning-family .ap-template-miniweek { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
.ap-planning-family .ap-template-miniweek--day { grid-template-columns: minmax(0, 420px); }
.ap-planning-family .ap-template-miniday { min-width: 0; }
.ap-planning-family .ap-template-miniday > strong { display: block; font-size: 12.5px; margin-bottom: 12px; }
.ap-planning-family .ap-template-mini-class { display: flex; flex-direction: column; align-items: start; gap: 4px; margin-bottom: 12px; font-size: 12.5px; line-height: 1.5; overflow-wrap: anywhere; }
.ap-planning-family .ap-template-preview-alert { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; border-color: #404040; background: rgba(0,128,226,.12); font-size: 14px; }
.ap-planning-family .ap-template-details { margin-bottom: 24px; }
.ap-planning-family .ap-template-fields { display: grid; grid-template-columns: minmax(0, 2fr) minmax(220px, 1fr); gap: 24px; max-width: 960px; }
.ap-planning-family .ap-template-fields .form-label { display: block; }
.ap-planning-family .ap-template-fields .ap-segmented { min-height: 42px; width: fit-content; }
.ap-planning-family .ap-template-fields .ap-segmented > button { min-width: 112px; }
.ap-planning-family .ap-template-schedule { padding: 24px; }
.ap-planning-family .ap-template-schedule-heading { display: flex; flex-wrap: wrap; align-items: start; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.ap-planning-family .ap-template-schedule-heading h2 { margin-bottom: 8px; }
.ap-planning-family .ap-template-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ap-planning-family .ap-template-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
.ap-planning-family .ap-template-week--day { grid-template-columns: minmax(0, 480px); }
.ap-planning-family .ap-template-day { min-width: 0; display: flex; flex-direction: column; border: 1px solid #2E2E30; border-radius: 10px; overflow: hidden; background: #141415; }
.ap-planning-family .ap-template-day > header { display: flex; flex-direction: column; gap: 4px; padding: 12px 10px; background: #262626; border-bottom: 1px solid #2E2E30; }
.ap-planning-family .ap-template-day h3 { font-size: 14px; font-weight: 700; margin: 0; }
.ap-planning-family .ap-template-day-classes { flex: 1; padding: 4px; }
.ap-planning-family .ap-template-class { position: relative; display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 4px; border-radius: 8px; margin-bottom: 4px; background: #1C1C1D; }
.ap-planning-family .ap-template-class-content { display: flex; flex-direction: column; align-items: start; justify-content: center; min-width: 0; flex: 1; gap: 2px; }
.ap-planning-family .ap-template-class-content .ap-chip { height: 20px; padding: 0 6px; line-height: 20px; }
.ap-planning-family .ap-template-class-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; max-width: 100%; width: 100%; padding-inline: 1px; overflow: hidden; text-overflow: ellipsis; white-space: normal; overflow-wrap: anywhere; font-size: 13px; line-height: 18px; }
.ap-planning-family .ap-template-class-name:focus-visible { outline: 2px solid #0080E2; outline-offset: 2px; border-radius: 4px; }
.ap-planning-family .ap-template-class-actions { position: absolute; inset: 0 2px 0 auto; display: flex; align-items: center; gap: 2px; border-radius: 8px; background: inherit; opacity: 0; pointer-events: none; }
.ap-planning-family .ap-template-class:hover .ap-template-class-actions, .ap-planning-family .ap-template-class:focus-within .ap-template-class-actions { opacity: 1; pointer-events: auto; }
@media (hover: none) {
  .ap-planning-family .ap-template-class-actions { position: static; opacity: 1; pointer-events: auto; }
}
.ap-planning-family .ap-template-class-actions .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; border-radius: 8px; }
.ap-planning-family .ap-template-day-empty { display: flex; min-height: 88px; align-items: center; justify-content: center; margin: 0; padding: 12px 4px; text-align: center; }
.ap-planning-family .ap-template-add { align-self: stretch; display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 36px; margin: 12px 0; padding: 0 10px; border: 1px dashed #404040; border-radius: 8px; background: transparent; color: var(--ap-subtle-contrast); font: inherit; font-size: 13px; font-weight: 400; text-transform: none; letter-spacing: normal; white-space: nowrap; cursor: pointer; }
.ap-planning-family .ap-template-add:hover { border-color: #1A8DE5; color: #1A8DE5; }
.ap-planning-family .ap-template-add:focus-visible { outline: 2px solid #1A8DE5; outline-offset: 2px; }
.ap-planning-family .ap-template-inline { display: flex; flex-direction: column; gap: 8px; padding: 8px; margin-bottom: 4px; border: 1px solid #0080E2; border-radius: 8px; background: #1C1C1D; }
.ap-planning-family .ap-template-inline .form-label { display: block; margin-bottom: 4px; font-size: 12.5px; }
.ap-planning-family .ap-template-inline .form-control, .ap-planning-family .ap-template-inline .form-select { height: 38px; min-height: 38px; font-size: 12.5px; padding-inline: 8px; }
.ap-planning-family .ap-template-inline .form-select { padding-right: 24px; }
.ap-planning-family .ap-template-inline-actions { display: flex; justify-content: end; gap: 4px; }
.ap-planning-family .ap-template-inline-actions .ap-iconbtn:first-child { background: rgba(0,128,226,.16); color: #1A8DE5; }
.ap-planning-family .ap-template-inline .invalid-feedback { font-size: 12.5px; }
.ap-planning-family .ap-template-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 20px; }
.ap-planning-family .ap-template-keyboard-help { display: flex; align-items: center; gap: 8px; margin: 0; }
.ap-planning-family .ap-template-activity-legend { display: flex; flex-wrap: wrap; gap: 6px; }
.ap-planning-family .ap-template-activity-legend .ap-chip { white-space: normal; }
.ap-planning-family .ap-template-dirtybar { position: fixed; z-index: 1029; bottom: max(20px, var(--ap-demo-clearance, 20px)); left: calc(50% + 128px); width: min(900px, calc(100vw - 352px)); transform: translateX(-50%); display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 20px; border: 1px solid #404040; border-radius: 14px; background: #262626; box-shadow: 0 8px 32px rgba(0,0,0,.5); }
.ap-planning-family.ap-sidebar-collapsed .ap-template-dirtybar { left: calc(50% + 38px); width: min(900px, calc(100vw - 172px)); }
.ap-planning-family .ap-template-dirtybar > span { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; }
.ap-planning-family .ap-template-dirtybar > span .bi { font-size: 8px; color: #FFC107; }
.ap-planning-family .ap-template-dirtybar > div { display: flex; align-items: center; gap: 8px; }
.ap-planning-family .ap-template-dirtybar .btn-link { color: #CBCBCB; }
.ap-planning-family .ap-template-editor { padding-bottom: 128px; }
.ap-planning-family .ap-template-ai-table { table-layout: fixed; }
.ap-planning-family .ap-template-ai-table th { font-size: 12.5px; }
.ap-planning-family .ap-template-ai-table th:first-child { width: 128px; }
.ap-planning-family .ap-template-ai-table th:last-child { width: 52px; }
.ap-planning-family .ap-template-ai-table td { vertical-align: top; padding: 8px; }
.ap-planning-family .ap-template-ai-table .form-control, .ap-planning-family .ap-template-ai-table .form-select { min-height: 38px; height: 38px; font-size: 12.5px; padding-inline: 8px; }
.ap-planning-family .ap-template-ai-table .form-select { padding-right: 24px; }
.ap-planning-family .ap-template-ai-table td:first-child .form-control { margin-top: 8px; }
.ap-planning-family .ap-template-ai-table-wrap { border: 1px solid #2E2E30; border-radius: 10px; overflow: hidden; }
.ap-planning-family .ap-template-ai textarea { height: auto; }
.ap-planning-family .ap-template-ai .offcanvas-title { font-size: 20px; font-weight: 700; }
.ap-planning-family .ap-template-ai #template-ia-process, .ap-planning-family .ap-template-ai #template-ia-confirm { --bs-btn-color: #71BEFA; --bs-btn-hover-color: #fff; }
@media (min-width: 1200px) {
  .ap-planning-family .ap-template-week--day .ap-template-class-actions { position: static; opacity: 1; pointer-events: auto; }
  .ap-planning-family .ap-template-week--day .ap-template-class-content { flex-direction: row; align-items: center; gap: 12px; }
  .ap-planning-family .ap-template-week--day .ap-template-class-content .ap-chip { flex-shrink: 0; }
  .ap-planning-family .ap-template-week--day .ap-template-inline { display: grid; grid-template-columns: minmax(0, 1fr) 120px auto; align-items: end; }
}
@media (max-width: 1199.98px) {
  .ap-planning-family .ap-template-week { grid-template-columns: minmax(0, 1fr); }
  .ap-planning-family .ap-template-day > header { flex-direction: row; justify-content: space-between; align-items: center; padding: 14px 16px; }
  .ap-planning-family .ap-template-day-classes { padding: 8px; }
  .ap-planning-family .ap-template-class { padding-inline: 8px; }
  .ap-planning-family .ap-template-class-content { flex-direction: row; align-items: center; gap: 12px; }
  .ap-planning-family .ap-template-class-content .ap-chip { flex-shrink: 0; }
  .ap-planning-family .ap-template-class-actions { position: static; opacity: 1; pointer-events: auto; }
  .ap-planning-family .ap-template-inline { display: grid; grid-template-columns: minmax(0, 1fr) 124px auto; align-items: end; }
  .ap-planning-family .ap-template-day-empty { min-height: 52px; justify-content: start; padding-left: 8px; }
  .ap-planning-family .ap-template-filters { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .ap-planning-family .ap-template-filters .ap-field:first-child { grid-column: 1 / -1; }
  .ap-planning-family .ap-template-miniweek { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .ap-planning-family .ap-template-dirtybar, .ap-planning-family.ap-sidebar-collapsed .ap-template-dirtybar { left: 50%; width: calc(100vw - 40px); }
}
@media (max-width: 767.98px) {
  .ap-planning-family .ap-template-filters { grid-template-columns: minmax(0, 1fr); padding: 20px; gap: 16px; }
  .ap-planning-family .ap-template-fields { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .ap-planning-family .ap-template-table, .ap-planning-family .ap-template-table tbody { display: block; }
  .ap-planning-family .ap-template-table thead { display: none; }
  .ap-planning-family .ap-template-table tbody > tr:not(.ap-template-detail-row) { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; padding: 16px 20px; border-bottom: 1px solid #2E2E30; }
  .ap-planning-family .ap-template-table td { border: 0; padding: 0; }
  .ap-planning-family .ap-template-table .ap-template-title-cell { grid-column: 1 / -1; }
  .ap-planning-family .ap-template-table .ap-template-number { display: none; }
  .ap-planning-family .ap-template-table .ap-actions-cell { width: auto; }
  .ap-planning-family .ap-template-table .ap-actions { justify-content: end; }
  .ap-planning-family .ap-template-detail-row { display: block; }
  .ap-planning-family .ap-template-detail-row td { display: block; padding: 20px; }
  .ap-planning-family .ap-template-miniweek { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .ap-planning-family .ap-template-miniweek--day { grid-template-columns: minmax(0, 1fr); }
  .ap-planning-family .ap-template-schedule, .ap-planning-family .ap-template-details { padding: 20px; }
  .ap-planning-family .ap-template-schedule-heading { flex-direction: column; }
  .ap-planning-family .ap-template-tools { gap: 8px; }
  .ap-planning-family .ap-template-tools .btn { padding-inline: 12px; }
  .ap-planning-family .ap-template-inline { grid-template-columns: minmax(0, 1fr) 110px; }
  .ap-planning-family .ap-template-inline > div:first-child { grid-column: 1 / -1; }
  .ap-planning-family .ap-template-inline-actions { align-self: end; }
  .ap-planning-family .ap-template-dirtybar, .ap-planning-family.ap-sidebar-collapsed .ap-template-dirtybar { bottom: max(16px, var(--ap-demo-clearance, 16px)); left: 50%; width: calc(100vw - 24px); align-items: start; flex-direction: column; gap: 8px; padding: 12px; }
  .ap-planning-family .ap-template-dirtybar > div { width: 100%; justify-content: end; }
  .ap-planning-family .ap-template-dirtybar .btn { padding-inline: 12px; }
  .ap-planning-family .ap-template-ai-table th:first-child { width: 114px; }
  .ap-planning-family .ap-template-ai-table th:last-child { width: 44px; }
  .ap-planning-family .ap-template-ai-table td { padding: 8px 4px; }
}

/* Planificació — colors d'activitat, compartits amb els exemples de Components. */
.ap-planning-family .ap-activity-color, .ap-activity-samples .ap-activity-color { border-color: var(--ap-activity-bg); border-radius: 8px; background: var(--ap-activity-bg); color: var(--ap-activity-text); }
.ap-planning-family .ap-activity-color:hover, .ap-activity-samples .ap-activity-color:hover { filter: brightness(1.08); }
.ap-activity-color .ap-chip { border: 0; background: var(--ap-activity-time-bg); color: inherit; }
.ap-activity-color .ap-iconbtn { color: inherit; opacity: 1; }
.ap-activity-color .ap-iconbtn:hover, .ap-activity-color .ap-iconbtn:focus-visible { background: var(--ap-activity-time-bg); }
.ap-planning-family .ap-template-mini-class.ap-activity-color { padding: 8px; font-size: 13px; }
.ap-planning-panel-class.ap-activity-color > strong, .ap-planning-preview-class.ap-activity-color > strong { font-size: 13px; }
.ap-activity-sample { display: flex; flex-direction: column; align-items: start; gap: 8px; padding: 12px; font-size: 13px; }
.ap-activity-sample > strong { overflow-wrap: anywhere; }
.ap-activity-sample > code { color: inherit; }

/* Ronda 5 · biblioteca, recursos i inici. Estils limitats a les pàgines noves. */
.ap-eyebrow, .ap-table thead th { font-size: 12.5px; }
.ap-r5-home-access .ap-kpi-icon { width: 40px; height: 40px; flex-basis: 40px; }
.btn-ap-soft { --bs-btn-color: var(--ap-chip-text); }
.btn-outline-danger { --bs-btn-color: var(--ap-danger-text); }
.ap-r5-home-heading { align-items: center; margin-bottom: 36px; }
.ap-r5-home-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ap-r5-home-access { display: flex; flex-direction: row; align-items: flex-start; gap: 16px; min-width: 0; min-height: 126px; padding: 24px; color: var(--ap-text); transition: border-color .15s, background-color .15s; }
.ap-r5-home-access:hover { border-color: var(--ap-primary); background: #202327; color: var(--ap-text); }
.ap-r5-home-access-copy { flex: 1; min-width: 0; }
.ap-r5-home-access h3 { margin: 0 0 5px; font-size: 15px; }
.ap-r5-home-access p { margin: 0; font-size: 14px; color: var(--ap-subtle-contrast); }
.ap-r5-home-access > .bi { margin-top: 12px; color: var(--ap-link); }
.ap-r5-home-recent { margin-top: 32px; }
.ap-r5-recent-list { margin: 0; padding: 0; list-style: none; }
.ap-r5-recent-list li { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 72px; padding: 14px 24px; }
.ap-r5-recent-list li + li { border-top: 1px solid var(--ap-border); }
.ap-r5-recent-copy { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ap-r5-recent-copy .ap-muted { font-size: 12.5px; }
.ap-r5-home-player { display: flex; aspect-ratio: 16/9; flex-direction: column; justify-content: center; align-items: center; gap: 14px; padding: 24px; border-radius: 10px; background: linear-gradient(145deg, #082b45, #191919); text-align: center; }
.ap-r5-home-player > .bi { font-size: 42px; color: var(--ap-chip-text); }
.ap-r5-denied-main { display: flex; min-height: calc(100vh - 64px); align-items: flex-start; justify-content: center; }
.ap-r5-denied { width: 100%; max-width: 800px; min-height: 460px; margin-top: 48px; }
.ap-r5-denied h1 { max-width: 500px; margin: 0 0 14px; font-size: clamp(24px, 2vw, 28px); font-weight: 800; }
.ap-r5-denied p:not(.ap-eyebrow) { max-width: 470px; }
.ap-r5-denied .ap-eyebrow { margin-bottom: 12px; }
.ap-r5-denied-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; }
@media (max-width: 1199.98px) {
  .ap-r5-home-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .ap-r5-home-grid { grid-template-columns: 1fr; }
  .ap-r5-home-heading { align-items: flex-start; gap: 16px; }
  .ap-r5-home-access { min-height: 108px; padding: 20px; }
  .ap-r5-home-recent { border: 1px solid var(--ap-border); border-radius: 14px; background: var(--ap-surface); }
  .ap-r5-home-recent .ap-table-intro { padding: 20px 16px; border-bottom: 1px solid var(--ap-border); }
  .ap-r5-home-recent .ap-table-hint { display: none; }
  .ap-r5-recent-list li { gap: 12px; padding: 16px; }
  .ap-r5-recent-list .btn { flex-shrink: 0; padding-inline: 10px; }
  .ap-r5-denied { min-height: 470px; margin-top: 12px; padding: 32px 20px; }
  .ap-r5-denied-actions { width: 100%; flex-direction: column; }
  .ap-r5-denied-actions .btn { width: 100%; white-space: normal; }
  [data-ap-page="categories"] .ap-topbar .breadcrumb-item:first-child { display: block; }
  [data-ap-page="categories"] .ap-topbar .breadcrumb-item + .breadcrumb-item::before { content: var(--bs-breadcrumb-divider, "/"); }
}

.ap-r5-category-table .ap-r5-category-name { color: var(--ap-text-strong); font-weight: 700; overflow-wrap: anywhere; }
.ap-r5-category-table .ap-r5-category-total { width: 140px; }
.ap-r5-category-table .ap-actions-cell { width: 116px; }
.ap-r5-category-inline { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px; max-width: 560px; }
.ap-r5-category-inline > div:first-child { min-width: 0; }
.ap-r5-category-inline .form-label { display: block; margin-bottom: 6px; font-size: 12.5px; }
.ap-r5-category-inline .form-control { min-height: 38px; height: 38px; padding-block: 6px; }
.ap-r5-category-inline .ap-actions { align-self: end; padding-bottom: 3px; }
.ap-r5-category-inline .ap-actions .ap-iconbtn:first-child { background: var(--ap-primary-soft); color: var(--ap-chip-text); opacity: 1; }
.ap-r5-category-form-card { max-width: 520px; }
.ap-r5-category-library .ap-table-footer > span { font-size: 12.5px; }
@media (max-width: 991.98px) {
  .ap-r5-category-table tbody tr { grid-template-columns: minmax(0, 1fr) auto; align-content: center; column-gap: 12px; row-gap: 3px; padding: 14px 16px; }
  .ap-r5-category-table tbody .ap-r5-category-name-cell { grid-column: 1; grid-row: 1; }
  .ap-r5-category-table tbody .ap-r5-category-total { grid-column: 1; grid-row: 2; width: auto; align-self: center; color: var(--ap-subtle-contrast); font-size: 12.5px; text-align: left; }
  .ap-r5-category-table tbody .ap-r5-category-total::after { content: ' sessions'; }
  .ap-r5-category-table tbody .ap-actions-cell { grid-column: 2; grid-row: 1 / span 2; align-self: center; width: auto; padding-top: 0; }
  .ap-r5-category-table tbody .ap-r5-category-editing .ap-r5-category-name-cell { grid-column: 1 / -1; }
  .ap-r5-category-table tbody .ap-r5-category-editing .ap-r5-category-total, .ap-r5-category-table tbody .ap-r5-category-editing .ap-actions-cell { display: none; }
  .ap-r5-category-library .ap-table-footer { align-items: flex-start; flex-direction: column; gap: 6px; }
}
@media (max-width: 575.98px) {
  .ap-r5-category-table tbody { grid-template-columns: 1fr; }
}

.ap-r5-how { margin-bottom: 24px; padding: 0; overflow: hidden; }
.ap-r5-how-toggle { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 24px; border: 0; background: transparent; color: var(--ap-text); text-align: left; font-size: 14px; font-weight: 700; }
.ap-r5-how-toggle > span:first-child { display: flex; align-items: center; gap: 12px; }
.ap-r5-how-toggle > span:first-child > .bi { color: var(--ap-link); font-size: 18px; }
.ap-r5-how-toggle:hover { background: var(--ap-row-hover); }
.ap-r5-how-toggle[aria-expanded="true"] .bi-chevron-down { transform: rotate(180deg); }
.ap-r5-how-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 8px 24px 24px; list-style: none; }
.ap-r5-how-steps li { display: flex; align-items: start; gap: 12px; }
.ap-r5-step-number { display: inline-flex; flex: 0 0 28px; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 8px; background: var(--ap-primary-soft); color: var(--ap-chip-text); font-size: 14px; font-weight: 700; }
.ap-r5-how-steps strong { display: block; margin-bottom: 6px; font-size: 14px; }
.ap-r5-how-steps p { margin: 0; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-r5-instructors { min-width: 0; margin-bottom: 24px; }
.ap-r5-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.ap-r5-section-heading h2 { margin: 0; }
.ap-r5-instructors .ap-r5-section-heading { margin-bottom: 14px; }
.ap-r5-instructors .ap-r5-section-heading h2 { margin-bottom: 4px; }
.ap-r5-section-heading p { margin: 0; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-r5-carousel-controls { display: flex; flex: 0 0 auto; gap: 8px; }
.ap-r5-carousel-controls .ap-iconbtn { border-color: var(--ap-border); background: var(--ap-surface); }
.ap-r5-instructor-track { display: flex; align-items: stretch; gap: 12px; overflow-x: auto; padding: 2px 2px 10px; scrollbar-width: thin; scrollbar-color: var(--ap-border-strong) transparent; scroll-snap-type: x proximity; }
.ap-r5-instructor-card { display: flex; flex: 0 0 174px; flex-direction: column; align-items: center; gap: 8px; min-height: 174px; padding: 18px 12px; scroll-snap-align: start; text-align: center; color: var(--ap-text); cursor: pointer; transition: border-color .15s, background-color .15s; }
.ap-r5-instructor-card:hover, .ap-r5-instructor-card[aria-pressed="true"] { border-color: var(--ap-primary); background: #1B2630; }
.ap-r5-instructor-card strong { font-size: 14px; line-height: 20px; }
.ap-r5-instructor-avatar { flex: 0 0 64px; width: 64px; height: 64px; margin-bottom: 4px; background: linear-gradient(140deg, #0269B8, #003DA6); font-size: 22px; }
.ap-r5-instructor-specialty { color: var(--ap-subtle-contrast); font-size: 12.5px; line-height: 18px; }
.ap-r5-masterclass-filters .ap-field:first-child { flex: 1 1 0; }
.ap-r5-filter-reset { flex: 0 0 auto; }
.ap-r5-masterclass-table > thead > tr > th { font-size: 12.5px; }
.ap-r5-masterclass-table .ap-session-cell { width: 43%; }
/* 4 botons de 40 px + 3 espais de 4 px + 34 px de farciment. */
.ap-r5-masterclass-table .ap-actions-cell { width: 210px; min-width: 206px; }
.ap-r5-masterclass-table .ap-session-name { margin-bottom: 4px; }
.ap-r5-instructor-inline { display: inline-flex; align-items: center; gap: 10px; padding: 4px 0; border: 0; background: transparent; color: var(--ap-text); text-align: left; font-size: 14px; }
.ap-r5-instructor-inline:hover > span:last-child { color: var(--ap-link); }
.ap-r5-library-note { color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-r5-instructor-bio { --bs-offcanvas-width: 440px; max-width: 100%; }
.ap-r5-instructor-bio .offcanvas-header { align-items: center; gap: 16px; padding: 24px 24px 0; }
.ap-r5-instructor-bio .offcanvas-body { padding: 24px; }
.ap-r5-bio-avatar { width: 88px; height: 88px; margin-bottom: 24px; background: linear-gradient(140deg, #0269B8, #003DA6); font-size: 30px; }
.ap-r5-instructor-bio h2 { margin-bottom: 6px; font-size: 24px; }
.ap-r5-bio-specialty { margin-bottom: 24px; color: var(--ap-link); font-size: 14px; font-weight: 600; }
.ap-r5-bio-text { margin-bottom: 24px; color: var(--ap-secondary); font-size: 14px; line-height: 1.7; }
.ap-r5-bio-highlight { display: flex; align-items: center; gap: 12px; margin-bottom: 28px; padding: 16px; border: 1px solid var(--ap-border); border-radius: 10px; background: var(--ap-elevated); font-size: 14px; }
.ap-r5-bio-highlight .bi { color: var(--ap-link); font-size: 22px; }
.ap-r5-bio-action { width: 100%; white-space: normal; }
.ap-r5-masterclass-modal .modal-dialog { max-width: min(850px, calc(100vw - 32px)); margin-inline: auto; }
.ap-r5-masterclass-player { position: relative; display: flex; aspect-ratio: 16 / 9; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; border: 1px solid var(--ap-border); border-radius: 10px; background: radial-gradient(ellipse at 70% 20%, #163754, #091723 60%, #050B10); }
.ap-r5-player-topline { position: absolute; z-index: 1; top: 16px; right: 16px; left: 16px; display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12.5px; }
.ap-r5-player-visual { display: flex; width: 100%; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 32px 24px 76px; text-align: center; }
.ap-r5-player-visual > strong { font-size: clamp(17px, 2.1vw, 24px); }
.ap-r5-player-visual > span:not(.ap-avatar) { color: var(--ap-secondary); font-size: 14px; }
.ap-r5-player-avatar { width: 72px; height: 72px; margin-bottom: 8px; background: linear-gradient(140deg, #0269B8, #003DA6); font-size: 24px; }
.ap-r5-masterclass-player .ap-r5-player-toggle { position: absolute; bottom: 48px; left: calc(50% - 17px); border-color: #5E7A8E; background: #0B2132; color: #FFF; }
.ap-r5-masterclass-player .ap-r5-player-toggle:hover { background: #0276CF; border-color: #0276CF; }
.ap-r5-player-timeline { position: absolute; right: 16px; bottom: 16px; left: 16px; display: flex; align-items: center; gap: 10px; color: #CBCBCB; font-size: 12.5px; }
.ap-r5-player-progress { flex: 1; height: 4px; overflow: hidden; border-radius: 2px; background: #334958; }
.ap-r5-player-progress > span { display: block; width: 0; height: 100%; background: #56AFF2; transition: width 1s linear; }
.ap-r5-player-caption { padding-top: 12px; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-r5-player-chart { display: flex; width: 92%; height: 150px; align-items: end; justify-content: center; gap: 4px; border-bottom: 1px solid #425566; }
.ap-r5-player-chart > span { flex: 1; height: var(--ap-r5-bar-height); border-radius: 3px 3px 0 0; background: var(--ap-r5-bar-color); opacity: .88; }
.ap-r5-player-watts { position: absolute; top: 26%; right: 8%; padding: 4px 10px; border-radius: 8px; background: #091723; font-size: 28px !important; }
.ap-r5-player-watts > span { color: #CBCBCB; font-size: 14px; }
.ap-r5-is-playing .ap-r5-player-chart > span { animation: ap-r5-masterclass-pulse 2s ease-in-out var(--ap-r5-bar-delay) infinite alternate; }
@keyframes ap-r5-masterclass-pulse { to { opacity: .5; } }
@media (max-width: 1199.98px) {
  .ap-r5-how-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ap-r5-masterclass-table .ap-session-cell { width: 36%; }
}
@media (max-width: 991.98px) {
  .ap-r5-masterclass-table tbody tr { grid-template-columns: minmax(0, 1fr) auto; }
  .ap-r5-masterclass-table .ap-session-cell { width: auto; padding-right: 0; }
  .ap-r5-masterclass-table .ap-r5-instructor-cell { grid-column: 1 / -1; }
  .ap-r5-masterclass-table .ap-r5-duration-cell { grid-column: 1 / -1; color: var(--ap-subtle-contrast); font-size: 12.5px; }
  .ap-r5-masterclass-table .ap-actions-cell { grid-column: 1 / -1; width: auto; min-width: 0; text-align: left; }
  .ap-r5-masterclass-filters { gap: 16px; }
  .ap-r5-masterclass-filters .ap-field, .ap-r5-masterclass-filters .ap-field:first-child { flex: 1 1 calc(50% - 8px); }
  .ap-r5-filter-reset { flex: 1 1 100%; }
}
@media (max-width: 575.98px) {
  .ap-r5-how-toggle { padding: 12px 16px; }
  .ap-r5-how-steps { grid-template-columns: 1fr; gap: 20px; padding: 8px 16px 20px; }
  .ap-r5-section-heading { align-items: start; }
  .ap-r5-instructor-card { flex-basis: 160px; min-height: 166px; padding: 16px 10px; }
  .ap-r5-instructor-avatar { flex-basis: 56px; width: 56px; height: 56px; font-size: 20px; }
  .ap-r5-masterclass-filters .ap-field, .ap-r5-masterclass-filters .ap-field:first-child { flex-basis: 100%; }
  .ap-r5-filter-reset .btn { width: 100%; }
  .ap-r5-masterclass-library .ap-table-footer { align-items: start; }
  .ap-r5-library-note { display: none; }
  .ap-r5-instructor-bio .offcanvas-header { padding: 20px 20px 0; }
  .ap-r5-instructor-bio .offcanvas-body { padding: 20px; }
  .ap-r5-masterclass-modal .modal-header { padding: 20px 16px 8px; }
  .ap-r5-masterclass-modal .modal-body { padding: 12px 16px 20px; }
  .ap-r5-player-topline { top: 10px; right: 10px; left: 10px; }
  .ap-r5-player-topline > span:last-child { display: none; }
  .ap-r5-player-visual { gap: 3px; padding: 24px 12px 40px; }
  .ap-r5-player-avatar { display: none; }
  .ap-r5-masterclass-player .ap-r5-player-toggle { bottom: 32px; }
  .ap-r5-player-timeline { right: 10px; bottom: 10px; left: 10px; }
  .ap-r5-player-chart { height: 70px; gap: 3px; }
  .ap-r5-player-watts { top: 20%; font-size: 20px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .ap-r5-is-playing .ap-r5-player-chart > span { animation: none; }
  .ap-r5-player-progress > span { transition: none; }
}

.ap-r5-resource-layout { display: grid; grid-template-columns: minmax(0, 8fr) minmax(300px, 4fr); align-items: start; gap: 24px; }
.ap-r5-resource-layout > *, .ap-r5-resource-sidebar > *, .ap-r5-resource-line > * { min-width: 0; }
.ap-r5-resource-sidebar { display: grid; gap: 20px; }
.ap-r5-card-icon { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; flex-shrink: 0; border-radius: 10px; background: var(--ap-primary-soft); color: var(--ap-chip-text); font-size: 20px; }
.ap-r5-video-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 16px; }
.ap-r5-video-card { display: block; width: 100%; padding: 0; overflow: hidden; border: 1px solid var(--ap-border); border-radius: 14px; background: var(--ap-surface); color: var(--ap-text); text-align: left; box-shadow: var(--ap-card-shadow); transition: border-color .15s, transform .15s; }
.ap-r5-video-card:hover { border-color: var(--ap-link); transform: translateY(-2px); }
.ap-r5-video-card:focus-visible { outline-color: var(--ap-primary); }
.ap-r5-video-thumbnail { position: relative; display: flex; aspect-ratio: 16 / 9; align-items: center; justify-content: center; overflow: hidden; background: linear-gradient(145deg, hsl(var(--ap-r5-hue) 55% 31%), #10141a 95%); }
.ap-r5-video-thumbnail::before, .ap-r5-video-backdrop::before { position: absolute; width: 82%; height: 90%; border: 1px solid rgba(255,255,255,.12); border-radius: 30%; transform: rotate(-28deg); content: ""; }
.ap-r5-video-thumbnail::after { position: absolute; bottom: -90%; left: -10%; width: 115%; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.10); border-radius: 50%; content: ""; }
.ap-r5-thumbnail-play { z-index: 1; display: inline-flex; width: 34px; height: 34px; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.4); border-radius: 8px; background: rgba(0,0,0,.5); color: #fff; font-size: 20px; }
.ap-r5-video-duration { position: absolute; z-index: 1; bottom: 10px; right: 10px; padding: 2px 7px; border-radius: 5px; background: rgba(0,0,0,.78); color: #fff; font-size: 12.5px; font-weight: 600; }
.ap-r5-video-copy { display: block; padding: 14px 16px 16px; }
.ap-r5-video-copy strong { display: block; min-height: 42px; color: var(--ap-text-strong); font-size: 14px; line-height: 21px; font-weight: 700; }
.ap-r5-video-copy small { display: block; margin-top: 4px; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-r5-fullwidth { width: 100%; white-space: normal; }
.ap-r5-playlist-current { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--ap-border); }
.ap-r5-playlist-current .ap-help { display: flex; align-items: flex-start; gap: 8px; }
.ap-r5-playlist-current .ap-help .bi { margin-top: 3px; }
.ap-r5-resource-tip > .ap-r5-card-icon, .ap-r5-support-contact > .ap-r5-card-icon, .ap-r5-support-license > .ap-r5-card-icon { margin-bottom: 16px; }
.ap-r5-resource-tip h2, .ap-r5-support-contact h2, .ap-r5-support-license h2 { margin-bottom: 10px; }
.ap-r5-playlist-empty { min-height: 350px; }
.ap-r5-simulated-video { position: relative; display: flex; aspect-ratio: 16 / 9; align-items: center; justify-content: center; overflow: hidden; border-radius: 10px; background: #050505; color: #fff; }
.ap-r5-video-backdrop { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; background: radial-gradient(ellipse at 50% 30%, hsl(var(--ap-r5-hue, 206) 50% 21%), #050505 75%); }
.ap-r5-video-backdrop > .bi { opacity: .18; font-size: clamp(60px, 10vw, 110px); }
.ap-r5-video-toggle { z-index: 1; border-color: rgba(255,255,255,.6); background: rgba(0,0,0,.5); color: #fff; }
.ap-r5-video-toggle:hover { background: var(--ap-primary-hover); color: #fff; }
.ap-r5-simulated-video.ap-r5-is-playing .ap-r5-video-backdrop::before { animation: ap-r5-video-pulse 3s ease-in-out infinite alternate; }
.ap-r5-player-controls { position: absolute; z-index: 1; inset: auto 0 0; display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: rgba(0,0,0,.75); color: #fff; font-size: 12.5px; }
.ap-r5-player-controls input { flex: 1; min-width: 0; cursor: pointer; accent-color: var(--ap-primary); }
.ap-r5-support-search { margin-bottom: 20px; }
.ap-r5-support-groups { display: grid; gap: 20px; }
.ap-r5-support-group { padding-bottom: 8px; }
.ap-r5-support-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.ap-r5-support-heading h2 { margin: 0 0 3px; }
.ap-r5-support-heading p { margin: 0; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-r5-resource-list { padding: 0; margin: 0; list-style: none; }
.ap-r5-resource-line { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 76px; padding-block: 14px; border-top: 1px solid var(--ap-border); }
.ap-r5-file-icon { display: inline-flex; width: 34px; height: 34px; align-items: center; justify-content: center; border-radius: 8px; background: var(--ap-row-hover); color: var(--ap-subtle-contrast); font-size: 19px; }
.ap-r5-resource-name { display: block; color: var(--ap-text-strong); font-size: 14px; line-height: 1.5; font-weight: 600; }
.ap-r5-resource-domain { display: block; margin-top: 2px; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-r5-contact-line { display: flex; align-items: center; gap: 10px; padding-block: 10px; color: var(--ap-text); font-size: 14px; }
a.ap-r5-contact-line:hover { color: var(--ap-link); }
.ap-r5-contact-line > .bi { color: var(--ap-subtle-contrast); font-size: 17px; }
.ap-r5-contact-line strong { font-weight: 600; }
.ap-r5-contact-line small { display: block; margin-top: 2px; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-r5-license-code { color: var(--ap-text); font-size: 12.5px; font-weight: 600; overflow-wrap: anywhere; }
.ap-r5-resource-preview { display: flex; min-height: 150px; flex-direction: column; align-items: center; justify-content: center; gap: 12px; border: 1px solid var(--ap-border); border-radius: 10px; background: var(--ap-row-hover); color: var(--ap-chip-text); }
.ap-r5-resource-preview .bi { font-size: 48px; }
.ap-r5-resource-preview span { font-size: 12.5px; font-weight: 700; letter-spacing: .08em; }
.ap-r5-resource-meta { margin-bottom: 0; font-size: 12.5px; }
.ap-r5-resource-meta > div { display: flex; justify-content: space-between; gap: 16px; padding-block: 8px; border-top: 1px solid var(--ap-border); }
.ap-r5-resource-meta dt { color: var(--ap-subtle-contrast); font-weight: 400; }
.ap-r5-resource-meta dd { margin: 0; }
.ap-r5-public-notice { margin-bottom: 24px; }
@keyframes ap-r5-video-pulse { from { opacity: .4; transform: rotate(-28deg) scale(.85); } to { opacity: 1; transform: rotate(-20deg) scale(1); } }
@media (min-width: 1600px) { .ap-r5-video-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1199.98px) { .ap-r5-resource-layout { grid-template-columns: minmax(0, 8fr) minmax(270px, 4fr); gap: 20px; } .ap-r5-resource-sidebar .card { padding: 20px; } }
@media (max-width: 991.98px) { .ap-r5-resource-layout { grid-template-columns: minmax(0, 1fr); } .ap-r5-resource-sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ap-r5-resource-sidebar:has(.ap-r5-playlist-settings) { grid-row: 1; grid-template-columns: minmax(0, 1fr); } .ap-r5-resource-tip { display: none; } }
@media (max-width: 575.98px) { .ap-r5-resource-sidebar { grid-template-columns: minmax(0, 1fr); } .ap-r5-video-grid { gap: 16px 12px; } .ap-r5-video-copy { padding: 12px; } .ap-r5-video-copy strong { min-height: 63px; } .ap-r5-video-duration { bottom: 8px; right: 8px; } .ap-r5-resource-line { grid-template-columns: 30px minmax(0, 1fr); gap: 10px; padding-block: 16px; } .ap-r5-resource-line .btn { grid-column: 2; justify-self: start; margin-top: 2px; } .ap-r5-file-icon { width: 30px; height: 30px; } .ap-r5-support-heading { align-items: flex-start; } .ap-r5-support-group, .ap-r5-support-search { padding: 20px; } .ap-r5-support-group { padding-bottom: 4px; } .ap-r5-player-controls { gap: 8px; padding: 10px 12px; } .ap-r5-section-heading { margin-top: 4px; } }
@media (prefers-reduced-motion: reduce) { .ap-r5-simulated-video.ap-r5-is-playing .ap-r5-video-backdrop::before { animation: none; } .ap-r5-video-card:hover { transform: none; } }

/* Closca pública · alta, recuperació i estats. Mateix fons que el login. */
.ap-public { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 100vh; min-height: 100svh; overflow: clip; padding: 84px 32px 28px; background: #000; }
.ap-public-content { position: relative; z-index: 1; width: 100%; max-width: 1120px; }
.ap-public-brand { position: relative; z-index: 1; margin: 0 auto 24px; text-align: center; }
.ap-public-brand img { width: 170px; max-width: 100%; height: auto; }
.ap-public-footer { position: relative; z-index: 1; display: flex; justify-content: center; flex-wrap: wrap; gap: 10px 24px; margin-top: 32px; color: #CBCBCB; font-size: 12.5px; }
.ap-public a:not(.btn):not(.ap-iconbtn) { color: #64B8F7; }
.ap-public a:not(.btn):not(.ap-iconbtn):hover { color: #8EC9F8; }
.ap-public .ap-login-languages a { color: #CBCBCB; }
.ap-public .ap-login-languages a.active { color: #FFF; }
.ap-public .card { background: #1C1C1D; border-color: #2E2E30; }
.ap-public-heading { margin-bottom: 24px; }
.ap-public-heading h1 { margin: 0 0 10px; font-size: 28px; }
.ap-public-heading p:last-child { margin: 0; color: #CBCBCB; }
.ap-public .ap-eyebrow { font-size: 12.5px; }
.ap-public .btn-primary { --bs-btn-color: #FFF; --bs-btn-bg: #0276CF; --bs-btn-border-color: #0276CF; --bs-btn-hover-bg: #0269B8; --bs-btn-hover-border-color: #0269B8; --bs-btn-disabled-color: #FFF; --bs-btn-disabled-bg: #0276CF; --bs-btn-disabled-border-color: #0276CF; }
.ap-public-submit { min-height: 42px; margin-top: 16px; white-space: normal; }
.ap-public-return { margin: 20px 0 0; color: #CBCBCB; text-align: center; }
.ap-public-return a { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; font-weight: 600; }
.ap-public .form-control { height: 42px; padding-block: 10px; }
.ap-public-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.ap-public-field { min-width: 0; }
.ap-public-field .form-label { display: block; }
.ap-public-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.ap-public-fields .ap-public-field:has(input[type="email"]) { grid-column: 1 / -1; }
.ap-public-field:has(.is-invalid) > .invalid-feedback { display: block; }
.ap-public input.is-invalid { padding-right: 13px; background-image: none; }
.ap-password-control { position: relative; }
.ap-password-control .form-control, .ap-public .ap-password-control .is-invalid { padding-right: 46px; }
.ap-password-control .ap-iconbtn { position: absolute; top: 4px; right: 4px; }
.ap-signup-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 24px; align-items: start; }
.ap-signup-plan { position: sticky; top: 24px; padding: 32px; background-image: linear-gradient(155deg, #1C1C1D 30%, #102639 100%) !important; }
.ap-signup-plan h2 { margin-bottom: 12px; font-size: 24px; }
.ap-plan-intro, .ap-plan-benefits { color: #CBCBCB; }
.ap-plan-price { display: flex; align-items: baseline; gap: 8px; margin: 26px 0 12px; }
.ap-plan-price strong { color: #FFF; font-size: clamp(38px, 3.5vw, 48px); line-height: 1; font-weight: 800; letter-spacing: -.03em; }
.ap-plan-price span { color: #CBCBCB; }
.ap-plan-trial { border: 1px solid #27526A; background: #143447; color: #8EC9F8; font-size: 12.5px; }
.ap-plan-features { display: flex; flex-direction: column; gap: 18px; margin: 28px 0; padding: 0; list-style: none; }
.ap-plan-features li { display: flex; align-items: start; gap: 12px; }
.ap-plan-features .bi { margin-top: 3px; color: #2DD55B; font-size: 18px; }
.ap-plan-benefits { margin-bottom: 26px; }
.ap-plan-device { display: flex; align-items: start; gap: 12px; padding: 18px 0 0; border-top: 1px solid #345063; }
.ap-plan-device .bi { margin-top: 3px; color: #F5B869; font-size: 22px; }
.ap-plan-device p { margin: 0; }
.ap-plan-device span { display: block; margin-top: 4px; color: #CBCBCB; font-size: 12.5px; }
.ap-signup-form { padding: 28px; }
.ap-signup-form .ap-form-section + .ap-form-section { margin-top: 20px; padding-top: 20px; }
.ap-signup-form .ap-form-section h2 { margin-bottom: 14px; }
.ap-signup-consent { margin-top: 20px; }
.ap-signup-consent .form-check { padding-left: 26px; }
.ap-signup-consent .form-check-input { margin-left: -26px; }
.ap-signup-consent a { text-decoration: underline; text-underline-offset: 3px; }
.ap-signup-consent .invalid-feedback { margin-left: 26px; }
.ap-signup-consent .form-check-input.is-invalid { border-color: #DC3545; }
.ap-captcha-field { max-width: 220px; margin-top: 18px; }
.ap-captcha-field .form-text { margin-bottom: 0; }
.ap-signup-form .alert p { margin: 8px 0; }
.ap-public-content--recupera { max-width: 460px; }
.ap-recovery-card { padding: 32px; }
.ap-recovery-card #infoMessage:empty { display: none; }
.ap-recovery-card #infoMessage .alert { margin-bottom: 20px; }
.ap-status-panel { width: 100%; max-width: 520px; margin: 0 auto; padding: 36px; border: 1px solid #2E2E30; border-radius: 14px; background: #1C1C1D; text-align: center; }
.ap-status-icon { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin: 0 auto 24px; border-radius: 14px; font-size: 28px; }
.ap-status-icon--success { background: #123A28; color: #70E6AB; }
.ap-status-icon--warning { background: #443018; color: #F5B869; }
.ap-status-icon--danger { background: #441E26; color: #FF96A2; }
.ap-status-icon--neutral { background: #2E2E30; color: #CBCBCB; }
.ap-status-panel h1 { margin: 0; font-size: 28px; }
.ap-status-text { margin: 16px 0 28px; color: #CBCBCB; }
.ap-status-action { white-space: normal; }
.ap-status-subaction { display: block; margin-top: 18px; font-weight: 600; }
.ap-status-code { display: block; margin-top: 24px; color: #A5A5A5; font: 400 12.5px/1.5 ui-monospace, monospace; }
.ap-status-detail { margin-top: 20px; color: #CBCBCB; }
.ap-status-detail p { margin: 0 0 8px; }
.ap-legal-layout { display: grid; grid-template-columns: 240px minmax(0, 760px); justify-content: center; gap: 40px; align-items: start; }
.ap-legal-index { position: sticky; top: 32px; padding: 16px 0; }
.ap-legal-index a { display: block; margin-bottom: 6px; padding: 10px 14px; border-left: 3px solid transparent; border-radius: 0 8px 8px 0; color: #CBCBCB !important; font-size: 12.5px; }
.ap-legal-index a[aria-current="true"], .ap-legal-index a.active { border-color: #0080E2; background: #1C1C1D; color: #FFF !important; }
.ap-legal-copy { width: 100%; max-width: 760px; padding: 36px; border: 1px solid #2E2E30; border-radius: 14px; background: #1C1C1D; }
.ap-legal-copy h1 { font-size: 28px; }
.ap-legal-copy > header { margin-bottom: 32px; }
.ap-legal-copy p { color: #CBCBCB; line-height: 1.8; }
.ap-legal-section { scroll-margin-top: 32px; }
.ap-legal-section + .ap-legal-section { margin-top: 32px; padding-top: 28px; border-top: 1px solid #2E2E30; }
.ap-legal-section h2 { margin-bottom: 16px; }
.ap-legal-copy > footer { margin-top: 32px; }
.ap-mail-preview-page { background: #101011; }
.ap-mail-preview-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 32px; border-bottom: 1px solid #2E2E30; background: #000; }
.ap-mail-preview-bar a { color: #CBCBCB; }
.ap-mail-preview-bar .ap-segmented a { min-height: 34px; padding: 8px 14px; border-radius: 999px; font-size: 12.5px; font-weight: 700; }
.ap-mail-preview-bar .ap-segmented a.active { background: #262626; color: #FFF; }
.ap-mail-preview { padding: 40px 24px; }
.ap-mail-preview > section { margin-inline: auto; }
@media (max-width: 1199.98px) {
  .ap-legal-layout { display: block; }
  .ap-legal-index { display: none; }
  .ap-legal-copy { margin-inline: auto; }
}
@media (max-width: 767.98px) {
  .ap-public { padding: 84px 20px 24px; }
  .ap-public-brand { margin-bottom: 24px; }
  .ap-signup-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .ap-signup-plan { position: static; padding: 24px; }
  .ap-plan-features { gap: 14px; margin-block: 24px; }
  .ap-public-heading h1, .ap-status-panel h1 { font-size: 25px; }
  .ap-signup-form, .ap-recovery-card, .ap-status-panel, .ap-legal-copy { padding: 24px; }
  .ap-public-fields { grid-template-columns: 1fr; }
  .ap-public .ap-login-languages { right: 20px; top: 24px; }
  .ap-captcha-field { max-width: none; }
  .ap-public-return { font-size: 14px; }
  .ap-mail-preview-bar { padding: 16px 20px; }
  .ap-mail-preview-bar .ap-segmented { display: flex; width: 100%; justify-content: space-between; gap: 0; }
  .ap-mail-preview-bar .ap-segmented a { padding-inline: 10px; white-space: nowrap; }
  .ap-mail-preview { padding: 24px 12px; }
}

.ap-legal-actions { margin-top: 32px; }
.ap-mail-demo-note, .ap-mail-example-caption { max-width: 600px; margin: 0 auto 20px; color: #CBCBCB; font-size: 12.5px; text-align: center; overflow-wrap: anywhere; }
.ap-mail-example-caption { margin-top: 18px; }
.ap-mail-example-caption code { color: inherit; font-size: inherit; overflow-wrap: anywhere; }
.ap-mail-preview-home { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; font-size: 12.5px; }
.ap-mail-preview-label { font-size: 12.5px; color: #A5A5A5; }
@media (max-width: 767.98px) { .ap-mail-preview-label { display: none; } }

.ap-editor-featured-variants.ap-r6-variants { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(100%, 680px); gap: 8px; }
.ap-r6-variants .ap-chip { justify-content: center; min-height: 32px; text-align: center; white-space: normal; }
@media (max-width: 575.98px) { .ap-editor-featured-variants.ap-r6-variants { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Ronda 7 · formularis d'administració */
/* Existing form components are reused; additions apply to this family only. */
.ap-r7 .ap-eyebrow, .ap-r7 .ap-chip, .ap-r7 .ap-nav-group-label, .ap-r7 .ap-languages button, .ap-r7 .ap-demo-panel, .ap-r7 .ap-demo-control { font-size: 12.5px; }
.ap-r7 .ap-muted, .ap-r7 .form-text { color: #BABABC; }
.ap-r7 .ap-form-card { min-width: 0; max-width: 860px; }
.ap-r7 .form-label { display: block; margin-bottom: 8px; font-weight: 600; }
.ap-r7 .form-control:not([type=range]), .ap-r7 .form-select, .ap-r7 .input-group-text { min-height: 42px; border-radius: 10px; background-color: #262626; border-color: #2E2E30; font-size: 14px; color: #FFF; }
.ap-r7 .form-control:read-only, .ap-r7 .form-control:disabled, .ap-r7 .form-select:disabled { color: #CBCBCB; opacity: 1; }
.ap-r7 .form-control.is-invalid, .ap-r7 .form-select.is-invalid { border-color: #F4848E; }
.ap-r7 .invalid-feedback { color: #FF9AA3; }
.ap-r7 textarea.form-control { min-height: 104px; }
.ap-r7 .ap-form-section h2 { margin-bottom: 12px; }
.ap-r7 .ap-form-actions { margin-top: 24px; padding-top: 22px; }
.ap-r7 .ap-iconbtn, .ap-r7 .btn-close { width: 34px; height: 34px; min-height: 34px; border-radius: 8px; flex: 0 0 34px; }
.ap-r7 .ap-table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; }
.ap-r7 .btn-close { box-sizing: border-box; padding: 8px; background-size: 14px; }
.ap-r7 .alert-dismissible { padding-right: 52px; }
.ap-r7 .alert-dismissible .btn-close { top: 9px; right: 9px; }
.ap-r7 .form-check-input { flex-shrink: 0; }
.ap-r7 .ap-table-intro { flex-wrap: wrap; }
.ap-r7 .ap-table-intro h2 { flex-wrap: wrap; }
.ap-r7 code { color: #A8D7FF; font-size: 12.5px; overflow-wrap: anywhere; }
.ap-r7-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.ap-r7-form-layout { display: grid; grid-template-columns: minmax(0, 2.1fr) minmax(250px, 1fr); gap: 24px; align-items: start; }
.ap-r7-help-card { position: sticky; top: 92px; min-width: 0; }
.ap-r7-help-card .ap-kpi-icon { margin-bottom: 20px; }
.ap-r7-help-card p { color: #CBCBCB; }
.ap-r7-language { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 12.5px; }
.ap-r7-language .form-select { width: 142px; }
.ap-r7-name-meta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 7px; }
.ap-r7-language-chip { border: 1px solid #404040; background-color: #262626; color: #CBCBCB; cursor: help; }
.ap-r7-video-table td:first-child { width: 35%; }
.ap-r7-video-table code { white-space: normal; }
.ap-r7-script-input { flex-wrap: nowrap; }
.ap-r7 .ap-r7-script-input .input-group-text { font-size: 12.5px; padding-left: 10px; padding-right: 10px; border-radius: 10px 0 0 10px; }
.ap-r7 .ap-r7-script-input .input-group-text:last-child { border-radius: 0 10px 10px 0; }
.ap-r7 .ap-r7-script-input .form-control { min-width: 0; border-radius: 0; }
.ap-r7-impact { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); gap: 14px; align-items: center; margin-bottom: 24px; }
.ap-r7-impact > div { background: #262626; border: 1px solid #404040; padding: 16px; border-radius: 10px; min-width: 0; }
.ap-r7-impact strong, .ap-r7-impact code { display: block; overflow-wrap: anywhere; }
.ap-r7-impact code { margin-top: 12px; }
.ap-r7-impact-arrow { font-size: 24px; }
@media (max-width: 1199.98px) { .ap-r7-form-layout { grid-template-columns: minmax(0,1fr); max-width: 860px; } .ap-r7-help-card { position: static; } }
@media (max-width: 575.98px) {
  .ap-r7-grid { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .ap-r7 .ap-page-heading, .ap-r7 .ap-heading-actions { min-width: 0; }
  .ap-r7 .ap-heading-actions .btn, .ap-r7 .ap-form-actions .btn { white-space: normal; text-align: center; }
  .ap-r7-video-table thead { display: none; }
  .ap-r7-video-table tbody, .ap-r7-video-table tr { display: block; }
  .ap-r7-video-table tr { padding: 18px 20px; border-bottom: 1px solid #2E2E30; }
  .ap-r7 .ap-r7-video-table td { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 7px 0; border: 0; width: auto; min-width: 0; }
  .ap-r7-video-table td::before { content: attr(data-label); width: 60px; font-size: 12.5px; color: #BABABC; }
  .ap-r7-video-table td:first-child { display: block; }
  .ap-r7-video-table td:first-child::before { display: none; }
  .ap-r7-video-table td[data-label=Accions] { justify-content: flex-end; }
  .ap-r7-video-table td[data-label=Accions]::before { margin-right: auto; }
  .ap-r7-impact { grid-template-columns: minmax(0,1fr); }
  .ap-r7-impact-arrow { text-align: center; transform: rotate(90deg); }
  .ap-r7 .modal-dialog { margin: 12px; }
}
.ap-r7-card-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
.ap-r7-card-heading h2 { margin: 0; }
.ap-r7-meta { display: flex; gap: 8px; }
.ap-r7-field + .ap-r7-field { margin-top: 20px; }
.ap-r7 .ap-required { color: #75BBF1; }
.ap-r7 .ap-field-optional { margin-left: 5px; color: var(--ap-subtle-contrast); font-size: 12.5px; font-weight: 400; }
.ap-download-form-card { max-width: 1040px; }
.ap-download-lang-row { display: grid; grid-template-columns: 124px repeat(2, minmax(0, 1fr)); align-items: start; gap: 18px; padding-block: 16px; border-bottom: 1px solid var(--ap-border); }
.ap-download-lang-row:last-child { padding-bottom: 0; border: 0; }
.ap-download-lang-row .ap-r7-field { margin-top: 0; min-width: 0; }
.ap-download-lang-label { display: flex; align-items: center; gap: 10px; min-height: 42px; padding-top: 30px; font-weight: 600; }
.ap-download-lang-label .ap-chip { min-width: 36px; justify-content: center; }
.ap-download-public-row { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 24px; }
.ap-download-public-row .form-text { margin-bottom: 0; max-width: 560px; }
.ap-download-public-row .form-switch { padding-left: 0; margin: 0; flex: 0 0 auto; }
.ap-download-public-row .form-switch .form-check-input { width: 40px; height: 22px; margin: 0; border-radius: 20px; }
.ap-download-groups { border: 0; padding: 0; margin: 0; }
.ap-download-group-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.ap-download-group-options .ap-option strong { overflow-wrap: anywhere; }
@media (max-width: 1199.98px) {
  .ap-download-group-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .ap-download-lang-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-block: 20px; }
  .ap-download-lang-label { grid-column: 1 / -1; min-height: 0; padding-top: 0; }
  .ap-download-group-options { grid-template-columns: 1fr; }
}
@media (max-width: 479.98px) {
  .ap-download-lang-row { grid-template-columns: 1fr; gap: 14px; }
}
/* Publicitat i confirmació de desactivació. */
.ap-r7-ad-profile-links { display:flex; flex-wrap:wrap; gap:8px 24px; margin-bottom:24px; padding-bottom:12px; border-bottom:1px solid var(--ap-border); }
.ap-r7-ad-profile-links a { color:var(--ap-subtle-contrast); font-weight:600; padding:6px 0; }
.ap-r7-ad-profile-links a.active { color:var(--ap-text-strong); box-shadow:0 2px var(--ap-primary); }
.ap-r7-ad-profile-links a:hover { color:var(--ap-link); }
.ap-r7-ad-table { margin-bottom:0; }
.ap-r7-ad-table th:first-child { width:40%; }
.ap-r7-ad-thumbnails { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.ap-r7-ad-thumbnail { position:relative; display:block; width:88px; height:58px; padding:0; overflow:hidden; border:1px solid var(--ap-border); border-radius:8px; background:var(--ap-surface); }
.ap-r7-ad-thumbnail img { display:block; width:100%; height:100%; object-fit:cover; }
.ap-r7-ad-thumbnail::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.32),transparent); pointer-events:none; }
.ap-r7-ad-image-number { position:absolute; z-index:1; left:5px; bottom:3px; color:#fff; font-size:12.5px; font-weight:700; text-shadow:0 1px 3px #000; }
.ap-r7-ad-title { display:block; margin-top:8px; color:var(--ap-text-strong); font-weight:600; }
.ap-r7-ad-offcanvas { --bs-offcanvas-width:680px; max-width:100%; background:#141415; }
.ap-r7-ad-offcanvas .offcanvas-header { padding:24px 24px 0; align-items:start; gap:20px; }
.ap-r7-ad-offcanvas .offcanvas-body { padding:24px; }
.ap-r7-ad-offcanvas .ap-form-card { padding:0; background:transparent; border:0; box-shadow:none; }
.ap-r7-ad-repeat { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:22px; }
.ap-r7-form-legend { color:var(--ap-text-strong); font-size:15px; font-weight:700; margin-bottom:12px; }
.ap-r7-ad-image-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.ap-r7-ad-image-option { position:relative; display:flex; flex-direction:column; min-width:0; padding:0; overflow:hidden; border:2px solid var(--ap-border); border-radius:10px; background:#262626; cursor:pointer; }
.ap-r7-ad-image-option:has(:checked) { border-color:var(--ap-primary); background:rgba(0,128,226,.15); }
.ap-r7-ad-image-option:has(:focus-visible) { outline:2px solid var(--ap-primary); outline-offset:3px; }
.ap-r7-ad-image-option img { display:block; width:100%; height:70px; object-fit:cover; }
.ap-r7-ad-image-option > .form-check-input { position:absolute; top:7px; right:7px; margin:0; box-shadow:0 0 0 2px rgba(0,0,0,.4); z-index:1; }
.ap-r7-ad-image-label { min-height:44px; padding:7px; color:var(--ap-text); font-size:12.5px; line-height:1.35; overflow-wrap:anywhere; }
.ap-r7-ad-image-placeholder { display:flex; height:70px; align-items:center; justify-content:center; color:var(--ap-subtle-contrast); font-size:24px; }
.ap-r7-ad-image-option--missing { cursor:not-allowed; }
.ap-r7-ad-image-option--missing .ap-r7-ad-image-label { color:var(--ap-subtle-contrast); }
.ap-r7-ad-image-grid.is-invalid { border:1px solid var(--ap-danger-text); border-radius:12px; padding:6px; }
.ap-r7-ad-image-grid.is-invalid + .invalid-feedback { display:block; }
.ap-r7-ad-missing { display:flex; align-items:start; gap:10px; margin-top:16px; margin-bottom:0; font-size:12.5px; }
.ap-r7-ad-missing .bi { margin-top:3px; font-size:16px; }
.ap-r7-ad-preview-image { display:block; width:100%; max-height:60vh; object-fit:contain; border-radius:10px; }
.ap-r7-deactivate-card { max-width:760px; }
.ap-r7-deactivate-heading { display:flex; align-items:center; gap:16px; margin-bottom:24px; }
.ap-r7-danger-icon { display:inline-flex; flex:0 0 48px; width:48px; height:48px; align-items:center; justify-content:center; border-radius:12px; background:rgba(220,53,69,.12); color:var(--ap-danger-text); font-size:24px; }
.ap-r7-deactivate-user { display:flex; align-items:center; gap:12px; padding:16px; margin-top:20px; background:#262626; border:1px solid var(--ap-border); border-radius:10px; }
.ap-r7-deactivate-user .ap-chip { margin-left:auto; }
.ap-r7-confirm-options { display:grid; gap:10px; }
.ap-r7-confirm-option { display:flex; align-items:start; gap:12px; padding:14px 16px; border:1px solid var(--ap-border); border-radius:10px; background:#262626; cursor:pointer; }
.ap-r7-confirm-option .form-check-input { flex:0 0 18px; margin-top:3px; }
.ap-r7-confirm-option:has(:checked) { border-color:var(--ap-primary); background:rgba(0,128,226,.12); }
.ap-r7-confirm-option:has(#confirm-yes:checked) { border-color:var(--ap-danger-text); background:rgba(220,53,69,.12); }
.ap-r7-confirm-option:has(:focus-visible) { outline:2px solid var(--ap-primary); outline-offset:3px; }
.ap-r7-deactivate-card .ap-form-actions { margin-top:20px; }
@media (max-width:767.98px) {
  .ap-r7-ad-table thead { display:none; }
  .ap-r7-ad-table, .ap-r7-ad-table tbody { display:block; }
  .ap-r7-ad-table tr { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:20px 16px; border-bottom:1px solid var(--ap-border); }
  .ap-r7-ad-table td { display:block; padding:0 !important; border:0; text-align:left !important; }
  .ap-r7-ad-table td:first-child, .ap-r7-ad-table td:last-child { grid-column:1 / -1; }
  .ap-r7-ad-table td[data-label]::before { content:attr(data-label); display:block; margin-bottom:4px; color:var(--ap-subtle-contrast); font-size:12.5px; }
  .ap-r7-ad-table .ap-actions { justify-content:flex-start; }
  .ap-r7-ad-library .ap-table-footer { display:flex; flex-direction:column; align-items:start; gap:6px; }
  .ap-r7-ad-library .ap-table-hint { display:none; }
  .ap-r7-ad-offcanvas .offcanvas-header { padding:20px 16px 0; }
  .ap-r7-ad-offcanvas .offcanvas-body { padding:20px 16px; }
}
@media (max-width:575.98px) {
  .ap-r7-ad-image-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ap-r7-ad-image-option img, .ap-r7-ad-image-placeholder { height:100px; }
  .ap-r7-deactivate-heading { align-items:start; }
  .ap-r7-deactivate-user { flex-wrap:wrap; }
  .ap-r7-deactivate-user .ap-chip { margin-left:60px; }
  .ap-r7-confirm-option { padding:12px; }
}
/* Editor de colors, dins la secció Ronda 7. */
.ap-r7 .ap-cc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.ap-r7 .ap-cc-card { max-width: none; min-width: 0; padding: 24px; }
.ap-r7 .ap-cc-card-heading { display: flex; gap: 12px; justify-content: space-between; align-items: center; }
.ap-r7 .ap-cc-card-heading h2 { display: flex; gap: 10px; align-items: center; margin-bottom: 10px; }
.ap-r7 .ap-cc-card-heading h2 .bi { color: #66baff; }
.ap-r7 .ap-cc-palettes { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; min-width: 0; margin-top: 20px; }
.ap-r7 .ap-cc-palettes legend { flex: 0 0 100%; margin: 0; }
.ap-r7 .ap-cc-palettes .ap-segmented { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; gap: 3px; }
.ap-r7 .ap-cc-palettes .ap-segmented button { padding: 8px 7px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; min-width: 0; white-space: normal; border-radius: 999px; }
.ap-r7 .ap-cc-restore { min-height: 34px; padding: 4px 0; color: #8dcdff; font-size: 13px; text-align: left; }
.ap-r7 .ap-cc-stack { display: flex; height: 38px; margin-top: 18px; border-radius: 8px; overflow: hidden; width: 100%; background: #262626; }
.ap-r7 .ap-cc-stack > span { display: flex; flex-basis: 0; min-width: 0; align-items: center; justify-content: center; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.ap-r7 .ap-cc-stack > span > span { font-size: 12.5px; font-weight: 700; }
.ap-r7 .ap-cc-table { margin: 0; width: 100%; table-layout: fixed; font-size: 14px; }
.ap-r7 .ap-cc-table th:first-child { width: 27%; }
.ap-r7 .ap-cc-table th:nth-child(2) { width: 28%; }
.ap-r7 .ap-cc-table th:nth-child(3) { width: 34%; }
.ap-r7 .ap-cc-table th:nth-child(4) { width: 11%; }
.ap-r7 .ap-cc-table > :not(caption) > * > * { background: transparent; padding: 10px 4px; vertical-align: middle; border-color: #2e2e30; }
.ap-r7 .ap-cc-table thead th { font-size: 12.5px; color: #b5b5b8; font-weight: 600; }
.ap-r7 .ap-cc-table tbody th { font-weight: 600; }
.ap-r7 .ap-cc-zone-number { font-size: 14px; }
.ap-r7 .ap-cc-range { display: block; font-weight: 400; margin-top: 2px; overflow-wrap: anywhere; }
.ap-r7 .ap-cc-limit .form-control { width: 0; min-width: 0; height: 38px; padding-inline: 9px; border-radius: 10px 0 0 10px; }
.ap-r7 .ap-cc-limit .input-group-text { background: #262626; border-color: #2e2e30; color: #b5b5b8; padding-inline: 8px; border-radius: 0 10px 10px 0; font-size: 12.5px; }
.ap-r7 .ap-cc-limit input::-webkit-inner-spin-button { opacity: 1; }
.ap-r7 .ap-cc-open { font-size: 19px; line-height: 1.2; }
.ap-r7 .ap-cc-open .ap-help { display: block; margin-top: 3px; font-size: 12.5px; }
.ap-r7 .ap-cc-color { display: inline-flex; align-items: center; gap: 8px; width: 100%; min-height: 38px; padding: 4px; border: 1px solid transparent; background: transparent; border-radius: 8px; color: #eaeaea; text-align: left; font-size: 12.5px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.ap-r7 .ap-cc-color:hover { background: #262626; border-color: #3e3e40; }
.ap-r7 .ap-cc-color > span:first-child { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); }
.ap-r7 .ap-cc-table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; padding: 0; border-radius: 8px; }
.ap-r7 .ap-cc-card-actions { justify-content: space-between; gap: 12px; margin-top: 14px; padding-top: 18px; }
.ap-r7 .ap-cc-card-actions .ap-help { flex: 1 1 120px; margin: 0; }
.ap-r7 .ap-cc-card-actions .btn { min-height: 38px; font-size: 13px; padding-inline: 12px; }
.ap-r7 .ap-cc-savebar { position: sticky; z-index: 1015; bottom: 20px; margin-top: 24px; padding: 18px 24px; border: 1px solid #3d3d40; border-radius: 12px; background: #1c1c1d; box-shadow: 0 8px 24px rgba(0,0,0,.4); justify-content: space-between; }
.ap-r7 .ap-cc-dirty { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; }
.ap-r7 .ap-cc-dirty > .bi { font-size: 8px; color: #ffd082; }
.ap-r7 .ap-cc-save-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.ap-r7 .ap-cc-plane { position: relative; width: 100%; height: 200px; border: 1px solid #4b4b4d; border-radius: 10px; touch-action: none; cursor: crosshair; background: linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, transparent), hsl(var(--cc-hue, 0), 100%, 50%); }
.ap-r7 .ap-cc-cursor { position: absolute; width: 16px; height: 16px; border: 2px solid #fff; border-radius: 50%; box-shadow: 0 0 0 1px #000; transform: translate(-50%, -50%); pointer-events: none; }
.ap-r7 .ap-cc-hue { display: block; appearance: none; width: 100%; height: 22px; border: 1px solid #4b4b4d; border-radius: 8px; background: linear-gradient(to right, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00); cursor: pointer; }
.ap-r7 .ap-cc-hue::-webkit-slider-thumb { appearance: none; width: 12px; height: 28px; border: 2px solid #1a1a1a; border-radius: 4px; background: #fff; }
.ap-r7 .ap-cc-hue::-moz-range-thumb { width: 10px; height: 26px; border: 2px solid #1a1a1a; border-radius: 4px; background: #fff; }
.ap-r7 .ap-cc-hex-row { display: grid; grid-template-columns: minmax(0, 1fr) 110px; gap: 20px; }
.ap-r7 .ap-cc-hex-row .form-control { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; text-transform: uppercase; }
.ap-r7 .ap-cc-preview { display: flex; align-items: center; justify-content: center; height: 42px; border-radius: 10px; border: 1px solid rgba(255,255,255,.24); font-weight: 700; }
.ap-r7 .ap-cc-swatches { display: grid; grid-template-columns: repeat(4, 34px); gap: 12px; }
.ap-r7 .ap-cc-swatches .ap-cc-swatch { width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.24); border-radius: 8px; }
.ap-r7 .ap-cc-table .invalid-feedback { font-size: 12.5px; overflow-wrap: anywhere; }
.ap-r7 .ap-cc-plane:focus-visible, .ap-r7 .ap-cc-hue:focus-visible, .ap-r7 .ap-cc-color:focus-visible, .ap-r7 .ap-cc-swatch:focus-visible { outline: 2px solid #8dccff; outline-offset: 3px; }
@media (max-width: 1199.98px) {
  .ap-r7 .ap-cc-grid { grid-template-columns: 1fr; }
  .ap-r7 .ap-cc-card { max-width: 800px; }
}
@media (max-width: 575.98px) {
  .ap-r7 .ap-cc-card { padding: 18px; }
  .ap-r7 .ap-cc-card-heading { gap: 8px; align-items: flex-start; }
  .ap-r7 .ap-cc-card-heading h2 { font-size: 18px; }
  .ap-r7 .ap-cc-card-heading > .ap-chip { white-space: nowrap; }
  .ap-r7 .ap-cc-palettes .ap-segmented { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ap-r7 .ap-cc-palettes .ap-segmented button { padding-inline: 4px; }
  .ap-r7 .ap-cc-palettes .ap-segmented button:last-child { grid-column: 1 / -1; }
  .ap-r7 .ap-cc-table th:first-child { width: 25%; }
  .ap-r7 .ap-cc-table th:nth-child(2) { width: 32%; }
  .ap-r7 .ap-cc-table th:nth-child(3) { width: 29%; }
  .ap-r7 .ap-cc-table th:nth-child(4) { width: 14%; }
  .ap-r7 .ap-cc-color { flex-direction: column; align-items: flex-start; gap: 4px; padding: 3px; }
  .ap-r7 .ap-cc-color > span:first-child { flex-basis: 24px; }
  .ap-r7 .ap-cc-limit .form-control { padding-inline: 7px; }
  .ap-r7 .ap-cc-limit .input-group-text { padding-inline: 5px; }
  .ap-r7 .ap-cc-range { font-size: 12.5px; }
  .ap-r7 .ap-cc-stack > span > span { display: none; }
  .ap-r7 .ap-cc-savebar { bottom: 12px; padding: 16px; gap: 14px; }
  .ap-r7 .ap-cc-dirty { width: 100%; }
  .ap-r7 .ap-cc-save-actions { width: 100%; justify-content: flex-end; gap: 8px; }
  .ap-r7 .ap-cc-save-actions .btn { padding-inline: 14px; }
  .ap-r7 .ap-cc-plane { height: 180px; }
  .ap-r7 .ap-cc-swatches { gap: 10px; }
}
/* Integration refinements: proportional stacks and the shared alert layout. */
.ap-r7 .ap-cc-stack > span { height: 100%; }
.ap-r7 .ap-cc-limit .form-control, .ap-r7 .ap-cc-limit .input-group-text { min-height: 38px; height: 38px; }
.ap-r7 #video-impact-help, .ap-r7 .ap-r7-help-card .alert { display: block; }
.ap-r7 .ap-table-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.ap-r7 .ap-download-form-card { max-width: 1040px; }
.ap-r7 .ap-cc-restore { min-height: 34px; padding: 6px 14px; border: 1px solid #404040; border-radius: 999px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; text-decoration: none; }
/* Color de fila: un únic selector quadrat i el codi hexadecimal com a contingut. */
.ap-r7 .ap-cc-color-cell { display: flex; align-items: center; gap: 8px; }
.ap-r7 .ap-cc-table .ap-cc-color { flex: 0 0 32px; width: 32px; height: 32px; min-height: 32px; padding: 0; border: 1px solid rgba(255,255,255,.24); border-radius: 8px; }
.ap-r7 .ap-cc-hex-label { color: #dedee0; font-size: 12.5px; white-space: nowrap; }
@media (max-width: 575.98px) { .ap-r7 .ap-cc-color-cell { flex-direction: column; align-items: flex-start; gap: 4px; } }
/* Paritat P5 · ronda 5 */
.ap-p5 { font-size: 14px; }
.ap-p5 [hidden] { display: none !important; }
.ap-p5 .ap-eyebrow, .ap-p5 .ap-table th, .ap-p5 .ap-chip, .ap-p5 .ap-nav-group > .ap-eyebrow { font-size: 12.5px; }
.ap-p5 .btn { border-radius: 999px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.ap-p5 .ap-iconbtn, .ap-p5 .btn-close { box-sizing: border-box; width: 34px; height: 34px; min-height: 34px; flex: 0 0 34px; padding: 0; border-radius: 8px; }
.ap-p5 .ap-table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; }
.ap-p5 .form-label { display: block; }
.ap-p5 .form-control, .ap-p5 .form-select { height: 42px; min-height: 42px; border-radius: 10px; font-size: 14px; }
.ap-p5 #infoMessage:empty { display: none; }
.ap-p5 #infoMessage .alert { position: relative; margin-bottom: 24px; padding: 16px 58px 16px 18px; font-size: 14px; overflow-wrap: anywhere; }
.ap-p5 #infoMessage .btn-close { top: 10px; right: 10px; opacity: .8; }
.ap-p5 .ap-r5-category-table .ap-actions-cell { width: 108px; }
.ap-p5 .ap-r5-category-table .ap-actions { flex-wrap: nowrap; }
.ap-p5 .ap-r5-category-form-card .ap-form-actions { flex-wrap: wrap; }
.ap-p5 .ap-r5-how-steps p { font-size: 14px; }
.ap-p5 .ap-r5-how-steps p strong { display: inline; margin: 0; font-size: inherit; }
.ap-p5 .ap-r5-instructor-card { min-height: 150px; }
.ap-p5 .ap-r5-bio-text { white-space: pre-line; }
.ap-p5 .ap-r5-masterclass-guidance { padding: 0 24px 20px; }
.ap-p5 .ap-r5-mode-legend { display: flex; flex-wrap: wrap; gap: 8px; }
.ap-p5 .ap-r5-mode-chip { display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px; border: 1px solid var(--ap-border); border-radius: 8px; color: var(--ap-text); background: var(--ap-row-hover); font-size: 12.5px; }
.ap-p5 .ap-r5-mode-dot { display: inline-block; flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.ap-p5 .ap-r5-mode--fc, .ap-p5 .ap-r5-mode--fc .ap-r5-mode-dot { color: #70E6AB; }
.ap-p5 .ap-r5-mode--ftp, .ap-p5 .ap-r5-mode--ftp .ap-r5-mode-dot { color: #FF96A2; }
.ap-p5 .ap-r5-mode-chip.ap-r5-mode--fc, .ap-p5 .ap-r5-mode-chip.ap-r5-mode--ftp { color: var(--ap-text); }
.ap-p5 .ap-r5-mode-chip.ap-r5-mode--fc .ap-r5-mode-dot { background: #70E6AB; }
.ap-p5 .ap-r5-mode-chip.ap-r5-mode--ftp .ap-r5-mode-dot { background: #FF96A2; }
.ap-p5 .ap-r5-masterclass-guidance .ap-help { margin: 12px 0 0; }
.ap-p5 .ap-p5-play-actions { display: inline-flex; align-items: center; gap: 5px; }
.ap-p5 .ap-p5-play-menu { min-width: 225px; max-width: calc(100vw - 32px); }
.ap-p5 .ap-p5-play-menu .dropdown-item { white-space: normal; }
.ap-p5 .ap-r5-masterclass-table .ap-actions-cell { width: 190px; }
.ap-p5 .ap-r5-masterclass-filters { flex-wrap: wrap; }
.ap-p5 .ap-r5-masterclass-filters .ap-field { min-width: 160px; flex: 1 1 180px; }
.ap-p5 .ap-r5-video-thumbnail::before, .ap-p5 .ap-r5-video-thumbnail::after { content: none; }
.ap-p5 .ap-r5-video-thumbnail img { width: 100%; height: 100%; object-fit: cover; }
.ap-p5 .ap-r5-thumbnail-play { position: absolute; }
.ap-p5 .ap-r5-video-copy strong { min-height: 0; }
.ap-p5 .ap-r5-support-group > h2 { margin-bottom: 16px; }
.ap-p5 .ap-r5-resource-name { overflow-wrap: anywhere; }
.ap-p5 .ap-r5-denied-main { flex-direction: column; align-items: center; gap: 0; }
/* La vista real és dins .ap-main: el seu padding ja ocupa 32 + 104 px. */
body.ap-layout[data-ap-page="prohibit"] #contenedor_app > .ap-r5-denied-main { min-height: calc(100vh - 64px - 32px - 104px); }
@media (max-width: 991.98px) {
  body.ap-layout[data-ap-page="prohibit"] #contenedor_app > .ap-r5-denied-main { min-height: calc(100vh - 64px - 28px - 108px); }
}
@media (max-width: 575.98px) {
  body.ap-layout[data-ap-page="prohibit"] #contenedor_app > .ap-r5-denied-main { min-height: calc(100vh - 64px - 24px - 108px); }
}
/* El peu públic no redueix l'àrea de centrat de la maqueta (21 + 24 px). */
body.ap-p5-anonymous[data-ap-page="prohibit"] { position: relative; }
body.ap-p5-anonymous[data-ap-page="prohibit"] #contenedor_app + footer { position: absolute; bottom: 24px; left: 0; right: 0; margin-top: 0 !important; }
.ap-p5 .ap-r5-denied-main #infoMessage { width: min(100%, 800px); }
.ap-p5 .ap-r5-public-notice { display: flex; align-items: start; gap: 12px; }
.ap-p5-anonymous { display: flex; flex-direction: column; min-height: 100svh; background: #000; padding: 48px 24px 24px; }
.ap-p5-anonymous .ap-main { width: 100%; max-width: 1040px; margin: 0 auto; padding: 0 0 24px; }
.ap-p5-anonymous .ap-r5-denied-main { flex: 1; min-height: 0; justify-content: center; }
.ap-p5-anonymous .ap-r5-resource-layout { grid-template-columns: minmax(0, 1fr); }
.ap-p5-anonymous .ap-r5-resource-sidebar { width: 100%; max-width: 440px; grid-template-columns: minmax(0, 1fr); }
@media (max-width: 991.98px) {
  .ap-p5 .ap-r5-masterclass-table tbody tr { grid-template-columns: minmax(0, 1fr); }
  .ap-p5 .ap-r5-masterclass-table .ap-session-cell { grid-column: 1; grid-row: 1; width: auto; }
  .ap-p5 .ap-r5-masterclass-table .ap-r5-instructor-cell { grid-column: 1; grid-row: 2; }
  .ap-p5 .ap-r5-masterclass-table .ap-actions-cell { grid-column: 1; grid-row: 3; width: auto; }
}
@media (max-width: 575.98px) {
  .ap-p5 .ap-r5-masterclass-guidance { padding-inline: 16px; }
  .ap-p5 .ap-r5-mode-legend { display: grid; grid-template-columns: minmax(0, 1fr); }
  .ap-p5 .ap-r5-mode-chip { width: fit-content; max-width: 100%; }
  .ap-p5 .ap-r5-masterclass-filters .ap-field, .ap-p5 .ap-r5-filter-reset, .ap-p5 .ap-r5-masterclass-filters > .btn { flex: 1 1 100%; width: 100%; min-width: 0; }
  .ap-p5 .ap-r5-category-table tbody .ap-actions-cell { grid-row: 1; }
  .ap-p5 .ap-r5-home-recent .ap-table-hint { display: block; font-size: 12.5px; }
  .ap-p5 .ap-r5-home-recent .ap-table-intro { flex-wrap: wrap; gap: 8px; }
  .ap-p5 .ap-r5-denied-actions { flex-direction: column; width: 100%; }
  .ap-p5 .ap-r5-denied-actions .btn { white-space: normal; width: 100%; }
  .ap-p5-anonymous { padding: 32px 20px 20px; }
}

/* Ronda 8 · boxa */
.ap-boxa, .ap-boxa-list { font-size: 14px; }
.ap-boxa [hidden], .ap-boxa-list [hidden] { display: none !important; }
.ap-boxa .ap-eyebrow, .ap-boxa .ap-chip, .ap-boxa-list .ap-eyebrow, .ap-boxa-list .ap-chip, .ap-boxa-list .ap-table th { font-size: 12.5px; }
.ap-boxa .btn, .ap-boxa-list .btn { border-radius: 999px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.ap-boxa .ap-iconbtn, .ap-boxa-list .ap-iconbtn, .ap-boxa .btn-close, .ap-boxa-list .btn-close { box-sizing: border-box; width: 34px; height: 34px; min-height: 34px; flex: 0 0 34px; padding: 0; border-radius: 8px; }
.ap-boxa-list .ap-table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; }
.ap-boxa .form-label, .ap-boxa-list .form-label { display: block; }
.ap-boxa .form-control, .ap-boxa .form-select, .ap-boxa-list .form-control, .ap-boxa-list .form-select { height: 42px; min-height: 42px; border-radius: 10px; font-size: 14px; background-color: #262626; border-color: #2E2E30; }
.ap-boxa .ap-help, .ap-boxa-list .ap-help { font-size: 12.5px; }
.ap-boxa #infoMessage .alert, .ap-boxa-list #infoMessage .alert { position: relative; display: block; padding: 16px 60px 16px 18px; margin-bottom: 24px; overflow-wrap: anywhere; }
.ap-boxa #infoMessage .btn-close, .ap-boxa-list #infoMessage .btn-close { top: 10px; right: 10px; opacity: .85; }
.ap-boxa-list .ap-filterbar { flex-wrap: wrap; }
.ap-boxa-list .ap-table { table-layout: auto; }
.ap-boxa-list .ap-table > :not(caption) > * > * { padding-inline: 12px; }
.ap-boxa-list .ap-actions-cell { width: 158px; }
.ap-boxa-list .ap-table .ap-actions { flex-wrap: nowrap; gap: 5px; }
.ap-boxa-list .ap-boxa-mobile-meta { display: none; }
.ap-boxa-list .ap-session-title { overflow-wrap: anywhere; }
.ap-boxa-list .dropdown-item:disabled { color: #a5a5a8; }
.ap-boxa-list .dropdown-item-text { font-size: 12.5px; }
.ap-boxa-details { padding: 0; list-style: none; }
.ap-boxa-details > li { padding: 14px 0; border-top: 1px solid #2E2E30; }
.ap-boxa-details ol { margin: 14px 0 0 16px; padding: 0 0 0 16px; border-left: 2px solid #0080E2; list-style: none; }
.ap-boxa-details ol > li + li { margin-top: 14px; }
.ap-boxa-detail-row, .ap-boxa-detail-head { display: grid; grid-template-columns: minmax(0, 1fr) 65px 165px; gap: 16px; align-items: center; }
.ap-boxa-detail-head { color: #b5b5b8; font-size: 12.5px; padding-bottom: 12px; }
.ap-boxa-details .ap-boxa-sequence-chips { margin-top: 8px; }
.ap-boxa-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ap-boxa .ap-primary-text { color: #66baff; }
.ap-boxa .ap-editor-sidebar { min-width: 0; }
.ap-boxa .ap-editor-sidebar .card { min-width: 0; }
.ap-boxa-profile-bars { display: flex; gap: 4px; height: 145px; padding: 16px; border: 1px solid #2E2E30; border-radius: 10px; background: #141415; align-items: flex-end; }
.ap-boxa-profile-block { display: flex; flex-basis: 0; min-width: 24px; height: 100%; border: 1px solid #46aef8; border-radius: 8px 8px 4px 4px; background: linear-gradient(0deg, #006dc2, #0080E2); color: #fff; align-items: center; justify-content: center; padding: 0; }
.ap-boxa-profile-rest { height: 44%; background: #333338; border-color: #62626a; }
.ap-boxa-profile-block:hover { filter: brightness(1.15); }
.ap-boxa-profile-legend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; margin-top: 16px; }
.ap-boxa-profile-legend > span { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 6px; font-size: 12.5px; color: #cbcbce; }
.ap-boxa-profile-legend strong { margin-left: auto; font-size: 12.5px; }
.ap-boxa-legend-dot { width: 8px; height: 8px; flex: 0 0 8px; margin-top: 5px; border-radius: 2px; background: #66baff; }
.ap-boxa-legend-rest { background: #a5a5b0; }
.ap-boxa-track { overflow: visible; }
.ap-boxa-track-line { display: grid; grid-template-columns: 26px 28px minmax(0, 1fr) auto 50px 74px; gap: 8px; align-items: center; padding: 12px; min-height: 74px; }
.ap-boxa .ap-boxa-grip { width: 26px; flex-basis: 26px; cursor: grab; }
.ap-boxa-number { display: flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 8px; background: #262626; font-size: 12.5px; font-weight: 700; }
.ap-boxa-track-copy { min-width: 0; }
.ap-boxa-track-copy strong { display: block; font-size: 14px; overflow-wrap: anywhere; }
.ap-boxa-track-copy .ap-help { display: block; margin-top: 2px; color: #b5b5b8; }
.ap-boxa-track-duration { font-size: 12.5px; text-align: right; }
.ap-boxa-track-line > .ap-chip { white-space: normal; max-width: 115px; justify-content: center; }
.ap-boxa-track-actions { display: flex; gap: 4px; align-items: center; }
.ap-boxa-children { display: flex; flex-direction: column; gap: 8px; padding: 0 12px 12px 28px; }
.ap-boxa-child { border-left: 2px solid #0080E2; background: #141415; }
.ap-boxa-child .ap-boxa-track-line { grid-template-columns: 26px 24px minmax(0, 1fr) 48px 74px; }
.ap-boxa-child .ap-boxa-track-line > .ap-chip { display: none; }
.ap-boxa-child .ap-boxa-number { width: 24px; height: 24px; }
.ap-boxa-add-child { align-self: flex-start; margin-top: 4px; }
.ap-boxa-track-sequence { padding: 0 12px 12px 80px; }
.ap-boxa-sequence-chips { display: inline-flex; flex-wrap: wrap; gap: 4px; max-width: 100%; }
.ap-boxa-keychip { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; padding: 0 4px; border: 1px solid #4c4c52; border-radius: 6px; background: #262626; color: #eaeaea; font: 700 13px/1 system-ui, sans-serif; }
.ap-boxa-keychip--red { color: #ff9caa; border-color: #74444b; background: #352428; }
.ap-boxa-dragging { opacity: .4; }
.ap-boxa-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 16px; }
.ap-boxa-form-wide { grid-column: 1 / -1; min-width: 0; }
.ap-boxa-form-grid fieldset, .ap-boxa-sequence { min-width: 0; margin: 0; padding: 0; border: 0; }
.ap-boxa-form-grid legend, .ap-boxa-sequence legend { float: none; width: auto; }
.ap-boxa-speed { display: inline-flex; gap: 4px; max-width: 100%; }
.ap-boxa-speed button { min-height: 38px; font-size: 13px; font-weight: 700; }
.ap-boxa-sequence { margin-top: 24px; }
.ap-boxa-sequence-input { min-height: 54px; padding: 12px; border: 1px solid #4c4c52; border-radius: 10px; background: #262626; }
.ap-boxa-sequence-input:empty::before { content: 'Construeix la combinació…'; color: #b5b5b8; }
.ap-boxa-keyboard { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.ap-boxa-keyboard-row { display: flex; gap: 8px; }
.ap-boxa-key { width: 40px; height: 40px; flex: 0 0 40px; padding: 0; border: 1px solid #5e5e66; border-radius: 8px; background: #262626; color: #fff; font: 700 16px/1 system-ui, sans-serif; }
.ap-boxa-key:hover { border-color: #66baff; background: #333338; }
.ap-boxa-key--red { color: #ff9caa; border-color: #86545c; }
.ap-boxa-sequence-tools { display: flex; gap: 8px; align-items: center; margin-top: 12px; }
.ap-boxa-sequence > .ap-help { margin: 12px 0 0; line-height: 1.6; }
.ap-boxa .modal-dialog-scrollable .modal-content > form { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.ap-boxa .modal-dialog-scrollable .modal-body { overflow-y: auto; min-height: 0; }
.ap-boxa .modal-footer { flex-shrink: 0; }
.ap-boxa-template-card { padding: 18px; margin-bottom: 12px; }
.ap-boxa-template-card h3 { margin: 0 0 8px; font-size: 16px; }
.ap-boxa-template-card p { margin-bottom: 12px; }
.ap-boxa-template-example { margin-bottom: 16px; }
.ap-boxa-preview-stage { display: flex; min-height: 260px; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 24px; border: 1px solid #2E2E30; border-radius: 12px; background: radial-gradient(ellipse at top right, #003DA6, #141415 65%); text-align: center; }
.ap-boxa-preview-stage > .bi { font-size: 48px; color: #8dccff; }
.ap-boxa-preview-stage > strong { font-size: 20px; }
.ap-boxa-preview-controls { display: flex; justify-content: center; gap: 12px; margin-top: 18px; }
.ap-boxa-savebar { position: sticky; z-index: 1015; bottom: 16px; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 24px; padding: 18px 24px; border: 1px solid #3d3d40; border-radius: 12px; background: #1c1c1d; box-shadow: 0 8px 24px rgba(0,0,0,.4); }
.ap-boxa .ap-iconbtn:focus-visible, .ap-boxa-list .ap-iconbtn:focus-visible, .ap-boxa-key:focus-visible, .ap-boxa-sequence-input:focus-visible, .ap-boxa-profile-block:focus-visible { outline: 2px solid #8dccff; outline-offset: 3px; }
@media (min-width: 992px) and (max-width: 1439.98px) {
  .ap-boxa-list .ap-table > :not(caption) > * > * { padding-inline: 8px; }
  .ap-boxa-list .ap-centre-cell { max-width: 130px; overflow-wrap: anywhere; }
  .ap-boxa .ap-editor-layout { grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); }
  .ap-boxa-track-line { grid-template-columns: 26px 24px minmax(0, 1fr) 52px 74px; gap: 5px; padding: 10px; }
  .ap-boxa-track-line > .ap-chip { grid-column: 3; grid-row: 2; justify-self: start; }
  .ap-boxa-track-copy { grid-column: 3; grid-row: 1; }
  .ap-boxa-track-duration { grid-column: 4; grid-row: 1 / 3; }
  .ap-boxa-track-actions { grid-column: 5; grid-row: 1 / 3; }
  .ap-boxa-grip, .ap-boxa-number { grid-row: 1 / 3; }
  .ap-boxa-child .ap-boxa-track-line { grid-template-columns: 26px 24px minmax(0, 1fr) 48px 74px; }
  .ap-boxa-child .ap-boxa-track-copy { grid-row: 1 / 3; }
  .ap-boxa-children { padding-left: 16px; }
}
@media (max-width: 991.98px) {
  .ap-boxa-list .ap-table tbody { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ap-boxa-list .ap-table tbody tr { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .ap-boxa-list .ap-table tbody .ap-session-cell { grid-column: 1; grid-row: 1; }
  .ap-boxa-list .ap-boxa-category-cell, .ap-boxa-list .ap-boxa-rounds-cell, .ap-boxa-list .ap-boxa-duration-cell, .ap-boxa-list .ap-boxa-date-cell { display: none; }
  .ap-boxa-list .ap-boxa-mobile-meta { display: block; margin-top: 8px; color: #b5b5b8; font-size: 12.5px; }
  .ap-boxa-list .ap-table tbody .ap-actions-cell { grid-column: 1; grid-row: 2; padding: 0; }
  .ap-boxa-profile-legend { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
  .ap-boxa-list .ap-table tbody { grid-template-columns: minmax(0, 1fr); }
  .ap-boxa-list .ap-heading-actions { width: 100%; flex-wrap: wrap; }
  .ap-boxa-list .ap-heading-actions .btn { white-space: normal; }
  .ap-boxa-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ap-boxa-kpis .ap-kpi { padding: 12px 8px; min-height: 86px; }
  .ap-boxa-kpis .ap-kpi-value { font-size: 23px; }
  .ap-boxa-kpis .ap-kpi-label { font-size: 12.5px; line-height: 1.4; }
  .ap-boxa .ap-editor-title-line { flex-wrap: wrap; }
  .ap-boxa-track-line, .ap-boxa-child .ap-boxa-track-line { grid-template-columns: 26px 24px minmax(0, 1fr) 74px; gap: 5px; padding: 10px 8px; }
  .ap-boxa-track-copy, .ap-boxa-child .ap-boxa-track-copy { grid-column: 3; grid-row: 1; }
  .ap-boxa-track-line > .ap-chip { grid-column: 3; grid-row: 2; justify-self: start; }
  .ap-boxa-track-duration { grid-column: 3; grid-row: 3; text-align: left; }
  .ap-boxa-track-actions { grid-column: 4; grid-row: 1 / 4; }
  .ap-boxa-grip, .ap-boxa-number { grid-row: 1 / 4; }
  .ap-boxa-children { padding: 0 8px 10px 12px; }
  .ap-boxa-track-sequence { padding-left: 65px; padding-right: 8px; }
  .ap-boxa-track-copy strong { font-size: 14px; }
  .ap-boxa-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
  .ap-boxa-form-grid > div:has(select[name="e_tipo"]) { grid-column: 1 / -1; }
  .ap-boxa-keyboard-row { gap: 6px; }
  .ap-boxa .modal-body { padding: 18px; }
  .ap-boxa .offcanvas-body { padding: 20px; }
  .ap-boxa-detail-row, .ap-boxa-detail-head { grid-template-columns: minmax(0, 1fr) 55px; gap: 8px; }
  .ap-boxa-detail-row > :last-child { grid-column: 1 / -1; justify-self: start; }
  .ap-boxa-detail-head > :last-child { display: none; }
  .ap-boxa-details ol { margin-left: 8px; padding-left: 12px; }
  .ap-boxa-savebar { bottom: 12px; padding: 16px; gap: 10px; }
  .ap-boxa-savebar #boxa-save-status { width: 100%; }
  .ap-boxa-savebar .btn { padding-inline: 12px; }
}
/* Els agafadors també són botons quadrats de 34 px. */
.ap-boxa .ap-boxa-grip { width: 34px; height: 34px; min-height: 34px; flex-basis: 34px; }
.ap-boxa-track-line { grid-template-columns: 34px 28px minmax(0, 1fr) auto 50px 74px; }
.ap-boxa-child .ap-boxa-track-line { grid-template-columns: 34px 24px minmax(0, 1fr) 48px 74px; }
.ap-boxa-template-exercises { list-style: none; margin: 14px 0 0; padding: 0; }
.ap-boxa-template-exercises li { display: flex; flex-direction: column; gap: 7px; padding: 12px 0; border-top: 1px solid #2E2E30; }
.ap-boxa-template-example summary { color: #8dccff; cursor: pointer; font-size: 14px; }
.ap-boxa-template-card form { display: flex; gap: 12px; align-items: center; }
@media (min-width: 992px) and (max-width: 1439.98px) {
  .ap-boxa-track-line { grid-template-columns: 34px 24px minmax(0, 1fr) 52px 74px; }
  .ap-boxa-child .ap-boxa-track-line { grid-template-columns: 34px 24px minmax(0, 1fr) 48px 74px; }
}
@media (max-width: 575.98px) {
  .ap-boxa-track-line, .ap-boxa-child .ap-boxa-track-line { grid-template-columns: 34px minmax(0, 1fr) 74px; }
  .ap-boxa-number { display: none; }
  .ap-boxa-track-copy, .ap-boxa-child .ap-boxa-track-copy { grid-column: 2; }
  .ap-boxa-track-line > .ap-chip, .ap-boxa-track-duration { grid-column: 2; }
  .ap-boxa-track-actions { grid-column: 3; }
  .ap-boxa-track-sequence { padding-left: 48px; }
  .ap-boxa-list .ap-boxa-detail-row, .ap-boxa-list .ap-boxa-detail-head { grid-template-columns: minmax(0, 1fr) 55px; gap: 8px; }
  .ap-boxa-list .ap-boxa-detail-row > :last-child { grid-column: 1 / -1; justify-self: start; }
  .ap-boxa-list .ap-boxa-detail-head > :last-child { display: none; }
}

/* Paritat P1 · globals, menú, login i sessions */
.ap-p1-sidebar-footer { margin: 14px 0 0; color: #a5a5a5; font-size: 12.5px; overflow-wrap: anywhere; }
.ap-p1-sidebar-footer a { color: #cbcbcb; }
.ap-sidebar .ap-languages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ap-sidebar .ap-nav-group-label { font-size: 12.5px; letter-spacing: .1em; }
.ap-sidebar .ap-user-info { min-width: 0; }
.ap-sidebar .ap-user-info > span { display: block; font-size: 12.5px; }
.ap-demo-panel > div { flex-wrap: wrap; }
.ap-demo-panel [data-demo-role-picker] { max-width: 190px; font-size: 12.5px; }
.ap-p1-public-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; padding: 24px; background: #000; }
.ap-p1-public-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.ap-p1-public-nav { display: flex; flex-wrap: wrap; width: 100%; gap: 16px; font-size: 14px; }
.ap-p1-public-nav a { color: #cbcbcb; }
.ap-p1-anonymous main { width: min(100%, 1120px); margin-inline: auto; padding: 32px 24px; }
.ap-topbar > nav { min-width: 0; }
.ap-topbar .breadcrumb { flex-wrap: wrap; overflow-wrap: anywhere; }
.ap-topbar-actions { flex-shrink: 0; }
#infoMessage .alert { font-size: 14px; }
#infoMessage .btn-close { width: 34px; height: 34px; padding: 0; top: 6px; right: 6px; border-radius: 8px; }
@media (min-width: 992px) {
  html[data-ap-sidebar="collapsed"] .ap-p1-sidebar-footer { display: none; }
  html[data-ap-sidebar="collapsed"] .ap-sidebar .ap-languages { grid-template-columns: 1fr; }
}
@media (max-width: 575.98px) {
  .ap-topbar { align-items: flex-start; }
  .ap-topbar-actions .ap-old-view { white-space: normal; }
  .ap-p1-public-header { padding: 20px; }
  .ap-p1-public-actions { width: 100%; justify-content: space-between; }
  .ap-p1-anonymous main { padding: 24px 20px; }
}
body[data-ap-page="sessions"] .ap-session-clear-search { position: absolute; top: 50%; right: 5px; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 8px; }
body[data-ap-page="sessions"] #session-search { padding-right: 44px; }
body[data-ap-page="sessions"] #session-search::-webkit-search-cancel-button { display: none; }
body[data-ap-page="sessions"] #session-category-help { margin-top: 6px; font-size: 12.5px; }
body[data-ap-page="sessions"] .ap-session-select-visible { display: none; }
@media (max-width: 991.98px) {
  body[data-ap-page="sessions"] .ap-session-select-visible { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; }
  body[data-ap-page="sessions"] .ap-table-intro { flex-wrap: wrap; gap: 12px; }
  body[data-ap-page="sessions"] .ap-table-intro h2 { flex-basis: 100%; }
  body[data-ap-page="sessions"] .ap-session-meta { overflow-wrap: anywhere; }
}
.ap-login .ap-login-field { min-height: 60px; }
.ap-login .ap-login-field .form-floating { flex: 1; min-width: 0; }
.ap-login .ap-login-field .form-floating > .form-control { width: 100%; height: 60px; min-height: 60px; padding: 20px 0 6px; font-size: 14px; }
.ap-login .ap-login-field .form-floating > .form-control::placeholder { color: transparent; }
.ap-login .ap-login-field .form-floating > label { padding: 18px 0; color: #CBCBCB; font-size: 14px; }
.ap-login .ap-login-field .form-floating > .form-control:focus ~ label,
.ap-login .ap-login-field .form-floating > .form-control:not(:placeholder-shown) ~ label,
.ap-login .ap-login-field .form-floating > .form-control:-webkit-autofill ~ label { transform: scale(.9) translateY(-.5rem) translateX(.15rem); }
.ap-login .ap-login-field .form-floating > label::after { background-color: transparent; }
.ap-login .ap-login-field .ap-iconbtn { flex-shrink: 0; width: 34px; height: 34px; border-radius: 8px; }
.ap-login .ap-login-cta.btn { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; border-radius: 50rem; }
.ap-login .ap-login-languages { display: grid; grid-template-columns: repeat(3, 34px); gap: 4px; }
.ap-login .ap-login-languages a { min-height: 30px; padding: 3px; }
.ap-login .alert { font-size: 14px; }
.ap-login .alert .btn-close { flex-shrink: 0; width: 34px; height: 34px; padding: 0; margin-left: 4px; border-radius: 8px; }
.ap-login .alert-dismissible .btn-close { top: 8px; right: 8px; }
.ap-login .alert-success { color: #AFE0C0; border-color: #2E6240; background: rgba(23,53,34,.96); }
.ap-login .alert-info { color: #ACD8FC; border-color: #315D80; background: rgba(22,43,60,.96); }
.ap-login .ap-login-footer { flex-wrap: wrap; gap: 8px 16px; line-height: 1.5; }
.ap-login .ap-login-footer a { white-space: nowrap; }
.ap-login .ap-login-identified .alert { overflow-wrap: anywhere; }
@media (max-width: 575.98px) {
  .ap-login { padding-bottom: 156px; }
  .ap-login .ap-login-brand { margin-bottom: 32px; }
  .ap-login .ap-login-footer { right: 20px; left: 20px; bottom: 80px; }
}
.ap-login .ap-login-identified .alert { display: block; }
.ap-topbar .breadcrumb-item:first-child { display: block; }
.ap-topbar .breadcrumb-item + .breadcrumb-item::before { content: var(--bs-breadcrumb-divider, "/"); }
body[data-ap-page="sessions"] .ap-filterbar .ap-segmented > button { width: 34px; height: 34px; padding: 0; border-radius: 8px; }
.ap-topbar { height: auto; min-height: 64px; padding-block: 12px; }
@media (min-width: 992px) {
  body[data-ap-page="sessions"] .ap-filterbar .ap-field:has(#session-category-help) { position: relative; }
  body[data-ap-page="sessions"] #session-category-help { position: absolute; top: 100%; left: 0; right: 0; }
  body[data-ap-page="sessions"] .ap-filterbar:has(#category-filter:disabled) { padding-bottom: 44px; }
}

/* Paritat P6 · rondes 6 i 7 */
.ap-p6 { font-size: 14px; }
.ap-p6 .btn { border-radius: 999px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; white-space: normal; }
.ap-p6 .ap-iconbtn, .ap-p6 .btn-close { box-sizing: border-box; width: 34px; height: 34px; min-height: 34px; flex: 0 0 34px; padding: 0; border-radius: 8px; }
.ap-p6 .ap-table .ap-iconbtn, .ap-p6 .ap-cc-table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; }
.ap-p6 .ap-chip, .ap-p6 .ap-subtext, .ap-p6 .ap-help, .ap-p6 .form-text, .ap-p6 .ap-field-optional, .ap-p6 .invalid-feedback, .ap-p6 .ap-table-hint { font-size: 12.5px; }
.ap-p6 .form-label { display: block; }
.ap-p6 .form-control, .ap-p6 .form-select { min-height: 42px; border-radius: 10px; }
.ap-p6 .ap-p6-contract, .ap-p6 .ap-p6-language-help { font-size: 12.5px; line-height: 1.6; overflow-wrap: anywhere; }
.ap-p6.ap-r7 .ap-p6-contract { margin: 0 0 20px; }
.ap-p6 #infoMessage .alert { position: relative; padding: 14px 52px 14px 16px; font-size: 14px; overflow-wrap: anywhere; }
.ap-p6 #infoMessage .alert .btn-close { position: absolute; top: 7px; right: 7px; }
.ap-p6 #infoMessage .alert p:last-child { margin-bottom: 0; }
.ap-p6 .ap-plan-device.alert-warning { padding: 16px; border: 1px solid #75512b; border-radius: 10px; background: #443018; color: #f5cf9a; }
.ap-p6 .ap-plan-device.alert-warning span { color: #f5cf9a; }
.ap-p6 #video-file-error.d-block { display: block; }
.ap-p6 .ap-r7-script-input .form-control { border-radius: 0; }
.ap-p6 .ap-r7-script-input .input-group-text:first-child { border-radius: 10px 0 0 10px; }
.ap-p6 .ap-r7-script-input .input-group-text:last-child { border-radius: 0 10px 10px 0; }
.ap-p6[data-ap-page="colors"] .ap-cc-limit .form-control, .ap-p6[data-ap-page="colors"] .ap-cc-limit .input-group-text { min-height: 42px; height: 42px; }
.ap-p6[data-ap-page="colors"] .ap-cc-limit .form-control { border-radius: 10px 0 0 10px; }
.ap-p6[data-ap-page="colors"] .ap-cc-stack [role="button"] { cursor: pointer; }
.ap-p6[data-ap-page="colors"] .ap-cc-stack [role="button"]:focus-visible { outline: 2px solid #fff; outline-offset: -3px; }
.ap-p6[data-ap-page="colors"] .ap-cc-row-error { background: rgba(220,53,69,.05); }
@media (max-width: 575.98px) {
  .ap-p6 .ap-page-heading > *, .ap-p6 .ap-form-card, .ap-p6 .ap-status-panel { min-width: 0; }
  .ap-p6 .ap-r7-script-input .input-group-text { font-size: 12.5px; padding-inline: 8px; }
  .ap-p6 .ap-r7-impact code, .ap-p6 .ap-status-detail { overflow-wrap: anywhere; }
  .ap-p6 .ap-heading-actions .btn { max-width: 100%; }
}
.ap-p6 #infoMessage [data-error-message] > .alert { padding: 0; margin: 0; border: 0; background: transparent; }
.ap-p6 #infoMessage.ap-state-error { padding: 14px 52px 14px 16px; }
.ap-p6 #infoMessage.ap-state-error .btn-close { background: transparent; color: #fff; }
.ap-p6 .ap-r7-ad-offcanvas .offcanvas-header { justify-content: space-between; }
.ap-p6 #infoMessage.ap-state-error .btn-close { filter: none; }

/* Paritat P2 · editor i crea sessió */
body[data-ap-page="editor"], body[data-ap-page="crea-sessio"] { font-size: 14px; }
body[data-ap-page="editor"] .ap-help, body[data-ap-page="crea-sessio"] .ap-help,
body[data-ap-page="editor"] .ap-track-meta, body[data-ap-page="editor"] .ap-chip,
body[data-ap-page="editor"] .form-label, body[data-ap-page="crea-sessio"] .form-label,
body[data-ap-page="editor"] .invalid-feedback, body[data-ap-page="crea-sessio"] .invalid-feedback { font-size: 12.5px; }
body[data-ap-page="editor"] .ap-iconbtn,
body[data-ap-page="crea-sessio"] .ap-iconbtn { width: 34px; height: 34px; min-height: 34px; flex-basis: 34px; border-radius: 8px; }
body[data-ap-page="editor"] .infopista .ap-iconbtn,
body[data-ap-page="editor"] table .ap-iconbtn,
body[data-ap-page="crea-sessio"] table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; }
body[data-ap-page="editor"] .btn, body[data-ap-page="crea-sessio"] .btn { border-radius: 999px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
body[data-ap-page="editor"] .form-control, body[data-ap-page="editor"] .form-select,
body[data-ap-page="crea-sessio"] .form-control, body[data-ap-page="crea-sessio"] .form-select { min-height: 42px; border-radius: 10px; font-size: 14px; }
body[data-ap-page="editor"] textarea, body[data-ap-page="crea-sessio"] textarea { height: auto; }
body[data-ap-page="editor"] .ap-track-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body[data-ap-page="editor"] .ap-track-fields > div,
body[data-ap-page="editor"] .ap-track-fields > fieldset { min-width: 0; }
body[data-ap-page="editor"] .ap-track-fields .form-control,
body[data-ap-page="editor"] .ap-track-fields .form-select,
body[data-ap-page="editor"] .ap-p2-ai-table .form-control,
body[data-ap-page="editor"] .ap-p2-ai-table .form-select,
body[data-ap-page="crea-sessio"] .ap-spotify-editable .form-control,
body[data-ap-page="crea-sessio"] .ap-spotify-editable .form-select { height: 38px; min-height: 38px; border-radius: 10px; padding-block: 6px; font-size: 13px; }
.ap-p2-clock-field { grid-column: 1 / -1; }
body[data-ap-page="editor"] #waveform-progress { touch-action: none; }
.ap-p2-simulated-video { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; aspect-ratio: 16 / 9; padding: 16px; border: 1px solid var(--ap-border); border-radius: 10px; background: #000; color: #CBCBCB; text-align: center; overflow-wrap: anywhere; }
.ap-p2-simulated-video .bi { font-size: 34px; color: var(--ap-link); }
.ap-p2-simulated-video p { font-size: 12.5px; }
body[data-ap-page="editor"] .ap-p2-ai-table { width: 100%; table-layout: fixed; }
body[data-ap-page="editor"] .ap-p2-ai-table th,
body[data-ap-page="editor"] .ap-p2-ai-table td { width: auto; padding: 8px; font-size: 12.5px; overflow-wrap: anywhere; }
.ap-p2-ai-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ap-p2-ai-fields > div { min-width: 0; }
.ap-p2-ai-track { min-width: 0; }
.ap-p2-ai-diff { font-size: 12.5px; }
.ap-p2-ai-diff del { color: #A5A5A5; }
.ap-p2-ai-diff ins { color: #71BEFA; text-decoration: none; }
body[data-ap-page="crea-sessio"] .ap-create-grid > *,
body[data-ap-page="crea-sessio"] .ap-spotify-panel { min-width: 0; }
.ap-spotify-editable { table-layout: fixed; }
.ap-spotify-editable .ap-spotify-track-main td { vertical-align: bottom; border-bottom: 0; }
.ap-spotify-editable .ap-spotify-track-number { width: 28px; }
.ap-spotify-editable .ap-spotify-track-title { min-width: 0; }
.ap-spotify-editable .ap-spotify-track-time { width: 150px; }
.ap-spotify-editable .ap-spotify-track-actions { width: 40px; text-align: right; }
.ap-spotify-track-duration { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: end; gap: 6px; }
.ap-spotify-track-duration > div { min-width: 0; }
.ap-spotify-track-duration > span { padding-bottom: 8px; }
.ap-spotify-editable .form-label { display: block; margin-bottom: 6px; }
.ap-spotify-track-settings { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.ap-spotify-track-settings > div { min-width: 0; }
.ap-spotify-track-extra summary { cursor: pointer; font-size: 12.5px; font-weight: 700; overflow-wrap: anywhere; }
.ap-spotify-track-extra summary .ap-help { display: block; margin-top: 4px; font-weight: 400; }
.ap-spotify-empty { padding: 12px; border: 1px solid var(--ap-border); border-radius: 10px; font-size: 12.5px; }
@media (max-width: 767.98px) {
  body[data-ap-page="crea-sessio"] .ap-spotify-panel { padding: 12px; }
  .ap-spotify-editable, .ap-spotify-editable tbody { display: block; width: 100%; }
  .ap-spotify-editable thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); }
  .ap-spotify-editable tbody tr.ap-spotify-track-main { display: grid; grid-template-columns: 24px minmax(0, 1fr) 32px; gap: 10px 6px; padding-top: 16px; }
  .ap-spotify-editable tbody tr.ap-spotify-track-main td { display: block; width: auto; padding: 0; }
  .ap-spotify-editable .ap-spotify-track-title { grid-column: 2; }
  .ap-spotify-editable .ap-spotify-track-time { grid-row: 2; grid-column: 2; }
  .ap-spotify-editable .ap-spotify-track-actions { grid-row: 1; grid-column: 3; align-self: end; }
  .ap-spotify-editable tbody tr.ap-spotify-track-extra,
  .ap-spotify-editable tbody tr.ap-spotify-track-extra td { display: block; width: 100%; }
  .ap-spotify-editable tbody tr.ap-spotify-track-extra td { padding: 12px 0 16px; }
  .ap-spotify-track-settings { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
  body[data-ap-page="editor"] .ap-track-fields,
  .ap-p2-ai-fields { grid-template-columns: minmax(0, 1fr); }
  body[data-ap-page="editor"] .infopista { height: auto; min-height: 76px; grid-template-rows: auto auto; }
  body[data-ap-page="editor"] .ap-track-meta { flex-wrap: wrap; font-size: 12.5px; }
  body[data-ap-page="editor"] .ap-track-duration--accumulated .ap-track-range { display: inline; }
  body[data-ap-page="editor"] .ap-track-duration--accumulated .ap-track-time { display: none; }
  body[data-ap-page="editor"] .ap-track-slope { min-width: 0; }
  body[data-ap-page="editor"] .ap-slope-label { white-space: normal; }
}
body[data-ap-page="editor"] .ap-editor-graph-toolbar { flex-direction: column; align-items: stretch; }
body[data-ap-page="editor"] .ap-editor-graph-player { align-self: end; }
body[data-ap-page="editor"] .ap-p2-ai-table,
body[data-ap-page="editor"] .ap-p2-ai-table tbody { display: block; width: 100%; }
body[data-ap-page="editor"] .ap-p2-ai-table tr.ap-p2-ai-track { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; padding: 12px; border: 1px solid var(--ap-border); border-radius: 10px; background: var(--ap-elevated); }
body[data-ap-page="editor"] .ap-p2-ai-table tr.ap-p2-ai-track > td { display: block; min-width: 0; padding: 0; border: 0; white-space: normal; }
body[data-ap-page="editor"] .ap-p2-ai-table tr.ap-p2-ai-track > td:first-child,
body[data-ap-page="editor"] .ap-p2-ai-table tr.ap-p2-ai-track > td[data-label="Nom"] { grid-column: 1 / -1; }
body[data-ap-page="editor"] .ap-p2-ai-table tr.ap-p2-ai-track > td:first-child { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
body[data-ap-page="editor"] .ap-p2-ai-table input,
body[data-ap-page="editor"] .ap-p2-ai-table select { width: 100%; min-width: 0; }
body[data-ap-page="editor"] .ap-p2-ai-table .form-label { display: block; }
.ap-spotify-editable th:first-child { width: 28px; }
.ap-spotify-editable th:nth-child(3) { width: 150px; }
.ap-spotify-editable th:last-child { width: 40px; }
@media (max-width: 575.98px) {
  body[data-ap-page="editor"] .ap-p2-ai-table tr.ap-p2-ai-track { grid-template-columns: minmax(0, 1fr); }
  body[data-ap-page="editor"] .ap-editor-graph-options { gap: 8px; justify-content: start; }
}
body[data-ap-page="editor"] .infopista { grid-template-columns: 32px 28px minmax(0, 1fr) 110px 88px 100px; }
body[data-ap-page="editor"] .ap-segmented > button,
body[data-ap-page="crea-sessio"] .ap-segmented > button { border-radius: 999px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
body[data-ap-page="editor"] .ap-kpi-label,
body[data-ap-page="crea-sessio"] .ap-table th { font-size: 12.5px; }
@media (max-width: 991.98px) {
  body[data-ap-page="editor"] .infopista { grid-template-columns: 32px 28px minmax(0, 1fr) auto; }
}
body[data-ap-page="editor"] .alert-dismissible .btn-close,
body[data-ap-page="crea-sessio"] .alert-dismissible .btn-close { box-sizing: border-box; width: 34px; height: 34px; padding: 8px; margin: 6px; border-radius: 8px; }
body[data-ap-page="crea-sessio"] .ap-spotify-track-title .ap-help { overflow-wrap: anywhere; }
body[data-ap-page="editor"] .ap-editor-palette,
body[data-ap-page="editor"] .ap-editor-graph-options > .ap-segmented { max-width: 100%; }
body[data-ap-page="editor"] main .ap-eyebrow,
body[data-ap-page="crea-sessio"] main .ap-eyebrow { font-size: 12.5px; }

/* Paritat P4 · planificació i plantilles */
.ap-planning-family { font-size: 14px; }
.ap-planning-family .ap-iconbtn { width: 34px; height: 34px; min-height: 34px; border-radius: 8px; flex-shrink: 0; }
.ap-planning-family .ap-table .ap-iconbtn,
.ap-planning-family .ap-template-class .ap-iconbtn,
.ap-planning-family .ap-planning-panel-class .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; border-radius: 8px; }
.ap-planning-family .btn:not(.ap-iconbtn),
.ap-planning-family .ap-segmented > button { border-radius: 999px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.ap-planning-family .alert .btn-close { width: 34px; height: 34px; border-radius: 8px; padding: 8px; margin: 6px; box-sizing: border-box; }
.ap-planning-family .ap-help, .ap-planning-family .ap-subtext, .ap-planning-family small,
.ap-planning-family .ap-eyebrow, .ap-planning-family .ap-table-hint,
.ap-planning-family .form-label { font-size: 12.5px; }
.ap-planning-family .form-control,
.ap-planning-family .form-select { font-size: 14px; min-width: 0; }
.ap-planning-family .ap-planning-inline .form-control,
.ap-planning-family .ap-planning-inline .form-select { height: 38px; min-height: 38px; }
.ap-planning-family #infoMessage { margin-bottom: 20px; }
.ap-planning-family #infoMessage:empty { display: none; }
.ap-planning-family #infoMessage .alert p + p { margin-top: 8px; }
.ap-planning-family .ap-planning-date-option { max-width: none; }
.ap-planning-family .ap-planning-option-help { grid-column: 2 / -1; }
.ap-p4-save-actions { display: flex; flex-wrap: wrap; gap: 8px; flex-shrink: 0; }
.ap-planning-family .ap-planning-day-picker { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; background: transparent; padding: 0; }
.ap-planning-family .ap-planning-day-picker > button { min-height: 38px; }
.ap-planning-family .ap-p4-calendar { --p4-days: 7; display: grid; grid-template-columns: repeat(var(--p4-days),minmax(0,1fr)); gap: 8px; min-width: 0; width: 100%; }
.ap-p4-calendar-day { min-width: 0; border: 1px solid var(--ap-border); border-radius: 10px; overflow: hidden; background: #141415; }
.ap-p4-calendar-day h3 { padding: 12px 8px; margin: 0; font-size: 14px; min-height: 64px; background: #262626; border-bottom: 1px solid var(--ap-border); overflow-wrap: anywhere; }
.ap-p4-calendar-day h3 span { display: block; margin-top: 4px; font-size: 12.5px; font-weight: 400; color: var(--ap-subtle-contrast); }
.ap-p4-calendar-body { display: grid; grid-template-columns: 0 minmax(0,1fr); position: relative; margin-bottom: 20px; }
.ap-p4-calendar-day:first-child .ap-p4-calendar-body { grid-template-columns: 54px minmax(0,1fr); }
.ap-p4-hours { position: relative; min-width: 0; border-right: 1px solid var(--ap-border); }
.ap-p4-calendar-day:not(:first-child) .ap-p4-hours { visibility: hidden; }
.ap-p4-hour { position: absolute; left: 4px; font-size: 12.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ap-p4-day-events { position: relative; min-width: 0; background: repeating-linear-gradient(to bottom,transparent 0,transparent 119px,#323235 119px,#323235 120px); }
.ap-planning-family .ap-p4-calendar .ap-planning-preview-class { position: absolute; margin: 2px 0 0; padding: 5px 6px; gap: 3px; min-width: 0; align-items: stretch; border-radius: 8px; }
.ap-planning-family .ap-p4-calendar .ap-planning-preview-class strong { font-size: 12.5px; line-height: 1.35; overflow-wrap: anywhere; }
.ap-p4-event-time { font-size: 12.5px; font-variant-numeric: tabular-nums; line-height: 1.35; overflow-wrap: anywhere; }
.ap-p4-day-empty { padding: 10px 8px; font-size: 12.5px; }
.ap-p4-pdf-frame { position: fixed; left: -9999px; top: 0; width: 1400px; height: 3000px; border: 0; }
.ap-p4-calendar-only > :not(#planning-week-modal):not(#infoMessage):not(#apToastContainer) { display: none !important; }
.ap-p4-calendar-only .ap-p4-standalone { display: block; position: static; width: 100%; overflow: visible; }
.ap-p4-calendar-only .ap-p4-standalone .modal-dialog { max-width: 1400px; margin: 24px auto; }
.ap-p4-calendar-only .ap-p4-standalone [data-bs-dismiss="modal"] { display: none; }
@media (max-width: 1199.98px) {
  .ap-planning-family .ap-p4-calendar { grid-template-columns: minmax(0,1fr); }
  .ap-p4-calendar-day .ap-p4-calendar-body,
  .ap-p4-calendar-day:first-child .ap-p4-calendar-body { grid-template-columns: 60px minmax(0,1fr); }
  .ap-p4-calendar-day:not(:first-child) .ap-p4-hours { visibility: visible; }
  .ap-p4-calendar-day h3 { min-height: auto; }
}
@media (max-width: 575.98px) {
  .ap-planning-family #planning-week-modal .modal-dialog { margin: 8px; }
  .ap-planning-family #planning-week-modal .modal-body,
  .ap-planning-family #planning-week-modal .modal-header { padding: 16px 12px; }
  .ap-planning-family #planning-week-modal .modal-footer { justify-content: flex-start; gap: 8px; }
  .ap-planning-family #planning-week-modal .modal-footer > a { flex-basis: 100%; text-align: center; }
  .ap-planning-family .ap-planning-savebar .ap-p4-save-actions { align-self: stretch; justify-content: flex-end; }
  .ap-planning-family .ap-planning-savebar .btn { align-self: center; }
  .ap-planning-family .ap-planning-file { min-width: 0; }
  .ap-planning-family #planning-file-url { overflow-wrap: anywhere; min-width: 0; }
  .ap-planning-family .ap-planning-pc summary { flex-wrap: wrap; }
  .ap-planning-family .ap-planning-inline { grid-template-columns: minmax(0,1fr); }
  .ap-planning-family .ap-planning-inline-actions { justify-content: flex-end; }
}
@media print {
  @page { size: landscape; margin: 10mm; }
  body.ap-planning-family { background: white !important; color: black; }
  body.ap-planning-family > :not(#planning-week-modal):not(main) { display: none !important; }
  body.ap-planning-family[data-ap-page="planificacio"] > main { display: none !important; }
  body.ap-planning-family #planning-week-modal { display: block !important; position: static !important; overflow: visible !important; padding: 0 !important; }
  body.ap-planning-family #planning-week-modal .modal-dialog { transform: none !important; max-width: none !important; margin: 0 !important; }
  body.ap-planning-family .modal-content { border: 0; background: white; box-shadow: none; }
  body.ap-planning-family #planning-week-modal .modal-footer,
  body.ap-planning-family #planning-week-modal .ap-iconbtn,
  body.ap-planning-family #planning-week-preview-options { display: none !important; }
  .ap-planning-family .ap-p4-calendar { grid-template-columns: repeat(var(--p4-days),minmax(0,1fr)) !important; }
  .ap-p4-calendar-day { break-inside: avoid; background: white; border-color: #ccc; }
  .ap-p4-calendar-day h3 { background: #eee; color: black; }
  .ap-p4-calendar-day .ap-p4-calendar-body { grid-template-columns: 0 minmax(0,1fr) !important; }
  .ap-p4-calendar-day:first-child .ap-p4-calendar-body { grid-template-columns: 54px minmax(0,1fr) !important; }
  .ap-p4-calendar-day:not(:first-child) .ap-p4-hours { visibility: hidden; }
  .ap-p4-hours, .ap-p4-day-events { color: black; }
  .ap-planning-family .ap-p4-calendar .ap-planning-preview-class { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}
/* Plantilles: centre plegable, còpia múltiple i estats de l'assistent. */
.ap-planning-family .ap-p4-template-context { margin-bottom: 24px; padding: 16px 20px; overflow: visible; }
.ap-planning-family .ap-p4-template-context > summary { cursor: pointer; font-size: 14px; font-weight: 700; }
.ap-planning-family .ap-p4-template-context > .ap-field { max-width: 540px; margin-top: 16px; }
.ap-planning-family .ap-p4-template-calendar { margin-top: 24px; padding: 20px; min-width: 0; }
.ap-planning-family .ap-p4-copy-targets { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.ap-planning-family .ap-p4-copy-chip { position: relative; cursor: pointer; min-width: 0; }
.ap-planning-family .ap-p4-copy-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ap-planning-family .ap-p4-copy-chip > span:first-of-type { display: flex; justify-content: center; align-items: center; height: 42px; border: 1px solid #404040; border-radius: 999px; color: #CBCBCB; background: #1C1C1D; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ap-planning-family .ap-p4-copy-chip input:checked + span { background: rgba(0,128,226,.18); border-color: #0080E2; color: #71BEFA; }
.ap-planning-family .ap-p4-copy-chip input:focus-visible + span { outline: 2px solid #0080E2; outline-offset: 3px; }
.ap-planning-family .ap-p4-copy-chip--disabled { opacity: .45; cursor: default; }
.ap-planning-family .ap-p4-sessions-status, .ap-planning-family .ap-p4-ia-message { margin-top: 12px; padding: 12px; border: 1px solid #404040; border-radius: 10px; font-size: 14px; color: #CBCBCB; background: #1C1C1D; }
.ap-planning-family .ap-p4-ia-message[role="alert"] { border-color: #9C4545; }
.ap-planning-family .ap-p4-sessions-status p { margin: 0 0 12px; }
.ap-planning-family .ap-template-add { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; border-radius: 999px; }
.ap-planning-family .ap-template-add:disabled { opacity: .45; cursor: default; }
.ap-p4-toast-undo { flex-shrink: 0; font-size: 13px; font-weight: 700; }
.ap-planning-family .ap-template-ai-table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; border-radius: 8px; }
.ap-planning-family .ap-template-inline .form-select, .ap-planning-family .ap-template-inline .form-control { font-size: 14px; }
.ap-planning-family #template-tutorial-host > iframe { width: 100%; height: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: inherit; }
@media (max-width: 767.98px) {
  .ap-planning-family .ap-p4-template-calendar { padding: 12px; }
  .ap-planning-family .ap-template-ai-table, .ap-planning-family .ap-template-ai-table tbody { display: block; width: 100%; }
  .ap-planning-family .ap-template-ai-table thead { display: none; }
  .ap-planning-family .ap-template-ai-table tr { display: grid; grid-template-columns: minmax(0,1fr) 40px; padding: 8px; border-bottom: 1px solid #404040; }
  .ap-planning-family .ap-template-ai-table td { display: block; min-width: 0; border: 0; }
  .ap-planning-family .ap-template-ai-table td:first-child { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0,1fr) 110px; gap: 8px; }
  .ap-planning-family .ap-template-ai-table td:first-child .form-control { margin-top: 0; }
  .ap-planning-family .ap-template-ai-table td .form-select, .ap-planning-family .ap-template-ai-table td .form-control { font-size: 14px; }
}
@media print {
  body.ap-p4-calendar-page .ap-sidebar, body.ap-p4-calendar-page .ap-topbar, body.ap-p4-calendar-page .ap-page-heading, body.ap-p4-calendar-page .ap-template-preview-alert, body.ap-p4-calendar-page #infoMessage, body.ap-p4-calendar-page .ap-demo-panel, body.ap-p4-calendar-page .ap-demo-switcher { display: none !important; }
  body.ap-p4-calendar-page #contenedor_app { margin: 0 !important; padding: 0 !important; }
  body.ap-p4-calendar-page #template-calendar-section { padding: 0 !important; border: 0 !important; box-shadow: none !important; }
}
/* Retocs P2: eix compacte i pistes de Spotify. */
body[data-ap-page="crea-sessio"] .ap-spotify-editable .ap-spotify-track-main td { vertical-align: middle; }
body[data-ap-page="crea-sessio"] .ap-spotify-editable .ap-spotify-track-number { text-align: center; }
body[data-ap-page="crea-sessio"] .ap-spotify-track-artist { display: block; margin-top: 4px; font-size: 12.5px; line-height: 1.4; }
body[data-ap-page="crea-sessio"] .ap-spotify-track-duration { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 4px; max-width: 134px; }
body[data-ap-page="crea-sessio"] .ap-spotify-track-duration > span { padding-bottom: 0; }
body[data-ap-page="crea-sessio"] .ap-spotify-track-duration .form-control { min-width: 0; padding-inline: 4px; text-align: center; font-variant-numeric: tabular-nums; }
body[data-ap-page="crea-sessio"] .ap-spotify-track-main .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; border-radius: 8px; }
body[data-ap-page="crea-sessio"] .ap-spotify-editable th:last-child { text-align: center; }
@media (max-width: 767.98px) {
  body[data-ap-page="crea-sessio"] .ap-spotify-editable { border-collapse: separate; }
  body[data-ap-page="crea-sessio"] .ap-spotify-editable tbody tr.ap-spotify-track-main { grid-template-columns: 20px minmax(0, 1fr) 32px; align-items: center; gap: 8px 6px; padding: 12px 10px 8px; margin-top: 12px; border: 1px solid var(--ap-border); border-bottom: 0; border-radius: 10px 10px 0 0; background: var(--ap-elevated); }
  body[data-ap-page="crea-sessio"] .ap-spotify-editable .ap-spotify-track-number { align-self: center; }
  body[data-ap-page="crea-sessio"] .ap-spotify-editable .ap-spotify-track-actions { align-self: center; }
  body[data-ap-page="crea-sessio"] .ap-spotify-editable .ap-spotify-track-time { grid-column: 2 / 4; }
  body[data-ap-page="crea-sessio"] .ap-spotify-editable tbody tr.ap-spotify-track-extra { padding: 0 10px 10px; border: 1px solid var(--ap-border); border-top: 0; border-radius: 0 0 10px 10px; background: var(--ap-elevated); }
  body[data-ap-page="crea-sessio"] .ap-spotify-editable tbody tr.ap-spotify-track-extra td { padding: 4px 0 0; border: 0; }
  body[data-ap-page="crea-sessio"] .ap-spotify-track-settings { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}
/* Calendari: eix separat, dies plegables en mòbil i impressió completa. */
.ap-planning-family .ap-p4-calendar { grid-template-columns: 54px repeat(var(--p4-days),minmax(0,1fr)); }
.ap-p4-calendar-day:first-child { grid-column: span 2; }
.ap-p4-calendar-day > summary { display: block; list-style: none; }
.ap-p4-calendar-day > summary::-webkit-details-marker { display: none; }
@media (min-width: 1200px) {
  .ap-p4-calendar-day:not([open]) > .ap-p4-calendar-body { display: grid; }
}
@media (max-width: 1199.98px) {
  .ap-planning-family .ap-p4-calendar { grid-template-columns: minmax(0,1fr); }
  .ap-p4-calendar-day:first-child { grid-column: auto; }
  .ap-p4-calendar-day > summary { cursor: pointer; }
  .ap-p4-calendar-day > summary h3::after { content: "+"; float: right; }
  .ap-p4-calendar-day[open] > summary h3::after { content: "−"; }
  .ap-p4-calendar-day:not([open]) > .ap-p4-calendar-body { display: none; }
}
@media (max-width: 575.98px) {
  .ap-planning-family .ap-planning-option-help { grid-column: 1 / -1; }
  .ap-planning-family .ap-planning-savebar { gap: 10px; }
  .ap-planning-family.ap-planning-dirty .ap-planning-bulkbar { bottom: calc(max(20px,var(--ap-demo-clearance,20px)) + 166px); }
}
@media print {
  .ap-planning-family .ap-p4-calendar { grid-template-columns: 54px repeat(var(--p4-days),minmax(0,1fr)) !important; }
  .ap-p4-calendar-day:first-child { grid-column: span 2; }
  .ap-p4-calendar-day:not([open]) > .ap-p4-calendar-body { display: grid !important; }
  .ap-p4-calendar-day > summary h3::after { display: none; }
}

/* Paritat P3 · perfil, usuaris, grups i descàrregues */
body.ap-p3 { font-size: 14px; }
.ap-p3 .ap-help, .ap-p3 .ap-eyebrow, .ap-p3 .ap-chip,
.ap-p3 .form-text, .ap-p3 .invalid-feedback, .ap-p3 .small, .ap-p3 small,
.ap-p3 .ap-demo-control, .ap-p3 .ap-user-info > span { font-size: 12.5px; }
.ap-p3 .btn:not(.ap-iconbtn) { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; border-radius: 999px; }
.ap-p3 .ap-iconbtn, .ap-p3 .btn-close { flex: 0 0 34px; width: 34px; height: 34px; min-height: 34px; padding: 0; border-radius: 8px; }
.ap-p3 .ap-table .ap-iconbtn { flex-basis: 32px; width: 32px; height: 32px; min-height: 32px; border-radius: 8px; }
.ap-p3 .form-control, .ap-p3 .form-select { min-width: 0; min-height: 42px; border-radius: 10px; font-size: 14px; }
.ap-p3 .form-label, .ap-p3 .ap-field > label { display: block; margin-bottom: 7px; font-size: 12.5px; }
.ap-p3 textarea.form-control { min-height: 84px; }
.ap-p3 .form-control[readonly] { color: var(--ap-subtle-contrast); background: var(--ap-row-hover); }
.ap-p3 #infoMessage .alert { padding-right: 54px; overflow-wrap: anywhere; }
.ap-p3 #infoMessage .alert .btn-close { top: 9px; right: 10px; margin: 0; }
.ap-p3 #infoMessage .alert p:last-of-type { margin-bottom: 0; }
.ap-p3 .ap-profile-heading > div, .ap-p3 .ap-profile-heading h1,
.ap-p3 .ap-user-details, .ap-p3 .ap-download-name > div { min-width: 0; overflow-wrap: anywhere; }
.ap-p3 .ap-profile-heading h1 { margin-bottom: 8px; }
.ap-p3 .ap-profile-heading > div > p { overflow-wrap: anywhere; }
.ap-p3 .ap-profile-tabs .nav-link { text-transform: none; letter-spacing: normal; font-size: 14px; }
.ap-p3 .ap-p3-group-grid, .ap-p3 .ap-p3-group-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ap-p3 .ap-p3-group-option { display: flex; align-items: flex-start; gap: 10px; min-width: 0; padding: 12px; border: 1px solid var(--ap-border); border-radius: 10px; background: var(--ap-elevated); cursor: pointer; }
.ap-p3 .ap-p3-group-option input { flex: 0 0 16px; margin-top: 3px; }
.ap-p3 .ap-p3-group-option > span { min-width: 0; overflow-wrap: anywhere; }
.ap-p3 .ap-p3-group-option .ap-chip { flex: 0 0 auto; margin-left: auto; }
.ap-p3 .ap-p3-group-option:has(input:checked) { border-color: var(--ap-primary); background: var(--ap-primary-soft); }
.ap-p3 .ap-group-description { min-height: 0; margin-bottom: 6px; color: var(--ap-text); font-size: 15px; font-weight: 700; overflow-wrap: anywhere; }
.ap-p3 .ap-group-system-name { margin-bottom: 16px; color: var(--ap-subtle-contrast); font-size: 13px; overflow-wrap: anywhere; }
.ap-p3 .ap-group-card > .card-body { min-width: 0; }
.ap-p3 .activacion[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.ap-p3 .ap-row-highlight { box-shadow: inset 3px 0 0 var(--ap-primary); }
.ap-p3 .ap-row-highlight > td { background-color: var(--ap-primary-soft); }
.ap-p3 .ap-chip--disabled, .ap-p3 .ap-download-languages [aria-disabled="true"] { border: 1px dashed var(--ap-border-strong); background: transparent; color: var(--ap-subtle-contrast); text-decoration: none; cursor: not-allowed; opacity: .7; }
.ap-p3 .ap-download-url { min-width: 0; max-width: 100%; }
.ap-p3 .ap-download-url .bi { flex-shrink: 0; }
.ap-p3 .ap-download-language { overflow-wrap: anywhere; }
.ap-p3 .ap-download-languages { display: grid; grid-template-columns: repeat(3, max-content); gap: 6px; }
.ap-p3 .ap-download-languages .ap-chip { justify-content: center; min-width: 32px; }
.ap-p3 .ap-p3-ad-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.ap-p3 .ap-p3-ad-slot { min-width: 0; padding: 10px; border: 1px solid var(--ap-border); border-radius: 10px; background: var(--ap-elevated); }
.ap-p3 .ap-p3-ad-slot.is-dragging { border-color: var(--ap-primary); box-shadow: var(--ap-focus); }
.ap-p3 .ap-p3-ad-preview { display: flex; width: 100%; aspect-ratio: 16 / 9; align-items: center; justify-content: center; overflow: hidden; padding: 0; border: 1px solid var(--ap-border); border-radius: 10px; background: #000; color: var(--ap-subtle-contrast); font-size: 12.5px; }
.ap-p3 .ap-p3-ad-preview img { width: 100%; height: 100%; object-fit: contain; }
.ap-p3 .ap-p3-ad-upload { margin-top: 10px; }
.ap-p3 .ap-p3-ad-slot .btn { max-width: 100%; padding-inline: 10px; }
.ap-p3 .ap-p3-ad-slot .invalid-feedback { font-size: 12.5px; }
.ap-p3 #profileAdModal .modal-body { background: #000; }
.ap-p3 .ap-p3-ad-lightbox { display: flex; aspect-ratio: 16 / 9; align-items: center; justify-content: center; overflow: hidden; background: #000; }
.ap-p3 .ap-p3-ad-lightbox img { width: 100%; height: 100%; object-fit: contain; }
.ap-p3 #profileAdModal .modal-footer { justify-content: space-between; }
.ap-p3 .ap-logo-preview { min-width: 0; }
.ap-p3 .ap-logo-preview img { max-width: 100%; max-height: 100%; object-fit: contain; }
.ap-p3 .ap-sticky-actions { min-width: 0; flex-wrap: wrap; }
@media (max-width: 991.98px) {
  .ap-p3 .ap-users-table tbody tr, .ap-p3 .ap-download-table tbody tr { min-width: 0; }
  .ap-p3 .ap-users-table .ap-user-identity, .ap-p3 .ap-download-name { min-width: 0; }
  .ap-p3 .ap-download-details > td { min-width: 0; }
  .ap-p3 .ap-p3-ad-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .ap-p3 .ap-page-heading { align-items: flex-start; gap: 16px; }
  .ap-p3 .ap-page-heading > div, .ap-p3 .ap-filterbar, .ap-p3 .ap-field { min-width: 0; }
  .ap-p3 .ap-users-filters .ap-segmented { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .ap-p3 .ap-p3-group-grid, .ap-p3 .ap-p3-group-options { grid-template-columns: minmax(0, 1fr); }
  .ap-p3 .ap-profile-tabs { gap: 0 14px; }
  .ap-p3 .ap-profile-switch { gap: 14px; }
  .ap-p3 .ap-profile-switch > label { min-width: 0; }
  .ap-p3 .ap-profile-heading { align-items: flex-start; }
  .ap-p3 .ap-form-actions > .btn, .ap-p3 .ap-sticky-actions > .btn { max-width: 100%; }
  .ap-p3 .ap-p3-ad-grid { gap: 10px; }
  .ap-p3 .ap-p3-ad-slot { padding: 8px; }
  .ap-p3 #profileAdModal .modal-dialog { margin-inline: 8px; }
}
.ap-p3 .ap-segmented > [data-ap-density] { flex: 0 0 34px; width: 34px; height: 34px; min-height: 34px; padding: 0; border-radius: 8px; }
.ap-p3 [data-user-filter] { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; border-radius: 999px; }

/* Paritat P7 · unificació i boxa */
.ap-boxa .ap-main, .ap-boxa-list .ap-main,
.ap-boxa .ap-page-heading > div, .ap-boxa-list .ap-page-heading > div,
.ap-boxa .ap-card-heading > div, .ap-boxa-list .ap-filterbar > .ap-field { min-width: 0; }
.ap-boxa .ap-help, .ap-boxa-list .ap-help,
.ap-boxa .invalid-feedback, .ap-boxa-list .invalid-feedback,
.ap-boxa .dropdown-item, .ap-boxa-list .dropdown-item,
.ap-boxa .ap-boxa-profile-block { font-size: 12.5px; }
.ap-boxa .ap-iconbtn, .ap-boxa-list .ap-iconbtn,
.ap-boxa-list .ap-segmented > [data-ap-density], .ap-boxa .ap-boxa-key {
  box-sizing: border-box; width: 34px; height: 34px; min-height: 34px;
  flex: 0 0 34px; padding: 0; border-radius: 8px;
}
.ap-boxa-list .ap-table .ap-iconbtn { width: 32px; height: 32px; min-height: 32px; flex-basis: 32px; }
.ap-boxa .btn, .ap-boxa-list .btn, .ap-boxa .ap-boxa-speed button {
  border-radius: 999px; font-size: 13px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
}
body[data-ap-page="edita-round"] .ap-boxa-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ap-boxa .ap-boxa-keyboard-row { display: grid; grid-template-columns: repeat(4, 34px); gap: 8px; }
.ap-boxa .ap-boxa-arrow-mirrored { display: inline-block; transform: scaleX(-1); }
.ap-boxa .ap-boxa-key .bi, .ap-boxa .ap-boxa-keychip .bi { pointer-events: none; }
.ap-boxa .ap-boxa-profile-block { min-width: 0; overflow-wrap: anywhere; }
.ap-boxa .ap-boxa-template-card form { flex-wrap: wrap; }
.ap-boxa .ap-boxa-template-card form .btn { max-width: 100%; white-space: normal; }
.ap-boxa-list #boxa-copy-user-options [role="option"] { overflow-wrap: anywhere; }
.ap-boxa [data-boxa-form-message], .ap-boxa-list [data-boxa-form-message] { margin-bottom: 16px; overflow-wrap: anywhere; }
.ap-boxa [data-boxa-form-message] .alert, .ap-boxa-list [data-boxa-form-message] .alert { margin-bottom: 0; font-size: 14px; }
.ap-boxa .ap-boxa-detail-server-content, .ap-boxa-list .ap-boxa-detail-server-content { max-width: 100%; overflow-x: auto; font-size: 14px; }
.ap-boxa .ap-boxa-detail-server-content table, .ap-boxa-list .ap-boxa-detail-server-content table { width: 100%; }
.ap-boxa-list .ap-boxa-detail-server-content th, .ap-boxa-list .ap-boxa-detail-server-content td { padding: 8px; font-size: 14px; overflow-wrap: anywhere; }
@media (max-width: 575.98px) {
  .ap-boxa .ap-editor-title-line, .ap-boxa .ap-card-heading,
  .ap-boxa .ap-editor-heading-actions, .ap-boxa-list .ap-table-footer { flex-wrap: wrap; }
  .ap-boxa .ap-boxa-template-card { padding: 14px; }
  .ap-boxa .ap-editor-tracks .ap-card-heading > div { flex-wrap: wrap; }
  .ap-boxa .ap-boxa-speed { flex-wrap: wrap; }
  .ap-boxa .ap-boxa-speed .btn { padding-inline: 10px; }
  .ap-boxa .ap-editor-sidebar .btn, .ap-boxa .modal-footer .btn,
  .ap-boxa-list .modal-footer .btn { max-width: 100%; white-space: normal; }
  .ap-boxa-list .ap-filterbar { gap: 16px; }
  .ap-boxa-list .ap-filterbar > .ap-field { flex: 1 1 100%; width: 100%; }
  .ap-boxa-list .ap-density-field .ap-segmented { width: fit-content; }
  .ap-boxa-list #boxa-copy-user-options { max-height: 180px; }
  .ap-boxa .ap-boxa-profile-bars { padding-inline: 10px; gap: 3px; }
}

/* Retocs d'en Xavi 04/10 */
.ap-xavi-spotify-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.ap-xavi-spotify-heading > .form-check { flex: 1 1 270px; min-width: 0; margin-bottom: 0; }
body[data-ap-page="crea-sessio"] .ap-xavi-spotify-tutorial,
body[data-ap-page="editor"] .ap-xavi-tutorial-button {
  min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere;
  border-radius: 999px; font-size: 13px; text-transform: none; letter-spacing: normal;
}
.ap-xavi-spotify-tutorial .bi, .ap-xavi-tutorial-button .bi { flex-shrink: 0; }
.ap-xavi-spotify-tutorial > span { min-width: 0; }
.ap-xavi-mixmeister-heading { flex-wrap: wrap; justify-content: flex-start; gap: 12px; }
.ap-xavi-mixmeister-heading > h2 { min-width: 0; overflow-wrap: anywhere; }
.ap-xavi-mixmeister-logo { width: 140px; max-width: 100%; height: auto; padding: 6px 8px; background: #fff; border-radius: 8px; }
.ap-xavi-playlist-heading { align-items: flex-start; flex-wrap: wrap; }
.ap-xavi-playlist-heading > div { flex: 1 1 240px; min-width: 0; }
.ap-xavi-playlist-heading > .ap-chip { flex-shrink: 0; }
.ap-xavi-playlist-code { margin-bottom: 20px; padding-top: 16px; border-top: 1px solid var(--ap-border); font-size: 13px; }
.ap-xavi-playlist-code > summary { color: var(--ap-text); cursor: pointer; font-weight: 600; }
.ap-xavi-playlist-code > summary:focus-visible { outline: 2px solid var(--ap-primary); outline-offset: 4px; border-radius: 4px; }
.ap-xavi-playlist-code code { color: var(--ap-subtle-contrast); font-family: var(--bs-font-monospace); font-size: 12.5px; overflow-wrap: anywhere; }
.ap-xavi-playlist-code .ap-help > code { display: block; }
.ap-r5-masterclass-library .ap-table-intro { flex-wrap: wrap; }
.ap-r5-masterclass-library .ap-xavi-masterclass-order { display: block; font-size: 12.5px; }
body[data-ap-page="crea-sessio"] .ap-eyebrow,
body[data-ap-page="editor"] .ap-eyebrow { font-size: 12.5px; }
body[data-ap-page="crea-sessio"] #create-tutorial-player { padding: 16px; text-align: center; overflow-wrap: anywhere; }
body[data-ap-page="crea-sessio"] #tutorialModal .modal-header,
body[data-ap-page="editor"] #editorTutorialModal .modal-header { gap: 12px; }
body[data-ap-page="crea-sessio"] #tutorial-title,
body[data-ap-page="editor"] #editor-tutorial-title { min-width: 0; overflow-wrap: anywhere; }

/* Editor de producció: un tooltip de focus després d'un toc no tapa el següent control. */
body.ap-editor-page[data-ap-page="editor"] .tooltip { pointer-events: none; }
body.ap-editor-page[data-ap-page="editor"] [data-track-drag] { touch-action: none; user-select: none; }
@media (hover: none) {
  body.ap-editor-page[data-ap-page="editor"] .tooltip { display: none; }
}

/* Retocs d'en Xavi 04/10 · 2 */
.ap-sidebar .ap-languages { display: flex; flex-wrap: nowrap; justify-content: center; gap: 4px; }
@media (min-width: 992px) {
  html[data-ap-sidebar="collapsed"] .ap-sidebar .ap-languages { display: none; }
}

/* B5 · Cel·les d’usuaris: el layout mòbil conserva la geometria en tots els idiomes. */
@media (max-width: 991.98px) {
  .ap-users-table td.ap-user-cell,
  .ap-users-table td.ap-user-email,
  .ap-users-table td.ap-user-phone { grid-column: 1 / -1; }
  .ap-users-table td.ap-user-state::before,
  .ap-users-table td.ap-user-admin::before {
    content: attr(data-label) " · ";
    color: var(--ap-subtle-contrast);
    font-size: 12.5px;
  }
}

/* B5-E2: accions mòbils dels tipus de vídeo, independentment de l’idioma. */
@media (max-width: 575.98px) {
  .ap-r7-video-table td.ap-actions-cell { justify-content: flex-end; }
  .ap-r7-video-table td.ap-actions-cell::before { margin-right: auto; }
}

.ap-p5 .ap-avatar{position:relative;overflow:hidden}
.ap-p5 .ap-avatar>img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}

/* El formulari GET comparteix la barra amb el control de densitat. */
.ap-session-filterbar > .ap-session-filter-form { display: contents; }

/* Reproducció directa: quatre enllaços amb la mateixa geometria en llista i editor. */
.ap-session-play-buttons { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 4px; }
.ap-session-play-buttons > .ap-iconbtn.ap-session-play {
  box-sizing: border-box; flex: 0 0 40px; width: 40px; height: 40px; min-width: 40px; min-height: 40px;
  padding: 0; border-radius: var(--ap-radius-icon); opacity: 1;
  color: var(--ap-play-text); background: var(--ap-play-bg); border-color: var(--ap-play-color);
}
.ap-session-play--fc { --ap-play-color: var(--ap-success); --ap-play-text: var(--ap-success-text); --ap-play-bg: var(--bs-success-bg-subtle); }
.ap-session-play--ftp { --ap-play-color: var(--ap-danger); --ap-play-text: var(--ap-danger-text); --ap-play-bg: var(--bs-danger-bg-subtle); }
.ap-session-play-buttons > .ap-session-play:focus-visible {
  color: var(--ap-play-text); background: var(--ap-play-bg); border-color: var(--ap-play-color);
}
.ap-session-play-buttons > .ap-session-play:hover,
.ap-session-play-buttons > .ap-session-play:active {
  color: #FFF; background: var(--ap-play-color); border-color: var(--ap-play-color);
}
.ap-session-play-buttons > .ap-session-play:focus-visible { outline: 2px solid var(--ap-play-text); outline-offset: 2px; }
.ap-session-play-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; margin: 0; padding: 12px 24px; color: var(--ap-subtle-contrast); font-size: 12.5px; border-bottom: 1px solid var(--ap-border); }
.ap-session-play-legend > span { display: inline-flex; align-items: center; gap: 6px; }
.ap-session-play-legend .bi { font-size: 14px; }
.ap-session-play-swatch { display: inline-block; flex: 0 0 10px; width: 10px; height: 10px; border-radius: 2px; }
.ap-session-play-swatch--fc { background: var(--ap-success); }
.ap-session-play-swatch--ftp { background: var(--ap-danger); }
body[data-ap-page="sessions"] .ap-table .ap-actions-cell { width: 288px; }
@media (max-width: 991.98px) {
  body[data-ap-page="sessions"] .ap-table .ap-actions-cell { width: auto; }
  body[data-ap-page="sessions"] .ap-actions,
  body[data-ap-page="components"] .ap-actions { flex-wrap: wrap; }
  .ap-session-play-legend { padding: 0 0 16px; border: 0; }
}

/* F03 · ESPECIFICACIÓ F1-2 §10.1-2: només les pàgines noves de Mescles. */
body[data-ap-page="mescles"] #mescles { min-width: 0; }
body[data-ap-page="mescles"] #mescles .ap-mx-page { min-width: 0; }
body[data-ap-page="mescles"] #mescles .ap-page-heading { flex-wrap: wrap; }
body[data-ap-page="mescles"] #mescles .ap-page-heading > div { min-width: 0; }
body[data-ap-page="mescles"] #mescles h1 { overflow-wrap: anywhere; }
body[data-ap-page="mescles"] #mescles .ap-mx-table-scroll { overflow-x: auto; }
body[data-ap-page="mescles"] #mescles .ap-mx-workspace { min-height: 240px; }
/* F04 · ESPECIFICACIÓ F1-2 §10.3; REGLAMENT 1.7 E1-5. */
/* El contenidor amb overflow és l'ancoratge de sticky: top: 64px tapava la primera fila. */
body[data-ap-page="mescles"] #mescles .ap-mx-table-scroll .ap-table thead th { position: static; }
body[data-ap-page="mescles"] #mescles .ap-mx-number {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
body[data-ap-page="mescles"] #mescles .ap-mx-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
body[data-ap-page="mescles"] #mescles .ap-mx-name { overflow-wrap: anywhere; }
body[data-ap-page="mescles"] #mescles [data-mx-fila] { cursor: pointer; }
body[data-ap-page="mescles"] #mescles .ap-mx-status { font-weight: 600; }
body[data-ap-page="mescles"] #mescles .ap-mx-empty { padding: 24px 0; }
body[data-ap-page="mescles"] #mescles .ap-mx-desktop-warning { display: none; }
body[data-ap-page="mescles"] #mescles :focus-visible {
  outline: 2px solid var(--ap-link);
  outline-offset: 3px;
}
@media (max-width: 1199.98px) {
  body[data-ap-page="mescles"] #mescles .ap-mx-desktop-warning { display: block; }
}

/* F05 · ESPECIFICACIÓ F1-2 §10.4/§10.10; REGLAMENT 1.7 E1-5.
 * Biblioteca pròpia: cap selector ni geometria de pàgines existents.
 */
body[data-ap-page="mescles"] #mescles .ap-mx-library {
  --bs-offcanvas-width: 520px;
  max-width: 100vw;
}
body[data-ap-page="mescles"] #mescles .ap-mx-bib-tabs,
body[data-ap-page="mescles"] #mescles .ap-mx-bib-search,
body[data-ap-page="mescles"] #mescles .ap-mx-bib-pagination {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 16px;
}
body[data-ap-page="mescles"] #mescles .ap-mx-bib-tabs { flex-wrap: wrap; }
body[data-ap-page="mescles"] #mescles .ap-mx-bib-search input { min-width: 0; }
body[data-ap-page="mescles"] #mescles .ap-mx-bib-pagination { justify-content: space-between; margin-top: 16px; }
body[data-ap-page="mescles"] #mescles .ap-mx-bib-font {
  padding: 16px 0;
  border-bottom: 1px solid var(--ap-border);
  overflow-wrap: anywhere;
}
body[data-ap-page="mescles"] #mescles .ap-mx-bib-status {
  white-space: normal;
  text-align: start;
  line-height: 1.5;
}
body[data-ap-page="mescles"] #mescles .ap-mx-bib-warning,
body[data-ap-page="mescles"] #mescles .ap-mx-bib-info { font-size: .875rem; }
body[data-ap-page="mescles"] #mescles .ap-mx-bib-detail { margin-top: 12px; }
body[data-ap-page="mescles"] #mescles .ap-mx-bib-tracks { padding-left: 28px; }
body[data-ap-page="mescles"] #mescles .ap-mx-bib-tracks li { margin: 6px 0; }
body[data-ap-page="mescles"] #mescles .ap-mx-bib-tracks button {
  width: 100%;
  text-align: start;
  white-space: normal;
}
body[data-ap-page="mescles"] #mescles .ap-mx-bib-detail > button { margin: 4px 8px 4px 0; }
body[data-ap-page="mescles"] #mescles .ap-mx-bib-font > button { margin: 4px 8px 4px 0; }
body[data-ap-page="mescles"] #mescles .ap-mx-library [aria-pressed="true"] {
  color: var(--ap-text);
  background: var(--ap-elevated);
  border-color: var(--ap-link);
  box-shadow: inset 3px 0 0 var(--ap-link);
}

/* F07a · ESPECIFICACIÓ F1-3 §10.5/§10.10; REGLAMENT 1.7 E1-5.
 * Només el compositor nou; les zones SVG les resol el perfil pur de F01.
 */
body[data-ap-page="mescles"] #mescles .ap-mx-workspace { padding: 24px; }
body[data-ap-page="mescles"] #mescles .ap-mx-comp-header,
body[data-ap-page="mescles"] #mescles .ap-mx-comp-toolbar,
body[data-ap-page="mescles"] #mescles .ap-mx-comp-summary,
body[data-ap-page="mescles"] #mescles .ap-mx-comp-history,
body[data-ap-page="mescles"] #mescles .ap-mx-comp-mode {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
body[data-ap-page="mescles"] #mescles .ap-mx-comp-header { justify-content: space-between; margin-bottom: 16px; }
body[data-ap-page="mescles"] #mescles .ap-mx-comp-name { flex: 1 1 280px; min-width: 0; max-width: 600px; }
body[data-ap-page="mescles"] #mescles .ap-mx-comp-name label { margin-bottom: 6px; }
body[data-ap-page="mescles"] #mescles .ap-mx-comp-summary { font-variant-numeric: tabular-nums; }
body[data-ap-page="mescles"] #mescles .ap-mx-comp-duration { font-size: 1.4rem; }
body[data-ap-page="mescles"] #mescles .ap-mx-comp-saved { color: var(--ap-secondary); }
body[data-ap-page="mescles"] #mescles .ap-mx-comp-toolbar { margin-bottom: 24px; }
body[data-ap-page="mescles"] #mescles [data-mx-genera] { margin-left: auto; }
body[data-ap-page="mescles"] #mescles .ap-mx-timeline { position: relative; min-width: 0; padding-top: 40px; }
/* Mateix rectangle de dibuix que svgGraph F01: x=58 .. width-12. */
body[data-ap-page="mescles"] #mescles .ap-mx-bandes,
body[data-ap-page="mescles"] #mescles .ap-mx-unions { position: absolute; left: 58px; right: 12px; }
body[data-ap-page="mescles"] #mescles .ap-mx-bandes { top: 0; height: 32px; }
body[data-ap-page="mescles"] #mescles .ap-mx-band {
  position: absolute;
  height: 32px;
  padding: 3px 6px;
  border: 1px solid var(--ap-border-strong);
  border-top: 3px solid var(--ap-link);
  background: var(--ap-elevated);
  color: var(--ap-text);
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  text-align: left;
}
body[data-ap-page="mescles"] #mescles .ap-mx-band-masterclass { border-top-color: var(--ap-warning); }
body[data-ap-page="mescles"] #mescles .ap-mx-band[aria-pressed="true"],
body[data-ap-page="mescles"] #mescles .ap-mx-fragment[aria-pressed="true"],
body[data-ap-page="mescles"] #mescles .ap-mx-comp-mode [aria-pressed="true"] {
  border-color: var(--ap-link);
  box-shadow: inset 0 0 0 1px var(--ap-link);
  background: var(--ap-elevated);
  color: var(--ap-text);
}
body[data-ap-page="mescles"] #mescles .ap-mx-grafica { min-width: 0; min-height: 260px; }
body[data-ap-page="mescles"] #mescles .ap-mx-grafica svg { display: block; }
body[data-ap-page="mescles"] #mescles .ap-mx-grafica svg text { fill: var(--ap-secondary); }
body[data-ap-page="mescles"] #mescles .ap-mx-grafica svg > line { stroke: var(--ap-border); }
body[data-ap-page="mescles"] #mescles .ap-mx-grafica #graph-cursor { visibility: hidden; }
body[data-ap-page="mescles"] #mescles .ap-mx-unions { top: 40px; height: 225px; pointer-events: none; }
body[data-ap-page="mescles"] #mescles .ap-mx-union-mark {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 24px;
  transform: translateX(-50%);
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--ap-text);
  font-weight: 700;
  text-align: center;
  pointer-events: auto;
}
body[data-ap-page="mescles"] #mescles .ap-mx-union-mark::after {
  content: "";
  position: absolute;
  top: 24px;
  bottom: 0;
  left: 50%;
  border-left: 2px solid var(--ap-text);
}
body[data-ap-page="mescles"] #mescles .ap-mx-union-mark[aria-pressed="true"]::after { border-color: var(--ap-link); }
body[data-ap-page="mescles"] #mescles .ap-mx-comp-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; margin-top: 24px; }
body[data-ap-page="mescles"] #mescles .ap-mx-comp-columns > * { min-width: 0; }
body[data-ap-page="mescles"] #mescles .ap-mx-fragments { padding: 0; margin: 0; list-style: none; }
body[data-ap-page="mescles"] #mescles .ap-mx-fragment-row { display: flex; flex-direction: column; gap: 6px; overflow-wrap: anywhere; }
body[data-ap-page="mescles"] #mescles .ap-mx-fragment { width: 100%; text-align: left; white-space: normal; overflow-wrap: anywhere; }
body[data-ap-page="mescles"] #mescles .ap-mx-fragment-union { padding: 12px 0; }
body[data-ap-page="mescles"] #mescles .ap-mx-edit-controls { min-width: 0; }
body[data-ap-page="mescles"] #mescles .ap-mx-inspector h2,
body[data-ap-page="mescles"] #mescles .ap-mx-procedencia,
body[data-ap-page="mescles"] #mescles .ap-mx-breadcrumb,
body[data-ap-page="mescles"] #mescles .ap-mx-incidencies { overflow-wrap: anywhere; }
body[data-ap-page="mescles"] #mescles .ap-mx-time-field { margin-bottom: 16px; }
body[data-ap-page="mescles"] #mescles .ap-mx-time-field label { margin-bottom: 6px; }
body[data-ap-page="mescles"] #mescles .ap-mx-time-controls { display: flex; gap: 8px; }
body[data-ap-page="mescles"] #mescles .ap-mx-time-controls input { min-width: 0; max-width: 160px; font-variant-numeric: tabular-nums; }
body[data-ap-page="mescles"] #mescles .ap-mx-info { color: var(--ap-secondary); }