html, body { height: 100%; margin: 0; font-family: 'Roboto', sans-serif; }
.panel-content { flex: 1; overflow: hidden; display: flex; flex-direction: column; }
.gmail-editor { flex: 1; padding: 1rem; border: 1px solid #dadce0; border-radius: 4px; background: #fff; overflow: auto; outline: none; position: relative; }
textarea.gmail-editor { resize: none; }
.gmail-editor[placeholder]:empty:before {
    content: attr(placeholder);
    position: absolute; top: 1rem; left: 1rem; color: #9ca3af; pointer-events: none;
}
.gutter.gutter-vertical { cursor: row-resize; height: 4px; background: #e5e7eb; }
.gutter.gutter-horizontal { cursor: col-resize; width: 4px; background: #e5e7eb; }
#rightPanel { position: relative; }
.copy-btn {
  position: absolute;
  top: 0.5rem;
  right: 1rem;
  background: rgba(0,0,0,0.6);
  padding: 0.25rem;
  border-radius: 4px;
  cursor: pointer;
  z-index: 10;
  transition: background 0.3s;
}
.copy-btn:hover { background: rgba(0,0,0,0.8); }
#templateArea, #promptArea { font-family: 'Roboto Mono', monospace; }
.choices { margin:0; }
.choices__inner { background: white; border-radius:0.375rem; padding-top:0.3rem; padding-bottom:0.3rem; min-height:0; }
.is-open .choices__inner { border-radius:0.375rem 0.375rem 0 0; }
.choices[data-type*=select-one] .choices__inner { padding-bottom:0.3rem; }
.choices__list--dropdown, .choices__list[aria-expanded] { border-bottom-left-radius:0.375rem; border-bottom-right-radius:0.375rem; }

#resultArea a,
#resultArea a:visited,
#resultArea a:hover,
#resultArea a:active { color: cornflowerblue; font-weight: revert; }

#resultArea[contenteditable] {
  background-color: #ffffe0;
}

/* Timeline styles */
/* Custom timeline styles that can't be easily done with Tailwind */
#timelineContainer::-webkit-scrollbar {
  height: 2px;
}

#timelineContainer::-webkit-scrollbar-track {
  background: transparent;
}

#timelineContainer::-webkit-scrollbar-thumb {
  background-color: #d1d5db;
}

/* Custom tooltip style for timeline bullet */
.timeline-bullet:hover::after {
  content: attr(data-tweak);
  position: absolute;
  top: -8px;
  left: 35px;
  transform: translateX(-50%);
  background-color: rgba(0, 0, 0, 0.7);
  color: white;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 11px;
  white-space: nowrap;
  z-index: 50;
  pointer-events: none;
}