html.asl-lock-scroll,
body.asl-lock-scroll {
    overflow: hidden !important;
}

.asl-loader {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    background: var(--asl-bg, #f7f3ec);
    opacity: 1;
    visibility: visible;
    transition: opacity var(--asl-fade, 320ms) ease, visibility var(--asl-fade, 320ms) ease;
    overflow: hidden;
    font-family: Arial, sans-serif;
}

.asl-loader.asl-is-hiding {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.asl-screen {
    min-height: 100%;
    width: 100%;
}

.asl-shell {
    width: min(1180px, calc(100% - 48px));
    margin: 0 auto;
}

.asl-block {
    position: relative;
    display: block;
    overflow: hidden;
    background: var(--asl-base, #e7e0d6);
    border-radius: 8px;
}

.asl-animation-shimmer .asl-block::after,
.asl-animation-shimmer .asl-brand-mark::after,
.asl-animation-shimmer .asl-mini-logo::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-110%);
    background: linear-gradient(90deg, transparent, var(--asl-highlight, #fffaf2), transparent);
    animation: asl-shimmer var(--asl-speed, 1.35s) infinite;
}

.asl-animation-pulse .asl-block,
.asl-animation-pulse .asl-brand-mark,
.asl-animation-pulse .asl-mini-logo {
    animation: asl-pulse var(--asl-speed, 1.35s) ease-in-out infinite;
}

.asl-animation-wave .asl-block,
.asl-animation-wave .asl-brand-mark,
.asl-animation-wave .asl-mini-logo {
    animation: asl-wave var(--asl-speed, 1.35s) ease-in-out infinite alternate;
}

@keyframes asl-shimmer {
    100% { transform: translateX(110%); }
}

@keyframes asl-pulse {
    0%, 100% { opacity: .52; }
    50% { opacity: 1; }
}

@keyframes asl-wave {
    from { filter: brightness(.94); transform: translateY(0); }
    to { filter: brightness(1.06); transform: translateY(-2px); }
}

.asl-line { height: 13px; margin: 12px 0; }
.asl-title { height: 30px; border-radius: 9px; }
.asl-kicker { height: 10px; }
.asl-price { background: color-mix(in srgb, var(--asl-accent) 55%, var(--asl-base)); }

.asl-w-18 { width: 18%; }
.asl-w-22 { width: 22%; }
.asl-w-28 { width: 28%; }
.asl-w-32 { width: 32%; }
.asl-w-35 { width: 35%; }
.asl-w-36 { width: 36%; }
.asl-w-40 { width: 40%; }
.asl-w-42 { width: 42%; }
.asl-w-48 { width: 48%; }
.asl-w-55 { width: 55%; }
.asl-w-60 { width: 60%; }
.asl-w-62 { width: 62%; }
.asl-w-65 { width: 65%; }
.asl-w-68 { width: 68%; }
.asl-w-70 { width: 70%; }
.asl-w-72 { width: 72%; }
.asl-w-78 { width: 78%; }
.asl-w-80 { width: 80%; }
.asl-w-82 { width: 82%; }
.asl-w-85 { width: 85%; }
.asl-w-90 { width: 90%; }
.asl-w-94 { width: 94%; }
.asl-w-100 { width: 100%; }

.asl-header {
    height: 78px;
    display: flex;
    align-items: center;
    gap: 34px;
    border-bottom: 1px solid color-mix(in srgb, var(--asl-base) 70%, transparent);
}

.asl-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-right: auto;
}

.asl-brand-mark,
.asl-mini-logo {
    position: relative;
    overflow: hidden;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: var(--asl-accent, #ef7d16);
}

.asl-brand-name { width: 110px; height: 18px; margin: 0; }
.asl-nav { display: flex; gap: 20px; align-items: center; }
.asl-nav-item { width: 62px; height: 11px; margin: 0; }
.asl-button { height: 42px; border-radius: 999px; margin: 0; }
.asl-header-button { width: 132px; background: color-mix(in srgb, var(--asl-accent) 74%, var(--asl-base)); }

.asl-hero {
    min-height: calc(100vh - 78px);
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 70px;
    align-items: center;
}

.asl-hero-copy .asl-title { height: 48px; margin: 16px 0; }
.asl-buttons { display: flex; gap: 14px; margin-top: 30px; }
.asl-media { min-height: 190px; border-radius: 20px; }
.asl-hero-media { height: 62vh; min-height: 420px; }

.asl-section-heading {
    padding: 72px 0 34px;
    display: grid;
    justify-items: center;
    text-align: center;
}
.asl-section-heading .asl-line { margin-left: auto; margin-right: auto; }

.asl-grid {
    display: grid;
    gap: 24px;
}
.asl-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.asl-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.asl-card,
.asl-stat {
    padding: 16px;
    border-radius: 18px;
    background: color-mix(in srgb, var(--asl-highlight) 56%, transparent);
    border: 1px solid color-mix(in srgb, var(--asl-base) 64%, transparent);
}
.asl-card-media { height: 220px; margin-bottom: 18px; }
.asl-product-media { height: 225px; margin-bottom: 18px; }

.asl-shop-head {
    padding: 62px 0 34px;
    display: flex;
    justify-content: space-between;
    align-items: end;
}
.asl-shop-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 34px;
}
.asl-filter {
    padding: 20px;
    border-radius: 18px;
    background: color-mix(in srgb, var(--asl-highlight) 60%, transparent);
    align-self: start;
}

.asl-article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 60px;
    padding: 62px 0;
}
.asl-article-cover { height: 390px; margin: 34px 0; }
.asl-aside-media { height: 200px; margin-bottom: 20px; }

.asl-dashboard {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 250px 1fr;
}
.asl-sidebar {
    padding: 34px 24px;
    background: color-mix(in srgb, var(--asl-base) 62%, transparent);
}
.asl-dashboard main { padding: 38px; }
.asl-dashboard-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 34px;
}
.asl-stat { min-height: 126px; }
.asl-chart { height: 48vh; margin-top: 28px; }

.asl-minimal-wrap {
    min-height: 100vh;
    display: grid;
    place-content: center;
    justify-items: center;
}
.asl-minimal-wrap .asl-line { margin-left: auto; margin-right: auto; }
.asl-mini-logo { width: 58px; height: 58px; border-radius: 16px; margin-bottom: 20px; }

.asl-sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 900px) {
    .asl-shell { width: min(100% - 28px, 700px); }
    .asl-nav { display: none; }
    .asl-header { height: 66px; }
    .asl-header-button { width: 90px; height: 36px; }
    .asl-hero {
        min-height: calc(100vh - 66px);
        grid-template-columns: 1fr;
        gap: 28px;
        padding: 46px 0;
    }
    .asl-hero-copy .asl-title { height: 34px; }
    .asl-hero-media { height: 34vh; min-height: 250px; }
    .asl-grid-3, .asl-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .asl-shop-layout { grid-template-columns: 1fr; }
    .asl-filter { display: none; }
    .asl-article { grid-template-columns: 1fr; }
    .asl-article aside { display: none; }
    .asl-dashboard { grid-template-columns: 1fr; }
    .asl-sidebar { display: none; }
}

@media (max-width: 560px) {
    .asl-shell { width: calc(100% - 22px); }
    .asl-grid-3, .asl-grid-4 { grid-template-columns: 1fr 1fr; gap: 12px; }
    .asl-card { padding: 10px; border-radius: 12px; }
    .asl-product-media, .asl-card-media { height: 138px; border-radius: 12px; }
    .asl-shop-head { padding-top: 32px; }
    .asl-shop-head .asl-button { display: none; }
    .asl-title { height: 22px; }
    .asl-line { height: 10px; margin: 9px 0; }
    .asl-header-button { display: none; }
    .asl-brand-name { width: 86px; }
}

@media (prefers-reduced-motion: reduce) {
    .asl-loader *,
    .asl-loader *::before,
    .asl-loader *::after {
        animation: none !important;
        transition-duration: 0.01ms !important;
    }
}