.storefront-account-page {
    --account-ink: #19212a;
    --account-muted: #65717c;
    --account-line: rgba(111, 131, 144, .18);
    color: var(--account-ink);
    background: #f4f6f7;
}
.storefront-account-page main { min-height: calc(100vh - 160px); }
.storefront-account-page .store-account,
.storefront-account-page .store-account-auth { color: var(--account-ink); }
.storefront-account-page .eyebrow { color: #64717d; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.storefront-account-page .eyebrow span { margin: 0 7px; color: #a0abb2; }
.storefront-account-page .store-account { max-width: 1260px; padding-top: clamp(42px, 6vw, 78px); padding-bottom: clamp(72px, 9vw, 124px); }
.storefront-account-page .account-head,
.storefront-account-page .account-section,
.storefront-account-page .account-tabs,
.storefront-account-page .store-account-form-wrap,
.storefront-account-page .account-alert {
    border: 1px solid rgba(255, 255, 255, .86);
    background: linear-gradient(155deg, rgba(255, 255, 255, .88), rgba(255, 255, 255, .58));
    box-shadow: 0 28px 70px rgba(45, 61, 74, .09), 0 3px 14px rgba(57, 76, 92, .035), inset 0 1px 0 rgba(255, 255, 255, .98);
    backdrop-filter: blur(28px) saturate(155%);
    -webkit-backdrop-filter: blur(28px) saturate(155%);
}
.storefront-account-page .account-head {
    position: relative;
    overflow: hidden;
    align-items: center;
    min-height: 235px;
    padding: clamp(30px, 5vw, 56px);
    border-radius: 34px;
}
.storefront-account-page .account-head::before {
    content: "";
    position: absolute;
    top: -105px;
    right: -55px;
    width: 330px;
    height: 330px;
    border: 1px solid rgba(255, 255, 255, .57);
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .7), rgba(182, 218, 225, .22) 54%, transparent 72%);
    box-shadow: inset 0 0 42px rgba(255, 255, 255, .52);
    pointer-events: none;
}
.storefront-account-page .account-head > * { position: relative; }
.storefront-account-page .account-head .eyebrow { margin-bottom: 17px; }
.storefront-account-page .account-head h1 { font-size: clamp(42px, 5.5vw, 66px); line-height: 1.02; letter-spacing: -.06em; }
.storefront-account-page .account-head h1 span { display: inline-block; margin-left: .14em; color: #424d57; }
.storefront-account-page .account-head-subtitle { max-width: 500px; margin-top: 17px; color: #5d6974; font-size: 15px; }
.storefront-account-page .account-text-button {
    min-height: 42px;
    padding: 0 19px;
    border: 1px solid rgba(255, 255, 255, .9);
    border-radius: 999px;
    background: rgba(255, 255, 255, .64);
    box-shadow: 0 8px 24px rgba(52, 71, 83, .06), inset 0 1px 0 #fff;
    color: #303b45;
    text-decoration: none;
    font-size: 12px;
    font-weight: 750;
}
.storefront-account-page .account-text-button:hover { background: #fff; }
.storefront-account-page .account-body { grid-template-columns: 192px minmax(0, 1fr); gap: clamp(20px, 3vw, 36px); margin-top: 24px; }
.storefront-account-page .account-tabs {
    top: 100px;
    gap: 7px;
    padding: 15px;
    border-radius: 24px;
}
.storefront-account-page .account-tabs a {
    min-height: 43px;
    padding: 12px 15px;
    border: 0;
    border-radius: 13px;
    color: #65717c;
    font-size: 12px;
    font-weight: 750;
}
.storefront-account-page .account-tabs a:hover,
.storefront-account-page .account-tabs a:focus-visible { background: rgba(224, 237, 242, .7); color: #19212a; }
.storefront-account-page .account-main { display: grid; gap: 20px; }
.storefront-account-page .account-section { scroll-margin-top: 100px; padding: clamp(24px, 3.2vw, 38px); border-radius: 28px; }
.storefront-account-page .account-section-head { align-items: end; margin-bottom: 24px; }
.storefront-account-page .account-section-kicker { margin: 0 0 7px; color: #73808b; font-size: 10px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.storefront-account-page .account-section-head h2 { color: #1a222b; font-size: clamp(26px, 2.7vw, 32px); letter-spacing: -.045em; }
.storefront-account-page .account-section-head .text-link { display: inline-flex; align-items: center; gap: 9px; color: #303d48; font-size: 12px; font-weight: 750; text-decoration: none; text-transform: none; }
.storefront-account-page .account-section-head .text-link span { font-size: 17px; font-weight: 500; }
.storefront-account-page .account-order {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(200px, .7fr);
    gap: 24px;
    margin-top: 14px;
    padding: clamp(20px, 3vw, 28px);
    border: 1px solid rgba(255, 255, 255, .94);
    border-radius: 22px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .8), rgba(234, 244, 245, .49));
    box-shadow: 0 10px 30px rgba(50, 72, 82, .055), inset 0 1px 0 #fff;
}
.storefront-account-page .account-order > div { display: block; min-width: 0; }
.storefront-account-page .account-order > div:last-child { text-align: left; }
.storefront-account-page .account-order-kicker,
.storefront-account-page .account-order-summary-label { display: block; margin: 0 0 9px; color: #72808b; font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.storefront-account-page .account-order h3 { margin: 0 0 6px; font-size: 25px; font-weight: 780; letter-spacing: -.045em; line-height: 1.1; }
.storefront-account-page .account-order-main > span { display: block; color: #65717c; font-size: 12px; }
.storefront-account-page .account-order-link { display: inline-flex; align-items: center; gap: 9px; min-height: 36px; margin-top: 17px; padding: 0 14px; border: 1px solid #25313a; border-radius: 999px; background: linear-gradient(145deg, #34414c, #172028); color: #fff; font-size: 11px; font-weight: 780; box-shadow: 0 10px 20px rgba(27, 40, 50, .13), inset 0 1px 0 rgba(255, 255, 255, .18); }
.storefront-account-page .account-order-link:hover { background: #34414c; }
.storefront-account-page .account-order-link span { color: #fff; font-size: 16px; }
.storefront-account-page .account-order-summary { align-self: center; }
.storefront-account-page .account-order-stage { display: block; margin-bottom: 14px; color: #19242d!important; font-size: 18px; font-weight: 780; line-height: 1.25; }
.storefront-account-page .account-order-progress { width: 100%; height: 8px; margin: 0 0 7px; border-radius: 999px; accent-color: #3c9b6f; }
.storefront-account-page .account-order-progress::-webkit-progress-bar { background: rgba(106, 134, 145, .18); border-radius: 999px; }
.storefront-account-page .account-order-progress::-webkit-progress-value { background: linear-gradient(90deg, #75c89b, #3b9b6e); border-radius: 999px; }
.storefront-account-page .account-order-progress::-moz-progress-bar { background: linear-gradient(90deg, #75c89b, #3b9b6e); border-radius: 999px; }
.storefront-account-page .account-order-stage-count { color: #65717c; font-size: 11px; font-weight: 700; }
.storefront-account-page .account-empty { padding: 22px; border: 1px solid rgba(255, 255, 255, .9); border-radius: 18px; background: rgba(255, 255, 255, .5); }
.storefront-account-page .account-address { margin-top: 12px; padding: 19px 21px; border: 1px solid rgba(255, 255, 255, .9); border-radius: 18px; background: rgba(255, 255, 255, .52); }
.storefront-account-page .account-address strong { font-size: 14px; }
.storefront-account-page .account-address p { color: #65717c; }
.storefront-account-page .account-address-add { margin-top: 22px; }
.storefront-account-page .account-address-add summary { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border: 1px solid rgba(112, 134, 145, .24); border-radius: 999px; background: rgba(255, 255, 255, .58); text-decoration: none; }
.storefront-account-page .account-address-add[open] summary { margin-bottom: 22px; }
.storefront-account-page .account-alert { max-width: none; padding: 22px 26px; border-radius: 22px; }
.storefront-account-page .account-alert strong { font-size: 15px; }
.storefront-account-page .account-alert p { color: #5d6974; }
.storefront-account-page .account-alert .button-dark,
.storefront-account-page .store-account-form .button-dark {
    min-height: 48px;
    border: 1px solid #111316;
    border-radius: 999px;
    background: #111316;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
    color: #fff;
    font-weight: 750;
}
.storefront-account-page .store-account-form { gap: 20px; }
.storefront-account-page .store-account-form label { color: #3e4a54; font-size: 12px; font-weight: 750; }
.storefront-account-page .store-account-form input:not([type="checkbox"]) {
    height: 50px;
    padding: 0 16px;
    border: 1px solid rgba(105, 127, 139, .23);
    border-radius: 13px;
    background: rgba(255, 255, 255, .68);
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, .78);
    color: #202a32;
}
.storefront-account-page .store-account-form input:not([type="checkbox"]):focus-visible { border-color: #558e7a; outline: 3px solid rgba(76, 156, 118, .2); outline-offset: 1px; background: #fff; }
.storefront-account-page .store-account-form input:disabled { background: rgba(230, 236, 239, .6); color: #66727b; }
.storefront-account-page .store-account-form small { color: #73808b; }
.storefront-account-page .account-check input { accent-color: #2d7855; }
.storefront-account-page .account-form-options a,
.storefront-account-page .account-switch a { color: #263841; }
.storefront-account-page .account-page-links a { padding: 9px 13px; border-radius: 999px; background: rgba(255, 255, 255, .65); text-decoration: none; }
.storefront-account-page .notice { border-radius: 16px; box-shadow: 0 10px 24px rgba(45, 61, 74, .05); }
.storefront-account-page .store-account-auth { max-width: 620px; min-height: min(790px, calc(100vh - 160px)); padding-top: clamp(58px, 8vw, 100px); padding-bottom: clamp(74px, 9vw, 110px); }
.storefront-account-page .store-account-intro { margin-bottom: 28px; text-align: center; }
.storefront-account-page .store-account-intro .eyebrow { margin-bottom: 15px; }
.storefront-account-page .store-account-intro h1 { font-size: clamp(40px, 5vw, 58px); font-weight: 780; line-height: 1.04; letter-spacing: -.06em; }
.storefront-account-page .store-account-intro > p:last-child { max-width: 490px; margin: 16px auto 0; color: #5f6b76; font-size: 14px; }
.storefront-account-page .store-account-form-wrap { padding: clamp(26px, 4vw, 42px); border-radius: 30px; }
.storefront-account-page .store-account-form-wrap .notice { margin-bottom: 23px; }
.storefront-account-page .store-account-form-wrap .account-switch { margin-top: 23px; color: #65717c; line-height: 1.65; }
.storefront-account-page .account-divider { border-color: rgba(111, 131, 144, .2); }
.storefront-account-page .account-divider span { background: #f6f8f8; }
.storefront-account-page .account-google { min-height: 48px; border-color: rgba(105, 127, 139, .23); border-radius: 999px; background: rgba(255, 255, 255, .55); }
.storefront-account-page .account-google:hover { border-color: #718e9a; background: #fff; }

@media (max-width: 760px) {
    .storefront-account-page .store-account { padding-top: 28px; }
    .storefront-account-page .account-head { min-height: 0; padding: 32px 28px; border-radius: 28px; }
    .storefront-account-page .account-head::before { width: 230px; height: 230px; top: -90px; right: -90px; }
    .storefront-account-page .account-body { display: block; margin-top: 14px; }
    .storefront-account-page .account-tabs { position: static; display: flex; gap: 5px; overflow-x: auto; padding: 8px; border-radius: 18px; }
    .storefront-account-page .account-tabs a { flex: 1 0 auto; min-height: 40px; padding: 11px 15px; text-align: center; }
    .storefront-account-page .account-tabs a:hover,
    .storefront-account-page .account-tabs a:focus-visible { border: 0; }
    .storefront-account-page .account-main { margin-top: 14px; gap: 14px; }
    .storefront-account-page .account-section { scroll-margin-top: 80px; }
    .storefront-account-page .store-account-auth { min-height: 0; }
}
@media (max-width: 540px) {
    .storefront-account-page .account-head { display: block; }
    .storefront-account-page .account-head h1 { font-size: clamp(38px, 10vw, 48px); }
    .storefront-account-page .account-head-subtitle { font-size: 13px; }
    .storefront-account-page .account-head form { margin-top: 23px; }
    .storefront-account-page .account-text-button { padding: 0 13px; white-space: nowrap; }
    .storefront-account-page .account-section { padding: 24px 20px; border-radius: 23px; }
    .storefront-account-page .account-section-head { align-items: end; }
    .storefront-account-page .account-section-head h2 { font-size: 27px; }
    .storefront-account-page .account-order { grid-template-columns: 1fr; gap: 24px; padding: 22px; }
    .storefront-account-page .account-order-summary { padding-top: 21px; border-top: 1px solid rgba(111, 131, 144, .15); }
    .storefront-account-page .store-account-form-wrap { padding: 27px 23px; border-radius: 24px; }
    .storefront-account-page .store-account-auth { padding-top: 54px; }
    .storefront-account-page .account-form-grid { gap: 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .storefront-account-page .button { transition: none; }
}