.accountPage{display:none}.accountPage.active{display:block}.accountPageHero{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;margin-bottom:14px;padding:20px;border:1px solid color-mix(in srgb,var(--accent) 55%,var(--line));border-radius:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 14%,var(--panel)),var(--panel));box-shadow:0 16px 34px rgba(0,0,0,.14)}.accountPageHero>div:nth-child(2)>span,.accountProfileDialog header span,.accountPlanCard>div>span{color:var(--accent2);font-size:.69rem;font-weight:900;letter-spacing:.11em}.accountPageHero h1{margin:3px 0;font-size:1.45rem}.accountPageHero p{margin:0;color:var(--muted)}.accountPageAvatar,.accountProfileAvatar{display:grid;place-items:center;width:58px;height:58px;overflow:hidden;border:2px solid color-mix(in srgb,var(--accent) 70%,white);border-radius:18px;background:var(--accent-soft);color:var(--accent2);font-weight:900}.accountPageAvatar img,.accountProfileAvatar img{width:100%;height:100%;object-fit:cover}.accountPage .accountCard{margin:0}.accountPage .accountManagePanel{display:block!important}.accountPage .accountCard>h2{display:none}.accountProfileBackdrop{position:fixed;z-index:5000;inset:0;display:grid;place-items:center;padding:24px;background:rgba(4,8,14,.75);backdrop-filter:blur(12px)}.accountProfileDialog{width:min(960px,100%);max-height:min(900px,calc(100vh - 36px));overflow:auto;border:1px solid color-mix(in srgb,var(--accent) 66%,var(--line));border-radius:24px;background:var(--panel);box-shadow:0 30px 90px rgba(0,0,0,.5)}.accountProfileDialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 24px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 16%,var(--panel)),var(--panel))}.accountProfileDialog header h2{margin:5px 0;font-size:1.35rem}.accountProfileDialog header p{max-width:650px;margin:0;color:var(--muted)}.accountProfileClose{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--line);border-radius:50%;background:var(--surface-input);color:var(--text);font-size:1.5rem}.accountProfileForm{padding:22px 24px}.accountProfileIntro{display:flex;align-items:center;gap:14px;margin-bottom:18px;padding:14px;border:1px solid var(--line);border-radius:17px;background:var(--surface-raised)}.accountProfileIntro>div:last-child{display:grid;gap:2px}.accountProfileIntro span,.accountProfileIntro small{color:var(--muted)}.accountProfileGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.accountProfileGrid>div{display:grid;gap:6px}.accountProfileGrid input{width:100%}.accountProfileGrid input[readonly]{opacity:.72}.accountProfileGrid small{color:var(--muted)}.accountPlanCard{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:18px;padding:16px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:17px;background:var(--accent-soft)}.accountPlanCard strong{display:block;margin:3px 0;font-size:1.2rem}.accountPlanCard p{margin:0;color:var(--muted)}.accountPlanCard .btn{font-weight:600}.accountPlanCard .btn small{display:block;font-size:.62rem}.accountPreferenceCard{display:grid;gap:9px;margin-top:14px;padding:16px;border:1px solid var(--line);border-radius:17px;background:var(--surface-raised)}.accountPreferenceCard h3{margin:0 0 3px}.accountPreferenceCard label{display:flex;align-items:center;gap:9px;font-weight:600}.accountPreferenceCard input{width:17px;height:17px;accent-color:var(--accent)}.accountProfileActions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.accountProfileActions .btn{min-width:180px;min-height:47px}@media(max-width:620px){.accountPageHero{grid-template-columns:auto minmax(0,1fr);padding:15px}.accountPageHero>.btn{grid-column:1/-1;width:100%}.accountProfileBackdrop{padding:10px}.accountProfileDialog{max-height:calc(100vh - 20px);border-radius:18px}.accountProfileDialog>header,.accountProfileForm{padding:17px}.accountProfileGrid{grid-template-columns:1fr}.accountPlanCard{align-items:stretch;flex-direction:column}.accountProfileActions{display:grid;grid-template-columns:1fr}.accountProfileActions .btn{min-width:0}}
.accountPageHero{scroll-margin-top:16px}.accountPageHero:focus{outline:none}.accountPagePlanCard{margin:0 0 14px}.accountSignOutOnly{display:flex!important;justify-content:center}.accountSignOutOnly .btn{width:min(430px,100%)}
.accountProfileGrid select{width:100%;min-height:48px}.accountAvatarUploadField{align-content:start}.accountAvatarUpload{display:flex;align-items:center;gap:9px;min-height:58px}.accountAvatarUploadPreview{display:grid;place-items:center;width:54px;height:54px;flex:0 0 54px;overflow:hidden;border:2px solid color-mix(in srgb,var(--accent) 70%,white);border-radius:16px;background:var(--accent-soft);color:var(--accent2);font-weight:900}.accountAvatarUploadPreview img{width:100%;height:100%;object-fit:cover}.accountAvatarChoose,.accountAvatarRemove{display:inline-flex!important;align-items:center;justify-content:center;min-height:42px;padding:9px 13px;cursor:pointer}.accountAvatarRemove[hidden]{display:none!important}
@media(max-width:620px){.accountAvatarUpload{flex-wrap:wrap}.accountAvatarChoose,.accountAvatarRemove{flex:1}.accountPagePlanCard{align-items:stretch;flex-direction:column}}

.accountProfileGrid>div{align-content:start;gap:3px}.accountProfileGrid>div>label{margin:0!important}.accountProfileGrid .themedSelect{height:52px;min-height:52px}.accountProfileGrid .themedSelectButton{height:52px;min-height:52px;padding:0 0 0 14px!important;border-radius:14px!important}.accountProfileGrid .themedSelectButton svg{align-self:stretch!important;width:42px!important;height:50px!important;flex:0 0 42px!important;margin:0!important;padding:12px!important;border-left:1px solid var(--edge-strong,var(--line))!important;border-radius:0 13px 13px 0;background:color-mix(in srgb,var(--accent) 7%,var(--surface-raised))!important}
.accountBenefits{margin:4px 0 10px;padding:22px 18px 18px;border:1px solid color-mix(in srgb,var(--accent) 58%,var(--line));border-radius:19px;background:radial-gradient(circle at 50% 0,color-mix(in srgb,var(--accent) 8%,transparent),transparent 45%),var(--surface-input);box-shadow:inset 0 0 38px rgba(0,0,0,.12)}.accountBenefitGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}.accountBenefitGrid article{position:relative;display:grid;justify-items:center;align-content:start;gap:7px;min-width:0;padding:5px 15px;text-align:center}.accountBenefitGrid article+article::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:1px;background:linear-gradient(transparent,var(--accent),transparent)}.accountBenefitIcon{display:grid;place-items:center;width:64px;height:64px;margin-bottom:3px;border:1px solid color-mix(in srgb,var(--accent) 70%,var(--line));border-radius:50%;background:color-mix(in srgb,var(--accent) 8%,var(--surface-raised));color:var(--accent2);filter:drop-shadow(0 0 10px color-mix(in srgb,var(--accent) 22%,transparent))}.accountBenefitIcon img{width:42px;height:42px}.accountBenefitIcon svg{width:45px;height:45px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.accountBenefitGrid strong{font-size:.88rem}.accountBenefitGrid p{margin:0;color:var(--muted);font-size:.73rem;line-height:1.4}.accountBenefitSummary{margin:20px 0 0;color:var(--muted);font-size:.83rem;line-height:1.48;text-align:center}.accountBenefitSummary em{color:var(--accent2);font-style:normal}.accountPage .accountCard>#accountSignedOutActions,.accountPage .accountCard>#accountSignedInActions{margin-inline:auto}
@media(max-width:760px){.accountBenefitGrid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:18px}.accountBenefitGrid article:nth-child(3)::before{display:none}.accountBenefitGrid article:nth-child(n+3){padding-top:10px}.accountBenefits{padding-inline:10px}.accountBenefitSummary br{display:none}}
@media(max-width:430px){.accountBenefitGrid{grid-template-columns:1fr}.accountBenefitGrid article+article::before{left:18%;right:18%;top:-9px;bottom:auto;width:auto;height:1px}.accountBenefitGrid article:nth-child(3)::before{display:block}.accountBenefitGrid article{padding:9px 12px}.accountBenefitIcon{width:56px;height:56px}.accountBenefitIcon svg{width:39px;height:39px}}

/* Supplied account-benefit artwork: theme-driven metallic fill, halo, depth, and motion. */
.accountBenefitAsset{
  --account-icon:none;
  position:relative;
  isolation:isolate;
  overflow:visible;
  background:
    radial-gradient(circle at 31% 24%,color-mix(in srgb,var(--accent2) 24%,white),transparent 30%),
    linear-gradient(145deg,color-mix(in srgb,var(--accent) 13%,var(--surface-raised)),color-mix(in srgb,var(--surface-input) 93%,black));
  border-color:color-mix(in srgb,var(--accent) 72%,var(--line));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb,var(--accent2) 34%,white),
    inset 0 -8px 16px rgba(0,0,0,.18),
    0 8px 22px rgba(0,0,0,.2),
    0 0 17px color-mix(in srgb,var(--accent) 25%,transparent);
  filter:none;
  transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease;
}
.accountBenefitAsset::before{
  content:"";
  position:absolute;
  inset:11px;
  z-index:2;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent2) 78%,white) 4%,var(--accent) 52%,color-mix(in srgb,var(--accent) 70%,black) 100%);
  -webkit-mask:var(--account-icon) center/contain no-repeat;
  mask:var(--account-icon) center/contain no-repeat;
  filter:drop-shadow(0 2px 1px rgba(0,0,0,.42)) drop-shadow(0 0 6px color-mix(in srgb,var(--accent) 62%,transparent));
}
.accountBenefitAsset::after{
  content:"";
  position:absolute;
  inset:5px;
  z-index:1;
  border:1px solid color-mix(in srgb,var(--accent2) 28%,transparent);
  border-radius:50%;
  background:conic-gradient(from 215deg,transparent 0 31%,color-mix(in srgb,var(--accent2) 30%,transparent) 39%,transparent 49% 78%,color-mix(in srgb,var(--accent) 22%,transparent) 88%,transparent);
  opacity:.68;
  transition:transform .55s cubic-bezier(.2,.8,.2,1),opacity .28s ease;
}
.accountBenefitFilament{--account-icon:url("images/account-filament-profiles.svg")}
.accountBenefitBackup{--account-icon:url("images/account-backup.svg")}
.accountBenefitAnywhere{--account-icon:url("images/account-from-anywhere.svg")}
/* Project Library. This tile used to render <img src="images/google-logo.svg"> instead of joining the
   masked-asset set — a leftover from when signing in meant Google specifically. The provider-neutral
   sweep stopped showing that mark (it is a project feature, not a Google one) and nothing replaced it,
   which left a visibly EMPTY circle beside three drawn siblings. */
.accountBenefitProjects{--account-icon:url("images/account-projects.svg")}
.accountBenefitBackup::before{inset:10px}
.accountBenefitGrid article:hover .accountBenefitAsset,
.accountBenefitGrid article:focus-within .accountBenefitAsset{
  transform:translateY(-3px) scale(1.045);
  border-color:color-mix(in srgb,var(--accent2) 70%,var(--accent));
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--accent2) 45%,white),inset 0 -8px 16px rgba(0,0,0,.16),0 11px 25px rgba(0,0,0,.24),0 0 23px color-mix(in srgb,var(--accent) 42%,transparent);
}
.accountBenefitGrid article:hover .accountBenefitAsset::after,
.accountBenefitGrid article:focus-within .accountBenefitAsset::after{transform:rotate(32deg);opacity:1}
@media(max-width:430px){.accountBenefitAsset::before{inset:10px}.accountBenefitBackup::before{inset:9px}}
@media(prefers-reduced-motion:reduce){.accountBenefitAsset,.accountBenefitAsset::after{transition:none!important}}

/* Signed-out calculator benefits and restrained icon treatment matching Google. */
.calculatorAccountBenefits{margin:16px 0 0;padding:22px 18px}.calculatorAccountBenefits.hidden{display:none!important}
.accountBenefitsHeading{margin:0 auto 22px;text-align:center}.accountBenefitsHeading>span,.signedOutProPromo>div:nth-child(2)>span{color:var(--accent2);font-size:.69rem;font-weight:900;letter-spacing:.12em}.accountBenefitsHeading h2{margin:4px 0 5px;font-size:clamp(1.2rem,3vw,1.55rem)}.accountBenefitsHeading p{margin:0;color:var(--muted);font-size:.88rem}
.accountBenefitAsset{
  overflow:hidden;
  background:color-mix(in srgb,var(--accent) 8%,var(--surface-raised));
  border-color:color-mix(in srgb,var(--accent) 70%,var(--line));
  box-shadow:none;
  filter:drop-shadow(0 0 10px color-mix(in srgb,var(--accent) 22%,transparent));
  transition:transform .24s cubic-bezier(.2,.8,.2,1),border-color .24s ease,filter .24s ease;
}
.accountBenefitAsset::before{
  inset:10px;
  background:var(--accent2);
  filter:none;
  transition:transform .3s cubic-bezier(.2,.8,.2,1);
}
.accountBenefitBackup::before{inset:9px}.accountBenefitAsset::after{display:none}
.accountBenefitGoogle{transition:transform .24s cubic-bezier(.2,.8,.2,1),border-color .24s ease,filter .24s ease}.accountBenefitGoogle img{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.accountBenefitGrid article:hover .accountBenefitIcon,.accountBenefitGrid article:focus-within .accountBenefitIcon{transform:translateY(-4px) scale(1.055);border-color:color-mix(in srgb,var(--accent2) 72%,var(--accent));filter:drop-shadow(0 7px 9px rgba(0,0,0,.22)) drop-shadow(0 0 8px color-mix(in srgb,var(--accent) 24%,transparent))}
.accountBenefitGrid article:hover .accountBenefitAsset::before,.accountBenefitGrid article:focus-within .accountBenefitAsset::before{transform:scale(1.06)}
.accountBenefitGrid article:nth-child(3):hover .accountBenefitAsset::before,.accountBenefitGrid article:nth-child(3):focus-within .accountBenefitAsset::before{transform:rotate(10deg) scale(1.04)}
.accountBenefitGrid article:hover .accountBenefitGoogle img,.accountBenefitGrid article:focus-within .accountBenefitGoogle img{transform:scale(1.08) rotate(-3deg)}
.accountBenefitQuota{align-self:end;margin-top:2px;padding:5px 8px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--accent) 7%,var(--surface-raised));color:var(--muted);font-size:.64rem;line-height:1.2}.accountBenefitQuota b{color:var(--accent2);font-weight:800}
.accountBenefitsActions{display:flex;justify-content:center;margin:18px 0 0}.accountBenefitsActions .googleSignInBtn{width:min(360px,100%)}
.signedOutProPromo{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:15px;margin-top:18px;padding:16px;border:1px solid color-mix(in srgb,var(--accent) 58%,var(--line));border-radius:17px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 13%,var(--surface-raised)),var(--surface-raised));box-shadow:0 10px 24px rgba(0,0,0,.13)}
/* Extra gap between the two plan promo cards so the vertically-centered "Compare Plans"
   pill (position:absolute) doesn't crowd the PRO card's description text above it. */
.signedOutProPlusPromo{margin-top:34px}
.signedOutProBadge{display:grid;place-items:center;width:58px;height:58px;border:1px solid color-mix(in srgb,var(--accent) 72%,var(--line));border-radius:18px;background:var(--accent-soft);color:var(--accent2);font-size:.88rem;font-weight:950;letter-spacing:.08em;box-shadow:0 0 15px color-mix(in srgb,var(--accent) 20%,transparent)}
.signedOutProPromo strong{display:block;margin:3px 0;font-size:1rem}.signedOutProPromo p{margin:0;color:var(--muted);font-size:.78rem;line-height:1.4}.signedOutProPromo>.btn{min-width:160px;white-space:nowrap;font-weight:600}
@media(max-width:760px){.signedOutProPromo{grid-template-columns:auto minmax(0,1fr)}.signedOutProPromo>.btn{grid-column:1/-1;width:100%}}
@media(max-width:430px){.calculatorAccountBenefits{padding:18px 10px}.accountBenefitsHeading{margin-bottom:18px}.signedOutProPromo{grid-template-columns:1fr;text-align:center}.signedOutProBadge{margin:auto}.accountBenefitAsset::before{inset:9px}.accountBenefitBackup::before{inset:8px}}
.signedOutPlanPromos{display:grid;gap:11px;margin-top:18px}.signedOutPlanPromos .signedOutProPromo{margin-top:0}.signedOutProPlusPromo{border-color:color-mix(in srgb,var(--accent2) 80%,var(--line));background:linear-gradient(135deg,color-mix(in srgb,var(--accent2) 17%,var(--surface-raised)),var(--surface-raised))}.signedOutProPlusPromo .signedOutProBadge{width:64px;border-color:var(--accent2);color:var(--accent2)}.signedOutProPlusPromo>div:nth-child(2)>span{color:var(--accent2)}.signedOutProPlusPromo>.btn{border-color:color-mix(in srgb,var(--accent2) 70%,var(--line));color:var(--accent2)}
.signedOutPlansCompare{position:relative;z-index:2;justify-self:end;display:flex;align-items:center;gap:9px;min-height:44px;margin:-3px 20px;padding:7px 10px 7px 13px;border:1px solid color-mix(in srgb,var(--accent) 70%,var(--line));border-radius:999px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 24%,var(--surface-input)),color-mix(in srgb,var(--accent2) 15%,var(--surface-raised)));color:var(--text);box-shadow:0 10px 24px rgba(0,0,0,.25),0 0 18px color-mix(in srgb,var(--accent) 18%,transparent);font:inherit;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.signedOutPlansCompare::before,.signedOutPlansCompare::after{content:"";position:absolute;right:30px;width:1px;height:14px;background:linear-gradient(var(--accent),var(--accent2));box-shadow:0 0 8px var(--accent)}.signedOutPlansCompare::before{bottom:100%}.signedOutPlansCompare::after{top:100%}.signedOutPlansCompare:hover,.signedOutPlansCompare:focus-visible{transform:translateY(-1px) scale(1.025);border-color:var(--accent2);box-shadow:0 13px 30px rgba(0,0,0,.3),0 0 24px color-mix(in srgb,var(--accent) 30%,transparent)}.signedOutPlansCompare>span{color:var(--accent2);font-size:.67rem;font-weight:900;letter-spacing:.08em}.signedOutPlansCompare>b{font-size:.76rem}.signedOutPlansCompare>i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--accent);color:var(--buttonText,#07111b);box-shadow:0 0 14px color-mix(in srgb,var(--accent) 40%,transparent)}.signedOutPlansCompare svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:760px){.signedOutPlansCompare{justify-self:stretch;justify-content:center;margin:-2px 18px}.signedOutPlansCompare::before,.signedOutPlansCompare::after{right:50%}}
@media(prefers-reduced-motion:reduce){.accountBenefitIcon,.accountBenefitIcon img,.accountBenefitAsset::before{transition:none!important}.accountBenefitGrid article:hover .accountBenefitIcon,.accountBenefitGrid article:focus-within .accountBenefitIcon{transform:none}}

/* Account center and plan card polish. */
.accountPageIdentity{min-width:0}.accountPageIdentity #accountPageIdentityMeta{color:var(--text);font-weight:600}.accountPageIdentity #accountPageIdentityEmail{margin-top:3px;color:var(--muted);font-size:.83rem}.accountPageHeroActions{display:grid;grid-template-columns:repeat(2,minmax(132px,1fr));gap:9px}.accountPageHeroActions .btn{min-height:46px;padding-inline:15px;white-space:nowrap}.accountPlanCard{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important}.accountPlanIcon{display:grid;place-items:center;width:68px;height:68px;flex:0 0 68px;border:1px solid color-mix(in srgb,var(--accent) 62%,var(--line));border-radius:20px;background:color-mix(in srgb,var(--accent) 9%,var(--surface-raised));color:var(--accent2);box-shadow:0 0 16px color-mix(in srgb,var(--accent) 18%,transparent)}.accountPlanIcon svg{width:46px;height:46px;fill:none;stroke:currentColor;stroke-width:2.7;stroke-linecap:round;stroke-linejoin:round}.accountPlanDetails{min-width:0}.accountPlanCard>.btn{min-width:190px;white-space:nowrap}.accountPlanCard>.btn b{display:block;white-space:nowrap;font-weight:600}.accountPlanCard>.btn small{display:block}
@media(max-width:760px){.accountPageHero{grid-template-columns:auto minmax(0,1fr)}.accountPageHeroActions{grid-column:1/-1;width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}.accountPageHeroActions .btn{white-space:normal;min-width:0}.accountPlanCard{grid-template-columns:minmax(0,1fr)!important}.accountPlanCard>.btn{grid-column:1/-1;width:100%;min-width:0;white-space:normal}.accountPlanCard>.btn b,.accountPlanCard>.btn small{white-space:normal}}
@media(max-width:430px){.accountPageHeroActions{grid-template-columns:1fr}.accountPlanCard{grid-template-columns:1fr!important;text-align:center}.accountPlanIcon{margin:auto}.accountPlanCard>.btn{grid-column:auto}}

/* Account tiers, persistent upgrade entry point, and quota guidance. */
.heroUpgradeButton{align-self:center;min-height:36px;padding:7px 13px;border:1px solid color-mix(in srgb,var(--accent) 76%,var(--line));border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:var(--buttonText,#081018);font:600 .76rem/1 var(--app-font,system-ui);box-shadow:0 8px 18px color-mix(in srgb,var(--accent) 24%,transparent);white-space:nowrap;transition:transform .18s ease,box-shadow .18s ease}.heroUpgradeButton:hover{transform:translateY(-2px);box-shadow:0 11px 24px color-mix(in srgb,var(--accent) 35%,transparent)}
.heroUpgradeButton.attention{animation:upgradeAttention 2s ease-in-out infinite}@keyframes upgradeAttention{50%{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 16%,transparent),0 12px 28px color-mix(in srgb,var(--accent) 42%,transparent)}}
.accountPlanCompare{grid-template-columns:repeat(3,minmax(0,1fr))!important}.planComparePlus{border-color:color-mix(in srgb,var(--accent2) 68%,var(--line));background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 12%,var(--surface-raised)),var(--surface-input))}.planComparePlus .planCompareHeroIcon{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent2) 26%,transparent),0 0 20px color-mix(in srgb,var(--accent2) 18%,transparent)}
.planLimitBackdrop{position:fixed;z-index:5400;inset:0;display:grid;place-items:center;padding:20px;background:rgba(3,7,12,.84);backdrop-filter:blur(14px)}.planLimitDialog{display:grid;grid-template-columns:minmax(0,.92fr) minmax(360px,1.08fr);width:min(980px,100%);max-height:calc(100vh - 32px);overflow:auto;border:1px solid color-mix(in srgb,var(--accent) 72%,var(--line));border-radius:26px;background:var(--panel);box-shadow:0 34px 110px rgba(0,0,0,.62),0 0 34px color-mix(in srgb,var(--accent) 18%,transparent)}.planLimitMessage{position:relative;padding:30px}.planLimitMessage>span,.planLimitUpgrade>span{color:var(--accent2);font-size:.7rem;font-weight:900;letter-spacing:.12em}.planLimitMessage>.accountProfileClose{position:absolute;top:18px;right:18px}.planLimitIcon{display:grid;place-items:center;width:72px;height:72px;margin:30px 0 16px;border:1px solid color-mix(in srgb,var(--accent) 62%,var(--line));border-radius:21px;background:var(--accent-soft);color:var(--accent2);box-shadow:0 0 22px color-mix(in srgb,var(--accent) 20%,transparent)}.planLimitIcon svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.planLimitMessage h2{margin:0;font-size:clamp(1.4rem,3vw,2rem);line-height:1.12}.planLimitMessage>p{color:var(--muted);line-height:1.5}.planLimitCurrent{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:20px 0;padding:14px 16px;border:1px solid color-mix(in srgb,var(--bad) 50%,var(--line));border-radius:15px;background:color-mix(in srgb,var(--bad) 9%,var(--surface-raised))}.planLimitCurrent span{color:var(--bad);font-weight:800;text-align:right}.planLimitChoice{font-size:.84rem}.planLimitActions{display:grid;grid-template-columns:.8fr 1.2fr;gap:10px;margin-top:22px}.planLimitActions .btn{min-height:48px}.planLimitUpgrade{padding:30px;border-left:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));background:radial-gradient(circle at 90% 0,color-mix(in srgb,var(--accent) 18%,transparent),transparent 48%),linear-gradient(150deg,color-mix(in srgb,var(--accent) 10%,var(--surface-raised)),var(--surface-input))}.planLimitUpgrade h3{margin:5px 0 2px;font-size:1.6rem}.planLimitUpgrade h3 small{color:var(--muted);font-size:.74rem}.planLimitUpgrade>p{margin:4px 0 16px;color:var(--muted)}.planLimitUpgrade ul{display:grid;gap:9px;margin:0 0 18px;padding:0;list-style:none}.planLimitUpgrade li{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:11px;padding:11px 12px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--surface-raised) 88%,transparent)}.planLimitUpgrade li.maxedFeature{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 15%,var(--surface-raised));box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 18%,transparent),0 0 20px color-mix(in srgb,var(--accent) 14%,transparent);animation:limitFeaturePulse 1.8s ease-in-out infinite}.planLimitCheck{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:var(--accent-soft);color:var(--accent2);font-weight:900}.planLimitUpgrade li strong,.planLimitUpgrade li small{display:block}.planLimitUpgrade li small{margin-top:2px;color:var(--muted);font-size:.72rem}.planLimitUpgrade .btn{width:100%;min-height:48px}@keyframes limitFeaturePulse{50%{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 10%,transparent),0 0 27px color-mix(in srgb,var(--accent) 25%,transparent)}}
@media(max-width:900px){.accountPlanCompare{grid-template-columns:1fr!important}.planLimitDialog{grid-template-columns:1fr}.planLimitUpgrade{border-top:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));border-left:0}}
/* Was: a 42px square with font-size:0 and the word "PRO" glued on via ::after. That reads as a
   BADGE saying you are already on Pro, not as a buy button — it is why a Free user could not find
   any way to upgrade on a phone. It now keeps a real label at the same 42px height. */
@media(max-width:620px){.heroUpgradeButton{min-width:auto;padding:0 12px;font-size:.72rem}.planLimitBackdrop{padding:8px}.planLimitDialog{max-height:calc(100vh - 16px);border-radius:19px}.planLimitMessage,.planLimitUpgrade{padding:21px}.planLimitActions{grid-template-columns:1fr}.planLimitMessage>.accountProfileClose{top:12px;right:12px}}
@media(prefers-reduced-motion:reduce){.planLimitUpgrade li.maxedFeature,.heroUpgradeButton.attention{animation:none}.heroUpgradeButton{transition:none}}
.inventoryTableActions>div:last-child{display:flex!important;align-items:center!important;justify-content:flex-end!important;flex-wrap:nowrap!important;gap:9px!important}.inventoryTableActions>div:last-child .btn{width:auto!important;min-width:max-content!important;flex:0 0 auto!important}
@media(max-width:620px){.inventoryTableActions>div:last-child{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important}.inventoryTableActions>div:last-child .btn{width:100%!important;min-width:0!important}}
.accountPagePlanCard .accountStorageProgress{grid-column:1/-1;width:100%;margin:2px 0 0;padding:13px 15px;border-color:color-mix(in srgb,var(--accent) 42%,var(--line));background:color-mix(in srgb,var(--surface-raised) 86%,var(--accent) 14%)}.accountPagePlanCard .accountStorageProgress p{margin:8px 0 0}.planLimitActions{grid-template-columns:1fr!important}.planLimitActions .btn{width:100%}.planCompareBadgeWrap{display:grid;justify-items:end;gap:5px}.planLimitState{color:var(--warn,var(--accent2));font-size:.62rem;font-style:normal;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.planUsageReached .planLimitState{color:var(--bad)}.planCompareCard li.planUsageNear,.planCompareCard li.planUsageReached{position:relative;border:1px solid color-mix(in srgb,var(--accent) 62%,var(--line));border-radius:14px;padding-inline:10px;background:color-mix(in srgb,var(--accent) 10%,var(--surface-raised));animation:planUsagePulse 1.05s ease-in-out 3}.planCompareCard li.planUsageReached{border-color:color-mix(in srgb,var(--bad) 72%,var(--line));background:color-mix(in srgb,var(--bad) 9%,var(--surface-raised))}@keyframes planUsagePulse{50%{transform:translateY(-2px);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent),0 0 25px color-mix(in srgb,var(--accent) 28%,transparent)}}.planAudience{display:grid;gap:5px;min-width:0;padding:10px 12px;border-left:3px solid var(--accent);border-radius:0 11px 11px 0;background:color-mix(in srgb,var(--accent) 8%,var(--surface-raised))}.planAudience strong{font-size:.82rem;letter-spacing:.02em}.planAudience span{color:var(--muted);font-size:.7rem;line-height:1.38}.planCompareProFooter{grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important}.planCompareProFooter .planAudience{grid-column:1!important;grid-row:1/3!important}.planCompareProFooter>.btn{grid-column:2!important;grid-row:1/3!important}
@media(max-width:520px){.planCompareProFooter{grid-template-columns:1fr!important}.planCompareProFooter .planAudience,.planCompareProFooter>.btn{grid-column:1!important;grid-row:auto!important}}
@media(prefers-reduced-motion:reduce){.planCompareCard li.planUsageNear,.planCompareCard li.planUsageReached{animation:none}}

/* Keep native scrollbar controls inside the rounded account frame. */
.accountProfileDialog{position:relative;overflow:hidden!important}.accountProfileScroll{max-height:min(760px,calc(100vh - 160px));margin-right:14px;overflow:auto;overscroll-behavior:contain;border-radius:0 0 18px 18px;scrollbar-width:none!important}.accountProfileScroll::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}.accountProfileScrollRail{position:absolute;z-index:4;right:4px;width:10px;padding:1px;border-radius:999px;background:color-mix(in srgb,var(--surface-input,var(--panel2)) 88%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 28%,var(--line));cursor:pointer;pointer-events:auto;touch-action:none}.accountProfileScrollRail:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}.accountProfileScrollRail[hidden]{display:none}.accountProfileScrollRail>span{display:block;width:100%;min-height:42px;border-radius:999px;background:linear-gradient(180deg,var(--accent2),var(--accent));box-shadow:0 0 7px color-mix(in srgb,var(--accent) 38%,transparent);cursor:grab;will-change:transform}.accountProfileScrollRail.dragging>span{cursor:grabbing;box-shadow:0 0 12px color-mix(in srgb,var(--accent) 62%,transparent)}.accountAvatarUploadField{grid-column:1/-1}.accountAvatarUpload{align-items:center!important;flex-wrap:wrap}.accountAvatarChoose,.accountAvatarRemove{align-self:center!important;min-height:46px!important;height:46px!important;margin:0!important;padding-block:0!important}.accountAvatarChoose{display:inline-flex!important}.accountProfileForm{padding-top:18px}
.accountPlanBackdrop{position:fixed;z-index:5200;inset:0;display:grid;place-items:center;padding:22px;background:rgba(3,7,12,.82);backdrop-filter:blur(14px)}.accountPlanDialog{width:min(1120px,100%);max-height:calc(100vh - 32px);overflow:auto;border:1px solid color-mix(in srgb,var(--accent) 70%,var(--line));border-radius:26px;background:var(--panel);box-shadow:0 34px 110px rgba(0,0,0,.58),0 0 30px color-mix(in srgb,var(--accent) 16%,transparent)}.accountPlanDialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:24px 28px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 65% 0,color-mix(in srgb,var(--accent) 18%,transparent),transparent 44%),linear-gradient(135deg,color-mix(in srgb,var(--accent) 13%,var(--panel)),var(--panel))}.accountPlanDialog>header span{color:var(--accent2);font-size:.7rem;font-weight:900;letter-spacing:.12em}.accountPlanDialog>header h2{margin:5px 0 3px;font-size:clamp(1.35rem,3vw,2rem)}.accountPlanDialog>header p{margin:0;color:var(--muted)}.accountPlanCompare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:24px}.planCompareCard{position:relative;display:flex;flex-direction:column;min-width:0;padding:22px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(160deg,color-mix(in srgb,var(--surface-raised) 94%,var(--accent) 6%),var(--surface-input));box-shadow:0 16px 35px rgba(0,0,0,.2)}.planComparePro{border-color:color-mix(in srgb,var(--accent) 76%,var(--line));box-shadow:0 18px 42px rgba(0,0,0,.28),0 0 20px color-mix(in srgb,var(--accent) 20%,transparent)}.planBestValue{position:absolute;top:0;right:20px;padding:7px 13px;border-radius:0 0 12px 12px;background:var(--accent);color:var(--buttonText,#081018);font-size:.7rem;font-weight:900;letter-spacing:.08em}.planCompareHeading{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:15px;padding-bottom:17px;border-bottom:1px solid color-mix(in srgb,var(--accent) 32%,var(--line))}.planCompareHeroIcon{display:grid;place-items:center;width:64px;height:64px;border:1px solid color-mix(in srgb,var(--accent) 72%,var(--line));border-radius:50%;background:color-mix(in srgb,var(--accent) 9%,var(--surface-raised));color:var(--accent2);font-size:2rem;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--accent) 24%,transparent))}.planCompareHeading>div>span{color:var(--accent2);font-size:.78rem;font-weight:900;letter-spacing:.08em}.planCompareHeading h3{margin:4px 0;font-size:1.55rem}.planCompareHeading h3 small{color:var(--muted);font-size:.82rem;font-weight:600}.planCompareHeading p{margin:0;color:var(--muted);line-height:1.42}.planCompareCard ul{display:grid;gap:0;margin:12px 0;padding:0;list-style:none}.planCompareCard li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid color-mix(in srgb,var(--line) 75%,transparent)}.planCompareFeatureIcon{display:grid;place-items:center;width:39px;height:39px;border:1px solid color-mix(in srgb,var(--accent) 32%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--accent) 7%,var(--surface-raised));color:var(--accent2);font-size:1.25rem}.planCompareCard li strong{font-size:.92rem}.planCompareCard li p{margin:3px 0 0;color:var(--muted);font-size:.78rem;line-height:1.38}.planCompareBadge{color:var(--accent2);font-size:.68rem;font-weight:900;text-transform:uppercase}.planCompareFooter{display:grid;gap:3px;margin-top:auto;padding:14px;border:1px solid var(--line);border-radius:15px;background:color-mix(in srgb,var(--surface-raised) 88%,var(--accent) 12%)}.planCompareFooter span{color:var(--muted);font-size:.78rem}.planCompareProFooter{grid-template-columns:minmax(0,1fr) auto;align-items:center}.planCompareProFooter strong,.planCompareProFooter span{grid-column:1}.planCompareProFooter .btn{grid-column:2;grid-row:1/3;min-width:155px;white-space:nowrap}.accountPlanDialog>footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 24px;border-top:1px solid var(--line);background:var(--surface-raised)}.accountPlanDialog>footer p{margin:0;color:var(--muted);font-size:.82rem}.accountPlanDialog>footer p strong{color:var(--text)}.accountPlanDialog>footer .btn{min-width:130px}
@media(max-width:760px){.accountPlanBackdrop{padding:9px}.accountPlanDialog{max-height:calc(100vh - 18px);border-radius:19px}.accountPlanDialog>header{padding:18px}.accountPlanCompare{grid-template-columns:1fr;padding:15px}.accountPlanDialog>footer{align-items:stretch;flex-direction:column}.accountPlanDialog>footer .btn{width:100%}}
@media(max-width:440px){.planCompareCard{padding:16px}.planCompareHeading{grid-template-columns:1fr}.planCompareHeroIcon{width:54px;height:54px}.planCompareCard li{grid-template-columns:auto minmax(0,1fr)}.planCompareBadge{grid-column:2}.planCompareProFooter{grid-template-columns:1fr}.planCompareProFooter .btn{grid-column:1;grid-row:auto;width:100%;margin-top:8px}}
.accountPlanDialog{position:relative;overflow:hidden!important}.accountPlanScroll{max-height:calc(100vh - 32px);margin-right:14px;overflow:auto;overscroll-behavior:contain;scrollbar-width:none!important}.accountPlanScroll::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}.accountPlanScroll>header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:24px 28px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 65% 0,color-mix(in srgb,var(--accent) 18%,transparent),transparent 44%),linear-gradient(135deg,color-mix(in srgb,var(--accent) 13%,var(--panel)),var(--panel))}.accountPlanScroll>header span{color:var(--accent2);font-size:.7rem;font-weight:900;letter-spacing:.12em}.accountPlanScroll>header h2{margin:5px 0 3px;font-size:clamp(1.35rem,3vw,2rem)}.accountPlanScroll>header p{margin:0;color:var(--muted)}.accountPlanScroll>footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 24px;border-top:1px solid var(--line);background:var(--surface-raised)}.accountPlanScroll>footer p{margin:0;color:var(--muted);font-size:.82rem}.accountPlanScroll>footer p strong{color:var(--text)}.accountPlanScroll>footer .btn{min-width:130px}.accountPlanScrollRail{position:absolute;z-index:4;right:4px;width:10px;padding:1px;border-radius:999px;background:color-mix(in srgb,var(--surface-input,var(--panel2)) 88%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 28%,var(--line));cursor:pointer;pointer-events:auto;touch-action:none}.accountPlanScrollRail:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}.accountPlanScrollRail[hidden]{display:none}.accountPlanScrollRail>span{display:block;width:100%;min-height:42px;border-radius:999px;background:linear-gradient(180deg,var(--accent2),var(--accent));box-shadow:0 0 7px color-mix(in srgb,var(--accent) 38%,transparent);cursor:grab;will-change:transform}.accountPlanScrollRail.dragging>span{cursor:grabbing;box-shadow:0 0 12px color-mix(in srgb,var(--accent) 62%,transparent)}
@media(max-width:760px){.accountPlanScroll{max-height:calc(100vh - 18px)}.accountPlanScroll>header{padding:18px}.accountPlanScroll>footer{align-items:stretch;flex-direction:column}.accountPlanScroll>footer .btn{width:100%}}

/* Premium plan comparison presentation */
.accountPlanDialog{isolation:isolate;background:color-mix(in srgb,var(--panel) 96%,black 4%);box-shadow:0 40px 120px rgba(0,0,0,.64),0 0 0 1px color-mix(in srgb,var(--accent) 20%,transparent),0 0 46px color-mix(in srgb,var(--accent) 18%,transparent)}.accountPlanDialog::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background-image:linear-gradient(color-mix(in srgb,var(--accent) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--accent) 5%,transparent) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,black,transparent 72%)}.accountPlanScroll>header{position:relative;display:block;padding:30px 72px 25px;text-align:center;background:radial-gradient(circle at 50% -20%,color-mix(in srgb,var(--accent) 24%,transparent),transparent 54%),linear-gradient(135deg,color-mix(in srgb,var(--accent) 11%,var(--panel)),var(--panel))}.accountPlanScroll>header>div{max-width:860px;margin:auto}.accountPlanScroll>header>div>span{display:inline-flex;align-items:center;gap:8px;padding:6px 11px;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--accent) 8%,var(--surface-raised));box-shadow:0 0 18px color-mix(in srgb,var(--accent) 12%,transparent)}.accountPlanScroll>header>div>span::before,.accountPlanScroll>header>div>span::after{content:"";width:16px;height:1px;background:var(--accent)}.accountPlanScroll>header h2{margin:11px 0 5px;font-size:clamp(1.6rem,4vw,2.65rem);letter-spacing:-.035em}.accountPlanScroll>header h2 em{color:var(--accent2);font-style:normal;text-shadow:0 0 24px color-mix(in srgb,var(--accent) 32%,transparent)}.accountPlanScroll>header p{font-size:.96rem}.accountPlanScroll>header .accountProfileClose{position:absolute;right:22px;top:22px}.planTrustStrip{display:flex;align-items:center;justify-content:center;gap:8px 20px;flex-wrap:wrap;margin-top:16px;color:var(--muted);font-size:.7rem}.planTrustStrip b{font-weight:650}.planTrustStrip b::first-letter{color:var(--accent2)}.accountPlanCompare{position:relative;gap:22px;padding:26px}.accountPlanCompare::before{content:"";position:absolute;left:50%;top:36px;bottom:36px;width:1px;background:linear-gradient(transparent,color-mix(in srgb,var(--accent) 38%,var(--line)),transparent);opacity:.6}.planCompareCard{overflow:hidden;padding:24px;border-radius:24px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface-raised) 94%,var(--accent) 6%),color-mix(in srgb,var(--surface-input) 96%,black 4%));transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.planCompareCard::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 0 35%,color-mix(in srgb,var(--accent2) 8%,transparent) 48%,transparent 61%);transform:translateX(-100%);transition:transform .7s ease}.planCompareCard:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 60%,var(--line));box-shadow:0 22px 52px rgba(0,0,0,.3),0 0 24px color-mix(in srgb,var(--accent) 13%,transparent)}.planCompareCard:hover::before{transform:translateX(100%)}.planComparePro{border-color:color-mix(in srgb,var(--accent) 82%,var(--line));background:radial-gradient(circle at 88% 0,color-mix(in srgb,var(--accent) 18%,transparent),transparent 38%),linear-gradient(145deg,color-mix(in srgb,var(--surface-raised) 89%,var(--accent) 11%),color-mix(in srgb,var(--surface-input) 96%,black 4%));box-shadow:0 22px 54px rgba(0,0,0,.32),0 0 30px color-mix(in srgb,var(--accent) 22%,transparent)}.planComparePro::after{content:"";position:absolute;pointer-events:none;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent2) 25%,transparent)}.planBestValue{top:17px;right:-42px;width:170px;padding:8px 20px;transform:rotate(38deg);border-radius:0;text-align:center;box-shadow:0 8px 24px rgba(0,0,0,.28);font-size:.64rem}.planBestValue i{font-style:normal}.planCompareHeading{grid-template-columns:auto minmax(0,1fr);gap:17px;padding:2px 0 19px}.planCompareHeroIcon{width:72px;height:72px;border-width:1px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 15%,var(--surface-raised)),var(--surface-input));box-shadow:inset 0 0 18px color-mix(in srgb,var(--accent) 10%,transparent),0 0 18px color-mix(in srgb,var(--accent) 18%,transparent)}.planCompareHeroIcon svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.planCompareHeading>div>span{font-size:.83rem}.planCompareHeading h3{display:flex;align-items:baseline;gap:3px;margin:3px 0;font-size:2.05rem;letter-spacing:-.035em}.planCompareHeading h3 i{font-size:1.25rem;font-style:normal}.planCompareHeading h3 small{margin-left:3px;font-size:.76rem;letter-spacing:0}.planLaunchPrice{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0 2px;padding:9px 12px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--accent) 8%,var(--surface-input));color:var(--muted);font-size:.75rem}.planLaunchPrice strong{color:var(--accent2);font-size:.8rem}.planCompareCard li{position:relative;padding:14px 8px;margin-inline:-8px;border-radius:13px;transition:background .18s ease,transform .18s ease}.planCompareCard li:hover{z-index:1;transform:translateX(3px);background:color-mix(in srgb,var(--accent) 7%,var(--surface-raised))}.planCompareFeatureIcon{width:43px;height:43px;border-color:color-mix(in srgb,var(--accent) 42%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 12%,var(--surface-raised)),var(--surface-input));box-shadow:inset 0 0 12px color-mix(in srgb,var(--accent) 7%,transparent)}.planCompareFeatureIcon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.planCompareBadge{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;border:1px solid color-mix(in srgb,var(--accent) 32%,var(--line));background:color-mix(in srgb,var(--accent) 7%,var(--surface-input));font-size:.58rem}.planCompareBadge::before{display:grid;place-items:center;width:13px;height:13px;border-radius:50%;font-size:.55rem}.planCompareBadge.included::before{content:"✓";background:color-mix(in srgb,var(--accent) 22%,transparent);color:var(--accent2)}.planCompareBadge.planned::before{content:"";width:6px;height:6px;background:var(--accent2);box-shadow:0 0 7px var(--accent)}.planCompareFooter{position:relative;overflow:hidden;padding:15px 16px}.planCompareFooter::after{content:"";position:absolute;right:-24px;bottom:-35px;width:90px;height:90px;border-radius:50%;background:color-mix(in srgb,var(--accent) 10%,transparent);filter:blur(2px)}.planCompareProFooter .btn{position:relative;z-index:1;min-width:178px;padding:11px 14px;background:linear-gradient(135deg,var(--accent2),var(--accent));box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 24%,transparent);transition:transform .18s ease,box-shadow .18s ease}.planCompareProFooter .btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px color-mix(in srgb,var(--accent) 34%,transparent)}.planCompareProFooter .btn span{display:block;color:var(--buttonText,#07111b);font-weight:800}.planCompareProFooter .btn small{display:block;margin-top:2px;color:color-mix(in srgb,var(--buttonText,#07111b) 72%,transparent);font-size:.6rem}.accountPlanScroll>footer{padding:17px 26px;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 6%,var(--surface-raised)),var(--surface-raised))}.accountPlanScroll>footer p::before{content:"i";display:inline-grid;place-items:center;width:20px;height:20px;margin-right:8px;border:1px solid var(--accent);border-radius:50%;color:var(--accent2);font-weight:800}.accountPlanScroll>footer .btn{border-color:color-mix(in srgb,var(--accent) 34%,var(--line))}
@media(max-width:760px){.accountPlanScroll>header{padding:25px 52px 21px}.accountPlanScroll>header .accountProfileClose{right:12px;top:12px}.planTrustStrip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));text-align:left}.accountPlanCompare::before{display:none}.planCompareCard:hover{transform:none}.planBestValue{right:-48px;top:12px}.planCompareProFooter .btn{min-width:0}}
@media(max-width:440px){.accountPlanScroll>header{padding:22px 48px 19px 18px;text-align:left}.accountPlanScroll>header>div>span::before,.accountPlanScroll>header>div>span::after{display:none}.planTrustStrip{grid-template-columns:1fr;margin-top:12px}.accountPlanCompare{padding:12px}.planCompareCard{padding:17px}.planCompareHeading{grid-template-columns:auto minmax(0,1fr)}.planCompareHeroIcon{width:55px;height:55px}.planCompareHeroIcon svg{width:32px;height:32px}.planCompareHeading h3{font-size:1.65rem}.planCompareBadge{justify-self:start}.planCompareCard li:hover{transform:none}.planLaunchPrice{align-items:flex-start;flex-direction:column}.accountPlanScroll>footer{padding:14px}}
@media(prefers-reduced-motion:reduce){.planCompareCard,.planCompareCard::before,.planCompareCard li,.planCompareProFooter .btn{transition:none!important}}

/* Plan-card hierarchy: plan status and audience guidance stay above feature lists. */
.planCurrentBadge{display:inline-flex;align-self:flex-start;align-items:center;gap:7px;margin-top:13px;padding:6px 10px;border:1px solid color-mix(in srgb,var(--good) 55%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--good) 12%,var(--surface-input));color:var(--good);font-size:.66rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase}.planCurrentBadge::before{content:"✓";display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:color-mix(in srgb,var(--good) 22%,transparent);font-size:.65rem}.planTopOffer{display:grid;gap:10px;margin:14px 0 3px}.planTopOffer .planAudience{width:100%;padding:12px 13px}.planTopOffer .planAudience strong{color:var(--text);font-size:.86rem}.planTopOffer .planAudience span{font-size:.73rem}.planAudienceFree{margin-top:12px}.planChooseButton{width:100%;min-height:50px;padding:10px 14px!important;border-color:color-mix(in srgb,var(--accent2) 72%,var(--line))!important;background:linear-gradient(135deg,var(--accent2),var(--accent))!important;box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 24%,transparent)!important;color:var(--buttonText,#07111b)!important}.planChooseButton span,.planChooseButton small{display:block!important;color:inherit!important}.planChooseButton span{font-weight:850!important}.planChooseButton small{margin-top:2px;font-size:.62rem!important;opacity:.75}.planChooseButton:hover{transform:translateY(-2px);box-shadow:0 14px 30px color-mix(in srgb,var(--accent) 34%,transparent)!important}.planComparePlus .planChooseButton{border-color:color-mix(in srgb,var(--accent2) 82%,var(--line))!important}
.planBottomAction{margin-top:auto;padding-top:15px}.planBottomAction .planChooseButton{position:relative;overflow:hidden}.planChoosePlus{min-height:58px!important;border:2px solid color-mix(in srgb,var(--accent2) 90%,white 10%)!important;background:linear-gradient(120deg,color-mix(in srgb,var(--accent2) 92%,white 8%),var(--accent),color-mix(in srgb,var(--accent2) 82%,white 18%))!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent),0 14px 34px color-mix(in srgb,var(--accent) 42%,transparent)!important}.planChoosePlus::after{content:"";position:absolute;inset:-30% auto -30% -35%;width:32%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.52),transparent);animation:planPlusShine 3.8s ease-in-out infinite}.planChoosePlus span{font-size:.96rem}.planChoosePlus small{font-size:.65rem!important}@keyframes planPlusShine{0%,68%{left:-35%}100%{left:125%}}@media(prefers-reduced-motion:reduce){.planChoosePlus::after{display:none}}
.planChooseButton:disabled{cursor:default;filter:saturate(.45);opacity:.7;transform:none!important}.planTestDowngrade{width:100%;font-weight:500!important}.simulatedCheckoutBackdrop{position:fixed;z-index:6600;inset:0;display:grid;place-items:center;padding:18px;background:rgba(3,7,12,.86);backdrop-filter:blur(15px)}.simulatedCheckoutDialog{width:min(720px,100%);max-height:calc(100vh - 28px);overflow:auto;border:1px solid color-mix(in srgb,var(--accent) 72%,var(--line));border-radius:25px;background:var(--panel);box-shadow:0 36px 110px rgba(0,0,0,.65),0 0 32px color-mix(in srgb,var(--accent) 18%,transparent)}.simulatedCheckoutDialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:23px 25px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 17%,var(--panel)),var(--panel))}.simulatedCheckoutDialog>header span{color:var(--accent2);font-size:.69rem;font-weight:900;letter-spacing:.12em}.simulatedCheckoutDialog>header h2{margin:5px 0 3px}.simulatedCheckoutDialog>header p{margin:0;color:var(--muted)}.simulatedCheckoutBody{display:grid;gap:15px;padding:23px}.simulatedCheckoutPlan{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 15px;padding:17px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:17px;background:color-mix(in srgb,var(--accent) 9%,var(--surface-raised))}.simulatedCheckoutPlan>span{color:var(--accent2);font-size:.72rem;font-weight:900;letter-spacing:.1em}.simulatedCheckoutPlan>strong{grid-row:1/3;grid-column:2;font-size:2rem}.simulatedCheckoutPlan>strong i{font-size:1.1rem;font-style:normal}.simulatedCheckoutPlan>strong small{color:var(--muted);font-size:.75rem}.simulatedCheckoutPlan>em{color:var(--good);font-size:.7rem;font-style:normal;font-weight:850}.simulatedCheckoutBody ul{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0;padding:0;list-style:none}.simulatedCheckoutBody li{display:flex;align-items:center;gap:9px;padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--surface-input);font-size:.78rem}.simulatedCheckoutBody li>span{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:50%;background:color-mix(in srgb,var(--good) 18%,transparent);color:var(--good);font-weight:900}.simulatedCheckoutNotice{padding:14px;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));border-radius:14px;background:var(--surface-raised)}.simulatedCheckoutNotice p{margin:5px 0 0;color:var(--muted);font-size:.76rem;line-height:1.45}.simulatedCheckoutActions{display:grid;grid-template-columns:1fr 1.25fr;gap:10px}.simulatedCheckoutActions .btn{min-height:51px}.simulatedCheckoutStatus{min-height:18px;margin:0;color:var(--accent2);font-size:.74rem;text-align:center}@media(max-width:560px){.simulatedCheckoutBackdrop{padding:8px}.simulatedCheckoutDialog{border-radius:19px}.simulatedCheckoutDialog>header,.simulatedCheckoutBody{padding:17px}.simulatedCheckoutBody ul,.simulatedCheckoutActions{grid-template-columns:1fr}.simulatedCheckoutPlan{grid-template-columns:1fr}.simulatedCheckoutPlan>strong{grid-column:1;grid-row:auto}}
body.accountOverlayOpen{overflow:hidden!important}
@media(max-width:620px){.accountProfileScroll{max-height:calc(100vh - 132px);margin-right:3px;border-radius:0 0 14px 14px}.accountAvatarUploadField{grid-column:auto}.accountAvatarUpload{flex-wrap:nowrap}.accountAvatarChoose,.accountAvatarRemove{padding-inline:10px!important}}
/* Keep the highlighted Pro+ checkout action clipped to its rounded button. */
.simulatedCheckoutActions .planChoosePlus{position:relative;overflow:hidden}
/* Production limit messaging and attention states. */
.planNameAccent{color:var(--accent2);font-style:normal;text-shadow:0 0 18px color-mix(in srgb,var(--accent) 30%,transparent)}
.planCompareBadge.near{border-color:color-mix(in srgb,var(--warn,#f2c94c) 65%,var(--line));background:color-mix(in srgb,var(--warn,#f2c94c) 13%,var(--surface-input));color:var(--warn,#f2c94c)}
.planCompareBadge.reached{border-color:color-mix(in srgb,var(--bad) 65%,var(--line));background:color-mix(in srgb,var(--bad) 13%,var(--surface-input));color:var(--bad)}
.planCompareBadge.near::before{content:"!";background:currentColor;color:var(--surface-input)}
.planCompareBadge.reached::before{display:none!important;content:none!important}
.heroUpgradeButton[hidden],#headerUpgradeButton.hidden{display:none!important}
.planLimitUpgrade li.maxedFeature{animation:limitFeaturePulse 1.05s ease-in-out 4}
.heroUpgradeButton.attention{position:relative;overflow:hidden;border-color:var(--accent2);background:linear-gradient(105deg,var(--accent),var(--accent2),var(--accent),var(--accent2));background-size:300% 100%;box-shadow:0 0 0 1px color-mix(in srgb,var(--accent2) 45%,transparent),0 10px 28px color-mix(in srgb,var(--accent) 35%,transparent);animation:upgradeSeamlessFlow 3.2s linear infinite}
.heroUpgradeButton.attention::before{content:"";position:absolute;inset:-1px;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.42) 44%,transparent 68%);transform:translateX(-130%);animation:upgradeSeamlessShine 3.2s linear infinite;pointer-events:none}
@keyframes upgradeSeamlessFlow{to{background-position:300% 0}}
@keyframes upgradeSeamlessShine{to{transform:translateX(170%)}}
@media(prefers-reduced-motion:reduce){.heroUpgradeButton.attention,.heroUpgradeButton.attention::before{animation:none}.planLimitUpgrade li.maxedFeature{animation:none}}
/* Tier hierarchy, checkout details, and post-upgrade confirmation. */
.planCompareCard.currentPlanCard{padding-top:68px}.planCurrentBadge{position:absolute!important;z-index:4;top:18px!important;left:18px!important;right:auto!important;margin:0!important}.planIncludesBase{display:flex;align-items:center;gap:8px;margin:14px 0 2px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));border-radius:12px;background:var(--accent-soft);color:var(--text);font-size:.75rem;font-weight:800}.planIncludesBase::before{content:"+";display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--buttonText,#07111b);font-size:1rem}.checkoutFeatureCopy{min-width:0}.simulatedCheckoutBody li{position:relative;grid-template-columns:auto minmax(0,1fr) auto!important}.checkoutFeatureInfo{display:grid;place-items:center;width:23px;height:23px;padding:0;border:1px solid color-mix(in srgb,var(--accent) 55%,var(--line));border-radius:50%;background:var(--surface-raised);color:var(--accent2);font:500 .72rem/1 var(--app-font,system-ui);cursor:help}.checkoutFeatureTip{position:absolute;z-index:8;right:8px;bottom:calc(100% - 2px);width:min(300px,calc(100vw - 70px));padding:11px 12px;border:1px solid color-mix(in srgb,var(--accent) 58%,var(--line));border-radius:12px;background:var(--surface-main);color:var(--text);box-shadow:0 18px 46px rgba(0,0,0,.42),0 0 18px color-mix(in srgb,var(--accent) 18%,transparent);font-size:.7rem;line-height:1.45;opacity:0;visibility:hidden;transform:translateY(6px);transition:.16s;pointer-events:none}.checkoutFeatureInfo:hover+.checkoutFeatureTip,.checkoutFeatureInfo:focus-visible+.checkoutFeatureTip{opacity:1;visibility:visible;transform:none}.planEnabledBackdrop{position:fixed;z-index:6900;inset:0;display:grid;place-items:center;padding:18px;background:rgba(3,7,12,.86);backdrop-filter:blur(14px)}.planEnabledDialog{width:min(700px,100%);overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 75%,var(--line));border-radius:25px;background:var(--panel);box-shadow:0 34px 100px rgba(0,0,0,.6),0 0 38px color-mix(in srgb,var(--accent) 24%,transparent)}.planEnabledHero{display:grid;grid-template-columns:150px minmax(0,1fr);align-items:center;gap:22px;padding:26px;background:radial-gradient(circle at 12% 40%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 42%),linear-gradient(135deg,color-mix(in srgb,var(--accent) 12%,var(--panel)),var(--panel))}.planEnabledGraphic{display:grid;place-items:center;width:140px;height:140px;border:1px solid color-mix(in srgb,var(--accent) 58%,var(--line));border-radius:32px;background:var(--surface-input);box-shadow:inset 0 0 30px color-mix(in srgb,var(--accent) 13%,transparent),0 18px 38px rgba(0,0,0,.25)}.planEnabledGraphic svg{width:108px;height:108px;fill:none;stroke:var(--accent2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.planEnabledCopy>span{color:var(--accent2);font-size:.68rem;font-weight:900;letter-spacing:.12em}.planEnabledCopy h2{margin:6px 0 8px;font-size:clamp(1.55rem,4vw,2.35rem)}.planEnabledCopy p{margin:0;color:var(--muted);line-height:1.5}.planEnabledFeatures{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:20px 26px}.planEnabledFeatures div{display:flex;align-items:center;gap:9px;padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--surface-raised);font-size:.76rem}.planEnabledFeatures div::before{content:"✓";display:grid;place-items:center;width:22px;height:22px;flex:0 0 22px;border-radius:50%;background:var(--accent-soft);color:var(--accent2);font-weight:900}.planEnabledActions{display:grid;grid-template-columns:1fr 1.25fr;gap:10px;padding:0 26px 24px}.planEnabledActions .btn{min-height:48px}@media(max-width:620px){.planCompareCard.currentPlanCard{padding-top:62px}.planEnabledHero{grid-template-columns:1fr;padding:20px;text-align:center}.planEnabledGraphic{width:105px;height:105px;margin:auto;border-radius:25px}.planEnabledGraphic svg{width:82px;height:82px}.planEnabledFeatures,.planEnabledActions{grid-template-columns:1fr;padding-inline:18px}.checkoutFeatureTip{right:0}}
/* Retire the synchronized full-surface glare that visually crossed the page. */
.topProjectStrip::after,.topProjectStrip>.projectFullGlare,.priceEstimateTile::before,.priceEstimateTile::after,.topProjectStrip .stripPrice::before,#topSuggestedCost::after,#suggestedPriceOption::after,#costSummary .total::before,#costSummary .metric:last-child::before,#logoDisplayCost::after,#legacyLogoDisplayCost::after{animation:none!important;display:none!important;opacity:0!important}
.simulatedCheckoutBody li{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important}

/* Stable authentication paint: never show the signed-out indicator before auth resolves. */
body.authPending .accountIndicator,body.authPending .heroUtilityActions{visibility:hidden!important}
body.authPending{overflow:hidden}body.authPending .wrap{opacity:0!important;visibility:hidden!important}body:not(.authPending) .wrap{opacity:1;transition:opacity .18s ease}
.logoMark[hidden]{display:none!important}

/* Compact plan comparison without sacrificing hierarchy or scanability. */
.accountPlanCompare{align-items:start!important;gap:14px!important;padding:18px!important}
.planCompareCard{display:flex!important;flex-direction:column!important;min-height:100%;padding:18px!important;border-radius:20px!important}
.planCompareCard.currentPlanCard{padding-top:56px!important}
.planCurrentBadge{top:14px!important;left:14px!important}
.planCompareHeading{gap:12px!important;padding:0 0 12px!important}
.planCompareHeroIcon{width:58px!important;height:58px!important}
.planCompareHeroIcon svg{width:34px!important;height:34px!important}
.planCompareHeading h3{font-size:1.7rem!important;margin:1px 0!important}
.planCompareHeading p{font-size:.72rem!important;line-height:1.35!important}
.planTopOffer{margin:8px 0 2px!important}
.planAudience{padding:8px 10px!important}.planAudience span{font-size:.66rem!important}
.planCompareCard ul{gap:0!important;margin:8px 0 0!important}
.planCompareCard li{grid-template-columns:36px minmax(0,1fr) auto!important;gap:9px!important;margin:0!important;padding:10px 5px!important}
.planCompareFeatureIcon{width:36px!important;height:36px!important}.planCompareFeatureIcon svg{width:20px!important;height:20px!important}
.planCompareCard li strong{font-size:.76rem!important}.planCompareCard li p{font-size:.65rem!important;line-height:1.3!important}
.planCompareBadge{padding:4px 6px!important;font-size:.53rem!important}
.planBottomAction{margin-top:auto!important;padding-top:10px!important}.planChooseButton{min-height:44px!important}
.planBestValue{top:12px!important}

/* Connected-app simulation center. */
.accountIntegrationCard{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:15px;margin:0 0 14px;padding:16px;border:1px solid color-mix(in srgb,var(--accent) 50%,var(--line));border-radius:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,var(--surface-raised)),var(--surface-raised));box-shadow:0 12px 28px rgba(0,0,0,.12)}
.accountIntegrationIcon{display:grid;place-items:center;width:54px;height:54px;border:1px solid color-mix(in srgb,var(--accent) 60%,var(--line));border-radius:16px;background:var(--accent-soft);color:var(--accent2)}.accountIntegrationIcon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.accountIntegrationCard>div>span,.integrationDialog header span{color:var(--accent2);font-size:.66rem;font-weight:900;letter-spacing:.11em}.accountIntegrationCard strong{display:block;margin:3px 0;font-size:.94rem}.accountIntegrationCard p{margin:0;color:var(--muted);font-size:.72rem;line-height:1.4}.accountIntegrationCard>.btn{min-width:150px;font-weight:600}
.integrationBackdrop{position:fixed;z-index:6800;inset:0;display:grid;place-items:center;padding:18px;background:rgba(3,7,12,.86);backdrop-filter:blur(14px)}
.integrationDialog{width:min(920px,100%);max-height:calc(100vh - 32px);overflow:auto;border:1px solid color-mix(in srgb,var(--accent) 72%,var(--line));border-radius:24px;background:var(--panel);box-shadow:0 34px 100px rgba(0,0,0,.62),0 0 34px color-mix(in srgb,var(--accent) 18%,transparent)}
.integrationDialog>header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 24px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 16%,var(--panel)),var(--panel))}.integrationDialog h2{margin:5px 0 3px}.integrationDialog header p{margin:0;color:var(--muted)}
.integrationNotice{display:flex;align-items:center;gap:10px;margin:16px 20px 0;padding:11px 13px;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--line));border-radius:13px;background:var(--accent-soft);font-size:.72rem}.integrationNotice b{color:var(--accent2);white-space:nowrap}.integrationNotice span{color:var(--muted)}
.integrationGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px 20px 22px}.integrationApp{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px;border:1px solid var(--line);border-radius:15px;background:var(--surface-raised);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.integrationApp:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 55%,var(--line));box-shadow:0 12px 24px rgba(0,0,0,.17)}.integrationApp.connected{border-color:color-mix(in srgb,var(--good) 55%,var(--line));background:color-mix(in srgb,var(--good) 7%,var(--surface-raised))}.integrationApp.locked{opacity:.72}
.integrationMark{display:grid;place-items:center;width:42px;height:42px;border:1px solid color-mix(in srgb,var(--accent) 58%,var(--line));border-radius:13px;background:var(--surface-input);color:var(--accent2);font-size:1rem;font-weight:900}.integrationApp>div>span{color:var(--accent2);font-size:.55rem;font-weight:900;letter-spacing:.1em}.integrationApp strong{display:block;font-size:.82rem}.integrationApp p{margin:3px 0 0;color:var(--muted);font-size:.64rem;line-height:1.35}.integrationApp>.btn{min-width:120px;padding:9px 10px;font-size:.67rem;font-weight:600}
.planEnabledGraphic svg{overflow:visible}.planEnabledFeatures div::before{margin-right:2px}
@media(max-width:760px){.accountPlanCompare{padding:12px!important}.planCompareCard{min-height:0}.accountIntegrationCard{grid-template-columns:auto minmax(0,1fr)}.accountIntegrationCard>.btn{grid-column:1/-1;width:100%}.integrationGrid{grid-template-columns:1fr}.integrationApp{grid-template-columns:auto minmax(0,1fr)}.integrationApp>.btn{grid-column:1/-1;width:100%}}
@media(max-width:440px){.integrationBackdrop{padding:7px}.integrationDialog{border-radius:18px}.integrationDialog>header{padding:17px}.integrationNotice{align-items:flex-start;flex-direction:column;margin:12px 12px 0}.integrationGrid{padding:12px}.planCompareCard{padding:15px!important}.planCompareCard.currentPlanCard{padding-top:54px!important}}

/* Downgrade-safe locked archive. */
.lockedArchiveBackdrop{position:fixed;z-index:7100;inset:0;display:grid;place-items:center;padding:18px;background:rgba(3,7,12,.88);backdrop-filter:blur(14px)}
.lockedArchiveDialog{position:relative;width:min(570px,100%);padding:30px;border:1px solid color-mix(in srgb,var(--accent) 74%,var(--line));border-radius:24px;background:radial-gradient(circle at 8% 0,color-mix(in srgb,var(--accent) 19%,transparent),transparent 42%),var(--panel);box-shadow:0 34px 100px rgba(0,0,0,.62),0 0 34px color-mix(in srgb,var(--accent) 20%,transparent)}
.lockedArchiveDialog>.accountProfileClose{position:absolute;right:18px;top:18px}.lockedArchiveIcon{display:grid;place-items:center;width:74px;height:74px;margin-bottom:17px;border:1px solid color-mix(in srgb,var(--accent) 70%,var(--line));border-radius:22px;background:var(--accent-soft);color:var(--accent2);box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 18%,transparent)}.lockedArchiveIcon svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lockedArchiveDialog>span{color:var(--accent2);font-size:.68rem;font-weight:900;letter-spacing:.13em}.lockedArchiveDialog h2{margin:6px 60px 5px 0;font-size:clamp(1.45rem,4vw,2rem)}.lockedArchiveDialog>strong{display:block;margin-top:12px;color:var(--accent2)}.lockedArchiveDialog>p{color:var(--muted);line-height:1.55}.lockedArchivePolicy{display:grid;gap:4px;margin:18px 0;padding:13px;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--line));border-radius:14px;background:var(--accent-soft)}.lockedArchivePolicy small{color:var(--muted)}.lockedArchiveActions{display:grid;grid-template-columns:1fr 1.35fr;gap:10px}.lockedArchiveActions .btn{min-height:48px}
.planLockedRecord{border-color:color-mix(in srgb,var(--accent) 52%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--surface-raised))}
@media(max-width:520px){.lockedArchiveDialog{padding:22px}.lockedArchiveActions{grid-template-columns:1fr}.lockedArchiveBackdrop{padding:8px}}
.accountPlanScrollRail{right:8px!important;width:8px!important;overflow:hidden!important;border-radius:999px!important}
.simulatedCheckoutDialog{position:relative;overflow:hidden!important}.simulatedCheckoutScroll{max-height:calc(100vh - 28px);margin-right:12px;overflow:auto;overscroll-behavior:contain;scrollbar-width:none!important}.simulatedCheckoutScroll::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}.simulatedCheckoutScrollRail{position:absolute;z-index:5;right:7px;width:8px;overflow:hidden;padding:1px;border-radius:999px;background:color-mix(in srgb,var(--surface-input) 88%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 28%,var(--line));cursor:pointer;pointer-events:auto;touch-action:none}.simulatedCheckoutScrollRail[hidden]{display:none}.simulatedCheckoutScrollRail>span{display:block;width:100%;min-height:42px;border-radius:999px;background:linear-gradient(180deg,var(--accent2),var(--accent));box-shadow:0 0 7px color-mix(in srgb,var(--accent) 38%,transparent);cursor:grab;will-change:transform}.simulatedCheckoutScrollRail.dragging>span{cursor:grabbing}.simulatedCheckoutScrollRail:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}
.planEnabledDialog.planDowngradeScheduled .planEnabledActions{display:flex;justify-content:center}
.planEnabledDialog.planDowngradeScheduled .planEnabledActions .btn{width:min(354px,100%)}

/* Integration tiles now carry real brand SVGs instead of a letter, so the mark
   becomes a plate for the logo rather than a typographic badge. */
.integrationMark img{width:24px;height:24px;object-fit:contain;display:block}
.integrationApp.locked .integrationMark img{opacity:.45;filter:grayscale(1)}
.integrationApp.connected .integrationMark{border-color:color-mix(in srgb,var(--good,#4ade80) 55%,var(--line))}

/* ---- in-development integration details popup ---- */
.integrationApp.indev .integrationMark img{opacity:.85}
.integrationDetailBackdrop{
  position:fixed;inset:0;z-index:12050;
  display:grid;place-items:center;padding:18px;
  background:color-mix(in srgb,var(--bg) 55%,rgba(3,6,11,.78));
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.integrationDetail{
  position:relative;
  display:grid;justify-items:center;gap:11px;
  width:min(420px,100%);padding:26px 24px 22px;text-align:center;
  border:1px solid color-mix(in srgb,var(--accent) 42%,var(--line));
  border-radius:20px;
  background:color-mix(in srgb,var(--panel) 97%,black 3%);
  box-shadow:0 30px 80px rgba(0,0,0,.55);
  animation:integrationDetailPop .38s cubic-bezier(.2,.85,.2,1) both;
}
@keyframes integrationDetailPop{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
.integrationDetail .accountProfileClose{position:absolute;top:12px;right:12px}
.integrationDetailMark{
  display:grid;place-items:center;width:58px;height:58px;border-radius:17px;
  border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));
  background:color-mix(in srgb,var(--accent) 8%,var(--surface-raised,var(--panel2)));
}
.integrationDetailMark img{width:30px;height:30px;object-fit:contain}
.integrationDetailBadge{
  padding:3px 11px;border-radius:999px;
  border:1px solid color-mix(in srgb,var(--warn,#f59e0b) 45%,var(--line));
  background:color-mix(in srgb,var(--warn,#f59e0b) 10%,transparent);
  color:var(--warn,#f59e0b);font-size:.6rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;
}
.integrationDetail h2{margin:0;font-size:1.2rem;letter-spacing:-.02em}
.integrationDetailLede{margin:0;max-width:34ch;color:var(--muted);font-size:.85rem;line-height:1.5}
.integrationDetailList{
  display:grid;gap:8px;margin:4px 0 0;padding:0;list-style:none;text-align:left;width:100%;
}
.integrationDetailList li{
  display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;
  color:var(--text);font-size:.82rem;line-height:1.4;
}
.integrationDetailTick{
  width:17px;height:17px;margin-top:1px;border-radius:50%;position:relative;flex:0 0 auto;
  background:color-mix(in srgb,var(--good,#4ade80) 22%,transparent);
  border:1px solid color-mix(in srgb,var(--good,#4ade80) 55%,var(--line));
}
.integrationDetailTick::after{
  content:"";position:absolute;left:5px;top:2px;width:4px;height:8px;
  border:solid var(--good,#4ade80);border-width:0 2px 2px 0;transform:rotate(45deg);
}
.integrationDetailNote{
  margin:2px 0 0;padding:10px 12px;
  border:1px solid color-mix(in srgb,var(--line) 80%,transparent);border-radius:11px;
  background:color-mix(in srgb,var(--surface-input,var(--panel)) 80%,transparent);
  color:var(--muted);font-size:.73rem;line-height:1.5;
}
.integrationDetail .btn{min-width:140px;margin-top:4px}
@media(prefers-reduced-motion:reduce){.integrationDetail{animation:none!important}}

/* "Suggest a workflow" card in the integrations grid */
.integrationSuggest{
  border-style:dashed!important;
  border-color:color-mix(in srgb,var(--accent) 42%,var(--line))!important;
  background:color-mix(in srgb,var(--accent) 5%,transparent);
  cursor:pointer;
}
.integrationSuggest:hover,.integrationSuggest:focus-visible{
  border-color:var(--accent)!important;
  background:color-mix(in srgb,var(--accent) 10%,transparent);
  outline:none;
}
.integrationSuggestMark{
  display:grid!important;place-items:center;
  font-size:1.7rem;font-weight:300;line-height:1;color:var(--accent2,var(--accent));
  background:color-mix(in srgb,var(--accent) 12%,transparent)!important;
  border:1px dashed color-mix(in srgb,var(--accent) 45%,var(--line))!important;
}
.integrationSuggest [data-integration-suggest]{color:var(--accent2,var(--accent))}

/* Suggest-a-workflow dialog (opens over the integrations manager) */
.workflowSuggestBackdrop{
  position:fixed;inset:0;z-index:2147483300;display:grid;place-items:center;padding:20px;
  background:rgba(3,7,12,.6);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.workflowSuggestDialog{
  position:relative;width:min(460px,100%);display:flex;flex-direction:column;gap:12px;
  padding:24px;border-radius:18px;
  background:var(--panel,#141b24);color:var(--text);
  border:1px solid var(--line,#28323f);box-shadow:0 30px 80px -20px rgba(0,0,0,.7);
}
.workflowSuggestMark{
  display:grid;place-items:center;width:46px;height:46px;border-radius:13px;
  border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line));
  background:color-mix(in srgb,var(--accent) 10%,transparent);
}
.workflowSuggestMark svg{width:24px;height:24px;stroke:var(--accent2,var(--accent));fill:none}
.workflowSuggestDialog h2{margin:2px 0 0;font-size:1.2rem;letter-spacing:-.01em}
.workflowSuggestLede{margin:0;color:var(--muted);font-size:.86rem;line-height:1.5}
.workflowSuggestField{display:grid;gap:5px}
.workflowSuggestField>span{font-size:.78rem;font-weight:700;color:var(--text)}
.workflowSuggestField em{color:var(--muted);font-weight:500;font-style:normal}
.workflowSuggestField input,.workflowSuggestField textarea{
  width:100%;border:1px solid var(--line);border-radius:11px;
  background:var(--surface-input,#0d1117);color:var(--text);
  padding:11px 12px;font:inherit;font-size:.92rem;outline:none;resize:vertical;
}
.workflowSuggestField input:focus,.workflowSuggestField textarea:focus{
  border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent);
}
.workflowSuggestError{margin:0;color:var(--bad,#f0603f);font-size:.8rem;font-weight:600}
.workflowSuggestActions{display:flex;gap:10px;justify-content:flex-end;margin-top:4px}

/* "Encrypted at rest" indicator in the integrations manager */
.integrationSecurity{
  display:flex;align-items:center;gap:9px;margin:9px 0 11px 8px;padding:10px 14px;border-radius:12px;
  font-size:.8rem;line-height:1;color:var(--good,#4ade80);
  border:1px solid color-mix(in srgb,var(--good,#4ade80) 40%,var(--line));
  background:color-mix(in srgb,var(--good,#4ade80) 8%,transparent);
}
.integrationSecurity b{color:var(--text)}
.integrationSecurityLock{font-size:1rem;line-height:1;display:flex;align-items:center;transform:translateY(-1px)}

/* === Compact plans dialog (approved 2026-08-04): wider frame, 2-column Pro/Pro+ feature cards, and a glance table — cuts vertical scroll. === */
.accountPlanDialog{width:min(1360px,96vw)!important}
@media(min-width:981px){
  .accountPlanCompare{grid-template-columns:.9fr 1.1fr 1.1fr!important}
  .accountPlanCompare::before{display:none!important}
  .planComparePro>ul,.planComparePlus>ul{display:grid!important;grid-template-columns:1fr 1fr!important;column-gap:16px!important;row-gap:0!important;align-content:start!important}
  .planComparePro>ul>li,.planComparePlus>ul>li{grid-template-columns:34px minmax(0,1fr)!important;grid-template-rows:auto auto!important;align-items:start!important;gap:3px 9px!important;padding:9px 6px!important;margin-inline:0!important;border-bottom:0!important}
  .planComparePro>ul>li:hover,.planComparePlus>ul>li:hover{transform:none!important;background:transparent!important}
  .planComparePro>ul>li>.planCompareFeatureIcon,.planComparePlus>ul>li>.planCompareFeatureIcon{grid-row:1/3!important;align-self:start!important;width:34px!important;height:34px!important}
  .planComparePro>ul>li>.planCompareFeatureIcon svg,.planComparePlus>ul>li>.planCompareFeatureIcon svg{width:19px!important;height:19px!important}
  .planComparePro>ul>li>.planCompareBadgeWrap,.planComparePlus>ul>li>.planCompareBadgeWrap{grid-column:2!important;justify-items:start!important;justify-self:start!important;margin-top:3px!important}
  .planComparePro>ul>li strong,.planComparePlus>ul>li strong{font-size:.8rem!important;line-height:1.18!important}
  .planComparePro>ul>li p,.planComparePlus>ul>li p{font-size:.68rem!important;line-height:1.3!important;margin-top:1px!important}
}
.planBestValue{top:19px!important;right:-46px!important;width:160px!important;padding:5px 0!important;transform:rotate(45deg)!important;font-size:.55rem!important;letter-spacing:.09em!important}
.planGlance{margin:0 26px 22px;border:1px solid var(--line);border-radius:16px;background:var(--surface-input);overflow:hidden}
.planGlance>h3{margin:0;padding:13px 18px;font-size:.66rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--accent2);border-bottom:1px solid var(--line)}
.planGlanceScroll{overflow-x:auto}
.planGlance table{width:100%;border-collapse:collapse;font-size:.72rem;min-width:860px}
.planGlance th,.planGlance td{padding:11px 10px;text-align:center;border-bottom:1px solid color-mix(in srgb,var(--line) 80%,transparent)}
.planGlance thead th{color:var(--muted);font-size:.6rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase}
.planGlance thead th:first-child,.planGlance tbody th{position:sticky;left:0;text-align:left;background:var(--surface-input)}
.planGlance tbody th{font-weight:800;color:var(--text)}
.planGlance tbody tr:last-child th,.planGlance tbody tr:last-child td{border-bottom:0}
.planGlance .gYes{color:var(--good,#3fb27f);font-weight:900}
.planGlance .gNo{color:var(--muted);opacity:.45}
.planGlance tbody tr.gPlus{background:color-mix(in srgb,var(--accent) 6%,transparent)}
@media(max-width:760px){.planGlance{margin:0 15px 16px}}

/* ---- Signed-in Free plan card (bottom of the Calculator tab) ------------------------------------
   Static page content, not an overlay: no fixed positioning, no backdrop, no z-index. It sits after
   the calculator so it can never cover anything. Global theme tokens only, so it works across all
   ~24 themes including the light ones. */
.freePlanCard{margin:18px 0 0;padding:20px;border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line));
  border-radius:var(--r,18px);background:linear-gradient(155deg,color-mix(in srgb,var(--accent) 7%,var(--panel)),var(--panel));
  box-shadow:0 10px 28px rgba(0,0,0,.14)}
.freePlanCard[hidden]{display:none!important}
.freePlanCard header{margin:0 0 14px}
.freePlanCard header span{display:block;color:var(--accent2);font-size:.66rem;font-weight:900;letter-spacing:.14em}
.freePlanCard header h3{margin:0;font-size:1.15rem;color:var(--text)}
/* The heading sat alone with no plan icon, unlike every other plan card in the app — which read as
   a missing/empty icon slot. Reuses the same freePlanIcon() glyph the account page card uses. */
.freePlanCard .freePlanTitle{display:flex;align-items:center;gap:11px;margin:6px 0 0}
.freePlanCard .accountPlanIcon{display:grid;place-items:center;width:38px;height:38px;flex:none;
  border-radius:11px;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));
  background:color-mix(in srgb,var(--accent) 12%,var(--panel2));color:var(--accent2)}
.freePlanCard .accountPlanIcon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:3.4;
  stroke-linecap:round;stroke-linejoin:round}
.freePlanMeters{display:grid;gap:10px;margin:0 0 14px;padding:0;list-style:none}
.freePlanMeter{display:grid;gap:6px}
.freePlanMeter>div{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.freePlanMeter strong{font-size:.9rem;color:var(--text);font-variant-numeric:tabular-nums}
.freePlanMeter span{color:var(--muted);font-size:.78rem}
.freePlanMeter i{display:block;height:6px;border-radius:999px;background:var(--panel2);overflow:hidden}
.freePlanMeter i b{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .3s ease}
.freePlanMeter.isNear i b{background:linear-gradient(90deg,var(--warn),var(--accent2))}
.freePlanMeter.isFull i b{background:var(--bad)}
.freePlanPitch{margin:0 0 16px;color:var(--muted);font-size:.86rem;line-height:1.5}
.freePlanActions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.freePlanActions .btn{min-height:44px}
.freePlanFine{margin:12px 0 0;color:var(--muted);opacity:.75;font-size:.74rem;text-align:center}
@media(max-width:620px){.freePlanCard{padding:16px}.freePlanActions{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.freePlanMeter i b{transition:none}}