/* Settings is an icon-only square, the same footprint as the account & notification
   buttons — not a wide labelled pill. The "Settings" text is hidden (aria-label keeps it
   accessible); only the gear shows. */
.heroSettingsButton { min-width: 42px !important; width: 42px !important; max-width: 42px !important; min-height: 42px !important; height: 42px !important; padding: 9px !important; gap: 0 !important; }
.heroSettingsButton > span:not(.traditionalGear):not(.svgGear) { display: none !important; }
.heroSettingsButton svg { width: 18px !important; height: 18px !important; flex-basis: 18px !important; stroke-linecap: round; }

.inventoryLocked { overflow: hidden; }
.inventoryLockedHero { display: grid; justify-items: center; text-align: center; padding: 28px 22px 24px; border: 1px solid color-mix(in srgb,var(--accent) 34%,var(--line)); border-radius: 20px; background: linear-gradient(145deg,color-mix(in srgb,var(--panel2) 92%,var(--accent) 8%),var(--panel)); }
.inventoryLockedMark { width: 72px; height: 72px; display: grid; place-items: center; margin-bottom: 15px; border: 1px solid color-mix(in srgb,var(--accent) 48%,var(--line)); border-radius: 20px; background: var(--accent-soft); color: var(--accent2); box-shadow: 0 16px 34px color-mix(in srgb,var(--accent) 16%,transparent),inset 0 1px 0 color-mix(in srgb,#fff 18%,transparent); }
.inventoryLockedMark svg { width: 40px; height: 40px; }
.inventoryLockedHero h2 { max-width: 650px; margin: 7px 0 10px; font-size: clamp(1.45rem,3vw,2.15rem); }
.inventoryLockedHero p { max-width: 680px; margin: 0 0 20px; color: var(--muted); font-size: 1rem; line-height: 1.55; }
.inventoryLockedHero .googleSignInBtn { min-width: 240px; }
.inventoryBenefitGrid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-top: 18px; }
.inventoryBenefitGrid article { padding: 18px; border: 1px solid var(--line); border-radius: 17px; background: var(--surface-raised); }
.inventoryBenefitGrid h3 { margin: 10px 0 6px; font-size: .95rem; }
.inventoryBenefitGrid p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.45; }
.benefitIcon { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid color-mix(in srgb,var(--accent) 38%,var(--line)); border-radius: 11px; background: var(--accent-soft); color: var(--accent2); font-size: 1.25rem; }

/* Keep browser autofill and edited values inside the active theme. */
input,textarea { background-color: var(--surface-input) !important; color: var(--text) !important; }
input::placeholder,textarea::placeholder { color: var(--muted) !important; opacity: .82; }
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--text) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--surface-input) inset !important;
  box-shadow: 0 0 0 1000px var(--surface-input) inset !important;
  caret-color: var(--text) !important;
  transition: background-color 99999s ease-out 0s;
}

@media(max-width:850px){.inventoryBenefitGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.inventoryBenefitGrid{grid-template-columns:1fr}.inventoryLockedHero{padding:22px 15px}.inventoryLockedHero .googleSignInBtn{min-width:0;width:100%}}