.footer6_component {
    background-color: #c128f909 !important;
}

.container {
    position: relative;
    display: inline-block;
    overflow: hidden;
    color: #fff;
    border-radius: 20px !important;
}

input[type='text'] {
    width: 300px;
    padding: 10px;
    padding-left: 20px;
    border-radius: 20px;
    color: white !important;
    font-family: inherit;
    /* Modern font */
    font-weight: 600;

    font-size: 16px;
    outline: none;
    /*box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);*/
    transition: all 0.3s ease;
    /* Transition property added */
}

input[type='text']::placeholder {
    color: white;
    /* Set the placeholder text color */
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 600;
    /* Modern font */
}

button[type='submit'] {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 40px;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
}

button[type='submit']:hover {
    transform: translateX(5px);
}

.fa-arrow-right {
    font-size: 20px;
    color: white;
}

[vaul-drawer] {
    touch-action: none;
    transform: translate3d(0, 100%, 0);
    transition: transform 0.5s cubic-bezier(0.32, 0.72, 0, 1);
}

[vaul-drawer][vaul-drawer-visible='true'] {
    transform: translate3d(0, var(--snap-point-height, 0), 0);
}

[vaul-overlay] {
    opacity: 0;
    transition: opacity 0.5s cubic-bezier(0.32, 0.72, 0, 1);
}

[vaul-overlay][vaul-drawer-visible='true'] {
    opacity: 1;
}

[vaul-drawer]:after {
    content: '';
    position: absolute;
    top: 100%;
    background: inherit;
    background-color: inherit;
    left: 0;
    right: 0;
    height: 200%;
}

[vaul-overlay][vaul-snap-points='true']:not([vaul-snap-points-overlay='true']):not([data-state='closed']) {
    opacity: 0;
}

[vaul-overlay][vaul-snap-points-overlay='true']:not([vaul-drawer-visible='false']) {
    opacity: 1;
}

@keyframes fake-animation {
}

@media (hover: hover) and (pointer: fine) {
    [vaul-drawer] {
        user-select: none;
    }
}

html[dir='ltr'],
[data-sonner-toaster][dir='ltr'] {
    --toast-icon-margin-start: -3px;
    --toast-icon-margin-end: 4px;
    --toast-svg-margin-start: -1px;
    --toast-svg-margin-end: 0px;
    --toast-button-margin-start: auto;
    --toast-button-margin-end: 0;
    --toast-close-button-start: 0;
    --toast-close-button-end: unset;
    --toast-close-button-transform: translate(-35%, -35%);
}

html[dir='rtl'],
[data-sonner-toaster][dir='rtl'] {
    --toast-icon-margin-start: 4px;
    --toast-icon-margin-end: -3px;
    --toast-svg-margin-start: 0px;
    --toast-svg-margin-end: -1px;
    --toast-button-margin-start: 0;
    --toast-button-margin-end: auto;
    --toast-close-button-start: unset;
    --toast-close-button-end: 0;
    --toast-close-button-transform: translate(35%, -35%);
}

[data-sonner-toaster] {
    position: fixed;
    width: var(--width);
    font-family:
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        Segoe UI,
        Roboto,
        Helvetica Neue,
        Arial,
        Noto Sans,
        sans-serif,
        Apple Color Emoji,
        Segoe UI Emoji,
        Segoe UI Symbol,
        Noto Color Emoji;
    --gray1: hsl(0, 0%, 99%);
    --gray2: hsl(0, 0%, 97.3%);
    --gray3: hsl(0, 0%, 95.1%);
    --gray4: hsl(0, 0%, 93%);
    --gray5: hsl(0, 0%, 90.9%);
    --gray6: hsl(0, 0%, 88.7%);
    --gray7: hsl(0, 0%, 85.8%);
    --gray8: hsl(0, 0%, 78%);
    --gray9: hsl(0, 0%, 56.1%);
    --gray10: hsl(0, 0%, 52.3%);
    --gray11: hsl(0, 0%, 43.5%);
    --gray12: hsl(0, 0%, 9%);
    --border-radius: 8px;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    list-style: none;
    outline: none;
    z-index: 999999999;
}

[data-sonner-toaster][data-x-position='right'] {
    right: max(var(--offset), env(safe-area-inset-right));
}

[data-sonner-toaster][data-x-position='left'] {
    left: max(var(--offset), env(safe-area-inset-left));
}

[data-sonner-toaster][data-x-position='center'] {
    left: 50%;
    transform: translate(-50%);
}

[data-sonner-toaster][data-y-position='top'] {
    top: max(var(--offset), env(safe-area-inset-top));
}

[data-sonner-toaster][data-y-position='bottom'] {
    bottom: max(var(--offset), env(safe-area-inset-bottom));
}

[data-sonner-toast] {
    --y: translateY(100%);
    --lift-amount: calc(var(--lift) * var(--gap));
    z-index: var(--z-index);
    position: absolute;
    opacity: 0;
    transform: var(--y);
    touch-action: none;
    will-change: transform, opacity, height;
    transition:
        transform 0.4s,
        opacity 0.4s,
        height 0.4s,
        box-shadow 0.2s;
    box-sizing: border-box;
    outline: none;
}

[data-sonner-toast][data-styled='true'] {
    padding: 16px;
    background: var(--normal-bg);
    border: 1px solid var(--normal-border);
    color: var(--normal-text);
    border-radius: var(--border-radius);
    box-shadow: 0 4px 12px #0000001a;
    width: var(--width);
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 6px;
}

[data-sonner-toast]:focus-visible {
    box-shadow:
        0 4px 12px #0000001a,
        0 0 0 2px #0003;
}

[data-sonner-toast][data-y-position='top'] {
    top: 0;
    --y: translateY(-100%);
    --lift: 1;
    --lift-amount: calc(1 * var(--gap));
}

[data-sonner-toast][data-y-position='bottom'] {
    bottom: 0;
    --y: translateY(100%);
    --lift: -1;
    --lift-amount: calc(var(--lift) * var(--gap));
}

[data-sonner-toast] [data-description] {
    font-weight: 400;
    line-height: 1.4;
    color: inherit;
}

[data-sonner-toast] [data-title] {
    font-weight: 500;
    line-height: 1.5;
    color: inherit;
}

[data-sonner-toast] [data-icon] {
    display: flex;
    height: 16px;
    width: 16px;
    position: relative;
    justify-content: flex-start;
    align-items: center;
    flex-shrink: 0;
    margin-left: var(--toast-icon-margin-start);
    margin-right: var(--toast-icon-margin-end);
}

[data-sonner-toast][data-promise='true'] [data-icon] > svg {
    opacity: 0;
    transform: scale(0.8);
    transform-origin: center;
    animation: sonner-fade-in 0.3s ease forwards;
}

[data-sonner-toast] [data-icon] > * {
    flex-shrink: 0;
}

[data-sonner-toast] [data-icon] svg {
    margin-left: var(--toast-svg-margin-start);
    margin-right: var(--toast-svg-margin-end);
}

[data-sonner-toast] [data-content] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

[data-sonner-toast] [data-button] {
    border-radius: 4px;
    padding-left: 8px;
    padding-right: 8px;
    height: 24px;
    font-size: 12px;
    color: var(--normal-bg);
    background: var(--normal-text);
    margin-left: var(--toast-button-margin-start);
    margin-right: var(--toast-button-margin-end);
    border: none;
    cursor: pointer;
    outline: none;
    transition:
        opacity 0.4s,
        box-shadow 0.2s;
}

[data-sonner-toast] [data-button]:focus-visible {
    box-shadow: 0 0 0 2px #0006;
}

[data-sonner-toast] [data-button]:first-of-type {
    margin-left: var(--toast-button-margin-start);
    margin-right: var(--toast-button-margin-end);
}

[data-sonner-toast] [data-cancel] {
    color: var(--color);
    background: var(--border-color);
}

[data-sonner-toast] [data-close-button] {
    position: absolute;
    left: var(--toast-close-button-start);
    right: var(--toast-close-button-end);
    top: 0;
    height: 20px;
    width: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    background: var(--gray1);
    color: var(--gray12);
    border: 1px solid var(--gray4);
    transform: var(--toast-close-button-transform);
    border-radius: 50%;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
    transition:
        opacity 0.1s,
        background 0.2s,
        border-color 0.2s;
}

[data-sonner-toast] [data-close-button]:focus-visible {
    box-shadow:
        0 4px 12px #0000001a,
        0 0 0 2px #0003;
}

[data-sonner-toast] [data-disabled='true'] {
    cursor: not-allowed;
}

[data-sonner-toast]:hover [data-close-button] {
    opacity: 1;
}

[data-sonner-toast]:focus [data-close-button] {
    opacity: 1;
}

[data-sonner-toast]:focus-within [data-close-button] {
    opacity: 1;
}

[data-sonner-toast]:hover [data-close-button]:hover {
    background: var(--gray2);
    border-color: var(--gray5);
}

[data-sonner-toast][data-swiping='true']:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
}

[data-sonner-toast][data-y-position='top'][data-swiping='true']:before {
    bottom: 50%;
    transform: scaleY(3) translateY(50%);
}

[data-sonner-toast][data-y-position='bottom'][data-swiping='true']:before {
    top: 50%;
    transform: scaleY(3) translateY(-50%);
}

[data-sonner-toast][data-swiping='false'][data-removed='true']:before {
    content: '';
    position: absolute;
    inset: 0;
    transform: scaleY(2);
}

[data-sonner-toast]:after {
    content: '';
    position: absolute;
    left: 0;
    height: calc(var(--gap) + 1px);
    bottom: 100%;
    width: 100%;
}

[data-sonner-toast][data-mounted='true'] {
    --y: translateY(0);
    opacity: 1;
}

[data-sonner-toast][data-expanded='false'][data-front='false'] {
    --scale: var(--toasts-before) * 0.05 + 1;
    --y: translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));
    height: var(--front-toast-height);
}

[data-sonner-toast] > * {
    transition: opacity 0.4s;
}

[data-sonner-toast][data-expanded='false'][data-front='false'][data-styled='true'] > * {
    opacity: 0;
}

[data-sonner-toast][data-visible='false'] {
    opacity: 0;
    pointer-events: none;
}

[data-sonner-toast][data-mounted='true'][data-expanded='true'] {
    --y: translateY(calc(var(--lift) * var(--offset)));
    height: var(--initial-height);
}

[data-sonner-toast][data-removed='true'][data-front='true'][data-swipe-out='false'] {
    --y: translateY(calc(var(--lift) * -100%));
    opacity: 0;
}

[data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='true'] {
    --y: translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));
    opacity: 0;
}

[data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='false'] {
    --y: translateY(40%);
    opacity: 0;
    transition:
        transform 0.5s,
        opacity 0.2s;
}

[data-sonner-toast][data-removed='true'][data-front='false']:before {
    height: calc(var(--initial-height) + 20%);
}

[data-sonner-toast][data-swiping='true'] {
    transform: var(--y) translateY(var(--swipe-amount, 0px));
    transition: none;
}

[data-sonner-toast][data-swipe-out='true'][data-y-position='bottom'],
[data-sonner-toast][data-swipe-out='true'][data-y-position='top'] {
    animation: swipe-out 0.2s ease-out forwards;
}

@keyframes swipe-out {
    0% {
        transform: translateY(calc(var(--lift) * var(--offset) + var(--swipe-amount)));
        opacity: 1;
    }

    to {
        transform: translateY(calc(var(--lift) * var(--offset) + var(--swipe-amount) + var(--lift) * -100%));
        opacity: 0;
    }
}

@media (max-width: 600px) {
    [data-sonner-toaster] {
        position: fixed;
        --mobile-offset: 16px;
        right: var(--mobile-offset);
        left: var(--mobile-offset);
        width: 100%;
    }

    [data-sonner-toaster] [data-sonner-toast] {
        left: 0;
        right: 0;
        width: calc(100% - 32px);
    }

    [data-sonner-toaster][data-x-position='left'] {
        left: var(--mobile-offset);
    }

    [data-sonner-toaster][data-y-position='bottom'] {
        bottom: 20px;
    }

    [data-sonner-toaster][data-y-position='top'] {
        top: 20px;
    }

    [data-sonner-toaster][data-x-position='center'] {
        left: var(--mobile-offset);
        right: var(--mobile-offset);
        transform: none;
    }
}

[data-sonner-toaster][data-theme='light'] {
    --normal-bg: #fff;
    --normal-border: var(--gray4);
    --normal-text: var(--gray12);
    --success-bg: hsl(143, 85%, 96%);
    --success-border: hsl(145, 92%, 91%);
    --success-text: hsl(140, 100%, 27%);
    --error-bg: hsl(359, 100%, 97%);
    --error-border: hsl(359, 100%, 94%);
    --error-text: hsl(360, 100%, 45%);
}

[data-sonner-toaster][data-theme='light'] [data-sonner-toast][data-invert='true'] {
    --normal-bg: #000;
    --normal-border: hsl(0, 0%, 20%);
    --normal-text: var(--gray1);
}

[data-sonner-toaster][data-theme='dark'] [data-sonner-toast][data-invert='true'] {
    --normal-bg: #fff;
    --normal-border: var(--gray3);
    --normal-text: var(--gray12);
}

[data-sonner-toaster][data-theme='dark'] {
    --normal-bg: #000;
    --normal-border: hsl(0, 0%, 20%);
    --normal-text: var(--gray1);
    --success-bg: hsl(150, 100%, 6%);
    --success-border: hsl(147, 100%, 12%);
    --success-text: hsl(150, 86%, 65%);
    --error-bg: hsl(358, 76%, 10%);
    --error-border: hsl(357, 89%, 16%);
    --error-text: hsl(358, 100%, 81%);
}

[data-rich-colors='true'] [data-sonner-toast][data-type='success'],
[data-rich-colors='true'] [data-sonner-toast][data-type='success'] [data-close-button] {
    background: var(--success-bg);
    border-color: var(--success-border);
    color: var(--success-text);
}

[data-rich-colors='true'] [data-sonner-toast][data-type='error'],
[data-rich-colors='true'] [data-sonner-toast][data-type='error'] [data-close-button] {
    background: var(--error-bg);
    border-color: var(--error-border);
    color: var(--error-text);
}

.sonner-loading-wrapper {
    --size: 16px;
    height: var(--size);
    width: var(--size);
    position: absolute;
    inset: 0;
    z-index: 10;
}

.sonner-loading-wrapper[data-visible='false'] {
    transform-origin: center;
    animation: sonner-fade-out 0.2s ease forwards;
}

.sonner-spinner {
    position: relative;
    top: 50%;
    left: 50%;
    height: var(--size);
    width: var(--size);
}

.sonner-loading-bar {
    animation: sonner-spin 1.2s linear infinite;
    background: var(--gray11);
    border-radius: 6px;
    height: 8%;
    left: -10%;
    position: absolute;
    top: -3.9%;
    width: 24%;
}

.sonner-loading-bar:nth-child(1) {
    animation-delay: -1.2s;
    transform: rotate(0.0001deg) translate(146%);
}

.sonner-loading-bar:nth-child(2) {
    animation-delay: -1.1s;
    transform: rotate(30deg) translate(146%);
}

.sonner-loading-bar:nth-child(3) {
    animation-delay: -1s;
    transform: rotate(60deg) translate(146%);
}

.sonner-loading-bar:nth-child(4) {
    animation-delay: -0.9s;
    transform: rotate(90deg) translate(146%);
}

.sonner-loading-bar:nth-child(5) {
    animation-delay: -0.8s;
    transform: rotate(120deg) translate(146%);
}

.sonner-loading-bar:nth-child(6) {
    animation-delay: -0.7s;
    transform: rotate(150deg) translate(146%);
}

.sonner-loading-bar:nth-child(7) {
    animation-delay: -0.6s;
    transform: rotate(180deg) translate(146%);
}

.sonner-loading-bar:nth-child(8) {
    animation-delay: -0.5s;
    transform: rotate(210deg) translate(146%);
}

.sonner-loading-bar:nth-child(9) {
    animation-delay: -0.4s;
    transform: rotate(240deg) translate(146%);
}

.sonner-loading-bar:nth-child(10) {
    animation-delay: -0.3s;
    transform: rotate(270deg) translate(146%);
}

.sonner-loading-bar:nth-child(11) {
    animation-delay: -0.2s;
    transform: rotate(300deg) translate(146%);
}

.sonner-loading-bar:nth-child(12) {
    animation-delay: -0.1s;
    transform: rotate(330deg) translate(146%);
}

@keyframes sonner-fade-in {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes sonner-fade-out {
    0% {
        opacity: 1;
        transform: scale(1);
    }

    to {
        opacity: 0;
        transform: scale(0.8);
    }
}

@keyframes sonner-spin {
    0% {
        opacity: 1;
    }

    to {
        opacity: 0.15;
    }
}

@media (prefers-reduced-motion) {
    [data-sonner-toast],
    [data-sonner-toast] > *,
    .sonner-loading-bar {
        transition: none !important;
        animation: none !important;
    }
}

div.jsx-280077750 {
    width: 100%;
    margin: 0 auto;
    padding: 0 0;
    overflow: hidden;
}

div.jsx-280077750:after {
    content: '';
    display: table;
    clear: both;
}

@media screen and (max-width: 960px) {
    div.jsx-280077750 {
        padding: 0 0;
    }
}

@media screen and (max-width: 640px) {
    div.jsx-280077750 {
        padding: 0 0;
    }
}

[vaul-drawer] {
    touch-action: none;
    transform: translate3d(0, 100%, 0);
    transition: transform 0.5s cubic-bezier(0.32, 0.72, 0, 1);
}

[vaul-drawer][vaul-drawer-visible='true'] {
    transform: translate3d(0, var(--snap-point-height, 0), 0);
}

[vaul-overlay] {
    opacity: 0;
    transition: opacity 0.5s cubic-bezier(0.32, 0.72, 0, 1);
}

[vaul-overlay][vaul-drawer-visible='true'] {
    opacity: 1;
}

[vaul-drawer]:after {
    content: '';
    position: absolute;
    top: 100%;
    background: inherit;
    background-color: inherit;
    left: 0;
    right: 0;
    height: 200%;
}

[vaul-overlay][vaul-snap-points='true']:not([vaul-snap-points-overlay='true']):not([data-state='closed']) {
    opacity: 0;
}

[vaul-overlay][vaul-snap-points-overlay='true']:not([vaul-drawer-visible='false']) {
    opacity: 1;
}

@keyframes fake-animation {
}

@media (hover: hover) and (pointer: fine) {
    [vaul-drawer] {
        user-select: none;
    }
}

html[dir='ltr'],
[data-sonner-toaster][dir='ltr'] {
    --toast-icon-margin-start: -3px;
    --toast-icon-margin-end: 4px;
    --toast-svg-margin-start: -1px;
    --toast-svg-margin-end: 0px;
    --toast-button-margin-start: auto;
    --toast-button-margin-end: 0;
    --toast-close-button-start: 0;
    --toast-close-button-end: unset;
    --toast-close-button-transform: translate(-35%, -35%);
}

html[dir='rtl'],
[data-sonner-toaster][dir='rtl'] {
    --toast-icon-margin-start: 4px;
    --toast-icon-margin-end: -3px;
    --toast-svg-margin-start: 0px;
    --toast-svg-margin-end: -1px;
    --toast-button-margin-start: 0;
    --toast-button-margin-end: auto;
    --toast-close-button-start: unset;
    --toast-close-button-end: 0;
    --toast-close-button-transform: translate(35%, -35%);
}

[data-sonner-toaster] {
    position: fixed;
    width: var(--width);
    font-family:
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        Segoe UI,
        Roboto,
        Helvetica Neue,
        Arial,
        Noto Sans,
        sans-serif,
        Apple Color Emoji,
        Segoe UI Emoji,
        Segoe UI Symbol,
        Noto Color Emoji;
    --gray1: hsl(0, 0%, 99%);
    --gray2: hsl(0, 0%, 97.3%);
    --gray3: hsl(0, 0%, 95.1%);
    --gray4: hsl(0, 0%, 93%);
    --gray5: hsl(0, 0%, 90.9%);
    --gray6: hsl(0, 0%, 88.7%);
    --gray7: hsl(0, 0%, 85.8%);
    --gray8: hsl(0, 0%, 78%);
    --gray9: hsl(0, 0%, 56.1%);
    --gray10: hsl(0, 0%, 52.3%);
    --gray11: hsl(0, 0%, 43.5%);
    --gray12: hsl(0, 0%, 9%);
    --border-radius: 8px;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    list-style: none;
    outline: none;
    z-index: 999999999;
}

[data-sonner-toaster][data-x-position='right'] {
    right: max(var(--offset), env(safe-area-inset-right));
}

[data-sonner-toaster][data-x-position='left'] {
    left: max(var(--offset), env(safe-area-inset-left));
}

[data-sonner-toaster][data-x-position='center'] {
    left: 50%;
    transform: translate(-50%);
}

[data-sonner-toaster][data-y-position='top'] {
    top: max(var(--offset), env(safe-area-inset-top));
}

[data-sonner-toaster][data-y-position='bottom'] {
    bottom: max(var(--offset), env(safe-area-inset-bottom));
}

[data-sonner-toast] {
    --y: translateY(100%);
    --lift-amount: calc(var(--lift) * var(--gap));
    z-index: var(--z-index);
    position: absolute;
    opacity: 0;
    transform: var(--y);
    touch-action: none;
    will-change: transform, opacity, height;
    transition:
        transform 0.4s,
        opacity 0.4s,
        height 0.4s,
        box-shadow 0.2s;
    box-sizing: border-box;
    outline: none;
}

[data-sonner-toast][data-styled='true'] {
    padding: 16px;
    background: var(--normal-bg);
    border: 1px solid var(--normal-border);
    color: var(--normal-text);
    border-radius: var(--border-radius);
    box-shadow: 0 4px 12px #0000001a;
    width: var(--width);
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 6px;
}

[data-sonner-toast]:focus-visible {
    box-shadow:
        0 4px 12px #0000001a,
        0 0 0 2px #0003;
}

[data-sonner-toast][data-y-position='top'] {
    top: 0;
    --y: translateY(-100%);
    --lift: 1;
    --lift-amount: calc(1 * var(--gap));
}

[data-sonner-toast][data-y-position='bottom'] {
    bottom: 0;
    --y: translateY(100%);
    --lift: -1;
    --lift-amount: calc(var(--lift) * var(--gap));
}

[data-sonner-toast] [data-description] {
    font-weight: 400;
    line-height: 1.4;
    color: inherit;
}

[data-sonner-toast] [data-title] {
    font-weight: 500;
    line-height: 1.5;
    color: inherit;
}

[data-sonner-toast] [data-icon] {
    display: flex;
    height: 16px;
    width: 16px;
    position: relative;
    justify-content: flex-start;
    align-items: center;
    flex-shrink: 0;
    margin-left: var(--toast-icon-margin-start);
    margin-right: var(--toast-icon-margin-end);
}

[data-sonner-toast][data-promise='true'] [data-icon] > svg {
    opacity: 0;
    transform: scale(0.8);
    transform-origin: center;
    animation: sonner-fade-in 0.3s ease forwards;
}

[data-sonner-toast] [data-icon] > * {
    flex-shrink: 0;
}

[data-sonner-toast] [data-icon] svg {
    margin-left: var(--toast-svg-margin-start);
    margin-right: var(--toast-svg-margin-end);
}

[data-sonner-toast] [data-content] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

[data-sonner-toast] [data-button] {
    border-radius: 4px;
    padding-left: 8px;
    padding-right: 8px;
    height: 24px;
    font-size: 12px;
    color: var(--normal-bg);
    background: var(--normal-text);
    margin-left: var(--toast-button-margin-start);
    margin-right: var(--toast-button-margin-end);
    border: none;
    cursor: pointer;
    outline: none;
    transition:
        opacity 0.4s,
        box-shadow 0.2s;
}

[data-sonner-toast] [data-button]:focus-visible {
    box-shadow: 0 0 0 2px #0006;
}

[data-sonner-toast] [data-button]:first-of-type {
    margin-left: var(--toast-button-margin-start);
    margin-right: var(--toast-button-margin-end);
}

[data-sonner-toast] [data-cancel] {
    color: var(--color);
    background: var(--border-color);
}

[data-sonner-toast] [data-close-button] {
    position: absolute;
    left: var(--toast-close-button-start);
    right: var(--toast-close-button-end);
    top: 0;
    height: 20px;
    width: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    background: var(--gray1);
    color: var(--gray12);
    border: 1px solid var(--gray4);
    transform: var(--toast-close-button-transform);
    border-radius: 50%;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
    transition:
        opacity 0.1s,
        background 0.2s,
        border-color 0.2s;
}

[data-sonner-toast] [data-close-button]:focus-visible {
    box-shadow:
        0 4px 12px #0000001a,
        0 0 0 2px #0003;
}

[data-sonner-toast] [data-disabled='true'] {
    cursor: not-allowed;
}

[data-sonner-toast]:hover [data-close-button] {
    opacity: 1;
}

[data-sonner-toast]:focus [data-close-button] {
    opacity: 1;
}

[data-sonner-toast]:focus-within [data-close-button] {
    opacity: 1;
}

[data-sonner-toast]:hover [data-close-button]:hover {
    background: var(--gray2);
    border-color: var(--gray5);
}

[data-sonner-toast][data-swiping='true']:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
}

[data-sonner-toast][data-y-position='top'][data-swiping='true']:before {
    bottom: 50%;
    transform: scaleY(3) translateY(50%);
}

[data-sonner-toast][data-y-position='bottom'][data-swiping='true']:before {
    top: 50%;
    transform: scaleY(3) translateY(-50%);
}

[data-sonner-toast][data-swiping='false'][data-removed='true']:before {
    content: '';
    position: absolute;
    inset: 0;
    transform: scaleY(2);
}

[data-sonner-toast]:after {
    content: '';
    position: absolute;
    left: 0;
    height: calc(var(--gap) + 1px);
    bottom: 100%;
    width: 100%;
}

[data-sonner-toast][data-mounted='true'] {
    --y: translateY(0);
    opacity: 1;
}

[data-sonner-toast][data-expanded='false'][data-front='false'] {
    --scale: var(--toasts-before) * 0.05 + 1;
    --y: translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));
    height: var(--front-toast-height);
}

[data-sonner-toast] > * {
    transition: opacity 0.4s;
}

[data-sonner-toast][data-expanded='false'][data-front='false'][data-styled='true'] > * {
    opacity: 0;
}

[data-sonner-toast][data-visible='false'] {
    opacity: 0;
    pointer-events: none;
}

[data-sonner-toast][data-mounted='true'][data-expanded='true'] {
    --y: translateY(calc(var(--lift) * var(--offset)));
    height: var(--initial-height);
}

[data-sonner-toast][data-removed='true'][data-front='true'][data-swipe-out='false'] {
    --y: translateY(calc(var(--lift) * -100%));
    opacity: 0;
}

[data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='true'] {
    --y: translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));
    opacity: 0;
}

[data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='false'] {
    --y: translateY(40%);
    opacity: 0;
    transition:
        transform 0.5s,
        opacity 0.2s;
}

[data-sonner-toast][data-removed='true'][data-front='false']:before {
    height: calc(var(--initial-height) + 20%);
}

[data-sonner-toast][data-swiping='true'] {
    transform: var(--y) translateY(var(--swipe-amount, 0px));
    transition: none;
}

[data-sonner-toast][data-swipe-out='true'][data-y-position='bottom'],
[data-sonner-toast][data-swipe-out='true'][data-y-position='top'] {
    animation: swipe-out 0.2s ease-out forwards;
}

@keyframes swipe-out {
    0% {
        transform: translateY(calc(var(--lift) * var(--offset) + var(--swipe-amount)));
        opacity: 1;
    }

    to {
        transform: translateY(calc(var(--lift) * var(--offset) + var(--swipe-amount) + var(--lift) * -100%));
        opacity: 0;
    }
}

@media (max-width: 600px) {
    [data-sonner-toaster] {
        position: fixed;
        --mobile-offset: 16px;
        right: var(--mobile-offset);
        left: var(--mobile-offset);
        width: 100%;
    }

    [data-sonner-toaster] [data-sonner-toast] {
        left: 0;
        right: 0;
        width: calc(100% - 32px);
    }

    [data-sonner-toaster][data-x-position='left'] {
        left: var(--mobile-offset);
    }

    [data-sonner-toaster][data-y-position='bottom'] {
        bottom: 20px;
    }

    [data-sonner-toaster][data-y-position='top'] {
        top: 20px;
    }

    [data-sonner-toaster][data-x-position='center'] {
        left: var(--mobile-offset);
        right: var(--mobile-offset);
        transform: none;
    }
}

[data-sonner-toaster][data-theme='light'] {
    --normal-bg: #fff;
    --normal-border: var(--gray4);
    --normal-text: var(--gray12);
    --success-bg: hsl(143, 85%, 96%);
    --success-border: hsl(145, 92%, 91%);
    --success-text: hsl(140, 100%, 27%);
    --error-bg: hsl(359, 100%, 97%);
    --error-border: hsl(359, 100%, 94%);
    --error-text: hsl(360, 100%, 45%);
}

[data-sonner-toaster][data-theme='light'] [data-sonner-toast][data-invert='true'] {
    --normal-bg: #000;
    --normal-border: hsl(0, 0%, 20%);
    --normal-text: var(--gray1);
}

[data-sonner-toaster][data-theme='dark'] [data-sonner-toast][data-invert='true'] {
    --normal-bg: #fff;
    --normal-border: var(--gray3);
    --normal-text: var(--gray12);
}

[data-sonner-toaster][data-theme='dark'] {
    --normal-bg: #000;
    --normal-border: hsl(0, 0%, 20%);
    --normal-text: var(--gray1);
    --success-bg: hsl(150, 100%, 6%);
    --success-border: hsl(147, 100%, 12%);
    --success-text: hsl(150, 86%, 65%);
    --error-bg: hsl(358, 76%, 10%);
    --error-border: hsl(357, 89%, 16%);
    --error-text: hsl(358, 100%, 81%);
}

[data-rich-colors='true'] [data-sonner-toast][data-type='success'],
[data-rich-colors='true'] [data-sonner-toast][data-type='success'] [data-close-button] {
    background: var(--success-bg);
    border-color: var(--success-border);
    color: var(--success-text);
}

[data-rich-colors='true'] [data-sonner-toast][data-type='error'],
[data-rich-colors='true'] [data-sonner-toast][data-type='error'] [data-close-button] {
    background: var(--error-bg);
    border-color: var(--error-border);
    color: var(--error-text);
}

.sonner-loading-wrapper {
    --size: 16px;
    height: var(--size);
    width: var(--size);
    position: absolute;
    inset: 0;
    z-index: 10;
}

.sonner-loading-wrapper[data-visible='false'] {
    transform-origin: center;
    animation: sonner-fade-out 0.2s ease forwards;
}

.sonner-spinner {
    position: relative;
    top: 50%;
    left: 50%;
    height: var(--size);
    width: var(--size);
}

.sonner-loading-bar {
    animation: sonner-spin 1.2s linear infinite;
    background: var(--gray11);
    border-radius: 6px;
    height: 8%;
    left: -10%;
    position: absolute;
    top: -3.9%;
    width: 24%;
}

.sonner-loading-bar:nth-child(1) {
    animation-delay: -1.2s;
    transform: rotate(0.0001deg) translate(146%);
}

.sonner-loading-bar:nth-child(2) {
    animation-delay: -1.1s;
    transform: rotate(30deg) translate(146%);
}

.sonner-loading-bar:nth-child(3) {
    animation-delay: -1s;
    transform: rotate(60deg) translate(146%);
}

.sonner-loading-bar:nth-child(4) {
    animation-delay: -0.9s;
    transform: rotate(90deg) translate(146%);
}

.sonner-loading-bar:nth-child(5) {
    animation-delay: -0.8s;
    transform: rotate(120deg) translate(146%);
}

.sonner-loading-bar:nth-child(6) {
    animation-delay: -0.7s;
    transform: rotate(150deg) translate(146%);
}

.sonner-loading-bar:nth-child(7) {
    animation-delay: -0.6s;
    transform: rotate(180deg) translate(146%);
}

.sonner-loading-bar:nth-child(8) {
    animation-delay: -0.5s;
    transform: rotate(210deg) translate(146%);
}

.sonner-loading-bar:nth-child(9) {
    animation-delay: -0.4s;
    transform: rotate(240deg) translate(146%);
}

.sonner-loading-bar:nth-child(10) {
    animation-delay: -0.3s;
    transform: rotate(270deg) translate(146%);
}

.sonner-loading-bar:nth-child(11) {
    animation-delay: -0.2s;
    transform: rotate(300deg) translate(146%);
}

.sonner-loading-bar:nth-child(12) {
    animation-delay: -0.1s;
    transform: rotate(330deg) translate(146%);
}

@keyframes sonner-fade-in {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes sonner-fade-out {
    0% {
        opacity: 1;
        transform: scale(1);
    }

    to {
        opacity: 0;
        transform: scale(0.8);
    }
}

@keyframes sonner-spin {
    0% {
        opacity: 1;
    }

    to {
        opacity: 0.15;
    }
}

@media (prefers-reduced-motion) {
    [data-sonner-toast],
    [data-sonner-toast] > *,
    .sonner-loading-bar {
        transition: none !important;
        animation: none !important;
    }
}

div.jsx-280077750 {
    width: 100%;
    margin: 0 auto;
    padding: 0 0;
    overflow: hidden;
}

div.jsx-280077750:after {
    content: '';
    display: table;
    clear: both;
}

@media screen and (max-width: 960px) {
    div.jsx-280077750 {
        padding: 0 0;
    }
}

@media screen and (max-width: 640px) {
    div.jsx-280077750 {
        padding: 0 0;
    }
}

@media (max-width: 768px) {
    .outer-container {
        width: 85% !important;
        margin: 0 auto !important;
    }
}

/* ---------------------------------------------------------------------------
   "JavaScript is required" notice.

   There was no rule for `.noscript-message` at all, so with scripting off the
   block inherited whatever the surrounding page happened to set — centred,
   unpadded, sometimes white-on-white. It is a real card now, and since it only
   ever renders inside <noscript> it can be styled freely without affecting the
   scripted page.
   --------------------------------------------------------------------------- */
.tf-noscript,
.noscript-message {
    display: flex;
    gap: 14px;
    width: 100%;
    max-width: 620px;
    margin: 24px auto;
    padding: 20px;
    box-sizing: border-box;
    background: #0a0a0a;
    border: 1px solid hsla(0, 0%, 100%, 0.12);
    /* Amber left edge: this is a "you need to do something" notice, not an error. */
    border-left: 3px solid #f5d984;
    border-radius: 12px;
    text-align: left;
    font-family: inherit;
    color: #a1a1a1;
}

.tf-noscript-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(245, 217, 132, 0.24);
    border-radius: 9px;
    background: rgba(245, 217, 132, 0.08);
    color: #f5d984;
}

.tf-noscript-icon svg {
    width: 18px;
    height: 18px;
}

.tf-noscript-body {
    flex: 1 1 auto;
    min-width: 0;
}

.tf-noscript h2,
.noscript-message h2 {
    margin: 0 0 6px;
    font-size: 1.0625rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.35;
    color: #ededed;
}

.tf-noscript p,
.noscript-message p {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.6;
    color: #a1a1a1;
}

/* Per-browser instructions. A plain list — no <details>, because the whole
   point is that the reader can see the fix without interacting. */
.tf-noscript-how {
    list-style: none;
    margin: 14px 0 0;
    padding: 14px 0 0;
    border-top: 1px solid hsla(0, 0%, 100%, 0.12);
    font-size: 0.8125rem;
    line-height: 1.55;
    color: #a1a1a1;
}

.tf-noscript-how li {
    margin: 0 0 8px;
}

.tf-noscript-how li:last-child {
    margin-bottom: 0;
}

.tf-noscript-how b {
    color: #ededed;
    font-weight: 600;
}

.tf-noscript-how code {
    padding: 1px 5px;
    background: hsla(0, 0%, 100%, 0.06);
    border-radius: 4px;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.9em;
    color: #ededed;
}

.tf-noscript-note {
    margin-top: 12px !important;
    font-size: 0.8125rem !important;
    color: #7d7d7d !important;
}

.tf-noscript-note b {
    color: #a1a1a1;
    font-weight: 500;
}

@media (max-width: 520px) {
    .tf-noscript,
    .noscript-message {
        padding: 16px;
        gap: 12px;
    }

    .tf-noscript-icon {
        width: 28px;
        height: 28px;
    }
}

/* ---------------------------------------------------------------------------
   Cookie consent widget.

   Same surface, border, radius and button treatment as the rest of TraceFind:
   near-black panel, 1px hairline border, white primary / ghost secondary.
   The strip is inset on both sides so neither the trigger nor the expanded
   panel can ever push the page into horizontal scroll on a narrow screen.
   --------------------------------------------------------------------------- */
.cookie-consent {
    position: fixed;
    bottom: 20px;
    left: 20px;
    right: 20px;
    z-index: 1000;
    display: flex;
    justify-content: flex-end;
    font-family: inherit;
    opacity: 0;
    transition:
        opacity 0.25s ease,
        transform 0.25s ease;

    /* The strip spans the viewport, so only its children may take clicks. */
    pointer-events: none;
}

.cookie-consent > * {
    pointer-events: auto;
}

.cookie-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 36px;
    padding: 0 12px;
    background: rgba(10, 10, 10, 0.85);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border: 1px solid hsla(0, 0%, 100%, 0.12);
    border-radius: 8px;
    color: #a1a1a1;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        color 0.15s ease;
}

.cookie-button:hover,
.cookie-button.expanded {
    background: #0a0a0a;
    border-color: hsla(0, 0%, 100%, 0.24);
    color: #ededed;
}

.cookie-glyph {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
}

.cookie-icon {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    opacity: 0.7;
    transition: transform 0.2s ease;
}

.cookie-button.expanded .cookie-icon {
    transform: rotate(180deg);
}

.cookie-panel {
    position: absolute;
    bottom: calc(100% + 8px);
    right: 0;
    width: 320px;
    max-width: 100%;
    padding: 16px;
    background: #0a0a0a;
    border: 1px solid hsla(0, 0%, 100%, 0.12);
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.6);
    text-align: left;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition:
        opacity 0.18s ease,
        transform 0.18s ease,
        visibility 0.18s;
}

.cookie-panel.expanded {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.cookie-panel h3 {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.005em;
    color: #ededed;
}

.cookie-panel p {
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.5;
    color: #a1a1a1;
}

.cookie-actions {
    display: flex;
    gap: 8px;
}

.cookie-btn {
    flex: 1 1 0;
    min-width: 0;
    height: 34px;
    padding: 0 12px;
    border: none;
    border-radius: 6px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    transition:
        background 0.15s ease,
        color 0.15s ease,
        box-shadow 0.15s ease;
}

.cookie-btn.accept {
    background: #ededed;
    color: #0a0a0a;
}

.cookie-btn.accept:hover {
    background: #cccccc;
}

.cookie-btn.decline {
    background: transparent;
    color: #ededed;
    box-shadow: 0 0 0 1px hsla(0, 0%, 100%, 0.14);
}

.cookie-btn.decline:hover {
    background: hsla(0, 0%, 100%, 0.06);
    box-shadow: 0 0 0 1px hsla(0, 0%, 100%, 0.24);
}

.cookie-btn:focus-visible,
.cookie-button:focus-visible {
    outline: none;
    box-shadow:
        0 0 0 2px #0a0a0a,
        0 0 0 4px hsla(0, 0%, 100%, 0.4);
}

@media (max-width: 480px) {
    .cookie-consent {
        bottom: 16px;
        left: 16px;
        right: 16px;
    }
}

.hidden {
    display: none !important;
}

.shake {
    animation: shake 0.5s;
}

@keyframes shake {
    0% {
        transform: translateX(0);
    }
    20% {
        transform: translateX(-5px);
    }
    40% {
        transform: translateX(5px);
    }
    60% {
        transform: translateX(-5px);
    }
    80% {
        transform: translateX(5px);
    }
    100% {
        transform: translateX(0);
    }
}

/* Phones: collapse the cookie pill to its icon and tuck it into the corner,
   so it no longer sits on top of CTAs or pricing text. The panel still opens
   upward from it with the full text and both choices. */
@media (max-width: 600px) {
    .cookie-consent {
        bottom: 12px;
        right: 12px;
        left: 12px;
    }

    .cookie-button {
        width: 40px;
        height: 40px;
        padding: 0;
    }

    .cookie-button > span,
    .cookie-button > .cookie-icon {
        display: none;
    }

    .cookie-glyph {
        width: 18px;
        height: 18px;
    }
}

/* "Visit now!" / "See list" card links: 44px touch targets. */
.rounded-xl a.text-blue-500 {
    min-height: 44px;
}

/* Small phones: a smaller hero title keeps the "Start Now" button near the fold. */
@media (max-width: 420px) {
    h1.intro_title__TZuNV {
        font-size: 38px;
    }
}

/* Second line of the lookup pages' h1 (email/phone/username): the keyword
   phrase in body size under the big gradient title. */
.tf-h1-sub {
    display: block;
    margin-top: 14px;
    background: none;
    -webkit-text-fill-color: currentColor;
    color: #a1a1a1;
    font-size: clamp(15px, 1.6vw, 18px);
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0;
}

/* Read by screen readers and search engines, not shown (canvas page h1). */
.tf-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* Phones: the page hero (title + search box) is as tall as its content.
   Its 720px desktop minimum left ~250px of empty black between the search
   box and the rest of the page on the email, phone and username pages. */
@media (max-width: 760px) {
    .intro_root__wSBQl {
        min-height: 0;
        padding-bottom: 32px;
    }
}

/* No page scrolls sideways, including the ones without css/footer.css
   (account, bulk, canvas, admin). Clip on the root: it does not create a
   nested scroll box, so sticky headers and momentum scrolling keep working.
   overscroll-behavior-x stops the sideways rubber-band on iOS when a strip
   that scrolls on its own (the account tabs) hits its end. */
html {
    overflow-x: clip;
    overscroll-behavior-x: none;
}

/* Footer: every column left-aligned on phones too ("Join the Community"
   was centred while the others were left-aligned). */
.footer6_social-icons_link-list,
.footer6_social-icons_link-list .footer6_column-heading {
    text-align: left;
    align-items: flex-start;
}

/* Lookup pages (email/username/phone): the line under the search box and the
   error line. Quiet, body weight, one consistent gap below the terms row. */
.tf-search-hint {
    max-width: 440px;
    margin: 14px auto 0;
    color: #8f8f8f;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
}

.tf-search-hint a {
    color: #ededed;
    text-decoration: underline;
    text-decoration-color: hsla(0, 0%, 100%, 0.35);
    text-underline-offset: 3px;
}

.tf-search-hint a:hover {
    text-decoration-color: currentColor;
}

.tf-search-error {
    margin: 10px auto 0;
    color: #f87171;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
}

.tf-search-error:empty {
    display: none;
}

/* Lookup pages: the results bar ("143 results (45.3 seconds) [date]").
   It is rewritten every 100ms while a search runs. Its card used to size
   itself to that text, so on a phone it grew and shrank with every tick and
   the date jumped between lines. Now the card fills its column without its
   text counting towards the column's width, digits are fixed-width, and on a
   phone the date always sits on its own line. */
#introduction {
    width: 0 !important;
    min-width: 100%;
    box-sizing: border-box;
}

#result_amount {
    font-variant-numeric: tabular-nums;
}

@media (max-width: 600px) {
    #result_amount {
        display: grid !important;
        grid-template-columns: auto auto;
        justify-content: start;
        align-items: center;
        column-gap: 6px;
        row-gap: 6px;
    }

    #result_amount #loadtime {
        grid-column: 1 / -1;
        justify-self: start;
    }
}

/* Placeholder cards while a search runs and no result card has landed yet:
   the email and username result grid (js/tf-cards.js, in the grid's own
   columns) and the phone page's cards before their checks answer. */
.tf-skel-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 236px), 1fr));
    gap: 14px;
}

.tf-skel-grid[hidden] {
    display: none;
}

.tf-skel {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 18px;
    border: 1px solid #27272a;
    border-radius: 12px;
    background: #0c0c0e;
}

.tf-skel.tf-skel-bare {
    padding: 0;
    border: 0;
    background: none;
}

.tf-skel-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.tf-skel-logo,
.tf-skel-line {
    display: block;
    border-radius: 6px;
    background: linear-gradient(90deg, #1c1c20 0%, #2a2a30 50%, #1c1c20 100%);
    background-size: 200% 100%;
    animation: tf-skel-shine 1.4s ease-in-out infinite;
}

.tf-skel-logo {
    flex: none;
    width: 28px;
    height: 28px;
    border-radius: 8px;
}

.tf-skel-line {
    height: 10px;
}

.tf-skel-head .tf-skel-line {
    height: 14px;
}

.tf-skel-line.w40 { width: 40%; }
.tf-skel-line.w55 { width: 55%; }
.tf-skel-line.w70 { width: 70%; }
.tf-skel-line.w90 { width: 90%; }

/* Phones: two placeholders say "loading" just as well and keep the rail and
   the first real card close to the search box. */
@media (max-width: 600px) {
    .tf-skel-grid .tf-skel:nth-child(n + 3) {
        display: none;
    }
}

@keyframes tf-skel-shine {
    from { background-position: 100% 0; }
    to { background-position: -100% 0; }
}

@media (prefers-reduced-motion: reduce) {
    .tf-skel-logo,
    .tf-skel-line {
        animation: none;
    }
}