.analytics-studio {
  --studio-palette-width: 232px;
  --studio-inspector-width: 288px;
  height: 100%;
  min-height: 0;
  grid-template-rows: auto auto minmax(0, 1fr);
}
.analytics-studio :is(.dashboard-studio-header, .report-studio-header) {
  background: var(--surface);
  box-shadow: none;
  flex-wrap: wrap;
}
.analytics-studio :is(.dashboard-header-actions, .report-header-actions) {
  flex: 0 0 auto;
  flex-wrap: nowrap;
  overflow: visible;
}
.analytics-studio :is(.dashboard-title-group, .report-title-group) { flex: 1 1 240px; }
.analytics-studio :is(.dashboard-name-row input, .report-name-row h1) { width: auto; }
.studio-toolbar, .studio-toolbar-group, .studio-toolbar-end, .studio-filter-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.studio-toolbar { margin: 0 10px; }
.studio-toolbar-group + .studio-toolbar-group { border-left: 1px solid var(--line); padding-left: 8px; }
.studio-toolbar-end { margin-left: auto; color: var(--muted); font-size: 12px; }
.studio-toolbar button[aria-pressed="true"] { color: var(--blue); background: var(--blue-soft); border-color: var(--blue); }
.studio-help.icon-button { width: 24px; height: 24px; border-radius: 50%; padding: 0; color: var(--muted); font-size: 12px; }
.analytics-studio .studio-layout {
  --studio-left: var(--studio-palette-width);
  --studio-right: var(--studio-inspector-width);
  grid-template-columns: var(--studio-left) minmax(0, 1fr) var(--studio-right);
  grid-template-rows: minmax(0, 1fr);
  min-height: 0;
  border-radius: 10px;
  box-shadow: none;
  overflow: hidden;
}
.analytics-studio .studio-layout.is-palette-hidden { --studio-left: 0px; }
.analytics-studio .studio-layout.is-inspector-hidden { --studio-right: 0px; }
.analytics-studio .studio-layout > :is(.studio-palette, main, .studio-inspector) {
  min-height: 0;
  max-height: none;
  overflow: auto;
  overscroll-behavior: contain;
}
.analytics-studio .studio-layout > .studio-palette { grid-column: 1; grid-row: 1; min-width: 0; }
.studio-palette-resizer {
  position: relative;
  grid-column: 1;
  grid-row: 1;
  justify-self: end;
  width: 10px;
  margin-right: -5px;
  z-index: 5;
  cursor: col-resize;
  touch-action: none;
  user-select: none;
}
.studio-palette-resizer::before { content: ""; position: absolute; inset: 0 4px; background: transparent; }
.studio-palette-resizer::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 3px;
  width: 4px;
  height: 28px;
  transform: translateY(-50%);
  border-radius: 2px;
  background: var(--line-strong);
}
.studio-palette-resizer:hover::before,
.studio-palette-resizer:focus-visible::before,
.is-palette-resizing .studio-palette-resizer::before { background: var(--blue); }
.studio-palette-resizer:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
.is-palette-resizing, .is-palette-resizing * { cursor: col-resize !important; user-select: none !important; }
.analytics-studio .studio-layout > main { grid-column: 2; grid-row: 1; min-width: 0; }
.analytics-studio .studio-layout > .studio-inspector {
  position: static;
  grid-column: 3;
  grid-row: 1;
  width: auto;
  min-width: 0;
  overflow-y: auto;
  margin: 0;
  border: 0;
  border-left: 1px solid var(--line);
  border-radius: 0;
  box-shadow: none;
  background: var(--surface);
}
.studio-inspector-title { display: flex; align-items: center; justify-content: space-between; padding: 12px; border-bottom: 1px solid var(--line); }
.studio-inspector-tabs { display: flex; gap: 4px; flex-wrap: wrap; padding: 10px; border-bottom: 1px solid var(--line); }
.studio-inspector-tabs button[aria-selected="true"] { background: var(--blue-soft); color: var(--blue); }
.studio-inspector-content { padding: 12px; display: grid; gap: 14px; }
.studio-inspector-content > label, .studio-filter-editor > label { display: grid; gap: 6px; font-size: 12px; color: var(--muted); }
.studio-filter-editor { display: grid; gap: 10px; }
.studio-filter-heading { gap: 6px; font-size: 12px; }
.studio-filter-heading > button:last-child { margin-left: auto; }
.studio-filter-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.studio-filter-row > select, .studio-filter-row > input { grid-column: 1; width: 100%; min-width: 0; }
.studio-filter-row > button { grid-column: 2; grid-row: 1; }
.studio-muted { color: var(--muted); font-size: 12px; }
.studio-status { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; color: var(--muted); }
.studio-status.is-stale { color: var(--amber); background: var(--amber-soft); padding: 8px 12px; border-radius: 6px; }
.studio-status.is-error { color: var(--red); background: var(--red-soft); padding: 8px 12px; }
.analytics-studio :is(.studio-inspector, .studio-palette) :is(input:not([type="checkbox"]), select) {
  height: var(--button-height);
  min-width: 0;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--button-radius, 6px);
  background-color: var(--surface);
  color: var(--text);
  font-size: var(--button-font-size, 12px);
  padding: 0 9px;
  min-height: 0;
}
.analytics-studio :is(.studio-inspector, .studio-palette) .custom-select-trigger {
  height: var(--button-height);
  min-height: 0;
  padding: 0 9px;
  border-radius: var(--button-radius, 6px);
  font-size: var(--button-font-size, 12px);
  box-shadow: none;
  background: var(--surface);
}
.analytics-studio :is(.dashboard-header-actions, .report-header-actions) .custom-select-trigger { min-height: 0; height: var(--button-height-small); }
.analytics-studio button:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.analytics-studio button:disabled { cursor: not-allowed; opacity: .5; }
.studio-drop-zone { display: grid; align-content: start; gap: 8px; border: 1px dashed var(--line-strong); border-radius: 6px; padding: 10px; background: var(--surface); }
.studio-drop-zone > header { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; }
.studio-drop-zone.is-over, .analytics-studio [data-drop-active="true"] { outline: 2px solid var(--blue); outline-offset: -2px; background: var(--blue-soft); }
.studio-drag-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 5px; color: var(--text); background: var(--surface); font-size: 12px; cursor: grab; touch-action: none; }
.studio-chip-list { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.studio-drag-ghost { position: fixed; z-index: 1000; pointer-events: none; background: var(--surface); border: 1px solid var(--blue); border-radius: 6px; padding: 8px 12px; color: var(--text); box-shadow: var(--shadow); font-size: 12px; opacity: .9; }
@media (max-width: 1100px) {
  .analytics-studio { height: auto; grid-template-rows: none; }
  .analytics-studio :is(.dashboard-title-group, .report-title-group) { flex-basis: auto; }
  .analytics-studio :is(.dashboard-header-actions, .report-header-actions) { flex-wrap: wrap; flex-basis: auto; }
  .analytics-studio .studio-layout {
    grid-template-columns: var(--studio-left) minmax(0, 1fr);
    grid-template-rows: minmax(0, calc(100dvh - 230px)) auto;
  }
  .analytics-studio .studio-layout > .studio-inspector { grid-column: 1 / -1; grid-row: 2; border-left: 0; border-top: 1px solid var(--line); max-height: 420px; }
}
@media (max-width: 820px) {
  .studio-palette-resizer { display: none; }
  .analytics-studio .studio-layout { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .analytics-studio .studio-layout > .studio-palette { grid-column: 1; grid-row: 1; max-height: 260px; overflow-y: auto; border-right: 0; }
  .analytics-studio .studio-layout > main { grid-column: 1; grid-row: 2; overflow: visible; }
  .analytics-studio .studio-layout > .studio-inspector { grid-column: 1; grid-row: 3; }
  .studio-toolbar-end { margin-left: 0; }
}
