/* A single, consistent menu and wordmark across every primary page. */
.simple-header{direction:ltr!important;background:#fff;gap:12px}
header.simple-header{position:sticky;top:0;z-index:25;border-bottom:1px solid #eee}
body:not(.signed-out) main>header.simple-header{padding:12px 0;margin-bottom:20px;min-height:68px}
body:not(.signed-out) main{padding-top:0}
.simple-header-brand,.simple-header .header-brand{display:flex;align-items:center;gap:8px;min-width:0}
.simple-header .brand,.simple-header .wordmark{display:inline-flex;align-items:center;gap:0;text-decoration:none;white-space:nowrap}
.simple-header .brand>b,.simple-header .wordmark>b,.simple-header .brand small{display:none}
.simple-header .brand>span,.simple-header .wordmark>span{display:inline-block;margin:0;font:500 32px/1.05 'Helvetica Neue',Arial,Helvetica,sans-serif;letter-spacing:-1.6px;color:#000}
.simple-header .brand strong,.simple-header .brand em,.simple-header .wordmark strong,.simple-header .wordmark em{margin:0;font:inherit;letter-spacing:inherit;color:inherit}
.simple-header #profile.menu-trigger,.simple-header #buyer-menu-trigger,.simple-header .site-menu-trigger{display:grid;place-items:center;flex-shrink:0;width:36px;min-width:36px;height:44px;min-height:44px;margin:0;padding:3px;background:transparent;border:0;border-radius:4px;color:#000;box-shadow:none}
.simple-header #profile.menu-trigger svg,.simple-header #buyer-menu-trigger svg,.simple-header .site-menu-trigger svg{display:block;width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.simple-header .header-account{margin-left:auto}
header.simple-header>.simple-header-inner{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1000px;min-height:68px;margin:auto;padding:10px 16px;gap:12px}
header.simple-header .simple-header-brand{flex:0 1 auto}
#buyer-menu{inset:76px auto auto 14px}
.simple-header #buyer-menu-trigger[hidden]{display:none}
.simple-header #buyer-menu-trigger:focus-visible,.simple-header .site-menu-trigger:focus-visible{outline:2px solid #00bdb6;outline-offset:2px}
@media(max-width:360px){.simple-header .brand>span,.simple-header .wordmark>span{font-size:29px}.simple-header-brand,.simple-header .header-brand{gap:7px}}

.login-top.simple-header{max-width:none;min-height:68px;margin:0;padding:10px 16px}.buyer-menu-sound[hidden],.buyer-menu-login[hidden]{display:none}.buyer-menu-login{display:block;padding:12px 0;color:inherit;text-decoration:none;font-size:14px}

/* Replace the raster crop block in simple-header.css with this rule.
   The existing visually hidden strong/em rule remains for accessible text. */
.simple-header .brand>span,
.simple-header .wordmark>span {
  --wordmark-height:28px;
  position:relative;
  flex:none;
  width:calc(var(--wordmark-height)*4.9968333);
  height:var(--wordmark-height);
  background-image:url('supermall-wordmark-black-v2.svg');
  background-repeat:no-repeat;
  background-size:100% 100%;
  background-position:center;
}
.simple-header #profile.menu-trigger svg,
.simple-header #buyer-menu-trigger svg,
.simple-header .site-menu-trigger svg {
  width:28px;
  height:28px;
  stroke-width:1.35;
  stroke-linecap:round;
}
@media(max-width:360px) {
  .simple-header .brand>span,
  .simple-header .wordmark>span { --wordmark-height:26px; }
}

.simple-header .brand strong,.simple-header .brand em,.simple-header .wordmark strong,.simple-header .wordmark em{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}