
  :root { --theme-color: #06b6d4; }
  [hidden], .hidden { display: none !important; }
  .selected-control { background: var(--theme-color) !important; color: #020617 !important; border-color: var(--theme-color) !important; }
  .day-tab { color: #94a3b8; }
  .stage-header { border-top: 5px solid transparent; }
  .time-band { position: absolute; left: 0; right: 0; border-block: 1px solid; pointer-events: none; }
  .show-block.selected-mine { outline: 2px solid var(--theme-color); }
  [data-festival-name] { color: var(--theme-color); }
  [data-view][aria-pressed="true"] { border-color: var(--theme-color); color: var(--theme-color); }
  body {
    font-family: 'Noto Sans TC', sans-serif;
    background-color: #060b19;
    color: #f1f5f9;
    overflow-x: hidden;
  }
  .font-mono-time {
    font-family: 'JetBrains Mono', monospace;
  }
  /* Custom scrollbars */
  ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
  ::-webkit-scrollbar-track {
    background: #0f172a;
  }
  ::-webkit-scrollbar-thumb {
    background: #334155;
    border-radius: 4px;
  }
  ::-webkit-scrollbar-thumb:hover {
    background: #475569;
  }

  /* Proportional Timetable Grid Styles */
  :root {
    --px-per-min: 2.6px; /* Default scale: 1 minute = 2.6px */
  }
  .timetable-wrapper {
    position: relative;
    overflow-x: auto;
    background: #091024;
  }
  .time-grid-line {
    position: absolute;
    left: 0;
    right: 0;
    border-top: 1px dashed rgba(51, 65, 85, 0.5);
    pointer-events: none;
    z-index: 1;
  }
  .time-grid-line.major {
    border-top: 1px solid rgba(71, 85, 105, 0.85);
    background: linear-gradient(180deg, rgba(30, 41, 59, 0.25) 0%, transparent 24px);
  }
  .show-block {
    position: absolute;
    left: 4px;
    right: 4px;
    border-radius: 10px;
    transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 10;
    overflow: hidden;
    cursor: pointer;
  }
  .show-block:hover {
    z-index: 30;
    transform: translateY(-1px) scale(1.015);
    box-shadow: 0 12px 24px -6px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.3);
  }
  .show-block.selected-mine {
    box-shadow: 0 0 0 2px #38bdf8, 0 8px 20px -4px rgba(56, 189, 248, 0.4);
    z-index: 20;
  }
  .show-block.clash-mine {
    box-shadow: 0 0 0 2px #ef4444, 0 0 15px rgba(239, 68, 68, 0.45);
    animation: clash-pulse 2s infinite;
  }
  @keyframes clash-pulse {
    0%, 100% { box-shadow: 0 0 0 2px #ef4444, 0 0 12px rgba(239, 68, 68, 0.4); }
    50% { box-shadow: 0 0 0 3px #f87171, 0 0 20px rgba(239, 68, 68, 0.75); }
  }
