/* Jaisandar 206 · calm interaction system */
:root{
  --jai-motion-fast:160ms;
  --jai-motion:240ms;
  --jai-motion-slow:340ms;
  --jai-ease:cubic-bezier(.2,.75,.25,1);
}
html{scroll-behavior:smooth}
body{--jai-scroll-progress:0%}
.jai-scroll-progress{position:fixed;z-index:99999;top:0;left:0;width:var(--jai-scroll-progress);height:2px;background:#006666;pointer-events:none;transition:width 70ms linear}
.admin-bar .jai-scroll-progress{top:32px}

/* calm card feedback */
.story-card,.market-card,.kase-card,.qazaq-row,.heatmap-tile,.bank-card,.budget-card,.economy-card,.trade-card,[class*="-panel"]{
  transition:transform var(--jai-motion) var(--jai-ease),border-color var(--jai-motion) ease,box-shadow var(--jai-motion) ease,background-color var(--jai-motion-slow) ease,opacity var(--jai-motion) ease;
}
@media (hover:hover) and (pointer:fine){
  .story-card:hover,.market-card:hover,.kase-card:hover,.bank-card:hover,.budget-card:hover,.trade-card:hover{transform:translateY(-2px)}
  .qazaq-row:hover,.heatmap-tile:hover{transform:translateY(-1px)}
}

/* tabs/periods: subtle active-state movement */
.period-button,.market-subtab,.rubric-tab,.article-rubric-link,[data-qazaq-stock-period],[data-qazaq-heatmap-period],[data-qazaq-period],[data-dividend-mode],button[data-period]{
  transition:background-color var(--jai-motion) ease,color var(--jai-motion) ease,border-color var(--jai-motion) ease,box-shadow var(--jai-motion) ease,transform var(--jai-motion-fast) var(--jai-ease);
}
.period-button:active,.market-subtab:active,.rubric-tab:active,[data-qazaq-stock-period]:active,[data-qazaq-heatmap-period]:active{transform:translateY(1px)}

/* smooth data changes without flashing */
[data-equity-price],[data-equity-change],[data-qazaq-stock-change],[data-heatmap-change],[data-qazaq-heatmap-change],[data-bank-value],[data-value]{
  transition:color var(--jai-motion) ease,opacity var(--jai-motion-fast) ease,transform var(--jai-motion-fast) ease;
}
.jai-value-changing{opacity:.45!important;transform:translateY(2px)}

/* heatmaps should recolor calmly */
.heatmap-tile,[data-qazaq-heatmap-tile],.dividend-heatmap-table td,.inflation-heatmap-cell{
  transition:background-color var(--jai-motion-slow) ease,color var(--jai-motion) ease,transform var(--jai-motion) var(--jai-ease),box-shadow var(--jai-motion) ease!important;
}

/* native details/accordions */
details{transition:background-color var(--jai-motion) ease,border-color var(--jai-motion) ease}
details>summary{cursor:pointer;transition:color var(--jai-motion) ease,background-color var(--jai-motion) ease}
details[open]>summary{margin-bottom:8px}
details>*:not(summary){animation:jaiDetailsIn var(--jai-motion-slow) var(--jai-ease) both}
@keyframes jaiDetailsIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}

/* download feedback */
.visual-download-button{transition:transform var(--jai-motion-fast) var(--jai-ease),background-color var(--jai-motion) ease,border-color var(--jai-motion) ease,opacity var(--jai-motion) ease}
.visual-download-button:active{transform:scale(.98)}
.visual-download-button.jai-export-working{cursor:progress;opacity:.78}
.visual-download-button.jai-export-done{box-shadow:0 0 0 3px rgba(0,102,102,.08)}

/* sticky horizontal navigation becomes compact, not flashy */
@media(min-width:781px){
  .article-rubric-nav-shell.jai-nav-stuck,.market-subtabs.jai-nav-stuck,.rubric-tabs.jai-nav-stuck{
    backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  }
}

/* selected filters / chips */
[data-filter].active,[data-filter][aria-pressed="true"],.filter-chip.active,.trade-filter-chip.active,.budget-filter-chip.active{
  transition:background-color var(--jai-motion) ease,color var(--jai-motion) ease,border-color var(--jai-motion) ease,transform var(--jai-motion-fast) var(--jai-ease);
}

/* one-time restrained section reveal */
.jai-reveal{opacity:.86;transform:translateY(7px);transition:opacity 380ms var(--jai-ease),transform 380ms var(--jai-ease)}
.jai-reveal.jai-in{opacity:1;transform:none}

/* tooltips */
[role="tooltip"],.echarts-tooltip,.chart-tooltip,.stock-tooltip{animation:jaiTooltipIn var(--jai-motion-fast) var(--jai-ease) both}
@keyframes jaiTooltipIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

@media(max-width:780px){
  .jai-scroll-progress{height:2px}
  .admin-bar .jai-scroll-progress{top:46px}
  .story-card:hover,.market-card:hover,.kase-card:hover,.bank-card:hover,.budget-card:hover,.trade-card:hover,.qazaq-row:hover,.heatmap-tile:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .jai-reveal{opacity:1!important;transform:none!important}
}