/* SKENE v0.9.20.0 – presentation layer only.
   Keep existing bh-* IDs, JS events, API names and access rules for backward compatibility. */
:root {
  color-scheme: dark;
  --bg: #0b111d;
  --panel: #172234;
  --panel2: #1d2c41;
  --stroke: #2c3d55;
  --text: #f0f5ff;
  --muted: #a9bad0;
  --blue: #afbcff;
  --success: #77ddbd;
  --danger: #ffa6ac;
  --skene-accent: #aabaff;
  --skene-mint: #79dec6;
  --skene-deep: #0b111d;
  --skene-border: #2b3b52;
  --skene-overlay: #202f44;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
}
html {scroll-behavior:smooth;scrollbar-color:#35465e #0b111d}
body {
  background-color: var(--bg);
  background-image: radial-gradient(ellipse at 80% -15%, #23345745 0%, transparent 40%);
  color: var(--text);
  letter-spacing: .005em;
}
::selection{background:#778fe978;color:#fff}
.sidebar {
  width:246px;min-width:246px;
  background:linear-gradient(160deg,#141e2f 0%,#101827 52%,#0f1725 100%);
  border-right:1px solid #2b3b50;
  padding:23px 13px 16px;
  scrollbar-color:#35455f transparent;
}
.main {margin-left:246px;width:calc(100% - 246px)}
.bh-brand-row {padding:1px 11px 24px;gap:12px;border-color:#2c3b52}
.logo.skene-logo {width:46px;height:46px;background:none;border:0;box-shadow:none;padding:0;border-radius:0;display:grid;place-items:center;overflow:visible}
.skene-mark {width:100%;height:100%;display:block;filter:drop-shadow(0 5px 12px #050a15a8)}
.bh-brand-copy strong {font-size:23px;letter-spacing:2.3px;line-height:1.05;font-weight:810;color:#f6f8ff}
.bh-brand-copy small {color:#91a8c5;font-size:10.5px;margin-top:7px;letter-spacing:.03em}
.bh-side-account {padding:19px 6px 11px}
.bh-side-account .bh-nav-category {margin:0 0 10px}
.bh-side-account select {min-height:45px;border-color:#354760;border-radius:11px;background:#1b2a40;color:#f0f5ff;padding:10px 11px}
.bh-side-nav {gap:3px;padding:6px 0 20px}
.bh-nav-category {margin:22px 12px 7px;color:#8298b7;font-size:10px;letter-spacing:1.48px;font-weight:760}
.bh-nav-item {
  min-height:42px;border-radius:10px;border:1px solid transparent;
  color:#b2c3db;font-size:12.8px;font-weight:570;padding:10px 12px;gap:12px;
  transition:background-color .16s,border-color .16s,color .16s,transform .16s;
}
.bh-nav-icon {width:18px;height:18px;min-width:18px;stroke-width:1.75;color:#8198ba;flex:none}
.bh-nav-item:hover:not(:disabled) {background:#21304a;color:#f2f6ff;transform:translateX(2px)}
.bh-nav-item:hover:not(:disabled) .bh-nav-icon {color:#c4d1ff}
.bh-nav-item.active {
  color:#f3f5ff;background:linear-gradient(90deg,#324568 0%,#273b57 100%);
  border-color:#4a6188;box-shadow:inset 3px 0 0 #a9b6ff,0 5px 20px #060c1930;font-weight:735;
}
.bh-nav-item.active .bh-nav-icon {color:#b9c5ff}
.bh-nav-item:focus-visible,.bh-signout:focus-visible {outline:2px solid var(--skene-mint);outline-offset:2px}
.bh-nav-item.bh-unavailable,.bh-nav-item.bh-unavailable:disabled {opacity:.47}
.bh-sidebar-foot {border-color:#2b3b52;margin-top:auto;padding:16px 9px 3px;gap:12px}
.bh-sidebar-foot small {color:#7c94ae;font-size:10.5px;letter-spacing:.025em}
.bh-role-caption {color:#a8bbd2;font-size:11px}
.bh-signout {border-color:#3a4b63;background:#1b2a3e;border-radius:10px;min-height:39px;color:#cad9ed}
.bh-signout:hover {background:#293a51}
.topbar {height:65px;min-height:65px;background:#0c1422e9;border-bottom:1px solid #2a3a50;backdrop-filter:blur(20px);padding:0 35px}
.bh-topbar-left {font-size:12px;color:#d3deef;gap:12px;min-width:0}
.skene-topbar-brand {font-size:11px;letter-spacing:1.6px;color:#a8b7ff;font-weight:820}
.skene-topbar-divider {color:#516681}
#topbarTitle {white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45vw}
.account {color:#93a9c2;font-size:11px;max-width:36vw}
.container {max-width:1280px;padding:33px clamp(24px,3vw,44px) 90px}
.bh-page-intro {margin:4px 0 27px;align-items:center;gap:16px}
.bh-page-intro h1 {font-size:clamp(25px,2.4vw,34px);letter-spacing:-1.12px;line-height:1.16;margin:9px 0}
.bh-page-intro .muted {color:#a5b7cf;font-size:13px}
.eyebrow {color:#a7b9ff;font-size:10px;font-weight:760;letter-spacing:1.75px}
.bh-current-band {border:1px solid #384c66;color:#d7e6fb;background:#1b2b41;border-radius:99px;padding:9px 14px;font-weight:620;white-space:normal;text-align:center;max-width:220px;overflow-wrap:anywhere}
.bh-page-view {gap:18px}
.panel {
  background:linear-gradient(145deg,#182438,#151f30);
  border:1px solid #2e3f58;border-radius:17px;padding:clamp(19px,2vw,27px);
  box-shadow:0 9px 30px #040a161f;
}
.panel h2 {font-weight:745;letter-spacing:-.48px;font-size:19px}
.panel h3 {color:#eef3fc}
.panel-head {gap:14px}
.muted {color:#a9bad0}
/* Consistent controls throughout existing modules; sizing leaves existing grids intact. */
button,input,select,textarea {font-family:inherit}
.primary,.outline,.danger-btn,.secondary-btn {border-radius:10px;transition:background-color .15s,box-shadow .15s,border-color .15s,transform .15s}
.primary {background:#aabaff;color:#12223a;border-color:#bdcbff;font-weight:750;box-shadow:0 3px 12px #8098fb12}
.primary:hover:not(:disabled) {background:#c5ceff;transform:translateY(-1px)}
.outline {border-color:#4a5e7c;color:#dce7fa;background:#1c2b40ab}
.outline:hover:not(:disabled) {background:#2c3e56;border-color:#7188a9}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {outline:2px solid #8fe7d0;outline-offset:2px}
input:not([type=checkbox]):not([type=radio]):not([type=color]),select,textarea {border-color:#435872;color:#eaf2ff;background-color:#152338;border-radius:10px}
input:not([type=checkbox]):not([type=radio]):not([type=color]):focus,select:focus,textarea:focus {border-color:#a5baff;box-shadow:0 0 0 3px #8ea8ff25}
input::placeholder,textarea::placeholder {color:#8396ad;opacity:1}
input[type=checkbox],input[type=radio] {accent-color:#a9baff}
.chip,.bh-task-pill {border-color:#425b76;background:#24364d;color:#d4e4fb}
.bh-stat,.fi-stat {background:linear-gradient(135deg,#21334c,#1b2a40);border-color:#344d6a;border-radius:13px}
.bh-stat strong,.fi-stat strong {letter-spacing:-.6px}
.bh-dashboard-columns>div,.bh-detail-card,.bs-card,.fi-block {background:#1b293c;border-color:#31445e;border-radius:13px}
.bh-featured,.bh-figures {border-radius:13px}
.bh-featured {background:linear-gradient(138deg,#243957,#1a2b41);border-color:#405d80}
.bh-figures {background:#1c2b40;border-color:#31465f}
.bh-task-item,.fi-entry,.bs-musician,.sb-track,.band-btn,.gig-list-row {background:#203047;border-color:#364d68}
.bh-task-item:hover,.fi-entry:hover,.bs-musician:hover {border-color:#506a8b}
.bh-task-pill.overdue {background:#4a2935;color:#ffbfc6;border-color:#955d6e}
.bs-logo-preview {background:#111c2c;border-color:#506886}
.bs-subform {background:#152337;border-color:#536b89}
.bs-account-info {background:#22334a;color:#bad0ed}
.bh-person-chip {background:#253950;border-color:#3e5a75}
.fi-positive {color:#79dfbf}.fi-negative {color:#ffb4ae}
.fi-income {background:#a7b7ff}.fi-expense {background:#e8ad87}
.fi-stat,.fi-block,.fi-entry {box-shadow:0 6px 20px #060d1c1c}
.bh-fold,details.bh-fold {border-color:#344963;background:#17263a;border-radius:12px}
.bh-fold[open] {border-color:#547099}
.status:not(:empty) {background:#1a3935;border-color:#397c70;color:#cef9ec;box-shadow:0 16px 45px #030813a8}
.status.error:not(:empty) {background:#422735;border-color:#94596b;color:#ffd2d5}
.bh-quick-actions button {font-weight:680}
/* Sign-in experience */
.bh-login-screen {
  background:
    radial-gradient(circle at 14% 9%,#32476a80,transparent 37%),
    radial-gradient(circle at 84% 90%,#26365099,transparent 36%),
    #0a111e;
  min-height:100svh;position:relative;overflow:hidden;isolation:isolate;
}
.bh-login-screen:before {
  content:"";position:absolute;inset:auto auto -275px -160px;width:590px;height:590px;
  border:1px solid #6f8bc121;border-radius:48% 48% 0 0;pointer-events:none;
  box-shadow:0 0 0 80px #273f5823,0 0 0 155px #273f5812;transform:rotate(-19deg);z-index:-1;
}
.bh-login-layout {width:min(1110px,100%);grid-template-columns:minmax(0,1.1fr) minmax(345px,.85fr);gap:clamp(35px,7vw,100px)}
.bh-login-wordmark {gap:12px;font-size:25px;letter-spacing:2.7px;font-weight:810}
.bh-login-note {width:50px;height:50px;background:transparent;border-radius:13px}
.bh-login-note .skene-mark {width:50px;height:50px}
.bh-login-overline {margin-top:72px;color:#81dec6;font-size:11px;font-weight:785;letter-spacing:2.25px}
.bh-login-story h1 {font-size:clamp(38px,4.5vw,61px);letter-spacing:-2.3px;line-height:1.12;margin:21px 0 23px;max-width:600px}
.bh-login-story h1 span {color:#b0bbff}
.bh-login-story>p {font-size:16px;color:#b9c9df;max-width:510px;line-height:1.78}
.bh-login-footnote {border-color:#43546d;color:#8da7c4;margin-top:100px}
.bh-login-card {background:linear-gradient(150deg,#1b2a41,#152236);border:1px solid #405776;border-radius:20px;padding:clamp(28px,3.5vw,42px);box-shadow:0 23px 80px #0007,0 0 0 1px #ffffff04}
.skene-login-card-overline {display:block;letter-spacing:1.45px;font-weight:750;font-size:10px;color:#85dec8}
.bh-login-card h2 {color:#f4f6ff;font-size:29px;margin:14px 0 8px;letter-spacing:-.7px}
.bh-login-card p {color:#b1c5dc;margin-bottom:28px;line-height:1.7}
.bh-google-button {min-height:50px;transition:background .15s,transform .15s,box-shadow .15s}
.bh-google-button:hover {background:#f0f4ff;transform:translateY(-1px);box-shadow:0 7px 24px #b1c4ff29}
.bh-login-privacy {font-size:11px;line-height:1.65;color:#9bb4cf;margin-top:19px}
/* Narrow workspaces – avoid unnecessary page-wide scrolling. */
@media(max-width:1100px){
  .sidebar{width:220px;min-width:220px}.main{margin-left:220px;width:calc(100% - 220px)}
  .topbar{padding:0 22px}.container{padding:29px 22px 70px}
}
@media(max-width:800px){
  .bh-login-layout{grid-template-columns:1fr;max-width:520px;gap:26px}
  .bh-login-overline{margin-top:30px}
  .bh-login-story h1{font-size:clamp(35px,8vw,45px);letter-spacing:-1.55px;margin:15px 0}
  .bh-login-story>p{font-size:14px}.bh-login-card{padding:26px}
}
@media(max-width:760px){
  .sidebar{width:min(310px,88vw);min-width:0}
  .main{margin-left:0;width:100%}
  .topbar{height:59px;min-height:59px;padding:0 15px}
  .container{padding:23px 14px 66px}
  .bh-page-intro{gap:12px;margin:0 0 20px}
  .bh-page-intro h1{font-size:27px}
  .bh-current-band{text-align:left}
  .panel{padding:18px;border-radius:14px}
  .bh-dashboard-stats,.fi-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bh-topbar-left{gap:8px}.skene-topbar-brand{font-size:10px;letter-spacing:1px}
  .account{max-width:31vw;font-size:10px}
}
@media(max-width:440px){
  .bh-login-screen{padding:24px 18px}
  .bh-login-wordmark{font-size:22px}
  .bh-login-note,.bh-login-note .skene-mark{width:43px;height:43px}
  .bh-login-overline{margin-top:27px}
  .bh-login-story h1{font-size:36px;letter-spacing:-1.4px}
  .bh-login-story>p{font-size:13.5px}
  .bh-login-card{border-radius:16px;padding:24px}
  .skene-topbar-divider{display:none}.bh-current-band{font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .bh-nav-item,.primary,.outline,.bh-google-button{transition:none!important;transform:none!important}
}
