#red-writing-workspace .red-sets {
  height: calc(100vh - 126px);
  min-height: 650px;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  overflow: hidden;
  background:
    radial-gradient(circle at 72% 9%, color-mix(in srgb, var(--red-gold) 10%, transparent), transparent 30%),
    radial-gradient(circle at 28% 92%, color-mix(in srgb, var(--red-violet) 10%, transparent), transparent 34%),
    var(--red-canvas);
}

#red-writing-workspace .red-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

#red-writing-workspace .red-sets-sidebar {
  min-width: 0;
  padding: 27px 18px;
  overflow-y: auto;
  border-right: 1px solid var(--red-line);
  background: color-mix(in srgb, var(--red-panel) 88%, transparent);
  backdrop-filter: blur(20px);
}

#red-writing-workspace .red-sets-sidebar-heading,
#red-writing-workspace .red-set-header,
#red-writing-workspace .red-set-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

#red-writing-workspace .red-sets-kicker {
  display: block;
  margin-bottom: 5px;
  color: var(--red-accent);
  font-size: 9px;
  font-weight: 760;
  letter-spacing: .16em;
  text-transform: uppercase;
}

#red-writing-workspace .red-sets-sidebar h1,
#red-writing-workspace .red-set-panel-heading h2 {
  margin: 0;
  color: var(--red-ink);
  font: 400 25px/1.12 Georgia, serif;
}

#red-writing-workspace .red-sets-new {
  width: 36px;
  height: 36px;
  border: 1px solid color-mix(in srgb, var(--red-accent) 36%, var(--red-line));
  border-radius: 12px;
  color: white;
  background: linear-gradient(135deg, var(--red-accent), var(--red-violet));
  box-shadow: 0 8px 20px color-mix(in srgb, var(--red-accent) 23%, transparent);
  cursor: pointer;
  font-size: 19px;
  transition: transform .18s ease, box-shadow .18s ease;
}

#red-writing-workspace .red-sets-new:hover { transform: translateY(-2px) rotate(2deg); box-shadow: 0 12px 25px color-mix(in srgb, var(--red-accent) 30%, transparent); }
#red-writing-workspace .red-sets-list { display: grid; gap: 7px; margin-top: 22px; }
#red-writing-workspace .red-sets-muted { color: var(--red-muted); font-size: 12px; line-height: 1.5; }

#red-writing-workspace .red-setlist-link {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 10px;
  padding: 13px;
  border: 1px solid transparent;
  border-radius: 13px;
  color: var(--red-ink);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

#red-writing-workspace .red-setlist-link:hover { transform: translateX(2px); background: color-mix(in srgb, var(--red-paper) 72%, transparent); }
#red-writing-workspace .red-setlist-link.is-active { border-color: color-mix(in srgb, var(--red-violet) 42%, var(--red-line)); background: var(--red-paper); box-shadow: 0 8px 20px var(--red-shadow); }
#red-writing-workspace .red-setlist-link strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
#red-writing-workspace .red-setlist-link span { color: var(--red-muted); font-size: 9px; }
#red-writing-workspace .red-setlist-link .red-setlist-time { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: var(--red-accent); font-size: 10px; font-weight: 700; }

#red-writing-workspace .red-set-builder { min-width: 0; min-height: 0; }
#red-writing-workspace .red-set-empty { height: 100%; display: grid; align-content: center; justify-items: center; padding: 40px; text-align: center; }
#red-writing-workspace .red-set-empty[hidden],
#red-writing-workspace .red-set-drop-empty[hidden] { display: none; }
#red-writing-workspace .red-set-empty-mark { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 20px; color: white; background: linear-gradient(145deg, var(--red-accent), var(--red-violet)); box-shadow: 0 20px 42px color-mix(in srgb, var(--red-violet) 24%, transparent); font: 400 29px Georgia, serif; transform: rotate(-4deg); }
#red-writing-workspace .red-set-empty h2 { max-width: 520px; margin: 24px 0 9px; color: var(--red-ink); font: 400 clamp(29px, 3vw, 44px)/1.06 Georgia, serif; }
#red-writing-workspace .red-set-empty p { max-width: 480px; color: var(--red-muted); line-height: 1.6; }
#red-writing-workspace .red-set-empty button { margin-top: 10px; padding: 11px 17px; border: 0; border-radius: 12px; color: white; background: var(--red-accent); box-shadow: 0 10px 24px color-mix(in srgb, var(--red-accent) 28%, transparent); cursor: pointer; }

#red-writing-workspace .red-set-workbench { height: 100%; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); }
#red-writing-workspace .red-set-workbench[hidden] { display: none; }
#red-writing-workspace .red-set-header { padding: 22px 28px 18px; border-bottom: 1px solid var(--red-line); background: color-mix(in srgb, var(--red-paper) 72%, transparent); backdrop-filter: blur(16px); }
#red-writing-workspace .red-set-name { width: min(52vw, 680px); padding: 0; border: 0; outline: none; color: var(--red-ink); background: transparent; font: 400 clamp(28px, 3vw, 42px)/1.08 Georgia, serif; }
#red-writing-workspace .red-set-name:focus { text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--red-accent) 38%, transparent); text-underline-offset: 7px; }
#red-writing-workspace .red-set-summary { min-width: 88px; text-align: right; }
#red-writing-workspace .red-set-summary strong, #red-writing-workspace .red-set-summary span { display: block; }
#red-writing-workspace .red-set-summary strong { color: var(--red-ink); font: 400 25px Georgia, serif; }
#red-writing-workspace .red-set-summary span { margin-top: 3px; color: var(--red-positive); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
#red-writing-workspace .red-set-summary span.is-saving { color: var(--red-gold); }
#red-writing-workspace .red-set-summary span.is-error { color: var(--red-accent); }
#red-writing-workspace .red-set-header-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
#red-writing-workspace .red-stage-launch,
#red-writing-workspace .red-set-export-trigger { height: 37px; display: inline-flex; align-items: center; gap: 7px; padding: 0 12px; border: 1px solid var(--red-line); border-radius: 11px; color: var(--red-ink); background: color-mix(in srgb, var(--red-paper) 90%, transparent); box-shadow: 0 5px 14px color-mix(in srgb, var(--red-shadow) 58%, transparent); cursor: pointer; font: inherit; font-size: 12px; font-weight: 650; white-space: nowrap; transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
#red-writing-workspace .red-stage-launch { color: white; border-color: transparent; background: linear-gradient(135deg, var(--red-accent), var(--red-violet)); box-shadow: 0 8px 20px color-mix(in srgb, var(--red-accent) 22%, transparent); }
#red-writing-workspace .red-stage-launch:hover,
#red-writing-workspace .red-set-export-trigger:hover { transform: translateY(-1px); box-shadow: 0 10px 22px color-mix(in srgb, var(--red-shadow) 92%, transparent); }
#red-writing-workspace .red-set-export { position: relative; }
#red-writing-workspace .red-set-export-menu { position: absolute; z-index: 50; top: calc(100% + 9px); right: 0; width: 230px; padding: 7px; border: 1px solid var(--red-line); border-radius: 15px; background: color-mix(in srgb, var(--red-paper) 96%, transparent); box-shadow: 0 22px 55px color-mix(in srgb, var(--red-shadow) 130%, rgba(0,0,0,.18)); backdrop-filter: blur(24px); animation: red-export-in .16s cubic-bezier(.2,.8,.2,1) both; }
#red-writing-workspace .red-set-export-menu[hidden] { display: none; }
#red-writing-workspace .red-set-export-menu a { display: grid; gap: 3px; padding: 10px 11px; border-radius: 10px; color: var(--red-ink); text-decoration: none; }
#red-writing-workspace .red-set-export-menu a:hover { background: color-mix(in srgb, var(--red-accent) 9%, var(--red-panel)); }
#red-writing-workspace .red-set-export-menu strong { font-size: 11px; }
#red-writing-workspace .red-set-export-menu span { color: var(--red-muted); font-size: 9px; }
@keyframes red-export-in { from { opacity: 0; transform: translateY(-5px) scale(.98); } }

#red-writing-workspace .red-set-columns { min-height: 0; display: grid; grid-template-columns: minmax(290px, .82fr) minmax(420px, 1.35fr); }
#red-writing-workspace .red-set-material-panel,
#red-writing-workspace .red-set-run-panel { min-width: 0; min-height: 0; padding: 23px 25px 28px; overflow: hidden; }
#red-writing-workspace .red-set-material-panel { border-right: 1px solid var(--red-line); background: color-mix(in srgb, var(--red-panel) 55%, transparent); }
#red-writing-workspace .red-set-panel-heading h2 { font-size: 21px; }
#red-writing-workspace .red-set-count { color: var(--red-muted); font-size: 10px; }
#red-writing-workspace .red-set-search { height: 38px; display: flex; align-items: center; gap: 8px; margin: 16px 0 12px; padding: 0 11px; border: 1px solid var(--red-line); border-radius: 11px; color: var(--red-muted); background: color-mix(in srgb, var(--red-paper) 82%, transparent); }
#red-writing-workspace .red-set-search:focus-within { border-color: var(--red-violet); box-shadow: 0 0 0 4px color-mix(in srgb, var(--red-violet) 10%, transparent); }
#red-writing-workspace .red-set-search input { width: 100%; border: 0; outline: 0; color: var(--red-ink); background: transparent; font-size: 12px; }
#red-writing-workspace .red-set-material-list,
#red-writing-workspace .red-set-run-list { height: calc(100% - 72px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
#red-writing-workspace .red-set-material-list { display: grid; align-content: start; gap: 8px; padding: 2px 5px 18px 2px; }
#red-writing-workspace .red-set-run-list { position: relative; display: flex; flex-direction: column; gap: 8px; margin-top: 14px; padding: 5px 7px 80px 5px; }

#red-writing-workspace .red-set-material-card,
#red-writing-workspace .red-set-run-card {
  position: relative;
  border: 1px solid var(--red-line);
  border-radius: 13px;
  color: var(--red-ink);
  background: color-mix(in srgb, var(--red-paper) 92%, transparent);
  box-shadow: 0 5px 14px color-mix(in srgb, var(--red-shadow) 68%, transparent);
  transition: border-color .16s ease, box-shadow .16s ease, transform .22s cubic-bezier(.2,.8,.2,1), opacity .16s ease;
}
#red-writing-workspace .red-set-material-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px 12px; padding: 14px; }
#red-writing-workspace .red-set-material-card:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--red-violet) 52%, var(--red-line)); box-shadow: 0 10px 22px var(--red-shadow); }
#red-writing-workspace .red-set-material-card strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
#red-writing-workspace .red-set-material-card p { grid-column: 1; margin: 0; overflow: hidden; color: var(--red-muted); font-size: 10px; line-height: 1.4; white-space: nowrap; text-overflow: ellipsis; }
#red-writing-workspace .red-set-material-card button { grid-column: 2; grid-row: 1 / span 2; align-self: center; padding: 7px 9px; border: 1px solid var(--red-line); border-radius: 9px; color: var(--red-accent); background: transparent; cursor: pointer; font-size: 10px; }
#red-writing-workspace .red-set-material-card button:hover { color: white; border-color: var(--red-accent); background: var(--red-accent); }

#red-writing-workspace .red-set-run-card { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; min-height: 66px; padding: 9px 10px 9px 6px; touch-action: pan-y; cursor: grab; flex-shrink: 0; }
#red-writing-workspace .red-set-run-card:hover,
#red-writing-workspace .red-set-run-card:focus-within { border-color: color-mix(in srgb, var(--red-accent) 48%, var(--red-line)); box-shadow: 0 10px 24px var(--red-shadow); }
#red-writing-workspace .red-set-run-card.is-picked-up { opacity: .22; }
#red-writing-workspace .red-set-number { color: var(--red-faint); text-align: center; font: 400 16px Georgia, serif; }
#red-writing-workspace .red-set-card-copy { min-width: 0; }
#red-writing-workspace .red-set-card-copy strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
#red-writing-workspace .red-set-card-copy span { display: block; margin-top: 4px; color: var(--red-muted); font-size: 9px; }
#red-writing-workspace .red-set-card-actions { display: flex; align-items: center; gap: 5px; }
#red-writing-workspace .red-set-duration { width: 53px; padding: 7px 4px; border: 1px solid transparent; border-radius: 8px; color: var(--red-muted); background: transparent; text-align: right; font-size: 10px; }
#red-writing-workspace .red-set-duration:hover, #red-writing-workspace .red-set-duration:focus { outline: none; border-color: var(--red-line); background: var(--red-panel); }
#red-writing-workspace .red-set-drag,
#red-writing-workspace .red-set-remove,
#red-writing-workspace .red-set-nudge { width: 29px; height: 29px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px; color: var(--red-muted); background: transparent; cursor: pointer; }
#red-writing-workspace .red-set-drag { cursor: grab; font-size: 15px; letter-spacing: -3px; }
#red-writing-workspace .red-set-drag:active { cursor: grabbing; }
#red-writing-workspace .red-set-remove:hover { color: white; background: var(--red-accent); }
#red-writing-workspace .red-set-nudge:hover, #red-writing-workspace .red-set-drag:hover { color: var(--red-ink); background: var(--red-panel); }

#red-writing-workspace .red-set-drop-empty { min-height: 180px; display: grid; align-content: center; justify-items: center; padding: 26px; border: 1px dashed color-mix(in srgb, var(--red-violet) 44%, var(--red-line)); border-radius: 18px; color: var(--red-muted); text-align: center; transition: border-color .16s ease, background .16s ease, transform .16s ease; }
#red-writing-workspace .red-set-drop-empty strong { margin-bottom: 6px; color: var(--red-ink); font: 400 19px Georgia, serif; }
#red-writing-workspace .red-set-drop-empty span { font-size: 10px; }
#red-writing-workspace .red-set-run-list.is-receiving .red-set-drop-empty { transform: scale(.99); border-color: var(--red-accent); background: color-mix(in srgb, var(--red-accent) 6%, transparent); }
@media (max-width: 900px) {
  #red-writing-workspace .red-sets { height: auto; min-height: 720px; grid-template-columns: 1fr; overflow: visible; }
  #red-writing-workspace .red-sets-sidebar { border-right: 0; border-bottom: 1px solid var(--red-line); }
  #red-writing-workspace .red-sets-list { display: flex; overflow-x: auto; }
  #red-writing-workspace .red-setlist-link { min-width: 190px; }
  #red-writing-workspace .red-set-workbench { min-height: 760px; }
  #red-writing-workspace .red-set-columns { grid-template-columns: minmax(0, 1fr); overflow: visible; }
  #red-writing-workspace .red-set-material-panel { border-right: 0; border-bottom: 1px solid var(--red-line); }
  #red-writing-workspace .red-set-material-list { max-height: 260px; }
  #red-writing-workspace .red-set-run-list { min-height: 360px; }
  #red-writing-workspace .red-set-header { align-items: flex-start; }
  #red-writing-workspace .red-set-name { width: min(45vw, 520px); }
  #red-writing-workspace .red-set-summary { display: none; }
}

@media (max-width: 620px) {
  #red-writing-workspace .red-set-header { display: grid; grid-template-columns: minmax(0, 1fr); padding: 20px 18px; }
  #red-writing-workspace .red-set-name { width: 100%; font-size: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  #red-writing-workspace .red-set-material-card,
  #red-writing-workspace .red-set-run-card,
  #red-writing-workspace .red-set-placeholder { transition: none; animation: none; }
}

/* Pointer users can pick up the card face. Grips reserve a touch gesture while
   the rest of each list remains available for normal finger scrolling. */
#red-writing-workspace .red-set-material-card { grid-template-columns: 24px minmax(0, 1fr) auto; cursor: grab; touch-action: pan-y; }
#red-writing-workspace .red-set-material-card strong, #red-writing-workspace .red-set-material-card p { grid-column: 2; }
#red-writing-workspace .red-set-material-card .red-set-add { grid-column: 3; }
#red-writing-workspace .red-set-material-card .red-set-material-grip { grid-column: 1; grid-row: 1 / span 2; padding: 0; width: 24px; min-height: 44px; border: 0; color: var(--red-faint); touch-action: none; cursor: grab; }
#red-writing-workspace .red-set-drag { touch-action: none; min-height: 44px; }
#red-writing-workspace .red-set-material-list.red-motion-return-ready::before { content: 'Return here to remove from this set'; position: sticky; top: 0; z-index: 2; padding: 12px; border: 1px solid var(--red-line); border-radius: 12px; color: var(--red-muted); background: var(--red-paper); font-size: 11px; text-align: center; }
#red-writing-workspace .red-set-material-list.red-motion-return-target::before { color: var(--red-ink); border-color: var(--red-accent); box-shadow: 0 4px 18px var(--red-shadow); }

#red-writing-workspace .red-set-header { flex-wrap: wrap; }
#red-writing-workspace .red-set-conflict { flex-basis: 100%; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 12px; border: 1px solid var(--red-accent); border-radius: 12px; color: var(--red-ink); background: var(--red-paper); font-size: 12px; }
#red-writing-workspace .red-set-conflict[hidden] { display: none; }
#red-writing-workspace .red-set-conflict button { min-height:44px; border:1px solid var(--red-line); border-radius:9px; padding:8px 12px; color:var(--red-ink);background:var(--red-panel);cursor:pointer; }

@media (max-width: 620px) {
  #red-writing-workspace .red-set-header > div { min-width: 0; }
  #red-writing-workspace .red-set-material-panel, #red-writing-workspace .red-set-run-panel { padding: 20px 16px; }
  #red-writing-workspace .red-set-run-card { grid-template-columns: 28px minmax(0, 1fr); gap: 4px; }
  #red-writing-workspace .red-set-card-actions { grid-column: 2; justify-content: flex-end; }
  #red-writing-workspace .red-set-nudge, #red-writing-workspace .red-set-remove, #red-writing-workspace .red-set-drag { width: 40px; min-height: 44px; }
  #red-writing-workspace .red-set-material-card { grid-template-columns: 32px minmax(0, 1fr) auto; gap: 6px; padding: 10px; }
  #red-writing-workspace .red-set-material-card .red-set-material-grip { width: 32px; }
  #red-writing-workspace .red-set-material-card .red-set-add, #red-writing-workspace .red-stage-launch, #red-writing-workspace .red-set-export-trigger { min-height: 44px; }
  #red-writing-workspace .red-set-card-copy strong { white-space: normal; overflow-wrap: anywhere; }
  #red-writing-workspace .red-set-export-menu { right: auto; left: 0; }
}