/* BLACK CAT SOUND — Hybrid Forest Nocturne 1.0
   Scoped additive stylesheet: does not replace css/main.css or audio components. */
body.bcs-hybrid-enabled{
  --bcs-hybrid-sidebar:212px;
  --bcs-hybrid-header:74px;
  --bcs-hybrid-teal:#63ddc4;
  --bcs-hybrid-stone:#d6ddd5;
  background:#071015;
}
body.bcs-hybrid-enabled.bcs-hybrid-sidebar-closed{--bcs-hybrid-sidebar:72px}
body.bcs-hybrid-enabled #bcs-player-root{left:var(--bcs-hybrid-sidebar)}
body.bcs-hybrid-enabled .bcs-v12.bcs-hybrid-shell{
  display:grid;
  grid-template-columns:var(--bcs-hybrid-sidebar) minmax(0,1fr);
  grid-template-rows:var(--bcs-hybrid-header) minmax(0,1fr);
  min-height:100vh;
  width:100%;
  background:
    radial-gradient(ellipse 48% 18% at 42% 0%,#1a584133,transparent 83%),
    linear-gradient(140deg,#071014,#071015 60%,#0a1218);
  transition:grid-template-columns .18s ease;
}
body.bcs-hybrid-enabled .bcs-hybrid-shell>.topbar{
  grid-column:1/-1;
  grid-row:1;
  position:sticky;
  top:0;
  z-index:80;
  display:flex;
  align-items:center;
  gap:clamp(8px,1.1vw,19px);
  min-height:var(--bcs-hybrid-header);
  height:var(--bcs-hybrid-header);
  padding:0 clamp(12px,1.7vw,30px);
  background:linear-gradient(180deg,#09151bea,#071116f6);
  border-bottom:1px solid #357b6b8c;
  box-shadow:inset 0 1px 0 #b4ffe80d,0 7px 28px #0008;
  backdrop-filter:blur(17px);
}
body.bcs-hybrid-enabled .bcs-hybrid-shell>.topbar::after{
  content:"";position:absolute;inset:auto 4% 0 4%;height:1px;
  background:linear-gradient(90deg,transparent,#62e3c744 40%,#5bf0cf88 52%,#62e3c744 65%,transparent);
  pointer-events:none;
}
body.bcs-hybrid-enabled .bcs-hybrid-shell>.sidebar{
  grid-column:1;
  grid-row:2;
  position:sticky;
  top:var(--bcs-hybrid-header);
  width:100%;min-width:0;min-height:0;
  height:calc(100vh - var(--bcs-hybrid-header));
  padding:12px 8px 14px;
  background:
    linear-gradient(90deg,#081316f4,#0b1b20eb),
    url('../assets/ui/bcs-logo-master.webp') center top/cover no-repeat;
  border-right:1px solid #39736369;
  box-shadow:inset -12px 0 26px #0000003d;
  overflow:auto;
  z-index:39;
  flex:none;
}
body.bcs-hybrid-enabled .bcs-hybrid-shell>.workspace{
  grid-column:2;grid-row:2;min-width:0;width:100%;max-width:none;
  overflow:visible;
  min-height:0;
}
body.bcs-hybrid-enabled .bcs-hybrid-shell .main{max-width:none;padding:25px clamp(15px,2.1vw,38px) 154px}
body.bcs-hybrid-enabled .bcs-hybrid-shell .topbar .crumb{display:none}

/* Cinematic compact brand — same original stone BCS mark as the reference. */
.bcs-hybrid-top-brand{
  display:flex;align-items:center;gap:9px;min-width:198px;max-width:228px;
  background:none;border:0;padding:0;cursor:pointer;color:#e0ece5;text-align:left;
}
.bcs-hybrid-top-brand img{width:91px;height:44px;object-fit:contain;filter:drop-shadow(0 0 8px #3adabb4e);flex:none}
.bcs-hybrid-top-brand strong{display:block;font-size:12px;letter-spacing:.075em;white-space:nowrap;line-height:1.2;font-weight:700}
.bcs-hybrid-top-brand small{display:block;font-size:9px;color:#80a89c;letter-spacing:.12em;white-space:nowrap;margin-top:3px}
.bcs-hybrid-top-brand:hover strong{color:#a2f9d8}
.bcs-hybrid-top-nav{display:flex;flex:1;min-width:0;justify-content:center;gap:clamp(1px,.35vw,8px);height:100%;align-items:center}
.bcs-hybrid-tab{
  position:relative;min-width:0;height:100%;display:flex;align-items:center;gap:8px;
  padding:0 clamp(7px,1vw,16px);border:0;background:transparent;cursor:pointer;
  color:#a7bfba;font-family:inherit;font-size:12px;white-space:nowrap;transition:color .17s,background .17s;
}
.bcs-hybrid-tab svg{flex:none;width:18px;height:18px;stroke-width:1.5}
.bcs-hybrid-tab:hover{color:#effdf8;background:#47a78d0e}
.bcs-hybrid-tab.active,.bcs-hybrid-tab[aria-current=page]{color:#8ff5d9;background:linear-gradient(180deg,#48bb9800,#4ae2bf0c)}
.bcs-hybrid-tab.active::after{
  content:"";position:absolute;left:9px;right:9px;bottom:0;height:2px;
  background:#72f9d9;box-shadow:0 0 11px 2px #17d4aa82;border-radius:3px;
}
.bcs-hybrid-search-btn{
  flex:none;display:grid;place-items:center;width:36px;height:36px;border:1px solid transparent;
  background:transparent;border-radius:11px;color:#a9ddd1;cursor:pointer;
}
.bcs-hybrid-search-btn:hover{border-color:#56ae9874;background:#1b3e3690;color:#e7fff5}
.bcs-hybrid-actions{flex:none;position:relative;color:#c3e6db}
.bcs-hybrid-actions>summary{
  list-style:none;display:flex;align-items:center;gap:7px;cursor:pointer;padding:9px 11px;
  border:1px solid #356e62b0;border-radius:9px;background:#122b2b;color:#d0ede5;font-size:11px;
  font-weight:650;
}
.bcs-hybrid-actions>summary::-webkit-details-marker{display:none}
.bcs-hybrid-actions>summary svg{width:17px;height:17px}
.bcs-hybrid-actions[open]>summary{background:#214e43;color:white}
.bcs-hybrid-actions>.top-actions{
  position:absolute;top:calc(100% + 9px);right:0;display:flex!important;flex-direction:column;align-items:stretch;
  width:210px;padding:10px;gap:7px;border-radius:12px;border:1px solid #559f877e;
  background:#0b1d20f7;box-shadow:0 16px 40px #000c;z-index:90;
}
.bcs-hybrid-actions>.top-actions .btn{width:100%;justify-content:flex-start;white-space:normal;font-size:11px}
.bcs-hybrid-actions>.top-actions .btn.hide-mobile{display:inline-flex}
.bcs-hybrid-actions>.top-actions .label-desktop{display:inline!important}

/* Context sidebar: five artist shortcuts, collapsible to cover icons. */
.bcs-hybrid-shell .bcs-hybrid-legacy-links{display:none}
.bcs-hybrid-shell .bcs-hybrid-side-brand{
  display:flex;gap:7px;align-items:center;min-height:54px;margin:0 2px;
  padding:7px 5px 9px;border-bottom:1px solid #478c7762;
}
.bcs-hybrid-shell .bcs-hybrid-side-brand .brand-icon{
  display:block;width:49px;height:36px;min-width:49px;background:url('../assets/ui/bcs-logo-mark.png') center center/contain no-repeat;
  border:none;border-radius:0;box-shadow:none;filter:drop-shadow(0 0 5px #76d8b952);
}
.bcs-hybrid-shell .bcs-hybrid-side-brand .brand-icon svg{display:none}
.bcs-hybrid-shell .bcs-hybrid-side-brand strong{font-size:10px;letter-spacing:.05em;color:#e4f2ec}
.bcs-hybrid-shell .bcs-hybrid-side-brand small{font-size:8px;letter-spacing:.06em}
.bcs-hybrid-sidebar-toggle{
  display:flex;align-items:center;justify-content:center;margin:10px 9px 11px auto;
  width:28px;height:27px;color:#8edec5;background:#122f2a;border:1px solid #49897778;
  border-radius:7px;cursor:pointer;
}
.bcs-hybrid-sidebar-toggle svg{width:16px;height:16px}
.bcs-hybrid-sidebar-toggle:hover{background:#2b6652}
.bcs-hybrid-shell .bcs-hybrid-artists{padding:0 3px 12px}
.bcs-hybrid-shell .bcs-hybrid-artists .side-label{margin:8px 11px 8px;font-size:9px;letter-spacing:.16em;color:#77a99a}
.bcs-hybrid-shell .bcs-hybrid-artists .nav-row{min-height:45px;padding:8px;gap:8px;margin:3px 0;border-radius:10px;color:#adc6be;font-size:12px}
.bcs-hybrid-shell .bcs-hybrid-artists .nav-row .side-cover{width:29px;height:29px;flex:none;border-radius:6px;border-color:#59b8a148}
.bcs-hybrid-shell .bcs-hybrid-artists .nav-name{font-size:11px}
.bcs-hybrid-shell .bcs-hybrid-artists .nav-row.active{background:#2b655249;border-color:#68e1ba77;box-shadow:inset 2px 0 #76efd2,0 0 19px #0b82651e}
.bcs-hybrid-shell .sidebar-foot{font-size:9px;line-height:1.6;padding:12px 7px;margin-top:auto;border-top-color:#396b5a64}
.bcs-hybrid-shell .sidebar-foot b{font-size:10px;letter-spacing:.04em}
body.bcs-hybrid-sidebar-closed .bcs-hybrid-shell .bcs-hybrid-side-brand{justify-content:center;padding-left:0;padding-right:0}
body.bcs-hybrid-sidebar-closed .bcs-hybrid-shell .bcs-hybrid-side-brand>div,
body.bcs-hybrid-sidebar-closed .bcs-hybrid-shell .bcs-hybrid-artists .side-label,
body.bcs-hybrid-sidebar-closed .bcs-hybrid-shell .bcs-hybrid-artists .nav-name,
body.bcs-hybrid-sidebar-closed .bcs-hybrid-shell .sidebar-foot{display:none}
body.bcs-hybrid-sidebar-closed .bcs-hybrid-shell .bcs-hybrid-artists .nav-row{justify-content:center;padding:7px 3px;gap:0}
body.bcs-hybrid-sidebar-closed .bcs-hybrid-shell .bcs-hybrid-artists .nav-row .side-cover{width:35px;height:35px}
body.bcs-hybrid-sidebar-closed .bcs-hybrid-sidebar-toggle{margin-left:auto;margin-right:auto}

/* The reference's finished forest banner: text and BCS are embedded in the artwork. */
.bcs-hybrid-shell .bcs-hybrid-hero{
  position:relative;display:block;min-height:0;height:auto;aspect-ratio:1495/229;
  width:100%;max-height:none;padding:0;margin:13px 0 24px;
  border:1px solid #4e9e888c;border-radius:10px;
  background: url('../assets/ui/bcs-hybrid-hero.webp') center / 100% 100% no-repeat,#071a1a;
  box-shadow:0 11px 28px #0007,inset 0 0 21px #24ddad14;
  overflow:hidden;
}
.bcs-hybrid-shell .bcs-hybrid-hero::before,.bcs-hybrid-shell .bcs-hybrid-hero::after{display:none!important}
.bcs-hybrid-shell .bcs-hybrid-hero>div{position:absolute!important;width:1px!important;height:1px!important;clip-path:inset(50%)!important;overflow:hidden!important;white-space:nowrap!important;margin:0!important;padding:0!important}
.bcs-hybrid-shell .bcs-main-overview>.page-heading{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;
  margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;
  white-space:nowrap!important;border:0!important;
}
.bcs-hybrid-shell .bcs-main-overview>.page-heading h1{font-size:clamp(23px,2.05vw,34px);margin:6px 0 4px;color:#eae8df}
.bcs-hybrid-shell .bcs-main-overview>.page-heading p{font-size:11px;max-width:900px}
.bcs-hybrid-shell .bcs-main-overview>.page-heading .eyebrow{font-size:9px;color:#8edfc5;letter-spacing:.2em}
.bcs-hybrid-shell .bcs-overview-grid{grid-template-columns:minmax(0,1fr) minmax(225px,285px)}
.bcs-hybrid-shell .project-card .card-media:before{
  content:"";position:absolute;top:10px;left:10px;width:60px;height:27px;z-index:2;
  background:url('../assets/ui/bcs-logo-mark.png') center/contain no-repeat;
  filter:drop-shadow(0 2px 5px #000d) drop-shadow(0 0 5px #2ad4ae8a);
  opacity:.8;pointer-events:none;
}
.bcs-hybrid-shell .project-card .card-media img{transition:transform .25s ease}
.bcs-hybrid-shell .project-card:hover .card-media img{transform:scale(1.03)}
.bcs-hybrid-shell .project-card{border-color:#44857175}
.bcs-hybrid-shell .project-card:hover{border-color:#6de3c0ad}

@media(max-width:1470px){
  .bcs-hybrid-top-brand{min-width:154px}
  .bcs-hybrid-top-brand img{width:65px;height:36px}
  .bcs-hybrid-top-brand strong{font-size:10px}
  .bcs-hybrid-top-brand small{font-size:8px}
  .bcs-hybrid-tab{gap:6px;padding:0 8px;font-size:11px}
}
@media(max-width:1160px){
  body.bcs-hybrid-enabled{--bcs-hybrid-sidebar:76px}
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-side-brand{justify-content:center}
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-side-brand>div,
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-artists .side-label,
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-artists .nav-name,
  body.bcs-hybrid-enabled .bcs-hybrid-shell .sidebar-foot{display:none}
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-artists .nav-row{justify-content:center;gap:0;padding:7px 3px}
  .bcs-hybrid-sidebar-toggle{margin-left:auto;margin-right:auto}
  .bcs-hybrid-top-nav{gap:0}
  .bcs-hybrid-top-brand span{display:none}
  .bcs-hybrid-top-brand{min-width:70px;max-width:78px}
  .bcs-hybrid-tab span{font-size:10px}
  .bcs-hybrid-shell .bcs-overview-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:880px){
  .bcs-hybrid-tab span{display:none}
  .bcs-hybrid-tab{padding:0 13px}
  .bcs-hybrid-shell .bcs-main-overview>.page-heading p{display:none}
  .bcs-hybrid-shell .bcs-hybrid-hero{min-height:140px}
}
@media(max-width:760px){
  body.bcs-hybrid-enabled{--bcs-hybrid-sidebar:0px;--bcs-hybrid-header:64px}
  body.bcs-hybrid-enabled #bcs-player-root{left:0}
  body.bcs-hybrid-enabled .bcs-v12.bcs-hybrid-shell{display:block;min-height:100vh}
  body.bcs-hybrid-enabled .bcs-hybrid-shell>.topbar{height:64px;min-height:64px;padding:0 10px;gap:7px}
  body.bcs-hybrid-enabled .bcs-hybrid-shell>.topbar .crumb{display:flex;order:0}
  body.bcs-hybrid-enabled .bcs-hybrid-shell>.topbar .crumb>.divider-crumb,
  body.bcs-hybrid-enabled .bcs-hybrid-shell>.topbar .crumb>b,
  body.bcs-hybrid-enabled .bcs-hybrid-shell>.topbar .crumb>svg{display:none}
  .bcs-hybrid-top-brand{order:1;min-width:65px;max-width:78px}
  .bcs-hybrid-top-brand img{height:35px;width:66px}
  .bcs-hybrid-top-nav{order:3;gap:0;justify-content:center}
  .bcs-hybrid-tab{padding:0 5px}
  .bcs-hybrid-tab svg{width:18px;height:18px}
  .bcs-hybrid-search-btn{order:4;width:26px}
  .bcs-hybrid-actions{order:5}
  .bcs-hybrid-actions>summary{padding:6px 7px}
  .bcs-hybrid-actions>summary span{display:none}
  body.bcs-hybrid-enabled .bcs-hybrid-shell>.sidebar{
    position:fixed;left:0;top:0;bottom:0;z-index:65;
    width:min(280px,85vw);height:100vh;min-height:100vh;
    transform:translateX(-101%);transition:transform .2s;box-shadow:5px 0 40px #000a;
  }
  body.bcs-hybrid-enabled .bcs-hybrid-shell>.sidebar.open{transform:translateX(0)}
  body.bcs-hybrid-enabled .bcs-hybrid-shell>.workspace{display:block;min-width:0}
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-side-brand{justify-content:flex-start}
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-side-brand>div,
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-artists .side-label,
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-artists .nav-name,
  body.bcs-hybrid-enabled .bcs-hybrid-shell .sidebar-foot{display:block}
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-artists .nav-row{justify-content:flex-start;gap:8px;padding:8px}
  body.bcs-hybrid-enabled .bcs-hybrid-shell .bcs-hybrid-legacy-links{display:block}
  body.bcs-hybrid-enabled .bcs-hybrid-shell .main{padding:18px 14px 130px}
  .bcs-hybrid-shell .bcs-main-overview>.page-heading{margin-top:6px}
  .bcs-hybrid-shell .bcs-hybrid-hero{
    min-height:220px;aspect-ratio:auto;margin:10px 0 18px;
    background:linear-gradient(0deg,#06151be8,#06151b17 65%),url('../assets/ui/bcs-logo-master.webp') 50% 15% / cover no-repeat,#071015;
  }
  .bcs-hybrid-shell .bcs-hybrid-hero>div:first-child{
    display:block;position:absolute!important;clip-path:none!important;overflow:visible!important;
    left:16px;right:16px;bottom:14px;width:auto!important;height:auto!important;
    white-space:normal!important;z-index:3;
  }
  .bcs-hybrid-shell .bcs-hybrid-hero .banner-art{display:none}
  .bcs-hybrid-shell .bcs-hybrid-hero h2{font-size:17px;line-height:1.18;max-width:260px;margin:3px 0}
  .bcs-hybrid-shell .bcs-hybrid-hero p{display:none}
  .bcs-hybrid-shell .bcs-hybrid-hero .bcs-banner-kicker{font-size:8px}
}
@media(max-width:420px){
  .bcs-hybrid-tab{padding:0 3px}
  .bcs-hybrid-tab svg{width:17px;height:17px}
  .bcs-hybrid-top-brand{min-width:55px}
  .bcs-hybrid-top-brand img{width:57px}
  .bcs-hybrid-actions>summary{padding:5px}
}
@media(prefers-reduced-motion:reduce){
  .bcs-hybrid-tab,.bcs-hybrid-shell .project-card .card-media img{transition:none}
}