.query-interactions-ready { --query-action: #1263dc; --query-focus: #78adf8; }
.query-interactions-ready .query-history-open + .history-row-details > summary { display: none; }
.query-history-open, .query-history-close { font: inherit; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.query-history-open { width: 100%; min-height: 48px; padding: 12px 0; border: 0; border-top: 1px solid #e4ebf4; border-radius: 0; background: transparent; color: var(--query-action); font-size: 14px; font-weight: 650; text-align: left; }
.query-history-open::after { content: '\2192'; float: right; margin-left: 8px; }
.query-history-open:focus-visible, .query-history-close:focus-visible, .query-segment-track button:focus-visible { outline: 3px solid var(--query-focus); outline-offset: -3px; border-radius: 10px; }
.query-history-open, .query-history-close, .query-segment-track button, .query-interactions-ready .subject-group-trigger { transition: transform 130ms ease, background-color 150ms ease; }
.query-history-open:active, .query-history-close:active, .query-segment-track button:active, .query-interactions-ready .subject-group-trigger:active { transform: scale(.97); }
.query-history-open:hover { color: #064baf; background: #f7faff; }
.query-history-open:disabled { color: #7b8ba0; background: transparent; cursor: wait; transform: none; }
.query-history-desktop { display: none; }

.query-filter-summary { min-width: 0; margin: 0 0 10px; padding: 12px 14px; border: 1px solid #dee7f3; border-radius: 14px; background: #f7faff; }
.query-filter-summary__scope { margin: 0 0 10px; color: #536b8a; font-size: 12px; line-height: 1.5; }
.query-filter-summary__values { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px 12px; }
.query-filter-summary__values > div { min-width: 0; }
.query-filter-summary__values span { display: block; color: #64768b; font-size: 12px; line-height: 1.5; }
.query-filter-summary__values strong { display: block; margin-top: 4px; color: #173858; font-size: 18px; font-weight: 700; line-height: 1.5; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.query-filter-summary__note { display: block; margin-top: 8px; color: #6a798d; font-size: 11px; line-height: 1.6; }
.query-interactions-ready .trend-stage .section-headline > p { min-width: 0; max-width: min(100%,360px); font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
/* Desktop keeps its existing real-data table, without a duplicate card list. */
@media (min-width: 769px) {
  .query-interactions-ready .history-mobile-list { display: block; margin-top: 14px; }
  .query-interactions-ready .history-mobile-list > :not(.query-filter-summary):not(.history-retry):not(.query-history-desktop):not([data-query-inline-open='true']) { display: none; }
  .query-interactions-ready .history-mobile-list > .history-school-card[data-query-inline-open='true'] { display: block; padding: 12px 16px; border: 1px solid #dee7f3; border-radius: 14px; margin-bottom: 14px; }
  .query-history-desktop { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 0 0 14px; }
  .query-history-desktop label { color: #586b84; font-size: 13px; }
  .query-history-desktop select { min-width: 0; flex: 1 1 260px; max-width: 520px; min-height: 44px; border: 1px solid #d7e2f0; border-radius: 10px; padding: 8px 12px; color: #253d5e; background: #fff; font: inherit; font-size: 14px; }
  .query-history-desktop select:focus-visible { outline: 3px solid var(--query-focus); outline-offset: 2px; }
  .query-history-open--desktop { flex: none; width: auto; min-height: 44px; padding: 10px 14px; border: 1px solid #cadcf4; border-radius: 10px; background: #f7faff; }
  .query-interactions-ready .history-mobile-list--loading { display: none; }
  .query-filter-summary__values { max-width: 720px; }
}

/* Pseudo-element avoids inserting unmanaged children into Vue's control tracks. */
.query-interactions-ready .query-segment-track { position: relative; isolation: isolate; }
.query-segment-track::before { content: ''; position: absolute; z-index: -1; top: 0; left: 0; width: var(--query-tab-width,0); height: var(--query-tab-height,0); transform: translate(var(--query-tab-x,0),var(--query-tab-y,0)); border-radius: 999px; background: #e6f0ff; box-shadow: inset 0 0 0 1px #bed5f7; pointer-events: none; transition: transform 230ms cubic-bezier(.2,.8,.2,1), width 230ms ease, height 230ms ease; }
.query-interactions-ready .query-segment-track > button { position: relative; background: transparent; }
.query-interactions-ready .query-segment-track > button.active { color: #0b56bc; background: transparent; box-shadow: none; }

.query-history-dialog { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: min(620px,calc(100% - 40px)); height: fit-content; max-height: min(84vh,860px); max-height: min(84dvh,860px); margin: auto; padding: 0; border: 1px solid #dbe5f2; border-radius: 24px; background: #fbfdff; color: #17243a; box-shadow: 0 28px 80px #152b5240; overflow: hidden; font-family: inherit; }
.query-history-dialog[open] { display: flex; flex-direction: column; }
.query-history-dialog:not([open]) { display: none; }
.query-history-dialog::backdrop { background: rgb(14 30 54 / .42); }
.query-history-dialog[data-phase='closing'] { pointer-events: none; }
.query-history-dialog__head { flex: none; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 20px 22px 16px; border-bottom: 1px solid #e3ebf5; }
.query-history-dialog__head > div { min-width: 0; }
.query-history-dialog__head p { margin: 0 0 6px; color: #667990; font-size: 12px; line-height: 1.5; }
.query-history-dialog__head h2 { margin: 0; color: #17243a; font-size: 21px; line-height: 1.45; overflow-wrap: anywhere; }
.query-history-close { min-width: 60px; min-height: 44px; flex: none; padding: 8px 12px; border: 1px solid #d8e4f3; border-radius: 12px; color: #275284; background: #eef5ff; font-size: 14px; }
.query-history-dialog__body { min-height: 0; padding: 4px 22px 20px; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.query-history-dialog .history-detail-content { border: 0; padding: 0; }
.query-history-dialog .history-detail-year { padding: 17px 0; }
.query-history-dialog .history-detail-year + .history-detail-year { border-top: 1px dashed #dbe5f0; }
.query-history-dialog .history-detail-year__head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; color: #61758f; font-size: 13px; }
.query-history-dialog .history-detail-year__head strong { color: #263c59; font-size: 16px; }
.query-history-dialog .history-full-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; margin: 12px 0 4px; color: #63778f; font-size: 13px; }
.query-history-dialog .history-full-line code { color: #164e92; font-family: inherit; font-size: 18px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.query-history-dialog .history-detail-content a { display: inline-flex; align-items: center; min-height: 44px; color: #205aa5; font-size: 13px; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.query-history-dialog .history-source-note, .query-history-dialog .history-empty-note { margin: 10px 0; color: #66788e; font-size: 12px; line-height: 1.8; }
.query-history-dialog .history-source-note { border-top: 1px solid #e3ebf4; padding-top: 14px; }
@media (max-width: 768px) {
  .query-interactions-ready .trend-stage .section-headline > p { font-size: 13px; }
  .query-history-dialog { position: fixed; top: auto; bottom: 0; left: 0; right: 0; width: 100%; max-width: 100%; max-height: 88vh; max-height: 88dvh; margin: 0; border-radius: 24px 24px 0 0; border-bottom: 0; box-sizing: border-box; }
  .query-history-dialog__head { padding: 18px 18px 14px; }
  .query-history-dialog__head h2 { font-size: 19px; }
  .query-history-dialog__body { padding: 0 18px calc(18px + env(safe-area-inset-bottom,0px)); }
}
@media (prefers-reduced-motion: reduce) {
  .query-segment-track::before, .query-segment-track button, .query-history-open, .query-history-close, .query-interactions-ready .subject-group-trigger { transition: none; }
  .query-history-open:active, .query-history-close:active, .query-segment-track button:active, .query-interactions-ready .subject-group-trigger:active { transform: none; }
}