.saved-designs-modal[hidden],.saved-designs__collection[hidden],.saved-designs__empty[hidden],.saved-designs__footer [hidden] { display:none; }
.saved-designs-modal { position:fixed; inset:0; z-index:58; display:grid; place-items:center; padding:28px; }
.saved-designs-modal__scrim { position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; border-radius:0; background:rgb(2 8 17 / 72%); box-shadow:none; backdrop-filter:blur(5px); cursor:default; }
.saved-designs-modal__dialog { position:relative; display:flex; width:min(1120px,calc(100vw - 56px)); max-height:min(800px,calc(100dvh - 56px)); min-height:min(650px,calc(100dvh - 56px)); flex-direction:column; overflow:hidden; border:1px solid color-mix(in srgb,var(--accent) 38%,var(--edge)); border-radius:22px; background:color-mix(in srgb,var(--surface-2) 96%,transparent); color:var(--text); box-shadow:0 26px 80px rgb(0 0 0 / 42%); outline:0; }
.saved-designs-modal__header { position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:16px; padding:26px 68px 20px 28px; }
.saved-designs-modal__icon { display:grid; place-items:center; width:46px; height:46px; border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line)); border-radius:13px; background:var(--accent-wash); color:var(--accent); }
.saved-designs-modal__icon .lucide { width:25px; height:25px; }
.saved-designs-modal__heading h2 { margin:0; color:var(--headline); font-size:25px; line-height:1.15; letter-spacing:-.45px; }
.saved-designs-modal__heading p { margin:7px 0 0; color:var(--sub); font-size:13px; }
.saved-designs-modal__close { position:absolute; top:17px; right:18px; display:grid; place-items:center; width:38px; height:38px; padding:0; border:1px solid var(--line); border-radius:50%; background:var(--surface-1); color:var(--text-soft); box-shadow:none; }
.saved-designs-modal__close:hover { border-color:var(--edge); background:var(--surface-3); color:var(--text); }
.saved-designs-modal__new { display:flex; align-items:center; justify-content:center; gap:7px; min-height:40px; padding:8px 14px; border:1px solid color-mix(in srgb,var(--accent) 50%,var(--line)); border-radius:10px; background:transparent; color:var(--text); box-shadow:none; font-size:12px; font-weight:650; }
.saved-designs-modal__new:hover { background:var(--accent-wash); }
.saved-designs-modal__controls { display:grid; grid-template-columns:minmax(260px,1fr) auto auto; align-items:center; gap:14px; padding:0 28px 16px; }
.saved-designs__search { display:flex; align-items:center; gap:10px; min-height:46px; padding:0 14px; border:1px solid var(--edge); border-radius:11px; background:var(--surface-1); color:var(--sub); }
.saved-designs__search:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent); }
.saved-designs__search .lucide { width:18px; height:18px; }
html[data-theme] body[data-editor-shell="canvas"] .saved-designs__search input { flex:1; min-width:0; height:44px; padding:0; border:0; background:transparent; color:var(--text); box-shadow:none; outline:0; }
.saved-designs__sort { display:flex; align-items:center; gap:9px; color:var(--text-soft); font-size:12px; font-weight:650; white-space:nowrap; }
html[data-theme] body[data-editor-shell="canvas"] .saved-designs__sort select { width:176px; height:42px; padding:7px 30px 7px 11px; border-color:var(--edge); border-radius:9px; background-color:var(--surface-1); color:var(--text); }
.saved-designs__views { display:flex; gap:4px; padding:3px; border:1px solid var(--line); border-radius:10px; background:var(--surface-1); }
html[data-theme] body[data-editor-shell="canvas"] .saved-designs__views button { display:grid; place-items:center; width:36px; min-width:36px; height:34px; min-height:34px; padding:0; border:1px solid transparent; border-radius:7px; background:transparent; color:var(--sub); box-shadow:none; }
html[data-theme] body[data-editor-shell="canvas"] .saved-designs__views button[aria-pressed="true"] { border-color:var(--accent); background:var(--accent-wash); color:var(--accent); }
.saved-designs-modal__body { min-height:0; overflow:auto; padding:0 28px 22px; scrollbar-color:var(--edge) transparent; }
.saved-designs__status { margin:5px 1px 13px; color:var(--sub); font-size:12px; }
.saved-designs__status[data-state="error"] { color:var(--danger,#ef767a); }
.saved-designs__collection { display:grid; gap:14px; min-height:0; }
.saved-designs__collection[data-view="grid"] { grid-template-columns:repeat(5,minmax(0,1fr)); }
.saved-design-card { display:grid; grid-template-columns:86px minmax(0,1fr) auto; align-items:center; gap:12px; min-width:0; padding:8px; border:1px solid var(--line); border-radius:13px; background:var(--surface-1); transition:border-color .16s ease,background .16s ease,transform .16s ease; }
.saved-design-card:hover { border-color:color-mix(in srgb,var(--accent) 45%,var(--line)); background:var(--surface-3); transform:translateY(-1px); }
.saved-design-card__media { position:relative; display:grid; place-items:center; width:86px; height:72px; overflow:hidden; border:1px solid var(--line); border-radius:9px; background:linear-gradient(135deg,var(--surface-3),var(--surface-1)); color:var(--sub); }
.saved-design-card__media::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,#ffffff0b,transparent); transform:translateX(-100%); animation:saved-design-shimmer 1.4s infinite; }
.saved-design-card__media.is-loaded::after,.saved-design-card__media.is-empty::after { display:none; }
.saved-design-card__media img { display:block; width:100%; height:100%; object-fit:contain; opacity:0; transition:opacity .22s ease; }
.saved-design-card__media.is-loaded img { opacity:1; }
.saved-design-card__media .lucide { width:26px; height:26px; }
.saved-design-card__copy { display:flex; min-width:0; flex-direction:column; gap:5px; }
.saved-design-card__copy strong { overflow:hidden; color:var(--text); font-size:13px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.saved-design-card__copy span { overflow:hidden; color:var(--sub); font-size:11px; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
html[data-theme] body[data-editor-shell="canvas"] .saved-design-card__open { display:flex; align-items:center; justify-content:center; gap:6px; min-height:34px; padding:6px 12px; font-size:12px; }
.saved-designs__collection[data-view="grid"] .saved-design-card { grid-template-columns:minmax(0,1fr); align-content:start; gap:8px; padding:9px; }
.saved-designs__collection[data-view="grid"] .saved-design-card__media { width:100%; height:150px; border:0; background:color-mix(in srgb,var(--surface-1) 72%,#020813); }
.saved-designs__collection[data-view="grid"] .saved-design-card__open { width:100%; }
.saved-designs__empty { display:grid; place-items:center; gap:7px; min-height:300px; padding:32px; border:1px dashed var(--edge); border-radius:13px; color:var(--sub); text-align:center; }
.saved-designs__empty-icon { display:grid; place-items:center; width:50px; height:50px; border-radius:14px; background:var(--accent-wash); color:var(--accent); }
.saved-designs__empty strong { color:var(--text); font-size:15px; }
.saved-designs__empty span:last-child { max-width:260px; font-size:12px; line-height:1.5; }
.saved-designs__footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.saved-designs__footer a { color:var(--accent); font-size:12px; font-weight:650; text-decoration:none; }
.saved-designs__footer a:hover { text-decoration:underline; }
@keyframes saved-design-shimmer { to { transform:translateX(100%); } }
@media(max-width:950px) { .saved-designs__collection[data-view="grid"] { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:700px) {
  .saved-designs-modal { padding:0; }
  .saved-designs-modal__dialog { width:100vw; max-height:100dvh; min-height:100dvh; border:0; border-radius:0; }
  .saved-designs-modal__header { grid-template-columns:auto minmax(0,1fr); gap:12px; padding:18px 58px 14px 16px; }
  .saved-designs-modal__icon { width:40px; height:40px; }
  .saved-designs-modal__heading h2 { font-size:21px; }
  .saved-designs-modal__heading p { font-size:12px; }
  .saved-designs-modal__new { grid-column:1 / -1; justify-self:start; margin-top:2px; }
  .saved-designs-modal__controls { grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:0 16px 14px; }
  .saved-designs__search { grid-column:1 / -1; }
  .saved-designs__sort span { display:none; }
  html[data-theme] body[data-editor-shell="canvas"] .saved-designs__sort select { width:min(210px,calc(100vw - 84px)); }
  .saved-designs-modal__body { padding:0 16px 18px; }
  .saved-designs__collection[data-view="grid"] { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .saved-designs__collection[data-view="grid"] .saved-design-card__media { height:125px; }
  .saved-design-card { grid-template-columns:66px minmax(0,1fr); }
  .saved-design-card__media { width:66px; height:60px; }
  .saved-design-card__open { grid-column:1 / -1; }
}
@media(max-width:390px) { .saved-designs__collection[data-view="grid"] .saved-design-card__media { height:105px; } .saved-designs-modal__heading p { display:none; } }
@media(prefers-reduced-motion:reduce) { .saved-design-card,.saved-design-card__media img { transition:none; } .saved-design-card__media::after { animation:none; } }