/* Only the design picker: escape transformed/clipped editor cards. */
body > .template-switch-overlay {
  position:fixed; inset:0; z-index:100000;
  display:flex; justify-content:center; align-items:center;
  box-sizing:border-box; padding:24px;
  overflow:hidden; overscroll-behavior:contain;
  background:rgba(24,42,32,.56);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
}
body > .template-switch-overlay > .template-switch-dialog {
  box-sizing:border-box; width:min(880px,100%); min-height:0;
  max-height:calc(var(--template-switch-height,100vh) - 48px);
  margin:0; overflow:auto; overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch; isolation:isolate;
  background:#fff; color:#304437; border:1px solid #ded9d2;
  border-radius:24px; box-shadow:0 30px 90px rgba(30,27,23,.28);
}
body > .template-switch-overlay .template-switch-head {
  position:sticky; top:0; z-index:5;
  display:flex; justify-content:space-between; align-items:flex-start; gap:20px;
  padding:24px 26px 20px; border-bottom:1px solid #eee9e2;
  background:rgba(255,255,255,.96); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
}
body > .template-switch-overlay .template-switch-head h2 { margin:10px 0 6px; font:inherit; font-size:26px; line-height:1.2; font-weight:600; }
body > .template-switch-overlay .template-switch-head p { margin:0; max-width:620px; color:#747d75; font-size:12px; line-height:1.55; }
body > .template-switch-overlay .template-switch-close {
  flex:0 0 44px; width:44px; height:44px; min-width:44px;
  display:grid; place-items:center; border:1px solid #ded9d2; border-radius:50%;
  background:#f7faf7; color:inherit; cursor:pointer;
}
body > .template-switch-overlay .template-switch-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:20px 22px max(18px,env(safe-area-inset-bottom)); }
body > .template-switch-overlay .template-switch-option { position:relative; min-width:0; padding:8px; background:#fff; color:inherit; border:1px solid #ded9d2; border-radius:16px; font:inherit; text-align:left; cursor:pointer; }
body > .template-switch-overlay .template-switch-option.active { border-color:#344b40; box-shadow:0 0 0 2px rgba(52,75,64,.08); }
body > .template-switch-overlay .template-switch-option-preview { aspect-ratio:4/5; border-radius:11px; overflow:hidden; background:#eee8de; }
body > .template-switch-overlay .template-switch-cover { display:block; width:100%; height:100%; object-fit:cover; }
body > .template-switch-overlay .template-switch-option-copy { display:grid; gap:3px; padding:10px 4px 5px; }
body > .template-switch-overlay .template-switch-option-copy strong { font-size:12px; line-height:1.3; }
body > .template-switch-overlay .template-switch-option-copy span { color:#747d75; font-size:10px; }
body > .template-switch-overlay .template-switch-check { position:absolute; right:13px; top:13px; width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:#20362d; color:#fff; }
body > .template-switch-overlay .template-switch-empty { margin:10px 22px 22px; padding:14px 16px; border-radius:12px; background:#f7f4ef; font-size:12px; line-height:1.5; }
body > .template-switch-overlay button:focus-visible { outline:2px solid #32674b; outline-offset:2px; }
@media(max-width:720px) {
  body > .template-switch-overlay { align-items:flex-end; padding:max(8px,env(safe-area-inset-top)) 0 0; }
  body > .template-switch-overlay > .template-switch-dialog {
    width:100%; max-height:calc(var(--template-switch-height,100vh) - max(8px,env(safe-area-inset-top)));
    border-radius:24px 24px 0 0;
  }
  body > .template-switch-overlay .template-switch-head { padding:18px; gap:12px; }
  body > .template-switch-overlay .template-switch-head h2 { font-size:23px; }
  body > .template-switch-overlay .template-switch-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; padding:14px 14px max(18px,env(safe-area-inset-bottom)); }
}
