.rs-result-showcase{--rs-accent:#7552cf;min-width:0;border:1px solid #e4ddef;border-radius:20px;padding:18px;background:#fff;box-shadow:0 15px 45px #45276b10;margin:16px 0 28px;color:#19243c}.rs-result-showcase *{box-sizing:border-box}.rs-result-showcase h2{font-size:clamp(24px,3vw,34px);line-height:1.15;margin:5px 0 10px}.rs-result-showcase p{font-size:14px;line-height:1.6;color:#65728a}.rs-result-showcase .rs-example-top{display:flex;justify-content:space-between;gap:12px;font:600 10px/1.5 system-ui;letter-spacing:1px;margin-bottom:12px;color:#73618c}.rs-result-frame{position:relative;aspect-ratio:1;max-height:490px;overflow:hidden;border-radius:12px;background:repeating-conic-gradient(#e7e8ef 0% 25%,#fff 0% 50%) 50%/20px 20px}.rs-result-frame img,.rs-result-frame canvas{display:block;width:100%;height:100%;object-fit:contain}.rs-result-frame .rs-result-after{position:absolute;inset:0;clip-path:inset(0 0 0 50%);background:repeating-conic-gradient(#e7e8ef 0% 25%,#fff 0% 50%) 50%/20px 20px}.rs-result-divider{position:absolute;left:50%;top:0;bottom:0;width:2px;background:white;pointer-events:none}.rs-result-divider b{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#6543c6;box-shadow:0 2px 10px #0004}.rs-result-tag{position:absolute;top:12px;background:#18223acc;color:white;border-radius:20px;padding:4px 9px;font:11px/1.5 system-ui}.rs-result-tag:first-of-type{left:10px}.rs-result-tag.rs-right{right:10px;left:auto}.rs-result-showcase label{display:block;font:12px/1.6 system-ui;margin:12px 0 3px}.rs-result-showcase input[type=range]{display:block;width:100%;accent-color:var(--rs-accent);min-height:24px}.rs-result-showcase input:focus-visible{outline:3px solid #ba9cf4;outline-offset:3px}.rs-result-showcase .rs-result-note{font:11px/1.5 system-ui;color:#758097;margin:5px 0}.rs-result-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}.rs-result-copy a{display:inline-block;background:var(--rs-accent);color:white;text-decoration:none;border-radius:9px;padding:11px 17px;font-weight:600;margin-top:8px}.rs-result-copy small{display:block;color:#778094;font-size:12px;margin-top:12px}@media(max-width:760px){.rs-result-grid{grid-template-columns:1fr;gap:18px}.rs-result-showcase{padding:14px}.rs-result-frame{max-height:none}}.rs-result-copy a{background:#7552cf!important;color:#fff!important}.rs-result-copy h2{color:inherit}.rs-result-copy{padding:12px 0}

/* The showcase is a white card, but it also appears on the dark studio pages
   (body.rs-visual-studio), whose theme sets light text with !important. Without
   these, the slider label and note render almost invisibly on white. */
.rs-result-showcase h2,.rs-result-showcase h3,.rs-result-showcase strong,
body.rs-visual-studio .rs-result-showcase h2,body.rs-visual-studio .rs-result-showcase h3,body.rs-visual-studio .rs-result-showcase strong{color:#19243c!important}
.rs-result-showcase label,body.rs-visual-studio .rs-result-showcase label{color:#3b4763!important}
body.rs-visual-studio .rs-result-showcase summary{color:#28324c!important}
.rs-result-showcase p,.rs-result-showcase li{color:#5a6781!important}
.rs-result-showcase .rs-result-note{color:#5f6a80!important}
.rs-result-showcase .rs-example-top{color:#5c4a78!important}
.rs-result-showcase summary{color:#28324c!important}