.stanloop-resources,
.stanloop-resource-studio,
.stanloop-resource-collection-page {
    --slr-green: #2fae1b;
    --slr-green-dark: #187d13;
    --slr-green-soft: #eef9e9;
    --slr-orange: #ff7b22;
    --slr-orange-soft: #fff3e8;
    --slr-ink: #111827;
    --slr-muted: #5f6b7d;
    --slr-line: #dbe6d7;
    --slr-panel: #ffffff;
    --slr-cream: #fffdf6;
    --slr-shadow: 0 16px 42px rgba(42, 71, 35, .08);
    color: var(--slr-ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.stanloop-resources *,
.stanloop-resource-studio *,
.stanloop-resource-collection-page * { box-sizing: border-box; }

.stanloop-resources-profile-tab { width: 100%; }

.stanloop-resources {
    margin: 0;
    display: grid;
    gap: 18px;
}

.stanloop-resources__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px 22px;
    align-items: center;
    padding: 22px 24px 18px;
    border: 1px solid #d6e6d1;
    border-radius: 20px;
    background: linear-gradient(115deg, #f3ffe9 0%, #fff9ed 58%, #eef6ff 100%);
    box-shadow: var(--slr-shadow);
}

.stanloop-resources__heading > span,
.stanloop-resource-studio__header > div > span,
.stanloop-resource-collection-hero__copy > span,
.stanloop-resource-studio-form__header span {
    display: block;
    margin-bottom: 4px;
    color: var(--slr-green-dark);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.stanloop-resources__heading h2,
.stanloop-resource-studio__header h2,
.stanloop-resource-collection-hero h2 {
    margin: 0;
    color: var(--slr-ink);
    font-size: clamp(28px, 3vw, 38px);
    line-height: 1.04;
    letter-spacing: -.04em;
}

.stanloop-resources__heading p,
.stanloop-resource-studio__header p,
.stanloop-resource-collection-hero__copy > p {
    margin: 7px 0 0;
    color: #40506a;
    font-size: 15px;
    line-height: 1.55;
}

.stanloop-resources__stats,
.stanloop-resource-studio__summary {
    display: flex;
    gap: 10px;
}

.stanloop-resources__stats strong,
.stanloop-resource-studio__summary strong {
    min-width: 74px;
    padding: 10px 12px;
    border: 1px solid #cfe0ca;
    border-radius: 14px;
    background: rgba(255,255,255,.82);
    color: var(--slr-green-dark);
    font-size: 20px;
    line-height: 1;
    text-align: center;
}

.stanloop-resources__stats small,
.stanloop-resource-studio__summary small {
    display: block;
    margin-top: 6px;
    color: #65727e;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.stanloop-resources-toolbar {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(210px, .8fr) minmax(0, 1.6fr) auto;
    gap: 10px;
    align-items: center;
    padding-top: 14px;
    border-top: 1px solid rgba(57, 112, 42, .15);
}

.stanloop-resource-search,
.stanloop-resource-library-manager__heading label {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid #d8e3d4;
    border-radius: 12px;
    background: #fff;
}

.stanloop-resource-search input,
.stanloop-resource-library-manager__heading input {
    width: 100%;
    border: 0 !important;
    outline: 0;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--slr-ink);
    font: inherit;
}

.stanloop-resource-filters,
.stanloop-resource-sort {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.stanloop-resource-sort { justify-content: flex-end; }

.stanloop-resource-filters button,
.stanloop-resource-sort button {
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid #d7e3d3;
    border-radius: 999px;
    background: #fff;
    color: #2e3a4c;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

.stanloop-resource-filters button em {
    margin-left: 3px;
    font-style: normal;
    color: #7a8796;
}

.stanloop-resource-filters button.is-active,
.stanloop-resource-sort button.is-active {
    border-color: var(--slr-green);
    background: var(--slr-green);
    color: #fff;
}

.stanloop-resource-filters button.is-active em { color: #fff; }

.stanloop-resources-feature,
.stanloop-resources-section {
    border: 1px solid var(--slr-line);
    border-radius: 20px;
    background: var(--slr-panel);
    box-shadow: var(--slr-shadow);
}

.stanloop-resources-feature { overflow: hidden; }

.stanloop-resources-section { padding: 20px; }

.stanloop-resources-section__heading,
.stanloop-resource-library-manager__heading,
.stanloop-collection-builder__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
}

.stanloop-resources-section__heading > div,
.stanloop-resource-library-manager__heading > div,
.stanloop-collection-builder__heading > div {
    display: flex;
    align-items: center;
    gap: 11px;
}

.stanloop-resources-section__heading > div > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: var(--slr-green-soft);
    color: var(--slr-green-dark);
    font-weight: 900;
}

.stanloop-resources-section__heading h3,
.stanloop-resource-library-manager__heading h3,
.stanloop-collection-builder__heading h4 {
    margin: 0;
    color: var(--slr-ink);
    font-size: 19px;
    line-height: 1.2;
}

.stanloop-resources-section__heading p,
.stanloop-resource-library-manager__heading p,
.stanloop-collection-builder__heading p {
    margin: 3px 0 0;
    color: var(--slr-muted);
    font-size: 12px;
}

.stanloop-resource-collections-grid,
.stanloop-resources__grid,
.stanloop-resource-manager-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.stanloop-resource-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dce7d8;
    border-radius: 18px;
    background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.stanloop-resource-card:hover {
    transform: translateY(-2px);
    border-color: #afd4a5;
    box-shadow: 0 15px 32px rgba(40, 75, 32, .10);
}

.stanloop-resource-card--featured {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
    border: 0;
    border-radius: 0;
    min-height: 330px;
    background: linear-gradient(135deg, #f0ffe8 0%, #fff6e6 100%);
}

.stanloop-resource-card__visual {
    position: relative;
    min-height: 190px;
    overflow: hidden;
    background: linear-gradient(135deg, #eff8e9, #fff5e7);
}

.stanloop-resource-card--featured .stanloop-resource-card__visual { min-height: 330px; }

.stanloop-resource-card__visual img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: inherit;
    object-fit: cover;
}

.stanloop-resource-card--featured .stanloop-resource-card__visual img { object-fit: cover; }

.stanloop-resource-card__placeholder {
    display: grid;
    min-height: inherit;
    place-items: center;
    color: var(--slr-green-dark);
    font-size: 58px;
    font-weight: 900;
}

.stanloop-resource-card__badges {
    position: absolute;
    inset: 12px 12px auto 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.stanloop-resource-card__badges span,
.stanloop-resource-price,
.stanloop-resource-card__meta,
.stanloop-resource-collection-meta span,
.stanloop-resource-manager-card__body > div span,
.stanloop-resource-manager-card__body > div em {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 4px 8px;
    border: 1px solid rgba(48, 115, 34, .14);
    border-radius: 999px;
    background: rgba(247,255,243,.93);
    color: var(--slr-green-dark);
    font-size: 10px;
    font-weight: 850;
    font-style: normal;
}

.stanloop-resource-card__body {
    display: flex;
    flex-direction: column;
    min-height: 250px;
    padding: 18px;
}

.stanloop-resource-card--featured .stanloop-resource-card__body {
    justify-content: center;
    min-height: 330px;
    padding: 28px;
}

.stanloop-resource-card__title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.stanloop-resource-card h3 {
    margin: 0;
    color: var(--slr-ink);
    font-size: 21px;
    line-height: 1.12;
    letter-spacing: -.025em;
}

.stanloop-resource-card--featured h3 { font-size: clamp(29px, 3vw, 42px); }

.stanloop-resource-card__note {
    margin: 11px 0 0;
    color: #3e4b60;
    font-size: 14px;
    line-height: 1.55;
}

.stanloop-resource-card blockquote,
.stanloop-resource-collection-hero blockquote {
    margin: 14px 0 0;
    padding: 11px 13px;
    border-left: 3px solid var(--slr-orange);
    border-radius: 10px;
    background: var(--slr-orange-soft);
    color: #6a3a11;
}

.stanloop-resource-card blockquote strong,
.stanloop-resource-card blockquote span,
.stanloop-resource-collection-hero blockquote strong,
.stanloop-resource-collection-hero blockquote span { display: block; }

.stanloop-resource-card blockquote strong,
.stanloop-resource-collection-hero blockquote strong { margin-bottom: 3px; font-size: 11px; }
.stanloop-resource-card blockquote span,
.stanloop-resource-collection-hero blockquote span { font-size: 12px; line-height: 1.45; }

.stanloop-resource-card__meta,
.stanloop-resource-collection-meta {
    margin-top: 13px;
}

.stanloop-resource-card__meta {
    align-self: flex-start;
    white-space: normal;
}

.stanloop-resource-collection-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.stanloop-resource-mini-previews {
    display: flex;
    margin-top: 13px;
}

.stanloop-resource-mini-previews span {
    display: grid;
    width: 44px;
    height: 44px;
    margin-right: -7px;
    overflow: hidden;
    place-items: center;
    border: 3px solid #fff;
    border-radius: 12px;
    background: var(--slr-green-soft);
    box-shadow: 0 4px 10px rgba(20,50,17,.12);
}

.stanloop-resource-mini-previews img { width: 100%; height: 100%; object-fit: cover; }
.stanloop-resource-mini-previews b { color: var(--slr-green-dark); }

.stanloop-resource-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-top: auto;
    padding-top: 17px;
}

.stanloop-resource-actions form { margin: 0; }

.stanloop-resource-primary,
.stanloop-resource-share,
.stanloop-resource-actions .stanloop-button,
.stanloop-resource-actions .stanloop-like-control {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 38px;
    padding: 8px 12px;
    border: 1px solid #cfe0ca;
    border-radius: 10px;
    background: #f8fcf6;
    color: #245a1c;
    font: inherit;
    font-size: 11px;
    font-weight: 850;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}

.stanloop-resource-primary {
    border-color: var(--slr-green);
    background: var(--slr-green);
    color: #fff;
    box-shadow: 0 7px 18px rgba(47,174,27,.18);
}

.stanloop-resource-primary:hover,
.stanloop-resource-primary:focus { background: var(--slr-green-dark); color: #fff; }
.stanloop-resource-share:hover,
.stanloop-resource-actions .stanloop-button:hover { border-color: var(--slr-green); color: var(--slr-green-dark); }

.stanloop-resource-actions .stanloop-save-button.is-saved,
.stanloop-resource-actions .stanloop-like-control.is-liked {
    border-color: #93ca85;
    background: #effbea;
    color: #207619;
}

.stanloop-resource-card.is-locked .stanloop-resource-card__visual::after {
    content: "🔒 Stans Only";
    position: absolute;
    inset: auto 12px 12px auto;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(17,24,39,.86);
    color: #fff;
    font-size: 11px;
    font-weight: 850;
}

.stanloop-resource-filter-empty,
.stanloop-resource-empty,
.stanloop-resource-locked-panel {
    padding: 36px 24px;
    border: 1px dashed #bfd9b7;
    border-radius: 18px;
    background: #fbfff9;
    color: var(--slr-muted);
    text-align: center;
}

.stanloop-resource-empty span,
.stanloop-resource-locked-panel > span { display: block; font-size: 36px; }
.stanloop-resource-empty h3,
.stanloop-resource-locked-panel h3 { margin: 8px 0 4px; color: var(--slr-ink); }
.stanloop-resource-empty p,
.stanloop-resource-locked-panel p { margin: 0; }
.stanloop-resource-locked-panel a { display: inline-flex; margin-top: 14px; padding: 10px 15px; border-radius: 10px; background: var(--slr-green); color: #fff; font-weight: 850; text-decoration: none; }

/* Collection page */
.stanloop-resource-collection-page { display: grid; gap: 16px; }
.stanloop-resource-back { justify-self: start; color: #31532a; font-size: 13px; font-weight: 800; text-decoration: none; }

.stanloop-resource-collection-hero {
    display: grid;
    grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr);
    min-height: 340px;
    overflow: hidden;
    border: 1px solid var(--slr-line);
    border-radius: 22px;
    background: linear-gradient(135deg, #eefce8, #fff7e9);
    box-shadow: var(--slr-shadow);
}

.stanloop-resource-collection-hero__visual {
    display: grid;
    min-height: 340px;
    place-items: center;
    overflow: hidden;
    background: #173b18;
}

.stanloop-resource-collection-hero__visual img { width: 100%; height: 100%; object-fit: cover; }
.stanloop-resource-collection-hero__visual span { color: #fff; font-size: 80px; }
.stanloop-resource-collection-hero__copy { display: flex; flex-direction: column; justify-content: center; padding: 30px; }
.stanloop-resource-collection-list { display: grid; gap: 14px; }
.stanloop-resource-collection-step { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; align-items: start; }
.stanloop-resource-collection-index { display: grid; width: 32px; height: 32px; place-items: center; margin-top: 12px; border-radius: 10px; background: var(--slr-green); color: #fff; font-weight: 900; }
.stanloop-resource-collection-step .stanloop-resource-card { display: grid; grid-template-columns: 210px minmax(0, 1fr); }
.stanloop-resource-collection-step .stanloop-resource-card__visual { min-height: 230px; }
.stanloop-resource-collection-step .stanloop-resource-card__body { min-height: 230px; }

/* Creator Resource Studio */
.stanloop-resource-studio {
    display: grid;
    gap: 15px;
    margin-bottom: 18px;
}

.stanloop-resource-studio__header {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    padding: 18px 20px;
    border: 1px solid #d7e4d3;
    border-radius: 18px;
    background: linear-gradient(105deg, #f4ffeb, #fff8e9);
}

.stanloop-resource-studio__header h2 { font-size: 25px; }
.stanloop-resource-studio__actions { display: flex; flex-wrap: wrap; gap: 9px; }
.stanloop-resource-studio__actions button,
.stanloop-resource-studio__actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 9px 14px;
    border: 1px solid #a7d49c;
    border-radius: 11px;
    background: #fff;
    color: #245b1e;
    font: inherit;
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
    cursor: pointer;
}
.stanloop-resource-studio__actions button:first-child { background: var(--slr-green); color: #fff; border-color: var(--slr-green); }

.stanloop-resource-studio-form {
    overflow: hidden;
    border: 1px solid #bcdcb4;
    border-radius: 20px;
    background: #fff;
    box-shadow: var(--slr-shadow);
}

.stanloop-resource-studio-form__header {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    padding: 18px 20px;
    border-bottom: 1px solid #e1e9df;
    background: #fbfff9;
}
.stanloop-resource-studio-form__header h3 { margin: 0; font-size: 23px; }
.stanloop-resource-studio-form__header p { margin: 4px 0 0; color: var(--slr-muted); font-size: 13px; }
.stanloop-resource-studio-form__header button { width: 34px; height: 34px; border: 0; border-radius: 50%; background: #eef4ec; color: #455541; font-size: 22px; cursor: pointer; }

.stanloop-resource-source-choices {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 18px 20px 0;
}
.stanloop-resource-source-choices label { cursor: pointer; }
.stanloop-resource-source-choices input { position: absolute; opacity: 0; pointer-events: none; }
.stanloop-resource-source-choices span {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 2px 9px;
    min-height: 92px;
    padding: 13px;
    border: 1px solid #dce5d9;
    border-radius: 14px;
    background: #fff;
    color: var(--slr-green-dark);
}
.stanloop-resource-source-choices strong { color: var(--slr-ink); font-size: 13px; }
.stanloop-resource-source-choices small { grid-column: 2; color: var(--slr-muted); line-height: 1.35; }
.stanloop-resource-source-choices input:checked + span { border-color: var(--slr-green); background: #f4ffef; box-shadow: 0 0 0 2px rgba(47,174,27,.08); }

.stanloop-resource-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
    padding: 18px 20px;
}
.stanloop-resource-field { display: grid; gap: 6px; }
.stanloop-resource-field--wide { grid-column: 1 / -1; }
.stanloop-resource-field > span { color: #354354; font-size: 11px; font-weight: 850; }
.stanloop-resource-field input,
.stanloop-resource-field textarea,
.stanloop-resource-field select {
    width: 100%;
    min-height: 43px;
    margin: 0;
    padding: 10px 11px;
    border: 1px solid #ccd9c8;
    border-radius: 10px;
    background: #fff;
    color: var(--slr-ink);
    font: inherit;
    font-size: 13px;
    box-shadow: none;
}
.stanloop-resource-field textarea { min-height: 88px; resize: vertical; }
.stanloop-resource-check { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 10px; background: #f3fbea; color: #275f21; font-size: 12px; font-weight: 800; }

.stanloop-resource-live-card {
    display: flex;
    gap: 12px;
    align-items: center;
    margin: 0 20px 18px;
    padding: 13px;
    border: 1px dashed #b5d9ac;
    border-radius: 14px;
    background: #fbfff9;
}
.stanloop-resource-live-card > span { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; background: var(--slr-green-soft); color: var(--slr-green-dark); font-size: 20px; }
.stanloop-resource-live-card small,
.stanloop-resource-live-card strong,
.stanloop-resource-live-card p { display: block; }
.stanloop-resource-live-card small { color: var(--slr-green-dark); font-weight: 800; }
.stanloop-resource-live-card strong { margin-top: 2px; }
.stanloop-resource-live-card p { margin: 2px 0 0; color: var(--slr-muted); font-size: 12px; }

.stanloop-resource-studio-form__actions {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    padding: 14px 20px;
    border-top: 1px solid #e2e9e0;
    background: #fbfcfb;
}
.stanloop-resource-studio-form__actions button { min-height: 40px; padding: 9px 15px; border-radius: 10px; font: inherit; font-size: 12px; font-weight: 850; cursor: pointer; }
.stanloop-resource-cancel { border: 1px solid #d8dfd6; background: #fff; color: #53605f; }
.stanloop-resource-publish { border: 1px solid var(--slr-green); background: var(--slr-green); color: #fff; }

.stanloop-collection-builder { margin: 0 20px 18px; padding: 16px; border: 1px solid #dbe7d8; border-radius: 16px; background: #fcfff9; }
.stanloop-collection-builder__heading > span { display: grid; min-width: 34px; height: 34px; place-items: center; border-radius: 10px; background: var(--slr-green); color: #fff; font-weight: 900; }
.stanloop-collection-builder__available { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.stanloop-collection-builder__available label { cursor: pointer; }
.stanloop-collection-builder__available input { position: absolute; opacity: 0; pointer-events: none; }
.stanloop-collection-builder__available label > span { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 1px 8px; min-height: 58px; padding: 9px 10px; border: 1px solid #dce6da; border-radius: 11px; background: #fff; }
.stanloop-collection-builder__available b { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 8px; background: var(--slr-green-soft); color: var(--slr-green-dark); }
.stanloop-collection-builder__available strong { color: var(--slr-ink); font-size: 12px; }
.stanloop-collection-builder__available small { grid-column: 2; color: var(--slr-muted); font-size: 10px; }
.stanloop-collection-builder__available input:checked + span { border-color: var(--slr-green); background: #f3ffed; }
.stanloop-collection-builder__order { display: grid; gap: 7px; margin-top: 12px; }
.stanloop-collection-order-item { display: flex; align-items: center; gap: 9px; padding: 9px 11px; border: 1px solid #cfe0ca; border-radius: 10px; background: #fff; cursor: grab; }
.stanloop-collection-order-item.is-dragging { opacity: .5; }
.stanloop-collection-order-item span:first-child { color: #80907c; }
.stanloop-collection-order-item strong { flex: 1; font-size: 12px; }
.stanloop-collection-order-item small { color: var(--slr-muted); }

.stanloop-resource-library-manager { padding: 18px; border: 1px solid #dce6d9; border-radius: 18px; background: #fff; }
.stanloop-resource-library-manager__heading label { width: min(300px, 100%); }
.stanloop-resource-manager-card { overflow: hidden; border: 1px solid #dce5d9; border-radius: 15px; background: #fff; }
.stanloop-resource-manager-card__visual { position: relative; height: 145px; display: grid; place-items: center; overflow: hidden; background: #eef8e9; }
.stanloop-resource-manager-card__visual img { width: 100%; height: 100%; object-fit: cover; }
.stanloop-resource-manager-card__visual > span { color: var(--slr-green-dark); font-size: 46px; }
.stanloop-resource-manager-card__visual > div { position: absolute; inset: auto 8px 8px 8px; display: flex; gap: 5px; }
.stanloop-resource-manager-card__visual > div span { padding: 5px 7px; border-radius: 999px; background: rgba(17,24,39,.83); color: #fff; font-size: 9px; font-weight: 800; }
.stanloop-resource-manager-card__body { padding: 13px; }
.stanloop-resource-manager-card__body > div:first-child { display: flex; gap: 5px; }
.stanloop-resource-manager-card__body h4 { margin: 8px 0 4px; font-size: 15px; }
.stanloop-resource-manager-card__body p { min-height: 34px; margin: 0; color: var(--slr-muted); font-size: 11px; line-height: 1.45; }
.stanloop-resource-manager-card__actions { display: flex; gap: 7px; margin-top: 11px; }
.stanloop-resource-manager-card__actions a { padding: 7px 9px; border: 1px solid #d2dfce; border-radius: 8px; color: #285d22; font-size: 10px; font-weight: 850; text-decoration: none; }
.stanloop-resource-manager-card__actions .is-delete { border-color: #ffd0b0; background: #fff8f1; color: #b94b00; }

.stanloop-notice { margin-bottom: 12px; padding: 12px 14px; border: 1px solid #a7d89b; border-radius: 12px; background: #effbea; color: #176d13; font-weight: 750; }
.stanloop-notice--warning { border-color: #ffc99f; background: #fff3e8; color: #9b4307; }
.stanloop-empty { color: var(--slr-muted); }

@media (max-width: 1100px) {
    .stanloop-resources-toolbar { grid-template-columns: 1fr; }
    .stanloop-resource-sort { justify-content: flex-start; }
    .stanloop-resource-card--featured { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 820px) {
    .stanloop-resources__header { grid-template-columns: 1fr; padding: 18px; }
    .stanloop-resources__stats { justify-content: flex-start; }
    .stanloop-resource-card--featured,
    .stanloop-resource-collection-hero,
    .stanloop-resource-collection-step .stanloop-resource-card { grid-template-columns: 1fr; }
    .stanloop-resource-card--featured .stanloop-resource-card__visual { min-height: 260px; }
    .stanloop-resource-card--featured .stanloop-resource-card__body { min-height: auto; }
    .stanloop-resource-collections-grid,
    .stanloop-resources__grid,
    .stanloop-resource-manager-grid,
    .stanloop-resource-source-choices,
    .stanloop-collection-builder__available { grid-template-columns: 1fr; }
    .stanloop-resource-form-grid { grid-template-columns: 1fr; }
    .stanloop-resource-field--wide,
    .stanloop-resource-check { grid-column: auto; }
    .stanloop-resource-studio__header { align-items: flex-start; flex-direction: column; }
    .stanloop-resource-collection-hero__visual { min-height: 260px; }
    .stanloop-resource-collection-step { grid-template-columns: 1fr; }
    .stanloop-resource-collection-index { margin: 0; }
}

@media (max-width: 560px) {
    .stanloop-resources__stats,
    .stanloop-resource-studio__summary { width: 100%; }
    .stanloop-resources__stats strong,
    .stanloop-resource-studio__summary strong { flex: 1; min-width: 0; }
    .stanloop-resource-filters,
    .stanloop-resource-sort { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 3px; scrollbar-width: thin; }
    .stanloop-resource-filters button,
    .stanloop-resource-sort button { flex: 0 0 auto; }
    .stanloop-resources-section { padding: 14px; }
    .stanloop-resource-card__body,
    .stanloop-resource-card--featured .stanloop-resource-card__body,
    .stanloop-resource-collection-hero__copy { padding: 17px; }
    .stanloop-resource-actions { align-items: stretch; }
    .stanloop-resource-primary { flex: 1 1 100%; }
    .stanloop-resource-actions .stanloop-save-form,
    .stanloop-resource-actions .stanloop-like-form { flex: 1 1 auto; }
    .stanloop-resource-actions .stanloop-button,
    .stanloop-resource-actions .stanloop-like-control { width: 100%; }
    .stanloop-resource-studio-form__header,
    .stanloop-resource-form-grid,
    .stanloop-resource-source-choices { padding-left: 14px; padding-right: 14px; }
    .stanloop-resource-live-card,
    .stanloop-collection-builder { margin-left: 14px; margin-right: 14px; }
    .stanloop-resource-library-manager__heading { align-items: stretch; flex-direction: column; }
    .stanloop-resource-library-manager__heading label { width: 100%; }
}

/* Creator Loop Home — compact adaptive Resource Shelf preview. */
.stanloop-loop-resources-preview .stanloop-loop-resource-item--rich {
    grid-template-columns: 54px minmax(0, 1fr) auto !important;
    min-height: 70px !important;
    padding: 8px !important;
    border: 1px solid #dce7d8;
    background: linear-gradient(135deg, #fff 0%, #f3faef 100%) !important;
}
.stanloop-loop-resources-preview .stanloop-loop-resource-item__visual {
    width: 54px !important;
    height: 54px !important;
    overflow: hidden;
    border-radius: 11px !important;
    background: #e9f6e4 !important;
}
.stanloop-loop-resources-preview .stanloop-loop-resource-item__visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.stanloop-loop-resources-preview .stanloop-loop-resource-item__visual b {
    font-size: 22px;
}
.stanloop-loop-resources-preview .stanloop-loop-resource-item__copy {
    min-width: 0;
}
.stanloop-loop-resources-preview .stanloop-loop-resource-item__copy small {
    margin: 0 0 2px !important;
    color: #328425 !important;
    font-size: 9px !important;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.stanloop-loop-resources-preview .stanloop-loop-resource-item__copy strong {
    overflow: hidden;
    font-size: 13px !important;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.stanloop-loop-resources-preview .stanloop-loop-resource-item__copy em {
    display: block;
    overflow: hidden;
    margin-top: 3px;
    color: #637062 !important;
    font-size: 10px !important;
    line-height: 1.3;
    font-weight: 600 !important;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.stanloop-loop-resources-preview .stanloop-loop-resource-item__arrow {
    color: #2f8b25;
    font-size: 16px;
    font-weight: 900;
}

/* v0.2.31 — Advanced Collection & Toolkit Builder. */
.stanloop-resource-studio-form--collection {
    overflow: visible;
}

.stanloop-collection-basics {
    padding: 18px 20px 20px;
    border-bottom: 1px solid #e1e9df;
    background: linear-gradient(180deg, #fff 0%, #fbfff9 100%);
}

.stanloop-collection-layout-picker {
    margin: 18px 0 0;
    padding: 0;
    border: 0;
}

.stanloop-collection-layout-picker legend {
    margin: 0;
    color: var(--slr-ink);
    font-size: 15px;
    font-weight: 900;
}

.stanloop-collection-layout-picker > p {
    margin: 4px 0 11px;
    color: var(--slr-muted);
    font-size: 12px;
}

.stanloop-collection-layout-picker > div {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
}

.stanloop-collection-layout-picker label {
    min-width: 0;
    cursor: pointer;
}

.stanloop-collection-layout-picker input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.stanloop-collection-layout-picker label > span {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 3px 9px;
    min-height: 92px;
    padding: 12px;
    border: 1px solid #d8e5d5;
    border-radius: 13px;
    background: #fff;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.stanloop-collection-layout-picker b {
    display: grid;
    grid-row: 1 / 3;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 10px;
    background: var(--slr-green-soft);
    color: var(--slr-green-dark);
    font-size: 17px;
}

.stanloop-collection-layout-picker strong {
    align-self: end;
    color: var(--slr-ink);
    font-size: 12px;
}

.stanloop-collection-layout-picker small {
    color: var(--slr-muted);
    font-size: 10px;
    line-height: 1.35;
}

.stanloop-collection-layout-picker input:checked + span {
    border-color: var(--slr-green);
    background: #f2ffec;
    box-shadow: 0 0 0 2px rgba(47, 174, 27, .10);
}

.stanloop-collection-studio {
    display: grid;
    grid-template-columns: minmax(220px, .72fr) minmax(380px, 1.45fr) minmax(230px, .82fr);
    gap: 12px;
    padding: 18px 20px 20px;
    background: #f7faf6;
}

.stanloop-collection-library,
.stanloop-collection-structure,
.stanloop-collection-preview {
    min-width: 0;
    border: 1px solid #dbe6d8;
    border-radius: 16px;
    background: #fff;
}

.stanloop-collection-library,
.stanloop-collection-preview {
    position: sticky;
    top: 28px;
    align-self: start;
    max-height: calc(100vh - 56px);
    overflow: auto;
}

.admin-bar .stanloop-collection-library,
.admin-bar .stanloop-collection-preview {
    top: 60px;
    max-height: calc(100vh - 88px);
}

.stanloop-collection-library > header,
.stanloop-collection-structure > header,
.stanloop-collection-preview > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 14px;
    border-bottom: 1px solid #e3eae1;
    background: #fbfff9;
}

.stanloop-collection-library > header span,
.stanloop-collection-structure > header span,
.stanloop-collection-preview > header span {
    display: block;
    margin-bottom: 3px;
    color: var(--slr-green-dark);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.stanloop-collection-library > header h4,
.stanloop-collection-structure > header h4,
.stanloop-collection-preview > header h4 {
    margin: 0;
    color: var(--slr-ink);
    font-size: 16px;
}

.stanloop-collection-structure > header p,
.stanloop-collection-preview > header p {
    margin: 4px 0 0;
    color: var(--slr-muted);
    font-size: 10px;
    line-height: 1.4;
}

.stanloop-collection-library > header > strong {
    display: grid;
    min-width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 9px;
    background: var(--slr-green);
    color: #fff;
    font-size: 13px;
}

.stanloop-collection-structure > header > button,
.stanloop-collection-quick-toggle {
    min-height: 36px;
    padding: 7px 10px;
    border: 1px solid #afd5a5;
    border-radius: 9px;
    background: #f3ffed;
    color: var(--slr-green-dark);
    font: inherit;
    font-size: 10px;
    font-weight: 850;
    cursor: pointer;
}

.stanloop-collection-library__search {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 12px;
    min-height: 38px;
    padding: 0 10px;
    border: 1px solid #dbe5d8;
    border-radius: 10px;
    background: #fff;
}

.stanloop-collection-library__search input {
    width: 100%;
    min-width: 0;
    border: 0 !important;
    outline: 0;
    background: transparent !important;
    box-shadow: none !important;
    font: inherit;
    font-size: 11px;
}

.stanloop-collection-library__items {
    display: grid;
    gap: 7px;
    padding: 0 12px 12px;
}

.stanloop-collection-library-item {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) 28px;
    gap: 8px;
    align-items: center;
    min-height: 55px;
    padding: 7px;
    border: 1px solid #dce6da;
    border-radius: 11px;
    background: #fff;
    cursor: grab;
}

.stanloop-collection-library-item.is-used {
    border-color: #9bd18e;
    background: #f3ffed;
}

.stanloop-collection-library-item.is-dragging,
.stanloop-collection-section-editor.is-dragging,
.stanloop-collection-structure-item.is-dragging {
    opacity: .5;
}

.stanloop-collection-library-item > div,
.stanloop-collection-structure-item__visual,
.stanloop-collection-preview-item > div {
    display: grid;
    overflow: hidden;
    place-items: center;
    border-radius: 9px;
    background: var(--slr-green-soft);
    color: var(--slr-green-dark);
    font-weight: 900;
}

.stanloop-collection-library-item > div {
    width: 40px;
    height: 40px;
}

.stanloop-collection-library-item img,
.stanloop-collection-structure-item img,
.stanloop-collection-preview-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.stanloop-collection-library-item section,
.stanloop-collection-preview-item section {
    min-width: 0;
}

.stanloop-collection-library-item strong,
.stanloop-collection-library-item small,
.stanloop-collection-preview-item strong,
.stanloop-collection-preview-item small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stanloop-collection-library-item strong {
    color: var(--slr-ink);
    font-size: 11px;
}

.stanloop-collection-library-item small {
    margin-top: 2px;
    color: var(--slr-muted);
    font-size: 9px;
}

.stanloop-collection-library-item > button {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 1px solid #b9d9b1;
    border-radius: 8px;
    background: #fff;
    color: var(--slr-green-dark);
    font-size: 17px;
    cursor: pointer;
}

.stanloop-collection-quick-toggle {
    width: calc(100% - 24px);
    margin: 0 12px 12px;
}

.stanloop-collection-quick-add {
    display: grid;
    gap: 9px;
    margin: 0 12px 12px;
    padding: 11px;
    border: 1px dashed #aed4a5;
    border-radius: 11px;
    background: #fbfff9;
}

.stanloop-collection-quick-add[hidden] {
    display: none;
}

.stanloop-collection-quick-add label {
    display: grid;
    gap: 4px;
}

.stanloop-collection-quick-add label > span {
    color: #384457;
    font-size: 9px;
    font-weight: 850;
}

.stanloop-collection-quick-add input,
.stanloop-collection-quick-add textarea,
.stanloop-collection-quick-add select {
    width: 100%;
    min-height: 35px;
    padding: 7px 8px;
    border: 1px solid #d5e1d2;
    border-radius: 8px;
    background: #fff;
    font: inherit;
    font-size: 10px;
}

.stanloop-collection-quick-add button {
    min-height: 36px;
    border: 0;
    border-radius: 9px;
    background: var(--slr-green);
    color: #fff;
    font: inherit;
    font-size: 10px;
    font-weight: 850;
    cursor: pointer;
}

.stanloop-collection-quick-add p {
    margin: 0;
    color: var(--slr-green-dark);
    font-size: 9px;
    line-height: 1.35;
}

.stanloop-collection-structure > header {
    position: sticky;
    top: 0;
    z-index: 2;
}

.stanloop-collection-structure > div {
    display: grid;
    gap: 10px;
    padding: 12px;
}

.stanloop-collection-section-editor {
    overflow: hidden;
    border: 1px solid #dbe6d8;
    border-radius: 13px;
    background: #fff;
}

.stanloop-collection-section-editor.is-active {
    border-color: var(--slr-green);
    box-shadow: 0 0 0 2px rgba(47, 174, 27, .08);
}

.stanloop-collection-section-editor > header {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) auto;
    gap: 9px;
    align-items: start;
    padding: 10px;
    background: #fbfff9;
}

.stanloop-collection-section-editor__number {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 9px;
    background: var(--slr-green-soft);
    color: var(--slr-green-dark);
    font-size: 11px;
    font-weight: 900;
}

.stanloop-collection-section-editor input,
.stanloop-collection-section-editor textarea {
    width: 100%;
    border: 0 !important;
    outline: 0;
    background: transparent !important;
    box-shadow: none !important;
    font: inherit;
}

.stanloop-collection-section-editor input {
    min-height: 28px;
    color: var(--slr-ink);
    font-size: 12px;
    font-weight: 850;
}

.stanloop-collection-section-editor textarea {
    resize: vertical;
    min-height: 38px;
    padding-top: 2px;
    color: var(--slr-muted);
    font-size: 10px;
    line-height: 1.35;
}

.stanloop-collection-section-editor__actions,
.stanloop-collection-structure-item__actions {
    display: flex;
    gap: 4px;
}

.stanloop-collection-section-editor__actions button,
.stanloop-collection-structure-item__actions button {
    display: grid;
    width: 25px;
    height: 25px;
    place-items: center;
    border: 1px solid #d6e1d3;
    border-radius: 7px;
    background: #fff;
    color: #52604f;
    font: inherit;
    font-size: 10px;
    cursor: pointer;
}

.stanloop-collection-section-editor__actions button:last-child,
.stanloop-collection-structure-item__actions button:last-child {
    border-color: #ffd0b2;
    color: #b94c00;
}

.stanloop-collection-section-dropzone {
    display: grid;
    gap: 7px;
    min-height: 66px;
    padding: 9px;
    border-top: 1px dashed #d6e3d3;
    background: #fff;
    transition: background .16s ease, box-shadow .16s ease;
}

.stanloop-collection-section-dropzone.is-drop-target {
    background: #effbea;
    box-shadow: inset 0 0 0 2px rgba(47, 174, 27, .18);
}

.stanloop-collection-section-dropzone > p {
    align-self: center;
    margin: 0;
    color: #80907c;
    font-size: 10px;
    text-align: center;
}

.stanloop-collection-structure-item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding: 7px;
    border: 1px solid #dce6da;
    border-radius: 10px;
    background: #fff;
    cursor: grab;
}

.stanloop-collection-structure-item__visual {
    width: 38px;
    height: 38px;
}

.stanloop-collection-structure-item > div:nth-child(2) {
    min-width: 0;
}

.stanloop-collection-structure-item strong,
.stanloop-collection-structure-item small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stanloop-collection-structure-item strong {
    color: var(--slr-ink);
    font-size: 11px;
}

.stanloop-collection-structure-item small {
    margin-top: 2px;
    color: var(--slr-muted);
    font-size: 9px;
}

.stanloop-collection-preview > div {
    padding: 12px;
}

.stanloop-collection-preview-card {
    padding: 12px;
    border: 1px solid #d5e5d1;
    border-radius: 12px;
    background: linear-gradient(135deg, #f2ffec, #fff7e9);
}

.stanloop-collection-preview-card > span {
    color: var(--slr-green-dark);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.stanloop-collection-preview-card h5 {
    margin: 5px 0 4px;
    color: var(--slr-ink);
    font-size: 17px;
    line-height: 1.1;
}

.stanloop-collection-preview-card > p {
    margin: 0;
    color: #46536a;
    font-size: 10px;
    line-height: 1.4;
}

.stanloop-collection-preview-card blockquote {
    display: grid;
    gap: 2px;
    margin: 9px 0 0;
    padding: 8px;
    border-left: 3px solid var(--slr-orange);
    border-radius: 8px;
    background: var(--slr-orange-soft);
}

.stanloop-collection-preview-card blockquote strong {
    color: #914207;
    font-size: 9px;
}

.stanloop-collection-preview-card blockquote span {
    color: #6a421f;
    font-size: 9px;
    line-height: 1.35;
}

.stanloop-collection-preview-section {
    margin-top: 10px;
}

.stanloop-collection-preview-section > header {
    display: grid;
    gap: 2px;
    margin-bottom: 6px;
}

.stanloop-collection-preview-section > header strong {
    color: var(--slr-ink);
    font-size: 11px;
}

.stanloop-collection-preview-section > header small {
    color: var(--slr-muted);
    font-size: 9px;
    line-height: 1.35;
}

.stanloop-collection-preview-items {
    display: grid;
    gap: 6px;
}

.stanloop-collection-preview-items--grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.stanloop-collection-preview-item {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 7px;
    align-items: center;
    min-width: 0;
    padding: 7px;
    border: 1px solid #dce6da;
    border-radius: 9px;
    background: #fff;
}

.stanloop-collection-preview-item > b {
    display: grid;
    width: 23px;
    height: 23px;
    place-items: center;
    border-radius: 7px;
    background: var(--slr-green);
    color: #fff;
    font-size: 9px;
}

.stanloop-collection-preview-item > div {
    width: 30px;
    height: 30px;
}

.stanloop-collection-preview-item--steps,
.stanloop-collection-preview-item--checklist {
    grid-template-columns: 23px 30px minmax(0, 1fr);
}

.stanloop-collection-preview-item strong {
    color: var(--slr-ink);
    font-size: 9px;
}

.stanloop-collection-preview-item small {
    margin-top: 2px;
    color: var(--slr-muted);
    font-size: 8px;
}

.stanloop-collection-preview-items > p {
    margin: 0;
    padding: 8px;
    border: 1px dashed #d4e1d1;
    border-radius: 8px;
    color: #80907c;
    font-size: 9px;
    text-align: center;
}

/* Published Collection sections and fan layouts. */
.stanloop-resource-collection-outcome {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 10px;
    margin-top: 14px;
    padding: 11px;
    border: 1px solid #cfe3c9;
    border-radius: 12px;
    background: #f4ffef;
}

.stanloop-resource-collection-outcome > span {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 10px;
    background: var(--slr-green);
    color: #fff;
    font-size: 16px;
}

.stanloop-resource-collection-outcome strong,
.stanloop-resource-collection-outcome p {
    display: block;
}

.stanloop-resource-collection-outcome strong {
    color: var(--slr-green-dark);
    font-size: 10px;
}

.stanloop-resource-collection-outcome p {
    margin: 3px 0 0;
    color: #3d4f3b;
    font-size: 12px;
    line-height: 1.45;
}

.stanloop-resource-collection-section {
    padding: 18px;
    border: 1px solid var(--slr-line);
    border-radius: 18px;
    background: #fff;
    box-shadow: var(--slr-shadow);
}

.stanloop-resource-collection-section__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.stanloop-resource-collection-section__header > div {
    display: flex;
    align-items: center;
    gap: 10px;
}

.stanloop-resource-collection-section__header > div > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: var(--slr-green-soft);
    color: var(--slr-green-dark);
    font-weight: 900;
}

.stanloop-resource-collection-section__header h3 {
    margin: 0;
    color: var(--slr-ink);
    font-size: 20px;
}

.stanloop-resource-collection-section__header p {
    margin: 3px 0 0;
    color: var(--slr-muted);
    font-size: 12px;
}

.stanloop-resource-collection-section__header > small {
    color: var(--slr-muted);
    font-size: 10px;
    font-weight: 800;
}

.stanloop-resource-collection-list--grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.stanloop-resource-collection-list--grid .stanloop-resource-card {
    min-height: 100%;
}

.stanloop-resource-collection-list--list,
.stanloop-resource-collection-list--checklist,
.stanloop-resource-collection-list--steps {
    gap: 9px;
}

.stanloop-resource-collection-item {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 11px;
    border: 1px solid #dce6da;
    border-radius: 13px;
    background: #fff;
}

.stanloop-resource-collection-item--steps {
    grid-template-columns: 34px 72px minmax(0, 1fr);
}

.stanloop-resource-collection-item--checklist {
    grid-template-columns: 34px 72px minmax(0, 1fr);
}

.stanloop-resource-collection-item.is-complete {
    border-color: #9bd18e;
    background: #f4ffef;
}

.stanloop-resource-collection-item.is-complete h4 {
    color: #60715d;
    text-decoration: line-through;
}

.stanloop-resource-checklist-control {
    display: block;
    cursor: pointer;
}

.stanloop-resource-checklist-control input {
    position: absolute;
    opacity: 0;
}

.stanloop-resource-checklist-control > span[aria-hidden] {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border: 2px solid #b9d5b2;
    border-radius: 9px;
    background: #fff;
    color: transparent;
    font-weight: 900;
}

.stanloop-resource-checklist-control input:checked + span {
    border-color: var(--slr-green);
    background: var(--slr-green);
    color: #fff;
}

.stanloop-resource-collection-item__visual {
    display: grid;
    width: 72px;
    height: 64px;
    overflow: hidden;
    place-items: center;
    border-radius: 11px;
    background: var(--slr-green-soft);
    color: var(--slr-green-dark);
    font-size: 24px;
}

.stanloop-resource-collection-item__visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.stanloop-resource-collection-item__copy {
    min-width: 0;
}

.stanloop-resource-collection-item__eyebrow {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.stanloop-resource-collection-item__eyebrow span {
    padding: 3px 7px;
    border-radius: 999px;
    background: var(--slr-green-soft);
    color: var(--slr-green-dark);
    font-size: 8px;
    font-weight: 850;
}

.stanloop-resource-collection-item h4 {
    margin: 5px 0 3px;
    color: var(--slr-ink);
    font-size: 15px;
}

.stanloop-resource-collection-item__copy > p {
    margin: 0;
    color: var(--slr-muted);
    font-size: 11px;
    line-height: 1.4;
}

.stanloop-resource-collection-item__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}

.stanloop-resource-collection-item__actions form {
    margin: 0;
}

.stanloop-resource-collection-item__actions .stanloop-resource-primary,
.stanloop-resource-collection-item__actions .stanloop-button,
.stanloop-resource-collection-item__actions .stanloop-like-control {
    min-height: 33px;
    padding: 7px 9px;
    font-size: 9px;
}

@media (max-width: 1220px) {
    .stanloop-collection-studio {
        grid-template-columns: minmax(210px, .75fr) minmax(360px, 1.35fr);
    }
    .stanloop-collection-preview {
        position: static;
        grid-column: 1 / -1;
        max-height: none;
    }
    .stanloop-collection-preview > div {
        display: grid;
        grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr);
        gap: 12px;
    }
    .stanloop-collection-preview-card {
        align-self: start;
    }
}

@media (max-width: 920px) {
    .stanloop-collection-layout-picker > div {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .stanloop-collection-studio {
        grid-template-columns: 1fr;
    }
    .stanloop-collection-library,
    .stanloop-collection-preview {
        position: static;
        max-height: none;
    }
    .stanloop-collection-preview {
        grid-column: auto;
    }
    .stanloop-collection-preview > div {
        display: block;
    }
    .stanloop-resource-collection-list--grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .stanloop-collection-basics,
    .stanloop-collection-studio {
        padding-left: 14px;
        padding-right: 14px;
    }
    .stanloop-collection-layout-picker > div {
        grid-template-columns: 1fr;
    }
    .stanloop-collection-layout-picker label > span {
        min-height: 76px;
    }
    .stanloop-collection-structure > header {
        align-items: stretch;
        flex-direction: column;
    }
    .stanloop-collection-section-editor > header {
        grid-template-columns: 30px minmax(0, 1fr);
    }
    .stanloop-collection-section-editor__actions {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }
    .stanloop-collection-structure-item {
        grid-template-columns: 34px minmax(0, 1fr);
    }
    .stanloop-collection-structure-item__visual {
        width: 34px;
        height: 34px;
    }
    .stanloop-collection-structure-item__actions {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }
    .stanloop-resource-collection-item,
    .stanloop-resource-collection-item--steps,
    .stanloop-resource-collection-item--checklist {
        grid-template-columns: 34px minmax(0, 1fr);
    }
    .stanloop-resource-collection-item__visual {
        width: 34px;
        height: 34px;
        font-size: 16px;
    }
    .stanloop-resource-collection-item--list .stanloop-resource-collection-item__visual {
        grid-column: 1;
    }
    .stanloop-resource-collection-item__copy {
        grid-column: 2;
    }
}