@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;650;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

.sync-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 12px;
  color: var(--muted);
  font-size: 14px;
}
.sync-status p { margin: 0; }
.sync-error { color: #ffd58b; }
.agenda-notice {
  margin: 12px 0 0;
  padding: 12px 16px;
  color: #ffd58b;
  background: #30271c;
  border: 1px solid #665039;
  border-radius: 6px;
  font-size: 14px;
  line-height: 1.5;
}
:root {
  color-scheme:dark;
  --bg:#101114;
  --panel:#191a1f;
  --line:#2b2c33;
  --text:#f4f4f6;
  --muted:#b0b0be;
  --lime:#c2ff64;
  --violet:#baa3ff;
  --hour:225px;
  font-family:'DM Sans',system-ui,sans-serif;
  font-size:16px;
  color:var(--text);
  background:var(--bg);
}

* {
  box-sizing:border-box;
}

[hidden] {
  display:none!important;
}

body {
  margin:0;
}

button,a {
  -webkit-tap-highlight-color:transparent;
}

button {
  font:inherit;
  cursor:pointer;
}

button:disabled {
  cursor:not-allowed;
}

a {
  color:inherit;
  text-decoration:none;
}

button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible {
  outline:3px solid var(--lime);
  outline-offset:4px;
}

button {
  color:inherit;
}

button,a {
  touch-action:manipulation;
}

.site-header {
  height:72px;
  margin:0 48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
}

.brand {
  display:flex;
  gap:12px;
  align-items:center;
  font-family:'Space Grotesk',sans-serif;
  font-size:25px;
  font-weight:700;
  letter-spacing:-1px;
}

.brand-icon {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:10px;
  background:var(--lime);
  color:var(--bg);
  font-size:21px;
  letter-spacing:-2px;
}

.year {
  color:var(--muted);
  font-size:15px;
  letter-spacing:0;
  margin-left:4px;
  font-weight:400;
}

.source-link {
  font-size:14px;
  color:var(--muted);
}

.source-link span {
  margin-left:8px;
}

main {
  padding:28px 48px 105px;
}

.intro {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  margin-bottom:26px;
}

.eyebrow {
  font-size:12px;
  letter-spacing:2px;
  font-weight:600;
  color:var(--muted);
  margin:0 0 14px;
}

h1 {
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(30px,3.3vw,48px);
  letter-spacing:-2px;
  line-height:1.15;
  margin:0;
  font-weight:500;
}

h1 span {
  color:var(--violet);
}

.mobile-break {
  display:none;
}

.intro-copy {
  color:var(--muted);
  margin:13px 0 0;
  font-size:16px;
}

.export-button {
  border:0;
  background:var(--lime);
  color:#15180f;
  padding:14px 18px;
  border-radius:8px;
  font-size:15px;
  font-weight:700;
  display:flex;
  align-items:center;
  gap:12px;
  white-space:nowrap;
}

.export-button>span:first-child {
  font-size:23px;
  line-height:1;
}

.export-button:disabled {
  background:#292c25;
  color:#a7b096;
}

.export-count {
  padding:2px 7px;
  border-radius:4px;
  background:#1112;
  font-size:12px;
}

.planner-toolbar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid var(--line);
  gap:16px;
}

.day-tabs {
  display:flex;
  gap:34px;
}

.day-tab {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:7px;
  background:none;
  border:0;
  border-bottom:3px solid transparent;
  padding:0 0 20px;
  color:var(--muted);
}

.day-tab span {
  font-size:12px;
  letter-spacing:1px;
  text-transform:uppercase;
}

.day-tab strong {
  font-family:'Space Grotesk',sans-serif;
  font-size:20px;
  font-weight:500;
}

.day-tab.active {
  color:var(--text);
  border-bottom-color:var(--violet);
}

.day-tab.active span {
  color:var(--violet);
}

.view-tabs {
  display:flex;
  background:#08090b;
  padding:5px;
  border-radius:9px;
  gap:4px;
  margin-bottom:13px;
}

.view-tabs button {
  border:0;
  padding:10px 15px;
  background:none;
  color:var(--muted);
  border-radius:6px;
  font-size:14px;
  font-weight:500;
  white-space:nowrap;
}

.view-tabs button.active {
  background:#2b2c34;
  color:var(--text);
  box-shadow:0 1px 4px #0004;
}

#selected-count {
  margin-left:6px;
  font-size:12px;
  color:var(--violet);
}

.agenda-meta {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  padding:19px 0;
  font-size:14px;
  color:var(--muted);
}

.schedule-scroll {
  overflow:auto;
  max-height:72vh;
  border:1px solid var(--line);
  border-radius:10px;
  background:#131419;
  scrollbar-color:#50515f #15161b;
  scrollbar-width:thin;
}

.schedule {
  display:grid;
  grid-template-columns:65px repeat(var(--stage-count),minmax(222px,1fr));
  min-width:calc(65px + var(--stage-count)*222px);
  position:relative;
}

.stage-heading {
  padding:19px 14px;
  position:sticky;
  top:0;
  z-index:4;
  background:#191a20;
  border-bottom:1px solid var(--line);
  border-right:1px solid var(--line);
  min-height:85px;
  display:flex;
  flex-direction:column;
  gap:5px;
}

.stage-heading strong {
  font-size:15px;
  font-weight:600;
}

.stage-heading small {
  font-size:12px;
  color:var(--muted);
  line-height:1.3;
}

.time-heading {
  left:0;
  z-index:6;
  color:var(--muted);
  font-size:12px;
  padding:21px 8px;
  justify-content:center;
  text-align:center;
}

.time-rail {
  position:sticky;
  left:0;
  z-index:3;
  background:#16171c;
  border-right:1px solid var(--line);
}

.time-label {
  position:absolute;
  right:12px;
  transform:translateY(-50%);
  font-size:12px;
  font-variant-numeric:tabular-nums;
  color:var(--muted);
}

.stage-lane {
  position:relative;
  border-right:1px solid var(--line);
  background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--hour) - 1px),#292a30 calc(var(--hour) - 1px),#292a30 var(--hour));
}

.talk {
  position:absolute;
  left:7px;
  right:7px;
  display:flex;
  flex-direction:column;
  gap:9px;
  padding:13px 12px 10px;
  background:var(--panel);
  border:1px solid #34343d;
  border-left:3px solid var(--track-color,var(--violet));
  border-radius:6px;
  overflow:hidden;
  transition:background .15s,border-color .15s;
}

.talk:hover {
  background:#24252e;
}

.talk.is-selected {
  background:#252d20;
  border-color:#728e48;
  border-left-color:var(--lime);
}

.talk-meta {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:4px;
  color:var(--muted);
  font-size:12px;
  font-variant-numeric:tabular-nums;
}

.select-talk {
  flex-shrink:0;
  min-width:28px;
  min-height:28px;
  background:#24252c;
  border:1px solid #585965;
  border-radius:5px;
  font-size:19px;
  line-height:1;
  color:#dadbe4;
  display:grid;
  place-items:center;
}

.select-talk[aria-pressed=true] {
  color:#14180e;
  background:var(--lime);
  border-color:var(--lime);
}

.talk-title {
  background:none;
  border:0;
  padding:0;
  text-align:left;
  font-size:15px;
  font-weight:650;
  line-height:1.35;
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.talk-speakers {
  font-size:13px;
  color:var(--muted);
  line-height:1.45;
  margin:0;
}

.track-tag {
  font-size:12px;
  color:color-mix(in srgb,var(--track-color,var(--violet)) 65%,white);
  margin-top:auto;
}

.talk.compact {
  padding:3px 10px;
  gap:2px;
}

.talk.compact .talk-meta {
  font-size:12px;
}

.talk.compact .select-talk {
  min-height:24px;
  min-width:24px;
}

.talk.compact .talk-title {
  line-height:1.2;
  -webkit-line-clamp:1;
  font-size:14px;
}

.talk.compact .talk-speakers,.talk.compact .track-tag {
  display:none;
}

.talk.short .talk-title {
  -webkit-line-clamp:2;
}

.talk.short .track-tag {
  display:none;
}

.break-block {
  position:absolute;
  left:10px;
  right:10px;
  border-top:1px dashed #3b3c47;
  color:#9b9ba9;
  display:flex;
  align-items:flex-start;
  padding-top:13px;
  font-size:12px;
  line-height:1.6;
}

.planner-footer {
  display:flex;
  justify-content:space-between;
  gap:20px;
  color:#999aa8;
  font-size:12px;
}

.planner-footer p {
  margin-top:17px;
}

.selection-bar {
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  padding:18px 48px;
  background:#1e1f25f5;
  border-top:1px solid #353640;
  z-index:8;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  backdrop-filter:blur(14px);
}

.selection-bar>div {
  display:flex;
  align-items:center;
  gap:12px;
}

.selection-icon {
  color:var(--lime);
  border:1px solid #53663c;
  border-radius:50%;
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  font-size:14px;
}

.selection-bar strong {
  font-size:14px;
  font-weight:600;
}

.selection-bar #selection-hint {
  color:var(--muted);
  font-size:14px;
}

.text-button {
  background:none;
  border:0;
  font-size:14px;
  color:var(--violet);
  padding:8px;
  white-space:nowrap;
}

.overlap-note {
  color:#ffd58b;
  font-size:14px;
  line-height:1.5;
}

.empty-state {
  padding:65px 24px;
  text-align:center;
  color:var(--muted);
  line-height:1.8;
  border:1px dashed var(--line);
  border-radius:8px;
  margin:0;
}

.empty-state strong {
  display:block;
  color:var(--text);
  font-size:21px;
  font-weight:500;
  margin-bottom:7px;
}

.selected-list {
  display:grid;
  gap:12px;
}

.selected-day {
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:1px;
  color:var(--muted);
  margin:15px 0 0;
}

.selected-item {
  display:flex;
  align-items:center;
  gap:22px;
  padding:20px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px;
}

.selected-time {
  min-width:102px;
  font-size:14px;
  color:var(--violet);
  font-variant-numeric:tabular-nums;
}

.selected-description {
  flex:1;
  min-width:0;
}

.selected-description .talk-title {
  display:block;
  font-size:17px;
}

.selected-description p {
  margin:7px 0 0;
  color:var(--muted);
  font-size:14px;
}

.selected-item .select-talk {
  width:34px;
  height:34px;
}

.selected-item.conflict {
  border-color:#876739;
}

.selected-item .overlap-note {
  margin-bottom:0;
  font-size:13px;
}

dialog {
  border:1px solid #444550;
  border-radius:14px;
  background:#1b1c23;
  color:var(--text);
  max-width:620px;
  width:calc(100% - 32px);
  padding:34px;
  max-height:85vh;
}

dialog::backdrop {
  background:#06070abf;
  backdrop-filter:blur(5px);
}

.dialog-close {
  position:absolute;
  top:13px;
  right:13px;
  background:transparent;
  border:0;
  color:var(--muted);
  font-size:28px;
  width:35px;
  height:35px;
}

.dialog-content h2 {
  font-family:'Space Grotesk',sans-serif;
  font-size:28px;
  font-weight:500;
  line-height:1.25;
  padding-right:10px;
  margin:16px 0;
}

.dialog-content .detail-speakers {
  color:var(--violet);
  line-height:1.5;
}

.detail-time {
  color:var(--muted);
  font-size:14px;
  line-height:1.7;
  margin:20px 0;
}

.detail-description {
  line-height:1.7;
  font-size:16px;
  white-space:pre-line;
}

.detail-actions {
  margin-top:25px;
  display:flex;
  gap:20px;
  align-items:center;
}

.detail-actions button {
  background:var(--lime);
  color:#15180f;
  border:0;
  border-radius:6px;
  padding:12px 16px;
  font-weight:600;
}

.detail-actions a {
  font-size:14px;
  color:var(--muted);
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

@media(min-width:1800px) {
  main,.site-header {
    max-width:1900px;
    margin-left:auto;
    margin-right:auto;
  }
  .site-header {
    padding:0 48px;
  }
  .schedule {
    grid-template-columns:65px repeat(var(--stage-count),minmax(222px,1fr));
  }
}

@media(max-width:760px) {
  .site-header {
    margin:0 20px;
    height:72px;
  }
  .brand {
    font-size:21px;
    gap:9px;
  }
  .year {
    display:none;
  }
  .source-link {
    font-size:12px;
  }
  main {
    padding:28px 20px 140px;
  }
  .intro {
    align-items:flex-start;
    flex-direction:column;
    gap:21px;
    margin-bottom:30px;
  }
  h1 {
    font-size:35px;
    letter-spacing:-1.5px;
  }
  .intro-copy {
    font-size:15px;
    line-height:1.5;
  }
  .eyebrow {
    font-size:12px;
    letter-spacing:1.4px;
  }
  .export-button {
    width:100%;
    justify-content:center;
    padding:12px;
  }
  .planner-toolbar {
    flex-wrap:wrap;
    gap:18px;
  }
  .day-tabs {
    gap:25px;
    flex:1;
  }
  .day-tab {
    padding-bottom:15px;
  }
  .day-tab strong {
    font-size:18px;
  }
  .view-tabs {
    margin-bottom:9px;
  }
  .view-tabs button {
    padding:10px;
    font-size:13px;
  }
  .agenda-meta {
    font-size:12px;
    align-items:flex-start;
  }
  .timezone {
    max-width:100px;
    text-align:right;
  }
  .schedule-scroll {
    max-height:68vh;
  }
  .schedule {
    grid-template-columns:48px repeat(var(--stage-count),230px);
    min-width:calc(48px + var(--stage-count)*230px);
  }
  .time-label {
    right:7px;
  }
  .time-heading {
    padding:16px 4px;
  }
  .planner-footer {
    flex-direction:column;
    gap:0;
  }
  .planner-footer p {
    margin:12px 0 0;
  }
  .selection-bar {
    padding:14px 20px;
  }
  .selection-bar>div {
    flex-wrap:wrap;
    gap:8px;
  }
  .selection-bar #selection-hint {
    flex-basis:100%;
    font-size:12px;
    margin-left:35px;
  }
  .selection-bar strong {
    font-size:13px;
  }
  .text-button {
    font-size:13px;
  }
  .selected-item {
    flex-wrap:wrap;
    gap:12px;
    padding:16px;
  }
  .selected-time {
    width:100%;
  }
  .selected-description .talk-title {
    font-size:16px;
  }
  .selected-description p {
    font-size:13px;
  }
  dialog {
    padding:25px;
  }
  .dialog-content h2 {
    font-size:25px;
  }
}

@media(prefers-reduced-motion:reduce) {
  * {
    transition:none!important;
    scroll-behavior:auto!important;
  }
}

.evening-list {
  display:grid;
  gap:12px;
  margin-top:14px;
}

.planner-toolbar:has(.day-tabs[hidden]) {
  justify-content:flex-end;
}

@media(max-width:760px) {
  .day-tabs {
    flex:1 0 100%;
  }
  .day-tab strong {
    white-space:nowrap;
  }
  .planner-toolbar {
    gap:14px;
  }
  .view-tabs {
    margin-bottom:12px;
  }
}
