.account-page { max-width: 76rem; margin: 0 auto; padding: 2rem 1.5rem 5rem; color: var(--ink, #1f2920); }
.account-shell { display: grid; grid-template-columns: 15rem minmax(0, 1fr); min-height: 80vh; gap: 3.5rem; }
.account-sidebar { display: flex; flex-direction: column; padding: 1rem 0; border-right: 1px solid var(--line, #d7ddd5); }
.account-sidebar-brand { color: inherit; font-size: .78rem; letter-spacing: .2em; text-decoration: none; }
.account-sidebar-brand { display: grid; justify-items: start; gap: .75rem; font-size: 1.35rem; font-weight: 700; letter-spacing: .18em; }
.account-sidebar-brand img { width: 4.4rem; height: 4.4rem; padding: .8rem; box-sizing: border-box; display: block; object-fit: contain; image-rendering: auto; filter: none; border-radius: 50%; background: #fff; box-shadow: 0 .5rem 1.2rem rgba(35,45,31,.12); }
.account-profile { display: none; }
.account-avatar { display: grid; place-items: center; width: 6.5rem; height: 6.5rem; border-radius: 50%; color: #fff; background: linear-gradient(145deg, #59654f, #293326); font-size: 1.6rem; letter-spacing: .08em; box-shadow: 0 .8rem 2rem rgba(35,45,31,.18); }
.account-sidebar nav { display: grid; gap: .3rem; order: 2; margin-top: 4.5rem; padding: 0; }
.account-sidebar nav a, .account-sidebar nav button { padding: .8rem .9rem; border: 0; border-radius: .6rem; color: var(--muted, #777); background: transparent; font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.account-sidebar nav a:hover, .account-sidebar nav button:hover, .account-sidebar nav a.is-active, .account-sidebar nav button.is-active { color: var(--ink); background: #eef0eb; }
.account-sidebar .button { display: block; order: 1; width: 6.8rem; margin: 3.2rem 0 0 0; padding: .55rem .65rem; border: 1px solid var(--line, #d7ddd5); border-radius: 999px; color: var(--ink); background: #fff; font-size: .66rem; text-align: center; }
.account-main { padding: 2rem 0; }
.account-main h1 { margin: .8rem 0 1rem; font-size: clamp(2.4rem, 5vw, 4.8rem); font-weight: 400; line-height: .98; letter-spacing: -.04em; }
.account-main h1 span { color: var(--olive, #46513c); }
.account-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; margin-top: 2rem; }
.account-panel form { display: grid; gap: .75rem; padding: 1.5rem; border: 1px solid var(--line, #d7ddd5); border-radius: 1rem; background: rgba(255,255,255,.72); }
.account-panel label { display: grid; gap: .35rem; font-size: .85rem; }
.account-panel input { min-height: 2.8rem; padding: .65rem .8rem; border: 1px solid var(--line, #d7ddd5); border-radius: .45rem; background: #fff; }
.account-heading { display: flex; justify-content: space-between; align-items: center; margin-top: 2rem; }
.account-welcome { position: relative; display: flex; justify-content: space-between; align-items: flex-start; gap: 2rem; margin: 3rem 0 2rem; padding: 2rem; border-radius: 1.25rem; background: linear-gradient(135deg, #f0f2ed, #fafaf8); }
.account-welcome h2 { margin: .3rem 0; font-size: 1.8rem; font-weight: 400; }
.account-welcome [data-account-logout] { display: none; }
.account-welcome-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 7rem; height: 7rem; border-radius: 50%; color: #fff; background: #46513c center / cover no-repeat; box-shadow: 0 .7rem 1.5rem rgba(35,45,31,.14); font-size: 1.5rem; }
.account-welcome-avatar img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; display: none; }
.account-welcome-avatar span { display: grid; place-items: center; width: 100%; height: 100%; }
.account-avatar-picker { position: absolute; top: 10.1rem; right: 0; width: 11rem; display: grid; grid-template-columns: 1fr 1fr; align-items: start; text-align: center; }
.account-avatar-choice { width: 100%; min-width: 0; border: 0; padding: .2rem .45rem; color: var(--muted); background: transparent; font: inherit; font-size: .72rem; line-height: 1.25; cursor: pointer; overflow-wrap: anywhere; }
.account-avatar-choice:hover { color: var(--ink); text-decoration: underline; }
.account-avatar-reset { width: 100%; min-width: 0; border: 0; padding: .2rem .45rem; color: var(--muted); background: transparent; font: inherit; font-size: .72rem; line-height: 1.25; cursor: pointer; overflow-wrap: anywhere; }
.account-avatar-reset:hover { color: var(--ink); text-decoration: underline; }
.account-avatar-adjust { position: absolute; top: 2.2rem; right: 0; width: 14rem; padding: 1rem; border: 1px solid var(--line); border-radius: 1rem; background: #fff; box-shadow: 0 .8rem 2rem rgba(35,45,31,.16); }
.account-avatar-preview { width: 8rem; height: 8rem; margin: 0 auto .8rem; border-radius: 50%; background: #eef0eb center / cover no-repeat; }
.account-avatar-adjust label { display: grid; gap: .25rem; margin: .5rem 0; color: var(--muted); font-size: .72rem; }
.account-avatar-adjust input[type="range"] { width: 100%; }
.account-avatar-adjust .button { width: 100%; margin-top: .5rem; }
.account-favourites-list { display: grid; gap: .7rem; margin-top: 1rem; }
.account-favourite-item { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: .8rem; background: #fff; }
.account-favourite-item button { border: 0; color: var(--muted); background: transparent; cursor: pointer; }
.account-favourites-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: 1rem; margin-top: 1rem; }
.account-favourite-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: 1rem; background: #fff; }
.account-favourite-card a { display: grid; gap: .35rem; color: inherit; text-decoration: none; }
.account-favourite-card img { width: 100%; aspect-ratio: 1 / 1; object-fit: contain; background: #f7f7f4; }
.account-favourite-card strong, .account-favourite-card small { padding: 0 .7rem; }
.account-favourite-card strong { padding-top: .35rem; font-size: .82rem; font-weight: 500; }
.account-favourite-card small { padding-bottom: .8rem; color: var(--muted); font-size: .72rem; }
.account-favourite-card > button { margin: auto .7rem .8rem; border: 0; color: var(--muted); background: transparent; font: inherit; font-size: .72rem; cursor: pointer; }
.saved-address-card > button { margin: .8rem 0 0; border: 0; color: var(--muted); background: transparent; font: inherit; font-size: .72rem; cursor: pointer; }
.account-favourite-card > button:hover, .saved-address-card > button:hover { color: var(--ink); text-decoration: underline; }
.account-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: .9rem; margin-bottom: 4rem; }
.account-cards article { display: grid; gap: .35rem; padding: 1.2rem; border: 1px solid var(--line, #d7ddd5); border-radius: .9rem; background: #fff; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.account-cards article:hover { transform: translateY(-2px); box-shadow: 0 .8rem 1.8rem rgba(35,45,31,.08); }
.account-cards span, .account-cards small { color: var(--muted, #777); font-size: .78rem; }
.account-cards strong { font-size: 1.8rem; font-weight: 400; }
.account-orders-section, .account-empty-section { margin-top: 3rem; }
.account-orders-section h2, .account-empty-section h2 { margin: .4rem 0 1rem; font-weight: 400; }
.account-empty-section { padding: 2rem 0; border-top: 1px solid var(--line, #d7ddd5); }
.account-details-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; max-width: 48rem; margin-top: 1.5rem; }
.account-details-form h2, .account-details-form button, .account-details-form label:nth-of-type(3), .account-details-form small { grid-column: 1 / -1; }
.account-details-form label { display: grid; gap: .45rem; color: var(--muted); font-size: .82rem; }
.account-details-form input { width: 100%; min-height: 3rem; box-sizing: border-box; padding: .7rem .85rem; border: 1px solid var(--line); border-radius: .55rem; background: #fff; }
.account-details-form select { width: 100%; min-height: 3rem; box-sizing: border-box; padding: .7rem .85rem; border: 1px solid var(--line); border-radius: .55rem; background: #fff; }
.account-details-form button { justify-self: start; min-width: 12rem; border-radius: 999px; }
.account-payment-note { max-width: 48rem; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.saved-addresses { max-width: 48rem; margin-top: 2.5rem; }
.saved-address-card { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) 5rem; align-items: center; column-gap: 1.1rem; margin-top: .7rem; padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: 1rem; background: #fff; color: var(--muted); }
.saved-address-card p { grid-column: 2; margin: .15rem 0 0; text-align: center; }
.saved-address-card .saved-address-recipient { grid-column: 2; grid-row: 2; color: var(--ink); font-size: .72rem; }
.saved-address-select { display: flex; align-items: center; justify-content: center; gap: .45rem; grid-column: 1; grid-row: 1 / span 2; color: var(--ink); font-size: .72rem; cursor: pointer; }
.saved-address-select input { accent-color: #111; }
.saved-address-remove { display: grid; place-items: center; grid-column: 3; grid-row: 1; justify-self: center; align-self: center; min-height: 1.5rem; padding: .2rem .35rem; border: 0; color: var(--muted); background: transparent; font: inherit; font-size: .68rem; line-height: 1; transform: translateY(-.12rem); cursor: pointer; }
.saved-address-remove:hover { color: var(--ink); border-color: var(--ink); }
.saved-address-edit { display: grid; place-items: center; grid-column: 3; grid-row: 2; justify-self: center; align-self: center; min-height: 1.5rem; margin: 0; border: 0; color: var(--muted); background: transparent; font: inherit; font-size: .68rem; line-height: 1; transform: translateY(-.12rem); cursor: pointer; }
.saved-address-edit:hover { color: var(--ink); text-decoration: underline; }
.account-address-edit-dialog { width: min(38rem, calc(100vw - 2rem)); padding: 0; border: 0; border-radius: 1.25rem; background: #fbfaf7; color: var(--ink); box-shadow: 0 1.5rem 4rem rgba(20,25,18,.25); }
.account-address-edit-dialog::backdrop { background: rgba(27,32,24,.45); backdrop-filter: blur(8px); }
.account-address-edit-dialog form { position: relative; padding: 2rem; }
.account-address-edit-dialog h2 { margin: .35rem 0 1.4rem; font-weight: 400; }
.account-address-edit-dialog .dialog-close { position: absolute; top: 1rem; right: 1rem; border: 0; background: transparent; font-size: 1.5rem; cursor: pointer; }
.address-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.address-edit-grid label { display: grid; gap: .35rem; color: var(--muted); font-size: .78rem; }
.address-edit-grid input { min-height: 2.7rem; padding: .65rem .75rem; border: 1px solid var(--line); border-radius: .55rem; background: #fff; box-sizing: border-box; }
.address-edit-wide { grid-column: 1 / -1; }
.address-edit-actions { display: flex; justify-content: flex-end; gap: .7rem; margin-top: 1.4rem; }
@media (max-width: 700px) { .address-edit-grid { grid-template-columns: 1fr; } .address-edit-wide { grid-column: auto; } .account-address-edit-dialog form { padding: 1.4rem; } }
.new-address-form { max-width: 48rem; margin-top: 2rem; }
.account-toast { position: fixed; right: 1.5rem; bottom: 1.5rem; z-index: 20; max-width: min(24rem, calc(100vw - 3rem)); padding: .9rem 1.1rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); box-shadow: 0 .8rem 2rem rgba(35,45,31,.16); opacity: 0; transform: translateY(.7rem); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.account-toast.is-visible { opacity: 1; transform: translateY(0); }
.account-toast[data-state="error"] { border-color: #c98275; color: #8b3428; }
.new-address-form h2 { margin-bottom: 1rem; }
.account-details-form > label { display: grid; gap: .45rem; margin: .8rem 0; }
.account-details-form input, .account-details-form select { width: 100%; box-sizing: border-box; }
.account-favourite-count { color: var(--olive); }
.account-order { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line, #d7ddd5); }
.dialog-account-link { display: block; margin-top: 1rem; color: inherit; }
.account-auth-intro { grid-column: 1 / -1; display:grid; gap:.7rem; padding:1.65rem 1.8rem; border:1px solid rgba(70,81,60,.18); border-radius:1.2rem; background:linear-gradient(135deg,#eef2e9 0%,#fbfaf7 72%); }
.account-auth-intro h2 { margin:0; font-size:clamp(1.5rem,3vw,2.15rem); font-weight:450; letter-spacing:-.035em; }
.account-auth-intro p { max-width:38rem; margin:0; color:var(--muted,#777); line-height:1.55; }
.account-auth-kicker { color:var(--olive,#46513c); font-size:.72rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.account-auth-benefits { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:.25rem; }
.account-auth-benefits span { padding:.42rem .65rem; border:1px solid rgba(70,81,60,.16); border-radius:999px; color:var(--ink); background:rgba(255,255,255,.72); font-size:.76rem; }
.account-auth-switcher { grid-column:1 / -1; display:inline-flex; justify-self:start; gap:.25rem; padding:.25rem; border:1px solid var(--line); border-radius:999px; background:#fff; }
.account-auth-switcher button { padding:.58rem .9rem; border:0; border-radius:999px; color:var(--muted); background:transparent; font:inherit; font-size:.8rem; cursor:pointer; transition:color .2s ease,background .2s ease; }
.account-auth-switcher button.is-active { color:#fff; background:var(--olive,#46513c); }
.password-input { position:relative; display:block; }
.password-input input { width:100%; box-sizing:border-box; padding-right:4.4rem; }
.password-input button { position:absolute; top:50%; right:.45rem; transform:translateY(-50%); padding:.25rem .4rem; border:0; color:var(--olive,#46513c); background:transparent; font:inherit; font-size:.72rem; font-weight:700; cursor:pointer; }
.account-quick-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.9rem; margin:-2.6rem 0 3.5rem; }
.account-quick-actions a { display:grid; gap:.3rem; min-height:5.25rem; padding:1rem 1.1rem; border:1px solid var(--line); border-radius:.9rem; color:inherit; background:linear-gradient(145deg,#fff,#f6f7f3); text-decoration:none; transition:transform .2s ease, box-shadow .2s ease; }
.account-quick-actions a:hover { transform:translateY(-2px); box-shadow:0 .7rem 1.5rem rgba(35,45,31,.08); }
.account-quick-actions span { font-weight:650; }
.account-quick-actions small { color:var(--muted); }
.account-order { position:relative; align-items:center; padding-left:1.15rem; }
.account-order::before { content:''; position:absolute; left:0; top:1.1rem; width:.5rem; height:.5rem; border-radius:50%; background:var(--olive,#46513c); box-shadow:0 0 0 .25rem #eef1eb; }
.account-order-actions { grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:.55rem; padding-top:.25rem; }
.account-order-actions button, .account-order-actions a { padding:.42rem .65rem; border:1px solid var(--line); border-radius:999px; color:var(--ink); background:#fff; font:inherit; font-size:.74rem; text-decoration:none; cursor:pointer; }
.account-order-actions button:hover, .account-order-actions a:hover { border-color:var(--olive,#46513c); background:#eef2e9; }
.account-notification-form { padding-top:1.4rem; border-top:1px solid var(--line); }
.account-notification-form > p { grid-column:1 / -1; margin:0; color:var(--muted); }
.account-choice { grid-column:1 / -1; display:flex !important; align-items:center; gap:.65rem; margin:0 !important; padding:.7rem .8rem; border:1px solid var(--line); border-radius:.7rem; color:var(--ink) !important; background:#fff; cursor:pointer; }
.account-choice input { width:1rem !important; min-height:auto !important; margin:0; accent-color:var(--olive,#46513c); }
.account-delivery-preferences { padding-top:1.4rem; border-top:1px solid var(--line); }
.account-delivery-preferences > p { grid-column:1 / -1; margin:0; color:var(--muted); }
.account-details-wide { grid-column:1 / -1; }
.account-details-form textarea { width:100%; min-height:5.8rem; box-sizing:border-box; padding:.75rem .85rem; border:1px solid var(--line); border-radius:.55rem; background:#fff; color:var(--ink); font:inherit; line-height:1.45; resize:vertical; }
.account-security-panel { max-width:48rem; margin-top:2.5rem; padding:1.4rem 0; border-top:1px solid var(--line); }
.account-security-panel h2 { margin:.25rem 0 .45rem; font-size:1.25rem; font-weight:500; }
.account-security-panel p:not(.eyebrow) { margin:0 0 1rem; color:var(--muted); }
.account-rewards { max-width:48rem; margin:0 0 3rem; padding:1.4rem; border:1px solid rgba(70,81,60,.22); border-radius:1rem; background:linear-gradient(135deg,#eef2e9,#fff); }
.account-rewards h2 { margin:.2rem 0 .45rem; font-size:1.8rem; font-weight:500; }
.account-rewards p:not(.eyebrow), .account-rewards small { color:var(--muted); line-height:1.5; }
.account-rewards div { display:flex; flex-wrap:wrap; align-items:center; gap:.7rem; margin:1rem 0; }
.account-rewards button { padding:.45rem .75rem; border:1px solid var(--olive,#46513c); border-radius:999px; color:#fff; background:var(--olive,#46513c); font:inherit; font-size:.75rem; cursor:pointer; }
.account-panel form { box-shadow:0 .8rem 2rem rgba(35,45,31,.045); transition:transform .2s ease, box-shadow .2s ease; }
.account-panel form:focus-within { transform:translateY(-2px); box-shadow:0 1rem 2.2rem rgba(35,45,31,.1); }
.account-panel form h2 { margin:.1rem 0 .35rem; font-size:1.35rem; font-weight:500; letter-spacing:-.025em; }
.account-panel input:focus, .account-details-form input:focus, .account-details-form select:focus { outline:2px solid rgba(70,81,60,.22); outline-offset:2px; border-color:var(--olive,#46513c); }

/* Member-space visual refresh: preserves the existing logo, account routes, and account data. */
.account-page { max-width: 84rem; padding-top: 1.2rem; }
.account-shell { gap: 2.25rem; }
.account-sidebar { margin: .6rem 0; padding: 1.15rem; border: 0; border-radius: 1.5rem; background: #46513c; box-shadow: 0 1.2rem 3rem rgba(35,45,31,.14); }
.account-sidebar-brand { align-items: center; grid-template-columns: auto 1fr; color: #fff; font-size: 1rem; letter-spacing: .14em; }
.account-sidebar-brand img { width: 3.65rem; height: 3.65rem; padding: .55rem; background: rgba(255,255,255,.96); box-shadow: none; }
.account-sidebar nav { gap: .4rem; margin-top: 3.5rem; }
.account-sidebar nav a, .account-sidebar nav button { color: rgba(255,255,255,.82); }
.account-sidebar nav a:hover, .account-sidebar nav button:hover, .account-sidebar nav a.is-active, .account-sidebar nav button.is-active { color: #35402f; background: #fbfaf6; }
.account-sidebar .button { width: 100%; margin-top: auto; border-color: rgba(255,255,255,.45); color: #fff; background: transparent; }
.account-main { padding: 2.35rem 0; }
.account-main h1 { max-width: 38rem; }
.account-status { max-width: 34rem; color: var(--muted); line-height: 1.55; }
.account-panel { gap: 1.3rem; }
.account-auth-intro { position: relative; overflow: hidden; display: block; min-height: 22rem; padding: 2.6rem 3rem; border: 0; border-radius: 1.5rem; background: linear-gradient(125deg,#e8eee0 0%,#f4f3e9 58%,#decfe8 100%); box-shadow: 0 1.2rem 3rem rgba(35,45,31,.08); }
.account-auth-copy { position: relative; z-index: 1; max-width: 31rem; }
.account-auth-intro h2 { max-width: 26rem; margin: .45rem 0 1rem; font-size: clamp(2.25rem,4.2vw,4.25rem); font-weight: 400; line-height: .96; letter-spacing: -.06em; }
.account-auth-intro p { max-width: 27rem; color: #586351; font-size: .98rem; }
.account-auth-kicker { color: #3e4a35; }
.account-auth-benefits { margin-top: 1.35rem; }
.account-auth-benefits span { padding: .55rem .75rem; border-color: rgba(63,75,53,.18); background: rgba(255,255,255,.7); font-size: .78rem; }
.account-auth-art { position: absolute; right: 1rem; bottom: -1.4rem; width: min(38%,17rem); height: 85%; border-radius: 9rem 9rem 1.5rem 1.5rem; background: radial-gradient(circle at 40% 25%,rgba(255,255,255,.7),transparent 30%), linear-gradient(150deg,#bba4c9,#daccdf 56%,#9a7fac); transform: rotate(7deg); box-shadow: inset 1rem 0 2rem rgba(255,255,255,.2), .9rem 1.4rem 2rem rgba(50,55,42,.15); }
.account-auth-art::before { content:''; position:absolute; inset: 13% 15% auto; height: 72%; border-radius: 6rem; background: rgba(255,255,255,.16); }
.account-auth-art img { position:absolute; z-index:1; left: 50%; bottom: 3%; width: 130%; max-width: none; transform: translateX(-50%) rotate(-7deg); filter: drop-shadow(.4rem .9rem .8rem rgba(40,44,36,.2)); }
.account-auth-switcher { grid-column: auto; align-self: end; justify-self: stretch; padding: .3rem; border: 0; background: #eff0eb; }
.account-auth-switcher button { padding: .7rem .55rem; }
.account-panel form { padding: 1.8rem; border-radius: 1.3rem; background: #fffdf9; }
.account-panel form h2 { font-size: 1.6rem; font-weight: 400; }
.account-panel form .button { min-height: 3.1rem; margin-top: .35rem; border-radius: .7rem; letter-spacing: .06em; }
.account-welcome { overflow: hidden; margin-top: 1.1rem; padding: 2.4rem; border: 0; border-radius: 1.5rem; background: linear-gradient(125deg,#e8eee0 0%,#f9f8f4 65%,#e5d9ec 100%); box-shadow: 0 1.2rem 3rem rgba(35,45,31,.08); }
.account-welcome::after { content:''; position:absolute; right:-3rem; bottom:-6rem; width:18rem; height:18rem; border:1px solid rgba(70,81,60,.16); border-radius:50%; box-shadow: 0 0 0 2.3rem rgba(70,81,60,.05), 0 0 0 4.7rem rgba(70,81,60,.035); }
.account-welcome > div, .account-welcome-avatar, .account-avatar-picker { position:relative; z-index:1; }
.account-welcome h2 { font-size: clamp(2rem,4vw,3.2rem); letter-spacing: -.05em; }
.account-welcome-avatar { position: absolute; top: 1.85rem; right: 2rem; width: 6.3rem; height: 6.3rem; border: .35rem solid rgba(255,255,255,.65); z-index: 2; }
.account-cards { gap: 1rem; margin-bottom: 1.1rem; }
.account-cards article { min-height: 8.7rem; padding: 1.35rem; border: 0; border-radius: 1.15rem; background: #fffdf9; box-shadow: 0 .7rem 1.6rem rgba(35,45,31,.065); }
.account-cards article:nth-child(2) { background: #f0f2eb; }
.account-cards article:nth-child(3) { background: #f3ecf6; }
.account-cards strong { color: #3f4b36; font-size: 2.25rem; }
.account-quick-actions { margin: .1rem 0 3rem; }
.account-quick-actions a { min-height: 6rem; padding: 1.25rem; border: 0; border-radius: 1.15rem; background: #fffdf9; box-shadow: 0 .7rem 1.6rem rgba(35,45,31,.06); }
.account-orders-section, .account-empty-section { margin-top: 2.5rem; padding: 1.8rem; border: 0; border-radius: 1.25rem; background: #fffdf9; box-shadow: 0 .7rem 1.6rem rgba(35,45,31,.05); }
.account-order { margin-top: .75rem; padding: 1.15rem 1.15rem 1.15rem 1.7rem; border: 1px solid rgba(70,81,60,.12); border-radius: 1rem; background: #fff; }
.account-sidebar nav { order: 1; }
.account-sidebar .button { order: 2; margin-top: auto; }
.account-welcome::after { pointer-events: none; }
.account-avatar-picker { top: 9.15rem; right: 1.25rem; width: 11.7rem; grid-template-columns: 1fr 1fr; gap: .15rem; padding: .3rem; border: 1px solid rgba(255,255,255,.65); border-radius: 999px; background: rgba(255,255,255,.7); box-shadow: 0 .45rem 1rem rgba(35,45,31,.08); backdrop-filter: blur(.45rem); }
.account-avatar-choice, .account-avatar-reset { padding: .42rem .35rem; border-radius: 999px; background: transparent; }
.account-avatar-choice:hover, .account-avatar-reset:hover { background: rgba(255,255,255,.76); text-decoration: none; }
.account-avatar-choice { font-size: 0; }
.account-avatar-choice::after { content: 'Change avatar'; font-size: .72rem; }
@media (max-width: 700px) { .account-page { height: auto; min-height: 100svh; overflow: visible; padding: .6rem .7rem 2rem; } .account-sidebar { margin: 0; padding: .7rem; border-radius: 1.1rem; } .account-sidebar-brand { grid-template-columns: auto 1fr; } .account-sidebar nav { margin-top: 1.2rem; } .account-sidebar .button { display: none; } .account-auth-intro { min-height: 25rem; padding: 2rem 1.5rem; } .account-auth-art { right: 1rem; width: 42%; height: 49%; } .account-auth-intro h2 { max-width: 15rem; font-size: 2.45rem; } .account-auth-intro p { max-width: 15rem; font-size: .88rem; } .account-auth-benefits { max-width: 14rem; } .account-auth-benefits span { padding: .45rem .55rem; font-size: .69rem; } .account-panel form { padding: 1.35rem; } .account-welcome { padding: 1.5rem; } .account-cards { grid-template-columns: repeat(3,1fr); gap:.55rem; } .account-cards article { min-height: 6.7rem; padding:.85rem; } .account-cards strong { font-size:1.6rem; } .account-cards span,.account-cards small { font-size:.67rem; } .account-orders-section,.account-empty-section { padding:1.2rem; } }
@media (max-width: 700px) { .account-shell { grid-template-columns: 1fr; gap: 0; } .account-sidebar { border-right: 0; border-bottom: 1px solid var(--line, #d7ddd5); } .account-profile { margin: 2rem 0 1rem; } .account-sidebar nav { display: flex; overflow: auto; } .account-main { padding-top: 1rem; } .account-panel, .account-cards { grid-template-columns: 1fr; } .account-order { grid-template-columns: 1fr; gap: .3rem; } .account-welcome { display: grid; } }
@media (max-width:700px) { .account-auth-intro { padding:1.2rem; } .account-auth-benefits { display:grid; grid-template-columns:1fr 1fr; } .account-auth-benefits span { font-size:.7rem; } .account-auth-switcher { width:100%; box-sizing:border-box; justify-content:space-between; } .account-auth-switcher button { padding:.55rem .5rem; font-size:.72rem; } .account-quick-actions { grid-template-columns:1fr; margin:-.25rem 0 2rem; } }
@media (max-width: 700px) {
  .account-page { max-width: none; height: 100svh; overflow: hidden; padding: .8rem .8rem 0; }
  .account-shell { min-height: 0; height: 100%; }
  .account-sidebar { position: relative; min-width: 0; padding: .35rem 0 .55rem; }
  .account-sidebar-brand { display: flex; align-items: center; gap: .65rem; padding-left: .25rem; font-size: 1.05rem; }
  .account-sidebar-brand img { width: 3rem; height: 3rem; padding: .5rem; }
  .account-sidebar .button { position: absolute; top: .65rem; right: 0; width: 5.6rem; margin: 0; padding: .45rem .35rem; font-size: .58rem; }
  .account-sidebar nav { display: flex; gap: .2rem; width: 100%; margin-top: 3rem; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .account-sidebar nav::-webkit-scrollbar { display: none; }
  .account-sidebar nav button { flex: 0 0 auto; padding: .65rem .72rem; font-size: .78rem; white-space: nowrap; }
  .account-main { min-height: 0; padding: .7rem 0 2rem; overflow-y: auto; overscroll-behavior: contain; }
  .account-main h1 { margin: .4rem 0 .7rem; font-size: clamp(2.2rem, 10vw, 3.4rem); }
  .account-welcome { display: block; min-height: 13rem; margin: 1rem 0 1rem; padding: 1.2rem; }
  .account-welcome > div { max-width: calc(100% - 8.5rem); }
  .account-welcome h2 { font-size: 1.35rem; }
  .account-welcome-avatar { position: absolute; top: 1.2rem; right: 1.2rem; width: 6rem; height: 6rem; }
  .account-avatar-picker { top: 8rem; right: .9rem; width: 7.25rem; grid-template-columns: 1fr; gap: .1rem; border-radius: .7rem; font-size: .62rem; }
  .account-avatar-choice, .account-avatar-reset { padding: .3rem .25rem; border-radius: .42rem; font-size: .6rem; }
  .account-avatar-choice::after { font-size: .6rem; }
  .account-avatar-adjust { right: -1rem; width: min(14rem, calc(100vw - 2rem)); }
  .account-cards { gap: .7rem; }
  .account-cards article { min-height: 7rem; padding: 1rem; }
  .saved-addresses, .new-address-form { max-width: none; }
}
