/* ROrRaka Lilac Play / color revision approved 2026-10-09. Brand artwork retains its original colors. */
:root{--rr-brand:#6a41cc;--rr-brand-hover:#51319e;--rr-mint:#68c7b4;--rr-mint-soft:#cfffe5;--rr-cream:#fbf3e6;--rr-peach:#ffdcc7;--rr-page:#fcfaff;--rr-text:#3e2c65;--rr-text-muted:#716184;--rr-border:#d9cbed;--rr-positive:#06754e;--rr-deal:#bc2871;--rr-shadow-card:0 5px 0 #e0d3ef,0 12px 22px #4136640a;--pop-lilac:#dac6ff;--pop-lime:#bdfa72;--pop-purple:#6a41cc;--pop-mint:#bdfa72;--pop-peach:#dac6ff;--pop-shadow:#6a41cc;--ink:#3e2c65;--muted:#716184;--teal:#6a41cc;--deep:#6a41cc;--mint:#f0e9ff;--page:#fcfaff;--card:#ffffff;--border:#d9cbed;--coral:#bc2871;--shadow:var(--rr-shadow-card)}
body.rr-playroom{background:#e8dcff;color:var(--rr-text)}
.rr-playroom :is(button,a,input,select,summary):focus-visible{outline:3px solid #6a41cc;outline-offset:4px}
.rr-playroom :is(.button.primary,.btn.primary),.rr-landing .button:not(.secondary){background:linear-gradient(145deg,#d1ff9b,#bdfa72);color:#3e2c65;border:2px solid #eee3ff;box-shadow:inset 0 2px 1px #ecffd9,inset 0 -3px 1px #9ad457,0 5px 0 #685087;border-radius:19px;font-weight:800;transition:transform .16s,box-shadow .16s}
.rr-playroom :is(.button.primary,.btn.primary):active,.rr-landing .button:not(.secondary):active{transform:translateY(4px);box-shadow:inset 0 2px 1px #ecffd9,0 1px 0 #685087}
.rr-playroom :is(.button.outline,.button.soft,.button.secondary){background:#eae1f8;border:1px solid #9b83bd;color:#6a41cc;box-shadow:inset 0 2px 0 #fff,0 3px 0 #b5a6ca;border-radius:17px;font-weight:700}
.rr-playroom :is(.product-card,.detail-product,.chart-card,.settings-card,.flow-card,.profile-card,.notification-card,.store-card,.step-card,.guide-card){border:1px solid #ded2ef;border-radius:24px;background:var(--card);box-shadow:var(--rr-shadow-card)}
.rr-playroom .sale-sticker{color:#6b2882;background:#efd4ff;border:1px solid #faecff;box-shadow:0 3px 0 #c3a0d9;border-radius:9px;font-weight:800}
.rr-playroom .discount{background:#cfffe5;color:#6a41cc;border-radius:9px;font-weight:800}
.rr-playroom .price-line strong{color:var(--coral)}
.rr-playroom :is(input:not([type=checkbox]):not([type=range]),select){color:var(--ink);background:var(--card)}
.rr-playroom dialog{color:var(--ink);background:var(--page);border:2px solid #b093da;border-radius:28px;box-shadow:0 8px 0 #6a41cc,0 25px 80px #3e2c6555}
.rr-playroom dialog::backdrop{background:#3e2c6580;backdrop-filter:blur(5px)}
.rr-playroom .pop-reply{font-size:12px;line-height:1.5;font-weight:700;color:#3b1f54;background:#eee3ff;border:1px solid #cdacea;border-radius:15px 15px 5px 15px;padding:10px 13px;box-shadow:0 3px 0 #8445bb30}
@keyframes pop-enter{0%{opacity:0;transform:translateY(12px) scale(.97)}75%{transform:translateY(-2px) scale(1)}100%{opacity:1;transform:none}}
@keyframes pop-press{50%{transform:translateY(3px) rotate(-2deg)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.rr-playroom *, .rr-playroom *:before,.rr-playroom *:after{animation:none!important;transition:none!important}}
.motion-off *, .motion-off *:before,.motion-off *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.page-hidden *,.offscreen *{animation-play-state:paused!important}

/* Lilac Play roles: lilac surfaces, purple structure, lime accents, mint status. */
.rr-playroom .discount{background:#cfffe5;color:#075a40}
.rr-playroom :is(.button.primary,.btn.primary),.rr-landing .button:not(.secondary){border-color:#e5ffc8}
.rr-playroom .pop-reply{background:#f1e8ff;color:#3e2c65;border-color:#cab4ef;box-shadow:0 3px 0 #bba3d530}
