/* V101 Collections + Saved Tools */
.collections-template .site-header,
.saved-template .site-header { backdrop-filter: blur(22px); }
.collection-hero,
.saved-hero {
    position: relative;
    padding: 124px 0 56px;
    overflow: hidden;
}
.collection-hero::before,
.saved-hero::before {
    content: "";
    position: absolute;
    inset: 40px auto auto 50%;
    width: min(680px, 80vw);
    height: 420px;
    transform: translateX(-50%);
    background: radial-gradient(circle at 30% 20%, rgba(124,92,255,.42), transparent 34%), radial-gradient(circle at 72% 42%, rgba(0,224,255,.28), transparent 34%), radial-gradient(circle at 48% 80%, rgba(255,76,160,.20), transparent 36%);
    filter: blur(38px);
    opacity: .72;
    pointer-events: none;
}
.collection-hero__inner,
.saved-hero__inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 34px;
    align-items: end;
}
.collection-hero h1,
.saved-hero h1 {
    margin: 14px 0 16px;
    max-width: 820px;
    font-size: clamp(2.5rem, 6vw, 5.6rem);
    line-height: .92;
    letter-spacing: -.075em;
}
.collection-hero p,
.saved-hero p {
    max-width: 760px;
    color: var(--muted, #a8b3cf);
    font-size: 1.08rem;
    line-height: 1.8;
}
.collection-hero__panel,
.saved-hero__panel {
    border: 1px solid rgba(255,255,255,.12);
    background: linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.045));
    box-shadow: 0 28px 90px rgba(0,0,0,.34);
    border-radius: 28px;
    padding: 24px;
}
.collection-hero__panel strong,
.saved-hero__panel strong { display:block; font-size:2rem; letter-spacing:-.04em; }
.collection-hero__panel span,
.saved-hero__panel span { color: var(--muted, #a8b3cf); }
.collection-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.collections-shell,
.collection-detail-shell,
.saved-shell { padding: 34px 0 86px; }
.collections-grid {
    display:grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap:20px;
}
.collection-card {
    position:relative;
    overflow:hidden;
    min-height: 300px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    padding:24px;
    border-radius:28px;
    border:1px solid rgba(255,255,255,.12);
    background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035));
    box-shadow: 0 24px 80px rgba(0,0,0,.24);
    transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}
.collection-card:hover { transform: translateY(-6px); border-color: rgba(124,92,255,.45); box-shadow: 0 30px 100px rgba(0,0,0,.38); }
.collection-card::before {
    content:"";
    position:absolute;
    inset:-1px;
    background: radial-gradient(circle at var(--x, 26%) var(--y, 16%), rgba(124,92,255,.34), transparent 34%), radial-gradient(circle at 80% 84%, rgba(0,224,255,.18), transparent 28%);
    opacity:.78;
    pointer-events:none;
}
.collection-card > * { position:relative; z-index:1; }
.collection-card__icon { width:56px; height:56px; display:grid; place-items:center; border-radius:18px; background:rgba(255,255,255,.11); border:1px solid rgba(255,255,255,.1); font-size:1.45rem; }
.collection-card h2 { margin:22px 0 10px; font-size:1.5rem; letter-spacing:-.035em; }
.collection-card p { color:var(--muted, #a8b3cf); line-height:1.7; margin:0; }
.collection-card__meta { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:22px; color:rgba(255,255,255,.74); font-size:.92rem; }
.collection-card__stack { display:flex; margin-top:24px; min-height:42px; }
.collection-card__stack img { width:42px; height:42px; border-radius:14px; object-fit:cover; border:1px solid rgba(255,255,255,.22); background:#111827; margin-right:-10px; }
.collection-layout { display:grid; grid-template-columns: 330px 1fr; gap:26px; align-items:start; }
.collection-sidebar {
    position:sticky;
    top:100px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:26px;
    background:rgba(255,255,255,.055);
    padding:22px;
}
.collection-sidebar h3 { margin:0 0 14px; }
.collection-sidebar a { display:flex; justify-content:space-between; gap:12px; color:rgba(255,255,255,.78); text-decoration:none; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.07); }
.collection-sidebar a:hover { color:#fff; }
.collection-tools-head { display:flex; align-items:end; justify-content:space-between; gap:18px; margin-bottom:20px; }
.collection-tools-head h2 { margin:0; font-size:clamp(1.6rem,3vw,2.4rem); letter-spacing:-.05em; }
.collection-tools-head p { margin:8px 0 0; color:var(--muted, #a8b3cf); }
.collection-tool-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:18px; }
.saved-empty,
.collection-empty {
    padding:42px;
    border-radius:28px;
    border:1px solid rgba(255,255,255,.12);
    background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035));
    text-align:center;
}
.saved-empty h2,
.collection-empty h2 { margin:0 0 10px; }
.saved-empty p,
.collection-empty p { color:var(--muted, #a8b3cf); margin:0 auto 22px; max-width:560px; line-height:1.7; }
.saved-toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:0 0 22px; }
.saved-toolbar input { width:min(460px,100%); border-radius:999px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.07); color:#fff; padding:14px 18px; }
.saved-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.saved-card { border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06); border-radius:24px; padding:20px; }
.saved-card a { color:#fff; text-decoration:none; font-weight:800; font-size:1.1rem; }
.saved-card p { color:var(--muted,#a8b3cf); line-height:1.6; }
.saved-card button { border:0; border-radius:999px; padding:10px 14px; cursor:pointer; background:rgba(255,255,255,.1); color:#fff; }
@media (max-width: 980px) {
    .collection-hero__inner, .saved-hero__inner, .collection-layout { grid-template-columns: 1fr; }
    .collection-sidebar { position:relative; top:auto; }
    .collections-grid, .collection-tool-grid, .saved-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .collection-hero, .saved-hero { padding-top: 104px; }
    .collections-grid, .collection-tool-grid, .saved-grid { grid-template-columns: 1fr; }
    .saved-toolbar { align-items:stretch; flex-direction:column; }
}