/* Site-content inline editor — chrome. Scoped op .l2s-* zodat het de site-CSS niet raakt.
   Alleen actief als de editor-JS een ingelogde beheerder herkent (de knoppen worden dan pas toegevoegd). */

.l2s-fab{
  position:fixed; right:22px; bottom:22px; z-index:2147483000;
  display:inline-flex; align-items:center; gap:8px;
  font:600 15px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:#fff; background:linear-gradient(135deg,#4a90c2,#3a7aa8);
  border:none; border-radius:999px; padding:13px 20px; cursor:pointer;
  box-shadow:0 14px 30px -10px rgba(74,144,194,.75); transition:transform .15s,box-shadow .15s;
}
.l2s-fab:hover{ transform:translateY(-2px); box-shadow:0 18px 38px -10px rgba(74,144,194,.85); }
.l2s-editing .l2s-fab{ display:none; }

/* ===== Bewerkmodus-header: een eigen app-balk die bovenaan de pagina hangt (de site schuift eronder). ===== */
/* ── LEESMAAT + RAAKVLAK VAN DE BEWERKMODUS (27-09-2026, owner) ──────────────────────────────────
   Deze overlay droeg 40 tekstgroottes onder de 15px-vloer (ui-ux-design-system §8) — labels van
   11px, een badge van 9px, invoervelden van 13px. Het is beheerders-UI, maar het wordt door
   dezelfde vrijwilligers op dezelfde telefoon gebruikt als de rest van het platform.
   Twee tokens: alles 15px, invoer 16px. Die 16px is geen smaak maar een iOS-regel — onder 16px
   zoomt Safari automatisch in zodra je een veld aanraakt en staat je pagina scheef. */
:root{ --l2s-bar-h:56px; --l2s-ed-fs:15px; --l2s-ed-fs-in:16px; }
.l2s-bar{
  position:fixed; left:0; right:0; top:0; z-index:2147483001; height:var(--l2s-bar-h);
  display:none; align-items:center; gap:14px; padding:0 16px;
  background:linear-gradient(180deg,#132433,#0e1a24); color:#e8eef4;
  border-bottom:1px solid rgba(143,208,255,.14);
  font:500 var(--l2s-ed-fs)/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  box-shadow:0 10px 30px -12px rgba(0,0,0,.7);
}
.l2s-editing .l2s-bar{ display:flex; }
.l2s-editing{ padding-top:var(--l2s-bar-h) !important; }   /* content onder de vaste header schuiven */

/* Merk-chip links. */
.l2s-brand{ display:inline-flex; align-items:center; gap:9px; padding-right:14px; border-right:1px solid rgba(159,178,194,.16); }
.l2s-brand-mark{
  display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:8px;
  background:linear-gradient(135deg,#4a90c2,#3a7aa8); color:#fff; font-size:var(--l2s-ed-fs); box-shadow:0 4px 12px -4px rgba(74,144,194,.8);
}
.l2s-brand-name{ font-weight:700; letter-spacing:.2px; color:#dceaf6; }

/* Tools-zone — UITBREIDBAAR: hier komt straks het menu voor grids & bouwblokken. */
.l2s-tools{ display:inline-flex; align-items:center; gap:8px; }
.l2s-tool{
  display:inline-flex; align-items:center; gap:7px;
  font:600 var(--l2s-ed-fs)/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; color:#c6d4e2;
  background:rgba(159,178,194,.10); border:1px solid rgba(159,178,194,.18); border-radius:9px; padding:8px 13px; cursor:pointer;
}
.l2s-tool:hover:not([disabled]){ background:rgba(159,178,194,.2); }
.l2s-tool[disabled]{ opacity:.6; cursor:not-allowed; }
.l2s-tool-soon{
  font:700 var(--l2s-ed-fs)/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; text-transform:uppercase; letter-spacing:.6px;
  color:#0e1a24; background:#8fd0ff; border-radius:999px; padding:3px 6px;
}

.l2s-bar-status{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:var(--l2s-ed-fs); color:#9fb2c2; }
.l2s-bar-spacer{ flex:1; }
/* HEETTE `.l2s-btn` tot 27-09-2026. Dat is óók de knopklasse van de publieke clubsite
   (modules/website/frontend/site.css), en deze stylesheet laadt daarná — dus de editor zette
   ongemerkt de knoppen van de SITE op 13px. Beheerders zagen daardoor een andere site dan
   bezoekers. Een overlay mag nooit de opmaak van de pagina eronder overschrijven: eigen naam. */
.l2s-edbtn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px; white-space:nowrap; min-height:44px;
  font:600 var(--l2s-ed-fs)/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  border-radius:9px; padding:9px 15px; border:1px solid transparent; cursor:pointer;
}
.l2s-ico{ font-size:15px; line-height:1; }   /* icoon-span (blijft ook op mobiel zichtbaar) */
.l2s-lbl{ line-height:1; }                    /* label-span (verborgen op mobiel → icoon-only) */
.l2s-edbtn-back{ background:transparent; color:#e8eef4; border-color:rgba(159,178,194,.32); }
.l2s-edbtn-back:hover{ background:rgba(159,178,194,.14); }
.l2s-edbtn-ghost{ background:transparent; color:#e8eef4; border-color:rgba(159,178,194,.32); }
.l2s-edbtn-ghost:hover{ background:rgba(159,178,194,.14); }
.l2s-edbtn-save{ background:#4a90c2; color:#fff; }
.l2s-edbtn-save:hover:not([disabled]){ background:#3a7aa8; }
.l2s-edbtn-save[disabled]{ opacity:.45; cursor:not-allowed; }

/* Smalle schermen (telefoon): compacte balk. Nav-knoppen worden icoon-only, niet-essentiële
   elementen verdwijnen. Volgorde blijft: [←] [🏠] [☰] ————— [Opslaan]. Alles past op ~320px. */
@media (max-width:640px){
  :root{ --l2s-bar-h:52px; }
  .l2s-bar{ gap:6px; padding:0 10px; }
  .l2s-brand, .l2s-tools, .l2s-bar-status{ display:none; }        /* merk-chip, blokken-tool, status-tekst weg */
  /* De labels STONDEN hier op display:none — «Terug», «Beheer» en «Menu» werden kale icoontjes.
     Dat mag niet (§8: een icoon draagt altijd zijn woord; past het niet, dan scrólt de balk, zoals
     .l2s-userbar). Dus: woorden blijven staan en de balk schuift horizontaal als hij te vol is. */
  .l2s-bar{ overflow-x:auto; overflow-y:hidden; scrollbar-width:none; }
  .l2s-bar::-webkit-scrollbar{ display:none; }
  .l2s-bar > *{ flex:none; }
  .l2s-ico{ font-size:17px; }
  .l2s-edbtn-save{ padding:9px 16px; }                              /* 'Opslaan' blijft mét tekst (primaire actie) */
}

/* Bewerkbare slots — alleen zichtbaar in bewerkmodus. */
.l2s-editing [data-l2s-slot]{ outline:1px dashed rgba(74,144,194,.5); outline-offset:3px; border-radius:3px; transition:outline-color .15s,background .15s; }
.l2s-editing [data-l2s-slot][data-l2s-kind="text"]{ cursor:text; }
.l2s-editing [data-l2s-slot][data-l2s-kind="text"]:hover{ background:rgba(74,144,194,.06); }
.l2s-editing [data-l2s-slot][data-l2s-kind="text"]:focus{ outline:2px solid #4a90c2; background:rgba(74,144,194,.09); }

/* Afbeelding-slot: de "Vervang"-knop verschijnt over de foto. */
.l2s-img-ctl{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:5;
  font:600 var(--l2s-ed-fs)/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:#0e1a24; background:#fff; border:none; border-radius:10px; padding:11px 16px; cursor:pointer;
  box-shadow:0 8px 20px -8px rgba(0,0,0,.5); opacity:0; pointer-events:none; transition:opacity .15s;
}
.l2s-editing [data-l2s-kind="image"]{ outline-offset:0; }
.l2s-editing [data-l2s-kind="image"]:hover + .l2s-img-ctl,
.l2s-img-ctl:hover{ opacity:1; pointer-events:auto; }
.l2s-editing .l2s-img-ctl{ opacity:.001; pointer-events:auto; } /* altijd klikbaar in bewerkmodus (0.001 = hit-area) */
.l2s-editing [data-l2s-kind="image"]:hover ~ .l2s-img-ctl{ opacity:1; }

.l2s-toast{
  position:fixed; left:50%; bottom:28px; transform:translate(-50%,140%); z-index:2147483002;
  background:#0e1a24; color:#fff; padding:12px 18px; border-radius:12px;
  font:500 var(--l2s-ed-fs)/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  box-shadow:0 14px 40px -12px rgba(0,0,0,.6); transition:transform .3s cubic-bezier(.2,.9,.3,1.2); max-width:calc(100vw - 32px);
}
.l2s-toast.show{ transform:translate(-50%,0); }
.l2s-toast.ok{ border-left:4px solid #1f9d78; }
.l2s-toast.err{ border-left:4px solid #dd6b55; }
.l2s-toast.muted{ border-left:4px solid #4a5a68; }

/* Versies: ⟲-knop per veld + popover met de laatste 5 versies. */
.l2s-ver{
  position:absolute; z-index:2147483001; display:none; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:50%; border:none; cursor:pointer;
  background:#0e1a24; color:#fff; font-size:var(--l2s-ed-fs); box-shadow:0 4px 12px -4px rgba(0,0,0,.5);
}
.l2s-ver:hover{ background:#3a7aa8; }
.l2s-pop{
  position:absolute; z-index:2147483002; display:none; width:300px; max-width:calc(100vw - 20px);
  background:#fff; border:1px solid #dce4ec; border-radius:12px; box-shadow:0 18px 50px -14px rgba(16,38,58,.4);
  padding:8px; font:400 var(--l2s-ed-fs)/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; color:#1c2833;
}
.l2s-pop-h{ font-weight:700; font-size:var(--l2s-ed-fs); color:#5a6b7b; padding:4px 8px 8px; }
.l2s-pop-empty{ padding:8px; color:#8493a2; }
.l2s-pop-row{
  display:flex; align-items:center; gap:8px; width:100%; text-align:left; border:none; background:transparent;
  padding:8px; border-radius:8px; cursor:pointer;
}
.l2s-pop-row:hover{ background:#e8f4fc; }
.l2s-pop-val{ flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#233240; }
.l2s-pop-when{ flex:none; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:var(--l2s-ed-fs); color:#8493a2; }
.l2s-pop-default{
  display:block; width:100%; text-align:left; margin-top:6px; padding:9px 8px; cursor:pointer;
  border:none; border-top:1px solid #eef2f6; background:transparent; color:#3a7aa8; font-weight:600; border-radius:0 0 8px 8px;
}
.l2s-pop-default:hover{ background:#f1f5f9; }

@media (prefers-reduced-motion:reduce){ .l2s-fab,.l2s-toast,.l2s-edbtn-save{ transition:none; } }

/* ===== Hamburger-menu ===== */
.l2s-menubtn{
  display:inline-flex;align-items:center;gap:8px;background:rgba(143,208,255,.12);border:1px solid rgba(143,208,255,.28);
  color:#eaf4ff;font:600 var(--l2s-ed-fs)/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;border-radius:9px;padding:8px 13px;cursor:pointer;
}
.l2s-menubtn:hover{ background:rgba(143,208,255,.2); }
.l2s-menu{
  position:fixed;top:calc(var(--l2s-bar-h) + 4px);left:170px;z-index:2147483003;width:290px;max-width:calc(100vw - 20px);
  background:#fff;border:1px solid #dce4ec;border-radius:14px;box-shadow:0 18px 50px -14px rgba(16,38,58,.45);padding:8px;
}
.l2s-menu-h{ margin:6px 10px;font-size:var(--l2s-ed-fs);letter-spacing:.4px;text-transform:uppercase;color:#64748b; }
.l2s-menu-item{
  display:flex;align-items:center;gap:11px;width:100%;text-align:left;border:none;background:transparent;
  padding:11px 10px;border-radius:10px;cursor:pointer;font:600 var(--l2s-ed-fs)/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#1c2833;
}
.l2s-menu-item:hover{ background:#f1f6fb; }
.l2s-menu-item.soon{ opacity:.6; }
.l2s-menu-ic{ width:30px;height:30px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:15px;background:#eef5fb;flex:none; }
.l2s-menu-tx small{ display:block;font-weight:400;color:#64748b;font-size:var(--l2s-ed-fs); }

/* Upsell-item in het menu (gelockte Complete Webbuilder) */
.l2s-menu-up{ margin-top:2px;background:linear-gradient(180deg,#f2f7fd,#eaf3fb);border:1px solid #d5e5f4; }
.l2s-menu-up:hover{ background:linear-gradient(180deg,#e9f3fc,#dcecfa); }
.l2s-menu-ic--lock{ background:linear-gradient(135deg,#4a90c2,#3a7aa8);color:#fff; }
.l2s-up-price{ display:inline-block;margin-left:8px;font-size:var(--l2s-ed-fs);font-weight:800;color:#fff;background:#3a7aa8;border-radius:999px;padding:2px 8px;vertical-align:middle; }

/* ===== Optimize-paneel (site-breed) ===== */
.l2s-opt-scrim{ position:fixed;inset:0;background:rgba(9,18,26,.42);z-index:2147483004;opacity:0;pointer-events:none;transition:opacity .2s; }
.l2s-opt-scrim.on{ opacity:1;pointer-events:auto; }
.l2s-opt{
  position:fixed;top:0;right:0;bottom:0;width:440px;max-width:94vw;background:#f7f9fc;z-index:2147483005;
  box-shadow:-24px 0 60px -30px rgba(9,18,26,.6);transform:translateX(100%);transition:transform .24s cubic-bezier(.2,.9,.3,1);
  display:flex;flex-direction:column;font:var(--l2s-ed-fs)/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#1c2833;
}
.l2s-opt.on{ transform:none; }
.l2s-opt-h{ display:flex;align-items:center;gap:10px;padding:15px 18px;background:linear-gradient(180deg,#132433,#0e1a24);color:#eaf4ff; }
.l2s-opt-tt{ font-weight:700;font-size:15px; }
.l2s-opt-ts{ font-size:var(--l2s-ed-fs);color:#9fb8cc; }
.l2s-opt-ti{ flex:1; }
.l2s-opt-x{ background:rgba(255,255,255,.1);border:none;color:#fff;width:44px;height:44px;border-radius:9px;cursor:pointer;font-size:16px; }
.l2s-opt-x:hover{ background:rgba(255,255,255,.2); }
.l2s-opt-body{ overflow-y:auto;padding:16px 18px;flex:1; }
.l2s-opt-sec{ background:#fff;border:1px solid #dce4ec;border-radius:14px;padding:14px 15px;margin-bottom:14px; }
.l2s-opt-sec>h4{ margin:0 0 10px;font-size:var(--l2s-ed-fs); }
.l2s-opt-fld{ margin:11px 0; }
.l2s-opt-fld.row{ display:flex;align-items:center;justify-content:space-between;gap:12px; }
.l2s-opt-fld label{ display:block;font-weight:600;font-size:var(--l2s-ed-fs);margin-bottom:5px;color:#334155; }
.l2s-opt-fld.row label{ margin-bottom:0; }
.l2s-opt-in{
  width:100%;min-height:44px;box-sizing:border-box;border:1px solid #dce4ec;border-radius:9px;padding:9px 11px;font:var(--l2s-ed-fs-in) -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:#1c2833;background:#fff;resize:vertical;
}
.l2s-opt-in:focus{ outline:2px solid #4a90c2;border-color:#4a90c2; }
.l2s-opt-ft{ display:flex;align-items:center;gap:12px;padding:12px 18px;border-top:1px solid #e2e8f0;background:#fff; }
.l2s-opt-status{ flex:1;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--l2s-ed-fs);color:#64748b; }

/* ── RAAKVLAKVLOER 44px (27-09-2026) ─────────────────────────────────────────────────────────────
   Elke bediening in de bewerkmodus was tussen de 20 en 35px hoog; op een telefoon mik je dan naast
   de knop. 44px is de vloer uit §8. */
.l2s-menubtn,.l2s-tool,.l2s-faq-add,.l2s-faq-del,.l2s-pop-row,.l2s-menu-item,.l2s-ver,.l2s-img-ctl,.l2s-fab{
  min-height:44px;
}
/* Twee bedieningen blijven bewust klein — het ronde «i»-badgetje staat óver de inhoud en de
   schakelaar is een schakelaar. Niet het uiterlijk vergroten dus, maar alleen het RAAKVLAK: een
   onzichtbaar vlak van 44px rond het midden. Het badgetje is al `position:absolute`, de schakelaar
   `position:relative`, dus het pseudo-element hangt in beide gevallen aan de knop zelf. */
.l2s-info-btn::after,.l2s-sw::after{
  content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%);
}

/* toggle-switch */
.l2s-sw{ position:relative;width:42px;height:24px;border-radius:999px;background:#cdd8e3;cursor:pointer;flex:none;transition:background .15s; }
.l2s-sw.on{ background:#1f9d78; }
.l2s-sw i{ position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .15s;box-shadow:0 1px 3px rgba(0,0,0,.3); }
.l2s-sw.on i{ left:20px; }

/* uren-grid */
.l2s-hours{ display:grid;grid-template-columns:72px 1fr 1fr;gap:7px 8px;align-items:center; }
.l2s-hours span{ font-size:var(--l2s-ed-fs);color:#64748b;font-weight:600; }
/* `min-width:0` — zonder dat houdt een <input> z'n eigen minimumbreedte (±20 tekens) vast en liep
   dit raster van drie kolommen 134px buiten het paneel (gemeten: 419px in een kolom van 285px). */
.l2s-hours input{ min-width:0;width:100%;box-sizing:border-box;min-height:44px;border:1px solid #dce4ec;border-radius:8px;padding:7px 9px;font:var(--l2s-ed-fs-in) -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; }
.l2s-hours input:focus{ outline:2px solid #4a90c2;border-color:#4a90c2; }

/* alt-tekst inline op afbeeldingen (fase B) */
.l2s-alt-ctl{
  position:absolute;left:10px;right:10px;bottom:10px;z-index:6;display:flex;align-items:center;gap:8px;
  background:rgba(14,26,36,.86);border-radius:9px;padding:6px 9px;font-size:var(--l2s-ed-fs);backdrop-filter:blur(3px);
  opacity:0;pointer-events:none;transition:opacity .14s;
}
.l2s-alt-ctl.l2s-alt-ctl--show{ opacity:1;pointer-events:auto; }
.l2s-alt-lb{ font-weight:700;color:#8fd0ff;flex:none; }
.l2s-alt-in{
  flex:1;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:#fff;border-radius:7px;
  padding:6px 9px;font:var(--l2s-ed-fs-in) -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
.l2s-alt-in::placeholder{ color:#9fb6c8; }
/* Kleine afbeelding (logo): alt-balk hangt ONDER de foto i.p.v. eroverheen. */
.l2s-alt-ctl--below{ top:calc(100% + 8px); bottom:auto; left:0; right:auto; width:300px; max-width:88vw; }

/* tekenteller (per-pagina paneel) */
.l2s-cnt{ float:right;font:600 var(--l2s-ed-fs) ui-monospace,SFMono-Regular,Menlo,monospace;color:#94a3b8; }
.l2s-cnt.good{ color:#1f9d78; } .l2s-cnt.warn{ color:#e0a63b; } .l2s-cnt.bad{ color:#dd6b55; }

/* live Google-snippet-preview */
.l2s-gprev{ border:1px solid #dce4ec;border-radius:11px;padding:11px 13px;background:#fff;margin-top:8px; }
.l2s-gprev .g-u{ font-size:var(--l2s-ed-fs);color:#5f6b7a; }
.l2s-gprev .g-t{ color:#1a0dab;font-size:16px;line-height:1.3;margin:2px 0;overflow:hidden;text-overflow:ellipsis; }
.l2s-gprev .g-d{ font-size:var(--l2s-ed-fs);color:#4d5156; }

/* FAQ-editor (per-pagina GEO) */
.l2s-faq-row{ display:flex;gap:6px;margin:8px 0;align-items:stretch; }
.l2s-faq-fields{ flex:1;display:flex;flex-direction:column;gap:5px; }
.l2s-faq-q,.l2s-faq-a{ min-height:44px;box-sizing:border-box;border:1px solid #dce4ec;border-radius:8px;padding:8px 10px;font:var(--l2s-ed-fs-in) -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#1c2833; }
.l2s-faq-a{ resize:vertical; }
.l2s-faq-q:focus,.l2s-faq-a:focus{ outline:2px solid #4a90c2;border-color:#4a90c2; }
.l2s-faq-del{ flex:none;width:34px;border:none;background:#f0e9ff;color:#6a3fe0;border-radius:8px;cursor:pointer;font-size:16px; }
.l2s-faq-add{ border:1px dashed #c9b8ff;background:#faf7ff;color:#6a3fe0;border-radius:9px;padding:8px 12px;font-weight:600;font-size:var(--l2s-ed-fs);cursor:pointer;width:100%; }

/* AI-antwoord-preview (per-pagina GEO) */
.l2s-aiprev{ border:1px solid #e3d9ff;background:linear-gradient(180deg,#faf8ff,#fff);border-radius:11px;padding:11px 13px;margin-top:8px; }
.l2s-aiprev-cap{ font-size:var(--l2s-ed-fs);font-weight:700;color:#6a3fe0;text-transform:uppercase;letter-spacing:.4px;margin-bottom:5px; }
.l2s-aiprev .ai-t{ margin:0;font-size:var(--l2s-ed-fs);color:#3a2c5e; }

/* (i) uitleg-knoppen + popover */
.l2s-info-btn{
  position:absolute;z-index:2147483001;width:20px;height:20px;border-radius:50%;border:none;cursor:pointer;
  background:#4a90c2;color:#fff;font:700 var(--l2s-ed-fs)/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  display:inline-flex;align-items:center;justify-content:center;box-shadow:0 2px 8px -2px rgba(74,144,194,.7);
}
.l2s-info-btn:hover{ filter:brightness(1.1); }
.l2s-info-btn.inline{ position:static;width:18px;height:18px;font-size:var(--l2s-ed-fs);background:#1f9d78;flex:none; }
.l2s-info-pop{
  position:absolute;z-index:2147483006;width:300px;max-width:calc(100vw - 20px);background:#fff;border:1px solid #dce4ec;
  border-radius:12px;box-shadow:0 18px 50px -14px rgba(16,38,58,.4);padding:13px 15px;
  font:400 var(--l2s-ed-fs)/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#33475b;
}
.l2s-info-h{ margin:0 0 6px;font-size:var(--l2s-ed-fs);color:#1c2833; }
.l2s-info-pop p{ margin:.35em 0; }

@media(max-width:520px){ .l2s-menu{ left:10px; } }

/* ── keuze-slots (generiek; eerste gebruiker: website-sponsorstrook) ── */
.l2s-choice-ctl{display:flex;align-items:center;gap:8px;justify-content:center;margin:0 auto 10px;
  width:max-content;max-width:92vw;border:1.5px dashed rgba(37,99,235,.65);background:rgba(37,99,235,.08);
  border-radius:999px;padding:6px 12px;font:700 var(--l2s-ed-fs)/1.4 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  color:#2563eb}
.l2s-choice-sel{border:1px solid rgba(37,99,235,.5);background:#fff;color:#0f172a;border-radius:8px;
  padding:5px 9px;font:650 var(--l2s-ed-fs-in) ui-sans-serif,system-ui,sans-serif;cursor:pointer;max-width:60vw}
.l2s-choice-sel:focus-visible{outline:2px solid #2563eb;outline-offset:2px}