#schedule .app,
#schedule .notes-page{
  width:100%;
  max-width:none;
  margin:0;
  padding:0 0 8px;
  border:1px solid var(--line);
  background:var(--panel-fill-mid);
}

.titlebar{
  display:flex; align-items:center; gap:16px;
  padding:9px 16px; background:var(--bg-tabbar); border-bottom:1px solid var(--border);
  font-size:11.5px; color:var(--text-dim); font-weight:var(--type-weight);
}
.titlebar .path{ flex:none; color:var(--text); }
.titlebar .path .sep{ color:var(--text-faint); margin:0 3px; }
.titlebar .clock{ flex:none; }
.titlebar .clock b{
  color:var(--string); font-weight:var(--type-weight); font-family:var(--font-display); font-size:16px;
  letter-spacing:1px; text-shadow:0 0 8px var(--glow);
}

.loadout-inline{
  display:flex; align-items:center; gap:8px; flex:1; min-width:0;
  padding-left:16px; border-left:1px solid var(--border);
  font-size:11px; color:var(--text-dim);
}
.loadout-name{ cursor:text; padding:0 3px; border-radius:2px; outline:none; color:var(--text); font-weight:600; }
.loadout-name:hover{ background:var(--hover-mid); }
.loadout-name:focus{ outline:1px dashed var(--accent); background:var(--hover-focus); }
.loadout-swatches{ display:flex; align-items:center; gap:5px; margin-left:auto; }
.loadout-sq{
  position:relative; width:13px; height:13px; border-radius:3px; cursor:pointer; transition:background 0.12s ease;
}
.loadout-sq .ldel{
  color:var(--chip-ink); pointer-events:none;
  pointer-events:none;
}
.loadout-sq:hover .ldel{ opacity:1; pointer-events:auto; cursor:pointer; }
.loadout-sq .ldel:hover{ color:var(--danger); }
.loadout-add{
  width:13px; height:13px; display:flex; align-items:center; justify-content:center;
  color:var(--text-faint); opacity:0.6; cursor:pointer; font-size:11px;
}
.loadout-add:hover{ opacity:1; color:var(--accent); }

.coverage{
  display:flex; align-items:center; gap:12px; padding:10px 16px;
  background:var(--bg-tabbar); border-bottom:1px solid var(--border);
  font-size:11.5px; color:var(--text-dim); flex-wrap:wrap;
}
.coverage .track{ flex:1; min-width:140px; height:6px; background:var(--border-soft); position:relative; overflow:visible; }
.coverage .fill{ position:absolute; inset:0; width:0%; background:var(--done); transition:width 0.4s ease; }
.coverage .fill::after{
  content:''; position:absolute; right:-1px; top:50%; width:5px; height:5px; border-radius:50%;
  background:var(--string); transform:translate(50%,-50%);
  box-shadow:0 0 4px var(--accent), 0 0 9px var(--accent);
  opacity:0; transition:opacity 0.2s ease;
}
.coverage .track.has-progress .fill::after{ opacity:1; }
.coverage .pct{ color:var(--done); font-weight:600; min-width:34px; }

.spark{
  position:absolute; top:50%; width:3px; height:3px; border-radius:50%;
  pointer-events:none; z-index:2;
  animation:spark-fizzle 0.75s ease-out forwards;
}
@keyframes spark-fizzle{
  0%{ transform:translate(-50%,-50%) scale(1); opacity:1; }
  60%{ opacity:0.8; }
  100%{ transform:translate(var(--dx,6px), var(--dy,-14px)) scale(0.15); opacity:0; }
}

.notes-btn{
  flex:none; font-size:10.5px; padding:4px 10px; border:1px solid var(--border); border-radius:3px;
  color:var(--text-dim); cursor:pointer; white-space:nowrap; user-select:none; font-family:var(--font);
}
.notes-btn:hover{ color:var(--accent); border-color:var(--accent); }
.notes-btn.active{ color:var(--done); border-color:var(--done); }

.tabs{ display:flex; background:var(--bg-tabbar); overflow-x:auto; border-bottom:1px solid var(--border); }
.tab{
  flex:none; display:flex; align-items:center; gap:7px; padding:9px 16px;
  background:var(--bg-tab-in); color:var(--text-dim); border-right:1px solid var(--border);
  cursor:pointer; font-size:12px; white-space:nowrap; user-select:none;
}
.tab:hover{ color:var(--text); }
.tab.active{ background:var(--bg-tab-act); color:var(--text); box-shadow:inset 0 -2px 0 var(--accent); }
.tab .dot{ width:6px; height:6px; border-radius:50%; background:var(--text-faint); }
.tab.active .dot{ background:var(--accent); }
.tab .dot.full{ background:var(--done); box-shadow:0 0 4px var(--done); }
.tab .frac{ color:var(--text-faint); font-size:10px; }

.content{ padding:14px 0 4px; counter-reset:line; }
.tag-line{ padding:0 16px 12px; font-size:12px; color:var(--comment); }
.tag-line .kw{ color:var(--keyword); }

footer{ text-align:center; font-size:10.5px; color:var(--text-faint); margin-top:26px; padding:0 16px; }
footer .status{ color:var(--text-dim); }
footer .status.err{ color:var(--danger); }
