.rs-neumorphism-studio {
    --rs-purple: #5d78e8;
    --rs-violet: #6f8cff;
    --rs-lime: #dfe7ff;
    --rs-blue: #526cce;
    --rs-ink: #344054;
    --rs-muted: #667085;
    --rs-paper: #e9eef5;
    --rs-line: rgba(74, 85, 104, .08);
    --rs-soft: #e2e8f0;
    --rs-font: Inter, system-ui, sans-serif;
    color: var(--rs-ink);
    background: #e9eef5;
}

.rs-neumorphism-studio .rs-section-kicker,
.rs-neumorphism-studio .rs-panel-kicker,
.rs-neumorphism-studio .rs-component-browser .rs-component-tab > span,
.rs-neumorphism-studio .rs-component-browser .rs-component-tab small {
    color: #526cce;
}

.rs-neumorphism-studio .rs-component-browser,
.rs-neumorphism-studio .rs-workbench,
.rs-neumorphism-studio .rs-code-dock {
    border-color: rgba(74, 85, 104, .06);
    background: #e9eef5;
    box-shadow: -12px -12px 28px rgba(255, 255, 255, .92), 12px 12px 28px rgba(75, 89, 112, .18);
}

.rs-neumorphism-studio .rs-component-browser,
.rs-neumorphism-studio .rs-workbench {
    border-radius: 28px;
}

.rs-neumorphism-studio .rs-workbench {
    overflow: clip;
}

.rs-neumorphism-studio .rs-style-control-panel,
.rs-neumorphism-studio .rs-component-option-panel,
.rs-neumorphism-studio .rs-preview-toolbar {
    background: #e9eef5;
    border-color: rgba(74, 85, 104, .08);
}

.rs-neumorphism-studio .rs-preset-group,
.rs-neumorphism-studio .rs-device-options {
    background: #e9eef5;
    border-radius: 18px;
    box-shadow: inset 5px 5px 11px rgba(75, 89, 112, .16), inset -5px -5px 11px rgba(255, 255, 255, .9);
}

.rs-neumorphism-studio .rs-preset,
.rs-neumorphism-studio .rs-device-button,
.rs-neumorphism-studio .rs-category-tab,
.rs-neumorphism-studio .rs-component-browser .rs-component-tab,
.rs-neumorphism-studio .rs-icon-button,
.rs-neumorphism-studio .rs-component-carousel-button,
.rs-neumorphism-studio .rs-component-search,
.rs-neumorphism-studio .rs-component-select,
.rs-neumorphism-studio .rs-color-input {
    color: #4a5568;
    background: #e9eef5;
    border-color: transparent;
    border-radius: 16px;
    box-shadow: -5px -5px 12px rgba(255, 255, 255, .9), 5px 5px 12px rgba(75, 89, 112, .16);
}

.rs-neumorphism-studio .rs-preset.is-active,
.rs-neumorphism-studio .rs-device-button.is-active,
.rs-neumorphism-studio .rs-category-tab.is-active,
.rs-neumorphism-studio .rs-component-browser .rs-component-tab.is-active {
    color: #526cce;
    background: #e9eef5;
    box-shadow: inset 4px 4px 9px rgba(75, 89, 112, .17), inset -4px -4px 9px rgba(255, 255, 255, .92);
}

.rs-neumorphism-studio .rs-component-browser .rs-component-tab:hover,
.rs-neumorphism-studio .rs-category-tab:hover {
    color: #526cce;
    background: #edf2f8;
    transform: translateY(-1px);
}

.rs-neumorphism-studio .rs-range {
    --range-track: #d8dfe9;
    --range-fill: #6f8cff;
    filter: drop-shadow(1px 2px 2px rgba(75, 89, 112, .16));
}

.rs-neumorphism-studio .rs-range::-webkit-slider-thumb,
.rs-neumorphism-studio .rs-range::-moz-range-thumb {
    background: #e9eef5;
    border-color: #6f8cff;
    box-shadow: -3px -3px 7px rgba(255, 255, 255, .92), 3px 3px 7px rgba(75, 89, 112, .22);
}

.rs-neumorphism-studio .rs-bg-neu-cloud {
    background: linear-gradient(135deg, #f7faff 0 48%, #e8edf4 48% 73%, #cbd5e2 73%);
}

.rs-neumorphism-studio .rs-bg-neu-sand {
    background: linear-gradient(135deg, #fff8eb 0 46%, #eee3d2 46% 72%, #ccbca5 72%);
}

.rs-neumorphism-studio .rs-bg-neu-slate {
    background: linear-gradient(135deg, #e9eef6 0 45%, #c8d2df 45% 72%, #8492a8 72%);
}

.rs-neumorphism-studio .rs-preview-stage[data-background="neu-cloud"] {
    background: radial-gradient(circle at 23% 23%, #ffffff 0 4%, transparent 30%), linear-gradient(145deg, #eef3fa, #dfe6ef);
}

.rs-neumorphism-studio .rs-preview-stage[data-background="neu-sand"] {
    background: radial-gradient(circle at 76% 18%, rgba(255, 255, 255, .82), transparent 28%), linear-gradient(145deg, #f4ecdf, #e5d8c4);
}

.rs-neumorphism-studio .rs-preview-stage[data-background="neu-slate"] {
    background: radial-gradient(circle at 18% 76%, rgba(255, 255, 255, .48), transparent 34%), linear-gradient(145deg, #dce4ee, #b8c4d3);
}

.rs-neumorphism-studio .rs-code-dock {
    color: #344054;
    background: rgba(233, 238, 245, .98);
    border-radius: 26px 26px 0 0;
}

.rs-neumorphism-studio .rs-code-block {
    color: #344054;
    background: #e9eef5;
    border-color: transparent;
    box-shadow: inset 7px 7px 16px rgba(75, 89, 112, .15), inset -7px -7px 16px rgba(255, 255, 255, .9);
}

.rs-neumorphism-studio .rs-copy-button {
    background: #5d78e8;
    border-color: #5d78e8;
}

.rs-neumorphism-studio .rs-download-button,
.rs-neumorphism-studio .rs-output-toggle {
    color: #4a5568;
    background: #e9eef5;
    border-color: transparent;
    box-shadow: -4px -4px 9px rgba(255, 255, 255, .9), 4px 4px 9px rgba(75, 89, 112, .16);
}

.rs-neumorphism-studio :is(button, input, select, textarea, a):focus-visible {
    outline-color: #3856d6;
}

@media (max-width: 599px) {
    .rs-guide-secondary-link {
        width: auto;
        max-width: 100%;
        white-space: normal;
    }

    .rs-guide-secondary-link .rs-arrow {
        flex: 0 0 auto;
    }

    .rs-neumorphism-studio .rs-component-browser,
    .rs-neumorphism-studio .rs-workbench {
        border-radius: 20px;
        box-shadow: -7px -7px 18px rgba(255, 255, 255, .9), 7px 7px 18px rgba(75, 89, 112, .15);
    }
}

@media (prefers-reduced-motion: reduce) {
    .rs-neumorphism-studio *,
    .rs-neumorphism-studio *::before,
    .rs-neumorphism-studio *::after {
        transition-duration: .01ms !important;
    }
}
