:root{--acc-green:#123d23;--acc-olive:#667a38;--acc-ivory:#f7f4ea;--acc-line:rgba(18,61,35,.12);--acc-gold:#c9a33e}
.account-main{min-height:68vh;padding:42px 0 72px;background:linear-gradient(180deg,#f7f4ea 0,#fbfaf5 46%,#f5f1e5 100%)}
.account-shell{max-width:1180px;margin:0 auto}.account-loading{min-height:380px;display:grid;place-items:center;align-content:center;gap:12px;border:1px solid var(--acc-line);border-radius:28px;background:#fff}.account-loading span{font-size:34px}
.account-guest{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:22px}.account-card{border:1px solid var(--acc-line);border-radius:24px;background:rgba(255,255,255,.9);box-shadow:0 18px 45px rgba(18,61,35,.06);padding:24px}
.account-guest-main{padding:34px}.account-eyebrow{margin:0 0 8px;color:var(--acc-olive);font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.14em}.account-guest h1,.account-hero h1{margin:0;color:var(--acc-green);font:400 clamp(2.1rem,5vw,4.2rem)/.98 "DM Serif Display",serif}.account-guest p,.account-card p{color:#5d665f;line-height:1.7}.account-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.account-actions button,.account-actions a,.account-primary{min-height:46px;padding:0 18px;border-radius:999px;border:1px solid var(--acc-line);background:#fff;color:var(--acc-green);font:800 .78rem/1 "DM Sans",sans-serif;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer}.account-actions .is-primary,.account-primary{background:var(--acc-green);border-color:var(--acc-green);color:#fff}.account-benefits{display:grid;gap:10px;margin-top:20px}.account-benefits span{display:flex;gap:9px;align-items:flex-start;padding:12px 14px;border-radius:15px;background:#f3f6ee;color:#2f4937;font-weight:700;font-size:.82rem}.account-benefits b{color:var(--acc-green)}
.account-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:20px}.account-side{position:sticky;top:116px;align-self:start}.account-identity{display:flex;gap:12px;align-items:center;margin-bottom:18px}.account-avatar{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--acc-green);color:#fff;font-weight:900;font-size:1.05rem}.account-identity strong{display:block;color:var(--acc-green)}.account-identity small{display:block;max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#718075;margin-top:3px}.account-tabs{display:grid;gap:7px}.account-tabs button{width:100%;display:flex;align-items:center;gap:9px;text-align:start;padding:12px;border:0;border-radius:13px;background:transparent;color:#405348;font-weight:800;cursor:pointer}.account-tabs button:hover,.account-tabs button.is-active{background:#edf3e8;color:var(--acc-green)}.account-side-note{margin-top:16px;padding-top:15px;border-top:1px solid var(--acc-line);font-size:.7rem;line-height:1.55;color:#748078}
.account-content{min-width:0}.account-hero{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;padding:30px;margin-bottom:18px;background:linear-gradient(135deg,#173f27,#275a35);color:#fff;border-radius:26px}.account-hero h1{color:#fff;font-size:clamp(2rem,4vw,3.5rem)}.account-hero p{margin:8px 0 0;color:rgba(255,255,255,.78)}.account-balance{flex:0 0 auto;text-align:end}.account-balance small{display:block;color:rgba(255,255,255,.7);font-weight:700}.account-balance strong{display:block;margin-top:4px;font-size:2rem}.account-panel[hidden]{display:none!important}.account-panel{display:grid;gap:16px}.account-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.account-stat{padding:18px;border:1px solid var(--acc-line);border-radius:18px;background:#fff}.account-stat small{display:block;color:#748078;font-weight:700}.account-stat strong{display:block;margin-top:6px;color:var(--acc-green);font-size:1.35rem}.account-section-title{display:flex;justify-content:space-between;gap:14px;align-items:flex-end}.account-section-title h2{margin:0;color:var(--acc-green);font:400 2rem/1 "DM Serif Display",serif}.account-section-title p{margin:4px 0 0;color:#738078;font-size:.8rem}
.account-progress{height:9px;border-radius:999px;background:#e5ebdf;overflow:hidden;margin-top:13px}.account-progress span{display:block;height:100%;background:var(--acc-olive);border-radius:inherit}.account-list{display:grid;gap:9px}.account-row{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px;border:1px solid var(--acc-line);border-radius:15px;background:#fff}.account-row strong{color:var(--acc-green)}.account-row small{display:block;color:#758078;margin-top:3px}.account-pill{padding:7px 10px;border-radius:999px;background:#eef3e9;color:#35533d;font-size:.7rem;font-weight:900;white-space:nowrap}.account-pill.is-pending{background:#fff4d7;color:#806014}.account-pill.is-cancelled{background:#f8e7e5;color:#8f413b}.account-wallet-grid,.account-reward-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.account-reward{padding:17px;border-radius:17px;border:1px solid var(--acc-line);background:#fff}.account-reward strong{display:block;color:var(--acc-green);font-size:1.15rem}.account-reward small{display:block;margin-top:4px;color:#728077}.account-referral-code{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:18px;border:1px dashed rgba(18,61,35,.28);border-radius:18px;background:#f6f8f1}.account-referral-code strong{font-size:1.4rem;color:var(--acc-green);letter-spacing:.08em}.account-referral-code button{margin-inline-start:auto}
.account-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.account-form label{display:grid;gap:6px;color:#516056;font-size:.72rem;font-weight:800}.account-form input,.account-form select{width:100%;min-height:46px;border:1px solid var(--acc-line);border-radius:12px;background:#fff;padding:0 12px;color:#243c2c;font:600 .84rem "DM Sans",sans-serif}.account-form .full{grid-column:1/-1}.account-form button{justify-self:start}.account-status{min-height:18px;color:#52665a;font-size:.75rem}.account-security{display:grid;grid-template-columns:1fr 1fr;gap:14px}.account-danger{border-color:rgba(145,59,48,.16);background:#fffaf9}.account-danger h3{color:#7d362f}
.account-cart-link{text-decoration:none}.account-site-header .nav-actions{overflow:visible}
html[dir="rtl"] .account-tabs button{text-align:right}
@media(max-width:980px){.account-layout{grid-template-columns:1fr}.account-side{position:static}.account-side .account-identity,.account-side-note{display:none}.account-tabs{display:flex;overflow:auto;padding-bottom:3px;scrollbar-width:none}.account-tabs::-webkit-scrollbar{display:none}.account-tabs button{width:auto;flex:0 0 auto;white-space:nowrap;border:1px solid var(--acc-line);background:#fff}.account-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.account-main{padding:22px 0 48px}.account-guest{grid-template-columns:1fr}.account-guest-main,.account-card{padding:18px}.account-hero{align-items:flex-start;flex-direction:column;padding:22px}.account-balance{text-align:start}.account-grid{grid-template-columns:1fr 1fr}.account-wallet-grid,.account-reward-grid,.account-security,.account-form{grid-template-columns:1fr}.account-form .full{grid-column:auto}.account-row{align-items:flex-start;flex-direction:column}.account-referral-code button{margin-inline-start:0;width:100%}.account-site-header .brand-wordmark{display:none}}
@media(max-width:440px){.account-grid{grid-template-columns:1fr}.account-hero h1{font-size:2.35rem}}


/* ===== account7: clear account navigation + balanced live dashboard ===== */
/* Keep exactly one language visible even when shared mobile navigation rules force strong/span display. */
html[lang="en"] body[data-page="account"] .only-ar,
html[dir="ltr"] body[data-page="account"] .only-ar,
html[lang="en"] body[data-page="account"] .site-header .nav .only-ar,
html[dir="ltr"] body[data-page="account"] .site-header .nav .only-ar{display:none!important}
html[lang="ar"] body[data-page="account"] .only-en,
html[dir="rtl"] body[data-page="account"] .only-en,
html[lang="ar"] body[data-page="account"] .site-header .nav .only-en,
html[dir="rtl"] body[data-page="account"] .site-header .nav .only-en{display:none!important}

.account-main{padding-top:30px}
.account-shell{max-width:1360px!important}
.account-layout{grid-template-columns:250px minmax(0,1fr);gap:22px}
.account-side{top:108px;padding:18px;border-radius:22px}
.account-identity{padding:4px 4px 16px;margin-bottom:10px;border-bottom:1px solid var(--acc-line)}
.account-avatar{width:44px;height:44px;font-size:.98rem}
.account-tabs{gap:5px}
.account-tabs button{min-height:48px;padding:8px 10px;gap:10px;border:1px solid transparent;border-radius:14px;font-size:.83rem}
.account-tabs button:hover{border-color:var(--acc-line);background:#f4f7f0}
.account-tabs button.is-active{border-color:rgba(18,61,35,.08);background:#eaf2e5;box-shadow:inset 3px 0 0 var(--acc-green)}
html[dir="rtl"] .account-tabs button.is-active{box-shadow:inset -3px 0 0 var(--acc-green)}
.account-tab-icon{width:30px;height:30px;display:grid;place-items:center;flex:0 0 30px;border-radius:10px;background:#f6f4ec;color:var(--acc-green);font-size:.9rem}
.account-tabs button.is-active .account-tab-icon{background:#fff}
.account-side-note{display:grid;gap:4px;margin-top:14px;padding:14px 4px 2px;border-top:1px solid var(--acc-line);color:#738078}
.account-side-note small{font-size:.66rem}
.account-sync{display:flex;align-items:center;gap:7px;color:#3f5e47;font-size:.7rem;font-weight:800}
.account-sync i{width:8px;height:8px;border-radius:50%;background:#4e8b56;box-shadow:0 0 0 4px rgba(78,139,86,.12)}

.account-hero{min-height:190px;align-items:center;padding:28px 30px;margin-bottom:16px;border-radius:24px;box-shadow:0 18px 42px rgba(18,61,35,.12)}
.account-hero h1{font-size:clamp(2.5rem,4vw,4.1rem);line-height:.94}
.account-balance{appearance:none;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;min-width:160px;padding:16px 18px;border-radius:18px;text-align:end;cursor:pointer;transition:background .18s ease,transform .18s ease}
.account-balance:hover{background:rgba(255,255,255,.14);transform:translateY(-1px)}
.account-balance small{display:block;color:rgba(255,255,255,.72);font-weight:800}
.account-balance strong{display:block;margin-top:4px;color:#fff;font-size:2rem}
.account-balance em{display:block;margin-top:7px;color:#e6d282;font-style:normal;font-size:.66rem;font-weight:900}
html[dir="rtl"] .account-balance{text-align:start}

.account-panel{gap:14px}
.account-card{border-radius:21px;box-shadow:0 12px 30px rgba(18,61,35,.045)}
.account-grid{gap:10px}
.account-stat{min-height:102px;padding:16px;border-radius:17px}
.account-stat strong{font-size:1.45rem}
.account-section-title h2{font-size:1.85rem}
.account-section-title p{max-width:72ch;line-height:1.55}
.account-panel[data-account-panel="referrals"] .account-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.account-panel[data-account-panel="points"] .account-card:first-child .account-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.account-referral-code{background:linear-gradient(135deg,#f6f8f1,#fbfaf5)}
.account-row{min-height:64px}

@media(max-width:980px){
  .account-layout{gap:14px}
  .account-side{padding:12px;position:static}
  .account-tabs{gap:7px}
  .account-tabs button{min-height:44px;padding:7px 10px}
  .account-tab-icon{width:27px;height:27px;flex-basis:27px}
  .account-panel[data-account-panel="referrals"] .account-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:700px){
  .account-main{padding-top:16px}
  .account-hero{min-height:0;padding:20px;border-radius:20px;gap:16px}
  .account-hero h1{font-size:2.45rem}
  .account-balance{width:100%;min-width:0;text-align:start;padding:14px 15px}
  .account-balance strong{font-size:1.7rem}
  .account-panel[data-account-panel="referrals"] .account-grid,
  .account-panel[data-account-panel="points"] .account-card:first-child .account-grid{grid-template-columns:1fr}
  .account-section-title{align-items:flex-start;flex-direction:column}
  .account-section-title .account-primary{width:100%}
}


/* ===== account8: stable header + compact dashboard ===== */
body[data-page="account"] .account-shell{width:min(100%,1360px);margin-inline:auto}
body[data-page="account"] .account-card{box-shadow:0 12px 32px rgba(18,61,35,.055)}
body[data-page="account"] .account-side{width:100%}
body[data-page="account"] .account-content{width:100%}
body[data-page="account"] .account-hero{min-height:210px;padding:28px 34px;align-items:center}
body[data-page="account"] .account-hero h1{font-size:clamp(2.7rem,4.2vw,4.35rem)}
body[data-page="account"] .account-balance{min-width:188px;padding:14px 16px;border:1px solid rgba(255,255,255,.16);border-radius:18px;background:rgba(255,255,255,.055);color:#fff}
body[data-page="account"] .account-balance em{display:block;margin-top:5px;color:rgba(255,255,255,.72);font-size:.68rem;font-style:normal;font-weight:800}
body[data-page="account"] .account-tab-icon{width:30px;height:30px;flex:0 0 30px;display:grid;place-items:center;border-radius:9px;background:rgba(18,61,35,.045)}
body[data-page="account"] .account-tabs button.is-active .account-tab-icon{background:rgba(18,61,35,.09)}
body[data-page="account"] .account-stat{min-height:104px}
body[data-page="account"] .account-section-title h2{font-size:clamp(1.65rem,2vw,2.15rem)}

@media(min-width:1181px){
  body[data-page="account"] .account-layout{grid-template-columns:240px minmax(0,1fr);gap:20px}
}

@media(max-width:1180px){
  body[data-page="account"] .account-site-header .nav-links .only-ar,
  body[data-page="account"] .account-site-header .nav-links .only-en{white-space:nowrap}
}
@media(max-width:700px){
  body[data-page="account"] .account-shell{width:100%}
  body[data-page="account"] .account-side{border-radius:18px}
  body[data-page="account"] .account-tabs{margin-inline:-2px;padding-inline:2px}
  body[data-page="account"] .account-hero{padding:20px;min-height:0}
  body[data-page="account"] .account-stat{min-height:92px}
}


/* ===== account9: integrated account sign-in ===== */
body[data-page="account"] .account-auth-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:20px;align-items:start}
body[data-page="account"] .account-auth-card{padding:30px}
body[data-page="account"] .account-auth-card h1{margin:6px 0 10px;color:var(--acc-green);font:400 clamp(2.35rem,4vw,3.6rem)/1 "DM Serif Display",serif}
body[data-page="account"] .account-auth-card>p{max-width:760px}
body[data-page="account"] .account-auth-tabs{display:inline-flex;gap:6px;padding:5px;margin-bottom:18px;border:1px solid var(--acc-line);border-radius:999px;background:#f3f5ef}
body[data-page="account"] .account-auth-tabs button{min-height:38px;padding:0 16px;border:0;border-radius:999px;background:transparent;color:#5e6c62;font:800 .75rem "DM Sans",sans-serif;cursor:pointer}
body[data-page="account"] .account-auth-tabs button.is-active{background:#fff;color:var(--acc-green);box-shadow:0 4px 12px rgba(18,61,35,.08)}
body[data-page="account"] .account-legal-consent{display:flex;gap:10px;align-items:flex-start;margin:20px 0 14px;padding:13px 14px;border:1px solid var(--acc-line);border-radius:14px;background:#fafbf7;color:#526258;font-size:.73rem;line-height:1.55}
body[data-page="account"] .account-legal-consent input{margin-top:3px;flex:0 0 auto}
body[data-page="account"] .account-legal-consent a{color:var(--acc-green);font-weight:900}
body[data-page="account"] .account-google{width:100%;min-height:46px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--acc-line);border-radius:13px;background:#fff;color:#273c2e;font:800 .8rem "DM Sans",sans-serif;cursor:pointer}
body[data-page="account"] .account-google span{width:26px;height:26px;display:grid;place-items:center;border:1px solid var(--acc-line);border-radius:50%;font-weight:900}
body[data-page="account"] .account-google.is-disabled{opacity:.48;cursor:not-allowed}
body[data-page="account"] .account-or{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin:16px 0;color:#8a928d;font-size:.7rem}
body[data-page="account"] .account-or span{height:1px;background:var(--acc-line)}
body[data-page="account"] .account-auth-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
body[data-page="account"] .account-auth-form label{display:grid;gap:6px;color:#516056;font-size:.72rem;font-weight:800}
body[data-page="account"] .account-auth-form input{width:100%;min-height:48px;border:1px solid var(--acc-line);border-radius:12px;background:#fff;padding:0 12px;color:#243c2c;font:600 .84rem "DM Sans",sans-serif}
body[data-page="account"] .account-auth-form label:has(#accountEmail),
body[data-page="account"] .account-auth-form label:has(#accountPassword){grid-column:auto}
body[data-page="account"] .account-auth-submit{grid-column:1/-1;width:100%;min-height:48px}
body[data-page="account"] .account-auth-form .account-status{grid-column:1/-1;margin:0}
body[data-page="account"] .account-auth-note{margin:14px 0 0!important;padding-top:14px;border-top:1px solid var(--acc-line);font-size:.75rem!important;line-height:1.6!important}
body[data-page="account"] .account-auth-side{position:sticky;top:108px}
body[data-page="account"] .account-auth-side h2{margin:5px 0 14px;color:var(--acc-green);font:400 2rem/1.05 "DM Serif Display",serif}
body[data-page="account"] .account-auth-shop{display:inline-flex;margin-top:18px;color:var(--acc-green);font-weight:900;text-decoration:none;font-size:.78rem}
body[data-page="account"] .account-verify-card{min-height:360px}
body[data-page="account"] .account-auth-mark{width:50px;height:50px;display:grid;place-items:center;margin-bottom:14px;border-radius:16px;background:#eef3e9;color:var(--acc-green);font-size:1.35rem}
@media(max-width:900px){
  body[data-page="account"] .account-auth-layout{grid-template-columns:1fr}
  body[data-page="account"] .account-auth-side{position:static}
}
@media(max-width:620px){
  body[data-page="account"] .account-auth-card{padding:20px}
  body[data-page="account"] .account-auth-form{grid-template-columns:1fr}
  body[data-page="account"] .account-auth-submit,
  body[data-page="account"] .account-auth-form .account-status{grid-column:auto}
  body[data-page="account"] .account-auth-tabs{display:grid;grid-template-columns:1fr 1fr;width:100%}
}


/* ===== mobileauth2: Google/new-account completion ===== */
body[data-page="account"] .account-complete-card .account-auth-mark{
  background:#edf6ea;
  color:#166534;
  font-weight:900;
}
body[data-page="account"] .account-complete-card>p{
  max-width:680px;
}
body[data-page="account"] .account-complete-referral{
  grid-column:1/-1;
}
body[data-page="account"] .account-complete-signout{
  width:100%;
  min-height:44px;
  margin-top:10px;
  border:1px solid var(--acc-line);
  border-radius:12px;
  background:#fff;
  color:#54645a;
  font:800 .76rem "DM Sans",sans-serif;
  cursor:pointer;
}
body[data-page="account"] .account-complete-signout:hover{
  background:#f7f8f4;
  color:var(--acc-green);
}
@media(max-width:620px){
  body[data-page="account"] .account-complete-referral{
    grid-column:auto;
  }
  body[data-page="account"] .account-complete-card{
    padding:20px!important;
  }
  body[data-page="account"] .account-complete-card h1{
    font-size:clamp(2.15rem,10vw,3rem);
  }
}


/* ===== legalcheck1: safe mobile consent control ===== */
body[data-page="account"] .account-legal-consent{
  display:grid;
  gap:10px;
  margin:20px 0 14px;
  padding:13px 14px;
  border:1px solid var(--acc-line);
  border-radius:14px;
  background:#fafbf7;
  color:#526258;
  font-size:.73rem;
  line-height:1.55;
}
body[data-page="account"] .account-legal-toggle{
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  gap:10px;
  align-items:start;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
body[data-page="account"] .account-legal-toggle input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
body[data-page="account"] .account-legal-check{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  margin-top:1px;
  border:1.5px solid #aab6ad;
  border-radius:7px;
  background:#fff;
  color:transparent;
  font-size:.78rem;
  font-weight:900;
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease;
}
body[data-page="account"] .account-legal-toggle:has(input:checked) .account-legal-check{
  background:var(--acc-green);
  border-color:var(--acc-green);
  color:#fff;
}
body[data-page="account"] .account-legal-toggle:has(input:focus-visible) .account-legal-check{
  box-shadow:0 0 0 3px rgba(18,61,35,.14);
}
body[data-page="account"] .account-legal-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding-left:32px;
}
html[dir="rtl"] body[data-page="account"] .account-legal-links{
  padding-left:0;
  padding-right:32px;
}
body[data-page="account"] .account-legal-links a{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 10px;
  border:1px solid #d8e0d6;
  border-radius:999px;
  background:#fff;
  color:var(--acc-green);
  text-decoration:none;
  font-size:.66rem;
  font-weight:900;
  -webkit-tap-highlight-color:transparent;
}
body[data-page="account"] .account-legal-links a:hover,
body[data-page="account"] .account-legal-links a:focus-visible{
  border-color:#b8c9b9;
  background:#f1f6ee;
}
@media(max-width:620px){
  body[data-page="account"] .account-legal-consent{
    padding:12px;
  }
  body[data-page="account"] .account-legal-toggle{
    grid-template-columns:24px minmax(0,1fr);
    gap:9px;
    font-size:.76rem;
  }
  body[data-page="account"] .account-legal-check{
    width:24px;
    height:24px;
    border-radius:8px;
  }
  body[data-page="account"] .account-legal-links,
  html[dir="rtl"] body[data-page="account"] .account-legal-links{
    padding:0;
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  body[data-page="account"] .account-legal-links a{
    justify-content:center;
    min-height:40px;
    text-align:center;
  }
}


/* ===== mobileauth3: isolated, reliable account authentication ===== */
body[data-page="account"] #accountAuthForm,
body[data-page="account"] #accountAuthForm *{box-sizing:border-box}
body[data-page="account"] #accountAuthStatus,
body[data-page="account"] #accountVerifyStatus{min-height:1.25em;overflow-wrap:anywhere}
body[data-page="account"] .account-google[aria-busy="true"],
body[data-page="account"] .account-auth-submit[aria-busy="true"]{opacity:.65;cursor:wait}
body[data-page="account"] .account-legal-toggle input#accountLegalConsent{
  position:static;
  width:22px;
  height:22px;
  margin:1px 0 0;
  opacity:1;
  pointer-events:auto;
  appearance:auto;
  accent-color:var(--acc-green);
  flex:0 0 22px;
}
body[data-page="account"] .account-legal-toggle:has(#accountLegalConsent) .account-legal-check{display:none}
body[data-page="account"] .account-legal-toggle:has(#accountLegalConsent){
  grid-template-columns:22px minmax(0,1fr);
}
body[data-page="account"] .account-legal-toggle:has(#accountLegalConsent)>span:last-child{
  min-width:0;
  overflow-wrap:anywhere;
}

@media(max-width:760px){
  body[data-page="account"] .account-main{padding:18px 0 46px}
  body[data-page="account"] .account-main>.shell{width:min(100% - 20px,720px)}
  body[data-page="account"] .account-auth-layout{grid-template-columns:minmax(0,1fr);gap:12px}
  body[data-page="account"] .account-auth-card,
  body[data-page="account"] .account-auth-side{width:100%;min-width:0;border-radius:18px}
  body[data-page="account"] .account-auth-card{padding:18px}
  body[data-page="account"] .account-auth-card h1{font-size:clamp(2rem,10vw,2.75rem);line-height:1.02}
  body[data-page="account"] .account-auth-card>p{font-size:.84rem;line-height:1.58}
  body[data-page="account"] .account-auth-tabs{
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
    gap:5px;
    margin-bottom:15px;
    padding:4px;
    border-radius:14px;
  }
  body[data-page="account"] .account-auth-tabs button{
    width:100%;
    min-width:0;
    min-height:46px;
    padding:0 10px;
    border-radius:11px;
    font-size:.78rem;
    white-space:normal;
    line-height:1.25;
  }
  body[data-page="account"] .account-legal-consent{
    margin:16px 0 13px;
    padding:13px;
    border-radius:14px;
    font-size:.79rem;
    line-height:1.55;
  }
  body[data-page="account"] .account-legal-toggle{
    grid-template-columns:24px minmax(0,1fr)!important;
    gap:10px;
    align-items:start;
  }
  body[data-page="account"] .account-legal-toggle input#accountLegalConsent{
    width:24px;
    height:24px;
    min-width:24px;
    margin-top:0;
  }
  body[data-page="account"] .account-legal-links,
  html[dir="rtl"] body[data-page="account"] .account-legal-links{
    padding:0;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  body[data-page="account"] .account-legal-links a{
    width:100%;
    min-width:0;
    min-height:44px;
    padding:8px 10px;
    border-radius:11px;
    line-height:1.25;
    text-align:center;
    overflow-wrap:anywhere;
  }
  body[data-page="account"] .account-google{
    min-height:50px;
    border-radius:13px;
    font-size:.84rem;
  }
  body[data-page="account"] .account-auth-form{
    grid-template-columns:minmax(0,1fr);
    gap:12px;
  }
  body[data-page="account"] .account-auth-form label,
  body[data-page="account"] .account-auth-form label:has(#accountEmail),
  body[data-page="account"] .account-auth-form label:has(#accountPassword){
    grid-column:auto;
    min-width:0;
  }
  body[data-page="account"] .account-auth-form input{
    width:100%;
    min-width:0;
    min-height:50px;
    padding:0 13px;
    border-radius:12px;
    font-size:16px;
    line-height:1.2;
  }
  body[data-page="account"] .account-auth-submit{
    grid-column:auto;
    min-height:50px;
    border-radius:13px;
    font-size:.82rem;
  }
  body[data-page="account"] .account-auth-note{font-size:.77rem!important}
  body[data-page="account"] .account-auth-side{position:static;padding:18px}
  body[data-page="account"] .account-auth-side h2{font-size:1.75rem}
  body[data-page="account"] .account-benefits{gap:9px}
  body[data-page="account"] .account-benefits span{align-items:flex-start;line-height:1.45}
  body[data-page="account"] .account-complete-card{padding:18px!important}
  body[data-page="account"] .account-complete-signout{min-height:48px}
}

@media(max-width:430px){
  body[data-page="account"] .account-main>.shell{width:min(100% - 14px,720px)}
  body[data-page="account"] .account-auth-card{padding:15px}
  body[data-page="account"] .account-auth-card h1{font-size:clamp(1.9rem,11vw,2.45rem)}
  body[data-page="account"] .account-legal-links,
  html[dir="rtl"] body[data-page="account"] .account-legal-links{grid-template-columns:1fr}
  body[data-page="account"] .account-google strong{min-width:0;overflow-wrap:anywhere}
}

/* Signed-in dashboard: keep the mobile stack after all desktop refinements.
   The earlier 980px rule was overridden by the later 250px sidebar layout. */
body[data-page="account"] .account-layout,
body[data-page="account"] .account-layout *{box-sizing:border-box}
body[data-page="account"] .account-layout>*,
body[data-page="account"] .account-panel>*,
body[data-page="account"] .account-card,
body[data-page="account"] .account-stat{min-width:0}
body[data-page="account"] .account-layout :is(h1,h2,h3,p,strong,small,label){overflow-wrap:anywhere}

@media(max-width:980px){
  body[data-page="account"] .account-layout{grid-template-columns:minmax(0,1fr);gap:14px}
  body[data-page="account"] .account-side{position:static;min-width:0;padding:14px}
  body[data-page="account"] .account-side .account-identity{display:flex;margin:0 0 12px;padding:0 0 12px;gap:10px}
  body[data-page="account"] .account-identity>div{min-width:0}
  body[data-page="account"] .account-avatar{flex:0 0 40px;width:40px;height:40px}
  body[data-page="account"] .account-identity small{max-width:100%;white-space:normal;overflow-wrap:anywhere}
  body[data-page="account"] .account-side-note{display:none}
  body[data-page="account"] .account-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;gap:8px;margin:0;padding:0}
  body[data-page="account"] .account-tabs button{width:100%;min-width:0;white-space:normal;min-height:48px;line-height:1.35;padding:9px;text-align:start}
  body[data-page="account"] .account-tabs button>span:last-child{min-width:0;overflow-wrap:anywhere}
  body[data-page="account"] .account-content{min-width:0;width:100%}
}
@media(max-width:700px){
  body[data-page="account"] .account-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  body[data-page="account"] .account-tabs button{font-size:.82rem;gap:7px}
  body[data-page="account"] .account-hero{flex-direction:column;align-items:stretch;min-height:0;padding:20px;gap:14px}
  body[data-page="account"] .account-hero>div{min-width:0}
  body[data-page="account"] .account-hero h1{font-size:clamp(1.8rem,8vw,2.6rem);line-height:1.1}
  body[data-page="account"] .account-hero p{font-size:.875rem;line-height:1.5}
  body[data-page="account"] .account-balance{min-width:0;width:100%;text-align:start;padding:12px 14px}
  body[data-page="account"] .account-balance strong{font-size:1.65rem}
  body[data-page="account"] .account-balance em{font-size:.78rem}
  body[data-page="account"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="referrals"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="points"] .account-card:first-child .account-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  body[data-page="account"] .account-stat{min-height:96px;padding:13px}
  body[data-page="account"] .account-stat small{font-size:.78rem;line-height:1.45}
  body[data-page="account"] .account-stat strong{font-size:1.2rem;line-height:1.35}
  body[data-page="account"] .account-panel>.account-card{padding:16px}
  body[data-page="account"] .account-section-title{align-items:stretch;gap:12px}
  body[data-page="account"] .account-section-title h2{font-size:1.6rem;line-height:1.2}
  body[data-page="account"] .account-card p{font-size:.875rem;line-height:1.6}
  body[data-page="account"] .account-wallet-grid,
  body[data-page="account"] .account-reward-grid,
  body[data-page="account"] .account-security,
  body[data-page="account"] .account-form{grid-template-columns:minmax(0,1fr)}
  body[data-page="account"] .account-form input,
  body[data-page="account"] .account-form select{min-width:0;min-height:48px;font:600 16px/1.4 "DM Sans",sans-serif}
  body[data-page="account"] .account-form label{font-size:.82rem;line-height:1.5}
  body[data-page="account"] .account-primary,
  body[data-page="account"] .account-actions :is(a,button){min-height:46px;max-width:100%;white-space:normal;padding:10px 14px;line-height:1.4;text-align:center}
  body[data-page="account"] .account-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
  body[data-page="account"] .account-pill{max-width:100%;white-space:normal;line-height:1.4}
}


/* ===== account10: mobile dashboard visibility + compact navigation ===== */
@media(max-width:700px){
  body[data-page="account"] .account-main{padding:12px 0 38px}
  body[data-page="account"] .account-main>.shell{width:min(100% - 12px,720px)}
  body[data-page="account"] .account-layout{gap:10px}
  body[data-page="account"] .account-side{padding:8px 8px 9px;border-radius:15px;overflow:hidden}
  body[data-page="account"] .account-side .account-identity{
    display:flex!important;
    align-items:center;
    gap:9px;
    margin:0 0 8px;
    padding:2px 3px 9px;
    border-bottom:1px solid var(--acc-line)
  }
  body[data-page="account"] .account-side .account-avatar{width:36px;height:36px;flex:0 0 36px}
  body[data-page="account"] .account-side .account-identity>div{min-width:0}
  body[data-page="account"] .account-side .account-identity strong{font-size:.82rem;line-height:1.25}
  body[data-page="account"] .account-side .account-identity small{
    max-width:100%;
    font-size:.7rem;
    line-height:1.3;
    white-space:normal;
    overflow-wrap:anywhere
  }
  body[data-page="account"] .account-tabs{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px;
    margin:0;
    padding:0;
    overflow:visible!important;
  }
  body[data-page="account"] .account-tabs button{
    width:100%!important;
    min-width:0;
    min-height:46px;
    padding:8px 9px;
    gap:7px;
    border:1px solid var(--acc-line);
    border-radius:12px;
    background:#fff;
    white-space:normal!important;
    font-size:.78rem;
    line-height:1.25;
    text-align:start;
  }
  body[data-page="account"] .account-tabs button:last-child{grid-column:1/-1}
  body[data-page="account"] .account-tabs button.is-active{
    background:#eaf2e5;
    border-color:rgba(18,61,35,.14);
    box-shadow:none!important;
  }
  body[data-page="account"] .account-tab-icon{
    width:25px;height:25px;flex:0 0 25px;border-radius:8px;font-size:.78rem
  }
  body[data-page="account"] .account-content{display:block;width:100%}
  body[data-page="account"] .account-hero{
    margin-bottom:10px;
    padding:15px;
    gap:11px;
    border-radius:17px;
    box-shadow:0 10px 28px rgba(18,61,35,.12)
  }
  body[data-page="account"] .account-hero h1{
    font-size:clamp(1.72rem,8vw,2.2rem);
    line-height:1.06
  }
  body[data-page="account"] .account-hero p{
    margin-top:6px;
    font-size:.79rem;
    line-height:1.42
  }
  body[data-page="account"] .account-balance{
    padding:10px 12px;
    border-radius:14px
  }
  body[data-page="account"] .account-balance strong{
    font-size:1.42rem;
    line-height:1.2
  }
  body[data-page="account"] .account-balance em{
    margin-top:4px;
    font-size:.72rem
  }
  body[data-page="account"] .account-panel{gap:10px}
  body[data-page="account"] .account-panel>.account-card{padding:13px;border-radius:16px}
  body[data-page="account"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="referrals"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="points"] .account-card:first-child .account-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px
  }
  body[data-page="account"] .account-stat{
    min-height:82px;
    padding:11px;
    border-radius:14px
  }
  body[data-page="account"] .account-stat small{font-size:.72rem;line-height:1.35}
  body[data-page="account"] .account-stat strong{font-size:1.08rem;line-height:1.25}
  body[data-page="account"] .account-section-title{gap:8px}
  body[data-page="account"] .account-section-title h2{font-size:1.42rem;line-height:1.12}
  body[data-page="account"] .account-section-title p{font-size:.78rem;line-height:1.45}
  body[data-page="account"] .account-card p{font-size:.82rem;line-height:1.5}
  body[data-page="account"] .account-row{min-height:0;padding:11px;border-radius:13px}
  body[data-page="account"] .account-actions{margin-top:14px}
}
@media(max-width:390px){
  body[data-page="account"] .account-main>.shell{width:min(100% - 8px,720px)}
  body[data-page="account"] .account-hero{padding:13px}
  body[data-page="account"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="referrals"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="points"] .account-card:first-child .account-grid{
    grid-template-columns:minmax(0,1fr)
  }
}


/* ===== account11: dashboard visual pass ===== */
body[data-page="account"]{
  --acc-card-radius:22px;
  --acc-card-shadow:0 12px 30px rgba(18,61,35,.05);
  --acc-soft-surface:#f7f8f4;
}
body[data-page="account"] .account-main>.shell{
  width:min(100% - 32px,1400px);
}
body[data-page="account"] .account-layout{
  grid-template-columns:260px minmax(0,1fr);
  gap:24px;
  align-items:start;
}
body[data-page="account"] .account-side{
  padding:20px 18px 18px;
  border-radius:24px;
  background:rgba(255,255,255,.96);
  box-shadow:0 18px 42px rgba(18,61,35,.065);
}
body[data-page="account"] .account-identity{
  gap:12px;
  margin:0 0 12px;
  padding:0 2px 18px;
  border-bottom:1px solid var(--acc-line);
}
body[data-page="account"] .account-avatar{
  width:50px;
  height:50px;
  flex:0 0 50px;
  font-size:1.05rem;
  box-shadow:0 6px 18px rgba(18,61,35,.13);
}
body[data-page="account"] .account-identity>div{min-width:0}
body[data-page="account"] .account-identity strong{
  font-size:.98rem;
  line-height:1.25;
}
body[data-page="account"] .account-identity small{
  max-width:168px;
  margin-top:4px;
  font-size:.75rem;
  line-height:1.35;
  color:#77837b;
}
body[data-page="account"] .account-tabs{gap:6px}
body[data-page="account"] .account-tabs button{
  min-height:52px;
  padding:8px 10px;
  gap:11px;
  border:1px solid transparent;
  border-radius:14px;
  font-size:.82rem;
  line-height:1.25;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
body[data-page="account"] .account-tabs button:hover{
  background:#f5f7f2;
  border-color:rgba(18,61,35,.09);
  transform:translateY(-1px);
}
body[data-page="account"] .account-tabs button.is-active{
  background:#edf4e9;
  border-color:rgba(18,61,35,.12);
  box-shadow:inset 3px 0 0 var(--acc-green);
}
html[dir="rtl"] body[data-page="account"] .account-tabs button.is-active{
  box-shadow:inset -3px 0 0 var(--acc-green);
}
body[data-page="account"] .account-tab-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border-radius:10px;
  background:#f4f6f2;
  font-size:.88rem;
}
body[data-page="account"] .account-tabs button.is-active .account-tab-icon{
  background:#dfeadc;
}
body[data-page="account"] .account-side-note{
  gap:6px;
  margin-top:16px;
  padding:15px 3px 1px;
}
body[data-page="account"] .account-sync{
  width:max-content;
  max-width:100%;
  padding:5px 8px;
  border-radius:999px;
  background:#f1f7ee;
  color:#3e6047;
  font-size:.69rem;
}
body[data-page="account"] .account-side-note small{
  padding-inline:5px;
  font-size:.66rem;
  color:#7a867e;
}

body[data-page="account"] .account-content{min-width:0}
body[data-page="account"] .account-panel{gap:16px}
body[data-page="account"] .account-card{
  padding:26px;
  border-radius:var(--acc-card-radius);
  border-color:rgba(18,61,35,.11);
  background:rgba(255,255,255,.96);
  box-shadow:var(--acc-card-shadow);
}
body[data-page="account"] .account-section-title{
  align-items:flex-start;
  gap:16px;
}
body[data-page="account"] .account-section-title>div{min-width:0}
body[data-page="account"] .account-section-title h2{
  font-size:clamp(1.72rem,2vw,2.05rem);
  line-height:1.04;
  letter-spacing:-.015em;
}
body[data-page="account"] .account-section-title p{
  max-width:72ch;
  margin-top:7px;
  font-size:.82rem;
  line-height:1.55;
  color:#77837b;
}
body[data-page="account"] .account-grid{gap:12px}
body[data-page="account"] .account-stat{
  min-height:106px;
  padding:18px;
  border-radius:17px;
  background:linear-gradient(180deg,#fff 0%,#fafbf8 100%);
  box-shadow:0 7px 20px rgba(18,61,35,.025);
}
body[data-page="account"] .account-stat small{
  font-size:.74rem;
  line-height:1.35;
}
body[data-page="account"] .account-stat strong{
  margin-top:8px;
  font-size:1.35rem;
  line-height:1.22;
}
body[data-page="account"] .account-progress{
  height:10px;
  margin-top:16px;
  background:#e7ece2;
}
body[data-page="account"] .account-row{
  min-height:66px;
  padding:15px 16px;
  border-radius:15px;
  background:#fdfdfb;
}
body[data-page="account"] .account-row strong{line-height:1.25}
body[data-page="account"] .account-row small{
  margin-top:5px;
  line-height:1.45;
}
body[data-page="account"] .account-primary{
  min-height:42px;
  padding-inline:16px;
}

body[data-page="account"] .customer-latest-order{
  margin-top:0!important;
}
body[data-page="account"] .customer-latest-body{
  gap:10px;
  margin-top:16px;
}
body[data-page="account"] .customer-latest-body>span{
  min-width:0;
  padding:13px 14px;
  border-radius:14px;
  background:var(--acc-soft-surface);
}
body[data-page="account"] .customer-latest-body small{
  font-size:.69rem;
  line-height:1.3;
}
body[data-page="account"] .customer-latest-body strong{
  margin-top:5px;
  font-size:.93rem;
  line-height:1.3;
}
body[data-page="account"] .customer-latest-body .account-primary{
  min-height:44px;
  white-space:nowrap;
}
body[data-page="account"] .account-panel[data-account-panel="overview"]>.account-card{
  overflow:hidden;
}

@media(min-width:981px){
  body[data-page="account"] .account-side{
    position:sticky;
    top:108px;
  }
}

@media(max-width:980px){
  body[data-page="account"] .account-main>.shell{
    width:min(100% - 24px,900px);
  }
  body[data-page="account"] .account-layout{
    grid-template-columns:minmax(0,1fr);
    gap:14px;
  }
  body[data-page="account"] .account-side{
    position:static;
    padding:14px;
    border-radius:20px;
  }
  body[data-page="account"] .account-side .account-identity{
    display:flex;
    margin:0 0 12px;
    padding:0 0 12px;
  }
  body[data-page="account"] .account-identity small{
    max-width:min(66vw,480px);
    white-space:nowrap;
  }
  body[data-page="account"] .account-side-note{display:none}
  body[data-page="account"] .account-tabs{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    overflow:visible;
  }
  body[data-page="account"] .account-tabs button{
    width:100%;
    min-width:0;
    min-height:48px;
    padding:8px 9px;
    white-space:normal;
  }
  body[data-page="account"] .account-tab-icon{
    width:29px;
    height:29px;
    flex-basis:29px;
  }
}

@media(max-width:700px){
  body[data-page="account"] .account-main{
    padding:12px 0 38px;
  }
  body[data-page="account"] .account-main>.shell{
    width:min(100% - 14px,720px);
  }
  body[data-page="account"] .account-side{
    padding:10px;
    border-radius:17px;
  }
  body[data-page="account"] .account-side .account-identity{
    gap:10px;
    margin-bottom:9px;
    padding:1px 2px 10px;
  }
  body[data-page="account"] .account-side .account-avatar{
    width:40px;
    height:40px;
    flex-basis:40px;
  }
  body[data-page="account"] .account-side .account-identity strong{
    font-size:.86rem;
  }
  body[data-page="account"] .account-side .account-identity small{
    max-width:100%;
    font-size:.71rem;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
  }
  body[data-page="account"] .account-tabs{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px;
  }
  body[data-page="account"] .account-tabs button,
  body[data-page="account"] .account-tabs button:last-child{
    grid-column:auto;
    min-height:47px;
    padding:7px 8px;
    gap:7px;
    border:1px solid var(--acc-line);
    border-radius:12px;
    background:#fff;
    font-size:.77rem;
    line-height:1.22;
  }
  body[data-page="account"] .account-tabs button.is-active{
    background:#edf4e9;
    border-color:rgba(18,61,35,.14);
    box-shadow:none;
  }
  html[dir="rtl"] body[data-page="account"] .account-tabs button.is-active{
    box-shadow:none;
  }
  body[data-page="account"] .account-tab-icon{
    width:27px;
    height:27px;
    flex-basis:27px;
    font-size:.76rem;
  }
  body[data-page="account"] .account-panel{gap:10px}
  body[data-page="account"] .account-panel>.account-card{
    padding:16px;
    border-radius:17px;
  }
  body[data-page="account"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="referrals"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="points"] .account-card:first-child .account-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  body[data-page="account"] .account-stat{
    min-height:86px;
    padding:12px;
    border-radius:14px;
  }
  body[data-page="account"] .account-stat small{
    font-size:.72rem;
  }
  body[data-page="account"] .account-stat strong{
    margin-top:6px;
    font-size:1.1rem;
  }
  body[data-page="account"] .account-section-title{
    align-items:stretch;
    gap:10px;
  }
  body[data-page="account"] .account-section-title h2{
    font-size:1.48rem;
    line-height:1.1;
  }
  body[data-page="account"] .account-section-title p{
    margin-top:5px;
    font-size:.78rem;
    line-height:1.48;
  }
  body[data-page="account"] .account-row{
    padding:12px;
    border-radius:13px;
  }
  body[data-page="account"] .customer-latest-body{
    margin-top:12px;
  }
}

@media(max-width:420px){
  body[data-page="account"] .account-main>.shell{
    width:min(100% - 10px,720px);
  }
  body[data-page="account"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="referrals"] .account-grid,
  body[data-page="account"] .account-panel[data-account-panel="points"] .account-card:first-child .account-grid{
    grid-template-columns:minmax(0,1fr);
  }
}


/* ===== account12: single-column sidebar navigation + touch reliability ===== */
body[data-page="account"] .account-layout{
  grid-template-columns:280px minmax(0,1fr);
  gap:24px;
}
body[data-page="account"] .account-side{
  min-width:0;
  padding:20px 18px;
}
body[data-page="account"] .account-tabs{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:8px!important;
  overflow:visible!important;
}
body[data-page="account"] .account-tabs button,
body[data-page="account"] .account-tabs button:last-child{
  grid-column:auto!important;
  width:100%!important;
  min-width:0!important;
  min-height:54px;
  padding:9px 12px;
  gap:11px;
  justify-content:flex-start;
  border:1px solid transparent;
  border-radius:14px;
  font-size:.84rem;
  line-height:1.25;
  text-align:start;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
body[data-page="account"] .account-tabs button>span:last-child{
  min-width:0;
  overflow-wrap:anywhere;
}
body[data-page="account"] .account-tab-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
}
body[data-page="account"] .account-tabs button:focus-visible{
  outline:3px solid rgba(18,61,35,.16);
  outline-offset:2px;
}
body[data-page="account"] .account-tabs button.is-active{
  background:#edf4e9;
  border-color:rgba(18,61,35,.14);
  box-shadow:inset 3px 0 0 var(--acc-green);
}
html[dir="rtl"] body[data-page="account"] .account-tabs button{
  justify-content:flex-start;
  text-align:start;
}
html[dir="rtl"] body[data-page="account"] .account-tabs button.is-active{
  box-shadow:inset -3px 0 0 var(--acc-green);
}
@media(max-width:980px){
  body[data-page="account"] .account-layout{
    grid-template-columns:minmax(0,1fr);
    gap:14px;
  }
  body[data-page="account"] .account-side{
    position:static;
    padding:14px;
    border-radius:20px;
  }
  body[data-page="account"] .account-tabs{
    grid-template-columns:minmax(0,1fr)!important;
    gap:7px!important;
  }
  body[data-page="account"] .account-tabs button,
  body[data-page="account"] .account-tabs button:last-child{
    min-height:52px;
    padding:8px 11px;
    border-color:var(--acc-line);
    background:#fff;
  }
  body[data-page="account"] .account-tabs button.is-active{
    background:#edf4e9;
  }
}
@media(max-width:700px){
  body[data-page="account"] .account-side{
    padding:10px;
    border-radius:17px;
  }
  body[data-page="account"] .account-tabs{
    grid-template-columns:minmax(0,1fr)!important;
    gap:6px!important;
  }
  body[data-page="account"] .account-tabs button,
  body[data-page="account"] .account-tabs button:last-child{
    min-height:50px;
    padding:8px 10px;
    gap:9px;
    border-radius:12px;
    font-size:.82rem;
  }
  body[data-page="account"] .account-tab-icon{
    width:30px;
    height:30px;
    flex:0 0 30px;
    border-radius:9px;
    font-size:.8rem;
  }
}


/* ===== account13: auth recovery + bonus/retry states ===== */
body[data-page="account"] .account-recovery-actions{
  margin-top:10px;
}
body[data-page="account"] .account-sync-warning{
  margin-bottom:16px;
}
body[data-page="account"] .account-bonus-grid{
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:14px;
  margin-top:16px;
}
body[data-page="account"] .account-bonus-grid>section{
  min-width:0;
  padding:18px;
  border:1px solid var(--acc-line);
  border-radius:16px;
  background:var(--acc-soft-surface,#f7f8f4);
}
body[data-page="account"] .account-bonus-grid>section>strong{
  display:block;
  color:var(--acc-green);
  font-size:.92rem;
  line-height:1.4;
}
body[data-page="account"] .account-review-form{
  margin-top:14px;
}
body[data-page="account"] .account-form textarea,
body[data-page="account"] .account-auth-form textarea{
  width:100%;
  min-height:112px;
  resize:vertical;
  border:1px solid var(--acc-line);
  border-radius:12px;
  background:#fff;
  padding:11px 12px;
  color:#243c2c;
  font:600 .84rem/1.5 "DM Sans",sans-serif;
}
@media(max-width:760px){
  body[data-page="account"] .account-bonus-grid{
    grid-template-columns:minmax(0,1fr);
    gap:10px;
  }
  body[data-page="account"] .account-bonus-grid>section{
    padding:14px;
  }
  body[data-page="account"] .account-form textarea,
  body[data-page="account"] .account-auth-form textarea{
    min-height:120px;
    font-size:16px;
  }
}