/* Shortlist heart, header link and toast — Penpot "05 Shortlist". Tokens from the theme (:root). */
.ncy-fav { width: 32px; height: 32px; border-radius: 999px; background: rgba(255, 255, 255, .92); color: var(--ink-2, #556160); display: inline-grid; place-items: center; cursor: pointer; box-shadow: var(--sh-1, 0 1px 2px rgba(16, 22, 23, .07), 0 0 0 1px rgba(16, 22, 23, .06)); transition: background .16s, color .16s, transform .16s; -webkit-tap-highlight-color: transparent; }
.ncy-fav:hover { background: #fff; color: var(--risk, #C0472B); }
.ncy-fav:focus-visible { outline: 2px solid var(--brand, #0E5A54); outline-offset: 2px; }
.ncy-fav svg { width: 17px; height: 17px; display: block; }
.ncy-fav[aria-pressed="true"] { color: var(--risk, #C0472B); }
.ncy-fav[aria-pressed="true"] svg path { fill: currentColor; }
.ncy-fav:active { transform: scale(.92); }
.ncy-fav--inline { box-shadow: none; background: transparent; width: 36px; height: 36px; }
.ncy-fav--inline:hover { background: var(--brand-tint, #E6EFEE); }

.ncy-sl-hd { display: inline-flex; align-items: center; gap: 8px; color: var(--ink, #101617); text-decoration: none; font-weight: 600; font-size: 14px; white-space: nowrap; border-radius: 8px; padding: 6px 8px; position: relative; }
.ncy-sl-hd:hover { color: var(--brand, #0E5A54); background: var(--brand-tint, #E6EFEE); }
.ncy-sl-hd__i { display: inline-grid; place-items: center; color: var(--ink-2, #556160); }
.ncy-sl-hd__n { min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--brand, #0E5A54); color: #fff; font-size: 12px; font-weight: 600; line-height: 20px; text-align: center; font-variant-numeric: tabular-nums; }
.ncy-sl-hd__n[hidden] { display: none; }
.ncy-sl-hd--mobile { padding: 6px; }
.ncy-sl-hd--mobile .ncy-sl-hd__n { position: absolute; top: 0; inset-inline-end: -4px; min-width: 18px; height: 16px; line-height: 16px; font-size: 11px; padding: 0 4px; }
.ncy-sl-hd:has(.ncy-sl-hd__n:not([hidden])) .ncy-sl-hd__i { color: var(--risk, #C0472B); }
.ncy-sl-hd:has(.ncy-sl-hd__n:not([hidden])) .ncy-sl-hd__i svg path { fill: currentColor; }

.ncy-sl-toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px); z-index: 2147482000; display: flex; align-items: center; gap: 24px; background: var(--ink, #101617); color: #fff; border-radius: 999px; padding: 13px 24px; font: 500 14px/1.3 'Roboto', 'Noto Sans', sans-serif; box-shadow: 0 10px 28px -10px rgba(16, 22, 23, .45); opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; max-width: calc(100vw - 32px); }
.ncy-sl-toast.is-on { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.ncy-sl-toast a { color: #9FD3CC; text-decoration: none; white-space: nowrap; }
.ncy-sl-toast a:hover { text-decoration: underline; }
@media (max-width: 600px) { .ncy-sl-toast { bottom: 88px; } }
@media (prefers-reduced-motion: reduce) { .ncy-fav, .ncy-sl-toast { transition: none; } }
.ncy-fav--btn { width: 100%; height: 46px; border-radius: 8px; display: inline-flex; gap: 10px; justify-content: center; align-items: center; background: var(--surface, #fff); border: 1.5px solid var(--line-2, #C9D2D0); box-shadow: none; color: var(--ink, #101617); font-weight: 600; font-size: 14.5px; margin-top: 10px; }
.ncy-fav--btn:hover { background: var(--surface-2, #F5F8F7); color: var(--ink, #101617); border-color: var(--ink-2, #556160); }
.ncy-fav--btn svg { color: var(--risk, #C0472B); }
.ncy-fav__on, .ncy-fav--btn[aria-pressed="true"] .ncy-fav__off { display: none; }
.ncy-fav--btn[aria-pressed="true"] .ncy-fav__on { display: inline; }
.ncy-off__c-go .ncy-fav { width: 30px; height: 30px; box-shadow: none; background: transparent; vertical-align: middle; margin-inline-end: 4px; }
.ncy-off__c-go .ncy-fav:hover { background: var(--brand-tint, #E6EFEE); }