@layer components{.how-stage{padding-block:5rem}.how-static{flex-direction:column;gap:3rem;margin-top:3rem;display:flex}.how-pinned-steps,.how-pinned-widget{display:none}@media (min-width:1024px) and (min-height:700px) and (prefers-reduced-motion:no-preference){.how-stage{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:4rem;min-height:100svh;padding-block:1.5rem;display:grid}.how-static{display:none}.how-pinned-steps{margin-top:2rem;display:block}.how-pinned-widget{display:grid}}}
@layer components{.calc-range{appearance:none;cursor:pointer;background:0 0;width:100%;height:44px;margin:0;display:block}.calc-range::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--color-accent-inverse) var(--pct,0%), var(--color-inverse-raised) var(--pct,0%));border-radius:9999px;height:8px}.calc-range::-moz-range-track{background:linear-gradient(to right, var(--color-accent-inverse) var(--pct,0%), var(--color-inverse-raised) var(--pct,0%));border-radius:9999px;height:8px}.calc-range::-webkit-slider-thumb{appearance:none;border:3px solid var(--color-surface-inverse);background-color:var(--color-inverse);width:24px;height:24px;box-shadow:0 0 0 1px var(--color-inverse-border);border-radius:9999px;margin-top:-8px;transition:transform .15s ease-out}.calc-range::-moz-range-thumb{border:3px solid var(--color-surface-inverse);background-color:var(--color-inverse);width:18px;height:18px;box-shadow:0 0 0 1px var(--color-inverse-border);border-radius:9999px}.calc-range:hover::-webkit-slider-thumb{transform:scale(1.12)}.calc-range:active::-webkit-slider-thumb{transform:scale(1.12)}.calc-range:focus-visible{box-shadow:none;outline:none}.calc-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--color-surface-inverse), 0 0 0 4px var(--color-accent-inverse)}.calc-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 2px var(--color-surface-inverse), 0 0 0 4px var(--color-accent-inverse)}@media (prefers-reduced-motion:reduce){.calc-range::-webkit-slider-thumb{transition:none}}}
@layer components{.sektor-ilerleme{transform-origin:0;animation:sektor-ilerle var(--sektor-sure,5s) linear forwards}.sektor-ilerleme[data-paused=true]{animation-play-state:paused}@keyframes sektor-ilerle{0%{transform:scaleX(0)}to{transform:scaleX(1)}}}
