/* COINLAB premium tools shared finishing layer */
:root{color-scheme:dark}
html[data-theme="light"]{color-scheme:light}
body{background-image:radial-gradient(circle at 74% -12%,rgba(24,227,218,.07),transparent 32%),linear-gradient(180deg,#03070d 0,#060a12 100%)}
html[data-theme="light"] body{background-image:linear-gradient(180deg,#f7fafc,#edf3f8)}
.panel{box-shadow:0 18px 60px rgba(0,0,0,.2)}
.brand-mark{box-shadow:0 0 26px rgba(37,217,207,.24)}
.topbar{border-bottom-color:rgba(37,217,207,.12)}
.btn,.icon-btn,.theme-btn,.lang-switch button{min-height:38px}
.data-state{padding:14px;border:1px dashed var(--line);border-radius:12px;color:var(--muted);line-height:1.65}
.source-line{font-size:11px;color:var(--muted);line-height:1.6}.source-line a{color:var(--cyan)}
body.analysis .orderbook{display:none!important}
body.analysis .terminal-grid{grid-template-columns:270px minmax(0,1fr)!important}
body.analysis .terminal-chart>svg{z-index:1}
body.analysis .terminal-chart .candles{display:none!important}
body.analysis .cl-real-chart{position:absolute;inset:0;width:100%;height:100%}
body.backtest .backtest-main>section.cl-unverified{display:none!important}
body.backtest .backtest-chart svg{width:100%;height:100%}
.cl-export-ready{border-color:rgba(37,217,207,.45)!important}
@media(max-width:760px){
  .btn,.icon-btn,.theme-btn,.lang-switch button,.cl-menu-button{min-height:44px;min-width:44px}
  body.analysis .terminal-grid{display:block!important}
  body.analysis .chart-toolbar{height:auto;min-height:48px;flex-wrap:wrap;padding:10px 14px}
}

/* Responsive corrections verified at 768 / 390 / 360 CSS px */
.calculator-layout,.form-grid,.result-grid,.terminal-grid,.ticker-strip,.mood-grid{min-width:0}
.calculator-layout>* ,.form-grid>* ,.result-grid>* ,.terminal-grid>* ,.ticker-strip>* ,.mood-grid>*{min-width:0}
.field input,.field select{width:100%;min-width:0;box-sizing:border-box}
@media(max-width:900px){
  .app{display:block!important}
  .sidebar{display:none!important}
  .workspace{grid-column:1!important;width:100%;min-width:0}
  .topbar{height:60px!important;padding:0 14px!important;gap:8px!important}
  .mobile-brand{display:flex!important;align-items:center}
  .page-name{min-width:0!important}
  .global-search,.cl-search-button{display:none!important}
  .top-actions{margin-left:auto!important;min-width:0;max-width:calc(100vw - 62px)}
  .main{padding:18px 14px 34px!important}
  .calculator-layout{grid-template-columns:1fr!important}
  .calculator-card,.calculator-card:last-child{grid-column:auto!important;width:auto!important;min-width:0}
  .calculator-card:last-child .form-grid{grid-template-columns:1fr 1fr!important}
  body.analysis .terminal-grid{display:block!important}
  body.analysis .ticker-strip{grid-template-columns:1fr 1fr!important}
  body.analysis .ticker:nth-child(n+3){display:none!important}
  body.analysis .mood-grid{grid-template-columns:1fr 1fr!important}
  .site-footer{margin-left:0!important}
  .seo-guide{margin:14px!important}
}
@media(max-width:480px){
  .page-name{display:none!important}
  body.analysis #run-analysis{display:none!important}
  body.analysis #analysis-symbol{max-width:88px;padding-inline:8px}
  .calculator-card .form-grid,.calculator-card:last-child .form-grid{grid-template-columns:1fr!important}
  .result-grid{grid-template-columns:1fr 1fr!important}
  .calculator-card{padding:15px!important}
}

@media(max-width:480px){
  html,body{max-width:100%;overflow-x:clip}
}


/* 2026-10-30 mobile device quality pass */
.cl-chart-tabs .tab{border:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer;min-height:40px;padding:0 14px;border-radius:8px}
.cl-chart-tabs .tab.active{color:#061014;background:var(--cyan);border-color:var(--cyan)}
.cl-axis-label{fill:#93a4b8;font-size:12px;font-weight:700}
.cl-chart-grid{stroke:#263545;stroke-width:1}
.cl-chart-line{fill:none;stroke-width:3;vector-effect:non-scaling-stroke}
.cl-chart-point{fill:var(--cyan);stroke:#07101a;stroke-width:2;vector-effect:non-scaling-stroke}
.cl-chart-tooltip{position:absolute;z-index:3;pointer-events:none;transform:translate(-50%,-115%);padding:6px 8px;border:1px solid #34485a;border-radius:7px;background:#07101a;color:#f5fbff;font-size:11px;white-space:nowrap;box-shadow:0 8px 24px #0008}
.backtest-chart{position:relative}
.backtest-chart .data-state{height:100%;display:grid;place-items:center;text-align:center}
[data-bt-export]:disabled{opacity:.5;cursor:not-allowed}

@media(max-width:760px){
  .topbar{height:56px!important;min-height:56px;padding:6px 10px!important;gap:5px!important;flex-wrap:nowrap!important}
  .mobile-brand{flex:0 0 auto}
  .mobile-brand .brand-mark{width:34px!important;height:34px!important}
  .top-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:4px!important;flex:0 0 auto!important;max-width:none!important;white-space:nowrap}
  .display-controls{display:flex!important;gap:4px!important;flex:0 0 auto}
  .theme-btn,.cl-menu-button,.cl-search-button,.lang-switch button,#refresh-market{width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;max-height:44px!important;box-sizing:border-box!important;flex:0 0 44px!important}
  .theme-btn,.cl-menu-button,.lang-switch button{padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
  .lang-switch{width:88px!important;min-width:88px!important;height:44px!important;padding:0!important;gap:0!important;overflow:hidden!important;box-sizing:border-box!important;flex:0 0 88px!important}
  .lang-switch button{border-radius:8px!important;transform:none!important;margin:0!important;box-shadow:none!important}
  .lang-switch button.active{transform:none!important;font-size:10px!important}
  .cl-search-button{display:inline-flex!important;align-items:center!important;justify-content:center!important;margin-left:auto!important;padding:0!important;font-size:0!important;color:var(--text)!important}
  .cl-search-button::before{content:"⌕";font-size:21px;line-height:1}
  #refresh-market{padding:0!important;font-size:0!important;overflow:hidden!important;white-space:nowrap!important}
  #refresh-market::before{content:"↻";font-size:20px;line-height:1}
  #refresh-market:disabled::before{animation:cl-spin .9s linear infinite}
  .cl-chart-tabs{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%;gap:6px}
  .cl-chart-tabs .tab{min-height:44px;width:100%;padding:0 8px}
  body.backtest .panel-head:has(.cl-chart-tabs){align-items:stretch;flex-direction:column}
  body.backtest .backtest-chart{height:250px!important}
  body.backtest .stats-strip .metric{min-height:86px}
}
@media(max-width:480px){
  .topbar{padding-inline:8px!important}
  body.analysis .mobile-brand{display:none!important}
  body.analysis #analysis-symbol{width:72px!important;max-width:72px!important;min-width:72px!important;height:44px!important;padding:0 6px!important}
  .main,.backtest-main{padding-left:12px!important;padding-right:12px!important}
}
@keyframes cl-spin{to{transform:rotate(1turn)}}

@media(max-width:760px){
  body.backtest .hero-row,body.calculators .hero-row{display:flex;flex-direction:column;gap:12px}
  body.backtest .hero-actions,body.calculators .hero-actions{display:flex!important;width:100%;gap:8px}
  body.backtest .hero-actions .btn,body.calculators .hero-actions .btn{min-height:44px;flex:1;white-space:normal}
}
