/* A restrained, scalable identity: sharp typography releasing music. */
body:has(.dashboard,.playWorkspace,.profileHub) header .brand{font-size:clamp(37px,10vw,46px);line-height:1;font-weight:900;letter-spacing:-2.8px;color:#201e32}
body:has(.dashboard,.playWorkspace,.profileHub) header .brand>span:first-child{color:#6945ce}
body:has(.dashboard,.playWorkspace,.profileHub) header .tag{font-size:9px;letter-spacing:1.5px}
body:has(.playWorkspace) header{flex:0 0 49px;margin-bottom:8px}
.stereoMark{--stereo-bg:#1c192b;position:relative;isolation:isolate;background:var(--stereo-bg);color:#fff9f1;border-radius:12px;padding:10px 30px 10px 12px;max-width:100%;width:max-content;line-height:.93;overflow:hidden}
.stereoWords{display:flex;align-items:baseline;gap:.24em;font-weight:950;letter-spacing:-.045em;font-size:18px}
.stereoBreak{position:relative;display:inline-block;transform:rotate(-3deg);clip-path:polygon(0 0,100% 0,100% 42%,59% 51%,100% 49%,100% 100%,0 100%,0 59%,54% 51%,0 53%)}
.stereoThe{font-size:.48em;letter-spacing:.04em;color:#54ebda}
.stereoStereo{color:#fff9f1}
.stereoNotes{position:absolute;right:6px;top:5px;width:25px;height:30px;color:#54ebda;pointer-events:none}
.stereoNotes i{position:absolute;font-style:normal;font-size:15px;transform:rotate(18deg)}
.stereoNotes i:nth-child(2){top:13px;right:0;color:#ff6cce;transform:rotate(-15deg);font-size:13px}
.stereoNotes i:nth-child(3){top:-4px;right:1px;font-size:12px;color:#ff6cce}
.stereoMark--hero{width:100%;padding:16px 12px;border-radius:0;background:none;overflow:visible}
.stereoMark--hero .stereoWords{display:flex;flex-direction:column;align-items:flex-start;gap:3px;font-size:clamp(27px,7.6vw,44px);line-height:.92}
.stereoMark--hero .stereoThe{font-size:.32em;letter-spacing:.24em;margin:4px 0 3px 2px}
.stereoMark--hero .stereoNotes{right:3px;top:12px;transform:scale(1.3)}
.dashboard .dashHero{background:linear-gradient(115deg,#e8e0f3 0%,#ddd4ee 43%,#211c32 43.3%,#171522 100%);border:1px solid #30273f}
.dashboard .dashIdentity{padding:8px 10px 8px 3px;min-width:0}
.dashboard .dashIdentity p{color:#d9cfe5;font-size:12px;margin:4px 8px 9px}
.dashboard .dashLink{margin-left:8px;background:#54ebda;color:#172d31;font-size:12px}
.stereoMark--radar{padding:7px 31px 7px 10px;border-radius:8px}
.stereoMark--radar .stereoWords{font-size:17px}
.stereoMark--profile .stereoWords{font-size:clamp(16px,4.6vw,22px)}
.profileHub .dashHeading>div{min-width:0}
.profileHub .dashHeading h1{margin-top:12px}
.playHeading h1{font-size:29px;margin:5px 0}
.playHeading p{font-size:11px;margin:3px 0}
.dashboard>.btn.full{background:#282138;color:#fff;font-size:16px}
@media(max-height:700px){.stereoMark--hero{padding:8px}.stereoMark--hero .stereoWords{font-size:28px}.stereoMark--hero .stereoThe{margin:1px 0}.dashboard .dashIdentity p{margin:2px 8px 5px}.dashboard .dashLink{padding:7px 10px}}
@media(max-width:360px){.stereoMark--profile .stereoWords{font-size:15px}.stereoMark--hero .stereoWords{font-size:26px}.stereoMark--hero .stereoNotes{right:-2px;transform:scale(.95)}}

/* Twonio wordmark: musical note replaces the i dot across all screens. */
.brand .musicI,.toplogo .musicI{position:relative;display:inline-block;color:inherit}.brand .iNote,.toplogo .iNote{position:absolute;left:50%;top:.03em;transform:translateX(-48%);font-size:.29em;line-height:1;letter-spacing:0;color:#6945ce}.brand{padding-top:.12em}
