/* 1.0.80 – Recently Played Premium Broadcast Timeline */
.history-section{padding-top:clamp(28px,4vw,54px)}
.history-archive{--history-sticky-top:96px;position:relative}
.history-tabs-placeholder{display:none;height:0}
.history-day-select{display:none}

.history-tabs-shell{
  position:sticky;top:var(--history-sticky-top);z-index:60;width:100%;margin:0 0 32px;padding:7px;
  border:1px solid rgba(8,13,24,.08);border-radius:17px;background:rgba(249,250,252,.94);
  box-shadow:0 13px 38px rgba(9,14,28,.075);backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15)
}
.history-tabs-shell .history-tabs{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;width:100%}
.history-tab{
  position:relative;display:grid;grid-template-columns:1fr auto;grid-template-areas:"day count" "date count";align-items:center;
  min-width:0;min-height:58px;padding:9px 11px;border:1px solid transparent;border-radius:12px;background:transparent;
  color:var(--ink);text-align:left;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease,color .18s ease
}
.history-tab:hover{background:#fff;border-color:rgba(9,14,28,.08);transform:translateY(-1px)}
.history-tab span{grid-area:day;display:block;font-size:.72rem;font-weight:900;letter-spacing:.08em}
.history-tab small{grid-area:date;display:block;margin-top:3px;font-size:.64rem;font-weight:700;color:var(--muted)}
.history-tab em{
  grid-area:count;display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:999px;
  background:rgba(7,15,30,.055);font-size:.62rem;font-style:normal;font-weight:850;color:var(--muted)
}
.history-tab.active{border-color:rgba(0,89,231,.14);background:#fff;box-shadow:0 5px 16px rgba(9,14,28,.055)}
.history-tab.active:before{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--pink),var(--blue))}
.history-tab.active span{color:var(--blue)}
.history-tab.active em{background:rgba(0,89,231,.09);color:var(--blue)}
.history-tab.is-today:not(.active) span{color:var(--pink)}
.history-tab:focus-visible{outline:3px solid rgba(0,89,231,.2);outline-offset:2px}
.history-tabs-shell.is-fixed{position:fixed;top:var(--history-sticky-top);margin:0}
.history-tabs-placeholder.is-active{display:block}

.history-panel[hidden]{display:none!important}
.history-day-header{
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 24px;padding:0 2px 21px;
  border-bottom:1px solid rgba(9,14,28,.085)
}
.history-day-header small{display:block;margin-bottom:5px;font-size:.62rem;font-weight:900;letter-spacing:.145em;color:var(--blue)}
.history-day-header h2{margin:0;font-size:clamp(1.45rem,2.5vw,2.15rem);letter-spacing:-.035em;line-height:1}
.history-day-header h2 span{font-size:.72em;font-weight:650;color:var(--muted)}
.history-day-stats{display:flex;align-items:center;gap:8px}
.history-day-stats>span{
  display:inline-flex;align-items:center;gap:5px;padding:7px 10px;border:1px solid rgba(9,14,28,.075);border-radius:999px;
  background:#fff;font-size:.65rem;font-weight:800;color:var(--muted)
}
.history-day-stats strong{font-size:.78rem;color:var(--ink)}
.history-live-status{color:var(--pink)!important;border-color:rgba(230,1,85,.16)!important;background:rgba(230,1,85,.045)!important}
.history-live-status i,.history-meta small i{width:6px;height:6px;border-radius:50%;background:var(--pink);box-shadow:0 0 0 4px rgba(230,1,85,.1);animation:historyPulse 1.7s ease-out infinite}
@keyframes historyPulse{0%{box-shadow:0 0 0 0 rgba(230,1,85,.25)}70%{box-shadow:0 0 0 7px rgba(230,1,85,0)}100%{box-shadow:0 0 0 0 rgba(230,1,85,0)}}

.history-timeline{position:relative;max-width:1040px;margin:0 auto}
.history-time-segment{
  display:grid;grid-template-columns:76px 1fr;align-items:center;gap:19px;margin:28px 0 10px;color:var(--muted)
}
.history-time-segment:first-child{margin-top:0}
.history-time-segment span{font-size:.57rem;font-weight:950;letter-spacing:.16em;text-align:right}
.history-time-segment i{height:1px;background:linear-gradient(90deg,rgba(8,15,28,.16),rgba(8,15,28,.025))}

.history-track{
  position:relative;display:grid;grid-template-columns:76px 18px 74px minmax(0,1fr) auto;align-items:center;gap:14px;
  min-height:92px;padding:8px 11px 8px 0;border-radius:16px;transition:background .2s ease,transform .2s ease,box-shadow .2s ease
}
.history-track:hover{background:#fff;transform:translateX(2px);box-shadow:0 10px 28px rgba(9,14,28,.055)}
.history-track>time{font-size:.79rem;font-weight:850;text-align:right;color:#6b7280;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.history-track-line{position:relative;align-self:stretch;display:grid;place-items:center}
.history-track-line:before{content:"";position:absolute;top:-8px;bottom:-8px;left:50%;width:1px;background:rgba(9,14,28,.09);transform:translateX(-50%)}
.history-track-line i{position:relative;z-index:1;width:7px;height:7px;border:2px solid #fff;border-radius:50%;background:#9ca3af;box-shadow:0 0 0 1px rgba(9,14,28,.12)}
.history-cover{position:relative;width:74px;height:74px;border-radius:13px;overflow:hidden;background:#eef1f6;box-shadow:0 6px 18px rgba(8,15,28,.09)}
.history-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.history-track:hover .history-cover img{transform:scale(1.035)}
.history-cover-live{position:absolute;left:6px;bottom:6px;padding:4px 6px;border-radius:999px;background:rgba(7,10,18,.86);color:#fff;font-size:.48rem;font-weight:950;letter-spacing:.1em}
.history-meta{min-width:0}
.history-meta strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(.94rem,1.35vw,1.08rem);font-weight:850;letter-spacing:-.018em;color:var(--ink)}
.history-meta>span{display:block;margin-top:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.76rem;font-weight:650;color:var(--muted)}
.history-meta small{display:flex;align-items:center;gap:7px;margin-top:8px;font-size:.61rem;font-weight:850;color:var(--pink)}
.history-track-time-mobile{display:none}
.history-track.is-on-air{background:linear-gradient(90deg,rgba(230,1,85,.045),rgba(0,89,231,.028));box-shadow:inset 3px 0 0 var(--pink)}
.history-track.is-on-air .history-track-line i{background:var(--pink);box-shadow:0 0 0 4px rgba(230,1,85,.1)}
.history-track.is-on-air>time{color:var(--pink)}

.history-empty{
  display:grid;place-items:center;min-height:220px;padding:40px;border:1px dashed rgba(9,14,28,.13);border-radius:18px;
  background:rgba(247,248,251,.55);text-align:center
}
.history-empty span{font-size:.58rem;font-weight:950;letter-spacing:.14em;color:var(--blue)}
.history-empty strong{margin-top:7px;font-size:.92rem;color:var(--muted)}

@media(max-width:900px) and (min-width:681px){
  .history-archive{--history-sticky-top:84px}
  .history-tabs-shell{padding:6px}
  .history-tab{min-height:54px;padding:8px}
  .history-tab span{font-size:.63rem}
  .history-tab small{font-size:.58rem}
  .history-tab em{min-width:21px;height:21px;font-size:.55rem}
  .history-track{grid-template-columns:62px 16px 68px minmax(0,1fr) auto;gap:11px}
  .history-cover{width:68px;height:68px}
  .history-time-segment{grid-template-columns:62px 1fr;gap:16px}
}
@media(max-width:680px){
  .history-section{padding-top:20px}
  .history-tabs-shell,.history-tabs-placeholder{display:none!important}
  .history-day-select{display:block}
  .history-day-select{
    position:sticky;top:76px;z-index:60;margin:0 0 22px;padding:8px;border:1px solid rgba(9,14,28,.08);
    border-radius:15px;background:rgba(249,250,252,.97);box-shadow:0 11px 28px rgba(9,14,28,.085);backdrop-filter:blur(16px)
  }
  .history-day-select label{display:block;margin:0 0 5px 4px;font-size:.56rem;font-weight:900;letter-spacing:.12em;color:var(--muted)}
  .history-day-select select{
    width:100%;min-height:48px;padding:0 42px 0 12px;border:1px solid rgba(9,14,28,.08);border-radius:11px;background:#fff;
    color:var(--ink);font-size:.8rem;font-weight:800
  }
  .history-day-header{align-items:center;margin-bottom:14px;padding-bottom:14px}
  .history-day-header h2{font-size:1.25rem}
  .history-day-header h2 span{display:block;margin-top:4px;font-size:.62rem}
  .history-day-stats>span:first-child{display:none}
  .history-track{
    grid-template-columns:54px 58px minmax(0,1fr);gap:11px;min-height:75px;margin:0;padding:8px 4px;border-radius:12px
  }
  .history-track:hover{transform:none;box-shadow:none}
  .history-track>time,.history-track-line{display:none}
  .history-cover{grid-column:1;width:54px;height:54px;border-radius:10px}
  .history-meta{grid-column:2/4;grid-row:1}
  .history-meta strong{padding-right:42px;font-size:.88rem}
  .history-meta>span{margin-top:3px;font-size:.69rem}
  .history-meta small{margin-top:5px;font-size:.57rem}
  .history-track-time-mobile{display:block;position:absolute;right:5px;top:12px;font-size:.64rem;font-weight:850;color:var(--muted);font-variant-numeric:tabular-nums}
  .history-track.is-on-air{box-shadow:inset 2px 0 0 var(--pink)}
  .history-time-segment{grid-template-columns:auto 1fr;gap:10px;margin:21px 0 7px}
  .history-time-segment span{text-align:left;font-size:.53rem}
  .history-cover-live{left:4px;bottom:4px;font-size:.42rem;padding:3px 5px}
}
@media(prefers-reduced-motion:reduce){
  .history-tab,.history-track,.history-cover img{transition:none}
  .history-live-status i,.history-meta small i{animation:none}
}

/* 1.0.81 – modern broadcast day navigator */
.history-tabs-shell{
  padding:6px;
  border:1px solid rgba(9,14,28,.07);
  border-radius:20px;
  background:rgba(248,250,253,.9);
  box-shadow:0 12px 34px rgba(9,14,28,.07);
}
.history-tabs-shell .history-tabs{
  gap:4px;
}
.history-tab{
  min-height:64px;
  padding:10px 12px;
  border-radius:15px;
  background:transparent;
  border-color:transparent;
  box-shadow:none;
}
.history-tab:hover{
  transform:none;
  background:rgba(255,255,255,.8);
  border-color:rgba(9,14,28,.055);
  box-shadow:none;
}
.history-tab span{
  font-size:.68rem;
  letter-spacing:.11em;
}
.history-tab small{
  margin-top:4px;
  font-size:.62rem;
  color:rgba(72,81,98,.68);
}
.history-tab em{
  min-width:26px;
  height:26px;
  padding:0 7px;
  background:rgba(9,14,28,.05);
  color:rgba(72,81,98,.78);
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.history-tab.active{
  background:#fff;
  border-color:rgba(0,89,231,.10);
  box-shadow:0 8px 24px rgba(9,14,28,.065);
}
.history-tab.active:before{
  left:14px;
  right:14px;
  bottom:5px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--pink),var(--blue));
}
.history-tab.active:after{
  content:"";
  position:absolute;
  top:8px;
  right:8px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--blue);
  box-shadow:0 0 0 4px rgba(0,89,231,.08);
}
.history-tab.active span{
  color:var(--ink);
}
.history-tab.active small{
  color:var(--blue);
}
.history-tab.active em{
  background:linear-gradient(135deg,rgba(230,1,85,.10),rgba(0,89,231,.10));
  color:var(--blue);
}
.history-tab.is-today:not(.active){
  background:linear-gradient(180deg,rgba(230,1,85,.035),rgba(255,255,255,0));
}
.history-tab.is-today:not(.active) span{
  color:var(--pink);
}
.history-tab.is-today:not(.active):after{
  content:"LIVE DAY";
  position:absolute;
  left:12px;
  bottom:7px;
  font-size:.44rem;
  font-weight:900;
  letter-spacing:.12em;
  color:rgba(230,1,85,.72);
}
.history-tabs-shell.is-fixed{
  border-radius:18px;
  box-shadow:0 14px 36px rgba(9,14,28,.095);
}
@media(max-width:900px) and (min-width:681px){
  .history-tab{
    min-height:58px;
    padding:9px 8px;
  }
  .history-tab span{font-size:.61rem}
  .history-tab small{font-size:.56rem}
  .history-tab em{min-width:22px;height:22px;font-size:.53rem}
  .history-tab.active:after{width:4px;height:4px;top:7px;right:7px}
  .history-tab.is-today:not(.active):after{display:none}
}

/* 1.0.82 – stronger broadcast day navigator */
.history-tabs-shell{
  padding:8px;
  border-radius:22px;
  border-color:rgba(9,14,28,.09);
  background:rgba(246,248,252,.96);
  box-shadow:0 16px 42px rgba(9,14,28,.095);
}
.history-tabs-shell .history-tabs{
  gap:6px;
}
.history-tab{
  min-height:72px;
  padding:12px 13px 13px;
  border-radius:16px;
}
.history-tab span{
  font-size:.75rem;
  letter-spacing:.115em;
}
.history-tab small{
  margin-top:5px;
  font-size:.66rem;
  font-weight:750;
}
.history-tab em{
  min-width:29px;
  height:29px;
  font-size:.64rem;
  font-weight:900;
}
.history-tab:hover{
  background:#fff;
  border-color:rgba(9,14,28,.075);
  box-shadow:0 8px 22px rgba(9,14,28,.055);
}
.history-tab.active{
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(135deg,rgba(230,1,85,.42),rgba(0,89,231,.42)) border-box;
  border:1px solid transparent;
  box-shadow:0 12px 30px rgba(9,14,28,.105);
}
.history-tab.active:before{
  left:13px;
  right:13px;
  bottom:7px;
  height:3px;
  background:linear-gradient(90deg,var(--pink) 0%,var(--blue) 100%);
}
.history-tab.active:after{
  width:7px;
  height:7px;
  top:10px;
  right:10px;
  background:var(--pink);
  box-shadow:0 0 0 5px rgba(230,1,85,.09);
}
.history-tab.active span{
  font-size:.78rem;
  color:var(--ink);
}
.history-tab.active small{
  color:var(--blue);
  font-weight:850;
}
.history-tab.active em{
  background:linear-gradient(135deg,var(--pink),var(--blue));
  color:#fff;
  box-shadow:0 4px 12px rgba(0,89,231,.18);
}
.history-tab.is-today:not(.active){
  border-color:rgba(230,1,85,.08);
  background:linear-gradient(180deg,rgba(230,1,85,.055),rgba(255,255,255,.3));
}
.history-tab.is-today:not(.active) span{
  color:var(--pink);
}
.history-tabs-shell.is-fixed{
  padding:7px 8px;
  border-radius:20px;
  background:rgba(247,249,253,.97);
  box-shadow:0 18px 48px rgba(9,14,28,.13);
}
@media(max-width:900px) and (min-width:681px){
  .history-tabs-shell{padding:6px}
  .history-tab{min-height:64px;padding:10px 8px}
  .history-tab span{font-size:.66rem}
  .history-tab small{font-size:.59rem}
  .history-tab em{min-width:24px;height:24px;font-size:.56rem}
  .history-tab.active span{font-size:.69rem}
  .history-tab.active:before{left:9px;right:9px;bottom:6px}
}