/* ============================================================
   Altly brand layer  (loads AFTER Tailwick's compiled CSS)
   Tailwick themes via Tailwind v4 CSS variables; we override them.
   ============================================================ */

/* ---- 1. Brand recolor: one variable retints the whole template ---- */
:root{
  --color-primary:#4f46e5;                 /* indigo-600 = phpDoesntExist brand */
  --font-body:"DM Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
[data-theme="dark"]{
  --color-primary:#818cf8;                 /* indigo-400 reads better on dark ground */
}

/* ---- 2. Committed dark navy sidebar (indigo-tinted, OpenWebUI look) ---- */
html[data-sidenav-color="dark"],
html[data-theme="dark"][data-sidenav-color="light"]{
  --sidenav-background:#0c1022;
  --sidenav-item-color:#8f95bd;
  --sidenav-item-active-color:#ffffff;
  --sidenav-item-active-bg:rgba(129,140,248,.16);
  --sidenav-item-hover-color:#ffffff;
  --sidenav-item-hover-bg:rgba(129,140,248,.10);
}

/* semantic status colors (separate from the accent) */
:root{
  --altly-ok:#059669;   --altly-ok-bg:rgba(5,150,105,.12);
  --altly-warn:#b45309; --altly-warn-bg:rgba(217,119,6,.14);
  --altly-busy:#4f46e5; --altly-busy-bg:rgba(79,70,229,.12);
  --altly-idle:#64748b; --altly-idle-bg:rgba(100,116,139,.14);
  /* status-badge tokens: solid + opaque + low-saturation (Vercel Geist model) */
  --chip-ok-bg:#ecfdf5;   --chip-ok-fg:#047857;   --chip-ok-ring:#a7f3d0;
  --chip-warn-bg:#fffbeb; --chip-warn-fg:#b45309; --chip-warn-ring:#fde68a;
  --chip-busy-bg:#eef2ff; --chip-busy-fg:#4338ca; --chip-busy-ring:#c7d2fe;
  --chip-idle-bg:#f1f5f9; --chip-idle-fg:#475569; --chip-idle-ring:#cbd5e1;
}
[data-theme="dark"]{
  --altly-ok:#34d399;   --altly-ok-bg:rgba(52,211,153,.14);
  --altly-warn:#fbbf24; --altly-warn-bg:rgba(251,191,36,.15);
  --altly-busy:#a5b4fc; --altly-busy-bg:rgba(129,140,248,.16);
  --altly-idle:#94a3b8; --altly-idle-bg:rgba(148,163,184,.16);
  --chip-ok-bg:#0c2e26;   --chip-ok-fg:#6ee7b7;   --chip-ok-ring:#155e4d;
  --chip-warn-bg:#2e2410; --chip-warn-fg:#fcd34d; --chip-warn-ring:#5a4415;
  --chip-busy-bg:#1e1b4b; --chip-busy-fg:#c7d2fe; --chip-busy-ring:#3730a3;
  --chip-idle-bg:#1e293b; --chip-idle-fg:#cbd5e1; --chip-idle-ring:#3b4a5f;
}

/* ---- 3. Brand logo in the sidebar ---- */
.altly-logo{display:flex;align-items:center;gap:.6rem;}
.altly-mark{width:26px;height:34px;flex:0 0 auto;}
.altly-mark path{fill:#818cf8;}
.altly-logo-txt b{display:block;font-size:20px;font-weight:800;letter-spacing:-.02em;line-height:1;color:#f4f5fb;}
.altly-logo-txt .sub{display:block;font-size:11px;font-weight:600;color:#8b90b8;margin-top:2px;}
/* mark-only lockup (shown by Tailwick's .logo-sm swap when the rail collapses) */
.altly-logo-mark{align-items:center;justify-content:center;width:100%;}

/* Collapsed rail (sm) / compact (md) / hover-collapsed: center the mark, hide the org card */
html[data-sidenav-size="sm"] .logo-box,
html[data-sidenav-size="md"] .logo-box{padding-inline:0;justify-content:center;}
html[data-sidenav-size="sm"] .altly-orgcard,
html[data-sidenav-size="md"] .altly-orgcard,
html[data-sidenav-size="hover"] .app-menu:not(:hover) .altly-orgcard{display:none;}

/* ---- 4. Org + credits card (bottom of the sidebar) ---- */
.altly-orgcard{flex:0 0 auto;margin:.5rem .75rem .75rem;padding:.85rem;border:1px solid rgba(255,255,255,.08);
  border-radius:14px;background:rgba(255,255,255,.03);}
.altly-org-top{display:flex;align-items:center;gap:.55rem;}
.altly-org-logo{width:30px;height:30px;border-radius:8px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;color:#fff;background:linear-gradient(135deg,#4f46e5,#7c73f0);}
.altly-org-meta b{display:block;font-size:13.5px;font-weight:700;line-height:1.15;color:#eceefc;}
.altly-org-meta span{font-size:11px;color:#8b90b8;}
.altly-credits{margin:.7rem 0 .5rem;}
.altly-credits-row{display:flex;justify-content:space-between;font-size:11.5px;color:#8b90b8;margin-bottom:5px;font-variant-numeric:tabular-nums;}
.altly-credits-row b{color:#eceefc;font-weight:700;}
.altly-meter{height:6px;border-radius:999px;background:rgba(255,255,255,.10);overflow:hidden;}
.altly-meter > span{display:block;height:100%;background:linear-gradient(90deg,#4f46e5,#818cf8);border-radius:999px;}
.altly-buy{display:block;text-align:center;font-size:12px;font-weight:700;color:#a9b1f7;border:1px solid rgba(255,255,255,.10);
  border-radius:8px;padding:7px;margin-top:.25rem;}
.altly-buy:hover{background:rgba(255,255,255,.06);}
.altly-user{display:flex;align-items:center;gap:.55rem;padding:.6rem .1rem 0;margin-top:.35rem;}
.altly-user-av{width:28px;height:28px;border-radius:50%;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#c7cdf5;background:#2a3160;}
.altly-user-meta b{display:block;font-size:13px;font-weight:600;line-height:1.1;color:#eceefc;}
.altly-user-meta span{font-size:11px;color:#8b90b8;}

/* ---- 5. Topbar bits ---- */
.altly-wpchip{display:inline-flex;align-items:center;gap:.5rem;font-size:12.5px;font-weight:600;color:var(--color-default-600);
  border:1px solid var(--color-default-200);background:var(--color-default-100);border-radius:999px;padding:6px 12px;}
.altly-live{width:8px;height:8px;border-radius:50%;background:var(--altly-ok);box-shadow:0 0 0 3px var(--altly-ok-bg);flex:0 0 auto;}
/* explicit search width (Tailwind's w-96/w-80 may be purged out of Tailwick's CSS) */
#topbar-search{width:22rem;}
@media (max-width:1280px){ #topbar-search{width:15rem;} }
.altly-avatar{width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;color:#fff;background:linear-gradient(135deg,#4f46e5,#7c73f0);border:0;}
@media (max-width:640px){ .altly-wpchip{display:none;} }

/* ---- 6. Filter pills ---- */
.altly-pill{font-size:12.5px;font-weight:600;color:var(--color-default-600);border:1px solid var(--color-default-200);
  background:var(--color-card);border-radius:999px;padding:6px 13px;cursor:pointer;white-space:nowrap;}
.altly-pill.is-on{color:#fff;background:var(--color-primary);border-color:var(--color-primary);}

/* outlined (Regenerate) button - Tailwick's btn-outline-* isn't in the purged CSS */
.altly-btn-ghost{border:1px solid var(--color-default-200);color:var(--color-default-800);background:var(--color-card);border-radius:8px;}
.altly-btn-ghost:hover{border-color:var(--color-primary);color:var(--color-primary);}

/* ---- 7. Workspace layout: media grid + detail drawer ---- */
.altly-workspace{display:flex;gap:1.25rem;align-items:flex-start;}
.altly-gridwrap{flex:1;min-width:0;}
.altly-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1rem;}

.altly-card{display:block;width:100%;text-align:left;padding:0;cursor:pointer;color:inherit;
  background:var(--color-card);border:1px solid var(--color-default-200);border-radius:14px;overflow:hidden;
  transition:box-shadow .15s,border-color .15s;}
.altly-card:hover{border-color:var(--color-primary);box-shadow:0 14px 34px -20px rgba(23,26,60,.4);}
.altly-card.is-active{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary) inset;}
.altly-thumb{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;}
.altly-thumb > svg{width:34px;height:34px;color:rgba(255,255,255,.72);}
.altly-card-b{display:block;padding:11px 12px 12px;}
.altly-alt{font-size:12.5px;line-height:1.4;color:var(--color-default-800);display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden;min-height:35px;}
.altly-alt.gen{display:block;}
.altly-shim{display:block;height:10px;margin:4px 0;border-radius:4px;
  background:linear-gradient(90deg,var(--color-default-150),var(--color-default-200),var(--color-default-150));
  background-size:200% 100%;animation:altly-sh 1.3s linear infinite;}
.altly-shim.w70{width:70%;}
@keyframes altly-sh{to{background-position:-200% 0;}}
.altly-card-m{display:flex;align-items:center;justify-content:space-between;margin-top:9px;}
.altly-file{font-size:11px;color:var(--color-default-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:62%;}
.altly-cr{font-size:11px;font-weight:700;color:var(--color-primary);background:rgba(79,70,229,.10);border-radius:6px;padding:2px 7px;white-space:nowrap;}

/* Status badge - solid + opaque + low-saturation (Vercel Geist model). Reads cleanly on any
   background (incl. colored image tiles) because it is opaque, not a translucent tint. Hairline
   ring for crispness, medium weight, compact rounded-rect; color carries the state so no dot. */
.altly-chip{display:inline-flex;align-items:center;font-size:11px;font-weight:600;line-height:1;letter-spacing:.005em;
  padding:4px 8px;border-radius:6px;white-space:nowrap;border:1px solid transparent;}
.altly-chip .dot{display:none;}
.altly-chip.ok{background:var(--chip-ok-bg);color:var(--chip-ok-fg);border-color:var(--chip-ok-ring);}
.altly-chip.warn{background:var(--chip-warn-bg);color:var(--chip-warn-fg);border-color:var(--chip-warn-ring);}
.altly-chip.busy{background:var(--chip-busy-bg);color:var(--chip-busy-fg);border-color:var(--chip-busy-ring);}
.altly-chip.idle{background:var(--chip-idle-bg);color:var(--chip-idle-fg);border-color:var(--chip-idle-ring);}
.altly-thumb .altly-chip{position:absolute;top:8px;left:8px;}
.altly-thumb .altly-chip,.altly-prev .altly-chip{box-shadow:0 1px 2px rgba(0,0,0,.14);}

/* ---- 8. Detail drawer ---- */
.altly-drawer{width:360px;flex:0 0 360px;overflow:hidden;padding:0;}
.altly-prev{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;}
.altly-prev > svg{width:44px;height:44px;color:rgba(255,255,255,.8);}
.altly-prev .altly-chip{position:absolute;top:12px;left:12px;}
.altly-drawer-b{padding:16px;}
.altly-drawer-file{font-size:14px;font-weight:700;margin:0 0 3px;color:var(--color-default-900);word-break:break-all;}
.altly-drawer-meta{font-size:12px;color:var(--color-default-500);font-variant-numeric:tabular-nums;}
.altly-label{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--color-default-500);margin:18px 0 7px;}
.altly-label span, .altly-label .normal{font-weight:600;letter-spacing:0;text-transform:none;font-variant-numeric:tabular-nums;}
.altly-drawer-row{display:flex;gap:8px;margin-top:10px;}
.altly-drawer-row > .btn{flex:1;padding:9px 10px;}
.altly-tags{display:flex;flex-wrap:wrap;gap:6px;}
.altly-tags span{font-size:12px;font-weight:600;color:var(--color-default-600);background:var(--color-default-100);
  border:1px solid var(--color-default-200);border-radius:7px;padding:4px 9px;}
.altly-push{border:1px solid var(--color-default-200);border-radius:12px;padding:13px;background:var(--color-default-100);}
.altly-push-top{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--color-default-800);}
.altly-toggle{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--color-default-500);margin-top:10px;cursor:pointer;}
.altly-toggle{cursor:pointer;}
.altly-toggle .sw{width:34px;height:20px;border-radius:999px;background:var(--color-default-300);position:relative;flex:0 0 auto;transition:background .15s;}
.altly-toggle .sw::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .15s;}
.altly-toggle .sw.on{background:var(--color-primary);}
.altly-toggle .sw.on::after{left:16px;}
.altly-cost{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--color-default-500);margin-top:16px;padding-top:14px;
  border-top:1px solid var(--color-default-200);font-variant-numeric:tabular-nums;}
.altly-cost b{color:var(--color-default-800);}

@media (max-width:1200px){ .altly-drawer{display:none;} }
@media (prefers-reduced-motion:reduce){ .altly-shim{animation:none;} .altly-switch-row .sw,.altly-switch-row .sw::after{transition:none;} }

/* ============================================================
   App pages (Search / Uploads / Team / Billing / Settings / Auth)
   ============================================================ */

/* Search */
.altly-search-hero{display:flex;align-items:center;gap:.75rem;}
.altly-search-hero .form-input{flex:1;box-shadow:none;}

/* live-search: results region fades slightly + shows a thin progress line while fetching */
#altly-search-results{position:relative;transition:opacity .12s ease;}
#altly-search-results.is-loading{opacity:.55;}
#altly-search-results.is-loading::before{content:"";position:absolute;top:-10px;left:0;height:2px;width:40%;border-radius:2px;
  background:var(--color-primary);animation:altly-srch 1s ease-in-out infinite;}
@keyframes altly-srch{0%{left:0;width:15%;}50%{left:35%;width:45%;}100%{left:100%;width:15%;}}

/* top-bar instant-search dropdown */
.altly-tsearch{position:relative;}
.altly-tsearch-panel{position:absolute;top:calc(100% + 6px);left:0;z-index:60;width:min(440px,92vw);max-height:60vh;overflow-y:auto;
  background:var(--color-default-50,#fff);border:1px solid var(--color-default-200);border-radius:12px;
  box-shadow:0 12px 34px rgba(2,6,23,.16);padding:6px;}
.altly-tsrow{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:7px 9px;border:0;border-radius:9px;background:transparent;}
.altly-tsrow:hover,.altly-tsrow:focus-visible{background:var(--color-default-100);}
.altly-tsrow img{width:44px;height:44px;object-fit:cover;border-radius:7px;flex:0 0 auto;background:var(--color-default-100);}
.altly-tsrow-t{display:flex;flex-direction:column;min-width:0;gap:2px;}
.altly-tsrow-alt{font-size:13px;color:var(--color-default-800);line-height:1.35;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.altly-tsrow-f{font-size:11px;color:var(--color-default-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.altly-tsempty{padding:16px 12px;font-size:13px;color:var(--color-default-500);text-align:center;}
.altly-tsall{display:block;width:100%;text-align:left;margin-top:4px;padding:9px 10px;border:0;border-top:1px solid var(--color-default-200);
  border-radius:0 0 9px 9px;background:transparent;font-size:12.5px;font-weight:600;color:var(--color-primary);}
.altly-tsall:hover{background:var(--color-default-100);}

/* Uploads dropzone */
.altly-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:2.5rem 1.5rem;border:2px dashed var(--color-default-300);border-radius:14px;margin:1.25rem;
  background:var(--color-default-50);transition:border-color .15s,background .15s;cursor:pointer;}
.altly-drop:hover,.altly-drop:focus-visible{border-color:var(--color-primary);background:var(--color-default-100);}
.altly-drop-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  background:rgba(79,70,229,.10);color:var(--color-primary);margin-bottom:.75rem;}
.altly-drop-icon svg{width:26px;height:26px;}
.altly-drop-title{font-size:16px;font-weight:700;color:var(--color-default-800);}
.altly-drop-sub{font-size:13px;color:var(--color-default-500);margin:.35rem 0;}
.altly-drop-hint{font-size:12px;color:var(--color-default-500);margin-top:.9rem;max-width:36rem;}

/* Uploads queue */
.altly-queue-row{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;}
.altly-queue-ic{width:40px;height:40px;border-radius:10px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  background:var(--color-default-100);color:var(--color-default-500);}
.altly-queue-ic svg{width:20px;height:20px;}
.altly-queue-ic.ok{background:var(--altly-ok-bg);color:var(--altly-ok);}
.altly-queue-ic.warn{background:var(--altly-warn-bg);color:var(--altly-warn);}
.altly-queue-ic.busy{background:var(--altly-busy-bg);color:var(--altly-busy);}
.altly-queue-main{flex:1;min-width:0;}
.altly-queue-top{display:flex;align-items:center;gap:.6rem;margin-bottom:6px;}
.altly-queue-file{font-size:13.5px;font-weight:600;color:var(--color-default-800);}
.altly-queue-bar{height:6px;border-radius:999px;background:var(--color-default-150);overflow:hidden;}
.altly-queue-bar > span{display:block;height:100%;background:var(--color-primary);border-radius:999px;}
.altly-queue-size{font-size:12px;color:var(--color-default-500);white-space:nowrap;}

/* Stat cards */
.altly-stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;}
.altly-stat-label{font-size:11px;font-weight:700;color:var(--color-default-500);text-transform:uppercase;letter-spacing:.05em;}
.altly-stat-num{font-size:24px;font-weight:800;color:var(--color-default-900);margin-top:4px;font-variant-numeric:tabular-nums;}
.altly-stat-num span{font-size:15px;font-weight:600;color:var(--color-default-500);}

/* Tables */
.altly-table-wrap{overflow-x:auto;}
.altly-table{width:100%;border-collapse:collapse;font-size:14px;}
.altly-table th{text-align:left;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  color:var(--color-default-500);padding:12px 16px;border-bottom:1px solid var(--color-default-200);background:var(--color-default-50);white-space:nowrap;}
.altly-table td{padding:12px 16px;border-bottom:1px solid var(--color-default-200);color:var(--color-default-700);vertical-align:middle;}
.altly-table tbody tr:last-child td{border-bottom:0;}
.altly-table tbody tr:hover{background:var(--color-default-50);}
.altly-table .text-end{text-align:right;}
.altly-person{display:flex;align-items:center;gap:.7rem;}
.altly-person-av{width:36px;height:36px;border-radius:50%;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#fff;background:linear-gradient(135deg,#4f46e5,#7c73f0);}
.altly-person-meta b{display:block;font-size:13.5px;font-weight:600;color:var(--color-default-800);}
.altly-person-meta span{font-size:12px;color:var(--color-default-500);}

/* Billing */
.altly-plan-notice{display:flex;gap:.9rem;align-items:flex-start;border-left:3px solid var(--color-primary);}
.altly-plan-notice-ico{flex:0 0 auto;width:38px;height:38px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;
  color:var(--color-primary);background:var(--color-default-100);background:color-mix(in srgb,var(--color-primary) 12%,transparent);}
.altly-plan-notice-body{min-width:0;}
.altly-plan-notice-link:hover{text-decoration:underline;}
.altly-billing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;align-items:start;}
.altly-billing-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;align-items:start;}
@media (max-width:900px){ .altly-billing-grid-2{grid-template-columns:1fr;} }
.altly-credit-big{font-size:28px;font-weight:800;color:var(--color-default-900);font-variant-numeric:tabular-nums;}
.altly-credit-big span{font-size:16px;font-weight:600;color:var(--color-default-500);}
.altly-meter.light{background:var(--color-default-200);}
.altly-meter.light > span{background:linear-gradient(90deg,#4f46e5,#818cf8);}
.altly-plan-name{font-size:22px;font-weight:800;color:var(--color-primary);margin:2px 0 10px;}
.altly-plan-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
.altly-plan-list li{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--color-default-700);}
.altly-plan-list li svg{color:var(--altly-ok);flex:0 0 auto;}
.altly-pay{display:flex;align-items:center;gap:.6rem;font-size:14px;font-weight:600;color:var(--color-default-800);margin:.5rem 0;}
.altly-pay-note{display:inline-flex;align-items:center;gap:.5rem;font-size:12.5px;color:var(--color-default-500);}

/* Settings */
.altly-settings{display:flex;flex-direction:column;gap:1.25rem;max-width:52rem;}
.altly-field{margin-bottom:1rem;}
.altly-field:last-child{margin-bottom:0;}
.altly-field label{display:block;font-size:13px;font-weight:600;color:var(--color-default-700);margin-bottom:6px;}
.altly-switch-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:14px 0;border-top:1px solid var(--color-default-200);cursor:pointer;}
.altly-switch-row > span b{display:block;font-size:14px;font-weight:600;color:var(--color-default-800);}
.altly-switch-row > span span{font-size:12.5px;color:var(--color-default-500);}
.altly-switch-row .sw{width:40px;height:22px;border-radius:999px;background:var(--color-default-300);position:relative;flex:0 0 auto;transition:background .15s;}
.altly-switch-row .sw::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s;}
.altly-switch-row .sw.on{background:var(--color-primary);}
.altly-switch-row .sw.on::after{left:20px;}
.altly-danger{border-color:rgba(220,38,38,.30);}
.altly-danger h5{color:#dc2626;}
.altly-soon{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 14px;border:1px dashed var(--color-default-300);border-radius:10px;background:var(--color-default-100);}
.altly-btn-danger{border:1px solid rgba(220,38,38,.40);color:#dc2626;background:transparent;border-radius:8px;}
.altly-btn-danger:hover{background:rgba(220,38,38,.08);}

/* Auth / sign-in (split: indigo brand panel + illustration | sign-in card). Nunito, on-brand. */
.altly-authx-body{margin:0;font-family:"Nunito",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#161c2d;background:#fff;}
.altly-authx{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh;min-height:100dvh;}
.altly-authx-brand{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:24px;
  padding:44px;color:#fff;background:linear-gradient(160deg,#4f46e5 0%,#4338ca 55%,#312e81 100%);overflow:hidden;}
.altly-authx-logo{display:inline-flex;align-items:center;gap:.5rem;font-weight:800;font-size:20px;letter-spacing:-.02em;color:#fff;text-decoration:none;}
.altly-authx-logo .altly-mark{width:22px;height:28px;}
.altly-authx-logo .altly-mark path{fill:#fff;}
.altly-authx-pitch{max-width:24ch;}
.altly-authx-pitch h2{font-size:clamp(24px,2.6vw,32px);font-weight:800;line-height:1.15;letter-spacing:-.02em;margin:0;text-wrap:balance;}
.altly-authx-pitch p{font-size:15.5px;line-height:1.6;color:#d6d8fb;margin:14px 0 0;}
.altly-authx-art{width:78%;max-width:360px;height:auto;align-self:center;filter:drop-shadow(0 20px 40px rgba(0,0,0,.25));}
.altly-authx-by{font-size:13px;color:#c3c6f7;font-weight:600;}
.altly-authx-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:44px 24px;}
.altly-authx-card{width:100%;max-width:26rem;}
.altly-authx-logo.mobile{display:none;color:#161c2d;margin-bottom:18px;}
.altly-authx-logo.mobile .altly-mark path{fill:#4f46e5;}
.altly-authx h1{font-size:26px;font-weight:800;letter-spacing:-.02em;color:#161c2d;margin:0;}
.altly-authx-sub{font-size:15px;color:#5b616e;margin:8px 0 26px;}
.altly-authx-btn{display:flex;align-items:center;justify-content:center;gap:.6rem;width:100%;background:#4f46e5;color:#fff;
  border-radius:11px;padding:14px;font-size:15.5px;font-weight:700;text-decoration:none;box-shadow:0 1px 2px rgba(79,70,229,.3);transition:background .15s;}
.altly-authx-btn:hover{background:#4338ca;}
.altly-authx-btn .altly-mark{width:19px;height:24px;}
.altly-authx-btn .altly-mark path{fill:#fff;}
.altly-authx-div{display:flex;align-items:center;gap:.75rem;color:#9096a1;font-size:12px;margin:20px 0;text-transform:uppercase;letter-spacing:.05em;font-weight:600;}
.altly-authx-div::before,.altly-authx-div::after{content:"";flex:1;height:1px;background:#e7e9f0;}
.altly-authx-note{font-size:13px;color:#8b90a0;line-height:1.6;}
.altly-authx-foot{font-size:12.5px;color:#9096a1;display:flex;align-items:center;gap:.4rem;margin:6px 0 0;}
@media (max-width:860px){
  .altly-authx{grid-template-columns:1fr;}
  .altly-authx-brand{display:none;}
  .altly-authx-logo.mobile{display:inline-flex;}
  .altly-authx-panel{min-height:100vh;}
}

@media (max-width:900px){ .altly-billing-grid,.altly-stat-row{grid-template-columns:1fr;} }

/* ============================================================
   Accessibility (WCAG 2.2 AA)
   ============================================================ */

/* Screen-reader-only (guaranteed present even if Tailwind purges its own) */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* Skip link */
.altly-skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--color-primary);color:#fff;
  padding:10px 16px;border-radius:0 0 10px 0;font-weight:700;font-size:14px;}
.altly-skip:focus{left:0;outline:3px solid #fff;outline-offset:-3px;}

/* Visible keyboard focus on every interactive element */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
[tabindex]:focus-visible,.altly-card:focus-visible,.altly-pill:focus-visible,.menu-link:focus-visible,
.hs-dropdown-toggle:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:6px;}
main:focus{outline:none;}
/* On the dark sidebar, focus needs a light ring to stay visible */
.app-menu a:focus-visible,.app-menu button:focus-visible{outline-color:#a5b4fc;}

/* Slightly darker small muted text so 11-12px passes AA contrast on white cards
   (NOT the sidebar org/user text, which is light-on-navy already) */
.altly-file,.altly-queue-size{color:var(--color-default-600);}

/* Respect reduced-motion globally (covers the Tailwick bundle's transitions too) */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;}
}

/* ---- Toasts + interactive feedback ---- */
.altly-toasts{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:300;
  display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;}
.altly-toast{background:#171a2b;color:#fff;padding:11px 18px;border-radius:10px;font-size:13.5px;font-weight:600;
  box-shadow:0 14px 34px -10px rgba(0,0,0,.5);opacity:0;transform:translateY(10px);
  transition:opacity .25s,transform .25s;max-width:min(90vw,440px);text-align:center;}
.altly-toast.show{opacity:1;transform:none;}
.altly-toast.success{background:#065f46;}
.altly-toast.danger{background:#991b1b;}
.altly-drop.is-drag{border-color:var(--color-primary);background:var(--color-default-100);}
/* make interactive-looking things show a pointer */
.altly-pill,.altly-card,.altly-switch-row,.altly-toggle,button:not([disabled]){cursor:pointer;}

/* ============================================================
   Sidebar collapse (rail) - flicker-free, toggle lives in the sidebar
   ============================================================ */
/* collapse toggle rides on .menu-link (sits below the logo, aligned with the icons) */
button.altly-sbtoggle{width:100%;border:0;background:transparent;text-align:left;cursor:pointer;font:inherit;}
.altly-sbtoggle-ic{transition:transform .3s ease;}
html.altly-rail .altly-sbtoggle-ic{transform:scaleX(-1);}

/* Fade the collapsible bits (opacity, NOT display:none -> no flash) */
.altly-logo-txt,.side-nav .menu-text,.side-nav .menu-title,.side-nav .badge,.side-nav .menu-arrow,.altly-orgcard{
  transition:opacity .18s ease;}

@media (max-width:1140px){ .altly-sbtoggle-li{display:none;} }  /* mobile uses the offcanvas opener */

@media (min-width:1141px){
  .app-menu{overflow:hidden;}                                 /* clip overflow during the width animation */
  html.altly-rail .app-menu{width:74px;min-width:74px;}
  html.altly-rail .logo-box{justify-content:center;padding-inline:0;}
  html.altly-rail .altly-logo-txt{position:absolute;opacity:0;pointer-events:none;}
  html.altly-rail .side-nav .menu-link{justify-content:center;padding-inline:0;gap:0;}
  html.altly-rail .side-nav .menu-text{position:absolute;opacity:0;pointer-events:none;}
  html.altly-rail .side-nav .menu-arrow,
  html.altly-rail .side-nav .badge{display:none !important;}
  html.altly-rail .side-nav .menu-title{opacity:0;height:0;margin:0;padding:0;overflow:hidden;}
  html.altly-rail .side-nav .hs-accordion .sub-menu{display:none !important;}
  html.altly-rail .altly-orgcard{opacity:0;pointer-events:none;}
}

/* ============================================================
   Modal + row action menu (member management)
   ============================================================ */
.altly-modal{position:fixed;inset:0;z-index:400;display:flex;align-items:center;justify-content:center;padding:1.5rem;}
.altly-modal[hidden]{display:none;}
.altly-modal-backdrop{position:absolute;inset:0;background:rgba(12,16,34,.55);backdrop-filter:blur(2px);}
.altly-modal-card{position:relative;width:100%;max-width:26rem;background:var(--color-card);border:1px solid var(--color-default-200);
  border-radius:16px;box-shadow:0 30px 60px -20px rgba(0,0,0,.5);overflow:hidden;animation:altly-modal-in .18s ease;}
@keyframes altly-modal-in{from{opacity:0;transform:translateY(8px) scale(.98);}to{opacity:1;transform:none;}}
.altly-modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--color-default-200);}
.altly-modal-head h5{font-size:16px;font-weight:700;color:var(--color-default-900);}
.altly-modal-x{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;border:0;background:transparent;color:var(--color-default-500);cursor:pointer;}
.altly-modal-x:hover{background:var(--color-default-100);color:var(--color-default-800);}
.altly-modal-body{padding:18px;}
.altly-modal-foot{display:flex;justify-content:flex-end;gap:8px;padding:14px 18px;border-top:1px solid var(--color-default-200);background:var(--color-default-50);}

/* Top-up credits modal */
#altly-topup .altly-modal-card{max-width:31rem;}
.altly-topup-packs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.altly-topup-pack{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:17px 8px 14px;
  border:1px solid var(--color-default-200);border-radius:12px;background:var(--color-card);cursor:pointer;transition:border-color .14s,box-shadow .14s,transform .06s;}
.altly-topup-pack:hover{border-color:var(--color-primary);}
.altly-topup-pack:active{transform:translateY(1px);}
.altly-topup-pack.is-rec{border-color:var(--color-primary);box-shadow:inset 0 0 0 1px var(--color-primary);}
.altly-topup-tag{position:absolute;top:-9px;left:50%;transform:translateX(-50%);white-space:nowrap;font-family:var(--font-mono);
  font-size:9.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#fff;background:var(--color-primary);padding:2px 7px;border-radius:5px;}
.altly-topup-c{font-size:19px;font-weight:800;color:var(--color-default-900);line-height:1;font-variant-numeric:tabular-nums;}
.altly-topup-l{font-size:11px;color:var(--color-default-500);}
.altly-topup-p{margin-top:6px;font-size:13px;font-weight:600;color:var(--color-default-700);font-variant-numeric:tabular-nums;}
.altly-topup-confirm{display:flex;flex-direction:column;align-items:center;text-align:center;padding:6px 4px 2px;}
.altly-topup-confirm-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--color-primary);
  background:var(--color-default-100);background:color-mix(in srgb,var(--color-primary) 14%,transparent);margin-bottom:12px;}
.altly-topup-confirm-ic svg{width:22px;height:22px;}
.altly-topup-confirm h6{font-size:15px;font-weight:700;color:var(--color-default-900);}
@media (max-width:480px){ .altly-topup-packs{grid-template-columns:1fr;} }

.altly-rowmenu-wrap{position:relative;display:inline-block;}
.altly-rowmenu{position:absolute;top:calc(100% + 4px);right:0;z-index:50;min-width:172px;background:var(--color-card);
  border:1px solid var(--color-default-200);border-radius:10px;box-shadow:0 16px 40px -14px rgba(23,26,60,.45);
  padding:6px;display:flex;flex-direction:column;gap:2px;}
.altly-rowmenu[hidden]{display:none;}
.altly-rowmenu button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:8px 10px;border-radius:7px;border:0;
  background:transparent;color:var(--color-default-700);font-size:13.5px;font-weight:500;cursor:pointer;}
.altly-rowmenu button:hover{background:var(--color-default-100);}
.altly-rowmenu button.danger{color:#dc2626;}
.altly-rowmenu button.danger:hover{background:rgba(220,38,38,.08);}

/* ============================================================
   Styled <select>, inline role picker, Collections/folders
   ============================================================ */

/* Native select -> custom chevron, theme-aware */
select.form-input{
  -webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;padding-right:2.4rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .8rem center;background-size:16px;
}
select.form-input::-ms-expand{display:none;}

/* Inline role picker (Team) */
.altly-role-wrap{position:relative;display:inline-block;}
.altly-role-static{color:var(--color-default-600);font-weight:600;}
.altly-role-btn{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--color-default-700);
  background:var(--color-default-100);border:1px solid var(--color-default-200);border-radius:8px;padding:5px 10px;cursor:pointer;}
.altly-role-btn:hover{border-color:var(--color-primary);}
.altly-role-btn svg{color:var(--color-default-500);}
.altly-role-menu{position:absolute;top:calc(100% + 4px);left:0;z-index:50;min-width:150px;background:var(--color-card);
  border:1px solid var(--color-default-200);border-radius:10px;box-shadow:0 16px 40px -14px rgba(23,26,60,.45);padding:6px;display:flex;flex-direction:column;gap:2px;}
.altly-role-menu[hidden]{display:none;}
.altly-role-menu button{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;text-align:left;
  padding:8px 10px;border-radius:7px;border:0;background:transparent;color:var(--color-default-700);font-size:13.5px;font-weight:500;cursor:pointer;}
.altly-role-menu button:hover{background:var(--color-default-100);}
.altly-role-menu button.is-active{color:var(--color-primary);font-weight:700;}
.altly-role-menu button.is-active::after{content:"";width:15px;height:15px;flex:0 0 auto;
  background:no-repeat center/15px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");}

/* Collections / folders */
.altly-folders{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;}
.altly-folder{position:relative;background:var(--color-card);border:1px solid var(--color-default-200);border-radius:14px;padding:16px;transition:box-shadow .15s,border-color .15s;cursor:pointer;}
.altly-folder:hover{border-color:var(--color-primary);box-shadow:0 14px 34px -20px rgba(23,26,60,.4);}
.altly-folder-top{display:flex;align-items:flex-start;justify-content:space-between;}
.altly-folder-ic{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;}
.altly-folder-ic svg{width:22px;height:22px;}
.altly-folder-name{font-weight:700;font-size:15px;color:var(--color-default-900);margin-top:14px;}
.altly-folder-meta{font-size:12.5px;color:var(--color-default-500);margin-top:2px;}
.altly-folder-foot{display:flex;align-items:center;gap:6px;margin-top:14px;font-size:12px;font-weight:600;color:var(--color-default-600);}
.altly-folder-foot svg{width:14px;height:14px;color:var(--color-default-500);}
.altly-swatches{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px;}
.altly-swatch{width:26px;height:26px;border-radius:8px;border:2px solid transparent;cursor:pointer;}
.altly-swatch.is-on{border-color:var(--color-default-900);}
.altly-radio-row{display:flex;align-items:flex-start;gap:10px;padding:11px;border:1px solid var(--color-default-200);border-radius:10px;cursor:pointer;margin-bottom:8px;}
.altly-radio-row.is-on{border-color:var(--color-primary);background:var(--color-primary-soft, rgba(79,70,229,.06));}
.altly-radio-row b{display:block;font-size:13.5px;color:var(--color-default-800);}
.altly-radio-row span{font-size:12px;color:var(--color-default-500);}
.altly-radio-dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--color-default-300);flex:0 0 auto;margin-top:1px;position:relative;}
.altly-radio-row.is-on .altly-radio-dot{border-color:var(--color-primary);}
.altly-radio-row.is-on .altly-radio-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--color-primary);}

/* ============================================================
   Page-header alignment, multi-select, selection bar
   ============================================================ */
.altly-pagehead{display:flex;align-items:baseline;gap:.75rem;flex-wrap:wrap;}

/* selected media cards: ring + checkmark */
.altly-card.is-selected{outline:2px solid var(--color-primary);outline-offset:0;}
.altly-card.is-selected .altly-thumb::after{content:"";position:absolute;top:8px;right:8px;width:22px;height:22px;border-radius:50%;
  box-shadow:0 2px 6px rgba(0,0,0,.35);background:var(--color-primary) no-repeat center/13px
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");}

/* selection action bar (appears above the grid when items are selected) */
.altly-selbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:0 0 1rem;padding:9px 8px 9px 16px;
  border-radius:12px;background:var(--color-primary);color:#fff;box-shadow:0 10px 26px -14px rgba(79,70,229,.7);}
.altly-selbar[hidden]{display:none;}
.altly-selcount{font-weight:700;font-size:14px;}
.altly-selactions{display:flex;align-items:center;gap:6px;}
.altly-move-wrap{position:relative;}
.altly-move-btn{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.18);color:#fff;border:0;border-radius:8px;padding:7px 12px;font-size:13px;font-weight:700;cursor:pointer;}
.altly-move-btn:hover{background:rgba(255,255,255,.28);}
.altly-move-menu{position:absolute;top:calc(100% + 6px);right:0;z-index:30;min-width:190px;background:var(--color-card);
  border:1px solid var(--color-default-200);border-radius:10px;box-shadow:0 16px 40px -14px rgba(23,26,60,.5);padding:6px;display:flex;flex-direction:column;gap:2px;}
.altly-move-menu[hidden]{display:none;}
.altly-move-menu button{display:block;width:100%;text-align:left;padding:8px 10px;border-radius:7px;border:0;background:transparent;color:var(--color-default-700);font-size:13.5px;font-weight:500;cursor:pointer;}
.altly-move-menu button:hover{background:var(--color-default-100);color:var(--color-primary);}
.altly-selclear{background:transparent;border:0;color:#fff;font-size:13px;font-weight:700;cursor:pointer;padding:7px 10px;border-radius:8px;}
.altly-selclear:hover{background:rgba(255,255,255,.18);}

/* drawer "Move to a collection" (full-width dropdown under the button) */
.altly-drawer-move{margin-top:2px;}
.altly-dmove-menu{left:0;right:auto;min-width:100%;}

/* ============================================================
   PUBLIC LANDING / GET-STARTED  (template-parts/landing.php)
   Geist-influenced: hairline borders (not shadows), a monospace
   label face, near-black primary buttons with indigo held in
   reserve, left-aligned heads, tight negative tracking, flat
   structure. Own palette scoped to .altly-lp; theme-aware.
   ============================================================ */
.altly-lp{
  --lp-bg:#ffffff; --lp-soft:#f6f7fb; --lp-surface:#ffffff;
  --lp-ink:#161c2d; --lp-muted:#5b616e; --lp-faint:#8b90a0;
  --lp-line:#e7e9f0; --lp-line-strong:#d7dae4;
  --lp-navy:#161c2d; --lp-primary:#4f46e5; --lp-primary-ink:#4338ca; --lp-primary-soft:#eef0fe;
  --lp-btn-bg:#4f46e5; --lp-btn-fg:#ffffff;
  --font-lp:"Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  margin:0;background:var(--lp-bg);color:var(--lp-ink);
  font-family:var(--font-lp);-webkit-font-smoothing:antialiased;line-height:1.6;
}
.altly-lp *{box-sizing:border-box;}
.altly-lp a{text-decoration:none;}
.lp-wrap{max-width:1140px;margin:0 auto;padding-inline:24px;}

/* buttons — indigo primary (rounded, friendly), matching the main site */
.lp-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--font-lp);
  font-weight:700;font-size:14.5px;border-radius:9px;padding:.66rem 1.15rem;border:1.5px solid transparent;
  cursor:pointer;line-height:1;transition:background .15s,border-color .15s,color .15s,box-shadow .15s;}
.lp-btn svg{width:17px;height:17px;flex:0 0 auto;}
.lp-btn-primary{background:var(--lp-primary);color:#fff;box-shadow:0 1px 2px rgba(79,70,229,.25);}
.lp-btn-primary:hover{background:var(--lp-primary-ink);}
.lp-btn-ghost{background:#fff;color:var(--lp-ink);border-color:var(--lp-line-strong);}
.lp-btn-ghost:hover{border-color:var(--lp-primary);color:var(--lp-primary);}
.lp-btn-onnavy{background:#fff;color:var(--lp-primary);}
.lp-btn-onnavy:hover{background:#eef0fe;}
.lp-btn-lg{padding:.8rem 1.4rem;font-size:15px;}
.lp-link{color:var(--lp-muted);font-weight:600;font-size:14.5px;}
.lp-link:hover{color:var(--lp-ink);}
.lp-textlink{display:inline-flex;align-items:center;gap:.4rem;color:var(--lp-primary);font-weight:700;font-size:14.5px;margin-top:22px;}
.lp-textlink svg{width:16px;height:16px;transition:transform .15s;}
.lp-textlink:hover svg{transform:translateX(3px);}

/* nav */
.lp-nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(1.3) blur(10px);
  border-bottom:1px solid var(--lp-line);}
.lp-nav-in{max-width:1140px;margin:0 auto;padding:0 24px;height:70px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.lp-brand{display:inline-flex;align-items:center;gap:.55rem;font-weight:800;font-size:20px;letter-spacing:-.02em;color:var(--lp-ink);}
.lp-brand .altly-mark{width:22px;height:28px;}
.lp-brand .altly-mark path{fill:var(--lp-primary);}
.lp-brand.sm{font-size:17px;}
.lp-brand.light{color:#fff;}
.lp-nav-cta{display:flex;align-items:center;gap:20px;}

/* hero */
.lp-hero{padding:64px 0 40px;}
.lp-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;}
.lp-h1{font-size:clamp(34px,4.6vw,52px);line-height:1.08;letter-spacing:-.02em;font-weight:800;margin:0;text-wrap:balance;color:var(--lp-ink);}
.lp-sub{font-size:clamp(16px,1.5vw,18px);line-height:1.65;color:var(--lp-muted);margin:20px 0 0;max-width:46ch;}
.lp-hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:28px;}
.lp-hero-note{margin-top:20px;font-size:13.5px;color:var(--lp-faint);}
.lp-hero-art{display:flex;justify-content:center;}
.lp-hero-art img{width:100%;max-width:500px;height:auto;}

/* sections */
.lp-section{padding:76px 0;}
.lp-soft{background:var(--lp-soft);}
.lp-head{max-width:640px;margin:0 0 44px;}
.lp-head-center{margin-inline:auto;text-align:center;}
.lp-h2{font-size:clamp(26px,3.1vw,36px);line-height:1.15;letter-spacing:-.02em;font-weight:800;margin:0;text-wrap:balance;color:var(--lp-ink);}
.lp-h2-sub{font-size:16.5px;color:var(--lp-muted);margin:14px 0 0;line-height:1.6;}

/* steps — friendly numbered circles */
.lp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.lp-step-n{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;
  background:var(--lp-primary-soft);color:var(--lp-primary);font-weight:800;font-size:17px;}
.lp-step h3{font-size:18px;font-weight:700;margin:16px 0 8px;color:var(--lp-ink);}
.lp-step p{font-size:15px;line-height:1.6;color:var(--lp-muted);margin:0;}

/* split: illustration + indigo checklist (mirrors the main site) */
.lp-split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.lp-split-art{display:flex;justify-content:center;}
.lp-split-art img{width:100%;max-width:460px;height:auto;}
.lp-split-lead{font-size:16.5px;line-height:1.65;color:var(--lp-muted);margin:16px 0 0;}
.lp-checks{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-direction:column;gap:14px;}
.lp-checks li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.45;color:var(--lp-ink);font-weight:600;}
.lp-check{flex:0 0 auto;color:var(--lp-primary);}
.lp-check svg{width:24px;height:24px;display:block;}

/* CTA band — indigo */
.lp-cta{background:linear-gradient(135deg,#4f46e5,#4338ca);border-radius:20px;padding:48px;display:flex;align-items:center;justify-content:space-between;gap:36px;flex-wrap:wrap;}
.lp-cta-copy{max-width:38ch;}
.lp-cta h2{font-size:clamp(24px,3vw,32px);line-height:1.15;letter-spacing:-.02em;font-weight:800;color:#fff;margin:0;text-wrap:balance;}
.lp-cta p{font-size:15.5px;color:#d6d8fb;margin:12px 0 0;line-height:1.55;}
.lp-cta-act{display:flex;flex-direction:column;align-items:flex-start;gap:12px;}
.lp-cta-note{font-size:13px;color:#c3c6f7;}

/* footer — dark navy, like the main site */
.lp-foot{background:var(--lp-navy);color:#c9cdd8;padding:52px 0 28px;}
.lp-foot-in{display:flex;justify-content:space-between;gap:36px;flex-wrap:wrap;padding-bottom:28px;border-bottom:1px solid rgba(255,255,255,.1);}
.lp-foot-brand{max-width:34ch;}
.lp-foot-brand p{font-size:14px;color:#9aa0b0;margin:12px 0 0;line-height:1.55;}
.lp-foot-links{display:flex;flex-wrap:wrap;gap:26px;align-items:flex-start;}
.lp-foot-links a{color:#c9cdd8;font-weight:600;font-size:14.5px;}
.lp-foot-links a:hover{color:#fff;}
.lp-foot-base{font-size:13px;color:#7c8395;padding-top:22px;}

/* responsive */
@media (max-width:900px){
  .lp-hero-grid{grid-template-columns:1fr;gap:36px;text-align:center;}
  .lp-hero .lp-sub{margin-inline:auto;}
  .lp-hero-cta{justify-content:center;}
  .lp-hero-art{order:-1;}
  .lp-hero-art img{max-width:360px;}
  .lp-steps{grid-template-columns:1fr;gap:28px;}
  .lp-split{grid-template-columns:1fr;gap:32px;}
  .lp-split-art{order:-1;}
  .lp-split-art img{max-width:340px;}
}
@media (max-width:820px){
  .lp-section{padding:56px 0;}
  .lp-cta{padding:34px 26px;}
}
@media (prefers-reduced-motion:reduce){ .lp-btn,.lp-textlink svg{transition:none;} }

/* upload progress bar animates as it "generates" */
.altly-queue-bar > span{transition:width .8s ease;}
/* generated alt text shown inline under an upload row */
.altly-queue-alt{margin-top:9px;font-size:13px;line-height:1.5;color:var(--color-default-700);
  background:var(--color-default-100);border:1px solid var(--color-default-200);border-radius:8px;padding:8px 11px;}
.altly-queue-alt[hidden]{display:none;}
/* live local preview thumbnail in an upload row */
.altly-queue-ic{overflow:hidden;}
.altly-queue-thumb{width:100%;height:100%;object-fit:cover;display:block;}
/* empty state for the upload batch (before anything is dropped) */
.altly-batch-empty{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:40px 24px;color:var(--color-default-500);font-size:14px;line-height:1.5;}
.altly-batch-empty svg{width:26px;height:26px;color:var(--color-default-400);}

/* real image thumbnails (library grid + drawer preview) */
.altly-thumb,.altly-prev{overflow:hidden;background:var(--color-default-100);}
.altly-thumb-img,.altly-prev-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:1;}
.altly-thumb .altly-chip,.altly-prev .altly-chip{z-index:2;}
.altly-card.is-selected .altly-thumb::after{z-index:3;}
.altly-noalt{color:var(--color-default-400);font-style:italic;}
.altly-drawer-del{margin-top:14px;width:100%;background:transparent;border:0;color:#b45309;font-size:13px;font-weight:600;cursor:pointer;padding:8px;border-radius:8px;}
.altly-drawer-del:hover{background:rgba(180,83,9,.09);}
[data-theme="dark"] .altly-drawer-del{color:#fbbf24;}
[data-theme="dark"] .altly-drawer-del:hover{background:rgba(251,191,36,.12);}
/* library empty state */
.altly-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:64px 24px;}
.altly-empty-ic{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:var(--color-default-100);color:var(--color-default-500);margin-bottom:14px;}
.altly-empty-ic svg{width:26px;height:26px;}
.altly-empty h5{font-size:16px;font-weight:600;color:var(--color-default-800);margin:0 0 6px;}
.altly-empty p{font-size:14px;color:var(--color-default-500);max-width:40ch;margin:0;line-height:1.5;}

/* ---- review overlay (click any image card to open it big) ---- */
.altly-drawer{display:none;} /* the persistent side drawer is replaced by the overlay */
body.altly-review-open{overflow:hidden;}
.altly-review{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:14px;}
.altly-review[hidden]{display:none;}
.altly-review-backdrop{position:absolute;inset:0;background:rgba(8,10,20,.74);}
.altly-review-box{position:relative;z-index:2;display:flex;width:min(1120px,100%);max-height:90vh;
  background:var(--color-card,#fff);border:1px solid var(--color-default-200);border-radius:16px;overflow:hidden;box-shadow:0 40px 90px -24px rgba(0,0,0,.6);
  animation:altly-rv-in .18s ease;}
.altly-review-backdrop{animation:altly-rv-fade .18s ease;}
.altly-review.is-closing .altly-review-box{animation:altly-rv-out .16s ease forwards;}
.altly-review.is-closing .altly-review-backdrop{animation:altly-rv-fadeout .16s ease forwards;}
@keyframes altly-rv-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes altly-rv-out{from{opacity:1;transform:none}to{opacity:0;transform:translateY(10px) scale(.985)}}
@keyframes altly-rv-fade{from{opacity:0}to{opacity:1}}
@keyframes altly-rv-fadeout{from{opacity:1}to{opacity:0}}
@media (prefers-reduced-motion:reduce){.altly-review-box,.altly-review-backdrop,.altly-review.is-closing .altly-review-box,.altly-review.is-closing .altly-review-backdrop{animation:none!important;}}
.altly-review-stage{flex:1;min-width:0;background:var(--color-default-100);display:flex;align-items:center;justify-content:center;}
.altly-review-stage img{max-width:100%;max-height:90vh;object-fit:contain;display:block;}
.altly-review-panel{width:352px;flex:0 0 352px;padding:20px 20px 22px;overflow-y:auto;background:var(--color-card,#fff);}
.altly-review-panel .altly-chip{display:inline-flex;}
.altly-review-file{font-size:14px;font-weight:700;margin:10px 0 3px;color:var(--color-default-900);word-break:break-all;}
.altly-review-meta{font-size:12px;color:var(--color-default-500);font-variant-numeric:tabular-nums;}
.altly-review-actions{display:flex;gap:8px;margin-top:10px;}
.altly-review-actions > .btn{flex:1;padding:9px 10px;}
.altly-review-foot{margin-top:16px;padding-top:14px;border-top:1px solid var(--color-default-200);display:flex;flex-direction:column;gap:6px;}
.altly-review-foot .btn{width:100%;justify-content:center;padding:9px 10px;display:inline-flex;align-items:center;gap:8px;}
.altly-review-hint{margin-top:12px;font-size:11.5px;color:var(--color-default-400);text-align:center;}
.altly-review-x{position:absolute;top:10px;right:10px;z-index:4;width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:9px;background:rgba(0,0,0,.35);color:#fff;cursor:pointer;}
.altly-review-x:hover{background:rgba(0,0,0,.5);}
.altly-review-x svg{width:18px;height:18px;}
.altly-review-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:#111;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.3);}
.altly-review-nav:hover{background:#fff;}
.altly-review-nav svg{width:22px;height:22px;}
.altly-review-nav.prev{left:20px;}
.altly-review-nav.next{right:20px;}
@media (max-width:820px){
  .altly-review{padding:0;}
  .altly-review-box{flex-direction:column;width:100%;max-height:100vh;height:100dvh;border-radius:0;}
  .altly-review-stage{max-height:44vh;}
  .altly-review-stage img{max-height:44vh;}
  .altly-review-panel{width:auto;flex:1 1 auto;}
  .altly-review-nav{display:none;}
}

/* ============================================================
   PRICING / CHOOSE-A-PLAN  (page-pricing.php) -- reuses the
   .altly-lp landing palette + buttons; same Geist treatment.
   ============================================================ */
.lp-pricing{padding:56px 0 40px;}
.lp-pricing-top{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap;margin-bottom:36px;}
.lp-pricing-intro{max-width:52ch;}
.lp-pricing-intro .lp-h2{margin:0;}
.lp-pricing-intro .lp-h2-sub{margin-top:12px;}

/* monthly / annual segmented toggle */
.lp-billtoggle{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--lp-line);border-radius:10px;background:var(--lp-surface);flex:0 0 auto;}
.lp-billtoggle button{border:0;background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--lp-muted);
  padding:8px 14px;border-radius:7px;cursor:pointer;display:inline-flex;align-items:center;gap:.45rem;line-height:1;transition:background .15s,color .15s;}
.lp-billtoggle button.is-on{background:var(--lp-btn-bg);color:var(--lp-btn-fg);}
.lp-save{font-family:var(--font-mono);font-size:10.5px;font-weight:500;letter-spacing:.02em;color:var(--lp-primary);}
.lp-billtoggle button.is-on .lp-save{color:#a5b4fc;}

/* plan cards */
.lp-plans{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;align-items:stretch;}
.lp-plan{display:flex;flex-direction:column;background:var(--lp-surface);border:1px solid var(--lp-line);border-radius:14px;padding:22px 20px;}
.lp-plan.is-popular{border-color:var(--lp-ink);box-shadow:inset 0 0 0 1px var(--lp-ink);}
.lp-plan.is-current{border-color:var(--lp-primary);box-shadow:inset 0 0 0 1px var(--lp-primary);}
.lp-plan-badge{align-self:flex-start;font-family:var(--font-mono);font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.06em;
  color:var(--lp-btn-fg);background:var(--lp-btn-bg);padding:3px 8px;border-radius:5px;margin-bottom:12px;}
.lp-plan-badge.is-current{color:#fff;background:var(--lp-primary);}
/* reserve the badge's height on cards with no badge so all card rows line up (side-by-side only) */
@media (min-width:601px){ .lp-plan:not(.is-popular):not(.is-current)::before{content:"";display:block;height:16px;margin-bottom:12px;} }
.lp-plan-name{font-size:15px;font-weight:600;color:var(--lp-ink);}
.lp-plan-price{display:flex;align-items:baseline;gap:4px;margin-top:12px;min-height:40px;}
.lp-plan-price .amt{font-size:32px;font-weight:700;letter-spacing:-.035em;color:var(--lp-ink);line-height:1;}
.lp-plan-price .per{font-size:13px;color:var(--lp-muted);}
.lp-plan-bill{font-size:11.5px;color:var(--lp-faint);margin-top:6px;min-height:17px;}
.lp-plan-blurb{font-size:12.5px;color:var(--lp-muted);margin:14px 0 0;line-height:1.4;}
.lp-plan-credits{margin-top:16px;padding-top:16px;border-top:1px solid var(--lp-line);font-size:14px;font-weight:600;color:var(--lp-ink);}
.lp-plan-credits span{font-weight:500;color:var(--lp-faint);font-size:12.5px;}
.lp-plan-feats{list-style:none;margin:14px 0 22px;padding:0;display:flex;flex-direction:column;gap:9px;}
.lp-plan-feats li{display:flex;gap:8px;font-size:13px;color:var(--lp-muted);line-height:1.45;}
.lp-plan-feats svg{width:15px;height:15px;color:var(--lp-primary);flex:0 0 auto;margin-top:1px;}
.lp-plan-cta{margin-top:auto;}
.lp-plan-cta .lp-btn{width:100%;}
/* logged-in: the plan the customer is already on (non-interactive) */
.lp-plan-current{cursor:default;color:var(--lp-muted);border-color:var(--lp-line);background:transparent;}
.lp-plan-current svg{width:15px;height:15px;color:var(--lp-primary);}

/* logged-in: "you are on the X plan" note under the pricing intro */
.lp-current-note{display:inline-flex;align-items:center;gap:.5rem;margin-top:14px;font-size:13px;color:var(--lp-muted);
  border:1px solid var(--lp-line);background:var(--lp-surface);border-radius:8px;padding:8px 12px;}
.lp-current-note strong{color:var(--lp-ink);font-weight:600;}
.lp-current-dot{width:7px;height:7px;border-radius:50%;background:var(--lp-primary);flex:0 0 auto;}

/* monthly/annual price swap (container class .is-annual toggled by JS) */
.lp-pricing .price-yr,.lp-pricing .bill-yr{display:none;}
.lp-pricing.is-annual .price-mo,.lp-pricing.is-annual .bill-mo{display:none;}
.lp-pricing.is-annual .price-yr{display:inline-flex;}
.lp-pricing.is-annual .bill-yr{display:inline;}

.lp-pricing-foot{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:32px;
  font-size:13px;color:var(--lp-faint);text-align:center;flex-wrap:wrap;}
.lp-pricing-foot svg{width:14px;height:14px;flex:0 0 auto;}
.lp-pricing-foot a{color:var(--lp-muted);font-weight:600;}
.lp-pricing-foot a:hover{color:var(--lp-ink);}

@media (max-width:1040px){
  .lp-plans{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:600px){
  .lp-plans{grid-template-columns:1fr;}
  .lp-pricing-top{align-items:flex-start;}
}