/* Original supplied artwork, recolored through its existing transparent alpha. */
:root{--logo-accent:#a9dfcb;--logo-text:#ecf5ea}
html[data-theme=violet]{--logo-accent:#d6b2ee;--logo-text:#f3e8fc}
html[data-theme=ocean]{--logo-accent:#93dafa;--logo-text:#e4f6ff}
html[data-theme=amber]{--logo-accent:#efbc81;--logo-text:#fff0dd}
html[data-theme=forest]{--logo-accent:#b8db9b;--logo-text:#edf7e3}
.brand.brandArtwork,.footerBrand.brandArtwork{display:block;position:relative;width:236px;height:50px;flex:0 0 236px;padding:0;line-height:1;letter-spacing:0;background:linear-gradient(90deg,var(--logo-accent) 0 24%,var(--logo-text) 24% 100%);-webkit-mask-image:url('/assets/beatroom-logo-original.png');mask-image:url('/assets/beatroom-logo-original.png');-webkit-mask-size:100% auto;mask-size:100% auto;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-mode:alpha}
.footerBrand.brandArtwork{width:185px;height:40px;flex-basis:185px}
.brandArtwork:focus-visible{outline:none;filter:drop-shadow(0 0 5px var(--logo-accent))}
.plainPageInner>.brandArtwork{margin-bottom:28px}
@media(max-width:1150px){.soundHeaderInner .brand.brandArtwork{width:198px;height:44px;flex-basis:198px}}
@media(max-width:650px){.soundHeaderInner .brand.brandArtwork,.accountTop .brand.brandArtwork{width:146px;height:34px;flex-basis:146px}.footerBrand.brandArtwork{width:164px;height:36px;flex-basis:164px}}
@media(max-width:370px){.soundHeaderInner .brand.brandArtwork{width:128px;height:29px;flex-basis:128px}}

/* OPIUM ZONE wordmark: glyph + display type, colors follow the active theme. */
@font-face{font-family:"Unbounded";font-style:normal;font-display:swap;font-weight:200 900;src:url(/assets/fonts/unbounded-latin-wght-normal.woff2) format("woff2")}
.ozMark{--oz-a:var(--logo-accent);--oz-b:#e6c3a7;display:inline-flex;align-items:center;gap:12px;flex:none;color:var(--logo-text);text-decoration:none;line-height:1;letter-spacing:0;padding:0;font:inherit}
html[data-theme=violet] .ozMark{--oz-b:#efc5d1}html[data-theme=ocean] .ozMark{--oz-b:#a7eadf}html[data-theme=amber] .ozMark{--oz-b:#f2bba9}html[data-theme=forest] .ozMark{--oz-b:#dedba9}
.ozGlyph{position:relative;display:grid;place-items:center;width:38px;height:38px;flex:none}
.ozGlyph svg{width:100%;height:100%;overflow:visible;display:block}
.ozGlyph .ozOrbit{transform-origin:20px 20px;animation:ozSpin 9s linear infinite}
.ozGlyph .ozCore{transform-origin:20px 20px;animation:ozPulse 3.2s ease-in-out infinite}
.ozWord{display:inline-flex;align-items:baseline;gap:.42em;font-family:"Unbounded","Inter",system-ui,sans-serif;font-size:19px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;white-space:nowrap}
.ozWord b{font-weight:300;letter-spacing:.16em;background:linear-gradient(95deg,var(--oz-a),var(--oz-b));-webkit-background-clip:text;background-clip:text;color:transparent}
.ozMark:hover .ozGlyph svg{filter:drop-shadow(0 0 8px color-mix(in srgb,var(--oz-a) 60%,transparent))}
.ozMark:focus-visible{outline:2px solid var(--oz-a);outline-offset:6px;border-radius:8px}
.footerBrand.ozMark .ozGlyph{width:30px;height:30px}.footerBrand.ozMark .ozWord{font-size:15px}
.plainPageInner>.ozMark{margin-bottom:28px}
.dialogBrand{font-family:"Unbounded","Inter",system-ui,sans-serif!important;font-weight:600;letter-spacing:.08em!important;text-transform:uppercase;font-size:13px!important}
@keyframes ozSpin{to{transform:rotate(360deg)}}
@keyframes ozPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.82);opacity:.75}}
@media(max-width:1150px){.soundHeaderInner .ozWord{font-size:17px}.soundHeaderInner .ozGlyph{width:34px;height:34px}}
@media(max-width:650px){.soundHeaderInner .ozWord,.accountTop .ozWord{font-size:15px}.soundHeaderInner .ozGlyph,.accountTop .ozGlyph{width:30px;height:30px}.ozMark{gap:9px}}
@media(prefers-reduced-motion:reduce){.ozGlyph .ozOrbit,.ozGlyph .ozCore{animation:none}}
.ozMark .ozWord{color:var(--logo-text)!important}