/* MarcAM AI Design Studio — charcoal/orange theme.
   Load after vector-studio.css and shared-nav.css. */
body.design-studio-page {
  --bg:#14191c;
  --panel:#242b2f;
  --panel2:#20272b;
  --panel3:#2c353a;
  --line:#3a4449;
  --text:#f3f5f5;
  --muted:#adb9bf;
  --accent:#ff653c;
  background:#14191c !important;
  color:#f3f5f5;
}
body.design-studio-page .studio-header,
body.design-studio-page #top,
body.design-studio-page .studio-status {
  background:#20272b !important;
  color:#f3f5f5 !important;
  border-color:#3a4449 !important;
}
body.design-studio-page .studio-header #title {
  background:#2c353a !important;
  border-color:#465158 !important;
  color:#f3f5f5 !important;
}
body.design-studio-page main {
  background:#14191c;
}
body.design-studio-page #tools,
body.design-studio-page main > aside,
body.design-studio-page #panel,
body.design-studio-page #tabs {
  background:#242b2f !important;
  color:#f3f5f5 !important;
  border-color:#3a4449 !important;
}
body.design-studio-page #viewport {
  background:#30383d !important;
  border-color:#465158 !important;
}
/* Keep the editable paper, SVG art, grid and overlay unchanged. */
body.design-studio-page #top button,
body.design-studio-page #tools button,
body.design-studio-page #tabs button,
body.design-studio-page #panel button,
body.design-studio-page .studio-header .menuTop,
body.design-studio-page .appMenu button {
  color:#f3f5f5;
  border-color:#465158;
}
body.design-studio-page #top button:hover,
body.design-studio-page #tools button:hover,
body.design-studio-page #tabs button:hover,
body.design-studio-page #panel button:hover,
body.design-studio-page .studio-header .menuTop:hover,
body.design-studio-page .appMenu button:hover {
  background:#374248 !important;
  color:#fff !important;
}
body.design-studio-page #top button.active,
body.design-studio-page #tools button.active,
body.design-studio-page #tabs button.active,
body.design-studio-page #panel button.active,
body.design-studio-page .studio-header .menuTop.active,
body.design-studio-page [aria-pressed="true"]:is(button) {
  background:#df5a32 !important;
  border-color:#ee714b !important;
  color:#fff !important;
}
body.design-studio-page .appMenu {
  background:#242b2f !important;
  color:#f3f5f5 !important;
  border:1px solid #465158 !important;
  box-shadow:0 18px 40px rgba(0,0,0,.3) !important;
}
body.design-studio-page .menuSep,
body.design-studio-page .topDivider {border-color:#465158 !important; background-color:#465158;}
body.design-studio-page #top input:not([type="checkbox"]),
body.design-studio-page #panel input:not([type="checkbox"]):not([type="range"]):not([type="color"]),
body.design-studio-page #panel select,
body.design-studio-page #panel textarea {
  background:#2c353a !important;
  border-color:#465158 !important;
  color:#f3f5f5 !important;
}
body.design-studio-page #panel select option {background:#242b2f;color:#fff;}
body.design-studio-page #top input[type="range"],
body.design-studio-page #panel input[type="range"] {accent-color:#ff653c;}
body.design-studio-page #panel label,
body.design-studio-page #top label,
body.design-studio-page #status {color:#d9e0e3;}
body.design-studio-page #toast {
  background:#242b2f;
  border-color:#465158;
  color:#f3f5f5;
}
/* Header colours are governed by shared-nav.css across all pages. */