/* Music Bot: antialiased atlas motion, a crisp brand mark, and a dark reading area. */
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary{
 position:relative;display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:0!important;padding:0!important;overflow:hidden;background:#030406!important;color:#eef1f7;
}
.teaser-musicbot .musicbot-hero{display:block;position:relative;isolation:isolate;flex:none;width:100%;height:226px;overflow:hidden;overflow:clip;background:#030406}
.teaser-musicbot .musicbot-visuals{display:block;position:absolute;inset:0;pointer-events:none}
.teaser-musicbot :is(.musicbot-poster,.musicbot-canvas,.musicbot-freeze){display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;pointer-events:none}
.teaser-musicbot .musicbot-freeze{opacity:0}
.teaser-musicbot .has-frozen-frame .musicbot-freeze{opacity:1}
.teaser-musicbot .has-frozen-frame .musicbot-poster{opacity:0}
.teaser-musicbot .musicbot-poster img{display:block;width:100%;height:100%;object-fit:cover}
/* Do not flash an unrelated poster before the first live atlas frame on reload. */
.teaser-musicbot .musicbot-hero:not([data-music-renderer]) .musicbot-poster{opacity:0}
@media(prefers-reduced-motion:reduce){.teaser-musicbot .musicbot-hero:not([data-music-renderer]) .musicbot-poster{opacity:1}}
.teaser-musicbot .musicbot-canvas{opacity:0}
.teaser-musicbot .musicbot-hero.is-playing .musicbot-canvas{opacity:1}
.teaser-musicbot .musicbot-glow{position:absolute;z-index:1;left:50%;top:55%;width:340px;height:230px;transform:translate(-50%,-50%);background:radial-gradient(ellipse closest-side,#ffffff38,#ffffff10 46%,#ffffff00 100%);pointer-events:none}
.teaser-musicbot .musicbot-logo{position:absolute;z-index:2;left:50%;top:55%;width:336px;height:336px;max-width:none;object-fit:contain;mix-blend-mode:screen;transform:translate(-50%,-50%) scale(1);transition:transform 650ms cubic-bezier(.2,.75,.2,1);pointer-events:none}
/* Let the brand react to the pointer without changing the artwork pace. */
@media(hover:hover) and (pointer:fine){.teaser-musicbot>summary:hover .musicbot-logo{transform:translate(-50%,-50%) scale(1.06)}}
.teaser-musicbot .musicbot-visuals::after{content:"";position:absolute;z-index:3;inset:0;background:linear-gradient(0deg,#030406,transparent 38%),linear-gradient(180deg,#030405ab,transparent 36%);pointer-events:none}
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary :is(.project-teaser-kicker,.portfolio-card-top){position:absolute;z-index:4;top:19px;left:24px;right:24px;margin:0;padding:0;min-height:22px;color:#e0e3e9}
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary :is(.case-index,.project-teaser-kicker>span:first-child,.wb-card-tools){color:#e0e3e9}
html body.home-page details#home-music-bot>summary .project-teaser-title{display:block;position:relative;margin:0;padding:0 24px;font-size:26px;line-height:1.2}
html body.home-page details#home-music-bot>summary .project-featured-description{display:block;max-width:790px;margin:8px 24px 0;padding:0;font:400 14px/1.6 "Segoe UI",Arial,sans-serif;color:#adb4c1}
html body.portfolio-page details#music-bot>summary .portfolio-card-intro{display:block;margin:0;padding:0 24px}
html body.portfolio-page details#music-bot>summary .portfolio-card-intro h2{font-size:26px;line-height:1.2;letter-spacing:-.6px}
html body.portfolio-page details#music-bot>summary .portfolio-tagline{max-width:790px;height:auto!important;min-height:0!important;max-height:none!important;-webkit-line-clamp:unset!important;line-clamp:unset!important;margin:8px 0 0;font:400 14px/1.6 "Segoe UI",Arial,sans-serif;color:#adb4c1}
html body.portfolio-page details#music-bot>summary .summary-action{margin-top:10px}
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .summary-action{color:#adb4c1!important}
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .case-index span{color:inherit!important}
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .project-tags{align-self:stretch!important;width:auto!important;margin:16px 24px 24px;padding:0;max-width:none}
.teaser-musicbot .musicbot-motion{display:inline-flex;align-items:center;gap:7px;position:absolute;z-index:5;right:24px;bottom:19px;min-height:30px;padding:5px 9px;border:1px solid #dce3ef30;border-radius:6px;background:#090c11b8;color:#d8dce5;font:10px/1.4 Consolas,monospace;cursor:pointer}
.teaser-musicbot .musicbot-motion:hover{background:#1c222dd9;border-color:#dce3ef66}
.teaser-musicbot .musicbot-motion:focus-visible{outline:2px solid #dce3ef;outline-offset:3px}
.teaser-musicbot .musicbot-motion svg{display:block;position:static!important;inset:auto!important;width:12px!important;height:12px!important;min-width:0;min-height:0;margin:0;padding:0;border:0;border-radius:0;background:none!important;fill:none;stroke:currentColor;stroke-width:1.4;transform:none!important}
.teaser-musicbot .musicbot-motion[hidden]{display:none!important}
.teaser-musicbot .musicbot-motion [data-motion-play]{display:none}
.teaser-musicbot .musicbot-motion[aria-pressed="true"] [data-motion-pause]{display:none}
.teaser-musicbot .musicbot-motion[aria-pressed="true"] [data-motion-play]{display:block}
@media(max-width:600px){
 .teaser-musicbot .musicbot-hero{height:210px}
 .teaser-musicbot .musicbot-logo{width:264px;height:264px;top:53%}
 .teaser-musicbot .musicbot-glow{width:270px;height:190px;top:53%}
 html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary :is(.project-teaser-kicker,.portfolio-card-top){top:16px;left:18px;right:18px}
 html body.home-page details#home-music-bot>summary .project-teaser-title,html body.portfolio-page details#music-bot>summary .portfolio-card-intro{padding:0 18px}
 html body.home-page details#home-music-bot>summary .project-featured-description{margin:8px 18px 0}
 html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .project-tags{margin:14px 18px 20px}
 .teaser-musicbot .musicbot-motion{right:18px;bottom:13px}
}
@media(pointer:coarse){.teaser-musicbot .musicbot-motion{min-height:44px;min-width:44px;padding:8px 11px}}
@media(prefers-reduced-motion:reduce){.teaser-musicbot .musicbot-logo{transition:none;transform:translate(-50%,-50%)!important}.teaser-musicbot .musicbot-canvas{display:none}}

html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary :is(.project-teaser-title,.portfolio-card-intro h2){color:#eef1f7!important}
html body.home-page details#home-music-bot>summary .project-teaser-title>span{color:inherit!important}
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .project-tags{position:relative;isolation:isolate}
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .project-tags::before{content:"";position:absolute;inset:-16px -24px -24px;z-index:-1;background:#030406;pointer-events:none}
@media(max-width:600px){html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .project-tags::before{inset:-14px -18px -20px}}
.teaser-musicbot .musicbot-hero.is-playing .musicbot-poster{opacity:0}
@media(prefers-reduced-motion:reduce){.teaser-musicbot .musicbot-hero.is-playing .musicbot-poster{opacity:1}}

/* Dim only the flying artwork while the project dialog opens. The brand stays crisp. */
.teaser-musicbot .musicbot-visuals::before{content:"";position:absolute;z-index:1;inset:0;background:#030406;opacity:0;transition:opacity 650ms cubic-bezier(.22,.61,.36,1);pointer-events:none}
.teaser-musicbot .is-dialog-muted .musicbot-visuals::before{opacity:1}
@media(prefers-reduced-motion:reduce){.teaser-musicbot .musicbot-visuals::before{transition:none}}

/* The motion control shares the last tag row and keeps its own hit target. */
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .musicbot-card-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:8px;position:relative;isolation:isolate;padding:16px 24px 24px;background:#030406}
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .musicbot-card-bottom .project-tags{display:contents;margin:0;padding:0}
html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .musicbot-card-bottom .project-tags::before{content:none}
.teaser-musicbot .musicbot-card-bottom .musicbot-motion{position:relative;inset:auto;margin-left:auto;flex:none;min-height:30px}
@media(max-width:600px){html body:is(.home-page,.portfolio-page) details.teaser-musicbot:is(#home-music-bot,#music-bot)>summary .musicbot-card-bottom{padding:14px 18px 20px}}
@media(pointer:coarse){.teaser-musicbot .musicbot-card-bottom .musicbot-motion{min-height:44px}}

/* A captured scroll frame stays exclusive until its live replacement is drawn. */
.teaser-musicbot .musicbot-hero.has-frozen-frame .musicbot-canvas{opacity:0}
