/* Creafy: a clean canvas, terracotta light, and the mark's open corners. */
:root{--paper:#fcfcfb;--ink:#20201e;--accent:#c85e32;--accent-dark:#ad4621}
body{background:var(--paper)}
.hero .lead{color:#696963}.prompt-box{border-color:#e7e7e1;background:#fff;box-shadow:0 12px 40px -26px #472c1c44}.example-choices button[aria-pressed=true]{background:#f7e4d9;color:#a24423}
.scene-light{inset:65px -5px 55px;overflow:hidden;border-radius:44% 44% 38% 38%;background:radial-gradient(ellipse at 50% 65%,#f5e4d7 0%,#fcfcfb00 68%);pointer-events:none}
.creafy-ribbon{position:absolute;width:590px;height:350px;border-radius:50%;border:46px solid #d16b3b;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-38deg);opacity:.16;animation:creafy-drift 20s ease-in-out infinite;animation-play-state:paused;box-sizing:border-box}
.ribbon-two{width:520px;height:320px;border-width:24px;border-color:#e39b67;animation-name:creafy-drift-counter;animation-duration:26s;opacity:.21}
.store-scene[data-motion-active=true] .creafy-ribbon{animation-play-state:running}
@keyframes creafy-drift{0%,100%{transform:translate(-50%,-50%) rotate(-38deg) scale(.96)}50%{transform:translate(-49%,-44%) rotate(-21deg) scale(1.06)}}
@keyframes creafy-drift-counter{0%,100%{transform:translate(-50%,-42%) rotate(42deg)}50%{transform:translate(-50%,-52%) rotate(26deg) scale(1.06)}}
.growth{background:var(--paper)}.growth-intro>p:last-child{color:#696963}.growth-steps>button[aria-selected=true]{background:#f8ece5}.growth-stage{background:#f3f2ef}.growth-state{background:#fff}.growth-review button,.growth-close button{background:var(--accent-dark)}
.growth-steps>button>.creafy-step-icon{display:grid;place-items:center;width:38px;height:38px;padding:0;flex:none;color:#b8532b}
.growth-steps .creafy-step-icon svg{width:32px;height:32px;margin:0;opacity:1;transform:none;transition:transform .35s var(--ease)}
.growth-steps>button[aria-selected=true] .creafy-step-icon svg{transform:translateY(-1px)}
.growth-steps>button>div{flex:1}.growth-steps>button>svg{flex:none}
@media(max-width:640px){.scene-light{inset:60px -12px 70px}.creafy-ribbon{width:440px;height:300px;border-width:35px}.ribbon-two{width:400px;height:270px;border-width:20px}.growth-steps>button>.creafy-step-icon{width:30px;height:30px}.growth-steps .creafy-step-icon svg{width:28px;height:28px}}
@media(prefers-reduced-motion:reduce){.creafy-ribbon{animation:none!important}.growth-steps .creafy-step-icon svg{transition:none}}