/* MeloSignal global surface/interaction guard.
   Loaded last on every built page so shared cards never collapse into
   borderless white-on-white lists, and iOS Safari cannot restyle the
   compact scope toggle with its native blue control appearance. */

:root{
  --surface-line:rgba(63,58,78,.15);
  --surface-line-strong:rgba(63,58,78,.22);
  --surface-divider:rgba(63,58,78,.11);
  --surface-shadow:0 18px 44px rgba(70,54,86,.075),0 1px 0 rgba(255,255,255,.92) inset;
}
body[data-market="bl"]{
  --surface-line:rgba(23,96,91,.16);
  --surface-line-strong:rgba(23,96,91,.23);
  --surface-divider:rgba(23,96,91,.12);
}

/* Shared surfaces: ui-v3 historically used a white border on a white card. */
.card{
  border:1px solid var(--surface-line)!important;
  box-shadow:var(--surface-shadow)!important;
  background-clip:padding-box;
}

/* Navigation/control shells need a visible edge even when they are not .card. */
.view-tabs,
.all-tabs,
.compact-segments,
.period-tabs,
.scope-menu>summary,
.catalog-controls,
.cross-select,
.search-box input,
.catalog-search input,
.catalog-search button,
.catalog-controls select{
  border-color:var(--surface-line)!important;
}

/* The home dashboard now has four view tabs. Safari keeps flex items at
   their intrinsic text width unless min-width is explicitly released, so
   the fourth tab (蓄積分析) could be pushed beyond the iPhone viewport.
   Keep all four tabs on one row without changing the surrounding layout. */
@media (max-width:680px){
  .view-tabs{
    gap:3px!important;
    padding:calc(max(8px, env(safe-area-inset-top)) + 4px) 4px 4px!important;
    width:100%;
    max-width:100%;
    overflow:hidden;
  }
  .view-tab{
    flex:1 1 0!important;
    min-width:0!important;
    padding:11px 4px!important;
    white-space:nowrap;
    font-size:12px!important;
    text-align:center;
  }
}
@media (max-width:370px){
  .view-tab{
    padding-left:2px!important;
    padding-right:2px!important;
    font-size:11px!important;
  }
}

/* Shared internal separators that were also white-on-white. */
.summary-compare,
.window-control,
.collapsible-body,
.forecast-list li+li,
.volume-split,
.catalog-table-head,
.catalog-table-row{
  border-color:var(--surface-divider)!important;
}
.catalog-table .catalog-table-row{
  border-bottom:1px solid var(--surface-divider)!important;
}
.catalog-table .catalog-table-row:last-child{
  border-bottom:0!important;
}
.catalog-table-head{
  border-bottom:1px solid var(--surface-line)!important;
}

/* Lists/cards generated dynamically should still read as grouped surfaces. */
.chart-card.card,
.catalog-table.card,
.catalog-controls.card,
.narrative-intro.card,
.longterm-link.card,
.realtime-card.card,
.leadlag-card.card,
.nextwave-card.card,
.cross-group-card.card,
.method-note.card{
  border-color:var(--surface-line)!important;
}

/* iOS Safari: remove the native blue control rectangle from the compact
   category/scope change button. The button has its own MeloSignal text state. */
#allScopeToggle,
#allScopeToggle:link,
#allScopeToggle:visited,
#allScopeToggle:hover,
#allScopeToggle:focus,
#allScopeToggle:focus-visible,
#allScopeToggle:active{
  -webkit-appearance:none!important;
  appearance:none!important;
  -webkit-tap-highlight-color:rgba(0,0,0,0)!important;
  background:none!important;
  background-color:transparent!important;
  background-image:none!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  color:var(--accent-dark)!important;
  filter:none!important;
  text-decoration:none!important;
}
#allScopeToggle::before,
#allScopeToggle::after{
  content:none!important;
  display:none!important;
}

/* Keep keyboard focus visible without reintroducing Safari's native control. */
@media (hover:hover) and (pointer:fine){
  #allScopeToggle:focus-visible{
    text-decoration:underline!important;
    text-underline-offset:3px;
  }
}
