/* Approved cream rim component for icon holders and numbered steps. */
.site-icon-rim,
.clarity .result-project .site-icon-rim,
.calculator-form-heading>.site-icon-rim,
.reading-main .legal-section>div:first-child>.site-icon-rim,
.workflow-step:is(.is-active,.is-complete) .site-icon-rim{
 --rim-size:40px;--rim-radius:12px;--rim-glyph:23px;
 position:relative;isolation:isolate;display:inline-grid;place-items:center;flex:none;
 width:var(--rim-size);height:var(--rim-size);padding:0;line-height:1;
 border:1px solid #D8D2C5;border-radius:var(--rim-radius);color:var(--flame);
 background:linear-gradient(180deg,#FCFBF7,#E7E3D9);
 box-shadow:inset 0 1px 0 #FFFFFF24,0 1px 0 #C5BDAE,0 3px 4px #28211616;
}
.site-icon-rim::before{content:"";position:absolute;left:20%;right:20%;top:0;height:1px;background:linear-gradient(90deg,transparent,#FFFFFFED,transparent);pointer-events:none}
.site-icon-rim>.app-icon,.site-icon-rim>i{font-size:var(--rim-glyph);line-height:1;margin:0;color:inherit}
.clarity .result-project .rim-project{font-size:23px;-webkit-text-stroke:.2px currentColor}
.workflow-step .rim-step,.workflow-step:is(.is-active,.is-complete) .rim-step{--rim-size:34px;--rim-radius:50%;font-size:12px;font-weight:600}
.workflow-step.is-active .rim-step{border-color:#E0BFA5;box-shadow:inset 0 1px 0 #FFFFFF24,0 1px 0 #C5BDAE,0 3px 4px #28211616,0 0 0 3px #EF6D2810}
.calculator-form-heading>.rim-calculator{--rim-size:42px}
.reading-main .legal-section>div:first-child>.rim-legal{--rim-size:36px;--rim-radius:11px;font-size:12px;font-weight:500}
.site-icon-rim.rim-instruction{--rim-radius:50%;font-size:13px;font-weight:600}
.site-icon-rim.rim-feature{--rim-size:44px;--rim-glyph:23px;--rim-radius:13px}
.site-icon-rim.rim-inline{--rim-size:24px;--rim-glyph:15px;--rim-radius:7px;margin-top:1px;box-shadow:inset 0 1px 0 #FFFFFF24,0 1px 0 #C5BDAE,0 2px 3px #28211610}
@media(max-width:1000px){.clarity .result-project .rim-project{--rim-size:34px;--rim-radius:10px;font-size:22px}}
@media(max-width:360px){.clarity .result-project .rim-project{--rim-size:28px;--rim-radius:8px;font-size:20px}}

/* The active numeral lifts once as the walkthrough reaches its step. */
.workflow-step .step-number{display:block;transform-origin:50% 70%;font-weight:700}
.workflow-step.is-active .rim-step{border-color:var(--flame);background:linear-gradient(180deg,#FEF6F1,#FBD5BA);box-shadow:inset 0 1px 0 #fff9,0 1px 0 #D9AB8C,0 3px 4px #28211616,0 0 0 4px #EF6D2812}
.workflow-step.is-active .step-number{animation:step-number-lift .65s cubic-bezier(.2,.7,.25,1) both;color:var(--ink)}
@keyframes step-number-lift{0%{transform:translateY(0) scale(1)}35%{transform:translateY(-3px) scale(1.2) rotate(-6deg)}65%{transform:translateY(1px) scale(1.08) rotate(3deg)}100%{transform:translateY(0) scale(1.12)}}
@media(prefers-reduced-motion:reduce){.workflow-step.is-active .step-number{animation:none;transform:none}}