/* Conferences ----------------------------------------------------------- */

.page-head{margin-top:clamp(10px,2.5vh,26px)}

.stop-label{
  position:fixed;left:0;top:0;z-index:5;
  text-align:center;text-decoration:none;
  opacity:0;transition:opacity .8s;
}
.stop-label.is-ready{opacity:.8}
.stop-label.is-ready.is-active{opacity:1}
.stop-name{
  display:inline-block;padding:3px 9px;border-radius:7px;
  background:rgba(4,6,14,.55);
  font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;
  color:var(--star);white-space:nowrap;
  text-shadow:0 0 18px rgba(4,6,14,1),0 2px 12px rgba(2,4,10,1);
  transition:color .35s;
}
.stop-date{
  display:block;margin-top:2px;
  font-size:8.5px;letter-spacing:.24em;text-transform:uppercase;
  color:rgba(234,242,255,.45);white-space:nowrap;
  text-shadow:0 2px 10px rgba(2,4,10,1);
}
.stop-label.is-active .stop-name{color:var(--gold)}

.panel{
  position:fixed;z-index:12;display:flex;flex-direction:column;
  top:clamp(76px,12vh,110px);right:var(--pad);bottom:clamp(28px,6vh,54px);
  width:min(420px,90vw);
  padding:26px 6px 22px 26px;border-radius:16px;
  background:var(--panel-strong);border:1px solid rgba(159,210,239,.2);
  backdrop-filter:blur(12px);
  box-shadow:0 12px 60px rgba(2,4,10,.7),0 0 46px rgba(159,210,239,.06);
  opacity:0;transform:translateX(14px);pointer-events:none;
  transition:opacity .45s ease,transform .45s ease;
}
.panel.is-open{opacity:1;transform:translateX(0);pointer-events:auto}
.panel .scroll-pane{flex:1;padding-right:20px}

.panel-name{
  font-family:var(--serif);font-style:italic;font-weight:600;
  font-size:24px;line-height:1.2;color:var(--star);margin-bottom:5px;
}
.panel-meta{
  font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;
  color:rgba(234,242,255,.45);margin-bottom:18px;
}

.talk{padding:16px 0;border-top:1px solid rgba(159,210,239,.12)}
.talk:first-child{border-top:none;padding-top:2px}
.talk-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:9px}
.chip{
  font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  padding:4px 10px;border-radius:999px;border:1px solid;
}
.chip--speaker{color:var(--gold);border-color:rgba(245,201,123,.45)}
.chip--cospeaker{color:var(--cyan);border-color:rgba(159,210,239,.45)}
.chip--talk{color:rgba(234,242,255,.6);border-color:rgba(234,242,255,.22)}
.chip--lightning{color:var(--violet);border-color:rgba(201,171,247,.5)}
.chip--tutorial{color:var(--teal);border-color:rgba(143,224,206,.5)}
.chip--organizer{color:#f5a16b;border-color:rgba(245,161,107,.55)}
.talk-with{
  font-family:var(--serif);font-style:italic;font-size:12.5px;
  color:rgba(234,242,255,.55);
}
.talk-title{
  font-size:14px;font-weight:500;line-height:1.4;color:var(--star);margin-bottom:8px;
}
.talk-abstract{
  font-size:11.5px;font-weight:300;line-height:1.65;color:var(--dim);margin-bottom:12px;
}
.talk-links{display:flex;flex-wrap:wrap;gap:7px}
.talk-pending{
  font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(234,242,255,.35);
}

@media (max-width:900px){
  .panel{
    top:auto;right:auto;left:50%;bottom:20px;
    width:92vw;height:42vh;padding:20px 4px 16px 20px;
    transform:translateX(-50%) translateY(14px);
  }
  .panel.is-open{transform:translateX(-50%) translateY(0)}
  .stop-name{font-size:9.5px;letter-spacing:.12em}
  .stop-date{font-size:8px}
}

/* Day mode ------------------------------------------------------------- */
[data-theme="light"] .stop-name{
  background:rgba(255,255,255,.78);color:var(--star);
  text-shadow:0 1px 8px rgba(255,255,255,.9);
}
[data-theme="light"] .stop-date{color:rgba(18,53,75,.6);text-shadow:none}
[data-theme="light"] .panel{
  border-color:rgba(42,126,166,.22);
  box-shadow:0 14px 50px rgba(18,53,75,.18);
}
[data-theme="light"] .talk{border-top-color:rgba(18,53,75,.12)}
[data-theme="light"] .panel-meta{color:rgba(18,53,75,.6)}
[data-theme="light"] .talk-with{color:rgba(18,53,75,.62)}
[data-theme="light"] .talk-abstract{color:rgba(18,53,75,.78)}
[data-theme="light"] .talk-title{color:var(--star)}
[data-theme="light"] .talk-pending{color:rgba(18,53,75,.5)}
[data-theme="light"] .chip--talk{color:rgba(18,53,75,.6);border-color:rgba(18,53,75,.24)}
