@import url('/kline-chart-lab/market-workspace-core.css?v=20260821-drawing-icons-v1');
@import url('/kline-chart-lab/market-workspace-panels.css?v=20260902-desktop-drawings-v2');
@import url('/kline-chart-lab/market-workspace-portrait.css?v=20260818-market-v1-portrait');

/* The contextual property bar follows the selected overlay while it is dragged. */
.overlay-context{
  transform:translate(-50%,-100%);
  will-change:left,top;
  transition:left 70ms linear,top 70ms linear,opacity .14s ease;
}
.overlay-context.is-below{transform:translate(-50%,0)}

/* Visual tuning: stronger Disciply watermark + slightly more compact chart. */
.quick-glyph{min-width:20px;min-height:20px}
.quick-glyph--svg svg{width:20px;height:20px;stroke-width:1.55}
.quick-glyph--long,.quick-glyph--short{width:22px;height:22px}
.tool-card__icon{
  width:38px;
  height:34px;
  margin-bottom:7px;
  border:1px solid rgba(49,61,78,.72);
  border-radius:9px;
  background:#090d13;
  color:#cfd7e2;
}
.tool-card__icon svg{width:25px;height:25px;stroke-width:1.55}

.chart-watermark{
  opacity:.07;
}
.chart-watermark strong{
  color:#f5f7fb;
  text-shadow:0 0 28px rgba(245,196,0,.12);
}
.chart-watermark span{
  color:#d8c861;
  opacity:.95;
}
.chart-workspace,
.chart-stage{
  min-height:calc(100dvh - 290px);
}

.chart-retry{
  min-height:34px;
  margin-top:4px;
  padding:0 14px;
  border:1px solid #655516;
  border-radius:8px;
  background:#17140a;
  color:#f5c400;
  font-size:8px;
  font-weight:850;
}
.chart-retry.is-hidden{display:none}

html.chart-native-landscape body{padding-bottom:0!important}
html.chart-native-landscape .market-bottom-nav{display:none!important}
html.market-chart-active .market-bottom-nav{
  background:#06090d!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
}

@media (max-width:1024px) and (max-height:700px) and (orientation:landscape){
  html.market-chart-active,
  html.market-chart-active body{
    height:100dvh;
    overflow:hidden!important;
    overscroll-behavior:none;
  }
  html.market-chart-active body{padding-bottom:0!important}
  html.market-chart-active .market-topbar{display:none!important}
  html.market-chart-active .market-bottom-nav{display:none!important}
  html.market-chart-active .market-main{
    height:100dvh;
    padding:0!important;
    overflow:hidden;
  }
  html.market-chart-active .instrument-strip{
    min-height:52px;
    padding:6px 12px;
  }
  html.market-chart-active .market-selector{
    min-height:39px;
    padding:3px 10px 6px;
  }
  html.market-chart-active .chart-card{
    height:calc(100dvh - 91px);
    display:flex;
    flex-direction:column;
    box-shadow:none;
  }
  html.market-chart-active .workspace-commandbar{flex:0 0 42px}
  html.market-chart-active .chart-workspace{
    flex:1 1 auto;
    min-height:0!important;
    height:auto;
    overflow:hidden;
  }
  html.market-chart-active .chart-stage{
    min-height:0!important;
    height:100%;
  }
  html.market-chart-active .quick-toolbar{
    min-height:0;
    overflow-y:auto;
  }
  html.market-chart-active .chart-statusbar{display:none}
  html.market-chart-active .chart-watermark{display:none}
}

@media (max-width:820px) and (orientation:portrait){
  html:not(.chart-native-landscape) .market-shell .chart-workspace,
  html:not(.chart-native-landscape) .market-shell .chart-stage{
    min-height:max(420px,calc(100dvh - 400px))!important;
  }
}

@supports not (height:100dvh){
  .chart-workspace,
  .chart-stage{
    min-height:calc(100vh - 290px);
  }
  @media (max-width:820px) and (orientation:portrait){
    html:not(.chart-native-landscape) .market-shell .chart-workspace,
    html:not(.chart-native-landscape) .market-shell .chart-stage{
      min-height:max(420px,calc(100vh - 400px))!important;
    }
  }
}

/* 2026-09 mobile landscape pass: keep the chart clear of iPhone safe areas,
   move chart actions to a dedicated top rail, and avoid the hybrid desktop
   composition when fullscreen is closed while the device is still rotated. */
@media (max-width:1023px) and (orientation:landscape){
  :root{
    --kline-landscape-header:50px;
    --kline-landscape-tools:62px;
  }

  html.market-chart-active body.market-launch-ready{
    background:#05080d!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }

  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape{
    grid-template-columns:calc(var(--kline-landscape-tools) + env(safe-area-inset-left)) minmax(0,1fr)!important;
    background:#060a0f!important;
  }

  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .drawing-toolbar{
    padding:max(6px,env(safe-area-inset-top)) 6px max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left))!important;
    gap:3px!important;
    background:#070b11!important;
    border-right:1px solid rgba(255,255,255,.075)!important;
    scrollbar-width:none!important;
  }
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .drawing-toolbar::-webkit-scrollbar{display:none!important}
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .drawing-toolbar button{
    flex:0 0 44px!important;
    width:100%!important;
    min-width:44px!important;
    min-height:44px!important;
    border-radius:11px!important;
  }
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .drawing-toolbar .quick-glyph{
    min-width:24px!important;
    min-height:24px!important;
    font-size:17px!important;
  }
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .drawing-toolbar .quick-glyph--mini{font-size:9px!important}
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .drawing-toolbar .quick-glyph--long,
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .drawing-toolbar .quick-glyph--short{
    width:27px!important;
    height:27px!important;
    font-size:12px!important;
  }

  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .chart-stage{background:#060a0f!important}
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .chart-mount{
    top:calc(var(--kline-landscape-header) + env(safe-area-inset-top))!important;
    right:env(safe-area-inset-right)!important;
    bottom:0!important;
    left:0!important;
    width:auto!important;
    height:auto!important;
  }

  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .mobile-chart-action-rail{
    position:fixed!important;
    z-index:12020!important;
    top:env(safe-area-inset-top)!important;
    right:max(8px,env(safe-area-inset-right))!important;
    bottom:auto!important;
    left:calc(var(--kline-landscape-tools) + env(safe-area-inset-left) + 8px)!important;
    display:grid!important;
    grid-template-columns:repeat(6,42px)!important;
    justify-content:end!important;
    width:auto!important;
    height:var(--kline-landscape-header)!important;
    min-height:var(--kline-landscape-header)!important;
    padding:4px 5px!important;
    border:1px solid rgba(91,108,132,.42)!important;
    border-radius:13px!important;
    background:rgba(7,11,17,.96)!important;
    box-shadow:0 12px 32px rgba(0,0,0,.34)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    backdrop-filter:blur(14px)!important;
  }
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail button,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .mobile-chart-action-rail button{
    display:grid!important;
    place-items:center!important;
    width:42px!important;
    height:40px!important;
    min-width:42px!important;
    min-height:40px!important;
    padding:0!important;
    border:0!important;
    border-radius:9px!important;
    background:transparent!important;
    color:#aeb9c8!important;
  }
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail button.is-alert,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .mobile-chart-action-rail button.is-alert{color:#f5c400!important}
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail button:active,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .mobile-chart-action-rail button:active{
    color:#fff!important;
    background:rgba(255,255,255,.07)!important;
    transform:scale(.96)!important;
  }
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail svg,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .mobile-chart-action-rail svg{width:22px!important;height:22px!important}
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail [data-mobile-chart-action="rotate"] svg,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .mobile-chart-action-rail [data-mobile-chart-action="rotate"] svg{width:25px!important;height:25px!important}

  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .landscape-hud{display:none!important}
  html.chart-native-landscape body.market-launch-ready #chartWorkspace:fullscreen .landscape-hud,
  html.chart-native-landscape body.market-launch-ready #chartWorkspace:-webkit-full-screen .landscape-hud{
    position:absolute!important;
    z-index:12030!important;
    top:env(safe-area-inset-top)!important;
    right:max(8px,env(safe-area-inset-right))!important;
    left:8px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:3px!important;
    height:var(--kline-landscape-header)!important;
    min-height:var(--kline-landscape-header)!important;
    padding:4px 6px!important;
    border:0!important;
    border-bottom:1px solid rgba(255,255,255,.075)!important;
    border-radius:0!important;
    background:rgba(6,10,15,.97)!important;
    box-shadow:none!important;
  }
  html.chart-native-landscape body.market-launch-ready #chartWorkspace:fullscreen .landscape-hud::before,
  html.chart-native-landscape body.market-launch-ready #chartWorkspace:-webkit-full-screen .landscape-hud::before{
    content:'DISCIPLY · GRAFICO';
    margin-right:auto!important;
    padding-left:8px!important;
    color:#f5c400!important;
    font-size:9px!important;
    font-weight:850!important;
    letter-spacing:.11em!important;
  }
  html.chart-native-landscape body.market-launch-ready #chartWorkspace:fullscreen .landscape-hud button,
  html.chart-native-landscape body.market-launch-ready #chartWorkspace:-webkit-full-screen .landscape-hud button{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
    border-radius:9px!important;
    color:#aeb9c8!important;
    background:transparent!important;
  }

  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .objects-panel{
    top:calc(var(--kline-landscape-header) + env(safe-area-inset-top) + 6px)!important;
    right:max(6px,env(safe-area-inset-right))!important;
  }
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .drawing-settings:not(.is-hidden){
    top:calc(var(--kline-landscape-header) + env(safe-area-inset-top) + 6px)!important;
    right:max(6px,env(safe-area-inset-right))!important;
  }

  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-topbar,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-workspace-header,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .workspace-commandbar,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-bottom-nav{display:none!important}
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-main{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:#060a0f!important;
  }
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .chart-card{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:#060a0f!important;
  }
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .chart-workspace{
    position:absolute!important;
    inset:0!important;
    display:grid!important;
    grid-template-columns:calc(var(--kline-landscape-tools) + env(safe-area-inset-left)) minmax(0,1fr)!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    background:#060a0f!important;
  }
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .drawing-toolbar.quick-toolbar{
    position:relative!important;
    inset:auto!important;
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    height:100%!important;
    min-height:0!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:3px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:max(6px,env(safe-area-inset-top)) 6px max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left))!important;
    border:0!important;
    border-right:1px solid rgba(255,255,255,.075)!important;
    border-radius:0!important;
    background:#070b11!important;
    scrollbar-width:none!important;
  }
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .drawing-toolbar.quick-toolbar::-webkit-scrollbar{display:none!important}
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .drawing-toolbar.quick-toolbar button{
    flex:0 0 44px!important;
    width:100%!important;
    min-width:44px!important;
    min-height:44px!important;
    border-radius:11px!important;
  }
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .drawing-toolbar.quick-toolbar button>span:last-child:not(.quick-glyph){display:none!important}
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .drawing-toolbar.quick-toolbar .quick-glyph{
    display:grid!important;
    min-width:24px!important;
    min-height:24px!important;
    font-size:17px!important;
  }
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .chart-stage{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    overflow:hidden!important;
    background:#060a0f!important;
  }
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .chart-mount{
    position:absolute!important;
    top:calc(var(--kline-landscape-header) + env(safe-area-inset-top))!important;
    right:env(safe-area-inset-right)!important;
    bottom:0!important;
    left:0!important;
    width:auto!important;
    height:auto!important;
  }
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .chart-watermark,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .chart-statusbar{display:none!important}
}

@media (max-width:760px) and (max-height:430px) and (orientation:landscape){
  :root{--kline-landscape-header:46px;--kline-landscape-tools:58px}
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .mobile-chart-action-rail{
    grid-template-columns:repeat(6,38px)!important;
    padding:3px 4px!important;
  }
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail button,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .mobile-chart-action-rail button{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
  }
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .drawing-toolbar button,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .drawing-toolbar.quick-toolbar button{
    flex-basis:42px!important;
    min-height:42px!important;
  }
}

/* Landscape correction: the action bar is a real header, not a floating card.
   The chart/price scale begins below it and the active fullscreen toggle reads as close. */
@media (max-width:1023px) and (orientation:landscape){
  html.chart-native-landscape body.market-launch-ready .chart-workspace.is-native-landscape .chart-stage::before,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .market-shell .chart-stage::before{
    content:'';
    position:absolute;
    z-index:12010;
    top:0;
    right:0;
    left:0;
    height:calc(var(--kline-landscape-header) + env(safe-area-inset-top));
    pointer-events:none;
    background:#070b11;
    border-bottom:1px solid rgba(255,255,255,.075);
  }

  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail,
  html.market-chart-active:not(.chart-native-landscape) body.market-launch-ready .mobile-chart-action-rail{
    top:0!important;
    right:env(safe-area-inset-right)!important;
    left:calc(var(--kline-landscape-tools) + env(safe-area-inset-left))!important;
    height:calc(var(--kline-landscape-header) + env(safe-area-inset-top))!important;
    min-height:calc(var(--kline-landscape-header) + env(safe-area-inset-top))!important;
    padding-top:env(safe-area-inset-top)!important;
    border:0!important;
    border-radius:0!important;
    background:#070b11!important;
    box-shadow:none!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }

  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail [data-mobile-chart-action="rotate"]{
    position:relative!important;
  }
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail [data-mobile-chart-action="rotate"] svg{
    display:none!important;
  }
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail [data-mobile-chart-action="rotate"]::before{
    content:'×';
    display:block;
    font-size:30px;
    line-height:1;
    font-weight:300;
    color:#d8dee7;
    transform:translateY(-1px);
  }
  html.chart-native-landscape body.market-launch-ready .mobile-chart-action-rail [data-mobile-chart-action="rotate"]:active::before{
    color:#fff;
  }
}