/* Parcours « au mètre » (adhésif, média non adhésif) — styles partagés par
   /adhesif-commande et /media-au-metre (déplacés tels quels de la page
   adhésif le 14/09). Tout le reste (cartes, dropzone, nesting, récap,
   boutons) vient de main.css + pages.css : les pages suivent la charte /dtf. */
.adz-file { border-bottom: 1px solid var(--border-light, #f3f4f6); padding: 10px 0; }
.adz-file:last-child { border-bottom: none; }
.adz-file__name { font-size: 13.5px; font-weight: 600; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.adz-file__ctrl { display: flex; align-items: center; gap: 7px; margin-top: 6px; font-size: 13px; color: var(--text-muted, #6b7280); flex-wrap: wrap; }
.adz-dim, .adz-qty { width: 76px; padding: 5px 7px; border: 1px solid var(--border, #d1d5db); border-radius: 7px; font-family: inherit; }
.adz-del { margin-left: auto; border: none; background: none; color: #9ca3af; cursor: pointer; }
.adz-del:hover { color: #dc2626; }
.adz-cut-badge { background: #fdf2f8; color: #be185d; border: 1px solid #fbcfe8; border-radius: 999px; padding: 1px 9px; font-size: 11px; font-weight: 700; }
.adz-err-badge { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; border-radius: 999px; padding: 1px 9px; font-size: 11px; font-weight: 700; }
.adz-optgroup { margin-bottom: 14px; }
.adz-optgroup__name { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted, #6b7280); margin-bottom: 6px; }
.adz-req { color: #b45309; font-size: 10px; }
/* Option = une ligne : [radio] [icône grise] libellé (inclus) [?]. La ligne
   ne s'étire pas sur toute la largeur : la zone de survol qui ouvre
   l'info-bulle est celle du texte de l'option (CDC « au passage de la
   souris sur le texte de l'option »). */
.adz-opt-row { position: relative; display: flex; align-items: center; gap: 6px; padding: 3px 0; width: max-content; max-width: 100%; }
.adz-opt { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; cursor: pointer; }
.adz-opt input { margin: 0 2px 0 0; }
.adz-opt__ico { width: 16px; text-align: center; color: #9ca3af; font-size: 12.5px; }
.adz-opt__free { color: #059669; font-size: 11px; font-weight: 600; }
.adz-tip { display: inline-flex; }
.adz-tip__btn { width: 18px; height: 18px; border-radius: 50%; border: 1px solid #d1d5db; background: #fff; color: #9ca3af; font-size: 9.5px; cursor: help; display: inline-flex; align-items: center; justify-content: center; padding: 0; font-family: inherit; }
.adz-tip__btn:hover, .adz-tip__btn:focus-visible { color: var(--primary, #1681C4); border-color: var(--primary, #1681C4); outline: none; }
.adz-tip__box { display: none; position: absolute; left: 0; top: calc(100% + 6px); z-index: 30; width: min(340px, 82vw); padding: 9px 12px; background: #1f2937; color: #fff; font-size: 12.5px; line-height: 1.45; border-radius: 8px; box-shadow: 0 6px 20px rgba(0,0,0,.18); font-weight: 400; }
.adz-tip__box::before { content: ''; position: absolute; top: -5px; left: 16px; border: 5px solid transparent; border-top: none; border-bottom-color: #1f2937; }
.adz-opt-row:hover .adz-tip__box, .adz-opt-row:focus-within .adz-tip__box, .adz-opt-row.is-tip .adz-tip__box { display: block; }
/* ── Bloc Caractéristiques : libellés du CDC, valeurs longues sur 2 lignes ── */
.adz-tech ul li { flex-wrap: wrap; gap: 2px 12px; }
.adz-tech ul li strong { text-align: right; }
.adz-tech ul li strong.adz-tech__long { flex-basis: 100%; text-align: left; }
.adz-prep-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 10px; padding: 10px 14px; border: 1px solid var(--border, #e5e7eb); border-radius: 10px; background: #fff; color: var(--primary, #1681C4); font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: .15s; }
.adz-prep-btn i { color: #9ca3af; }
.adz-prep-btn:hover, .adz-prep-btn:focus-visible { border-color: var(--primary, #1681C4); background: #f0f7fc; outline: none; }
/* ── Étape 1 : titre + bouton d'aide, cartes produits ── */
.adz-step-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.adz-step-head .dtf-card-title { margin-bottom: 0; }
.adz-help-btn { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border: 1px solid var(--border, #e5e7eb); border-radius: 999px; background: #fff; color: var(--text, #374151); font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: .15s; }
.adz-help-btn i { color: #9ca3af; }
.adz-help-btn:hover, .adz-help-btn:focus-visible { border-color: var(--primary, #1681C4); color: var(--primary, #1681C4); outline: none; }
.adz-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.adz-card { position: relative; text-align: left; display: flex; flex-direction: column; gap: 5px; padding: 12px 12px 11px; border: 1px solid var(--border, #e5e7eb); border-radius: 12px; background: #fff; cursor: pointer; font-family: inherit; color: var(--text, #374151); transition: .15s; }
.adz-card:hover { border-color: var(--primary, #1681C4); box-shadow: 0 2px 8px rgba(22,129,196,.12); }
.adz-card:focus-visible { outline: 2px solid var(--primary, #1681C4); outline-offset: 2px; }
.adz-card.is-on { border-color: var(--primary, #1681C4); box-shadow: 0 0 0 2px rgba(22,129,196,.22); background: #f5faff; }
.adz-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.adz-card__name { font-size: 14px; font-weight: 700; color: var(--dark, #1a1a2e); line-height: 1.25; }
.adz-card__check { width: 18px; height: 18px; border-radius: 50%; border: 2px solid #d1d5db; flex: none; display: flex; align-items: center; justify-content: center; font-size: 9px; color: #fff; }
.adz-card.is-on .adz-card__check { background: var(--primary, #1681C4); border-color: var(--primary, #1681C4); }
.adz-card__ref { font-size: 12px; color: var(--text-muted, #6b7280); display: flex; align-items: center; gap: 6px; }
.adz-card__ref i { color: #9ca3af; font-size: 11px; }
.adz-life { display: inline-flex; align-items: center; gap: 5px; align-self: flex-start; padding: 2px 9px; border-radius: 999px; background: #f3f4f6; color: #374151; font-size: 11.5px; font-weight: 700; border: 1px solid #e5e7eb; white-space: nowrap; }
.adz-life i { color: #9ca3af; }
.adz-card.is-on .adz-life { background: #e0effa; border-color: #bfdcf1; color: #0f5a8c; }
.adz-card__use { font-size: 12.5px; color: var(--text-muted, #6b7280); line-height: 1.35; }
/* Logo fabricant (cahier ADH-B-4). Les fichiers sont DÉJÀ en gris
   unicolore : aucun filtre ici. Poussé en bas de carte pour que les
   logos d'une même rangée s'alignent quelle que soit la longueur du
   texte au-dessus. */
/* Même boîte pour les quatre (hauteur 24 px, largeur plafonnée à 80 px) :
   un logo très allongé (Aslan) se réduit dans la boîte au lieu d'écraser
   les logos plus compacts (Orafol), qui restaient illisibles à hauteur
   égale. */
.adz-card__logo { margin-top: auto; padding-top: 6px; display: flex; align-items: center; min-height: 24px; }
.adz-card__logo:empty { display: none; }
.adz-card__logo-img { display: block; height: 24px; width: auto; max-width: 80px; object-fit: contain; object-position: left center; opacity: .85; transition: opacity .15s; }
.adz-card:hover .adz-card__logo-img, .adz-card.is-on .adz-card__logo-img { opacity: 1; }
.adz-cards-note { margin: 10px 0 0; font-size: 11.5px; color: var(--text-muted, #6b7280); display: flex; align-items: flex-start; gap: 6px; }
.adz-cards-note i { color: #9ca3af; margin-top: 2px; }
/* ── Pop-up générique (préparation de fichier, aide au choix) ── */
.adz-modal { display: none; position: fixed; inset: 0; z-index: 99995; /* au-dessus du bouton « Signaler un bug » (99990) */ align-items: center; justify-content: center; padding: 16px; }
.adz-modal.is-open { display: flex; }
.adz-modal__backdrop { position: absolute; inset: 0; background: rgba(15,23,42,.55); backdrop-filter: blur(2px); }
.adz-modal__dialog { position: relative; width: 100%; max-width: 720px; max-height: calc(100vh - 32px); overflow: auto; background: #fff; border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.3); padding: 26px 28px 24px; outline: none; animation: adzPop .18s ease-out; }
@keyframes adzPop { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
.adz-modal__close { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--border, #e5e7eb); background: #fff; color: #6b7280; cursor: pointer; font-size: 15px; display: flex; align-items: center; justify-content: center; }
.adz-modal__close:hover, .adz-modal__close:focus-visible { color: var(--dark, #1a1a2e); border-color: #9ca3af; outline: none; }
.adz-modal__title { font-size: 19px; font-weight: 800; color: var(--dark, #1a1a2e); margin: 0 34px 4px 0; display: flex; align-items: center; gap: 10px; }
.adz-modal__title i { color: #9ca3af; }
.adz-modal__intro { font-size: 13.5px; color: var(--text-muted, #6b7280); margin: 0 0 16px; }
.adz-prep-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.adz-prep-list li { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--border, #e5e7eb); border-radius: 10px; }
.adz-prep-list li i { flex: none; width: 22px; text-align: center; color: #9ca3af; font-size: 16px; margin-top: 2px; }
.adz-prep-list strong { display: block; font-size: 13.5px; color: var(--dark, #1a1a2e); }
.adz-prep-list span { font-size: 12.5px; color: var(--text-muted, #6b7280); line-height: 1.4; }
.adz-modal__foot { margin: 16px 0 0; font-size: 12.5px; color: var(--text-muted, #6b7280); display: flex; gap: 7px; align-items: center; }
.adz-modal__foot i { color: #9ca3af; }
.adz-modal__foot a { color: var(--primary, #1681C4); }
body.adz-modal-open { overflow: hidden; }
.adz-filters { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
.adz-filter { padding: 5px 11px; border-radius: 999px; border: 1px solid var(--border, #e5e7eb); background: #fff; font-family: inherit; font-size: 12px; font-weight: 600; color: var(--text, #374151); cursor: pointer; transition: .15s; }
.adz-filter:hover { border-color: var(--primary, #1681C4); }
.adz-filter.is-on { background: var(--primary, #1681C4); border-color: var(--primary, #1681C4); color: #fff; }
.adz-help-list { display: flex; flex-direction: column; gap: 10px; }
.adz-help-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 14px; align-items: center; padding: 12px 14px; border: 1px solid var(--border, #e5e7eb); border-radius: 12px; transition: .15s; }
.adz-help-row.is-dim { opacity: .35; }
.adz-help-row.is-on { border-color: var(--primary, #1681C4); background: #f5faff; }
.adz-help-row__head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.adz-help-row__name { font-size: 14px; font-weight: 700; color: var(--dark, #1a1a2e); }
.adz-help-row__ref { font-size: 12px; color: var(--text-muted, #6b7280); }
.adz-help-row__cur { font-size: 11px; font-weight: 700; color: var(--primary, #1681C4); text-transform: uppercase; letter-spacing: .04em; }
.adz-help-row__use { font-size: 13px; color: var(--text, #374151); margin: 3px 0 0; line-height: 1.4; }
.adz-help-row__pros { margin: 5px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--text-muted, #6b7280); }
.adz-help-row__pros li { display: inline-flex; gap: 5px; align-items: center; }
.adz-help-row__pros i { color: #9ca3af; font-size: 10px; }
.adz-help-row__btn { padding: 9px 14px; border-radius: 9px; border: 1px solid var(--primary, #1681C4); background: #fff; color: var(--primary, #1681C4); font-family: inherit; font-weight: 700; font-size: 12.5px; cursor: pointer; white-space: nowrap; transition: .15s; }
.adz-help-row__btn:hover, .adz-help-row__btn:focus-visible { background: var(--primary, #1681C4); color: #fff; outline: none; }
@media (max-width: 560px) {
  .adz-help-row { grid-template-columns: 1fr; }
  .adz-help-row__btn { width: 100%; }
  .adz-modal__dialog { padding: 22px 16px 18px; }
}
/* Bouton 3 choix impression/découpe — 3e enfant de .nesting-toolbar,
   entre la ligne « Longueur estimée » et le zoom (CDC point 8). */
.adz-cutchoice { display: inline-flex; border: 1px solid var(--border, #d1d5db); border-radius: 10px; overflow: hidden; }
.adz-cutchoice button { border: none; background: #fff; padding: 8px 13px; font-size: 12.5px; font-weight: 600; cursor: pointer; color: var(--text, #374151); border-right: 1px solid var(--border-light, #e5e7eb); font-family: inherit; }
.adz-cutchoice button:last-child { border-right: none; }
.adz-cutchoice button.is-on { background: #be185d; color: #fff; }
.adz-cutwarn { font-size: 12.5px; color: #b45309; background: #fffbeb; border: 1px solid #fde68a; border-radius: 9px; padding: 8px 12px; margin-bottom: 10px; }
/* Rouleau : damier = adhésif SANS encre (le PDF ne dessine pas son fond) */
.adz-roll { position: relative; background: transparent; border: 1px solid #94a3b8; margin: 0 auto; }
.adz-rect { position: absolute; border: 1.5px dashed; border-radius: 2px; overflow: hidden; background: transparent; }
.adz-empty { color: var(--text-muted, #9ca3af); font-size: 13px; text-align: center; padding: 14px 0; }
.adz-price-row { display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px; padding: 5px 0; }
.adz-price-row--ht { font-weight: 700; border-top: 1px solid var(--border, #e5e7eb); margin-top: 6px; padding-top: 8px; }
.adz-gate { max-width: 560px; margin: 40px auto; text-align: center; }
/* Un rouleau de plusieurs mètres défile au lieu d'étirer la page. */
#adzPreview { max-height: 72vh; }
.adz-page-badge { display:inline-block; background:#eef2ff; color:#4338ca;
border:1px solid #c7d2fe; border-radius:6px; padding:1px 8px; font-size:11.5px;
font-weight:700; margin-left:6px; vertical-align:1px; }

/* ═══ Vue « Média non adhésif au mètre » (cahier MEDIA-C, 14/09) ═══ */
.adz-media-sec + .adz-media-sec { margin-top: 14px; }
.adz-notice { display: flex; gap: 9px; align-items: flex-start; margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: #fffbeb; border: 1px solid #fde68a; color: #92400e; font-size: 13px; line-height: 1.45; }
.adz-notice i { margin-top: 2px; }
.adz-notice a { color: inherit; font-weight: 700; }
.adz-media-sec__title { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted, #6b7280); margin: 0 0 7px; }
.adz-card__ico { color: #9ca3af; margin-right: 7px; font-size: 13px; }
.adz-card.is-on .adz-card__ico { color: var(--primary, #1681C4); }
.adz-card.is-off { cursor: default; background: #f9fafb; border-style: dashed; }
.adz-card.is-off:hover { border-color: var(--border, #e5e7eb); box-shadow: none; }
.adz-card.is-off .adz-card__name, .adz-card.is-off .adz-card__ref, .adz-card.is-off .adz-card__use { color: #9ca3af; }
.adz-card__quote { margin-top: auto; padding-top: 6px; font-size: 12px; font-weight: 600; color: var(--primary, #1681C4); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.adz-card__quote:hover { text-decoration: underline; }
.adz-options-for { font-size: 13px; color: var(--text-muted, #6b7280); margin: -8px 0 12px; }
.dtf-upload-card.is-disabled .dtf-card-title, .dtf-upload-card.is-disabled .adz-options-for { opacity: .45; }
.adz-noopt { display: flex; align-items: center; gap: 9px; margin: 0; padding: 12px 14px; border: 1px dashed var(--border, #d1d5db); border-radius: 10px; background: #f9fafb; color: #6b7280; font-size: 13px; }
.adz-noopt i { color: #9ca3af; }
.adz-ogroup { margin-bottom: 16px; }
.adz-ogroup__name { font-size: 14px; font-weight: 700; color: var(--dark, #1a1a2e); margin-bottom: 8px; display: flex; align-items: center; gap: 8px; }
.adz-ogroup__note { margin: 6px 0 0; font-size: 11.5px; color: var(--text-muted, #6b7280); }
.adz-ocards { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
/* « Sans » et « 4 côtés » côte à côte, « Sélection personnalisée » dessous
   sur toute la largeur : la colonne centrale fait ~620 px. */
.adz-ocards--sides { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.adz-ocards--sides .adz-ocard--custom { grid-column: 1 / -1; }
.adz-ocard { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; text-align: left; padding: 12px 34px 12px 12px; border: 1px solid var(--border, #e5e7eb); border-radius: 12px; background: #fff; cursor: pointer; font-family: inherit; color: var(--text, #374151); transition: .15s; min-width: 0; }
.adz-ocard:hover { border-color: var(--primary, #1681C4); }
.adz-ocard:focus-visible { outline: 2px solid var(--primary, #1681C4); outline-offset: 2px; }
.adz-ocard.is-on { border-color: var(--primary, #1681C4); box-shadow: 0 0 0 2px rgba(22,129,196,.2); background: #f5faff; }
.adz-ocard__check { position: absolute; top: 10px; right: 10px; width: 20px; height: 20px; border-radius: 50%; border: 2px solid #d1d5db; display: flex; align-items: center; justify-content: center; font-size: 10px; color: #fff; }
.adz-ocard.is-on .adz-ocard__check { background: var(--primary, #1681C4); border-color: var(--primary, #1681C4); }
.adz-ocard__name { font-size: 13.5px; font-weight: 700; color: var(--dark, #1a1a2e); line-height: 1.3; }
.adz-ocard__free { display: inline-block; margin-left: 4px; padding: 1px 8px; border-radius: 999px; background: #e0effa; color: #0f5a8c; font-size: 11px; font-weight: 700; vertical-align: 1px; }
.adz-ocard__desc { font-size: 12px; color: var(--text-muted, #6b7280); line-height: 1.4; }
.adz-seg { display: inline-flex; border: 1px solid var(--border, #d1d5db); border-radius: 8px; overflow: hidden; margin-top: 2px; }
.adz-seg__btn { padding: 5px 10px; font-size: 12px; font-weight: 600; color: var(--text, #374151); background: #fff; cursor: pointer; border-right: 1px solid var(--border, #e5e7eb); white-space: nowrap; }
.adz-seg__btn:last-child { border-right: none; }
.adz-seg__btn.is-on { background: var(--primary, #1681C4); color: #fff; }
.adz-seg--side { margin-top: 0; }
.adz-seg--side .adz-seg__btn { padding: 3px 8px; font-size: 11.5px; }
.adz-custom { display: flex; align-items: center; gap: 14px; width: 100%; }
.adz-custom__col { display: flex; flex-direction: column; gap: 6px; flex: 1 1 0; min-width: 0; }
.adz-side { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; min-height: 36px; padding: 5px 8px; border: 1px solid var(--border, #e5e7eb); border-radius: 8px; background: #fff; }
.adz-side.is-on { border-color: var(--primary, #1681C4); background: #eef6fc; }
.adz-side__lbl { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.adz-sketch { flex: 0 0 auto; width: 150px; height: auto; }
.adz-sketch__sheet { fill: #fff; stroke: #1f2937; stroke-width: 1.5; }
.adz-sketch__hem { stroke: var(--primary, #1681C4); stroke-width: 2; stroke-dasharray: 5 3; }
.adz-sketch__eyelet { fill: #fff; stroke: var(--primary, #1681C4); stroke-width: 1.6; }
.adz-compat { display: flex; align-items: center; gap: 9px; margin-top: 4px; padding: 10px 14px; border-radius: 10px; background: #ecfdf5; border: 1px solid #a7f3d0; color: #047857; font-size: 13.5px; font-weight: 700; }
.adz-compat.is-bad { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }
.adz-usefilters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 14px; }
.adz-usecard { display: flex; align-items: center; justify-content: center; gap: 9px; padding: 12px 10px; border: 1px solid var(--border, #e5e7eb); border-radius: 10px; background: #fff; font-family: inherit; font-size: 13px; font-weight: 600; color: var(--dark, #1a1a2e); cursor: pointer; transition: .15s; }
.adz-usecard i { color: #6b7280; font-size: 16px; }
.adz-usecard:hover { border-color: var(--primary, #1681C4); }
.adz-usecard.is-on { border-color: var(--primary, #1681C4); background: #f0f7fc; box-shadow: 0 0 0 2px rgba(22,129,196,.18); }
.adz-usecard.is-on i { color: var(--primary, #1681C4); }
.adz-bhelp { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.3fr) minmax(0, 1fr); gap: 14px; align-items: center; padding: 14px; border: 1px solid var(--border, #e5e7eb); border-radius: 12px; transition: .15s; }
.adz-bhelp + .adz-bhelp { margin-top: 10px; }
.adz-bhelp.is-dim { opacity: .4; }
.adz-bhelp.is-reco { border-color: var(--primary, #1681C4); box-shadow: 0 0 0 2px rgba(22,129,196,.16); }
.adz-bhelp__id { display: flex; gap: 12px; align-items: flex-start; }
.adz-bhelp__ico { font-size: 26px; color: #6b7280; width: 34px; text-align: center; margin-top: 2px; }
.adz-bhelp__name { font-size: 14.5px; font-weight: 800; color: var(--dark, #1a1a2e); }
.adz-bhelp__sub { font-size: 12.5px; color: var(--text-muted, #6b7280); margin: 2px 0 6px; }
.adz-bhelp__tag { display: inline-block; padding: 3px 10px; border-radius: 999px; background: #e0effa; color: #0f5a8c; font-size: 11.5px; font-weight: 700; }
.adz-bhelp__why p { margin: 0 0 6px; font-size: 12.5px; color: var(--text, #374151); line-height: 1.4; }
.adz-bhelp__why ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; color: var(--text, #374151); }
.adz-bhelp__why li i { color: var(--primary, #1681C4); }
.adz-bhelp__side { display: flex; flex-direction: column; gap: 8px; }
.adz-bhelp__tip { margin: 0; padding: 8px 10px; border-radius: 8px; background: #f0f7fc; font-size: 12px; color: #1f3b57; line-height: 1.4; }
.adz-bhelp__tip i { color: var(--primary, #1681C4); margin-right: 4px; }
.adz-bhelp__btn { display: block; text-align: center; padding: 9px 12px; border-radius: 9px; border: 1px solid var(--primary, #1681C4); background: #fff; color: var(--primary, #1681C4); font-family: inherit; font-weight: 700; font-size: 13px; cursor: pointer; text-decoration: none; }
.adz-bhelp__btn.is-primary, .adz-bhelp__btn:hover { background: var(--primary, #1681C4); color: #fff; }
@media (max-width: 640px) {
  .adz-bhelp { grid-template-columns: 1fr; }
  .adz-usefilters { grid-template-columns: 1fr; }
  .adz-ocards--sides { grid-template-columns: 1fr; }
  .adz-custom { flex-wrap: wrap; justify-content: center; }
  .adz-custom__col { flex-basis: 100%; }
  .adz-sketch { order: -1; width: 130px; }
}