/* September 2026 overhaul: hierarchy, surfaces and spacing over app.css. Existing reporting and effects stay intact. */
:root {
  --bg:#0b0c10; --panel:#13151d; --panel-2:#181a23; --raised:#1b1e29;
  --ink:#eef0f6; --ink-soft:#d0d3df; --muted:#a3a8bb; --faint:#969caf;
  --line:rgba(193,201,229,.13); --line-soft:rgba(193,201,229,.07);
  --chrome:linear-gradient(158deg,#f7f9ff 6%,#dbe3ee 27%,#aeb6cb 39%,#f2e8f7 47%,#f9fbff 54%,#c3d8d5 79%,#e9dbd0 96%);
  --pastel:linear-gradient(115deg,#a9d9c7,#b6c2e8 34%,#d0b9dc 64%,#debea6);
  --quiet-pastel:linear-gradient(120deg,rgba(159,211,190,.07),rgba(169,182,226,.09),rgba(207,171,213,.08));
  --radius:14px; --radius-sm:8px;
}
body {font-size:14px;line-height:1.6;}
body::before {background:radial-gradient(ellipse 75% 55% at 58% -20%,rgba(137,158,203,.11),transparent 80%),var(--bg);}
body::after {box-shadow:none;}
::selection {background:#68607f;color:#fff;}
input,textarea {caret-color:#d9c1ee;}
:focus-visible {outline:2px solid #d0c6ed;outline-offset:4px;}
.ui-icon {display:inline-block;flex-shrink:0;vertical-align:middle;}
.btn {display:inline-flex;align-items:center;justify-content:center;min-height:40px;gap:9px;border-radius:8px;box-shadow:none;transform:none;font-weight:600;font-size:13px;}
.btn:hover {transform:none;box-shadow:none;}
.btn.primary {background:linear-gradient(110deg,#e1e7e5,#e6e2ee 63%,#e8dfdb);color:#1b1b24;border:1px solid #e2dcec;box-shadow:none;}
.btn.primary:hover {background:#f3eff8;color:#16151c;}
input:not([type=checkbox]):not([type=radio]),select,textarea {min-height:40px;border-radius:8px;color:var(--ink);background:#101219;border-color:#363b4b;font:inherit;}
input::placeholder,textarea::placeholder {color:#9ba2b8;opacity:1;}
label {color:var(--ink-soft);}
.panel {border:1px solid var(--line);box-shadow:none;padding:26px;border-radius:14px;}
.panel::before,.panel::after,.card::before {animation:none;}
.panel::after {display:none;}
.panel h2 {font-size:18px;text-transform:none;letter-spacing:-.02em;line-height:1.4;margin-bottom:18px;}
.panel h3 {letter-spacing:0;}
.panel p {max-width:78ch;}
.wrap {max-width:1320px;padding:36px 40px 60px;}
.page-title {font-size:32px;line-height:1.15;letter-spacing:-.035em;margin:0 0 12px;}
.page-sub {max-width:78ch;font-size:14px;color:var(--muted);margin-bottom:26px;}
.edge-light {background:var(--pastel);animation:none;opacity:.5;}
.chrome-text,.page-title {color:#e8edf6;}
@supports (background-clip:text) {
  .chrome-text,.page-title {background:var(--chrome);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
}
.preview-notice {max-width:none;margin:0;border:0;border-radius:0;box-shadow:none;padding:9px 26px;font-size:12px;background:#161921;border-bottom:1px solid var(--line);color:#b7bfd0;}
.preview-notice strong {font-size:12px;color:#d5c9e9;font-weight:600;}
.preview-notice .btn {display:none;}
.preview-notice span {font-size:12px;}
.skip-link {position:fixed;top:8px;left:16px;z-index:200;padding:12px 20px;background:#f1eafa;color:#181920;transform:translateY(-160%);}
.skip-link:focus {transform:none;}
.client-dashboard .topbar {padding:16px 40px;background:rgba(12,14,20,.86);border-bottom:1px solid var(--line);backdrop-filter:blur(12px);}
.client-signature {display:flex;align-items:center;gap:12px;}
.client-signature img {width:38px;height:36px;object-fit:contain;}
.client-signature span {font-size:13px;font-weight:550;color:#c1c7d7;letter-spacing:.01em;}
.client-dashboard .topbar nav a {font-size:12px;}
.client-dashboard > .wrap {max-width:1320px;}
.client-dashboard .home-top-tabs {padding:0 0 20px;margin:0 0 20px;border-bottom:1px solid var(--line);}
.client-dashboard .platform-tabs {display:flex;gap:8px;flex-wrap:nowrap;max-width:100%;overflow:auto;padding:4px;}
.client-dashboard .tab-btn {padding:11px 25px;border-color:transparent;border-radius:9px;background:transparent;color:var(--muted);min-width:100px;box-shadow:none;}
.client-dashboard .tab-btn:hover {background:var(--quiet-pastel);color:var(--ink);border-color:var(--line);}
.client-dashboard .tab-btn.primary {background:var(--quiet-pastel);color:var(--ink);border-color:rgba(196,190,223,.25);box-shadow:inset 0 -1px #beb3d8;}
.client-dashboard .welcome-layout {grid-template-columns:1fr 1.05fr;gap:48px;margin:8px 0 38px;align-items:center;min-height:225px;}
.client-dashboard .welcome {padding:20px 0;}
.client-dashboard .welcome h1 {font-size:44px;line-height:1.16;letter-spacing:-.035em;margin:0 0 20px;background:var(--chrome);background-clip:text;-webkit-background-clip:text;}
.client-dashboard .welcome h1 span {display:block;}
.client-dashboard .welcome p {font-size:14px;max-width:35ch;}
.client-dashboard .overview-volume {padding:28px;gap:26px;border-color:rgba(197,192,220,.16);min-height:220px;}
.client-dashboard .volume-ring {width:126px;height:126px;}
.client-dashboard .volume-ring-logo {width:42%;}
.client-dashboard .overview-volume .welcome-eyebrow {font-size:13px;letter-spacing:0;text-transform:none;color:#b9bfd1;}
.client-dashboard .overview-volume-total {font-size:36px;line-height:1.15;margin:12px 0 22px;letter-spacing:-.035em;}
.client-dashboard .overview-volume-platform {font-size:12px;margin-top:10px;gap:9px;}
.client-dashboard .overview-volume-platform strong {font-weight:550;color:#d2d9e8;}
.client-dashboard .panel,.client-dashboard .card {box-shadow:none;background:linear-gradient(140deg,rgba(28,31,42,.72),rgba(18,20,28,.78));}
.client-dashboard .panel h2 {font-size:20px;text-transform:none;letter-spacing:-.025em;}
.client-dashboard .home-live {padding:28px 30px;}
.client-dashboard .home-live > h2 {margin-bottom:28px;}
.client-dashboard .live-platforms {gap:40px;}
.client-dashboard .live-platforms h3 {font-size:15px;margin-bottom:6px;display:flex;align-items:center;gap:10px;}
.client-dashboard .live-platforms h3:before {content:'';height:6px;width:6px;border-radius:50%;background:#4ec282;flex-shrink:0;}
.client-dashboard .live-platforms > div+div h3:before {background:#d99b60;}
.client-dashboard .live-status {letter-spacing:.04em;}
.client-dashboard .live-campaign-list {list-style:none;padding:0;margin:0;display:block;}
.client-dashboard .live-campaign-list li {padding:16px 0;border-bottom:1px solid var(--line-soft);font-size:13px;font-weight:550;}
.client-dashboard .live-campaign-list li:last-child,.client-dashboard .live-campaign-list li:has(+ li[hidden]) {border-bottom:0;}
.client-dashboard .live-more {margin-top:12px;}
.client-dashboard .live-target {font-size:12px;font-weight:400;color:var(--muted);margin-top:5px;}
.client-dashboard .home-balance {margin-top:22px;padding:24px 30px;background:rgba(17,19,27,.52);}
.client-dashboard .home-balance .bh-row {align-items:center;}
.client-dashboard .home-balance .label {font-size:13px;letter-spacing:0;text-transform:none;}
.client-dashboard .home-balance .value {font-size:32px;line-height:1.25;margin:6px 0;}
.client-dashboard .home-balance p {font-size:12px;}
.client-dashboard .home-balance .btn {background:transparent;color:var(--ink-soft);border:1px solid #424658;}
.client-dashboard .home-destinations {gap:24px;margin-top:30px;}
.client-dashboard .home-destination {border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;backdrop-filter:none;padding:18px 0;gap:12px;}
.client-dashboard .home-destination:hover {background:none;}
.client-dashboard .home-destination-title {font-size:18px;}
.client-dashboard .home-destination > span:last-child {font-size:12px;max-width:32ch;}
.client-dashboard .view-detail.page-title {margin-top:34px;}
.client-dashboard .cards {gap:12px;}
.client-dashboard .cards .card {padding:22px 20px;border:1px solid var(--line);border-radius:12px;animation:none;}
.client-dashboard .cards .card .label {font-size:12px;letter-spacing:0;text-transform:none;color:var(--muted);}
.client-dashboard .cards .card .value {font-size:30px;line-height:1.3;}
.client-dashboard table.data td {padding:14px 12px;}
.client-dashboard table.data th {font-size:11px;letter-spacing:.025em;text-transform:none;padding:13px 12px;color:#a7b0c6;}
.client-dashboard .toolbar {margin:24px 0;}
/* Order tab: request form with a live estimate, then the client's orders. */
.client-dashboard .view-order {margin-top:8px;}
body.client-dashboard[data-platform="order"] .page-title,body.client-dashboard[data-platform="order"] #rangeLabel,
body.client-dashboard[data-platform="reports"] .page-title,body.client-dashboard[data-platform="reports"] #rangeLabel {display:none;}
/* Reports tab: pick a service, dates and campaigns, then download an unbranded CSV or PDF. */
body:not([data-platform="reports"]) .view-reports,
body[data-platform="reports"] .view-home,
body[data-platform="reports"] .view-spotify,
body[data-platform="reports"] .view-soundcloud,
body[data-platform="reports"] .view-balance,
body[data-platform="reports"] .view-detail {display:none !important;}
.client-dashboard .view-reports {margin-top:8px;}
.client-dashboard .report-service {display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px;}
.client-dashboard .report-service .btn[aria-pressed="true"] {background:var(--quiet-pastel);border-color:rgba(196,190,223,.4);color:var(--ink);}
.client-dashboard .report-dates {display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:440px;margin:0 0 18px;}
.client-dashboard .report-dates .field {margin:0;}
.client-dashboard .report-dates label {display:block;margin:0 0 8px;font-size:12px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--ink-soft);}
.client-dashboard .report-dates input {width:100%;}
.client-dashboard .report-picker {border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.client-dashboard .report-picker-head {display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px;border-bottom:1px solid var(--line);}
.client-dashboard .report-picker-head input[type=search] {flex:1 1 200px;min-width:0;padding:9px 12px;border:1px solid #363b4b;}
.client-dashboard .report-list {max-height:440px;overflow:auto;padding:4px 14px 12px;}
.client-dashboard .report-list > .muted {margin:14px 0;}
.client-dashboard .report-group {padding:4px 0;border-bottom:1px solid var(--line-soft);}
.client-dashboard .report-group:last-child {border-bottom:0;}
.client-dashboard .report-group-head,.client-dashboard .report-item {display:flex;align-items:center;gap:10px;margin:0;font-size:13px;letter-spacing:0;text-transform:none;color:var(--ink);cursor:pointer;}
.client-dashboard .report-group-head {padding:10px 0 4px;font-weight:650;}
.client-dashboard .report-item {padding:6px 0 6px 26px;font-weight:450;}
.client-dashboard .report-item.solo {padding-left:0;font-weight:600;}
.client-dashboard .report-group-head .muted,.client-dashboard .report-item .muted {margin-left:auto;font-size:12px;font-weight:400;text-align:right;}
.client-dashboard .report-list input[type=checkbox] {accent-color:#beb3d8;flex-shrink:0;}
.client-dashboard .report-actions {display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;}
.client-dashboard .report-actions > .muted {margin-right:auto;font-size:13px;}
.client-dashboard .report-actions a[aria-disabled="true"] {opacity:.45;pointer-events:none;}
.client-dashboard .order-form {max-width:640px;margin:4px 0 0;}
.client-dashboard .order-fields {border:0;margin:0;padding:0;min-width:0;display:grid;gap:18px;}
.client-dashboard .order-fields[disabled] {opacity:.55;}
.client-dashboard .order-form .field {margin:0;}
.client-dashboard .order-form .field label,.client-dashboard .order-release legend {display:block;font-size:12px;margin:0 0 8px;padding:0;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.7px;}
.client-dashboard .order-form input:not([type=radio]),.client-dashboard .order-form textarea {width:100%;}
.client-dashboard .order-release {border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 24px;}
.client-dashboard .order-release legend {width:100%;}
.client-dashboard .order-release label {display:inline-flex;align-items:center;gap:8px;margin:0;font-size:14px;font-weight:500;color:var(--ink);text-transform:none;letter-spacing:0;}
.client-dashboard .order-dates {display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.client-dashboard .order-count-controls {display:grid;grid-template-columns:minmax(120px,1fr) minmax(0,2fr);gap:14px;}
.client-dashboard .order-count-controls select {width:100%;min-height:44px;}
.client-dashboard .order-count-hint {margin:-8px 0 0;color:var(--muted);font-size:12px;line-height:1.6;}
.client-dashboard #orderScheduleHint {margin:10px 0 0;}
.client-dashboard .order-total {margin:0;font-size:14px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;}
.order-schedule-scroll {max-height:340px;overflow:auto;border:1px solid var(--line);border-radius:10px;}
.order-schedule {width:100%;table-layout:fixed;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums;}
.order-schedule caption {text-align:left;padding:12px 14px;font-weight:600;color:var(--ink-soft);}
.order-schedule th,.order-schedule td {padding:9px 14px;text-align:left;border-bottom:1px solid var(--line-soft);}
.order-schedule tbody th,.order-schedule tr th[scope=row] {font-weight:450;text-transform:none;letter-spacing:0;}
.order-schedule th:last-child,.order-schedule td:last-child {text-align:right;}
.order-schedule input {width:100%;text-align:right;max-width:170px;min-height:44px;}
.order-schedule label {margin:0;}
.order-saved-schedule {margin-top:8px;font-size:13px;max-width:640px;}
.order-saved-schedule summary {cursor:pointer;color:var(--ink-soft);padding:6px 0;}
.order-saved-schedule .order-schedule-scroll {margin-top:8px;}
.client-dashboard .order-estimate {margin:0;padding:13px 16px;border:1px solid var(--line);border-radius:10px;background:var(--quiet-pastel);font-size:13px;color:var(--ink-soft);}
.client-dashboard .order-form .flash,.client-dashboard .order-estimate {margin:0;max-width:none;}
.client-dashboard .order-note {margin:14px 0 0;font-size:12px;}
.client-dashboard .order-history-title {font-size:15px;margin:36px 0 10px;}
.client-dashboard .order-list {list-style:none;margin:0;padding:0;}
.client-dashboard .order-item {display:grid;gap:6px;padding:16px 0;border-bottom:1px solid var(--line-soft);}
.client-dashboard .order-item:last-child {border-bottom:0;}
.client-dashboard .order-item-top {display:flex;align-items:center;justify-content:space-between;gap:12px;}
.client-dashboard .order-item a {font-size:13px;color:#c9c4da;overflow-wrap:anywhere;}
.client-dashboard .order-meta {font-size:12px;color:var(--muted);overflow-wrap:anywhere;}
.order-status {font-size:11px;font-weight:600;padding:3px 10px;border-radius:999px;border:1px solid var(--line);color:var(--ink-soft);white-space:nowrap;}
.order-status.status-received {border-color:rgba(190,179,216,.55);color:#d8cee7;}
.order-status.status-in_progress {border-color:rgba(169,182,226,.55);color:#c8d2f0;}
.order-status.status-live {border-color:rgba(78,194,130,.55);color:#8fdcb0;}
.order-status.status-done {color:var(--muted);}
.order-status.status-declined {border-color:rgba(217,120,120,.5);color:#e0a3a3;}
/* Balance view: the balance due leads; all-time totals close the itemized tables. Both client templates. */
#billingPanel .balance-focus {text-align:center;padding:30px 16px 34px;}
#billingPanel .balance-focus .label {font-size:13px;font-weight:550;letter-spacing:0;text-transform:none;margin:0 0 8px;background:none;color:var(--muted);-webkit-text-fill-color:var(--muted);text-shadow:none;}
#billingPanel .balance-focus .value {font-size:64px;line-height:1.1;letter-spacing:-.035em;font-weight:650;margin:0;font-variant-numeric:tabular-nums;color:#e7e8ee;background:linear-gradient(165deg,#fff 4%,#e5e8f3 21%,#a4acbd 35%,#f7f3ff 43%,#c7bcd2 48%,#fff 53%,#bbc5d1 65%,#dbece8 78%,#f3e5db 94%);background-size:100% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:none;}
#billingPanel .balance-focus p {margin:12px auto 0;max-width:48ch;font-size:13px;}
#billingPanel .balance-focus p + p {margin-top:4px;}
#billingPanel .balance-section {font-size:15px;font-weight:600;margin:24px 0 12px;}
#billingPanel tfoot td {font-weight:500;color:var(--ink-soft);}
#billingPanel .bs-total td {font-weight:700;color:var(--ink);border-top:1px solid var(--line);}
#billingPanel td .hint {font-size:12px;font-weight:400;color:var(--muted);margin-top:3px;}
@media(max-width:1100px) {
  .wrap {padding:28px 26px 50px;}
  .client-dashboard .welcome-layout {gap:28px;grid-template-columns:1fr;min-height:0;}
  .client-dashboard .welcome {padding:10px 0 0;}
  .client-dashboard .welcome h1 span {display:inline;}
  .client-dashboard .overview-volume {max-width:none;}
  .client-dashboard .overview-volume-total {font-size:36px;}
  .client-dashboard .overview-volume-copy {max-width:none;}
}
@media(max-width:600px) {
  .wrap {padding:24px 18px 40px;}
  .client-dashboard .topbar {padding:13px 18px;}
  .client-signature span {font-size:12px;}
  .client-dashboard .home-top-tabs {margin-bottom:20px;padding-bottom:14px;}
  .client-dashboard .tab-btn {padding:10px 16px;min-width:auto;flex:0 0 auto;}
  .client-dashboard .welcome-layout {gap:22px;margin-bottom:25px;}
  .client-dashboard .welcome h1 {font-size:32px;margin-bottom:12px;}
  .client-dashboard .welcome p {font-size:13px;}
  .client-dashboard .overview-volume {padding:21px 18px;gap:18px;min-height:0;}
  .client-dashboard .volume-ring {width:90px;height:90px;}
  .client-dashboard .volume-ring:before {inset:7px;}
  .client-dashboard .overview-volume-total {font-size:27px;margin:8px 0 16px;}
  .client-dashboard .overview-volume-platform {font-size:11px;gap:6px;}
  .client-dashboard .home-live {padding:22px 20px;}
  .client-dashboard .live-platforms {grid-template-columns:1fr;gap:26px;}
  .client-dashboard .home-balance {padding:22px;}
  .client-dashboard .home-balance .bh-row {flex-direction:row;}
  .client-dashboard .home-balance .bh-row > .btn {width:auto;}
  .client-dashboard .home-destinations {display:flex;flex-direction:column;gap:4px;margin-top:12px;}
  .client-dashboard .home-destination {padding:20px 0;}
  .client-dashboard .panel h2 {font-size:18px;}
  .client-dashboard .panel {padding:20px;}
  .page-title {font-size:28px;}
  .preview-notice {padding:8px 18px;}
  .preview-notice span {display:none;}
  #billingPanel .balance-focus {padding:18px 4px 24px;}
  #billingPanel .balance-focus .value {font-size:44px;}
  .client-dashboard .order-dates {grid-template-columns:1fr;}
  .client-dashboard .report-actions > .btn {flex:1 1 auto;}
}
@media(max-width:680px) {
  /* Client top bars hold the logo and Sign out only: keep them on one row (app.css stacks the admin menu). */
  .topbar:has(> .client-signature) {display:flex;}
  .topbar:has(> .client-signature) nav {margin:0;padding:0;}
}
@media(max-width:360px) {
  .client-dashboard .volume-ring {width:68px;height:68px;}
  .client-dashboard .overview-volume {gap:12px;padding:18px 14px;}
  .client-dashboard .overview-volume-total {font-size:23px;}
  .client-dashboard .home-balance .bh-row {flex-direction:column;align-items:stretch;}
}
@media(prefers-reduced-motion:reduce) {*,*:before,*:after {scroll-behavior:auto!important;animation:none!important;transition:none!important;}}
@media(forced-colors:active) {.chrome-text,.page-title,#billingPanel .balance-focus .value,#billingPanel .balance-focus .label {background:none;-webkit-text-fill-color:CanvasText;}.client-dashboard .tab-btn.primary {border:2px solid Highlight;}}

* {scrollbar-color:#5b5870 #171921;scrollbar-width:thin;}
::-webkit-scrollbar {width:7px;height:7px;}
::-webkit-scrollbar-track {background:#171921;}
::-webkit-scrollbar-thumb {background:#5b5870;border-radius:8px;}
