/* Balanced brand / navigation / action bar. */
.masthead{min-height:88px;padding:18px max(24px,4vw);display:grid;grid-template-columns:minmax(150px,1fr) auto minmax(150px,1fr);align-items:center;gap:28px;background:#020b07;border-bottom:1px solid #163120;box-shadow:0 8px 28px #0002;z-index:20;transform:none}
.masthead .brand{justify-self:start;gap:10px;font-size:25px;letter-spacing:1.5px}.masthead .brand img{display:block;flex:none;width:40px;height:40px;border:1px solid #22633a}.masthead .brand small{display:none}
.masthead nav{order:0;width:auto;margin:0;gap:clamp(22px,2.7vw,42px);justify-content:center;white-space:nowrap}
.masthead nav a,.masthead nav button{font-family:Uncial,Georgia,serif;font-size:13px;letter-spacing:.3px;line-height:1.4;padding:12px 0;color:#f5efd8;transition:color .18s}
.masthead nav a:after,.masthead nav button:after{height:3px;bottom:3px;left:0;right:0;border-radius:50% 30% 40% 20%;background:#6de539;box-shadow:0 0 8px #6de53922;transform:scaleX(0);transform-origin:left}
.masthead nav .active:after,.masthead nav a:hover:after,.masthead nav button:hover:after,.masthead nav a:focus-visible:after,.masthead nav button:focus-visible:after{transform:scaleX(1)}
.masthead nav .active{color:#fff8df}.masthead .header-actions{justify-self:end;margin:0;display:flex;gap:15px}.masthead .buy-button{order:2;padding:11px 22px;background:#d9f493;border:1px solid #d9f493;font-size:13px;box-shadow:none}.masthead .buy-button:hover{background:#ecffc2}.masthead .sound-button{padding:6px;color:#b7c7ad;font-size:19px}.masthead .menu-toggle{display:none}
@media(max-width:1000px){.masthead{grid-template-columns:1fr auto;gap:12px 20px;padding:15px 24px;min-height:115px}.masthead nav{grid-column:1/-1;grid-row:2;justify-content:center;gap:40px}.masthead .header-actions{grid-column:2;grid-row:1}.masthead nav a,.masthead nav button{font-size:12px;padding:8px 0}}
@media(max-width:600px){.masthead{padding:14px 18px 11px;min-height:118px;gap:10px}.masthead .brand{font-size:23px}.masthead .brand img{width:34px;height:34px}.masthead nav{width:100%;justify-content:space-between;gap:clamp(3px,1.3vw,8px)}.masthead nav a,.masthead nav button{font-size:clamp(8px,2.5vw,10px);letter-spacing:0;padding:9px 0}.masthead .buy-button{font-size:11px;padding:9px 15px}.masthead .header-actions{gap:9px}.masthead .sound-button{font-size:17px}}
@media(max-width:380px){.masthead .brand{font-size:18px;gap:7px}.masthead .brand img{width:28px;height:28px}.masthead .buy-button{padding:9px 12px}}
@media(prefers-reduced-motion:reduce){.masthead nav a:after,.masthead nav button:after{transition:none}}

/* Match the title's Uncial lettering, with an underline instead of a hover tile. */
.masthead .brand,.masthead nav a,.masthead nav button,.mobile-nav a,.mobile-nav button{font-family:Uncial,Georgia,serif;font-weight:700;color:#fff;text-shadow:0 2px 3px #0009}
.masthead nav a,.masthead nav button,.mobile-nav a,.mobile-nav button,
.masthead nav a:hover,.masthead nav button:hover,.masthead nav .active,.masthead nav a:focus-visible,.masthead nav button:focus-visible,
.mobile-nav a:hover,.mobile-nav button:hover,.mobile-nav .active,.mobile-nav a:focus-visible,.mobile-nav button:focus-visible{background:transparent;box-shadow:none;border-radius:0;transform:none}
.masthead nav a:focus-visible,.masthead nav button:focus-visible{outline:none;color:#d9f493}
.mobile-nav a:focus-visible,.mobile-nav button:focus-visible{text-decoration:underline;text-underline-offset:6px}

.masthead nav a:hover,.masthead nav button:hover,.masthead nav .active,.mobile-nav a:hover,.mobile-nav button:hover,.mobile-nav .active{color:#d9f493}

/* Larger navigation stays readable as it wraps on phones. */
.masthead{grid-template-columns:minmax(132px,1fr) auto minmax(160px,1fr);gap:clamp(16px,1.9vw,28px);padding-left:clamp(24px,3.5vw,58px);padding-right:clamp(24px,3.5vw,58px)}
.masthead nav{gap:clamp(16px,2vw,32px)}
.masthead nav a,.masthead nav button{font-size:clamp(14px,1.15vw,17px)}
@media(max-width:1180px){.masthead{grid-template-columns:1fr auto;gap:12px 20px;padding:15px 24px;min-height:124px}.masthead nav{grid-column:1/-1;grid-row:2;justify-content:center;gap:clamp(20px,4vw,48px)}.masthead .header-actions{grid-column:2;grid-row:1}.masthead nav a,.masthead nav button{font-size:14px;padding:8px 0}}
@media(max-width:600px){.masthead{padding:14px 18px 11px;min-height:150px;gap:10px}.masthead nav{display:flex;flex-wrap:wrap;justify-content:center;white-space:normal;gap:2px 18px}.masthead nav a,.masthead nav button{font-size:13px;letter-spacing:0;padding:9px 0;white-space:nowrap}}
@media(max-width:360px){.masthead nav{column-gap:15px}.masthead nav a,.masthead nav button{font-size:12px}}
