.rs-claymorphism-studio {
    --rs-purple: #e86843;
    --rs-violet: #ff8a5b;
    --rs-lime: #ffe1d2;
    --rs-blue: #318f83;
    --rs-ink: #433a36;
    --rs-muted: #75655e;
    --rs-paper: #f7ebdd;
    --rs-line: rgba(67, 58, 54, .1);
    --rs-soft: #f2dfd0;
    --rs-font: Nunito, Inter, system-ui, sans-serif;
    color: var(--rs-ink);
    background: linear-gradient(145deg, #fff5eb, #f7ebdd);
}

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

.rs-claymorphism-studio .rs-component-browser,
.rs-claymorphism-studio .rs-workbench,
.rs-claymorphism-studio .rs-code-dock {
    border: 3px solid rgba(255, 255, 255, .68);
    background: #fff7f0;
    box-shadow: inset -10px -10px 24px rgba(111, 79, 64, .07), inset 10px 10px 24px rgba(255, 255, 255, .68), 0 18px 38px rgba(111, 79, 64, .17);
}

.rs-claymorphism-studio .rs-component-browser,
.rs-claymorphism-studio .rs-workbench {
    border-radius: 38px;
}

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

.rs-claymorphism-studio .rs-style-control-panel,
.rs-claymorphism-studio .rs-component-option-panel,
.rs-claymorphism-studio .rs-preview-toolbar {
    background: #fff7f0;
    border-color: rgba(111, 79, 64, .1);
}

.rs-claymorphism-studio .rs-preset-group,
.rs-claymorphism-studio .rs-device-options {
    padding: 5px;
    background: #f3dfd1;
    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 24px;
    box-shadow: inset 4px 4px 9px rgba(111, 79, 64, .12), inset -4px -4px 9px rgba(255, 255, 255, .7);
}

.rs-claymorphism-studio .rs-preset,
.rs-claymorphism-studio .rs-device-button,
.rs-claymorphism-studio .rs-category-tab,
.rs-claymorphism-studio .rs-component-browser .rs-component-tab,
.rs-claymorphism-studio .rs-icon-button,
.rs-claymorphism-studio .rs-component-carousel-button,
.rs-claymorphism-studio .rs-component-search,
.rs-claymorphism-studio .rs-component-select,
.rs-claymorphism-studio .rs-color-input {
    color: #5f4f48;
    background: #fff7f0;
    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 22px;
    box-shadow: inset -4px -4px 10px rgba(111, 79, 64, .07), inset 4px 4px 10px rgba(255, 255, 255, .7), 0 7px 14px rgba(111, 79, 64, .14);
}

.rs-claymorphism-studio .rs-preset.is-active,
.rs-claymorphism-studio .rs-device-button.is-active,
.rs-claymorphism-studio .rs-category-tab.is-active,
.rs-claymorphism-studio .rs-component-browser .rs-component-tab.is-active {
    color: #2f2926;
    background: #ff8a5b;
    border-color: rgba(255, 255, 255, .76);
    box-shadow: inset -5px -5px 10px rgba(111, 79, 64, .12), inset 5px 5px 10px rgba(255, 255, 255, .38), 0 5px 10px rgba(111, 79, 64, .18);
}

.rs-claymorphism-studio .rs-component-browser .rs-component-tab:hover,
.rs-claymorphism-studio .rs-category-tab:hover {
    color: #433a36;
    background: #ffe3d7;
    transform: translateY(-2px) scale(1.01);
}

.rs-claymorphism-studio .rs-range {
    --range-track: #f0d8c9;
    --range-fill: #ff8a5b;
    height: 14px;
}

.rs-claymorphism-studio .rs-range::-webkit-slider-thumb,
.rs-claymorphism-studio .rs-range::-moz-range-thumb {
    background: #ff8a5b;
    border: 3px solid #fff7f0;
    box-shadow: inset -3px -3px 7px rgba(111, 79, 64, .14), inset 3px 3px 7px rgba(255, 255, 255, .42), 0 5px 10px rgba(111, 79, 64, .2);
}

.rs-claymorphism-studio .rs-bg-clay-peach {
    background: linear-gradient(135deg, #fff3e8 0 38%, #ffad8c 38% 70%, #7dd3c7 70%);
}

.rs-claymorphism-studio .rs-bg-clay-mint {
    background: linear-gradient(135deg, #f4fff8 0 38%, #79d7c3 38% 70%, #ff92c6 70%);
}

.rs-claymorphism-studio .rs-bg-clay-pop {
    background: linear-gradient(135deg, #fff6cb 0 38%, #ff9966 38% 70%, #5c8bff 70%);
}

.rs-claymorphism-studio .rs-preview-stage[data-background="clay-peach"] {
    background: radial-gradient(circle at 22% 24%, #ffcaad 0 11%, transparent 12%), radial-gradient(circle at 80% 72%, #75d7c9 0 16%, transparent 17%), linear-gradient(145deg, #fff4e9, #f6dccb);
}

.rs-claymorphism-studio .rs-preview-stage[data-background="clay-mint"] {
    background: radial-gradient(circle at 72% 20%, #ff8ec2 0 12%, transparent 13%), radial-gradient(circle at 20% 78%, #6fd7c3 0 17%, transparent 18%), linear-gradient(145deg, #effcf5, #d7f0e4);
}

.rs-claymorphism-studio .rs-preview-stage[data-background="clay-pop"] {
    background: radial-gradient(circle at 20% 23%, #ff9a66 0 13%, transparent 14%), radial-gradient(circle at 82% 72%, #5c8bff 0 18%, transparent 19%), linear-gradient(145deg, #fff6ce, #ffe4a1);
}

.rs-claymorphism-studio .rs-code-dock {
    color: #433a36;
    background: rgba(255, 247, 240, .98);
    border-radius: 34px 34px 0 0;
}

.rs-claymorphism-studio .rs-code-block {
    color: #433a36;
    background: #fffaf6;
    border: 2px solid rgba(255, 255, 255, .8);
    border-radius: 22px;
    box-shadow: inset 4px 4px 11px rgba(111, 79, 64, .09), inset -4px -4px 11px rgba(255, 255, 255, .78);
}

.rs-claymorphism-studio .rs-copy-button {
    color: #2f2926;
    background: #ff8a5b;
    border-color: #ff8a5b;
    border-radius: 16px;
}

.rs-claymorphism-studio .rs-download-button,
.rs-claymorphism-studio .rs-output-toggle {
    color: #5f4f48;
    background: #fff7f0;
    border: 2px solid rgba(255, 255, 255, .72);
    border-radius: 16px;
    box-shadow: 0 5px 12px rgba(111, 79, 64, .13);
}

.rs-claymorphism-studio :is(button, input, select, textarea, a):focus-visible {
    outline-color: #9e3219;
}

@media (max-width: 599px) {
    .rs-claymorphism-studio .rs-component-browser,
    .rs-claymorphism-studio .rs-workbench {
        border-radius: 24px;
        box-shadow: 0 10px 24px rgba(111, 79, 64, .14);
    }
}

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