/* Mkorean-inspired React dashboard layer — visual only; trading logic untouched. */
:root {
  --mk-bg: #0b0712;
  --mk-panel: #160b1c;
  --mk-panel-raised: #211020;
  --mk-panel-hover: #301321;
  --mk-border: rgba(255, 191, 0, .20);
  --mk-text: #f7f1fb;
  --mk-muted: #b9a9c3;
  --mk-accent: #ffbf00;
  --mk-accent-strong: #ff8a00;
  --mk-blue: #e4b93f;
  --mk-radius: 14px;
  --mk-shadow: 0 16px 40px rgba(0, 0, 0, .28);
}
html:has(.bot), body:has(.bot), body.theme {
  background: var(--mk-bg);
  color: var(--mk-text);
}
body.theme, body.theme--light, body.theme--dark {
  --general-main-1: var(--mk-bg);
  --general-section-1: var(--mk-panel);
  --general-section-2: var(--mk-panel-raised);
  --general-section-5: var(--mk-panel-hover);
  --text-general: var(--mk-text);
  --text-prominent: var(--mk-text);
  --text-less-prominent: var(--mk-muted);
  --border-normal: var(--mk-border);
  background-color: var(--mk-bg);
  color: var(--mk-text);
}
#root { min-height: 100vh; background: var(--mk-bg); }
.bot, .bot-dashboard, .tab__dashboard, .tab__dashboard__content {
  color: var(--mk-text);
}
.bot-dashboard { background: radial-gradient(ellipse at 76% 0%, rgba(255, 191, 0, .07), transparent 36%), var(--mk-bg); }
.header, .header__container, .layout__header, .dc-header {
  background: rgba(11, 7, 18, .96) !important;
  color: var(--mk-text) !important;
  border-bottom: 1px solid var(--mk-border) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.12);
  backdrop-filter: blur(16px);
}
.header button, .header a, .header__container button, .header__container a { color: inherit; }
.tab__dashboard__content {
  background: transparent !important;
  padding: 28px clamp(16px, 3.2vw, 48px) !important;
  gap: 24px;
  height: auto !important;
  min-height: calc(100vh - 8rem);
  overflow: visible !important;
}
.tab__dashboard__header { padding: 0 0 20px !important; text-align: left !important; }
.tab__dashboard__header .title, .tab__dashboard__header h2 {
  color: var(--mk-text) !important;
  text-align: left !important;
  height: auto !important;
  font-size: clamp(2.4rem, 3vw, 3.4rem) !important;
  line-height: 1.16 !important;
  letter-spacing: -.04em;
}
.tab__dashboard__header .subtitle, .tab__dashboard__header p {
  color: var(--mk-muted) !important;
  text-align: left !important;
  margin-top: 10px !important;
  max-width: 760px;
  line-height: 1.65 !important;
}
.quick-panel { min-width: 0; }
.tab__dashboard .quick-panel, .tab__dashboard .preview-panel,
.tab__dashboard .db-info-panel, .tab__dashboard .tab__dashboard__info-panel {
  background: transparent;
}
.tab__dashboard .quick-panel > *, .tab__dashboard .quick-panel .load-strategy,
.tab__dashboard .quick-panel .load-strategy__container,
.tab__dashboard .quick-panel .dc-card, .tab__dashboard .quick-panel [class*="card"] {
  border-color: var(--mk-border);
}
.tab__dashboard .quick-panel .dc-card,
.tab__dashboard .quick-panel .load-strategy__container,
.tab__dashboard .quick-panel .db-card,
.tab__dashboard .quick-panel .strategy-card,
.tab__dashboard .quick-panel [class*="strategy-card"] {
  background: linear-gradient(145deg, rgba(33,16,32,.98), rgba(22,11,28,.98)) !important;
  border: 1px solid var(--mk-border) !important;
  border-radius: var(--mk-radius) !important;
  box-shadow: var(--mk-shadow);
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.tab__dashboard .quick-panel .dc-card:hover,
.tab__dashboard .quick-panel .load-strategy__container:hover,
.tab__dashboard .quick-panel [class*="strategy-card"]:hover {
  border-color: rgba(255,191,0,.55) !important;
  transform: translateY(-2px);
  box-shadow: 0 18px 44px rgba(0,0,0,.24);
}
.tab__dashboard button, .bot button, .dc-btn {
  border-radius: 11px;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.tab__dashboard button:focus-visible, .bot button:focus-visible, .dc-btn:focus-visible {
  outline: 2px solid var(--mk-accent) !important;
  outline-offset: 3px;
}
.tab__dashboard .dc-btn--primary, .bot .dc-btn--primary,
.tab__dashboard button[class*="primary"], .bot button[class*="primary"] {
  background: linear-gradient(135deg, var(--mk-accent), var(--mk-accent-strong)) !important;
  color: #211000 !important;
  border-color: transparent !important;
  font-weight: 700;
}
.tab__dashboard input, .tab__dashboard select, .tab__dashboard textarea,
.bot input, .bot select, .bot textarea {
  background: #130a19 !important;
  color: var(--mk-text) !important;
  border-color: var(--mk-border) !important;
  border-radius: 10px !important;
}
.tab__dashboard input::placeholder, .bot input::placeholder, .bot textarea::placeholder { color: #7287a1; }
.tab__dashboard .dc-drawer, .bot .dc-drawer, .db-sidebar {
  background: var(--mk-panel) !important;
  color: var(--mk-text) !important;
  border-color: var(--mk-border) !important;
}
.tab__dashboard .dc-drawer__toggle-icon, .bot .dc-drawer__toggle-icon { color: var(--mk-muted); }
.tab__dashboard .dc-modal, .bot .dc-modal, .dc-dialog__dialog {
  background: var(--mk-panel) !important;
  color: var(--mk-text) !important;
  border: 1px solid var(--mk-border) !important;
  border-radius: 20px !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.45);
}
.tab__dashboard .dc-modal__container, .bot .dc-modal__container { background: transparent !important; }
.tab__dashboard [class*="announcement"], .bot [class*="announcement"] {
  border-radius: 14px;
}
.tab__dashboard .dc-tabs, .bot .dc-tabs { border-color: var(--mk-border); }
.tab__dashboard .dc-tabs__item, .bot .dc-tabs__item { color: var(--mk-muted); }
.tab__dashboard .dc-tabs__item--active, .bot .dc-tabs__item--active {
  color: var(--mk-accent) !important;
  border-color: var(--mk-accent) !important;
}
.tab__dashboard .dc-text, .bot .dc-text { color: inherit; }
.tab__dashboard .dc-popover, .bot .dc-popover, .dc-tooltip { border-radius: 10px; }
.bot .run-panel__container { border-left: 1px solid var(--mk-border); }
.bot .toolbar, .bot .toolbar__section { background: var(--mk-panel) !important; }
.bot .blocklyToolboxDiv { background: #160b1c !important; border-right: 1px solid var(--mk-border); }
.bot .blocklyFlyoutBackground { fill: #281224 !important; }
.bot .blocklyMainBackground { stroke: rgba(255,191,0,.12) !important; }
.bot .injectionDiv { border-radius: 12px; overflow: hidden; }
.tab__dashboard__info-panel, .db-info-panel {
  background: var(--mk-panel) !important;
  color: var(--mk-text) !important;
  border: 1px solid var(--mk-border);
  border-radius: var(--mk-radius);
}
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: #0b0712; }
::-webkit-scrollbar-thumb { background: #69411d; border-radius: 20px; border: 2px solid #0a1423; }
::-webkit-scrollbar-thumb:hover { background: #3d5a78; }
@media (min-width: 1200px) {
  .tab__dashboard__content { max-width: 1680px; margin-inline: auto; }
}
@media (max-width: 1024px) {
  .tab__dashboard__content { padding: 22px 18px !important; }
  .tab__dashboard__header { padding-bottom: 16px !important; }
}
@media (max-width: 640px) {
  .tab__dashboard__content { padding: 16px 12px !important; gap: 16px; }
  .tab__dashboard__header .title, .tab__dashboard__header h2 { font-size: 2.5rem !important; }
  .tab__dashboard .quick-panel .dc-card,
  .tab__dashboard .quick-panel .load-strategy__container,
  .tab__dashboard .quick-panel [class*="strategy-card"] { border-radius: 14px !important; }
}

/* Native Vaultrader integration: full-width workspace and gold-accent controls. */
html, body, #root { width: 100%; max-width: 100%; }
.tab__dashboard__content {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  box-sizing: border-box;
}
.tab__dashboard__content .dc-btn--primary,
.bot .dc-btn--primary,
.tab__dashboard__content button[class*="primary"],
.bot button[class*="primary"] {
  background: linear-gradient(120deg, #ffbf00, #ff8a00) !important;
  color: #190c12 !important;
}
.bot .run-panel__container,
.bot .run-panel,
.bot [class*="run-panel"] {
  border-color: var(--mk-border) !important;
}
.bot .blocklyToolboxDiv { border-right-color: var(--mk-border) !important; }
.bot .blocklyFlyoutBackground { fill: #241020 !important; }
.bot .blocklyScrollbarHandle { fill: #80602b !important; }
.bot .blocklyScrollbarBackground { fill: #160b1c !important; }
@media (min-width: 1200px) {
  .tab__dashboard__content { max-width: none !important; margin-inline: 0 !important; }
}
@media (max-width: 768px) {
  .tab__dashboard__content { padding: 12px 8px !important; }
  .bot .run-panel__container { max-width: 100vw; }
}

/* Compact horizontal navigation inspired by the Mkorean reference.
   This only styles the app-level menu. Blockly's left toolbox stays intact. */
.tnx-mkorean-horizontal-nav {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: .35rem !important;
  width: 100% !important;
  max-width: 100vw !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
  padding: .55rem clamp(.8rem, 1.5vw, 1.8rem) !important;
  margin: 0 !important;
  background: linear-gradient(90deg, #250008 0%, #4b0010 45%, #210013 100%) !important;
  border-top: 1px solid rgba(255,210,26,.12) !important;
  border-bottom: 1px solid rgba(255,210,26,.2) !important;
  scrollbar-width: thin !important;
  scrollbar-color: #6b3a28 transparent !important;
  position: relative !important;
  z-index: 1000 !important;
}
.tnx-mkorean-horizontal-nav > ul,
.tnx-mkorean-horizontal-nav > ol {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: .35rem !important;
  width: max-content !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
.tnx-mkorean-horizontal-nav li {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.tnx-mkorean-horizontal-nav > * {
  flex: 0 0 auto !important;
  min-width: max-content !important;
}
.tnx-mkorean-horizontal-nav :is(a, button, [role="tab"]) {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .5rem !important;
  min-height: 4.1rem !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  padding: .9rem 1.25rem !important;
  margin: 0 !important;
  border: 1px solid transparent !important;
  border-radius: .85rem !important;
  background: transparent !important;
  color: #f7f0fa !important;
  font-size: 1.25rem !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  transform: none !important;
}
.tnx-mkorean-horizontal-nav :is(a, button, [role="tab"]):hover {
  background: rgba(255,210,26,.1) !important;
  border-color: rgba(255,210,26,.18) !important;
  color: #ffe56a !important;
}
.tnx-mkorean-horizontal-nav :is(a, button, [role="tab"]).active,
.tnx-mkorean-horizontal-nav :is(a, button, [role="tab"])[aria-current="page"],
.tnx-mkorean-horizontal-nav :is(a, button, [role="tab"])[aria-selected="true"] {
  background: linear-gradient(110deg, #7d000c, #a0060b) !important;
  border-color: rgba(255,210,26,.18) !important;
  color: #fff !important;
}
@media (max-width: 700px) {
  .tnx-mkorean-horizontal-nav {
    gap: .2rem !important;
    padding: .45rem .65rem !important;
  }
  .tnx-mkorean-horizontal-nav :is(a, button, [role="tab"]) {
    min-height: 3.8rem !important;
    padding: .75rem .95rem !important;
    font-size: 1.15rem !important;
  }
}
/* Banner cleanup remains independent from the now-visible horizontal menu. */
.tnx-hide-inner-navigation { display: none !important; }


/* Mobile Bot Builder correction: use the phone viewport instead of shrinking the desktop canvas. */
html, body, #root {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  overflow-x: hidden !important;
}
#root, #root > div {
  min-width: 0 !important;
  max-width: 100vw !important;
}
@media (max-width: 700px) {
  .tab__dashboard__content {
    padding: 8px 6px !important;
    gap: 8px !important;
    overflow-x: hidden !important;
  }
  .tab__dashboard__header {
    padding: 6px 8px !important;
    gap: 6px !important;
  }
  .tab__dashboard__header .title,
  .tab__dashboard__header h2 {
    font-size: 1.55rem !important;
    line-height: 1.2 !important;
  }
  /* Remove duplicate/large account chrome inside the embedded builder on phones. */
  .tab__dashboard__header .description,
  .tab__dashboard__header p {
    font-size: 1.1rem !important;
    line-height: 1.3 !important;
  }
  .bot, .bot__content, .tab__dashboard, .tab__dashboard__content,
  .tab__dashboard__body, .blockly-container, .blocklyDiv {
    min-width: 0 !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }
  .bot .blocklyToolboxDiv {
    max-width: 136px !important;
    min-width: 112px !important;
    overflow-x: hidden !important;
  }
  .bot .blocklyToolboxDiv .blocklyTreeLabel,
  .bot .blocklyToolboxDiv .blocklyToolboxCategoryLabel {
    font-size: 12px !important;
    white-space: normal !important;
  }
  .bot .blocklyFlyout {
    max-width: 78vw !important;
  }
  .bot .toolbar, .bot .toolbar__section {
    max-width: 100vw !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    box-sizing: border-box !important;
  }
  .bot .run-panel__container,
  .bot .run-panel,
  .bot [class*="run-panel"] {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 40 !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }
  .bot .blocklyMainBackground { fill: #ffffff !important; }
  .bot .blocklyToolboxDiv { background: #f0f1f3 !important; }
  .bot .blocklyFlyoutBackground { fill: #f1f2f4 !important; }
  .bot .injectionDiv { overflow: hidden !important; }
}
@media (max-width: 420px) {
  .tab__dashboard__content { padding: 5px 3px !important; }
  .bot .blocklyToolboxDiv { max-width: 118px !important; min-width: 96px !important; }
  .bot .run-panel__container { font-size: 12px !important; }
}


/* Screenshot reference pass: Mkorean mobile Bot Builder composition */
@media (max-width: 700px) {
  html, body, #root { width:100% !important; max-width:100% !important; overflow:hidden !important; }
  #root { height:100dvh !important; min-height:100dvh !important; }
  body.theme, body.theme--light { background:#f1f2f4 !important; color:#303238 !important; }
  .header, .header__container, .layout__header, .dc-header {
    background:#fff !important; color:#303238 !important; box-shadow:none !important;
    border-bottom:1px solid #d9dce0 !important;
  }
  .tab__dashboard__content {
    height:calc(100dvh - 19rem) !important;
    min-height:0 !important;
    padding:5px 0 0 !important;
    margin:0 !important;
    gap:5px !important;
    overflow:hidden !important;
    background:#f1f2f4 !important;
  }
  .tab__dashboard__header { padding:4px 8px !important; margin:0 !important; }
  .tab__dashboard__header .title,.tab__dashboard__header h2 { font-size:1.6rem !important; }
  .bot, .bot__content, .tab__dashboard, .tab__dashboard__content,
  .tab__dashboard__body, .blockly-container, .blocklyDiv, .bot .injectionDiv {
    width:100% !important; max-width:100% !important; min-width:0 !important;
    box-sizing:border-box !important;
  }
  .bot { height:100% !important; min-height:0 !important; background:#fff !important; }
  .bot .toolbar, .bot .toolbar__section {
    display:flex !important; flex-wrap:nowrap !important; gap:4px !important;
    width:100% !important; max-width:100% !important; overflow-x:auto !important;
    background:#fff !important; border:1px solid #d9dce0 !important;
  }
  .bot .blocklyToolboxDiv {
    background:#f1f2f4 !important; border-right:1px solid #d7d9dd !important;
    max-width:80px !important; min-width:64px !important; overflow-x:hidden !important;
  }
  .bot .blocklyTreeLabel, .bot .blocklyToolboxCategoryLabel { font-size:11px !important; }
  .bot .blocklyMainBackground { fill:#fff !important; stroke:#e5e6e8 !important; }
  .bot .blocklyFlyoutBackground { fill:#f1f2f4 !important; }
  .bot .blocklyScrollbarBackground { fill:#e4e5e7 !important; }
  /* Match the red block families shown in the supplied Mkorean screenshots. */
  .bot .blocklyBlockCanvas > g > .blocklyPath,
  .bot .blocklyBlockCanvas .blocklyPath { fill:#a00000 !important; stroke:#820000 !important; }
  .bot .blocklyBlockCanvas .blocklyText,
  .bot .blocklyBlockCanvas .blocklyEditableText text { fill:#fff !important; }
  .bot .blocklyFlyout .blocklyPath { fill:#a00000 !important; stroke:#820000 !important; }
  .bot .blocklyFlyout .blocklyText { fill:#fff !important; }
  .bot .run-panel__container, .bot .run-panel, .bot [class*="run-panel"] {
    position:fixed !important; left:0 !important; right:0 !important; bottom:24px !important;
    width:100% !important; max-width:100% !important; z-index:500 !important;
    background:#fff !important; box-sizing:border-box !important;
    padding:8px 12px !important; border-top:1px solid #d7d9dd !important;
  }
  .bot .run-panel__container button, .bot .run-panel button {
    min-height:48px !important; border-radius:5px !important;
  }
}
@media (max-width: 420px) {
  .tab__dashboard__content { height:calc(100dvh - 18rem) !important; }
  .bot .blocklyToolboxDiv { max-width:70px !important; min-width:58px !important; }
  .bot .run-panel__container, .bot .run-panel, .bot [class*="run-panel"] { bottom:24px !important; }
}


/* Correct the undersized mobile builder: let Blockly own a tall, usable viewport. */
@media (max-width:700px){
  html,body,#root{height:100%!important;min-height:100%!important;overflow-x:hidden!important;overflow-y:auto!important}
  #root > div{min-height:calc(100dvh - 104px)!important;height:auto!important}
  .tab__dashboard__content{
    height:auto!important;min-height:calc(100dvh - 230px)!important;
    max-height:none!important;overflow:visible!important;
    padding:6px 4px 78px!important;margin:0!important;
  }
  .tab__dashboard__body,.bot,.bot__content,.blockly-container,.blocklyDiv,.bot .injectionDiv{
    height:calc(100dvh - 255px)!important;min-height:440px!important;
    max-height:none!important;width:100%!important;max-width:100%!important;
    box-sizing:border-box!important;
  }
  .bot .blocklySvg{width:100%!important;height:100%!important;min-height:440px!important}
  .bot .blocklyBlockCanvas,.bot .blocklyBubbleCanvas{transform-origin:0 0}
  .bot .blocklyToolboxDiv{min-width:54px!important;max-width:68px!important;width:68px!important}
  .bot .blocklyTreeRow{padding-left:5px!important;padding-right:3px!important}
  .bot .blocklyTreeLabel,.bot .blocklyToolboxCategoryLabel{font-size:11px!important;line-height:1.2!important}
  .bot .blocklyFlyout{max-width:82vw!important}
  .bot .run-panel__container,.bot .run-panel,.bot [class*="run-panel"]{
    position:fixed!important;left:0!important;right:0!important;bottom:24px!important;
    width:100%!important;z-index:500!important;display:flex!important;
    justify-content:center!important;box-sizing:border-box!important;
  }
}
@media(max-width:420px){
  .tab__dashboard__content{min-height:calc(100dvh - 205px)!important;padding-bottom:78px!important}
  .tab__dashboard__body,.bot,.bot__content,.blockly-container,.blocklyDiv,.bot .injectionDiv{
    height:calc(100dvh - 225px)!important;min-height:480px!important;
  }
  .bot .blocklySvg{min-height:480px!important}
}

/* Final Bot Builder-only reference alignment: match the Mkorean workspace without altering Blockly logic. */
:root{
 --mk-bg:#f1f2f4;--mk-panel:#fff;--mk-panel-raised:#fff;--mk-panel-hover:#f7f8fa;
 --mk-border:#dfe2e6;--mk-text:#303238;--mk-muted:#737780;--mk-accent:#ffcc00;--mk-accent-strong:#ff8a00;
}
html,body,#root{width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important}
body.theme,body.theme--light,body.theme--dark{background:#f1f2f4!important;color:#303238!important}
#root{background:#f1f2f4!important}
.header,.header__container,.layout__header,.dc-header{
 background:#fff!important;color:#303238!important;border-bottom:1px solid #dfe2e6!important;
 box-shadow:none!important;backdrop-filter:none!important
}
.header button,.header a,.header__container button,.header__container a{color:#303238}
.tab__dashboard__content{background:#f1f2f4!important;color:#303238!important}
.tab__dashboard__header .title,.tab__dashboard__header h2{color:#303238!important}
.tab__dashboard__header .subtitle,.tab__dashboard__header p{color:#737780!important}
.tnx-mkorean-horizontal-nav{
 display:flex!important;flex-direction:row!important;align-items:stretch!important;flex-wrap:nowrap!important;
 width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;
 white-space:nowrap!important;gap:0!important;background:#300006!important;border-bottom:4px solid #ffcc00!important;
 scrollbar-width:thin!important;scrollbar-color:#ffcc00 #300006!important
}
.tnx-mkorean-horizontal-nav :is(a,button,[role="tab"]){
 display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;
 min-height:5.4rem!important;padding:1.2rem 1.8rem!important;background:#300006!important;color:#fff!important;
 border:0!important;border-bottom:4px solid transparent!important;border-radius:0!important;
 font-size:1.45rem!important;font-weight:800!important;white-space:nowrap!important
}
.tnx-mkorean-horizontal-nav :is(a,button,[role="tab"]).active,
.tnx-mkorean-horizontal-nav :is(a,button,[role="tab"])[aria-current="page"],
.tnx-mkorean-horizontal-nav :is(a,button,[role="tab"])[aria-selected="true"]{
 background:#a30008!important;color:#fff!important;border-bottom-color:#ffcc00!important
}
.bot .toolbar,.bot .toolbar__section{
 display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:.5rem!important;
 max-width:100%!important;overflow-x:auto!important;background:#fff!important;color:#303238!important;
 border:1px solid #dfe2e6!important;border-radius:.6rem!important
}
.bot .blocklyToolboxDiv{background:#f1f2f4!important;border-right:1px solid #dfe2e6!important}
.bot .blocklyMainBackground{fill:#fff!important;stroke:#e5e6e8!important}
.bot .blocklyFlyoutBackground{fill:#f1f2f4!important}
.bot .blocklyScrollbarBackground{fill:#e4e5e7!important}
.bot .run-panel__container,.bot .run-panel,.bot [class*="run-panel"]{
 background:#fff!important;color:#303238!important;border-top:1px solid #dfe2e6!important;box-shadow:0 -3px 12px rgba(0,0,0,.06)!important
}
@media(min-width:701px){
 .tab__dashboard__content{padding:1.2rem 1.6rem!important;gap:1.2rem!important;min-height:calc(100vh - 10rem)!important}
 .bot,.bot__content,.tab__dashboard__body,.blockly-container,.blocklyDiv,.bot .injectionDiv{
  min-width:0!important;max-width:100%!important;box-sizing:border-box!important
 }
 .bot .blocklyToolboxDiv{min-width:245px!important;max-width:300px!important}
}
@media(max-width:700px){
 html,body,#root{height:auto!important;min-height:100%!important;overflow-x:hidden!important;overflow-y:auto!important}
 #root>div{height:auto!important;min-height:100dvh!important;max-width:100%!important}
 .tab__dashboard__content{height:auto!important;min-height:calc(100dvh - 16rem)!important;max-height:none!important;overflow:visible!important;padding:6px 4px 8rem!important;gap:6px!important}
 .tab__dashboard__header{padding:4px 8px 8px!important;margin:0!important}
 .tab__dashboard__header .title,.tab__dashboard__header h2{font-size:1.8rem!important;line-height:1.2!important}
 .tnx-mkorean-horizontal-nav :is(a,button,[role="tab"]){min-height:4.8rem!important;padding:.9rem 1.2rem!important;font-size:1.25rem!important}
 .bot,.bot__content,.tab__dashboard,.tab__dashboard__body,.blockly-container,.blocklyDiv,.bot .injectionDiv{
  width:100%!important;max-width:100%!important;min-width:0!important;height:calc(100dvh - 24rem)!important;min-height:460px!important;max-height:none!important;box-sizing:border-box!important
 }
 .bot .blocklySvg{width:100%!important;height:100%!important;min-height:460px!important}
 .bot .blocklyToolboxDiv{width:76px!important;min-width:60px!important;max-width:76px!important}
 .bot .blocklyTreeRow{padding-left:4px!important;padding-right:2px!important}
 .bot .blocklyTreeLabel,.bot .blocklyToolboxCategoryLabel{font-size:11px!important;line-height:1.2!important;white-space:normal!important}
 .bot .blocklyFlyout{max-width:82vw!important}
 .bot .run-panel__container,.bot .run-panel,.bot [class*="run-panel"]{
  position:sticky!important;left:auto!important;right:auto!important;bottom:0!important;width:100%!important;max-width:100%!important;
  z-index:500!important;display:flex!important;justify-content:center!important;box-sizing:border-box!important;padding:8px!important
 }
 .bot .run-panel__container button,.bot .run-panel button{min-height:46px!important;border-radius:5px!important}
}
@media(max-width:420px){
 .tab__dashboard__content{padding-inline:2px!important}
 .bot,.bot__content,.tab__dashboard__body,.blockly-container,.blocklyDiv,.bot .injectionDiv{height:calc(100dvh - 22rem)!important;min-height:480px!important}
 .bot .blocklySvg{min-height:480px!important}
 .tnx-mkorean-horizontal-nav :is(a,button,[role="tab"]){padding:.8rem 1rem!important;font-size:1.15rem!important}
}


/* October layout repair: keep Blockly's SVG and side panels sized to the actual viewport. */
#root,.bot,.bot__content,.tab__dashboard,.tab__dashboard__body,.blockly-container,.blocklyDiv,.bot .injectionDiv{
 width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;
}
.bot .injectionDiv{position:relative!important;overflow:hidden!important}
.bot .blocklySvg{display:block!important;width:100%!important;max-width:100%!important}
.bot .blocklyMainBackground{fill:#fff!important}
.bot .blocklyToolboxDiv{z-index:4!important;max-width:min(300px,24vw)!important}
.bot .run-panel__container{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
@media(min-width:1101px){
 .bot .blocklyToolboxDiv{width:260px!important;min-width:230px!important}
 .bot .run-panel__container{width:clamp(320px,26vw,460px)!important;flex:0 0 clamp(320px,26vw,460px)!important}
 .bot .blocklyWorkspace{width:100%!important}
}
@media(max-width:1100px){
 .bot .run-panel__container{width:100%!important;max-width:100%!important}
 .bot .blocklyToolboxDiv{max-width:220px!important}
}