/* ============================================================================
   MEDICAL CODING COMMAND — styles.css
   ----------------------------------------------------------------------------
   ARCHITECTURE & MAINTENANCE NOTES (read before editing)

   This stylesheet is organized as a BASE layer followed by dated OVERRIDE
   "fix packs". Later rules win by cascade order + !important. When you need to
   change a look, prefer editing the AUTHORITATIVE (latest) rule for that
   element rather than adding yet another override.

   COLOR TOKENS: All semantic colors live in :root below as CSS custom
   properties (e.g. --icd-badge-bg, --cpt-badge-bg, --do-not-red). Recolor the
   app by editing ONE variable — do not hardcode new hex values.

   SECTION MAP (approx. line anchors — search the banner text to jump):
     • :root design tokens .................... top of file
     • Base elements / layout ................. ~40+
     • Guideline card + sequence panel base ... ~2700+
     • Redesigned global search results ....... "REDESIGNED GLOBAL SEARCH"
     • Marker / card redesign ................. "MARKER REDESIGN"
     • At-a-Glance base ....................... "AT-A-GLANCE REDESIGN"
     • Fix packs (dated) ...................... "FIX PACK" / "FRESH REDESIGN"
         V22, V23, V24, V25, V27, V28, V29, V30, V32 ...
     • V32 CPT-always-on + red DO NOT ......... "V32 — CPT ALWAYS-ON"

   VERIFYING A CHANGE WON'T BREAK ANYTHING:
     A cascade-analysis harness lives at ../css_cascade_check.py. It snapshots
     the WINNING declaration for each key element. Workflow:
       1) python3 css_cascade_check.py before   (snapshot current)
       2) make your edit
       3) python3 css_cascade_check.py after
       4) diff cascade_before.json vs cascade_after.json — intended changes
          should be the ONLY diffs.
   ============================================================================ */

/* Study Notes App - print-friendly, tablet-friendly, editable */
:root {
  --bg: #f6f3ee;
  --panel: #ffffff;
  --ink: #1f2933;
  --muted: #65717f;
  --brand: #305f72;
  --brand-2: #568ea3;
  --accent: #f2b84b;
  --danger: #c44d58;
  --success: #3f8f68;
  --line: #ded8cf;
  --shadow: 0 18px 45px rgba(31, 41, 51, .12);
  --radius: 18px;

  /* --- Semantic design tokens (V33 consolidation) ---
     Centralized so recoloring happens in ONE place. Values are unchanged
     from the previous hardcoded hex, so rendering is identical. */
  --icd-badge-bg: #e8720c;      /* At-a-Glance ICD badge (orange) */
  --icd-badge-fg: #fff;
  --cpt-badge-bg: #c99700;      /* At-a-Glance CPT badge (dark yellow) */
  --cpt-badge-fg: #3a2f00;
  --do-not-red: #b3261e;        /* DO NOT emphasis red */
  --do-not-soft-bg: #fdecec;    /* DO NOT alert soft background */
  --do-not-soft-border: #e6a6a6;
}

* { box-sizing: border-box; }

html, body { margin: 0; min-height: 100%; }

body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: radial-gradient(circle at top left, #fff8e7 0, transparent 34%), var(--bg);
  color: var(--ink);
  line-height: 1.5;
}

button, input, textarea, select {
  font: inherit;
}

button {
  border: 0;
  border-radius: 999px;
  padding: .72rem 1rem;
  background: var(--brand);
  color: #fff;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

button:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(48, 95, 114, .22); }
button.secondary { background: #edf3f5; color: var(--brand); }
button.ghost { background: transparent; color: var(--brand); border: 1px solid var(--line); }
button.danger { background: var(--danger); }
button.small { padding: .45rem .72rem; font-size: .88rem; }

.app-shell {
  max-width: 1280px;
  margin: 0 auto;
  padding: 24px;
}

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

.brand-block h1 { margin: 0; font-size: clamp(1.6rem, 4vw, 3rem); letter-spacing: -.04em; }
.brand-block p { margin: .25rem 0 0; color: var(--muted); }

.toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
}

.search {
  min-width: min(340px, 100%);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .8rem 1rem;
  background: #fff;
  color: var(--ink);
}

.layout {
  display: grid;
  grid-template-columns: 310px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}

.sidebar, .content-panel, .card, .modal-card {
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(222,216,207,.8);
  box-shadow: var(--shadow);
  border-radius: var(--radius);
}

.sidebar {
  position: sticky;
  top: 18px;
  padding: 16px;
  max-height: calc(100vh - 36px);
  overflow: auto;
}

.sidebar h2, .content-panel h2 { margin-top: 0; }

.book-nav { display: grid; gap: 12px; }
.book-nav details {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}
.book-nav summary {
  padding: .82rem .95rem;
  cursor: pointer;
  font-weight: 800;
  color: var(--brand);
}
.chapter-list {
  display: grid;
  padding: 0 10px 10px;
  gap: 6px;
}
.chapter-link {
  display: block;
  text-decoration: none;
  color: var(--ink);
  padding: .58rem .65rem;
  border-radius: 10px;
}
.chapter-link:hover, .chapter-link.active { background: #f0f6f7; color: var(--brand); }

.content-panel {
  min-height: 70vh;
  padding: clamp(18px, 3vw, 34px);
}

.hero {
  min-height: 54vh;
  display: grid;
  align-content: center;
  gap: 18px;
}
.hero h2 { font-size: clamp(2rem, 5vw, 4.6rem); line-height: .95; letter-spacing: -.06em; margin-bottom: 0; }
.hero p { color: var(--muted); max-width: 760px; font-size: 1.08rem; }

.book-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
}
.card {
  padding: 18px;
  cursor: pointer;
  box-shadow: none;
  transition: transform .15s ease, border-color .15s ease;
}
.card:hover { transform: translateY(-2px); border-color: var(--brand-2); }
.card h3 { margin: 0 0 8px; }
.card p { color: var(--muted); margin: 0; }

.breadcrumbs {
  color: var(--muted);
  font-size: .92rem;
  margin-bottom: 10px;
}

.chapter-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  border-bottom: 1px solid var(--line);
  padding-bottom: 16px;
  margin-bottom: 18px;
}
.chapter-title-wrap h2 { margin: 0; font-size: clamp(1.7rem, 4vw, 3rem); letter-spacing: -.04em; }
.chapter-title-wrap input {
  width: min(640px, 100%);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: .7rem .8rem;
  font-weight: 800;
  font-size: 1.1rem;
}

.chapter-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.category-stack { display: grid; gap: 14px; }
.category {
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
}
.category-head {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  background: #fbfaf7;
  border-bottom: 1px solid var(--line);
}
.category-title-line { display: flex; align-items: center; gap: 10px; min-width: 0; }
.icon-chip { font-size: 1.45rem; width: 34px; text-align: center; }
.category-title {
  border: 0;
  background: transparent;
  font-weight: 850;
  color: var(--ink);
  min-width: 0;
  width: 100%;
}
.category-tools { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.category-body { padding: 14px; display: grid; gap: 12px; }
.notes-area {
  width: 100%;
  min-height: 140px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px;
  background: #fffdfa;
}
.link-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.link-row input {
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: .62rem .7rem;
}
.saved-links { display: flex; flex-wrap: wrap; gap: 8px; }
.saved-links a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: .45rem .7rem;
  border: 1px solid #d8e7eb;
  border-radius: 999px;
  color: var(--brand);
  background: #f6fbfc;
  text-decoration: none;
}

.icon-picker {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(44px, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.icon-option {
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--line);
  color: var(--ink);
  font-size: 1.35rem;
  padding: .55rem;
}
.icon-option:hover { background: #fff4d7; box-shadow: none; transform: none; }

.modal {
  position: fixed;
  inset: 0;
  display: none;
  place-items: center;
  background: rgba(31, 41, 51, .42);
  padding: 22px;
  z-index: 20;
}
.modal.open { display: grid; }
.modal-card {
  width: min(680px, 100%);
  padding: 22px;
  max-height: 82vh;
  overflow: auto;
}
.modal-card h2 { margin-top: 0; }
.modal-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 16px; }

.import-box {
  width: 100%;
  min-height: 220px;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px;
}

.status {
  min-height: 22px;
  color: var(--success);
  font-weight: 700;
  font-size: .92rem;
}

.empty-state {
  text-align: center;
  color: var(--muted);
  padding: 40px 10px;
  border: 1px dashed var(--line);
  border-radius: 18px;
  background: #fffdfa;
}

@media (max-width: 860px) {
  .app-shell { padding: 14px; }
  .topbar { align-items: stretch; flex-direction: column; }
  .toolbar { justify-content: stretch; }
  .toolbar > * { flex: 1 1 auto; }
  .layout { grid-template-columns: 1fr; }
  .sidebar { position: static; max-height: none; }
  .book-grid { grid-template-columns: 1fr; }
  .link-row { grid-template-columns: 1fr; }
}

@media print {
  body { background: #fff; }
  .topbar, .sidebar, .chapter-actions, .category-tools, .link-row, .modal { display: none !important; }
  .app-shell { max-width: none; padding: 0; }
  .layout { display: block; }
  .content-panel, .category { box-shadow: none; border-color: #bbb; }
  .content-panel { padding: 0; }
  textarea, input { border: 0 !important; }
  .notes-area { min-height: auto; }
}

.chapter-index-list {
  display: grid;
  gap: 10px;
}

.chapter-index-row {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.chapter-number {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  background: #f0f6f7;
  color: var(--brand);
  font-weight: 900;
}

.chapter-index-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.chapter-index-main input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: .62rem .7rem;
  font-weight: 800;
}

.chapter-index-main small {
  color: var(--muted);
}

.chapter-index-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

@media (max-width: 860px) {
  .chapter-index-row { grid-template-columns: 40px minmax(0, 1fr); }
  .chapter-index-tools { grid-column: 1 / -1; justify-content: stretch; }
  .chapter-index-tools button { flex: 1 1 auto; }
}

.chapter-page-index {
  margin-bottom: 24px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fffdfa;
}

.section-heading-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}

.section-heading-row h3 { margin: 0; }
.section-heading-row p { margin: 4px 0 0; color: var(--muted); }

.page-tile-grid {
  display: grid;
  gap: 10px;
}

.page-tile {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.page-tile-color {
  width: 14px;
  align-self: stretch;
  border-radius: 999px;
  background: var(--page-color, #fffdfa);
  border: 1px solid rgba(0,0,0,.08);
}

.page-tile-main {
  display: grid;
  gap: 4px;
  cursor: pointer;
  min-width: 0;
}

.page-tile-main small {
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-tile-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.page-settings-line label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-weight: 700;
}

.page-editor-shell {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
}

.editor-ribbon {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 10px;
  background: #fbfaf7;
  border-bottom: 1px solid var(--line);
}

.editor-ribbon label,
.file-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: .42rem .65rem;
  background: #fff;
  color: var(--brand);
  font-size: .88rem;
  cursor: pointer;
}

.editor-ribbon select,
.editor-ribbon input[type="color"] {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: .35rem;
  background: #fff;
}

.rich-editor {
  min-height: 520px;
  padding: clamp(18px, 3vw, 34px);
  outline: none;
  background: var(--editable-page-color, #fffdfa);
  overflow-wrap: anywhere;
}

.rich-editor img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 14px 0;
  border-radius: 14px;
  border: 1px solid var(--line);
}

.rich-editor h2 {
  margin-top: 1.1em;
  letter-spacing: -.03em;
}

@media (max-width: 860px) {
  .page-tile { grid-template-columns: 12px minmax(0, 1fr); }
  .page-tile-tools { grid-column: 1 / -1; justify-content: stretch; }
  .page-tile-tools button { flex: 1 1 auto; }
  .editor-ribbon { position: static; }
}

@media print {
  .chapter-page-index, .editor-ribbon, .page-settings-line { display: none !important; }
  .rich-editor { min-height: auto; padding: 0; background: #fff !important; }
  .page-editor-shell { border: 0; }
}

.study-tool-block {
  display: block;
  clear: both;
  width: 100%;
  max-width: 100%;
  margin: 28px 0;
  padding: 18px;
  border: 2px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 24px rgba(31, 41, 51, .08);
  overflow: auto;
  position: relative;
  isolation: isolate;
}

.study-tool-block::before {
  content: "";
  display: block;
  height: 4px;
  width: 100%;
  margin: -18px -18px 14px;
  padding-right: 36px;
  background: linear-gradient(90deg, var(--brand), var(--accent));
}

.study-tool-block + .study-tool-block {
  margin-top: 36px;
}

.tool-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 10px;
  font-weight: 900;
  color: var(--brand);
  text-transform: uppercase;
  font-size: .78rem;
  letter-spacing: .08em;
}

.study-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  margin-top: 8px;
}

.study-table th,
.study-table td {
  border: 1px solid #cfd8dc;
  padding: 10px;
  min-width: 90px;
  vertical-align: top;
}

.study-table th {
  background: #edf3f5;
  color: var(--brand);
}

.bar-chart-template {
  display: flex;
  align-items: end;
  gap: 14px;
  min-height: 240px;
  padding: 18px;
  border-left: 3px solid var(--ink);
  border-bottom: 3px solid var(--ink);
  background: repeating-linear-gradient(to top, transparent 0 47px, rgba(48,95,114,.12) 48px);
}

.bar-chart-template .bar {
  flex: 1;
  min-width: 48px;
  height: var(--bar-height, 50%);
  display: flex;
  align-items: end;
  justify-content: center;
  padding: 8px;
  border-radius: 12px 12px 0 0;
  background: linear-gradient(180deg, var(--accent), #f7d98b);
  color: #4b3710;
  font-weight: 800;
  text-align: center;
}

.mind-map {
  position: relative;
  min-height: 360px;
  border: 1px dashed var(--line);
  border-radius: 18px;
  background: radial-gradient(circle, rgba(86,142,163,.08), transparent 70%);
  overflow: hidden;
}

.mind-node {
  position: absolute;
  min-width: 120px;
  padding: 10px 14px;
  border-radius: 999px;
  background: #fff;
  border: 2px solid var(--brand-2);
  box-shadow: 0 8px 20px rgba(31, 41, 51, .12);
  text-align: center;
  font-weight: 800;
}

.mind-node.center {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #fff4d7;
  border-color: var(--accent);
}

.mind-branch { position: absolute; inset: 0; pointer-events: none; }
.mind-branch span {
  position: absolute;
  height: 3px;
  background: var(--brand-2);
  transform-origin: left center;
}
.mind-branch .mind-node { pointer-events: auto; }
.branch-1 span { left: 50%; top: 50%; width: 210px; transform: rotate(-35deg); }
.branch-1 .mind-node { left: 12%; top: 16%; }
.branch-2 span { left: 50%; top: 50%; width: 210px; transform: rotate(35deg); }
.branch-2 .mind-node { right: 12%; top: 16%; }
.branch-3 span { left: 50%; top: 50%; width: 210px; transform: rotate(145deg); }
.branch-3 .mind-node { left: 12%; bottom: 16%; }
.branch-4 span { left: 50%; top: 50%; width: 210px; transform: rotate(-145deg); }
.branch-4 .mind-node { right: 12%; bottom: 16%; }

.drawing-tool {
  background: #fff;
}

.drawing-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}

.drawing-toolbar label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-weight: 700;
}

.drawing-canvas {
  width: 100%;
  min-height: 280px;
  border: 2px solid #cfd8dc;
  border-radius: 14px;
  background: #fff;
  touch-action: none;
  cursor: crosshair;
}

.drawing-hint {
  margin-bottom: 0;
  color: var(--muted);
  font-size: .92rem;
}

@media (max-width: 860px) {
  .bar-chart-template { overflow-x: auto; }
  .mind-map { min-height: 460px; }
  .mind-node { min-width: 96px; font-size: .9rem; }
  .drawing-canvas { min-height: 360px; }
}

@media print {
  .drawing-toolbar button,
  .drawing-toolbar label { display: none !important; }
  .study-tool-block { break-inside: avoid; }
}

.rich-editor > * {
  max-width: 100%;
}

.rich-editor p,
.rich-editor div,
.rich-editor table {
  clear: both;
}

.graph-tool,
.mind-map-tool,
.drawing-tool {
  min-height: fit-content;
}

.graph-tool::after,
.mind-map-tool::after,
.drawing-tool::after,
.study-tool-block::after {
  content: "";
  display: table;
  clear: both;
}

.study-table {
  table-layout: auto;
  min-width: 520px;
}

.bar-chart-template {
  width: 100%;
  min-width: 560px;
  box-sizing: border-box;
}

.mind-map {
  width: 100%;
  min-width: 560px;
  box-sizing: border-box;
}

.drawing-tool {
  overflow: visible;
}

.drawing-canvas {
  display: block;
  box-sizing: border-box;
}

.tool-spacer {
  display: block;
  clear: both;
  height: 18px;
}

.chart-builder {
  background: #ffffff;
}

.chart-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 12px;
}

.chart-title-input,
.chart-toolbar select,
.chart-data-row input {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: .58rem .7rem;
  background: #fffdfa;
}

.chart-title-input {
  min-width: min(280px, 100%);
  font-weight: 800;
}

.chart-data-grid {
  display: grid;
  gap: 8px;
  margin: 12px 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fbfaf7;
}

.chart-data-row {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) 120px auto;
  gap: 8px;
  align-items: center;
}

.chart-output {
  width: 100%;
  overflow-x: auto;
  padding: 12px;
  border: 1px solid #cfd8dc;
  border-radius: 16px;
  background: #fffdfa;
}

.chart-svg {
  display: block;
  width: 100%;
  min-width: 620px;
  height: auto;
}

@media (max-width: 860px) {
  .chart-data-row { grid-template-columns: 1fr; }
  .chart-toolbar > * { flex: 1 1 auto; }
}

.note-image {
  display: block;
  clear: both;
  margin: 22px 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  text-align: center;
  --image-width: 80%;
  position: relative;
}

.image-resize-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 10px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fbfaf7;
  color: var(--muted);
  font-weight: 700;
}

.image-resize-toolbar label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.image-resize-toolbar input[type="range"] {
  width: min(260px, 52vw);
}

.note-image img {
  width: var(--image-width, 80%);
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto 8px;
  border-radius: 12px;
  border: 1px solid var(--line);
}

.note-image figcaption {
  color: var(--muted);
  font-size: .92rem;
  outline: none;
}

.image-resize-handle {
  position: absolute;
  right: calc((100% - var(--image-width, 80%)) / 2 - 10px);
  bottom: 48px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 999px;
  background: var(--brand);
  color: #fff;
  box-shadow: 0 8px 18px rgba(31,41,51,.24);
  cursor: nwse-resize;
  touch-action: none;
  user-select: none;
  z-index: 4;
}

.image-resize-handle:hover,
.note-image.is-resizing .image-resize-handle {
  background: var(--accent);
  color: #4b3710;
  transform: scale(1.06);
}

.note-image.is-resizing img {
  outline: 3px dashed var(--accent);
  outline-offset: 4px;
}

@media print {
  .image-resize-toolbar,
  .image-resize-handle { display: none !important; }
}

.color-control-wrap {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.recent-color-palette {
  position: relative;
  display: inline-block;
}

.recent-color-palette summary {
  list-style: none;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--current-color, #305f72);
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.7), 0 0 0 1px rgba(31,41,51,.18);
  color: transparent;
  cursor: pointer;
}

.recent-color-palette summary::-webkit-details-marker { display: none; }

.color-swatch-menu {
  position: absolute;
  top: 34px;
  left: 0;
  z-index: 12;
  display: grid;
  grid-template-columns: repeat(4, 24px);
  gap: 5px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 14px 28px rgba(31,41,51,.18);
}

.color-swatch {
  width: 24px;
  height: 24px;
  min-width: 24px;
  padding: 0;
  border: 2px solid rgba(31,41,51,.2);
  border-radius: 999px;
  background: var(--swatch);
  box-shadow: none;
}

.color-swatch:hover {
  transform: scale(1.12);
  box-shadow: 0 4px 10px rgba(31,41,51,.18);
}

@media print {
  .recent-color-palette { display: none !important; }
}

.guideline-list-box {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fffdfa;
}

.guideline-list-help {
  color: var(--muted);
  font-size: .92rem;
}

.guideline-item {
  display: grid;
  grid-template-columns: auto minmax(120px, .8fr) minmax(180px, 1.4fr) auto;
  gap: 8px;
  align-items: stretch;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}

.guideline-go {
  border-radius: 12px;
  background: var(--success);
  min-width: 54px;
}

.guideline-main-fields {
  display: grid;
  gap: 5px;
}

.guideline-label,
.guideline-details {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: .62rem .7rem;
  background: #fff;
}

.guideline-details {
  min-height: 46px;
  resize: vertical;
}

.guideline-link-status {
  color: var(--muted);
  font-size: .78rem;
}

.guideline-anchor {
  display: inline-grid;
  place-items: center;
  width: 1.35em;
  height: 1.35em;
  margin: 0 .12em;
  border-radius: 999px;
  background: rgba(48,95,114,.13);
  color: var(--brand);
  font-size: .82em;
  vertical-align: text-top;
}

.guideline-temp-highlight,
.guideline-anchor-active {
  background: #fff09a;
  color: #1f2933;
  box-shadow: 0 0 0 5px rgba(242,184,75,.34);
  border-radius: 5px;
  transition: background 1.4s ease, box-shadow 1.4s ease;
}

.guideline-temp-highlight.fade-highlight,
.guideline-anchor-active.fade-highlight {
  background: rgba(255,240,154,.35);
  box-shadow: 0 0 0 2px rgba(242,184,75,.12);
}

@media (max-width: 860px) {
  .guideline-item { grid-template-columns: 1fr; }
}

.tag-preview {
  margin: 12px 0;
  padding: 12px 14px;
  border-left: 5px solid var(--accent);
  border-radius: 12px;
  background: #fffdfa;
  color: var(--ink);
  max-height: 180px;
  overflow: auto;
}

.modal-label {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-weight: 800;
}

.modal-select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: .75rem .8rem;
  background: #fff;
  color: var(--ink);
}

.selection-popup {
  position: absolute;
  z-index: 100;
  display: none;
  gap: 6px;
  padding: 6px;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 999px;
  background: rgba(31,41,51,.96);
  box-shadow: 0 12px 26px rgba(31,41,51,.28);
}

.selection-popup.open { display: inline-flex; }

.selection-popup button {
  padding: .45rem .72rem;
  border-radius: 999px;
  background: #fff;
  color: var(--brand);
  font-size: .88rem;
  font-weight: 800;
}

.selection-popup button:hover {
  background: #fff4d7;
  transform: none;
  box-shadow: none;
}

.layout.sidebar-collapsed {
  grid-template-columns: minmax(0, 1fr);
}

.layout.sidebar-collapsed .sidebar {
  display: none;
}

.layout.sidebar-collapsed .content-panel {
  max-width: none;
}

.content-panel {
  width: 100%;
}

.chapter-title-wrap,
.chapter-title-wrap input,
.chapter-title-wrap p input {
  max-width: 100%;
}

.notes-area {
  min-height: 260px;
  font-size: 1.02rem;
}

textarea[data-action="chapter-summary"] {
  min-height: 320px;
}

.guideline-details {
  min-height: 82px;
}

.rich-editor {
  min-height: 720px;
  font-size: 1.04rem;
}

.category-body {
  gap: 16px;
}

@media (min-width: 1100px) {
  .app-shell { max-width: 1480px; }
  .layout { grid-template-columns: 320px minmax(0, 1fr); }
  .content-panel { padding: clamp(24px, 3.5vw, 46px); }
}

@media (max-width: 860px) {
  .layout.sidebar-collapsed .sidebar { display: none; }
  .notes-area { min-height: 220px; }
  textarea[data-action="chapter-summary"] { min-height: 260px; }
  .rich-editor { min-height: 620px; }
}


.backup-reminder {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 14px 0;
  padding: 12px 14px;
  border: 1px solid rgba(242,184,75,.45);
  border-radius: 16px;
  background: #fff4d7;
  color: var(--ink);
}

.backup-reminder[hidden] { display: none; }

.eyebrow {
  margin: 0 0 8px;
  color: var(--brand);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 900;
  font-size: .78rem;
}

.license-modal.open {
  display: grid;
}

.license-card {
  border-top: 8px solid var(--brand);
}

.modal-input,
.modal-select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: .75rem .85rem;
  margin-top: 6px;
}

.license-message {
  min-height: 1.4em;
  color: var(--danger);
  font-weight: 800;
}

.license-message.success { color: var(--success); }

.help-card ol {
  padding-left: 1.2rem;
}

body.license-locked .app-shell {
  filter: blur(3px);
  pointer-events: none;
  user-select: none;
}

/* Next-version test features */
.sidebar { position: relative; }
.sidebar-strip-toggle {
  position: sticky;
  top: 8px;
  float: right;
  border: 1px solid var(--line);
  background: #fffdfa;
  color: var(--brand);
  border-radius: 999px;
  width: 34px;
  height: 34px;
  padding: 0;
  display: inline-grid;
  place-items: center;
}
.layout.sidebar-collapsed::before {
  content: '›';
  position: fixed;
  left: 8px;
  top: 50%;
  z-index: 25;
  width: 28px;
  height: 56px;
  border-radius: 0 999px 999px 0;
  background: var(--brand);
  color: white;
  display: grid;
  place-items: center;
  font-size: 2rem;
  box-shadow: var(--shadow);
}

.subpage-group {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fffdfa;
  padding: 8px;
}
.subpage-group > summary {
  cursor: pointer;
  font-weight: 800;
  color: var(--brand);
  padding: 8px 10px;
}
.subpage-group > summary span { color: var(--muted); font-weight: 600; margin-left: 8px; }
.subpage-input {
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: .45rem .55rem;
  min-width: 120px;
}
.page-marker-strip,
.page-marker-menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.tiny-marker {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 8px;
  padding: 2px 5px;
  min-height: 24px;
  font-size: .92rem;
}
.inline-marker {
  display: inline-grid;
  place-items: center;
  min-width: 1.4em;
  padding: 0 .2em;
  border-radius: 6px;
  background: rgba(48,95,114,.12);
}

.chapter-overview-panel,
.guideline-workspace {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--shadow-soft);
}
.tag-title-overview { display: grid; gap: 6px; }
.tag-title-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto auto;
  gap: 5px;
  align-items: center;
  border-left: 8px solid var(--tag-color, #fff3b0);
  padding: 5px;
  background: #fffdfa;
  border-radius: 10px;
}
.tag-title-jump {
  text-align: left;
  justify-content: flex-start;
  background: transparent;
  color: var(--ink);
  border: 1px solid var(--line);
}

.compact-guideline {
  position: relative;
  grid-template-columns: 8px 34px 120px 70px minmax(160px, 1fr) 54px 42px auto 32px;
  gap: 5px;
  padding: 6px;
  align-items: center;
}
.tag-color-strip {
  align-self: stretch;
  border-radius: 10px;
  background: var(--tag-color, #fff3b0);
}
.guideline-go {
  min-width: 30px;
  min-height: 30px;
  padding: 0;
  border-radius: 9px;
  font-size: .9rem;
}
.guideline-type,
.guideline-icon-select,
.guideline-color {
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fff;
  min-height: 30px;
  padding: .25rem;
}
.guideline-color { width: 40px; padding: 0; }
.guideline-link-status { font-size: .7rem; }
.guideline-details-wrap summary {
  cursor: pointer;
  list-style: none;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #fffdfa;
  min-width: 30px;
  min-height: 30px;
  display: grid;
  place-items: center;
}
.guideline-details-wrap summary::-webkit-details-marker { display: none; }
.guideline-details-wrap[open] {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 32px minmax(180px, 1fr) minmax(180px, 1fr);
  gap: 6px;
  align-items: start;
}
.guideline-scenario {
  min-height: 46px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: .62rem .7rem;
}
.compact-delete { min-width: 28px; padding: .2rem .35rem; }

.rich-editor.is-empty-starter:empty::before {
  content: attr(data-placeholder);
  color: var(--muted);
  pointer-events: none;
}

.density-controls { display: flex; gap: 5px; flex-wrap: wrap; }
.workspace-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(240px, 1fr));
  gap: 12px;
}
.workspace-card {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fffdfa;
  padding: 12px;
}
.workspace-card h4 { margin: 0 0 8px; color: var(--brand); }
.mini-tag-cloud { display: flex; gap: 5px; flex-wrap: wrap; }
.mini-tag-cloud span {
  border-left: 6px solid var(--tag-color, #fff3b0);
  background: #fff;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: .82rem;
}
.workspace-link {
  display: block;
  width: 100%;
  margin: 4px 0;
  text-align: left;
  background: white;
  color: var(--ink);
  border: 1px solid var(--line);
}
.workspace-grid.compact .workspace-card { max-height: 180px; overflow: auto; }
.workspace-grid.expanded { grid-template-columns: 1fr; }

@media (max-width: 980px) {
  .compact-guideline { grid-template-columns: 8px 32px 1fr 44px; }
  .guideline-type,
  .guideline-icon-select,
  .guideline-link-status,
  .guideline-color { grid-column: span 1; }
  .workspace-grid { grid-template-columns: 1fr; }
}

/* All-updates test build refinements */
.chapter-links-panel,
.chapter-table-panel {
  margin: 18px 0;
  padding: 16px;
  border: 1px solid rgba(48, 95, 114, 0.18);
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff, #fffdfa);
  box-shadow: 0 12px 30px rgba(48, 95, 114, 0.08);
}

.chapter-link-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 12px;
}

.chapter-link-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border-radius: 999px;
  background: #eef7fb;
  border: 1px solid rgba(48, 95, 114, 0.16);
  font-size: 0.9rem;
}

.chapter-link-pill a {
  color: #1f4e5f;
  font-weight: 700;
  text-decoration: none;
}

.chapter-link-pill small {
  color: #6c7a80;
}

.mini-danger {
  border: 0;
  background: #ffe2e2;
  color: #8a1f1f;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  cursor: pointer;
  font-weight: 800;
}

.dedicated-link-row {
  margin-top: 8px;
}

.guideline-links-note {
  margin-top: 10px;
  padding: 8px 10px;
  border-radius: 12px;
  background: #f7fafb;
  color: #62727a;
  font-size: 0.84rem;
}

.chapter-mode-editor {
  min-height: 150px;
  padding: 14px;
  border: 1px dashed rgba(48, 95, 114, 0.35);
  border-radius: 14px;
  background: #fffef8;
  outline: none;
  overflow: auto;
}

.chapter-mode-editor:empty::before {
  content: attr(data-placeholder);
  color: #9aa7ad;
}

.subpage-list {
  margin-left: 18px;
  padding-left: 14px;
  border-left: 3px solid rgba(48, 95, 114, 0.16);
}

.subpage-tile {
  background: #fbfdff;
  transform: scale(0.99);
}

.empty-subpage-note {
  margin: 8px 0 12px 18px;
  color: #7b8b92;
  font-size: 0.88rem;
  font-style: italic;
}

.page-tile-tools .secondary {
  white-space: nowrap;
}

/* Guidelines filter/sort controls */
.guideline-filter-heading {
  align-items: flex-end;
  gap: 12px;
}

.guideline-filter-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.guideline-filter-controls label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.88rem;
  font-weight: 700;
  color: #46616b;
}

.guideline-filter-controls select {
  min-width: 220px;
  border: 1px solid rgba(48, 95, 114, 0.24);
  border-radius: 10px;
  padding: 7px 10px;
  background: #fff;
  color: #243b45;
  font-weight: 700;
}

.category[hidden] {
  display: none !important;
}

/* Guideline-focused chapter view */
.guideline-focus-intro {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 16px 0 18px;
  padding: 14px 16px;
  border: 1px solid rgba(48, 95, 114, 0.18);
  border-radius: 18px;
  background: linear-gradient(135deg, #f3fbff, #fffdfa);
  box-shadow: 0 10px 24px rgba(48, 95, 114, 0.07);
}

.guideline-focus-intro h3 {
  margin: 0 0 4px;
  color: #244653;
}

.guideline-focus-intro p {
  margin: 0;
  color: #62727a;
  line-height: 1.45;
}

/* Tag search and marker sorting */
.guideline-filter-controls .tag-search-input {
  min-width: 270px;
  border: 1px solid rgba(48, 95, 114, 0.24);
  border-radius: 10px;
  padding: 7px 10px;
  background: #fff;
  color: #243b45;
  font-weight: 700;
}

.guideline-filter-controls .tag-search-input::placeholder {
  color: #8ea0a8;
  font-weight: 600;
}

/* Guideline cleanup pass */
.book-description-field {
  display: block;
  width: min(760px, 100%);
  min-height: 70px;
  margin-top: 8px;
  padding: 12px 14px;
  border: 1px solid rgba(48, 95, 114, 0.18);
  border-radius: 12px;
  background: #fffdfa;
  color: #243b45;
  font-size: 0.98rem;
  line-height: 1.45;
  resize: vertical;
}

.floating-top-button {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 40;
  border: 1px solid rgba(48, 95, 114, 0.24);
  border-radius: 999px;
  background: #305f72;
  color: #ffffff;
  font-weight: 900;
  font-size: 0.82rem;
  padding: 9px 12px;
  box-shadow: 0 12px 24px rgba(31, 41, 51, 0.22);
  cursor: pointer;
}

.floating-top-button:hover {
  background: #244653;
}

.compact-help {
  padding: 4px 6px;
  margin-bottom: 6px;
  font-size: 0.78rem;
  color: #6b7b83;
}

.ultra-compact-guideline {
  display: grid;
  grid-template-columns: 4px minmax(92px, 125px) minmax(62px, 82px) minmax(180px, 1.15fr) minmax(170px, 1fr) minmax(140px, 0.8fr) 34px 26px;
  gap: 5px;
  align-items: stretch;
  padding: 5px 6px;
  margin: 4px 0;
  border-radius: 10px;
}

.ultra-compact-guideline .tag-color-strip {
  width: 4px;
  min-height: 100%;
  border-radius: 8px;
}

.ultra-compact-guideline select,
.ultra-compact-guideline input,
.ultra-compact-guideline textarea {
  min-height: 30px;
  border-radius: 8px;
  font-size: 0.78rem;
}

.guideline-label-textarea,
.inline-guideline-details,
.inline-guideline-scenario {
  resize: vertical;
  height: 34px;
  min-height: 30px;
  padding: 6px 8px;
  line-height: 1.25;
}

.guideline-label-textarea {
  font-weight: 800;
}

.inline-guideline-details,
.inline-guideline-scenario {
  font-size: 0.76rem;
}

.ultra-compact-guideline .guideline-color {
  width: 34px;
  padding: 1px;
}

.ultra-compact-guideline .compact-delete {
  width: 26px;
  min-width: 26px;
  padding: 0;
}

@media (max-width: 1180px) {
  .ultra-compact-guideline {
    grid-template-columns: 4px minmax(90px, 1fr) minmax(60px, 0.7fr) 1fr;
  }
  .ultra-compact-guideline .guideline-color,
  .ultra-compact-guideline .compact-delete {
    width: auto;
  }
}

/* Marker management and tag safety updates */
.book-description-plain {
  margin: 8px 0 0;
  color: #3f5661;
  font-size: 0.98rem;
  line-height: 1.45;
  font-weight: 700;
}

.undo-delete-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0 12px;
  padding: 10px 12px;
  border: 1px solid rgba(189, 91, 55, 0.26);
  border-radius: 12px;
  background: #fff4ec;
  color: #7b341e;
  font-weight: 800;
}

.textarea-default-collapsed {
  height: 30px !important;
  min-height: 30px !important;
  overflow: hidden;
}

.marker-manager-page {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.marker-rename-row {
  display: grid;
  grid-template-columns: 56px minmax(170px, 260px) minmax(220px, 1fr);
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(48, 95, 114, 0.16);
  border-radius: 14px;
  background: #fffdfa;
  box-shadow: 0 8px 18px rgba(48, 95, 114, 0.06);
}

.marker-rename-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #eef8fb;
  font-size: 1.35rem;
}

.marker-default-name {
  color: #62727a;
  font-size: 0.88rem;
  font-weight: 800;
}

.marker-rename-row input {
  width: 100%;
  border: 1px solid rgba(48, 95, 114, 0.24);
  border-radius: 10px;
  padding: 10px 12px;
  color: #243b45;
  font-weight: 800;
}

.icon-option {
  min-height: 64px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.icon-option span {
  font-size: 1.35rem;
}

.icon-option small {
  max-width: 92px;
  color: #536872;
  font-size: 0.66rem;
  line-height: 1.15;
  text-align: center;
}

@media (max-width: 760px) {
  .marker-rename-row {
    grid-template-columns: 44px 1fr;
  }
  .marker-rename-row input {
    grid-column: 1 / -1;
  }
}


/* Index tab, details expand/collapse, and tag editing fixes */
.toolbar #sidebarToggle {
  display: none;
}

.layout {
  position: relative;
}

.sidebar-strip-toggle {
  position: sticky !important;
  top: 14px;
  align-self: start;
  z-index: 50;
  width: auto !important;
  height: auto !important;
  min-height: 30px;
  padding: 4px 8px !important;
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  border-radius: 999px !important;
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 6px 16px rgba(31,41,51,.12);
}

.sidebar-strip-arrow {
  font-size: 1rem;
  line-height: 1;
}

.layout.sidebar-collapsed {
  grid-template-columns: auto minmax(0, 1fr) !important;
}

.layout.sidebar-collapsed .sidebar {
  display: none !important;
}

.layout.sidebar-collapsed::before {
  content: none !important;
}

.index-compact-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  margin-bottom: 6px;
}

.tiny-index-control {
  min-height: 20px !important;
  padding: 2px 5px !important;
  border-radius: 6px !important;
  font-size: 0.62rem !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

.book-nav {
  gap: 5px !important;
}

.book-nav details {
  border-radius: 9px !important;
}

.book-nav summary {
  padding: 0.38rem 0.52rem !important;
  font-size: 0.82rem;
}

.chapter-list {
  gap: 2px !important;
  padding: 0 5px 5px !important;
}

.chapter-link {
  padding: 0.28rem 0.4rem !important;
  border-radius: 6px !important;
  font-size: 0.76rem;
  line-height: 1.15;
}

.category-title-line {
  flex: 1 1 320px;
}

.category-title {
  min-height: 34px !important;
  padding: 6px 9px !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  border-radius: 9px !important;
  background: #fff !important;
  font-size: 0.92rem;
  font-weight: 850;
}

.category-tools .small {
  min-height: 26px;
  padding: 4px 7px;
  font-size: 0.68rem;
}

.ultra-compact-guideline {
  grid-template-columns: 4px 122px 118px minmax(230px, 300px) minmax(230px, 1fr) minmax(190px, 0.85fr) 34px 26px !important;
  overflow-x: auto;
}

.ultra-compact-guideline .guideline-type,
.ultra-compact-guideline .guideline-icon-select,
.ultra-compact-guideline .guideline-label-textarea {
  width: 100% !important;
  min-width: 0 !important;
  resize: none !important;
}

.guideline-detail-fieldset {
  min-width: 0;
  width: 100%;
}

.inline-guideline-details,
.inline-guideline-scenario {
  width: 100% !important;
  min-width: 0 !important;
  height: 48px !important;
  min-height: 48px !important;
  resize: vertical !important;
  user-select: text;
  pointer-events: auto;
}

.textarea-default-collapsed {
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  overflow: hidden !important;
  resize: none !important;
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

.textarea-default-expanded {
  height: 96px !important;
  min-height: 72px !important;
  max-height: none !important;
  resize: vertical !important;
}

@media (max-width: 1180px) {
  .ultra-compact-guideline {
    grid-template-columns: 4px 118px 108px minmax(220px, 1fr) !important;
  }
  .guideline-detail-fieldset,
  .ultra-compact-guideline .guideline-color,
  .ultra-compact-guideline .compact-delete {
    grid-column: 2 / -1;
    width: auto !important;
  }
}


/* Final sidebar/index cleanup: arrow-only floating toggle that does not create a layout column. */
.layout {
  position: relative;
}

.layout.sidebar-collapsed,
.layout.sidebar-collapsed:not(.anything) {
  grid-template-columns: minmax(0, 1fr) !important;
}

.layout:not(.sidebar-collapsed) {
  grid-template-columns: minmax(210px, 250px) minmax(0, 1fr) !important;
}

.sidebar-strip-toggle {
  position: absolute !important;
  left: 8px !important;
  top: 8px !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  padding: 0 !important;
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0 !important;
  z-index: 75 !important;
  border-radius: 999px !important;
  font-size: 0.9rem !important;
}

.sidebar-strip-label {
  display: none !important;
}

.sidebar {
  margin-left: 0 !important;
  padding-top: 38px !important;
}

.layout.sidebar-collapsed .sidebar {
  display: none !important;
}

.layout.sidebar-collapsed .content-panel {
  margin-left: 0 !important;
  max-width: none !important;
}

/* Compact tag rows by default, with no native color-picker column. */
.ultra-compact-guideline {
  position: relative !important;
  grid-template-columns: 7px 94px 78px minmax(210px, 270px) minmax(210px, 1fr) minmax(170px, 0.82fr) 24px !important;
  gap: 4px !important;
  padding: 4px 5px !important;
  align-items: stretch !important;
  overflow: visible !important;
}

.ultra-compact-guideline .guideline-type,
.ultra-compact-guideline .guideline-icon-select {
  min-width: 0 !important;
  width: 100% !important;
  height: 25px !important;
  min-height: 25px !important;
  padding: 2px 4px !important;
  font-size: 0.68rem !important;
  line-height: 1.05 !important;
}

.ultra-compact-guideline .guideline-label-textarea {
  min-width: 0 !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 4px 5px !important;
  font-size: 0.72rem !important;
}

.ultra-compact-guideline .tag-color-strip {
  width: 7px !important;
  min-width: 7px !important;
  height: auto !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--tag-color) !important;
  cursor: pointer !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.12), 0 0 0 2px rgba(255,255,255,.7) !important;
}

.ultra-compact-guideline .tag-color-strip:hover,
.ultra-compact-guideline .tag-color-strip:focus-visible {
  width: 11px !important;
  outline: 2px solid rgba(31,41,51,.22) !important;
  outline-offset: 1px !important;
}

.guideline-color {
  display: none !important;
}

.ultra-compact-guideline .compact-delete {
  width: 24px !important;
  min-width: 24px !important;
  height: 25px !important;
  min-height: 25px !important;
  padding: 0 !important;
  font-size: 0.8rem !important;
}

.tag-strip-palette {
  display: none;
  position: absolute;
  left: 12px;
  top: 30px;
  z-index: 90;
  width: min(420px, calc(100vw - 80px));
  padding: 10px;
  border: 1px solid rgba(31,41,51,.14);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(31,41,51,.18);
}

.guideline-item.show-tag-palette .tag-strip-palette {
  display: block;
}

.tag-strip-palette-section + .tag-strip-palette-section {
  margin-top: 8px;
}

.tag-strip-palette-title {
  margin: 0 0 5px;
  font-size: 0.68rem;
  font-weight: 900;
  color: #52606d;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.tag-strip-swatch-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.tag-strip-swatch {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  padding: 0 !important;
  border: 1px solid rgba(31,41,51,.18) !important;
  border-radius: 999px !important;
  background: var(--swatch) !important;
  box-shadow: none !important;
}

.tag-strip-swatch.selected {
  outline: 3px solid rgba(31,41,51,.35) !important;
  outline-offset: 1px;
}

@media (max-width: 980px) {
  .layout:not(.sidebar-collapsed),
  .layout.sidebar-collapsed {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .ultra-compact-guideline {
    grid-template-columns: 7px minmax(80px, 1fr) minmax(70px, 1fr) !important;
    overflow-x: visible !important;
  }
  .tag-strip-palette {
    left: 0;
    width: min(360px, calc(100vw - 40px));
  }
}


/* Marker/color cleanup batch: cleaner tag headers.
   (Positioning is handled by the highlight-style override at end of file.) */
.tag-strip-palette {
  z-index: 999 !important;
  overscroll-behavior: contain;
}

.guideline-item.show-tag-palette .tag-strip-palette {
  display: block !important;
}

.guideline-item.palette-opens-up .tag-strip-palette {
  box-shadow: 0 -16px 40px rgba(31,41,51,.18) !important;
}

.category-tools {
  gap: 4px !important;
}


/* Chapter/tag editing workflow cleanup. */
.chapter-header {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
}

.chapter-title-wrap {
  width: 100% !important;
  max-width: none !important;
}

.chapter-title-wrap input,
.chapter-index-main input {
  width: 100% !important;
  max-width: none !important;
  min-width: min(760px, 100%) !important;
}

.chapter-index-row {
  grid-template-columns: 44px minmax(620px, 1fr) auto !important;
}

.blank-guideline-entry {
  width: 100%;
  min-height: 96px;
  padding: 18px;
  border: 1px dashed rgba(48,95,114,.35);
  border-radius: 16px;
  background: #fffdfa;
  color: #52606d;
  text-align: left;
  font-weight: 750;
  box-shadow: none;
  cursor: text;
}

.blank-guideline-entry:hover,
.blank-guideline-entry:focus-visible {
  border-color: rgba(48,95,114,.75);
  background: #fff;
  outline: none;
}

.plain-empty-state {
  border-radius: 12px;
  box-shadow: none;
}

.simple-undo-banner {
  display: flex;
  justify-content: flex-start;
  padding: 4px 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.guideline-row-active,
.category.guideline-row-active {
  outline: 3px solid rgba(48,95,114,.35);
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(205,239,253,.55) !important;
}

.category-title::placeholder,
.guideline-label-textarea::placeholder {
  color: #7b8794;
}


/* Guidelines workflow cleanup. */
.guideline-filter-heading {
  align-items: start !important;
}

.guideline-filter-controls {
  display: grid !important;
  grid-template-columns: auto minmax(210px, 210px) minmax(190px, 190px) minmax(190px, 190px) auto auto auto auto !important;
  align-items: end !important;
  width: 100% !important;
}

.guideline-filter-controls label,
.guideline-filter-controls input,
.guideline-filter-controls select {
  width: 100% !important;
  max-width: 100% !important;
}

.empty-guideline-item-prompt {
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px dashed rgba(48,95,114,.35);
  border-radius: 12px;
  background: #fffdfa;
  color: #52606d;
  text-align: left;
  font-weight: 750;
  box-shadow: none;
  cursor: text;
}

.empty-guideline-item-prompt:hover,
.empty-guideline-item-prompt:focus-visible {
  border-color: rgba(48,95,114,.75);
  background: #fff;
  outline: none;
}

.ultra-compact-guideline {
  grid-template-columns: 56px 7px 94px 78px minmax(210px, 270px) minmax(210px, 1fr) minmax(170px, 0.82fr) 24px !important;
}

.sequence-code-box {
  width: 100% !important;
  min-width: 0 !important;
  height: 25px !important;
  min-height: 25px !important;
  padding: 3px 5px !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  border-radius: 8px !important;
  resize: vertical !important;
  font-size: 0.68rem !important;
  font-weight: 800;
  background: #fff !important;
}

.sequence-code-box.textarea-default-expanded,
.guideline-label-textarea.textarea-default-expanded {
  height: 72px !important;
  min-height: 56px !important;
  max-height: none !important;
  overflow: auto !important;
}

.sequence-code-box.textarea-default-collapsed,
.guideline-label-textarea.textarea-default-collapsed {
  height: 25px !important;
  min-height: 25px !important;
  max-height: 25px !important;
  overflow: hidden !important;
}

.prominent-guideline-map {
  padding: 20px !important;
  background: linear-gradient(135deg, #fffdfa, #f4fbfd) !important;
}

.guideline-map-grid {
  display: block !important;
}

.guideline-map-card {
  max-height: none !important;
  min-height: 160px;
  padding: 18px !important;
}

.prominent-tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.map-tag {
  border: 1px solid rgba(31,41,51,.12) !important;
  border-left: 8px solid var(--tag-color, #fff3b0) !important;
  border-radius: 12px !important;
  background: #fff !important;
  padding: 8px 10px !important;
  font-size: 0.86rem !important;
  font-weight: 850 !important;
  color: var(--ink) !important;
  box-shadow: 0 8px 18px rgba(31,41,51,.08) !important;
}

@media (max-width: 1100px) {
  .guideline-filter-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .ultra-compact-guideline {
    grid-template-columns: 48px 7px minmax(80px, 1fr) minmax(70px, 1fr) !important;
  }
}

/* Wider Sequence Code Box for Guidelines rows. */
.ultra-compact-guideline {
  grid-template-columns: minmax(112px, 140px) 7px 94px 78px minmax(210px, 270px) minmax(210px, 1fr) minmax(170px, 0.82fr) 24px !important;
}

.sequence-code-box {
  min-width: 112px !important;
  font-size: 0.74rem !important;
}

@media (max-width: 1100px) {
  .ultra-compact-guideline {
    grid-template-columns: minmax(104px, 1fr) 7px minmax(80px, 1fr) minmax(70px, 1fr) !important;
  }
}

/* Sequence code display in At a Glance. */
.summary-sequence-code {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 180px;
  padding: 2px 7px;
  margin-right: 4px;
  border-radius: 999px;
  background: rgba(48, 95, 114, 0.12);
  color: #244d5c;
  font-weight: 900;
  font-size: 0.76rem;
  line-height: 1.2;
  white-space: pre-wrap;
  vertical-align: middle;
}


/* Sequence Stack: Primary › Secondary › Tertiary › Detail. */
.ultra-compact-guideline {
  grid-template-columns: minmax(210px, 260px) 7px 94px 78px minmax(210px, 270px) minmax(210px, 1fr) minmax(170px, 0.82fr) 24px !important;
}

.sequence-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 5px;
  align-self: stretch;
  padding: 4px;
  border: 1px solid rgba(48,95,114,.18);
  border-radius: 10px;
  background: linear-gradient(180deg, #fff, #fbfaf7);
}

.sequence-stack-field {
  display: grid !important;
  gap: 2px !important;
  margin: 0 !important;
  min-width: 0;
}

.sequence-stack-field span {
  font-size: 0.56rem;
  line-height: 1;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: #52606d;
  white-space: nowrap;
}

.sequence-stack-field input {
  width: 100% !important;
  min-width: 0 !important;
  height: 23px !important;
  min-height: 23px !important;
  padding: 2px 5px !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  border-radius: 7px !important;
  background: #fff !important;
  font-size: 0.72rem !important;
  font-weight: 850;
}

.sequence-level-1 input {
  border-width: 2px !important;
  font-weight: 950 !important;
}

.sequence-level-2 {
  padding-left: 3px;
}

.sequence-level-3 {
  padding-left: 8px;
}

.sequence-level-4 {
  padding-left: 12px;
}

.sequence-stack input.textarea-default-expanded {
  height: 30px !important;
}

.sequence-stack input.textarea-default-collapsed {
  height: 23px !important;
}

.summary-sequence-code {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 280px;
  padding: 2px 8px;
  margin-right: 5px;
  border-radius: 999px;
  border: 1px solid rgba(48,95,114,.18);
  background: rgba(48,95,114,0.08);
  color: #244d5c;
  font-weight: 900;
  font-size: 0.76rem;
  line-height: 1.2;
  vertical-align: middle;
}

.sequence-path-separator {
  opacity: .62;
  font-weight: 950;
}

@media (max-width: 1100px) {
  .ultra-compact-guideline {
    grid-template-columns: minmax(190px, 1fr) 7px minmax(80px, 1fr) minmax(70px, 1fr) !important;
  }
}


/* Guidelines header cleanup and exception workflow. */
.guideline-filter-heading {
  display: grid !important;
  grid-template-columns: minmax(160px, auto) minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: start !important;
}

.clean-glt-controls {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
}

.glt-control-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: end !important;
  width: 100% !important;
}

.glt-control-row-primary {
  display: grid !important;
  grid-template-columns: auto minmax(320px, 1fr) !important;
}

.glt-control-row-filters {
  justify-content: flex-end !important;
}

.glt-control-row label {
  display: grid !important;
  gap: 3px !important;
  min-width: 170px !important;
  margin: 0 !important;
}

.glt-search-control {
  min-width: min(560px, 100%) !important;
}

.glt-control-row button {
  white-space: nowrap !important;
}

.guideline-column-heading {
  display: grid;
  grid-template-columns: minmax(210px, 260px) 7px 94px 78px minmax(210px, 270px) minmax(210px, 1fr) minmax(170px, 0.82fr) 24px;
  gap: 5px;
  align-items: end;
  padding: 0 2px 5px;
  color: #52606d;
  font-size: .63rem;
  font-weight: 900;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.sequence-shared-heading {
  color: #244d5c;
}

.sequence-stack {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 4px !important;
  padding: 4px !important;
}

.sequence-stack-input {
  width: 100% !important;
  min-width: 0 !important;
  height: 25px !important;
  min-height: 25px !important;
  padding: 2px 5px !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  border-radius: 7px !important;
  background: #fff !important;
  font-size: .72rem !important;
  font-weight: 850 !important;
}

.sequence-level-1 {
  border-width: 2px !important;
  font-weight: 950 !important;
}

.scenario-exception-fieldset {
  display: grid;
  gap: 4px;
  align-self: stretch;
}

.exception-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  width: fit-content !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 2px 6px !important;
  border: 1px solid rgba(48,95,114,.18);
  border-radius: 999px;
  background: #fff;
  color: #334e68;
  font-size: .68rem !important;
  font-weight: 900 !important;
  line-height: 1.1;
}

.exception-toggle input {
  width: 13px !important;
  height: 13px !important;
  min-width: 13px !important;
  margin: 0 !important;
}

.exception-sub-entry {
  width: 100% !important;
  min-height: 34px !important;
  max-height: 92px !important;
  padding: 5px 7px !important;
  border: 1px solid rgba(48,95,114,.24) !important;
  border-radius: 9px !important;
  resize: vertical !important;
  background: #fffdfa !important;
  font-size: .76rem !important;
  line-height: 1.25 !important;
}

.exception-sub-entry.textarea-default-expanded {
  height: 92px !important;
  max-height: 180px !important;
  overflow: auto !important;
}

.exception-sub-entry.textarea-default-collapsed {
  height: 34px !important;
  max-height: 34px !important;
  overflow: hidden !important;
}

@media (max-width: 1100px) {
  .guideline-filter-heading {
    grid-template-columns: 1fr !important;
  }
  .glt-control-row-primary {
    grid-template-columns: 1fr !important;
  }
  .guideline-column-heading {
    display: none;
  }
  .sequence-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}


/* Guidelines query provider + left-side subnote layout refinements. */
.glt-control-row-primary {
  grid-template-columns: minmax(320px, 1fr) !important;
}

.glt-control-row-filters {
  justify-content: flex-start !important;
  padding-top: 6px;
  border-top: 1px solid rgba(48,95,114,.10);
}

.guideline-column-heading {
  text-align: center !important;
  align-items: center !important;
}

.guideline-column-heading span {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 20px;
}

.sequence-panel {
  display: grid;
  gap: 5px;
  align-self: stretch;
  min-width: 0;
}

.sequence-subnote-toggles {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.subnote-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  width: fit-content !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 2px 6px !important;
  border: 1px solid rgba(48,95,114,.18);
  border-radius: 999px;
  background: #fff;
  color: #334e68;
  font-size: .66rem !important;
  font-weight: 900 !important;
  line-height: 1.1;
}

.subnote-toggle input {
  width: 13px !important;
  height: 13px !important;
  min-width: 13px !important;
  margin: 0 !important;
}

.sequence-subnote-area {
  display: grid;
  gap: 5px;
}

.sequence-sub-entry {
  width: 100% !important;
  min-height: 40px !important;
  max-height: 110px !important;
  padding: 6px 7px !important;
  border: 1px solid rgba(48,95,114,.24) !important;
  border-radius: 9px !important;
  resize: vertical !important;
  background: #fffdfa !important;
  font-size: .76rem !important;
  line-height: 1.25 !important;
}

.sequence-sub-entry.textarea-default-expanded {
  height: 110px !important;
  max-height: 200px !important;
  overflow: auto !important;
}

.sequence-sub-entry.textarea-default-collapsed {
  height: 40px !important;
  max-height: 40px !important;
  overflow: hidden !important;
}

.summary-alert {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-right: 5px;
  padding: 2px 7px;
  border-radius: 999px;
  border: 1px solid rgba(48,95,114,.22);
  background: #fffdfa;
  color: #334e68;
  font-size: .72rem;
  font-weight: 950;
  vertical-align: middle;
}

.summary-alert-query {
  font-style: italic;
}

/* Retire older right-side exception layout now that subnotes live in the sequence panel. */
.exception-toggle:not(.subnote-toggle),
.exception-sub-entry:not(.sequence-sub-entry) {
  display: none !important;
}


/* Guidelines title shortening + in-row undo placement. */
.category-tools .undo-category-tool {
  border-color: rgba(181, 71, 8, .32) !important;
  background: #fff7ed !important;
  color: #9a3412 !important;
  font-weight: 950 !important;
  letter-spacing: .03em;
}

.guideline-filter-heading h3 {
  min-width: 3.5rem;
  text-align: left;
}


/* Shorter Guidelines color tab + full-width bottom Exception/Query subnotes. */
.ultra-compact-guideline .tag-color-strip,
.compact-guideline .tag-color-strip {
  align-self: start !important;
  width: 4px !important;
  min-width: 4px !important;
  max-width: 4px !important;
  height: 34px !important;
  min-height: 34px !important;
  border-radius: 999px !important;
  padding: 0 !important;
}

.guideline-bottom-subnotes {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 6px;
  margin-top: 1px;
  padding: 6px 8px 7px;
  border-top: 1px dashed rgba(48,95,114,.18);
  background: linear-gradient(180deg, rgba(255,253,250,.2), rgba(255,247,237,.6));
  border-radius: 0 0 9px 9px;
}

.bottom-subnote-field {
  display: grid !important;
  grid-template-columns: minmax(98px, auto) minmax(180px, 1fr);
  align-items: start !important;
  gap: 7px !important;
  margin: 0 !important;
  color: #334e68;
  font-size: .72rem !important;
  font-weight: 950 !important;
}

.bottom-subnote-field > span {
  padding-top: 7px;
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
}

.guideline-bottom-subnotes .sequence-sub-entry {
  min-height: 38px !important;
  width: 100% !important;
}

.guideline-bottom-subnotes .sequence-sub-entry.textarea-default-collapsed {
  height: 38px !important;
  max-height: 38px !important;
}

.guideline-bottom-subnotes .sequence-sub-entry.textarea-default-expanded {
  height: 100px !important;
  max-height: 180px !important;
}

.sequence-panel .sequence-subnote-area {
  display: none !important;
}

/* Stack bottom Exception and Query Provider subnotes vertically. */
.guideline-bottom-subnotes {
  grid-template-columns: 1fr !important;
}


/* Symbol-only summary alerts and compact bottom subnote labels. */
.summary-alert {
  min-width: 22px !important;
  justify-content: center !important;
  padding: 2px 6px !important;
  margin-right: 4px !important;
}

.bottom-subnote-field {
  grid-template-columns: 76px minmax(180px, 1fr) !important;
}


/* Principal hover readability + future Cross Reference tie-in row. */
.sequence-shared-heading {
  white-space: normal !important;
  line-height: 1.05 !important;
}

.sequence-stack {
  overflow: visible !important;
  position: relative !important;
}

.sequence-stack-input {
  transition: min-width .14s ease, box-shadow .14s ease, transform .14s ease, background .14s ease;
  position: relative;
}

.sequence-stack-input:hover,
.sequence-stack-input:focus {
  min-width: min(360px, 62vw) !important;
  z-index: 50 !important;
  background: #fffdfa !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .18), 0 0 0 2px rgba(48, 95, 114, .16) !important;
  transform: translateY(-1px);
}

.guideline-cross-reference-field {
  grid-column: 3 / 8;
  display: grid !important;
  grid-template-columns: 108px minmax(220px, 1fr);
  align-items: start !important;
  gap: 7px !important;
  margin: 1px 0 0 !important;
  padding: 5px 7px 6px;
  border-top: 1px dashed rgba(48,95,114,.16);
  background: linear-gradient(180deg, rgba(239,246,255,.42), rgba(255,253,250,.8));
  border-radius: 8px;
  color: #244d5c;
  font-size: .72rem !important;
  font-weight: 950 !important;
}

.guideline-cross-reference-field > span {
  padding-top: 7px;
  text-transform: uppercase;
  letter-spacing: .035em;
  white-space: nowrap;
}

.guideline-cross-reference {
  width: 100% !important;
  min-height: 38px !important;
  resize: vertical;
}

.guideline-cross-reference.textarea-default-collapsed {
  height: 38px !important;
  max-height: 38px !important;
}

.guideline-cross-reference.textarea-default-expanded {
  height: 92px !important;
  max-height: 170px !important;
}

@media (max-width: 1120px) {
  .guideline-cross-reference-field {
    grid-column: 1 / -1;
  }
}


/* Guidelines refinement: cross-reference alert, collapsed defaults, stacked principal fields, no Rule Type column. */
.summary-alert-cross-reference {
  color: #1d4ed8 !important;
  border-color: rgba(37, 99, 235, .28) !important;
  background: #eff6ff !important;
}

.tag-title-jump {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  text-align: left !important;
}

.summary-sequence-code {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 118px !important;
  max-width: 240px !important;
  text-align: center !important;
  white-space: nowrap !important;
  margin: 0 6px 0 0 !important;
  padding: 2px 8px !important;
}

.sequence-path-separator {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 4px !important;
}

.ultra-compact-guideline {
  grid-template-columns: minmax(188px, 232px) 7px 78px minmax(210px, 285px) minmax(205px, 1fr) minmax(170px, .82fr) 24px !important;
}

.guideline-column-heading {
  grid-template-columns: minmax(188px, 232px) 7px 78px minmax(210px, 285px) minmax(205px, 1fr) minmax(170px, .82fr) 24px !important;
}

.sequence-stack {
  grid-template-columns: 1fr !important;
  gap: 3px !important;
  align-content: start !important;
}

.sequence-level-4 {
  min-height: 28px !important;
  opacity: .92;
}

.guideline-icon-select {
  grid-column: auto !important;
}

.guideline-label-textarea.textarea-default-collapsed,
.inline-guideline-details.textarea-default-collapsed,
.inline-guideline-scenario.textarea-default-collapsed {
  height: 38px !important;
  max-height: 38px !important;
  min-height: 38px !important;
  overflow: hidden !important;
}

.guideline-label-textarea.textarea-default-expanded,
.inline-guideline-details.textarea-default-expanded,
.inline-guideline-scenario.textarea-default-expanded {
  height: 96px !important;
  max-height: 180px !important;
  overflow: auto !important;
}

.guideline-cross-reference-field {
  grid-column: 3 / 7 !important;
}

.guideline-bottom-subnotes {
  grid-column: 1 / -1 !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline,
  .guideline-column-heading {
    grid-template-columns: 1fr !important;
  }
}


/* Guidelines topbar, compact summary sequence, and dedicated tag note. */
.compact-guideline-topbar {
  display: grid !important;
  grid-template-columns: minmax(160px, 0.55fr) minmax(520px, 1.45fr) !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 10px 12px !important;
}

.compact-guideline-topbar h3 {
  margin: 0 !important;
}

.compact-guideline-topbar p {
  margin: 2px 0 0 !important;
  font-size: .75rem !important;
}

.top-guideline-controls {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 6px !important;
}

.top-guideline-controls label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 !important;
  font-size: .7rem !important;
  font-weight: 900 !important;
}

.top-guideline-controls .tag-search-input {
  width: min(330px, 34vw) !important;
  min-height: 34px !important;
}

.top-guideline-controls select {
  max-width: 175px !important;
  min-height: 34px !important;
  padding: 5px 22px 5px 8px !important;
}

.top-guideline-controls .icon-control {
  min-height: 32px !important;
  padding: 5px 8px !important;
  white-space: nowrap !important;
}

.compact-guideline-section-heading {
  padding: 6px 2px 8px !important;
}

.compact-summary-sequence-code,
.summary-sequence-code {
  min-width: 0 !important;
  max-width: 175px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  padding: 2px 6px !important;
  font-size: .68rem !important;
  flex: 0 1 auto !important;
}

.sequence-path-separator {
  padding: 0 2px !important;
}

.summary-alert-note {
  color: #7c2d12 !important;
  border-color: rgba(234, 88, 12, .28) !important;
  background: #fff7ed !important;
}

.sequence-subnote-toggles {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 3px !important;
}

.tag-note-toggle {
  border-color: rgba(234, 88, 12, .20) !important;
  background: #fff7ed !important;
}

.guideline-tag-note-field {
  grid-column: 1 / -1;
  display: grid !important;
  grid-template-columns: 76px minmax(180px, 1fr);
  align-items: start !important;
  gap: 7px !important;
  margin: 1px 0 0 !important;
  padding: 6px 8px 7px;
  border-top: 1px dashed rgba(234, 88, 12, .22);
  background: linear-gradient(180deg, rgba(255,247,237,.55), rgba(255,253,250,.88));
  border-radius: 8px;
  color: #7c2d12;
  font-size: .72rem !important;
  font-weight: 950 !important;
}

.guideline-tag-note-field > span {
  padding-top: 7px;
  text-transform: uppercase;
  letter-spacing: .035em;
  white-space: nowrap;
}

.guideline-tag-note {
  width: 100% !important;
  min-height: 38px !important;
  resize: vertical;
}

.guideline-tag-note.textarea-default-collapsed {
  height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
}

.guideline-tag-note.textarea-default-expanded {
  height: 100px !important;
  max-height: 180px !important;
  overflow: auto !important;
}

#guidelineWorkspace,
.guideline-map-card,
.prominent-guideline-map {
  display: none !important;
}

@media (max-width: 980px) {
  .compact-guideline-topbar {
    grid-template-columns: 1fr !important;
  }
  .top-guideline-controls {
    justify-content: flex-start !important;
  }
  .top-guideline-controls .tag-search-input {
    width: min(420px, 78vw) !important;
  }
}


/* More compact stacked Principal sequence controls. */
.sequence-stack {
  padding: 3px !important;
  gap: 2px !important;
}

.sequence-stack-input {
  min-height: 25px !important;
  height: 25px !important;
  padding: 3px 5px !important;
  font-size: .68rem !important;
}

.sequence-panel {
  gap: 4px !important;
}

.sequence-subnote-toggles .subnote-toggle {
  min-height: 23px !important;
  padding: 2px 5px !important;
  font-size: .62rem !important;
}


/* Guidelines search bar tightening and full sequence labels. */
.compact-guideline-topbar {
  grid-template-columns: auto minmax(460px, 1fr) !important;
  gap: 7px !important;
  padding: 7px 9px !important;
}

.compact-guideline-topbar p {
  display: none !important;
}

.top-guideline-controls {
  gap: 4px !important;
}

.top-guideline-controls label {
  gap: 3px !important;
  font-size: .64rem !important;
}

.top-guideline-controls .tag-search-input {
  width: min(245px, 27vw) !important;
  min-height: 30px !important;
  height: 30px !important;
  padding: 4px 8px !important;
}

.top-guideline-controls select {
  max-width: 138px !important;
  min-height: 30px !important;
  height: 30px !important;
  padding: 4px 18px 4px 6px !important;
  font-size: .68rem !important;
}

.top-guideline-controls .icon-control {
  min-height: 29px !important;
  height: 29px !important;
  padding: 4px 6px !important;
  font-size: .66rem !important;
}

.sequence-stack-input {
  font-size: .66rem !important;
  padding-left: 6px !important;
}

.sequence-stack-input::placeholder {
  font-size: .62rem !important;
  opacity: .86 !important;
}

@media (max-width: 980px) {
  .compact-guideline-topbar {
    grid-template-columns: 1fr !important;
  }
  .top-guideline-controls .tag-search-input {
    width: min(320px, 72vw) !important;
  }
}

/* Extra-tight Guidelines search controls. */
.compact-guideline-topbar {
  grid-template-columns: max-content minmax(360px, 1fr) !important;
  gap: 5px !important;
  padding: 5px 7px !important;
  margin-bottom: 6px !important;
}

.compact-guideline-topbar h3 {
  font-size: .88rem !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.top-guideline-controls {
  gap: 3px !important;
  row-gap: 3px !important;
}

.top-guideline-controls label {
  gap: 2px !important;
  font-size: .6rem !important;
  line-height: 1 !important;
}

.top-guideline-controls label > span {
  font-size: .78rem !important;
  line-height: 1 !important;
}

.top-guideline-controls .tag-search-input {
  width: min(190px, 22vw) !important;
  min-height: 26px !important;
  height: 26px !important;
  padding: 3px 6px !important;
  font-size: .68rem !important;
}

.top-guideline-controls select {
  max-width: 118px !important;
  min-height: 26px !important;
  height: 26px !important;
  padding: 3px 16px 3px 5px !important;
  font-size: .62rem !important;
}

.top-guideline-controls .icon-control {
  min-height: 25px !important;
  height: 25px !important;
  padding: 3px 5px !important;
  font-size: .62rem !important;
  border-radius: 7px !important;
}

@media (max-width: 980px) {
  .compact-guideline-topbar {
    grid-template-columns: 1fr !important;
  }
  .top-guideline-controls {
    justify-content: flex-start !important;
  }
  .top-guideline-controls .tag-search-input {
    width: min(250px, 60vw) !important;
  }
}


/* Single-line snug Guidelines search row after marker filter removal. */
.compact-guideline-topbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  padding: 4px 6px !important;
  margin: 0 0 5px !important;
}

.compact-guideline-topbar > div:first-child {
  flex: 0 0 auto !important;
}

.compact-guideline-topbar h3 {
  font-size: .82rem !important;
  margin: 0 !important;
}

.top-guideline-controls {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 3px !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

.top-guideline-controls label {
  flex: 0 1 auto !important;
  min-width: 0 !important;
}

.top-guideline-controls .glt-search-control {
  flex: 0 1 175px !important;
}

.top-guideline-controls .tag-search-input {
  width: 170px !important;
  max-width: 19vw !important;
  min-height: 24px !important;
  height: 24px !important;
  padding: 2px 5px !important;
  font-size: .64rem !important;
}

.top-guideline-controls select[data-action="filter-guideline-tags"] {
  width: 132px !important;
  max-width: 16vw !important;
  min-height: 24px !important;
  height: 24px !important;
  padding: 2px 15px 2px 5px !important;
  font-size: .6rem !important;
}

.top-guideline-controls .icon-control {
  min-height: 23px !important;
  height: 23px !important;
  padding: 2px 5px !important;
  font-size: .6rem !important;
}

@media (max-width: 760px) {
  .compact-guideline-topbar {
    align-items: flex-start !important;
    flex-wrap: wrap !important;
  }
  .top-guideline-controls {
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
  }
  .top-guideline-controls .tag-search-input,
  .top-guideline-controls select[data-action="filter-guideline-tags"] {
    max-width: none !important;
  }
}


/* Guidelines layout polish: lean subnotes, summary marker outside, smarter tight fields. */
.sequence-subnote-toggles {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  padding: 0 !important;
  margin: 1px 0 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.sequence-subnote-toggles .subnote-toggle,
.subnote-toggle,
.exception-toggle,
.query-provider-toggle,
.tag-note-toggle {
  min-height: 18px !important;
  padding: 0 2px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #46515f !important;
  font-size: .58rem !important;
  line-height: 1.05 !important;
  font-weight: 850 !important;
}

.sequence-subnote-toggles .subnote-toggle input {
  width: 10px !important;
  height: 10px !important;
  margin: 0 3px 0 0 !important;
}

.summary-marker-outside {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) 22px 22px !important;
  align-items: center !important;
  gap: 4px !important;
}

.summary-outside-marker {
  display: inline-grid !important;
  place-items: center !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 999px !important;
  background: #fffdfa !important;
  border: 1px solid rgba(48,95,114,.18) !important;
  font-size: .74rem !important;
  box-shadow: 0 1px 3px rgba(15,23,42,.08) !important;
}

.summary-marker-outside .tag-title-jump {
  min-width: 0 !important;
  width: 100% !important;
  justify-content: flex-start !important;
}

.summary-tag-title-text {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.summary-move {
  min-width: 20px !important;
  width: 20px !important;
  height: 20px !important;
  padding: 0 !important;
}

.summary-alert-note {
  position: relative !important;
}

.summary-alert-note[data-note-tooltip]:hover::after,
.summary-alert-note[data-note-tooltip]:focus::after {
  content: attr(data-note-tooltip);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 7px);
  transform: translateX(-50%);
  z-index: 80;
  width: max-content;
  max-width: 260px;
  padding: 7px 9px;
  border-radius: 9px;
  background: #431407;
  color: #fff7ed;
  box-shadow: 0 12px 28px rgba(15,23,42,.24);
  font-size: .72rem;
  line-height: 1.25;
  white-space: normal;
  pointer-events: none;
}

.summary-alert-note[data-note-tooltip]:hover::before,
.summary-alert-note[data-note-tooltip]:focus::before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: calc(100% + 2px);
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: #431407;
  z-index: 81;
  pointer-events: none;
}

.category-bottom-tools {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 5px !important;
  padding: 5px 0 0 !important;
  margin-top: 4px !important;
  border-top: 1px dashed rgba(48,95,114,.12) !important;
}

.category-tools .small,
.category-bottom-tools .small {
  min-height: 24px !important;
  padding: 3px 7px !important;
  font-size: .65rem !important;
}

/* Replace bulky manual expand/collapse with compact focus expansion. */
.guideline-label-textarea,
.inline-guideline-details,
.inline-guideline-scenario,
.guideline-cross-reference,
.guideline-tag-note,
.sequence-sub-entry {
  transition: min-height .14s ease, height .14s ease, box-shadow .14s ease, background .14s ease !important;
}

.guideline-label-textarea.textarea-default-collapsed,
.inline-guideline-details.textarea-default-collapsed,
.inline-guideline-scenario.textarea-default-collapsed,
.guideline-cross-reference.textarea-default-collapsed,
.guideline-tag-note.textarea-default-collapsed,
.sequence-sub-entry.textarea-default-collapsed {
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  overflow: hidden !important;
}

.guideline-label-textarea:focus,
.guideline-label-textarea:hover,
.inline-guideline-details:focus,
.inline-guideline-details:hover,
.inline-guideline-scenario:focus,
.inline-guideline-scenario:hover,
.guideline-cross-reference:focus,
.guideline-cross-reference:hover,
.guideline-tag-note:focus,
.guideline-tag-note:hover,
.sequence-sub-entry:focus,
.sequence-sub-entry:hover {
  height: 82px !important;
  min-height: 82px !important;
  max-height: 150px !important;
  overflow: auto !important;
  background: #fffdfa !important;
  box-shadow: 0 8px 22px rgba(15,23,42,.12), 0 0 0 1px rgba(48,95,114,.18) !important;
  z-index: 20 !important;
}

.guideline-cross-reference-field,
.guideline-tag-note-field,
.guideline-bottom-subnotes {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  margin-top: 2px !important;
}


/* Guidelines search Go button + note hover behavior polish. */
.top-guideline-controls .search-go-control {
  min-width: 28px !important;
  width: 28px !important;
  height: 23px !important;
  padding: 2px 3px !important;
  font-size: .58rem !important;
  font-weight: 950 !important;
}

.summary-alert-note[data-note-tooltip]::after,
.summary-alert-note[data-note-tooltip]::before {
  opacity: 0;
  visibility: hidden;
}

.summary-alert-note[data-note-tooltip]:hover::after,
.summary-alert-note[data-note-tooltip]:focus::after,
.summary-alert-note[data-note-tooltip]:hover::before,
.summary-alert-note[data-note-tooltip]:focus::before {
  opacity: 1;
  visibility: visible;
}


/* Search fuzzy match feedback and Code Sequence fluorescent highlighter. */
.category.closest-search-match {
  outline: 2px solid rgba(255, 214, 0, .58) !important;
  box-shadow: 0 0 0 4px rgba(255, 242, 0, .18), 0 12px 26px rgba(15,23,42,.10) !important;
}

.sequence-panel {
  background: var(--sequence-highlight, transparent) !important;
  border-radius: 8px !important;
  padding: 3px !important;
}

.sequence-panel .sequence-stack,
.sequence-panel .sequence-stack-input {
  background: color-mix(in srgb, var(--sequence-highlight, transparent) 38%, #fffdfa) !important;
}

.sequence-highlight-palette {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 2px !important;
  margin: 2px 0 !important;
}

.sequence-highlight-swatch,
.sequence-highlight-clear {
  width: 100% !important;
  min-width: 0 !important;
  height: 12px !important;
  padding: 0 !important;
  border: 1px solid rgba(15,23,42,.18) !important;
  border-radius: 4px !important;
  background: var(--sequence-swatch, #fff) !important;
  cursor: pointer !important;
}

.sequence-highlight-clear {
  background: #fffdfa !important;
  color: #9a3412 !important;
  font-size: .55rem !important;
  line-height: 1 !important;
  font-weight: 950 !important;
}

.sequence-highlight-swatch.selected,
.sequence-highlight-clear.selected {
  outline: 2px solid rgba(15,23,42,.58) !important;
  outline-offset: 1px !important;
}


/* Guidelines selectable search results. */
.top-guideline-controls {
  position: relative !important;
}

.top-guideline-controls .search-clear-control {
  min-width: 22px !important;
  width: 22px !important;
  height: 23px !important;
  padding: 0 !important;
  font-size: .78rem !important;
  line-height: 1 !important;
  font-weight: 950 !important;
}

.guideline-search-results {
  position: absolute !important;
  top: calc(100% + 4px) !important;
  left: 24px !important;
  z-index: 120 !important;
  width: min(420px, 72vw) !important;
  max-height: 240px !important;
  overflow: auto !important;
  padding: 5px !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  border-radius: 10px !important;
  background: #fffdfa !important;
  box-shadow: 0 18px 42px rgba(15,23,42,.22) !important;
}

.guideline-search-results[hidden] {
  display: none !important;
}

.guideline-search-result {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  gap: 7px !important;
  align-items: start !important;
  padding: 6px 7px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #1f2933 !important;
  text-align: left !important;
  cursor: pointer !important;
}

.guideline-search-result:hover,
.guideline-search-result:focus {
  background: rgba(205,239,253,.72) !important;
  outline: none !important;
}

.result-marker {
  display: inline-grid !important;
  place-items: center !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  border: 1px solid rgba(48,95,114,.16) !important;
}

.result-copy {
  min-width: 0 !important;
  display: grid !important;
  gap: 2px !important;
}

.result-copy strong,
.result-copy small {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.result-copy strong {
  font-size: .72rem !important;
}

.result-copy small {
  color: #5f6c7b !important;
  font-size: .64rem !important;
}

.guideline-search-hit {
  background: #fffb00 !important;
  color: #111827 !important;
  border-radius: 3px !important;
  padding: 0 2px !important;
}

.guideline-search-hit.fuzzy {
  background: #7cff00 !important;
}

.guideline-search-no-results {
  padding: 8px !important;
  color: #64748b !important;
  font-size: .72rem !important;
}


/* Per-entry Code Sequence highlight picker: thin line + tag-palette style popup. */
.sequence-panel {
  background: transparent !important;
}

.sequence-panel .sequence-stack,
.sequence-panel .sequence-stack-input {
  background: #fffdfa !important;
}

.sequence-entry-highlight-wrap {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 6px minmax(0, 1fr) !important;
  gap: 3px !important;
  align-items: stretch !important;
  min-width: 0 !important;
}

.sequence-entry-color-line {
  width: 6px !important;
  min-width: 6px !important;
  height: 100% !important;
  min-height: 25px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: var(--sequence-entry-highlight, rgba(48,95,114,.18)) !important;
  cursor: pointer !important;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.12) !important;
}

.sequence-entry-highlight-wrap.has-sequence-entry-highlight .sequence-stack-input {
  background: color-mix(in srgb, var(--sequence-entry-highlight) 45%, #fffdfa) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--sequence-entry-highlight) 55%, rgba(15,23,42,.12)) !important;
}

.sequence-entry-highlight-palette {
  display: none !important;
  position: absolute !important;
  left: 0 !important;
  top: calc(100% + 4px) !important;
  z-index: 90 !important;
  width: 178px !important;
  grid-column: 1 / -1 !important;
  grid-template-columns: repeat(8, 1fr) !important;
  gap: 3px !important;
  padding: 6px !important;
  border: 1px solid rgba(48,95,114,.18) !important;
  border-radius: 10px !important;
  background: #fffdfa !important;
  box-shadow: 0 18px 36px rgba(15,23,42,.22) !important;
}

.sequence-entry-highlight-wrap.show-sequence-entry-palette .sequence-entry-highlight-palette {
  display: grid !important;
}

.sequence-entry-highlight-swatch,
.sequence-entry-highlight-clear {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  padding: 0 !important;
  border: 1px solid rgba(15,23,42,.20) !important;
  border-radius: 5px !important;
  background: var(--sequence-swatch, #fffdfa) !important;
  cursor: pointer !important;
}

.sequence-entry-highlight-clear {
  color: #9a3412 !important;
  font-size: .65rem !important;
  line-height: 1 !important;
  font-weight: 950 !important;
}

.sequence-entry-highlight-swatch.selected,
.sequence-entry-highlight-clear.selected {
  outline: 2px solid rgba(15,23,42,.62) !important;
  outline-offset: 1px !important;
}

/* Search result selection: keep the clicked Guideline visibly marked after jump. */
.guideline-item.guideline-search-selected,
.category.guideline-search-selected {
  outline: 3px solid #ffea00 !important;
  outline-offset: 4px !important;
  box-shadow: 0 0 0 7px rgba(255, 234, 0, .38), 0 14px 34px rgba(15, 23, 42, .18) !important;
  background: color-mix(in srgb, #fffb00 16%, #fffdfa) !important;
}

.guideline-search-field-selected {
  background: #fff200 !important;
  color: #111827 !important;
  box-shadow: inset 0 0 0 2px #f59e0b, 0 0 0 3px rgba(255, 242, 0, .35) !important;
  border-color: #f59e0b !important;
}

.guideline-search-result:active {
  transform: translateY(1px) !important;
}

/* At a Glance/search polish: selected highlight, viewport-fit note hover, tighter Guidelines heading. */
.tag-title-row.at-a-glance-search-selected {
  outline: 3px solid #ffea00 !important;
  outline-offset: 3px !important;
  background: color-mix(in srgb, #fffb00 22%, #fffdfa) !important;
  box-shadow: 0 0 0 6px rgba(255, 234, 0, .34) !important;
}

.tag-title-row.at-a-glance-search-selected .tag-title-jump {
  background: color-mix(in srgb, var(--tag-color, #fff3b0) 42%, #fffdfa) !important;
  border-color: rgba(245, 158, 11, .55) !important;
}

.chapter-overview-panel {
  overflow: visible !important;
}

.tag-title-overview {
  width: 100% !important;
  max-width: 100% !important;
}

.tag-title-row {
  grid-template-columns: auto minmax(0, 1fr) auto auto !important;
  max-width: 100% !important;
}

.tag-title-jump {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

.summary-tag-title-text {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  max-width: 100% !important;
}

.summary-alert-note[data-note-tooltip] {
  position: relative !important;
}

.summary-alert-note[data-note-tooltip]:hover::after,
.summary-alert-note[data-note-tooltip]:focus::after {
  position: fixed !important;
  left: clamp(12px, 50vw, calc(100vw - 12px)) !important;
  right: auto !important;
  top: 74px !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  width: min(360px, calc(100vw - 28px)) !important;
  max-width: calc(100vw - 28px) !important;
  max-height: min(42vh, 260px) !important;
  overflow: auto !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  text-align: left !important;
  z-index: 999 !important;
}

.summary-alert-note[data-note-tooltip]:hover::before,
.summary-alert-note[data-note-tooltip]:focus::before {
  display: none !important;
}

.guideline-focus-intro.compact-guideline-topbar {
  margin-bottom: 4px !important;
  padding-bottom: 8px !important;
}

.compact-guideline-section-heading {
  margin-top: -6px !important;
  margin-bottom: 2px !important;
  padding: 2px 2px 3px !important;
}

.compact-guideline-section-heading h3 {
  margin: 0 !important;
  line-height: 1 !important;
}

.category-stack {
  margin-top: 2px !important;
}

/* At a Glance exception notice: make exceptions bright, red, and hard to miss. */
.summary-alert-exception-notice {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  margin-right: 6px !important;
  padding: 3px 8px !important;
  border: 2px solid #7f1d1d !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #ff1f1f, #b91c1c) !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: .05em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, .95), 0 0 0 5px rgba(239, 68, 68, .35), 0 5px 12px rgba(127, 29, 29, .32) !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}

/* Keep only the EXCEPTION badge red; do not tint the full At a Glance pill. */
.tag-title-row:has(.summary-alert-exception-notice) .tag-title-jump {
  border-color: rgba(48, 95, 114, .18) !important;
  background: #fffdfa !important;
}

/* Markers now belong to the Details area, not the main Guideline entry column. */
.details-marker-control {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 0 4px !important;
  padding: 3px 6px !important;
  width: max-content !important;
  max-width: 100% !important;
  border: 1px solid rgba(148, 163, 184, .55) !important;
  border-radius: 999px !important;
  background: rgba(248, 250, 252, .92) !important;
  color: #475569 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.details-marker-control span {
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}

.details-marker-control .details-guideline-icon-select {
  width: 58px !important;
  min-width: 58px !important;
  height: 24px !important;
  padding: 1px 4px !important;
  margin: 0 !important;
  font-size: 13px !important;
}

/* Guidelines section title spacing: prevent collision with At a Glance while keeping title close to Guidelines list. */
.category-stack#guidelineTags {
  margin-top: 18px !important;
  padding-top: 0 !important;
}

.category-stack#guidelineTags .compact-guideline-section-heading {
  margin-top: 0 !important;
  margin-bottom: 5px !important;
  padding: 0 2px 4px !important;
  min-height: 0 !important;
  align-items: end !important;
}

.category-stack#guidelineTags .compact-guideline-section-heading h3 {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.05 !important;
  transform: translateY(2px) !important;
}

/* At a Glance sequence highlight sync: mirror per-entry Code Sequence highlight colors. */
.summary-sequence-part {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 16px !important;
  border-radius: 6px !important;
  padding: 1px 2px !important;
  line-height: 1.1 !important;
}

.summary-sequence-part.has-summary-sequence-highlight {
  padding: 2px 5px !important;
  background: var(--summary-sequence-highlight, transparent) !important;
  color: #111827 !important;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .2), 0 1px 3px rgba(15, 23, 42, .12) !important;
  font-weight: 900 !important;
}

.summary-sequence-code .sequence-path-separator {
  margin: 0 3px !important;
}

/* Clean Guideline entry flow: keep optional Details and Flags tucked away until needed. */
.clean-guideline-row {
  align-items: start !important;
}

.guideline-clean-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 4px !important;
  min-width: 210px !important;
  flex-wrap: wrap !important;
}

.guideline-clean-actions .small {
  min-height: 26px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.clean-guideline-toggle {
  border-color: rgba(148, 163, 184, .55) !important;
  background: rgba(248, 250, 252, .95) !important;
  color: #475569 !important;
}

.clean-guideline-toggle.has-content {
  border-color: rgba(37, 99, 235, .4) !important;
  background: rgba(219, 234, 254, .92) !important;
  color: #1d4ed8 !important;
}

.clean-guideline-toggle.is-open {
  border-color: rgba(15, 23, 42, .55) !important;
  background: #111827 !important;
  color: #ffffff !important;
}

.clean-add-guideline {
  background: linear-gradient(135deg, #ecfeff, #dcfce7) !important;
  border-color: rgba(20, 184, 166, .45) !important;
  color: #065f46 !important;
}

.guideline-optional-panel {
  display: none !important;
  grid-column: 1 / -1 !important;
  margin: 2px 0 4px 38px !important;
  padding: 8px !important;
  border: 1px solid rgba(203, 213, 225, .85) !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(248, 250, 252, .96), rgba(255, 253, 250, .96)) !important;
  box-shadow: inset 3px 0 0 var(--tag-color, #cbd5e1) !important;
}

.guideline-optional-panel.is-open {
  display: grid !important;
  gap: 7px !important;
}

.guideline-details-panel.is-open {
  grid-template-columns: minmax(240px, 1fr) minmax(200px, .7fr) !important;
}

.guideline-flags-panel.is-open {
  grid-template-columns: minmax(260px, 1fr) !important;
}

.guideline-optional-panel .guideline-detail-fieldset,
.guideline-optional-panel .guideline-cross-reference-field,
.guideline-optional-panel .guideline-bottom-subnotes,
.guideline-optional-panel .guideline-tag-note-field {
  margin: 0 !important;
}

@media (max-width: 1100px) {
  .guideline-clean-actions {
    min-width: 0 !important;
  }

  .guideline-details-panel.is-open {
    grid-template-columns: 1fr !important;
  }

  .guideline-optional-panel {
    margin-left: 0 !important;
  }
}

/* Main Guideline text/rule readability: larger text without enlarging every detail field. */
.guideline-label-textarea {
  font-size: 1rem !important;
  line-height: 1.35 !important;
  font-weight: 850 !important;
  min-height: 42px !important;
  height: 42px !important;
  padding: 9px 10px !important;
  letter-spacing: .005em !important;
}

.guideline-label-textarea.textarea-default-collapsed {
  min-height: 42px !important;
  height: 42px !important;
  max-height: 42px !important;
  padding-top: 9px !important;
  padding-bottom: 9px !important;
  overflow: hidden !important;
}

.guideline-label-textarea.textarea-default-expanded,
.guideline-label-textarea:focus {
  min-height: 70px !important;
  height: auto !important;
  max-height: none !important;
  overflow: auto !important;
}

/* Revert condensed Guideline layout: Details/Flags panels are no longer hidden behind buttons. */
.guideline-optional-panel,
.guideline-optional-panel.is-open {
  display: contents !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.guideline-clean-actions,
.clean-guideline-toggle,
.clean-add-guideline {
  display: none !important;
}

/* Cross Reference removed from Guideline entry UI. */
.guideline-cross-reference-field,
.summary-alert-cross-reference {
  display: none !important;
}

/* Full-width stacked Guideline writing layout: Guideline text, Details, then Scenario. */
.ultra-compact-guideline {
  grid-template-columns: minmax(190px, 260px) 7px minmax(0, 1fr) 28px !important;
  grid-template-areas:
    "sequence color title delete"
    "sequence color details delete"
    "sequence color scenario delete"
    "subnotes subnotes subnotes subnotes"
    "note note note note" !important;
  align-items: start !important;
  gap: 8px 8px !important;
  padding: 8px 9px !important;
  overflow: visible !important;
}

.ultra-compact-guideline .sequence-panel {
  grid-area: sequence !important;
}

.ultra-compact-guideline .tag-color-strip {
  grid-area: color !important;
  height: 100% !important;
  min-height: 150px !important;
  align-self: stretch !important;
}

.ultra-compact-guideline .guideline-label-textarea {
  grid-area: title !important;
  width: 100% !important;
}

.ultra-compact-guideline > .guideline-detail-fieldset:not(.scenario-exception-fieldset) {
  grid-area: details !important;
  width: 100% !important;
}

.ultra-compact-guideline > .scenario-exception-fieldset {
  grid-area: scenario !important;
  width: 100% !important;
}

.ultra-compact-guideline .compact-delete {
  grid-area: delete !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  align-self: start !important;
}

.ultra-compact-guideline .guideline-bottom-subnotes {
  grid-area: subnotes !important;
  grid-column: 1 / -1 !important;
}

.ultra-compact-guideline .guideline-tag-note-field {
  grid-area: note !important;
  grid-column: 1 / -1 !important;
}

.guideline-column-heading {
  display: none !important;
}

.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario {
  width: 100% !important;
  min-width: 0 !important;
  height: 78px !important;
  min-height: 78px !important;
  max-height: none !important;
  padding: 10px 12px !important;
  font-size: 1rem !important;
  line-height: 1.38 !important;
  resize: vertical !important;
  overflow: auto !important;
}

.ultra-compact-guideline .guideline-label-textarea {
  font-size: 1.05rem !important;
  font-weight: 850 !important;
}

.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario {
  font-weight: 700 !important;
}

.ultra-compact-guideline .guideline-label-textarea.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-details.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-scenario.textarea-default-collapsed {
  height: 78px !important;
  min-height: 78px !important;
  max-height: none !important;
  overflow: auto !important;
}

.ultra-compact-guideline .guideline-label-textarea:focus,
.ultra-compact-guideline .guideline-label-textarea:hover,
.ultra-compact-guideline .inline-guideline-details:focus,
.ultra-compact-guideline .inline-guideline-details:hover,
.ultra-compact-guideline .inline-guideline-scenario:focus,
.ultra-compact-guideline .inline-guideline-scenario:hover {
  height: 110px !important;
  min-height: 110px !important;
  max-height: none !important;
  z-index: 6 !important;
}

.ultra-compact-guideline .guideline-detail-fieldset {
  display: grid !important;
  gap: 6px !important;
}

.ultra-compact-guideline .details-marker-control {
  justify-self: start !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline {
    grid-template-columns: 1fr 7px 28px !important;
    grid-template-areas:
      "sequence color delete"
      "title title title"
      "details details details"
      "scenario scenario scenario"
      "subnotes subnotes subnotes"
      "note note note" !important;
  }

  .ultra-compact-guideline .tag-color-strip {
    min-height: 38px !important;
  }
}

/* Source-only refinement: stacked writing boxes auto-grow, with one-row minimize arrows and no hover expansion. */
.ultra-compact-guideline .sequence-subnote-toggles {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px !important;
}

.ultra-compact-guideline .sequence-subnote-toggles .marker-toggle {
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 3px 5px !important;
  border: 1px solid rgba(48, 95, 114, .18) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, .74) !important;
  white-space: nowrap !important;
}

.ultra-compact-guideline .sequence-subnote-toggles .marker-toggle span {
  font-size: .72rem !important;
  font-weight: 900 !important;
  color: #315466 !important;
}

.ultra-compact-guideline .details-guideline-icon-select {
  max-width: 78px !important;
  min-height: 25px !important;
  padding: 2px 4px !important;
  font-size: .9rem !important;
}

.ultra-compact-guideline > .guideline-writing-box {
  grid-area: title !important;
}

.guideline-writing-box {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
}

.guideline-detail-fieldset .guideline-writing-box {
  width: 100% !important;
}

.writing-box-collapse {
  position: absolute !important;
  top: 4px !important;
  right: 5px !important;
  z-index: 8 !important;
  width: 23px !important;
  height: 23px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(48, 95, 114, .22) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .9) !important;
  color: #315466 !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  box-shadow: 0 1px 4px rgba(15, 23, 42, .12) !important;
}

.writing-box-collapse:hover {
  background: #eef9fb !important;
  border-color: rgba(48, 95, 114, .45) !important;
}

.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .guideline-label-textarea.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-details.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-scenario.textarea-default-collapsed,
.ultra-compact-guideline .guideline-label-textarea:focus,
.ultra-compact-guideline .guideline-label-textarea:hover,
.ultra-compact-guideline .inline-guideline-details:focus,
.ultra-compact-guideline .inline-guideline-details:hover,
.ultra-compact-guideline .inline-guideline-scenario:focus,
.ultra-compact-guideline .inline-guideline-scenario:hover {
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 38px !important;
  max-height: none !important;
  padding: 8px 34px 8px 10px !important;
  font-size: 1rem !important;
  line-height: 1.35 !important;
  resize: none !important;
  overflow: hidden !important;
  z-index: auto !important;
}

.ultra-compact-guideline .guideline-label-textarea {
  font-size: 1.05rem !important;
  font-weight: 850 !important;
}

.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario {
  font-weight: 700 !important;
}

.ultra-compact-guideline .auto-grow-textarea.textarea-minimized,
.ultra-compact-guideline .auto-grow-textarea.textarea-minimized:focus,
.ultra-compact-guideline .auto-grow-textarea.textarea-minimized:hover {
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
}

.guideline-writing-box.writing-box-minimized .writing-box-collapse {
  background: #e0f2fe !important;
  color: #0f4761 !important;
}

.ultra-compact-guideline .guideline-detail-fieldset {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline .sequence-subnote-toggles .marker-toggle {
    margin-left: 0 !important;
  }
}

/* Clean marker row: left-side flags, right-side icon-only marker picker. */
.ultra-compact-guideline .sequence-subnote-toggles.clean-control-table {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: 8px !important;
  row-gap: 4px !important;
  width: 100% !important;
}

.ultra-compact-guideline .sequence-toggle-cell {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
}

.ultra-compact-guideline .marker-icon-cell {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  justify-self: end !important;
  min-width: 38px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.ultra-compact-guideline .sequence-subnote-toggles .marker-icon-cell .details-guideline-icon-select {
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  min-height: 28px !important;
  height: 28px !important;
  padding: 1px 2px !important;
  border: 1px solid rgba(48, 95, 114, .24) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, .9) !important;
  font-size: 1rem !important;
  font-weight: 900 !important;
  text-align: center !important;
  cursor: pointer !important;
}

.ultra-compact-guideline .sequence-subnote-toggles .marker-icon-cell .details-guideline-icon-select:hover,
.ultra-compact-guideline .sequence-subnote-toggles .marker-icon-cell .details-guideline-icon-select:focus {
  border-color: rgba(48, 95, 114, .55) !important;
  background: #eef9fb !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline .sequence-subnote-toggles.clean-control-table {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
}

/* Shorter tag color line: keep stacked writing boxes neatly aligned to its right. */
.ultra-compact-guideline {
  grid-template-columns: minmax(190px, 260px) 8px minmax(0, 1fr) 28px !important;
  grid-template-areas:
    "sequence color title delete"
    "sequence color details delete"
    "sequence color scenario delete"
    "subnotes subnotes subnotes subnotes"
    "note note note note" !important;
  align-items: start !important;
}

.ultra-compact-guideline .tag-color-strip {
  grid-area: color !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 8px !important;
  min-width: 8px !important;
  max-width: 8px !important;
  height: 92px !important;
  min-height: 92px !important;
  max-height: 92px !important;
  border-radius: 999px !important;
  margin-top: 2px !important;
}

.ultra-compact-guideline > .guideline-writing-box,
.ultra-compact-guideline > .guideline-detail-fieldset:not(.scenario-exception-fieldset),
.ultra-compact-guideline > .scenario-exception-fieldset {
  min-width: 0 !important;
  width: 100% !important;
  align-self: start !important;
}

.ultra-compact-guideline > .guideline-writing-box {
  grid-area: title !important;
}

.ultra-compact-guideline > .guideline-detail-fieldset:not(.scenario-exception-fieldset) {
  grid-area: details !important;
}

.ultra-compact-guideline > .scenario-exception-fieldset {
  grid-area: scenario !important;
}

.ultra-compact-guideline .guideline-detail-fieldset .guideline-writing-box {
  width: 100% !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline {
    grid-template-columns: 1fr 8px 28px !important;
    grid-template-areas:
      "sequence color delete"
      "title title title"
      "details details details"
      "scenario scenario scenario"
      "subnotes subnotes subnotes"
      "note note note" !important;
  }

  .ultra-compact-guideline .tag-color-strip {
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
    width: 100% !important;
    max-width: none !important;
  }
}

/* Main sections do not display marker/tag icons. */
.category-title-line-no-marker {
  grid-template-columns: minmax(0, 1fr) !important;
}

.category-title-line-no-marker .category-title {
  grid-column: 1 / -1 !important;
}

.category-head .category-title-line > .icon-chip {
  display: none !important;
}

/* Section-level minimize: one arrow per Main section, no per-row minimize buttons. */
.writing-box-collapse {
  display: none !important;
}

.category-title-line-no-marker {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 7px !important;
}

.main-section-collapse-toggle {
  width: 26px !important;
  height: 26px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(48, 95, 114, .24) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .92) !important;
  color: #315466 !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  box-shadow: 0 1px 4px rgba(15, 23, 42, .11) !important;
}

.main-section-collapse-toggle:hover,
.main-section-collapse-toggle:focus-visible {
  background: #eef9fb !important;
  border-color: rgba(48, 95, 114, .55) !important;
}

.category.main-section-minimized {
  background: linear-gradient(180deg, rgba(255, 253, 250, .98), rgba(248, 252, 253, .96)) !important;
}

.category.main-section-minimized .guideline-list-box {
  gap: 4px !important;
}

.category.main-section-minimized .ultra-compact-guideline {
  grid-template-columns: minmax(180px, 240px) 8px minmax(0, 1fr) 28px !important;
  gap: 4px 7px !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.category.main-section-minimized .sequence-panel {
  align-self: start !important;
}

.category.main-section-minimized .sequence-subnote-toggles,
.category.main-section-minimized .guideline-bottom-subnotes,
.category.main-section-minimized .guideline-tag-note-field,
.category.main-section-minimized .tag-strip-palette {
  display: none !important;
}

.category.main-section-minimized .tag-color-strip {
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
}

.category.main-section-minimized .auto-grow-textarea,
.category.main-section-minimized .auto-grow-textarea:focus,
.category.main-section-minimized .auto-grow-textarea:hover {
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow: hidden !important;
  resize: none !important;
}

.category.main-section-minimized .guideline-detail-fieldset {
  min-height: 0 !important;
}

@media (max-width: 1120px) {
  .category.main-section-minimized .ultra-compact-guideline {
    grid-template-columns: 1fr 8px 28px !important;
  }
}

/* Refinement pass: vertical flag list, larger marker picker, tighter writing stack, lower color tab, plus/minus section control. */
.ultra-compact-guideline .sequence-subnote-toggles.clean-control-table {
  grid-template-columns: minmax(0, 1fr) 54px !important;
  align-items: start !important;
  column-gap: 8px !important;
  margin-top: 5px !important;
}

.ultra-compact-guideline .sequence-toggle-cell {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: start !important;
  justify-items: start !important;
  gap: 3px !important;
}

.ultra-compact-guideline .sequence-toggle-cell .subnote-toggle {
  width: 100% !important;
  justify-content: flex-start !important;
  text-align: left !important;
  padding: 3px 6px !important;
  min-height: 24px !important;
  line-height: 1.1 !important;
}

.ultra-compact-guideline .marker-icon-cell {
  justify-self: end !important;
  align-self: start !important;
  width: 54px !important;
  min-width: 54px !important;
}

.ultra-compact-guideline .sequence-subnote-toggles .marker-icon-cell .details-guideline-icon-select {
  width: 52px !important;
  min-width: 52px !important;
  max-width: 52px !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  padding: 3px 4px !important;
  font-size: 1.35rem !important;
  line-height: 1.1 !important;
  text-align: left !important;
  text-align-last: left !important;
  overflow: visible !important;
}

.ultra-compact-guideline .details-guideline-icon-select option {
  font-size: .95rem !important;
  line-height: 1.2 !important;
  padding: 3px 6px !important;
  text-align: left !important;
}

.ultra-compact-guideline {
  gap: 4px 8px !important;
}

.ultra-compact-guideline .guideline-detail-fieldset {
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ultra-compact-guideline .guideline-writing-box {
  margin: 0 !important;
}

.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .guideline-label-textarea.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-details.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-scenario.textarea-default-collapsed {
  min-height: 36px !important;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}

.ultra-compact-guideline .tag-color-strip {
  margin-top: 104px !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  width: 8px !important;
  min-width: 8px !important;
  max-width: 8px !important;
  border-radius: 999px !important;
}

.main-section-collapse-toggle {
  font-size: 18px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 950 !important;
}

.category.main-section-minimized .ultra-compact-guideline {
  grid-template-areas: "sequence color title delete" !important;
  grid-template-rows: auto !important;
  gap: 4px 7px !important;
}

.category.main-section-minimized .sequence-stack {
  display: grid !important;
  gap: 0 !important;
}

.category.main-section-minimized .sequence-entry-highlight-wrap:not(:first-child),
.category.main-section-minimized .sequence-subnote-toggles,
.category.main-section-minimized .guideline-detail-fieldset,
.category.main-section-minimized .guideline-bottom-subnotes,
.category.main-section-minimized .guideline-tag-note-field,
.category.main-section-minimized .tag-strip-palette {
  display: none !important;
}

.category.main-section-minimized .tag-color-strip {
  margin-top: 0 !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
}

.category.main-section-minimized .guideline-label-textarea,
.category.main-section-minimized .guideline-label-textarea:focus,
.category.main-section-minimized .guideline-label-textarea:hover {
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  overflow: hidden !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline .sequence-subnote-toggles.clean-control-table {
    grid-template-columns: minmax(0, 1fr) 54px !important;
  }
  .ultra-compact-guideline .tag-color-strip {
    margin-top: 0 !important;
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
    width: 100% !important;
    max-width: none !important;
  }
  .category.main-section-minimized .ultra-compact-guideline {
    grid-template-areas:
      "sequence color delete"
      "title title title" !important;
  }
}

/* Marker picker final nudge: shift left and prevent icon clipping. */
.ultra-compact-guideline .sequence-subnote-toggles.clean-control-table {
  grid-template-columns: minmax(0, 1fr) 64px !important;
  column-gap: 4px !important;
}

.ultra-compact-guideline .marker-icon-cell {
  justify-self: start !important;
  width: 64px !important;
  min-width: 64px !important;
  transform: translateX(-8px) !important;
}

.ultra-compact-guideline .sequence-subnote-toggles .marker-icon-cell .details-guideline-icon-select {
  width: 60px !important;
  min-width: 60px !important;
  max-width: 60px !important;
  padding-left: 8px !important;
  padding-right: 2px !important;
  font-size: 1.28rem !important;
  text-indent: 0 !important;
}

/* At-a-Glance sequence readability: show more Primary/Secondary text without stealing too much detail space. */
.summary-marker-outside .tag-title-jump,
.tag-title-jump {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
}

.summary-sequence-code.compact-summary-sequence-code,
.compact-summary-sequence-code,
.summary-sequence-code {
  flex: 0 1 46% !important;
  max-width: min(46%, 420px) !important;
  min-width: min(260px, 44%) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}

.summary-sequence-part {
  flex: 0 1 auto !important;
  min-width: 42px !important;
  max-width: 118px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.summary-sequence-part[data-sequence-key="sequencePrimary"] {
  max-width: 150px !important;
}

.summary-sequence-part[data-sequence-key="sequenceSecondary"] {
  max-width: 132px !important;
}

.summary-sequence-code .sequence-path-separator {
  flex: 0 0 auto !important;
  margin: 0 2px !important;
}

.summary-tag-title-text {
  flex: 1 1 auto !important;
  min-width: 140px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

@media (max-width: 1120px) {
  .summary-sequence-code.compact-summary-sequence-code,
  .compact-summary-sequence-code,
  .summary-sequence-code {
    flex-basis: 50% !important;
    max-width: 50% !important;
    min-width: 180px !important;
  }
  .summary-sequence-part {
    max-width: 96px !important;
  }
  .summary-sequence-part[data-sequence-key="sequencePrimary"] {
    max-width: 120px !important;
  }
}

/* Tag color line alignment: start at Primary and end at bottom of Other in Code Sequence. */
.ultra-compact-guideline .tag-color-strip {
  margin-top: 0 !important;
  height: 146px !important;
  min-height: 146px !important;
  max-height: 146px !important;
  align-self: start !important;
  border-radius: 999px !important;
}

.category.main-section-minimized .tag-color-strip {
  margin-top: 0 !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline .tag-color-strip {
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
  }
}

/* Marker picker sizing: keep the area wide, but make the icon modest. */
.ultra-compact-guideline .sequence-subnote-toggles .marker-icon-cell .details-guideline-icon-select {
  width: 60px !important;
  min-width: 60px !important;
  max-width: 60px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding-left: 10px !important;
  padding-right: 2px !important;
  font-size: 1rem !important;
  line-height: 1.1 !important;
}

/* Blank marker option: selected blank marker stays visually empty. */
.ultra-compact-guideline .details-guideline-icon-select option[value=""] {
  color: transparent !important;
}

/* Compact readable label restored over the Guideline Code Sequence area. */
.ultra-compact-guideline .sequence-panel-label {
  display: block !important;
  margin: 0 0 3px 2px !important;
  color: #315466 !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
  letter-spacing: .045em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.category.main-section-minimized .sequence-panel-label {
  display: block !important;
  margin-bottom: 2px !important;
}

/* Latest refinement: At-a-Glance Code Sequence grows only when content needs it. */
.summary-sequence-code.compact-summary-sequence-code,
.compact-summary-sequence-code,
.summary-sequence-code {
  flex: 0 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: min(46%, 420px) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

.summary-sequence-part {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 104px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.summary-sequence-part[data-sequence-key="sequencePrimary"] {
  max-width: 144px !important;
}

.summary-sequence-part[data-sequence-key="sequenceSecondary"] {
  max-width: 124px !important;
}

.summary-sequence-part:empty,
.summary-sequence-code .sequence-path-separator:empty {
  display: none !important;
}

/* Latest refinement: compact Guideline writing stack, closer to At-a-Glance row density. */
.ultra-compact-guideline {
  row-gap: 1px !important;
  column-gap: 7px !important;
}

.ultra-compact-guideline > .guideline-writing-box,
.ultra-compact-guideline > .guideline-detail-fieldset:not(.scenario-exception-fieldset),
.ultra-compact-guideline > .scenario-exception-fieldset,
.ultra-compact-guideline .guideline-detail-fieldset,
.ultra-compact-guideline .guideline-writing-box {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  gap: 0 !important;
}

.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .guideline-label-textarea.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-details.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-scenario.textarea-default-collapsed {
  min-height: 30px !important;
  height: 30px !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  line-height: 1.2 !important;
}

.ultra-compact-guideline .guideline-label-textarea:focus,
.ultra-compact-guideline .guideline-label-textarea:hover,
.ultra-compact-guideline .inline-guideline-details:focus,
.ultra-compact-guideline .inline-guideline-details:hover,
.ultra-compact-guideline .inline-guideline-scenario:focus,
.ultra-compact-guideline .inline-guideline-scenario:hover {
  min-height: 30px !important;
}

.category.main-section-minimized .ultra-compact-guideline {
  row-gap: 1px !important;
}

.category.main-section-minimized .guideline-label-textarea,
.category.main-section-minimized .guideline-label-textarea:focus,
.category.main-section-minimized .guideline-label-textarea:hover {
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
}

@media (max-width: 1120px) {
  .summary-sequence-code.compact-summary-sequence-code,
  .compact-summary-sequence-code,
  .summary-sequence-code {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: 50% !important;
  }
}

/* Screenshot fix: keep Guideline text/rules, Details, and Scenario as one tight right-side stack. */
.ultra-compact-guideline {
  grid-template-areas:
    "sequence color writing delete"
    "subnotes subnotes subnotes subnotes"
    "note note note note" !important;
  grid-template-rows: auto auto auto !important;
  align-items: start !important;
  row-gap: 2px !important;
}

.ultra-compact-guideline > .guideline-writing-stack {
  grid-area: writing !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 2px !important;
  align-self: start !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ultra-compact-guideline > .guideline-writing-box,
.ultra-compact-guideline > .guideline-detail-fieldset:not(.scenario-exception-fieldset),
.ultra-compact-guideline > .scenario-exception-fieldset {
  grid-area: auto !important;
}

.ultra-compact-guideline .guideline-writing-stack .guideline-writing-box,
.ultra-compact-guideline .guideline-writing-stack .guideline-detail-fieldset {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  gap: 0 !important;
}

.ultra-compact-guideline .guideline-writing-stack textarea {
  display: block !important;
  margin: 0 !important;
}

.category.main-section-minimized .ultra-compact-guideline {
  grid-template-areas: "sequence color writing delete" !important;
  grid-template-rows: auto !important;
}

.category.main-section-minimized .guideline-writing-stack .guideline-detail-fieldset {
  display: none !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline {
    grid-template-areas:
      "sequence color delete"
      "writing writing writing"
      "subnotes subnotes subnotes"
      "note note note" !important;
  }

  .category.main-section-minimized .ultra-compact-guideline {
    grid-template-areas:
      "sequence color delete"
      "writing writing writing" !important;
  }
}

/* Same spacing fix for Exception, Query, and Add Note: one compact subnote stack. */
.ultra-compact-guideline {
  grid-template-areas:
    "sequence color writing delete"
    "substack substack substack substack" !important;
  grid-template-rows: auto auto !important;
  row-gap: 2px !important;
}

.ultra-compact-guideline > .guideline-subnote-writing-stack {
  grid-area: substack !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 2px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ultra-compact-guideline .guideline-bottom-subnotes,
.ultra-compact-guideline .guideline-tag-note-field {
  grid-area: auto !important;
  grid-column: auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border-top: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
}

.ultra-compact-guideline .guideline-bottom-subnotes {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 2px !important;
}

.ultra-compact-guideline .bottom-subnote-field,
.ultra-compact-guideline .guideline-tag-note-field {
  display: grid !important;
  grid-template-columns: 76px minmax(180px, 1fr) !important;
  align-items: start !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

.ultra-compact-guideline .bottom-subnote-field > span,
.ultra-compact-guideline .guideline-tag-note-field > span {
  padding-top: 6px !important;
  line-height: 1 !important;
}

.ultra-compact-guideline .guideline-bottom-subnotes .sequence-sub-entry,
.ultra-compact-guideline .guideline-bottom-subnotes .sequence-sub-entry.textarea-default-collapsed,
.ultra-compact-guideline .guideline-tag-note,
.ultra-compact-guideline .guideline-tag-note.textarea-default-collapsed {
  min-height: 30px !important;
  height: 30px !important;
  max-height: 30px !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}

.ultra-compact-guideline .guideline-bottom-subnotes .sequence-sub-entry:focus,
.ultra-compact-guideline .guideline-bottom-subnotes .sequence-sub-entry:hover,
.ultra-compact-guideline .guideline-tag-note:focus,
.ultra-compact-guideline .guideline-tag-note:hover {
  min-height: 30px !important;
}

.category.main-section-minimized .guideline-subnote-writing-stack {
  display: none !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline {
    grid-template-areas:
      "sequence color delete"
      "writing writing writing"
      "substack substack substack" !important;
  }

  .category.main-section-minimized .ultra-compact-guideline {
    grid-template-areas:
      "sequence color delete"
      "writing writing writing" !important;
  }
}

/* College-ruled detail area: smaller default writing text, tighter readable lines. */
.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .sequence-sub-entry,
.ultra-compact-guideline .guideline-tag-note {
  font-size: .78rem !important;
  line-height: 1.15 !important;
  letter-spacing: .005em !important;
}

.ultra-compact-guideline .guideline-label-textarea::placeholder,
.ultra-compact-guideline .inline-guideline-details::placeholder,
.ultra-compact-guideline .inline-guideline-scenario::placeholder,
.ultra-compact-guideline .sequence-sub-entry::placeholder,
.ultra-compact-guideline .guideline-tag-note::placeholder {
  font-size: .76rem !important;
  line-height: 1.15 !important;
}

.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .guideline-label-textarea.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-details.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-scenario.textarea-default-collapsed,
.ultra-compact-guideline .guideline-bottom-subnotes .sequence-sub-entry,
.ultra-compact-guideline .guideline-bottom-subnotes .sequence-sub-entry.textarea-default-collapsed,
.ultra-compact-guideline .guideline-tag-note,
.ultra-compact-guideline .guideline-tag-note.textarea-default-collapsed {
  min-height: 28px !important;
  height: 28px !important;
  max-height: 28px !important;
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

/* Professional typography refresh: clean, readable desktop app font stack. */
:root {
  --professional-ui-font: "Aptos", "Segoe UI Variable", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --professional-writing-font: "Aptos", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

html,
body,
button,
input,
select,
textarea,
.app-shell,
.chapter-workspace,
.guidelines-panel,
.chapter-overview-panel,
.category,
.guideline-item {
  font-family: var(--professional-ui-font) !important;
}

.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .sequence-sub-entry,
.ultra-compact-guideline .guideline-tag-note,
.category-title,
.sequence-stack-input {
  font-family: var(--professional-writing-font) !important;
  font-weight: 500 !important;
}

.sequence-panel-label,
.bottom-subnote-field > span,
.guideline-tag-note-field > span,
.summary-alert,
.summary-sequence-code,
.summary-tag-title-text {
  font-family: var(--professional-ui-font) !important;
}

/* Final tight control stack: Exception, Query Provider, and Add Note should sit very close together. */
.ultra-compact-guideline .sequence-subnote-toggles.clean-control-table {
  margin-top: 2px !important;
  align-items: start !important;
}

.ultra-compact-guideline .sequence-toggle-cell {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  row-gap: 0 !important;
  align-content: start !important;
  line-height: 1 !important;
}

.ultra-compact-guideline .sequence-toggle-cell .subnote-toggle {
  min-height: 18px !important;
  height: 18px !important;
  max-height: 18px !important;
  padding: 0 4px !important;
  margin: 0 !important;
  line-height: 1 !important;
  font-size: .68rem !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.ultra-compact-guideline .sequence-toggle-cell .subnote-toggle input {
  width: 12px !important;
  height: 12px !important;
  min-width: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Exception detail needs enough height to show nearly two lines without expanding everything else. */
.ultra-compact-guideline .guideline-bottom-subnotes .exception-sub-entry,
.ultra-compact-guideline .guideline-bottom-subnotes .exception-sub-entry.textarea-default-collapsed {
  min-height: 38px !important;
  height: 38px !important;
  max-height: 38px !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  line-height: 1.15 !important;
}

.ultra-compact-guideline .guideline-bottom-subnotes .exception-sub-entry:focus,
.ultra-compact-guideline .guideline-bottom-subnotes .exception-sub-entry:hover {
  min-height: 38px !important;
}

/* Put Add Guideline beside the main Guidelines title. */
.guidelines-title-with-add {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.guidelines-title-with-add h3 {
  margin: 0 !important;
}

.guideline-heading-add-main {
  min-height: 24px !important;
  padding: 3px 9px !important;
  font-size: .76rem !important;
  line-height: 1 !important;
}

/* Legacy stacked guideline action controls; final overrides below define current labels/layout. */
.category-tools {
  display: grid !important;
  grid-template-columns: minmax(112px, auto) minmax(58px, auto) !important;
  grid-auto-rows: min-content !important;
  gap: 3px 5px !important;
  justify-content: end !important;
  align-content: start !important;
  align-items: start !important;
}

.category-tools .category-add-main,
.category-tools .category-add-detail {
  grid-column: 1 !important;
  width: 100% !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

.category-tools .category-add-main {
  grid-row: 1 !important;
}

.category-tools .category-add-detail {
  grid-row: 2 !important;
}

.category-tools .undo-category-tool {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

.category-tools .danger {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

.category-tools .small,
.category-bottom-tools .small,
.guideline-heading-add-main {
  min-height: 22px !important;
  padding: 2px 7px !important;
  font-size: .64rem !important;
  line-height: 1.05 !important;
}

.category-bottom-tools {
  display: grid !important;
  grid-template-columns: minmax(112px, auto) !important;
  gap: 3px !important;
  justify-content: end !important;
  justify-items: stretch !important;
  padding-top: 4px !important;
  margin-top: 3px !important;
}

.category-bottom-tools .category-add-main,
.category-bottom-tools .category-add-detail {
  width: 100% !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

/* Minimized section alignment: color tab should not skew Code Sequence / Guideline text row. */
.category.main-section-minimized .ultra-compact-guideline {
  position: relative !important;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr) 28px !important;
  grid-template-areas: "sequence writing delete" !important;
  grid-template-rows: auto !important;
  column-gap: 8px !important;
  row-gap: 0 !important;
  align-items: start !important;
  padding-left: 14px !important;
}

.category.main-section-minimized .sequence-panel,
.category.main-section-minimized .guideline-writing-stack,
.category.main-section-minimized .compact-delete {
  align-self: start !important;
  margin-top: 0 !important;
}

.category.main-section-minimized .tag-color-strip {
  position: absolute !important;
  left: 4px !important;
  top: 6px !important;
  grid-area: unset !important;
  width: 5px !important;
  min-width: 5px !important;
  max-width: 5px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  margin: 0 !important;
  align-self: auto !important;
  z-index: 2 !important;
}

.category.main-section-minimized .sequence-panel-label,
.category.main-section-minimized .guideline-writing-box > span {
  line-height: 1 !important;
}

.category.main-section-minimized .sequence-panel-label {
  margin-top: 0 !important;
  margin-bottom: 2px !important;
}

.category.main-section-minimized .guideline-label-textarea,
.category.main-section-minimized .guideline-label-textarea:focus,
.category.main-section-minimized .guideline-label-textarea:hover {
  margin-top: 0 !important;
}

@media (max-width: 1120px) {
  .category.main-section-minimized .ultra-compact-guideline {
    grid-template-columns: minmax(130px, 42%) minmax(0, 1fr) 28px !important;
    grid-template-areas: "sequence writing delete" !important;
  }
}

/* Final guideline add-button cleanup: only top title adds a Guideline; section tools add Details. */
.category-tools {
  display: grid !important;
  grid-template-columns: minmax(92px, auto) minmax(58px, auto) !important;
  grid-auto-rows: min-content !important;
  gap: 3px 5px !important;
  justify-content: end !important;
  align-content: start !important;
  align-items: start !important;
}

.category-tools .category-add-detail {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 100% !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

.category-tools .undo-category-tool {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

.category-tools .danger {
  grid-column: 2 !important;
  grid-row: 2 !important;
}

.category-bottom-tools {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 3px !important;
  padding-top: 4px !important;
  margin-top: 3px !important;
}

.category-bottom-tools .category-add-detail {
  width: auto !important;
  min-width: 92px !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

.guideline-heading-add-main {
  min-width: 94px !important;
  white-space: nowrap !important;
}

/* Make guideline textarea scroll arrows easier to click and remove the resize grip below them. */
.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .sequence-sub-entry,
.ultra-compact-guideline .guideline-tag-note {
  resize: none !important;
  scrollbar-width: auto !important;
  scrollbar-color: #305f72 #eef4f6 !important;
}

.ultra-compact-guideline .guideline-label-textarea::-webkit-resizer,
.ultra-compact-guideline .inline-guideline-details::-webkit-resizer,
.ultra-compact-guideline .inline-guideline-scenario::-webkit-resizer,
.ultra-compact-guideline .sequence-sub-entry::-webkit-resizer,
.ultra-compact-guideline .guideline-tag-note::-webkit-resizer {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

.ultra-compact-guideline .guideline-label-textarea::-webkit-scrollbar,
.ultra-compact-guideline .inline-guideline-details::-webkit-scrollbar,
.ultra-compact-guideline .inline-guideline-scenario::-webkit-scrollbar,
.ultra-compact-guideline .sequence-sub-entry::-webkit-scrollbar,
.ultra-compact-guideline .guideline-tag-note::-webkit-scrollbar {
  width: 18px !important;
  height: 18px !important;
}

.ultra-compact-guideline .guideline-label-textarea::-webkit-scrollbar-track,
.ultra-compact-guideline .inline-guideline-details::-webkit-scrollbar-track,
.ultra-compact-guideline .inline-guideline-scenario::-webkit-scrollbar-track,
.ultra-compact-guideline .sequence-sub-entry::-webkit-scrollbar-track,
.ultra-compact-guideline .guideline-tag-note::-webkit-scrollbar-track {
  background: #eef4f6 !important;
  border-radius: 999px !important;
}

.ultra-compact-guideline .guideline-label-textarea::-webkit-scrollbar-thumb,
.ultra-compact-guideline .inline-guideline-details::-webkit-scrollbar-thumb,
.ultra-compact-guideline .inline-guideline-scenario::-webkit-scrollbar-thumb,
.ultra-compact-guideline .sequence-sub-entry::-webkit-scrollbar-thumb,
.ultra-compact-guideline .guideline-tag-note::-webkit-scrollbar-thumb {
  background: #305f72 !important;
  border: 4px solid #eef4f6 !important;
  border-radius: 999px !important;
  min-height: 24px !important;
}

.ultra-compact-guideline .guideline-label-textarea::-webkit-scrollbar-button:vertical,
.ultra-compact-guideline .inline-guideline-details::-webkit-scrollbar-button:vertical,
.ultra-compact-guideline .inline-guideline-scenario::-webkit-scrollbar-button:vertical,
.ultra-compact-guideline .sequence-sub-entry::-webkit-scrollbar-button:vertical,
.ultra-compact-guideline .guideline-tag-note::-webkit-scrollbar-button:vertical {
  display: block !important;
  height: 18px !important;
  width: 18px !important;
  background-color: #d9e8ed !important;
  border-radius: 4px !important;
}

.ultra-compact-guideline .guideline-label-textarea::-webkit-scrollbar-button:vertical:decrement,
.ultra-compact-guideline .inline-guideline-details::-webkit-scrollbar-button:vertical:decrement,
.ultra-compact-guideline .inline-guideline-scenario::-webkit-scrollbar-button:vertical:decrement,
.ultra-compact-guideline .sequence-sub-entry::-webkit-scrollbar-button:vertical:decrement,
.ultra-compact-guideline .guideline-tag-note::-webkit-scrollbar-button:vertical:decrement {
  background:
    linear-gradient(135deg, transparent 45%, #1f4e5f 46% 55%, transparent 56%) 5px 7px / 8px 8px no-repeat,
    #d9e8ed !important;
}

.ultra-compact-guideline .guideline-label-textarea::-webkit-scrollbar-button:vertical:increment,
.ultra-compact-guideline .inline-guideline-details::-webkit-scrollbar-button:vertical:increment,
.ultra-compact-guideline .inline-guideline-scenario::-webkit-scrollbar-button:vertical:increment,
.ultra-compact-guideline .sequence-sub-entry::-webkit-scrollbar-button:vertical:increment,
.ultra-compact-guideline .guideline-tag-note::-webkit-scrollbar-button:vertical:increment {
  background:
    linear-gradient(315deg, transparent 45%, #1f4e5f 46% 55%, transparent 56%) 5px 3px / 8px 8px no-repeat,
    #d9e8ed !important;
}

/* Final minimized row polish: stretch left color bar and align code box with text field. */
.category.main-section-minimized .ultra-compact-guideline {
  padding-left: 16px !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  align-items: start !important;
}

.category.main-section-minimized .tag-color-strip {
  left: 4px !important;
  top: 5px !important;
  bottom: 5px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  width: 6px !important;
  min-width: 6px !important;
  max-width: 6px !important;
  border-radius: 999px !important;
}

.category.main-section-minimized .sequence-panel {
  display: grid !important;
  grid-template-rows: 12px 30px !important;
  gap: 2px !important;
  padding: 0 !important;
}

.category.main-section-minimized .sequence-panel-label {
  height: 12px !important;
  min-height: 12px !important;
  max-height: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 12px !important;
}

.category.main-section-minimized .sequence-stack {
  align-self: start !important;
  margin: 0 !important;
}

.category.main-section-minimized .guideline-writing-stack,
.category.main-section-minimized .compact-delete {
  margin-top: 14px !important;
}

.category.main-section-minimized .guideline-writing-stack .guideline-writing-box,
.category.main-section-minimized .guideline-label-textarea,
.category.main-section-minimized .guideline-label-textarea:focus,
.category.main-section-minimized .guideline-label-textarea:hover {
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  margin-top: 0 !important;
}

@media (max-width: 1120px) {
  .category.main-section-minimized .guideline-writing-stack,
  .category.main-section-minimized .compact-delete {
    margin-top: 14px !important;
  }
}

/* Note textarea should match Exception: tall enough to show about two lines. */
.ultra-compact-guideline .guideline-tag-note,
.ultra-compact-guideline .guideline-tag-note.textarea-default-collapsed {
  min-height: 38px !important;
  height: 38px !important;
  max-height: 38px !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  line-height: 1.15 !important;
}

.ultra-compact-guideline .guideline-tag-note:focus,
.ultra-compact-guideline .guideline-tag-note:hover {
  min-height: 38px !important;
}


/* MUST-HAVE LOCKED PATCH 2026-07-01:
   1) Details/Reminders/Documentation notes show two readable lines when text wraps.
   2) Highlight selector and page/tag color controls are dimension/position locked.
   3) These overrides are intentionally last and should not be changed unless explicitly requested. */
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-details.textarea-default-collapsed {
  min-height: 42px !important;
  height: 42px !important;
  max-height: 42px !important;
  line-height: 1.25 !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  overflow-y: auto !important;
}

.ultra-compact-guideline .inline-guideline-details.textarea-default-expanded,
.ultra-compact-guideline .inline-guideline-details:focus,
.ultra-compact-guideline .inline-guideline-details:hover {
  min-height: 42px !important;
  height: auto !important;
  max-height: 140px !important;
  line-height: 1.25 !important;
  overflow-y: auto !important;
}

/* LOCKED: page/tag color strip dimensions and palette placement. */
.ultra-compact-guideline .tag-color-strip,
.compact-guideline .tag-color-strip,
.guideline-item .tag-color-strip {
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 25px !important;
  min-height: 25px !important;
  max-height: 25px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 999px !important;
  flex: 0 0 7px !important;
}

.guideline-item .tag-strip-palette,
.guideline-item.show-tag-palette .tag-strip-palette {
  z-index: 999 !important;
  padding: 6px 7px !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
}

/* LOCKED: Primary/Secondary/Tertiary/Others highlight selector dimensions and palette placement. */
.sequence-entry-highlight-wrap {
  grid-template-columns: 6px minmax(0, 1fr) !important;
  gap: 3px !important;
  align-items: stretch !important;
  position: relative !important;
}

.sequence-entry-color-line {
  width: 6px !important;
  min-width: 6px !important;
  max-width: 6px !important;
  min-height: 25px !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 4px !important;
  flex: 0 0 6px !important;
}

.sequence-entry-highlight-palette,
.sequence-entry-highlight-wrap.show-sequence-entry-palette .sequence-entry-highlight-palette {
  position: absolute !important;
  left: 0 !important;
  top: calc(100% + 4px) !important;
  z-index: 950 !important;
  width: 178px !important;
  min-width: 178px !important;
  max-width: 178px !important;
  grid-template-columns: repeat(8, 16px) !important;
  gap: 3px !important;
  padding: 6px !important;
  box-sizing: border-box !important;
}

.sequence-entry-highlight-swatch,
.sequence-entry-highlight-clear {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  max-width: 16px !important;
  max-height: 16px !important;
  padding: 0 !important;
  margin: 0 !important;
}


/* FOCUSED FIX LOCK 2026-07-01:
   Sequence code fields must NOT expand on hover/focus. Note hide/show keeps text. */
.sequence-stack,
.sequence-panel .sequence-stack {
  overflow: visible !important;
}

.sequence-stack-input,
.sequence-stack-input:hover,
.sequence-stack-input:focus,
.sequence-stack input,
.sequence-stack input:hover,
.sequence-stack input:focus,
.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack-input:hover,
.ultra-compact-guideline .sequence-stack-input:focus {
  height: 25px !important;
  min-height: 25px !important;
  max-height: 25px !important;
  line-height: 23px !important;
  padding-top: 1px !important;
  padding-bottom: 1px !important;
  resize: none !important;
  overflow: hidden !important;
  white-space: nowrap !important;
}

.sequence-entry-highlight-wrap,
.sequence-entry-highlight-wrap:hover,
.sequence-entry-highlight-wrap:focus-within {
  min-height: 25px !important;
  max-height: 25px !important;
}

/* Redesigned Links: calmer reference-card/pill hybrid, less bulky and less button-like. */
.chapter-links-panel {
  border: 1px solid rgba(48,95,114,.14) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #fbfdfe, #f6fafb) !important;
  box-shadow: 0 8px 22px rgba(31,41,51,.07) !important;
}

.chapter-link-list,
.saved-links.chapter-link-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)) !important;
  gap: 8px !important;
  margin: 10px 0 12px !important;
}

.chapter-link-pill {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 4px 8px !important;
  padding: 8px 10px 8px 12px !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  border: 1px solid rgba(48,95,114,.16) !important;
  border-left: 4px solid #7eb6c8 !important;
  box-shadow: 0 4px 12px rgba(31,41,51,.055) !important;
}

.chapter-link-pill a {
  color: #244f63 !important;
  font-weight: 800 !important;
  font-size: .86rem !important;
  text-decoration: none !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.chapter-link-pill a::before {
  content: "↗ " !important;
  color: #6f9caf !important;
  font-weight: 900 !important;
}

.chapter-link-pill a:hover {
  color: #173d4f !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

.chapter-link-pill small {
  grid-column: 1 / -1 !important;
  color: #758691 !important;
  font-size: .68rem !important;
  line-height: 1.15 !important;
  margin-left: 18px !important;
}

.chapter-link-pill .mini-danger {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  border-radius: 6px !important;
  background: #f8e7e7 !important;
  color: #8a3434 !important;
  line-height: 18px !important;
  padding: 0 !important;
}

/* Dedicated note keeps two readable lines and gets a non-distorting clear X. */
.note-clear-wrap,
.guideline-tag-note-field.note-clear-wrap {
  position: relative !important;
}

.ultra-compact-guideline .guideline-tag-note,
.ultra-compact-guideline .guideline-tag-note.textarea-default-collapsed,
.ultra-compact-guideline .guideline-tag-note:hover,
.ultra-compact-guideline .guideline-tag-note:focus {
  min-height: 42px !important;
  height: 42px !important;
  max-height: 42px !important;
  line-height: 1.25 !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  padding-right: 24px !important;
  overflow-y: auto !important;
  resize: none !important;
}

.note-clear-button {
  position: absolute !important;
  top: 19px !important;
  right: 5px !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  max-width: 16px !important;
  max-height: 16px !important;
  padding: 0 !important;
  border: 1px solid rgba(126,55,55,.22) !important;
  border-radius: 50% !important;
  background: rgba(255,245,245,.94) !important;
  color: #8a3434 !important;
  font-size: 11px !important;
  line-height: 13px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
  z-index: 4 !important;
}

.note-clear-button:hover {
  background: #ffe2e2 !important;
}

/* FINAL STATIC CODE SEQUENCE LOCK 2026-07-01:
   Primary, Secondary, Tertiary, and Others text containers must never expand on hover/focus. */
.sequence-panel .sequence-stack,
.sequence-panel .sequence-stack:hover,
.sequence-panel .sequence-stack:focus-within,
.ultra-compact-guideline .sequence-stack,
.ultra-compact-guideline .sequence-stack:hover,
.ultra-compact-guideline .sequence-stack:focus-within {
  overflow: visible !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.sequence-panel .sequence-entry-highlight-wrap,
.sequence-panel .sequence-entry-highlight-wrap:hover,
.sequence-panel .sequence-entry-highlight-wrap:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap,
.ultra-compact-guideline .sequence-entry-highlight-wrap:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap:focus-within {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 25px !important;
  min-height: 25px !important;
  max-height: 25px !important;
  transform: none !important;
  transition: none !important;
  z-index: auto !important;
}

.sequence-panel .sequence-stack-input,
.sequence-panel .sequence-stack-input:hover,
.sequence-panel .sequence-stack-input:focus,
.sequence-panel .sequence-stack input,
.sequence-panel .sequence-stack input:hover,
.sequence-panel .sequence-stack input:focus,
.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack-input:hover,
.ultra-compact-guideline .sequence-stack-input:focus,
.ultra-compact-guideline .sequence-stack input,
.ultra-compact-guideline .sequence-stack input:hover,
.ultra-compact-guideline .sequence-stack input:focus {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 25px !important;
  min-height: 25px !important;
  max-height: 25px !important;
  line-height: 23px !important;
  padding-top: 1px !important;
  padding-bottom: 1px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  transform: none !important;
  transition: none !important;
  z-index: auto !important;
  box-shadow: inset 0 0 0 1px rgba(31,41,51,.10) !important;
}

/* MARKER ICON SIDE PLACEMENT LOCK 2026-07-01:
   Marker Icon belongs directly under Change Tag Color in the existing color/control column.
   This preserves the Code Sequence and text-field grid columns. */
.ultra-compact-guideline > .guideline-side-control-stack,
.compact-guideline > .guideline-side-control-stack,
.guideline-item > .guideline-side-control-stack {
  grid-area: color !important;
  align-self: stretch !important;
  justify-self: center !important;
  display: grid !important;
  grid-template-rows: minmax(25px, 1fr) 24px !important;
  align-items: start !important;
  justify-items: center !important;
  gap: 5px !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  min-height: 54px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip,
.compact-guideline > .guideline-side-control-stack .tag-color-strip,
.guideline-item > .guideline-side-control-stack .tag-color-strip {
  grid-area: auto !important;
  align-self: stretch !important;
  justify-self: center !important;
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 100% !important;
  min-height: 25px !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 999px !important;
  flex: 0 0 7px !important;
}

.ultra-compact-guideline > .tag-color-strip,
.compact-guideline > .tag-color-strip,
.guideline-item > .tag-color-strip {
  display: none !important;
}

.ultra-compact-guideline .guideline-side-marker-control,
.compact-guideline .guideline-side-marker-control,
.guideline-item .guideline-side-marker-control {
  display: block !important;
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  justify-self: center !important;
  align-self: end !important;
  overflow: visible !important;
}

.ultra-compact-guideline .guideline-side-marker-control .details-guideline-icon-select,
.compact-guideline .guideline-side-marker-control .details-guideline-icon-select,
.guideline-item .guideline-side-marker-control .details-guideline-icon-select {
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 1px !important;
  margin: 0 !important;
  border-radius: 7px !important;
  font-size: 12px !important;
  line-height: 20px !important;
  text-align: center !important;
  background: #ffffff !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  box-shadow: 0 2px 6px rgba(31,41,51,.08) !important;
}

.ultra-compact-guideline .sequence-subnote-toggles .details-marker-control,
.sequence-panel .sequence-subnote-toggles .details-marker-control {
  display: none !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline > .guideline-side-control-stack,
  .compact-guideline > .guideline-side-control-stack,
  .guideline-item > .guideline-side-control-stack {
    min-height: 38px !important;
    grid-template-rows: 38px 24px !important;
  }
}

/* SELECTED MARKER VISIBILITY LOCK 2026-07-01:
   Keep the marker in the same side-control footprint, but give the native select
   enough painted width to show the selected marker/icon without shifting nearby fields. */
.ultra-compact-guideline .guideline-side-marker-control,
.compact-guideline .guideline-side-marker-control,
.guideline-item .guideline-side-marker-control {
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  overflow: visible !important;
}

.ultra-compact-guideline .guideline-side-marker-control .details-guideline-icon-select,
.compact-guideline .guideline-side-marker-control .details-guideline-icon-select,
.guideline-item .guideline-side-marker-control .details-guideline-icon-select {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  transform: translateX(-6px) !important;
  transform-origin: center !important;
  padding: 0 13px 0 4px !important;
  text-align: center !important;
  text-align-last: center !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 22px !important;
  color: #1f2933 !important;
  background-color: #ffffff !important;
  border: 1px solid rgba(48,95,114,.28) !important;
  box-shadow: 0 2px 7px rgba(31,41,51,.10) !important;
  overflow: visible !important;
}

.ultra-compact-guideline .guideline-side-marker-control .details-guideline-icon-select:hover,
.ultra-compact-guideline .guideline-side-marker-control .details-guideline-icon-select:focus,
.compact-guideline .guideline-side-marker-control .details-guideline-icon-select:hover,
.compact-guideline .guideline-side-marker-control .details-guideline-icon-select:focus,
.guideline-item .guideline-side-marker-control .details-guideline-icon-select:hover,
.guideline-item .guideline-side-marker-control .details-guideline-icon-select:focus {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  transform: translateX(-6px) !important;
  z-index: 8 !important;
}

/* STABLE LAYOUT LOCKS 2026-07-01:
   Sensitive guideline controls are intentionally pinned so future feature changes do not shift text fields. */
.ultra-compact-guideline,
.compact-guideline.ultra-compact-guideline {
  grid-template-columns: minmax(190px, 260px) 7px minmax(0, 1fr) 28px !important;
  grid-template-areas:
    "sequence color title delete"
    "sequence color details delete"
    "sequence color scenario delete"
    "subnotes subnotes subnotes subnotes"
    "note note note note" !important;
  column-gap: 8px !important;
  overflow: visible !important;
}

.ultra-compact-guideline .sequence-panel {
  grid-area: sequence !important;
  min-width: 0 !important;
  max-width: 260px !important;
}

.ultra-compact-guideline > .guideline-side-control-stack {
  grid-area: color !important;
}

.ultra-compact-guideline > .guideline-writing-stack {
  grid-column: 3 !important;
  min-width: 0 !important;
  width: 100% !important;
}

.ultra-compact-guideline .compact-delete {
  grid-area: delete !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
}

.ultra-compact-guideline .sequence-entry-color-line {
  width: 6px !important;
  min-width: 6px !important;
  max-width: 6px !important;
}

.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack-input:hover,
.ultra-compact-guideline .sequence-stack-input:focus {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  transform: none !important;
}

.ultra-compact-guideline .tag-strip-palette {
  width: 252px !important;
  min-width: 252px !important;
  max-width: 252px !important;
}

/* Chapter safety controls: backup/export and confirmed chapter-only reset. */
.chapter-actions.chapter-safety-actions {
  align-items: center !important;
}

.chapter-safety-actions .chapter-backup-button {
  border-color: rgba(48,95,114,.22) !important;
  background: #f7fbfc !important;
  color: #244f63 !important;
  font-weight: 850 !important;
}

.chapter-safety-actions .chapter-reset-button,
button.danger-soft {
  border-color: rgba(138,52,52,.22) !important;
  background: #fff7f4 !important;
  color: #8a3434 !important;
  font-weight: 850 !important;
}

.chapter-safety-actions .chapter-reset-button:hover,
button.danger-soft:hover {
  background: #ffe9e0 !important;
}

/* SHORT TAG STRIP LOCK 2026-07-01:
   Keep the strip width exactly the same, but stop it from running the full row height. */
.ultra-compact-guideline > .guideline-side-control-stack,
.compact-guideline > .guideline-side-control-stack,
.guideline-item > .guideline-side-control-stack {
  align-self: start !important;
  grid-template-rows: 44px 24px !important;
  gap: 5px !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  min-height: 73px !important;
  max-height: 73px !important;
}

.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip,
.compact-guideline > .guideline-side-control-stack .tag-color-strip,
.guideline-item > .guideline-side-control-stack .tag-color-strip {
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  align-self: start !important;
  justify-self: center !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline,
  .compact-guideline.ultra-compact-guideline {
    grid-template-columns: 1fr 7px 28px !important;
    grid-template-areas:
      "sequence color delete"
      "title title title"
      "details details details"
      "scenario scenario scenario"
      "subnotes subnotes subnotes"
      "note note note" !important;
  }
}

/* REDESIGNED GLOBAL SEARCH RESULTS 2026-07-01:
   Exact match rows with clean navigation; no bulky link bubbles. */
.search-results-page {
  display: grid !important;
  gap: 14px !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
}

.search-results-topline {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 14px !important;
  padding: 12px 4px 8px !important;
  border-bottom: 1px solid rgba(48,95,114,.14) !important;
}

.search-eyebrow {
  color: #6f8b98 !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.search-results-topline h2 {
  margin: 2px 0 4px !important;
  font-size: 1.35rem !important;
  color: #1f2933 !important;
}

.search-results-topline p,
.search-limit-note {
  margin: 0 !important;
  color: #637783 !important;
  font-size: .86rem !important;
}

.search-page-actions {
  display: inline-flex !important;
  gap: 6px !important;
  align-items: center !important;
  justify-content: end !important;
}

.search-result-list.redesigned-search-results {
  display: grid !important;
  gap: 7px !important;
}

.search-result-row {
  display: grid !important;
  grid-template-columns: 142px minmax(150px, .65fr) minmax(0, 1.35fr) !important;
  gap: 10px !important;
  align-items: baseline !important;
  width: 100% !important;
  text-align: left !important;
  padding: 9px 10px !important;
  border: 0 !important;
  border-left: 3px solid rgba(126,182,200,.65) !important;
  border-radius: 8px !important;
  background: linear-gradient(90deg, rgba(247,251,252,.95), rgba(255,255,255,.88)) !important;
  box-shadow: none !important;
  color: #1f2933 !important;
  cursor: pointer !important;
}

.search-result-row:hover,
.search-result-row:focus-visible {
  background: #f1fafc !important;
  border-left-color: #305f72 !important;
  outline: 2px solid rgba(48,95,114,.16) !important;
  outline-offset: 1px !important;
}

.search-result-type {
  color: #305f72 !important;
  font-size: .78rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}

.search-result-path {
  color: #526571 !important;
  font-size: .8rem !important;
  font-weight: 800 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

.search-result-excerpt {
  color: #263642 !important;
  font-size: .9rem !important;
  line-height: 1.35 !important;
}

.search-result-excerpt mark {
  background: #fff09a !important;
  color: #17212b !important;
  border-radius: 3px !important;
  padding: 0 2px !important;
  font-weight: 900 !important;
}

.search-empty-clean {
  padding: 18px 4px !important;
  color: #647984 !important;
  border-bottom: 1px solid rgba(48,95,114,.12) !important;
}

.search-destination-flash,
.guideline-search-selected,
.guideline-search-field-selected,
.at-a-glance-search-selected {
  animation: searchDestinationPulse 1.25s ease-in-out 0s 2 !important;
  outline: 3px solid rgba(255,214,0,.75) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 7px rgba(255,240,154,.55), 0 10px 24px rgba(31,41,51,.13) !important;
}

@keyframes searchDestinationPulse {
  0% { box-shadow: 0 0 0 0 rgba(255,214,0,.05), 0 0 0 rgba(31,41,51,0); }
  45% { box-shadow: 0 0 0 8px rgba(255,240,154,.72), 0 10px 24px rgba(31,41,51,.14); }
  100% { box-shadow: 0 0 0 3px rgba(255,240,154,.28), 0 0 0 rgba(31,41,51,0); }
}

@media (max-width: 860px) {
  .search-results-topline {
    grid-template-columns: 1fr !important;
  }
  .search-page-actions {
    justify-content: start !important;
  }
  .search-result-row {
    grid-template-columns: 1fr !important;
    gap: 3px !important;
  }
  .search-result-path {
    white-space: normal !important;
  }
}

/* MARKER REDESIGN 2026-07-01:
   Marker now lives in the Code Sequence header, not beside the writing fields.
   The color strip remains short and narrow; Guideline/Details/Scenario fields stay aligned. */
.ultra-compact-guideline .sequence-panel-header,
.compact-guideline .sequence-panel-header,
.guideline-item .sequence-panel-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 0 5px 0 !important;
}

.ultra-compact-guideline .sequence-panel-header .sequence-panel-label,
.compact-guideline .sequence-panel-header .sequence-panel-label,
.guideline-item .sequence-panel-header .sequence-panel-label {
  min-width: 0 !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

.ultra-compact-guideline .sequence-marker-control,
.compact-guideline .sequence-marker-control,
.guideline-item .sequence-marker-control {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 2px 4px 2px 7px !important;
  margin: 0 !important;
  border: 1px solid rgba(48,95,114,.20) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg,#ffffff,#f7fbfc) !important;
  box-shadow: 0 1px 4px rgba(31,41,51,.07) !important;
  color: #305f72 !important;
  overflow: hidden !important;
}

.ultra-compact-guideline .sequence-marker-label,
.compact-guideline .sequence-marker-label,
.guideline-item .sequence-marker-label {
  display: inline-block !important;
  font-size: 9px !important;
  line-height: 1 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  font-weight: 900 !important;
  color: #5c7580 !important;
  user-select: none !important;
}

.ultra-compact-guideline .sequence-marker-select,
.compact-guideline .sequence-marker-select,
.guideline-item .sequence-marker-select {
  display: inline-block !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  padding: 0 12px 0 3px !important;
  margin: 0 !important;
  border: 0 !important;
  border-left: 1px solid rgba(48,95,114,.16) !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  color: #1f2933 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 20px !important;
  text-align: center !important;
  text-align-last: center !important;
  box-shadow: none !important;
  transform: none !important;
}

.ultra-compact-guideline .sequence-marker-select:hover,
.ultra-compact-guideline .sequence-marker-select:focus,
.compact-guideline .sequence-marker-select:hover,
.compact-guideline .sequence-marker-select:focus,
.guideline-item .sequence-marker-select:hover,
.guideline-item .sequence-marker-select:focus {
  outline: 2px solid rgba(48,95,114,.16) !important;
  outline-offset: 1px !important;
  transform: none !important;
}

.ultra-compact-guideline > .guideline-side-control-stack,
.compact-guideline > .guideline-side-control-stack,
.guideline-item > .guideline-side-control-stack {
  grid-area: color !important;
  align-self: start !important;
  justify-self: center !important;
  display: grid !important;
  grid-template-rows: 44px !important;
  align-items: start !important;
  justify-items: center !important;
  gap: 0 !important;
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip,
.compact-guideline > .guideline-side-control-stack .tag-color-strip,
.guideline-item > .guideline-side-control-stack .tag-color-strip {
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  align-self: start !important;
  justify-self: center !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 999px !important;
}

.ultra-compact-guideline > .guideline-writing-stack,
.compact-guideline.ultra-compact-guideline > .guideline-writing-stack,
.guideline-item.ultra-compact-guideline > .guideline-writing-stack {
  grid-area: auto !important;
  grid-column: 3 !important;
  grid-row: 1 / 4 !important;
  align-self: start !important;
  justify-self: stretch !important;
  display: grid !important;
  grid-template-rows: auto auto auto !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

.ultra-compact-guideline .guideline-writing-box,
.ultra-compact-guideline .guideline-detail-fieldset,
.ultra-compact-guideline .scenario-exception-fieldset {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

.ultra-compact-guideline .guideline-writing-stack textarea,
.ultra-compact-guideline .guideline-writing-stack textarea:hover,
.ultra-compact-guideline .guideline-writing-stack textarea:focus {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  transform: none !important;
}

.ultra-compact-guideline .guideline-side-marker-control,
.compact-guideline .guideline-side-marker-control,
.guideline-item .guideline-side-marker-control,
.ultra-compact-guideline .details-guideline-icon-select,
.compact-guideline .details-guideline-icon-select,
.guideline-item .details-guideline-icon-select {
  display: none !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline .sequence-panel-header,
  .compact-guideline .sequence-panel-header,
  .guideline-item .sequence-panel-header {
    justify-content: flex-start !important;
  }

  .ultra-compact-guideline > .guideline-writing-stack,
  .compact-guideline.ultra-compact-guideline > .guideline-writing-stack,
  .guideline-item.ultra-compact-guideline > .guideline-writing-stack {
    grid-area: auto !important;
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
  }
}

/* CLEAN GUIDELINE CARD REDESIGN 2026-07-01:
   Full guideline-area reset. All features remain, but the layout is now split into
   stable zones: Code Sequence/controls, short color strip, aligned writing column,
   delete rail, and full-width subnotes below. */
.category-stack#guidelineTags .guideline-item.ultra-compact-guideline,
.guideline-item.ultra-compact-guideline,
.compact-guideline.ultra-compact-guideline,
.ultra-compact-guideline {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 268px) 7px minmax(420px, 1fr) 32px !important;
  grid-template-rows: auto auto !important;
  grid-template-areas:
    "sequence color writing delete"
    "subnotes subnotes subnotes subnotes" !important;
  column-gap: 14px !important;
  row-gap: 10px !important;
  align-items: start !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 12px 12px 11px 12px !important;
  margin: 8px 0 !important;
  border: 1px solid rgba(48,95,114,.14) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdfd 100%) !important;
  box-shadow: 0 2px 10px rgba(31,41,51,.055) !important;
  overflow: visible !important;
  transform: none !important;
}

.ultra-compact-guideline > .sequence-panel,
.compact-guideline.ultra-compact-guideline > .sequence-panel,
.guideline-item.ultra-compact-guideline > .sequence-panel {
  grid-area: sequence !important;
  align-self: start !important;
  justify-self: stretch !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 1px solid rgba(48,95,114,.12) !important;
  border-radius: 13px !important;
  background: #f8fbfc !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.65) !important;
  transform: none !important;
}

.ultra-compact-guideline .sequence-panel-header,
.compact-guideline .sequence-panel-header,
.guideline-item .sequence-panel-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 0 7px 0 !important;
  padding: 0 !important;
}

.ultra-compact-guideline .sequence-panel-label,
.compact-guideline .sequence-panel-label,
.guideline-item .sequence-panel-label {
  min-width: 0 !important;
  margin: 0 !important;
  color: #305f72 !important;
  font-size: 10px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.ultra-compact-guideline .sequence-marker-control,
.compact-guideline .sequence-marker-control,
.guideline-item .sequence-marker-control {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  height: 25px !important;
  min-height: 25px !important;
  max-height: 25px !important;
  padding: 2px 5px 2px 8px !important;
  border: 1px solid rgba(48,95,114,.20) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 4px rgba(31,41,51,.07) !important;
  overflow: hidden !important;
}

.ultra-compact-guideline .sequence-marker-label,
.compact-guideline .sequence-marker-label,
.guideline-item .sequence-marker-label {
  display: inline-block !important;
  color: #5c7580 !important;
  font-size: 9px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;
}

.ultra-compact-guideline .sequence-marker-select,
.compact-guideline .sequence-marker-select,
.guideline-item .sequence-marker-select {
  display: inline-block !important;
  width: 38px !important;
  min-width: 38px !important;
  max-width: 38px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  padding: 0 12px 0 3px !important;
  margin: 0 !important;
  border: 0 !important;
  border-left: 1px solid rgba(48,95,114,.16) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #1f2933 !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 20px !important;
  text-align: center !important;
  text-align-last: center !important;
  transform: none !important;
}

.ultra-compact-guideline .sequence-stack,
.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack-input:hover,
.ultra-compact-guideline .sequence-stack-input:focus {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  transform: none !important;
}

.ultra-compact-guideline .sequence-subnote-toggles.clean-control-table,
.ultra-compact-guideline .sequence-toggle-cell {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 8px 0 0 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px !important;
  transform: none !important;
}

.ultra-compact-guideline .sequence-toggle-cell .subnote-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 4px 6px !important;
  border: 1px solid rgba(48,95,114,.12) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #455d68 !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.ultra-compact-guideline > .guideline-side-control-stack,
.compact-guideline.ultra-compact-guideline > .guideline-side-control-stack,
.guideline-item.ultra-compact-guideline > .guideline-side-control-stack {
  grid-area: color !important;
  align-self: start !important;
  justify-self: center !important;
  display: block !important;
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  padding: 0 !important;
  margin: 4px 0 0 0 !important;
  overflow: visible !important;
  transform: none !important;
}

.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip,
.compact-guideline.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip,
.guideline-item.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip {
  display: block !important;
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--tag-color) !important;
  box-shadow: inset 0 0 0 1px rgba(31,41,51,.13), 0 1px 4px rgba(31,41,51,.10) !important;
  transform: none !important;
}

.ultra-compact-guideline > .guideline-writing-stack,
.compact-guideline.ultra-compact-guideline > .guideline-writing-stack,
.guideline-item.ultra-compact-guideline > .guideline-writing-stack {
  grid-area: writing !important;
  align-self: start !important;
  justify-self: stretch !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto auto !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  transform: none !important;
}

.ultra-compact-guideline .guideline-writing-box,
.ultra-compact-guideline .guideline-detail-fieldset,
.ultra-compact-guideline .scenario-exception-fieldset,
.ultra-compact-guideline .guideline-detail-fieldset .guideline-writing-box {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  transform: none !important;
}

.ultra-compact-guideline .guideline-writing-caption {
  display: block !important;
  margin: 0 0 3px 2px !important;
  color: #526571 !important;
  font-size: 10px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  letter-spacing: .045em !important;
  text-transform: uppercase !important;
}

.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .guideline-label-textarea.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-details.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-scenario.textarea-default-collapsed,
.ultra-compact-guideline .guideline-writing-stack textarea,
.ultra-compact-guideline .guideline-writing-stack textarea:hover,
.ultra-compact-guideline .guideline-writing-stack textarea:focus {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(48,95,114,.15) !important;
  border-radius: 11px !important;
  background: #ffffff !important;
  color: #1f2933 !important;
  box-shadow: inset 0 1px 2px rgba(31,41,51,.035) !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  resize: vertical !important;
  transform: none !important;
}

.ultra-compact-guideline .guideline-label-textarea:focus,
.ultra-compact-guideline .inline-guideline-details:focus,
.ultra-compact-guideline .inline-guideline-scenario:focus {
  border-color: rgba(48,95,114,.36) !important;
  box-shadow: 0 0 0 3px rgba(48,95,114,.10), inset 0 1px 2px rgba(31,41,51,.035) !important;
  outline: none !important;
}

.ultra-compact-guideline > .compact-delete,
.compact-guideline.ultra-compact-guideline > .compact-delete,
.guideline-item.ultra-compact-guideline > .compact-delete {
  grid-area: delete !important;
  align-self: start !important;
  justify-self: end !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  margin: 1px 0 0 0 !important;
  border-radius: 9px !important;
  font-size: 16px !important;
  line-height: 26px !important;
  transform: none !important;
}

.ultra-compact-guideline > .guideline-subnote-writing-stack,
.compact-guideline.ultra-compact-guideline > .guideline-subnote-writing-stack,
.guideline-item.ultra-compact-guideline > .guideline-subnote-writing-stack {
  grid-area: subnotes !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

.ultra-compact-guideline .guideline-bottom-subnotes {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
}

.ultra-compact-guideline .bottom-subnote-field,
.ultra-compact-guideline .guideline-tag-note-field {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  transform: none !important;
}

.ultra-compact-guideline .tag-strip-palette {
  z-index: 20 !important;
}

.ultra-compact-guideline .guideline-side-marker-control,
.ultra-compact-guideline .details-guideline-icon-select:not(.sequence-marker-select),
.compact-guideline .guideline-side-marker-control,
.guideline-item .guideline-side-marker-control {
  display: none !important;
}

@media (max-width: 1120px) {
  .category-stack#guidelineTags .guideline-item.ultra-compact-guideline,
  .guideline-item.ultra-compact-guideline,
  .compact-guideline.ultra-compact-guideline,
  .ultra-compact-guideline {
    grid-template-columns: 1fr 7px 32px !important;
    grid-template-areas:
      "sequence color delete"
      "writing writing writing"
      "subnotes subnotes subnotes" !important;
    column-gap: 10px !important;
  }

  .ultra-compact-guideline > .guideline-writing-stack,
  .compact-guideline.ultra-compact-guideline > .guideline-writing-stack,
  .guideline-item.ultra-compact-guideline > .guideline-writing-stack {
    grid-area: writing !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }
}

@media (max-width: 760px) {
  .category-stack#guidelineTags .guideline-item.ultra-compact-guideline,
  .guideline-item.ultra-compact-guideline,
  .compact-guideline.ultra-compact-guideline,
  .ultra-compact-guideline {
    grid-template-columns: 7px minmax(0, 1fr) 32px !important;
    grid-template-areas:
      "color sequence delete"
      "writing writing writing"
      "subnotes subnotes subnotes" !important;
    padding: 10px !important;
  }

  .ultra-compact-guideline .guideline-bottom-subnotes {
    grid-template-columns: 1fr !important;
  }
}

/* TIGHT GUIDELINE SPACING PASS 2026-07-01:
   Close unused whitespace in the clean guideline card while preserving every control. */
.category-stack#guidelineTags .guideline-item.ultra-compact-guideline,
.guideline-item.ultra-compact-guideline,
.compact-guideline.ultra-compact-guideline,
.ultra-compact-guideline {
  grid-template-columns: minmax(196px, 238px) 7px minmax(300px, 1fr) 28px !important;
  column-gap: 8px !important;
  row-gap: 7px !important;
  padding: 8px 9px 8px 9px !important;
  margin: 6px 0 !important;
  border-radius: 13px !important;
}

.ultra-compact-guideline > .sequence-panel,
.compact-guideline.ultra-compact-guideline > .sequence-panel,
.guideline-item.ultra-compact-guideline > .sequence-panel {
  padding: 6px !important;
  border-radius: 11px !important;
}

.ultra-compact-guideline .sequence-panel-header,
.compact-guideline .sequence-panel-header,
.guideline-item .sequence-panel-header {
  gap: 5px !important;
  margin-bottom: 4px !important;
}

.ultra-compact-guideline .sequence-panel-label,
.compact-guideline .sequence-panel-label,
.guideline-item .sequence-panel-label {
  font-size: 9px !important;
  letter-spacing: .06em !important;
}

.ultra-compact-guideline .sequence-marker-control,
.compact-guideline .sequence-marker-control,
.guideline-item .sequence-marker-control {
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  gap: 3px !important;
  padding: 1px 4px 1px 6px !important;
}

.ultra-compact-guideline .sequence-marker-label,
.compact-guideline .sequence-marker-label,
.guideline-item .sequence-marker-label {
  font-size: 8.5px !important;
}

.ultra-compact-guideline .sequence-marker-select,
.compact-guideline .sequence-marker-select,
.guideline-item .sequence-marker-select {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  line-height: 18px !important;
  font-size: 12px !important;
  padding: 0 10px 0 2px !important;
}

.ultra-compact-guideline .sequence-stack {
  gap: 3px !important;
}

.ultra-compact-guideline .sequence-stack-row,
.ultra-compact-guideline .sequence-entry-row {
  gap: 4px !important;
  margin: 0 !important;
}

.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack-input:hover,
.ultra-compact-guideline .sequence-stack-input:focus {
  min-height: 26px !important;
  height: 26px !important;
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}

.ultra-compact-guideline .sequence-subnote-toggles.clean-control-table,
.ultra-compact-guideline .sequence-toggle-cell {
  margin-top: 5px !important;
  gap: 3px !important;
}

.ultra-compact-guideline .sequence-toggle-cell .subnote-toggle {
  padding: 3px 5px !important;
  font-size: 9.5px !important;
}

.ultra-compact-guideline > .guideline-side-control-stack,
.compact-guideline.ultra-compact-guideline > .guideline-side-control-stack,
.guideline-item.ultra-compact-guideline > .guideline-side-control-stack,
.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip,
.compact-guideline.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip,
.guideline-item.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip {
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
}

.ultra-compact-guideline > .guideline-side-control-stack,
.compact-guideline.ultra-compact-guideline > .guideline-side-control-stack,
.guideline-item.ultra-compact-guideline > .guideline-side-control-stack {
  margin-top: 2px !important;
}

.ultra-compact-guideline > .guideline-writing-stack,
.compact-guideline.ultra-compact-guideline > .guideline-writing-stack,
.guideline-item.ultra-compact-guideline > .guideline-writing-stack {
  gap: 5px !important;
}

.ultra-compact-guideline .guideline-writing-caption {
  margin: 0 0 2px 1px !important;
  font-size: 9px !important;
  letter-spacing: .035em !important;
}

.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .guideline-label-textarea.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-details.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-scenario.textarea-default-collapsed,
.ultra-compact-guideline .guideline-writing-stack textarea,
.ultra-compact-guideline .guideline-writing-stack textarea:hover,
.ultra-compact-guideline .guideline-writing-stack textarea:focus {
  min-height: 30px !important;
  padding: 5px 8px !important;
  border-radius: 9px !important;
  font-size: 12.5px !important;
  line-height: 1.28 !important;
}

.ultra-compact-guideline > .compact-delete,
.compact-guideline.ultra-compact-guideline > .compact-delete,
.guideline-item.ultra-compact-guideline > .compact-delete {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  line-height: 22px !important;
}

.ultra-compact-guideline > .guideline-subnote-writing-stack,
.compact-guideline.ultra-compact-guideline > .guideline-subnote-writing-stack,
.guideline-item.ultra-compact-guideline > .guideline-subnote-writing-stack,
.ultra-compact-guideline .guideline-bottom-subnotes {
  gap: 5px !important;
}

@media (max-width: 1120px) {
  .category-stack#guidelineTags .guideline-item.ultra-compact-guideline,
  .guideline-item.ultra-compact-guideline,
  .compact-guideline.ultra-compact-guideline,
  .ultra-compact-guideline {
    grid-template-columns: 1fr 7px 28px !important;
    column-gap: 7px !important;
    row-gap: 6px !important;
  }
}

@media (max-width: 760px) {
  .category-stack#guidelineTags .guideline-item.ultra-compact-guideline,
  .guideline-item.ultra-compact-guideline,
  .compact-guideline.ultra-compact-guideline,
  .ultra-compact-guideline {
    grid-template-columns: 7px minmax(0, 1fr) 28px !important;
    padding: 8px !important;
  }
}

/* SECTION HEADER MARKER + TOP-FIRST GUIDELINE LAYOUT 2026-07-01:
   Marker selector moved beside the Minimize/Expand section button. Guideline text
   fields return to the top of every card, with Code Sequence below to remove wasted space. */
.category-head .category-title-line,
.category-head .category-title-line-no-marker {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
}

.category-head .main-section-collapse-toggle {
  flex: 0 0 28px !important;
}

.section-marker-control {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(48,95,114,.20) !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 4px rgba(31,41,51,.08) !important;
  overflow: hidden !important;
}

.section-marker-select {
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 11px 0 3px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #1f2933 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 26px !important;
  text-align: center !important;
  text-align-last: center !important;
  box-shadow: none !important;
}

.section-marker-select:focus {
  outline: 2px solid rgba(48,95,114,.22) !important;
  outline-offset: 1px !important;
}

.category-head .category-title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

.category-stack#guidelineTags .guideline-item.ultra-compact-guideline,
.guideline-item.ultra-compact-guideline,
.compact-guideline.ultra-compact-guideline,
.ultra-compact-guideline {
  display: grid !important;
  grid-template-columns: 7px minmax(0, 1fr) 24px !important;
  grid-template-rows: auto auto auto !important;
  grid-template-areas:
    "color writing delete"
    "color sequence sequence"
    "subnotes subnotes subnotes" !important;
  column-gap: 7px !important;
  row-gap: 5px !important;
  align-items: start !important;
  padding: 7px 8px !important;
  margin: 5px 0 !important;
  border-radius: 12px !important;
}

.ultra-compact-guideline > .guideline-writing-stack,
.compact-guideline.ultra-compact-guideline > .guideline-writing-stack,
.guideline-item.ultra-compact-guideline > .guideline-writing-stack {
  grid-area: writing !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: start !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .95fr) minmax(0, .95fr) !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ultra-compact-guideline .guideline-writing-box,
.ultra-compact-guideline .guideline-detail-fieldset,
.ultra-compact-guideline .scenario-exception-fieldset,
.ultra-compact-guideline .guideline-detail-fieldset .guideline-writing-box {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ultra-compact-guideline .guideline-writing-caption {
  margin: 0 0 1px 1px !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
}

.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .guideline-writing-stack textarea,
.ultra-compact-guideline .guideline-writing-stack textarea:hover,
.ultra-compact-guideline .guideline-writing-stack textarea:focus {
  min-height: 28px !important;
  padding: 4px 7px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  line-height: 1.22 !important;
}

.ultra-compact-guideline > .sequence-panel,
.compact-guideline.ultra-compact-guideline > .sequence-panel,
.guideline-item.ultra-compact-guideline > .sequence-panel {
  grid-area: sequence !important;
  display: grid !important;
  grid-template-columns: minmax(170px, 240px) minmax(0, 1fr) !important;
  gap: 6px !important;
  align-items: start !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 5px 6px !important;
  margin: 0 !important;
  border-radius: 10px !important;
}

.ultra-compact-guideline .sequence-panel-header {
  display: none !important;
}

.ultra-compact-guideline .sequence-stack {
  width: 100% !important;
  min-width: 0 !important;
  gap: 3px !important;
}

.ultra-compact-guideline .sequence-subnote-toggles.clean-control-table,
.ultra-compact-guideline .sequence-toggle-cell {
  margin: 0 !important;
  align-content: start !important;
}

.ultra-compact-guideline > .guideline-side-control-stack,
.compact-guideline.ultra-compact-guideline > .guideline-side-control-stack,
.guideline-item.ultra-compact-guideline > .guideline-side-control-stack,
.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip,
.compact-guideline.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip,
.guideline-item.ultra-compact-guideline > .guideline-side-control-stack .tag-color-strip {
  grid-area: color !important;
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  margin-top: 12px !important;
}

.ultra-compact-guideline > .compact-delete,
.compact-guideline.ultra-compact-guideline > .compact-delete,
.guideline-item.ultra-compact-guideline > .compact-delete {
  grid-area: delete !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  margin: 10px 0 0 0 !important;
}

.ultra-compact-guideline > .guideline-subnote-writing-stack,
.compact-guideline.ultra-compact-guideline > .guideline-subnote-writing-stack,
.guideline-item.ultra-compact-guideline > .guideline-subnote-writing-stack {
  grid-area: subnotes !important;
  gap: 5px !important;
}

.sequence-marker-control,
.sequence-marker-select,
.guideline-side-marker-control,
.details-guideline-icon-select:not(.section-marker-select) {
  display: none !important;
}

@media (max-width: 1120px) {
  .ultra-compact-guideline > .guideline-writing-stack,
  .compact-guideline.ultra-compact-guideline > .guideline-writing-stack,
  .guideline-item.ultra-compact-guideline > .guideline-writing-stack {
    grid-template-columns: 1fr !important;
  }

  .ultra-compact-guideline > .sequence-panel,
  .compact-guideline.ultra-compact-guideline > .sequence-panel,
  .guideline-item.ultra-compact-guideline > .sequence-panel {
    grid-template-columns: 1fr !important;
  }
}



/* WIDE SECTION MARKER SELECT 2026-07-01:
   Give the section-level marker dropdown enough room to show the selected icon. */
.category-head .section-marker-control {
  flex: 0 0 54px !important;
  width: 54px !important;
  min-width: 54px !important;
  max-width: 54px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  overflow: visible !important;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfc 100%) !important;
  border: 1px solid rgba(48,95,114,.24) !important;
  box-shadow: 0 1px 5px rgba(31,41,51,.10) !important;
}

.category-head .section-marker-select {
  display: block !important;
  box-sizing: border-box !important;
  width: 54px !important;
  min-width: 54px !important;
  max-width: 54px !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 18px 0 8px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background-color: transparent !important;
  color: #1f2933 !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  line-height: 30px !important;
  text-align: center !important;
  text-align-last: center !important;
  box-shadow: none !important;
  transform: none !important;
  overflow: visible !important;
}

.category-head .section-marker-select:hover {
  background-color: rgba(48,95,114,.045) !important;
}

.category-head .section-marker-select:focus {
  outline: 2px solid rgba(48,95,114,.24) !important;
  outline-offset: 2px !important;
}

.category-head .section-marker-select option {
  font-size: 14px !important;
  font-weight: 800 !important;
}

/* TWO-LINE GUIDELINE TEXTAREA LOCK 2026-07-01:
   Guideline writing fields must show at least two readable lines by default. */
.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .guideline-label-textarea.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-details.textarea-default-collapsed,
.ultra-compact-guideline .inline-guideline-scenario.textarea-default-collapsed,
.ultra-compact-guideline .guideline-writing-stack textarea,
.ultra-compact-guideline .guideline-writing-stack textarea:hover,
.ultra-compact-guideline .guideline-writing-stack textarea:focus {
  min-height: 48px !important;
  height: auto !important;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  line-height: 1.35 !important;
  overflow-y: auto !important;
  resize: vertical !important;
}

.ultra-compact-guideline .guideline-bottom-subnotes .sequence-sub-entry,
.ultra-compact-guideline .guideline-bottom-subnotes .sequence-sub-entry.textarea-default-collapsed,
.ultra-compact-guideline .guideline-tag-note-field textarea,
.ultra-compact-guideline .guideline-tag-note-field textarea.textarea-default-collapsed,
.ultra-compact-guideline .bottom-subnote-field textarea,
.ultra-compact-guideline .bottom-subnote-field textarea.textarea-default-collapsed {
  min-height: 48px !important;
  height: auto !important;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  line-height: 1.35 !important;
  overflow-y: auto !important;
  resize: vertical !important;
}

.category.main-section-minimized .ultra-compact-guideline .guideline-label-textarea,
.category.main-section-minimized .ultra-compact-guideline .inline-guideline-details,
.category.main-section-minimized .ultra-compact-guideline .inline-guideline-scenario {
  min-height: 42px !important;
}



/* SMALL SECTION MARKER ICONS 2026-07-01:
   Keep the section marker dropdown wide enough, but shrink displayed icons so they are not clipped. */
.category-head .section-marker-control {
  width: 50px !important;
  min-width: 50px !important;
  max-width: 50px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  border-radius: 9px !important;
}

.category-head .section-marker-select {
  width: 50px !important;
  min-width: 50px !important;
  max-width: 50px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 17px 0 7px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 26px !important;
  text-align: center !important;
  text-align-last: center !important;
}

.category-head .section-marker-select option {
  font-size: 12px !important;
  font-weight: 800 !important;
}

/* MARKER BUTTON POPOVER GRID 2026-07-02:
   Replaces the native select so marker icons are never clipped by dropdown chrome. */
.category-head,
.category-head .category-title-line,
.category-head .category-title-line-no-marker {
  overflow: visible !important;
}

.category-head .section-marker-popover-control,
.category-head .section-marker-control.section-marker-popover-control {
  position: relative !important;
  flex: 0 0 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  min-width: 30px !important;
  max-width: 30px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  z-index: 25 !important;
}

.section-marker-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid rgba(48,95,114,.23) !important;
  border-radius: 9px !important;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfc 100%) !important;
  color: #2f4853 !important;
  box-shadow: 0 1px 4px rgba(31,41,51,.09) !important;
  cursor: pointer !important;
}

.section-marker-button:hover,
.section-marker-popover-control.picker-open .section-marker-button {
  border-color: rgba(48,95,114,.38) !important;
  background: #eef7fa !important;
}

.section-marker-button-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  height: 20px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  overflow: visible !important;
}

.section-marker-button:not(.has-marker) .section-marker-button-icon {
  color: #8aa0aa !important;
  font-size: 17px !important;
  transform: translateY(-1px) !important;
}

.section-marker-picker {
  position: absolute !important;
  top: calc(100% + 6px) !important;
  left: 0 !important;
  display: none !important;
  grid-template-columns: repeat(6, 24px) !important;
  gap: 4px !important;
  width: max-content !important;
  max-width: 190px !important;
  padding: 8px !important;
  border: 1px solid rgba(48,95,114,.20) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 14px 34px rgba(31,41,51,.18) !important;
  z-index: 999 !important;
}

.section-marker-popover-control.picker-open .section-marker-picker {
  display: grid !important;
}

.section-marker-choice,
.section-marker-clear {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid rgba(48,95,114,.13) !important;
  border-radius: 8px !important;
  background: #f9fcfd !important;
  color: #1f2933 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

.section-marker-clear {
  color: #8a3434 !important;
  font-size: 15px !important;
  font-weight: 900 !important;
}

.section-marker-choice:hover,
.section-marker-clear:hover,
.section-marker-choice.selected,
.section-marker-clear.selected {
  border-color: rgba(48,95,114,.38) !important;
  background: #eaf5f8 !important;
  box-shadow: 0 0 0 2px rgba(48,95,114,.10) !important;
}

.section-marker-select {
  display: none !important;
}



/* OFFLINE LICENSE GATE 2026-07-02:
   First-launch purchase activation screen for the commercial desktop app. */
body.license-locked {
  overflow: hidden !important;
}

body.license-locked .license-modal {
  display: grid !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.license-locked .license-modal .modal-card {
  transform: none !important;
}

.license-card {
  max-width: 520px !important;
  border-top: 8px solid #305f72 !important;
  box-shadow: 0 24px 80px rgba(31,41,51,.28) !important;
}

.license-key-input {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  font-weight: 800 !important;
}

.license-message {
  padding: 8px 10px !important;
  border-radius: 10px !important;
  background: rgba(187, 48, 48, .08) !important;
}

.license-message.success {
  background: rgba(38, 135, 88, .10) !important;
}


/* FINAL READY-TO-SELL USABILITY UPDATE 2026-07-03:
   Larger persistent tag-color menu, no color-group headings, title-only collapsed guideline sections, and easier bottom-row adding. */
.guideline-item .tag-strip-palette,
.guideline-item.show-tag-palette .tag-strip-palette,
.ultra-compact-guideline .tag-strip-palette {
  z-index: 9999 !important;
  width: min(340px, calc(100vw - 32px)) !important;
  min-width: min(340px, calc(100vw - 32px)) !important;
  max-width: min(340px, calc(100vw - 32px)) !important;
  max-height: min(420px, calc(100vh - 32px)) !important;
  padding: 10px !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
}

.tag-strip-palette-title,
.tag-strip-palette-section {
  display: contents !important;
}

.tag-strip-swatch-list {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
  gap: 8px !important;
}

.tag-strip-swatch {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
}

.category.main-section-minimized .ultra-compact-guideline {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas: "writing" !important;
  padding: 6px 10px !important;
}

.category.main-section-minimized .sequence-panel,
.category.main-section-minimized .guideline-side-control-stack,
.category.main-section-minimized .guideline-detail-fieldset,
.category.main-section-minimized .guideline-subnote-writing-stack,
.category.main-section-minimized .compact-delete,
.category.main-section-minimized .category-bottom-tools,
.category.main-section-minimized .ready-guideline-starter {
  display: none !important;
}

.category.main-section-minimized .guideline-writing-stack {
  display: block !important;
}

.category.main-section-minimized .guideline-writing-box:not([data-writing-box="guideline-label"]) {
  display: none !important;
}

.category.main-section-minimized .guideline-label-textarea,
.category.main-section-minimized .guideline-label-textarea:focus,
.category.main-section-minimized .guideline-label-textarea:hover {
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  overflow: hidden !important;
  resize: none !important;
}

.ready-guideline-starter {
  width: 100% !important;
  border: 1px dashed rgba(48,95,114,.45) !important;
  background: rgba(238,249,251,.55) !important;
  color: #244f63 !important;
  font-weight: 850 !important;
  text-align: center !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
  cursor: pointer !important;
}

.ready-guideline-starter:hover,
.ready-guideline-starter:focus-visible {
  background: #e6f7fb !important;
  border-color: rgba(48,95,114,.8) !important;
}

.tag-title-jump {
  white-space: normal !important;
  text-align: left !important;
  line-height: 1.35 !important;
}

.summary-detail {
  color: #52606d !important;
  font-weight: 650 !important;
}

.summary-exception {
  color: #9b2c2c !important;
}

.summary-note {
  color: #6b4e00 !important;
}


/* FINAL SLIM AT-A-GLANCE + TRUE TITLE-ONLY COLLAPSE UPDATE 2026-07-03 */
.tag-title-row .tag-title-jump {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 28px !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.summary-symbol-group,
.summary-sequence-code {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  flex: 0 0 auto !important;
}

.summary-symbol,
.summary-alert,
.summary-sequence-part,
.summary-sequence-symbol {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 19px !important;
  min-width: 19px !important;
  height: 19px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(48, 95, 114, .25) !important;
  background: var(--summary-sequence-highlight, #f7fbfc) !important;
  color: #244f63 !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  margin: 0 !important;
}

.summary-alert-exception { color: #9b2c2c !important; background: #fff4e8 !important; }
.summary-alert-note { color: #6b4e00 !important; background: #fff9db !important; }
.summary-alert-query { color: #365f91 !important; background: #eef4ff !important; }
.summary-detail { color: #244f63 !important; background: #edf9fb !important; }
.summary-scenario { color: #5b4b8a !important; background: #f2edff !important; }

.summary-tag-title-text {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  text-align: left !important;
}

.category.main-section-minimized .category-head .section-marker-control,
.category.main-section-minimized .category-head .category-tools,
.category.main-section-minimized .guideline-column-heading,
.category.main-section-minimized .category-bottom-tools,
.category.main-section-minimized .ready-guideline-starter,
.category.main-section-minimized .empty-guideline-item-prompt,
.category.main-section-minimized .sequence-panel,
.category.main-section-minimized .guideline-side-control-stack,
.category.main-section-minimized .guideline-detail-fieldset,
.category.main-section-minimized .guideline-subnote-writing-stack,
.category.main-section-minimized .compact-delete,
.category.main-section-minimized .guideline-writing-caption,
.category.main-section-minimized .guideline-writing-box:not([data-writing-box="guideline-label"]) {
  display: none !important;
}

.category.main-section-minimized .category-title-line {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) !important;
  gap: 7px !important;
}

.category.main-section-minimized .category-title {
  font-weight: 900 !important;
}

.category.main-section-minimized .guideline-list-box {
  margin-top: 5px !important;
  gap: 3px !important;
}

.category.main-section-minimized .ultra-compact-guideline,
.category.main-section-minimized .guideline-item.ultra-compact-guideline {
  display: block !important;
  min-height: 0 !important;
  padding: 3px 8px !important;
  border-left: 3px solid var(--tag-color, #cdeffd) !important;
  background: #fff !important;
}

.category.main-section-minimized .guideline-writing-stack,
.category.main-section-minimized .guideline-writing-box[data-writing-box="guideline-label"] {
  display: block !important;
  width: 100% !important;
}

.category.main-section-minimized .guideline-label-textarea,
.category.main-section-minimized .guideline-label-textarea:focus,
.category.main-section-minimized .guideline-label-textarea:hover {
  display: block !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 4px 6px !important;
  overflow: hidden !important;
  resize: none !important;
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  font-weight: 850 !important;
}

.guideline-row-target-pulse {
  outline: 3px solid rgba(242, 184, 75, .85) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 7px rgba(242, 184, 75, .22), 0 16px 38px rgba(31,41,51,.16) !important;
  transition: outline-color .35s ease, box-shadow .35s ease !important;
}


/* VERSION 2 TEST FIXES: no editor lockout, collapsed header-only sections, larger markers, multiline Others, color index, multiple details. */
.textarea-minimized {
  pointer-events: auto !important;
  user-select: text !important;
}

.category.main-section-minimized .category-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
}

.category.main-section-minimized .category-title-line,
.category.main-section-minimized .category-title-line-no-marker {
  display: grid !important;
  grid-template-columns: 32px 48px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 8px !important;
}

.category.main-section-minimized .category-head .section-marker-control,
.category.main-section-minimized .category-head .category-tools {
  display: flex !important;
}

.category.main-section-minimized .category-head .category-tools {
  justify-content: end !important;
  gap: 6px !important;
}

.category.main-section-minimized .category-head .undo-category-tool {
  display: none !important;
}

.category.main-section-minimized .category-body,
.category.main-section-minimized .guideline-column-heading,
.category.main-section-minimized .guideline-list-box,
.category.main-section-minimized .category-bottom-tools,
.category.main-section-minimized .category-color-index {
  display: none !important;
}

.category-head .section-marker-button,
.section-marker-button {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
}

.section-marker-button-icon,
.summary-outside-marker {
  font-size: 1.55rem !important;
  line-height: 1 !important;
}

.section-marker-choice,
.section-marker-clear {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  font-size: 1.2rem !important;
}

.sequence-others-textarea,
.sequence-entry-highlight-wrap textarea.sequence-stack-input {
  min-height: 44px !important;
  height: auto !important;
  overflow-y: hidden !important;
  line-height: 1.35 !important;
  resize: vertical !important;
  white-space: pre-wrap !important;
}

.category-color-index {
  margin: 8px 0 10px !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(48,95,114,.16) !important;
  border-radius: 12px !important;
  background: #f8fcfd !important;
}

.color-index-title {
  font-size: .72rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  color: #52606d !important;
  margin-bottom: 6px !important;
}

.color-index-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 6px !important;
}

.color-index-entry {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 6px !important;
}

.color-index-swatch {
  width: 18px !important;
  height: 18px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(31,41,51,.25) !important;
  background: var(--swatch) !important;
}

.color-index-entry input {
  min-width: 0 !important;
  height: 30px !important;
  padding: 4px 7px !important;
  font-size: .82rem !important;
}

.multi-detail-fieldset {
  display: grid !important;
  gap: 6px !important;
}

.multi-detail-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

.multi-detail-heading span {
  font-size: .72rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  color: #52606d !important;
}

.detail-box {
  position: relative !important;
}

.remove-detail-box {
  position: absolute !important;
  top: 3px !important;
  right: 3px !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  padding: 0 !important;
}


/* VERSION 2 TEST POLISH: At a Glance color index placement. */
.overview-color-index {
  display: grid !important;
  gap: 8px !important;
  margin-bottom: 10px !important;
}

.overview-color-index-section {
  border: 1px solid rgba(48,95,114,.14) !important;
  border-radius: 14px !important;
  background: rgba(248,252,253,.88) !important;
  padding: 7px !important;
}

.overview-color-index-section-title {
  font-size: .76rem !important;
  font-weight: 900 !important;
  color: #244f63 !important;
  margin: 0 2px 4px !important;
}

.overview-color-index .category-color-index {
  margin: 0 !important;
  padding: 6px !important;
}

.overview-color-index .color-index-title {
  display: none !important;
}


/* VERSION 2 COMPACT UPDATE: smaller detail box control, selected At-a-Glance row focus, compact Color Key popover. */
.tiny-add-detail-box {
  appearance: none !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  background: #f8fcfd !important;
  color: #305f72 !important;
  border-radius: 999px !important;
  font-size: .68rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  padding: 3px 7px !important;
  min-height: 20px !important;
  height: 22px !important;
  min-width: 0 !important;
  box-shadow: none !important;
}

.tiny-add-detail-box:hover {
  background: #eef7fa !important;
  border-color: rgba(48,95,114,.38) !important;
}

.multi-detail-heading {
  gap: 5px !important;
  min-height: 22px !important;
}

.guideline-item.guideline-row-collapsed {
  grid-template-columns: 44px minmax(0, 1fr) 24px !important;
  align-items: center !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
  opacity: .78 !important;
}

.guideline-item.guideline-row-collapsed .sequence-panel,
.guideline-item.guideline-row-collapsed .guideline-side-control-stack,
.guideline-item.guideline-row-collapsed .guideline-subnote-writing-stack,
.guideline-item.guideline-row-collapsed .tag-strip-palette,
.guideline-item.guideline-row-collapsed .multi-detail-fieldset,
.guideline-item.guideline-row-collapsed .scenario-exception-fieldset {
  display: none !important;
}

.guideline-item.guideline-row-collapsed .guideline-writing-stack {
  display: block !important;
  min-width: 0 !important;
}

.guideline-item.guideline-row-collapsed .guideline-writing-box:not([data-writing-box="guideline-label"]) {
  display: none !important;
}

.guideline-item.guideline-row-collapsed [data-action="guideline-label"] {
  min-height: 26px !important;
  height: 26px !important;
  max-height: 26px !important;
  overflow: hidden !important;
  resize: none !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  pointer-events: none !important;
  background: transparent !important;
  border-color: transparent !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

.guideline-item.guideline-row-collapsed .compact-delete {
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  padding: 0 !important;
}

.compact-color-key {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.color-key-toggle {
  font-size: .68rem !important;
  padding: 3px 7px !important;
  min-height: 22px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}

.color-key-chip-list {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  flex-wrap: wrap !important;
}

.color-key-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  max-width: 90px !important;
  font-size: .68rem !important;
  color: #52606d !important;
  overflow: hidden !important;
}

.color-key-chip .color-index-swatch,
.compact-color-index-entry .color-index-swatch {
  width: 13px !important;
  height: 13px !important;
  min-width: 13px !important;
}

.color-key-chip-label {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.color-key-editor {
  display: none !important;
  position: absolute !important;
  z-index: 80 !important;
  top: calc(100% + 5px) !important;
  left: 0 !important;
  min-width: 190px !important;
  max-width: 240px !important;
  padding: 8px !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  border-radius: 12px !important;
  background: #fffdfa !important;
  box-shadow: 0 14px 30px rgba(31,41,51,.18) !important;
}

.compact-color-key.color-key-open .color-key-editor {
  display: grid !important;
  gap: 5px !important;
}

.color-key-editor-title {
  font-size: .7rem !important;
  font-weight: 900 !important;
  color: #305f72 !important;
  margin-bottom: 2px !important;
}

.compact-color-index-entry {
  display: grid !important;
  grid-template-columns: 16px minmax(0, 1fr) !important;
  gap: 5px !important;
  align-items: center !important;
}

.compact-color-index-entry input {
  height: 25px !important;
  min-height: 25px !important;
  padding: 2px 6px !important;
  font-size: .76rem !important;
}

.overview-color-index.compact-color-key-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 0 0 8px !important;
}

.overview-compact-color-key {
  padding: 2px 4px !important;
  border-radius: 999px !important;
  background: rgba(248,252,253,.8) !important;
}

.category-body > .category-color-index.compact-color-key {
  margin: 2px 0 7px !important;
}


/* VERSION 2 COLOR KEY / AT-A-GLANCE REFINEMENT: grouped sections and stable color-key typing. */
.at-a-glance-category-break {
  position: relative !important;
  margin: 12px 0 14px !important;
  padding: 10px 10px 9px !important;
  border: 1px solid rgba(48,95,114,.16) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(248,252,253,.96), rgba(255,253,250,.9)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9) !important;
  break-inside: avoid !important;
  page-break-inside: avoid !important;
}

.at-a-glance-category-break + .at-a-glance-category-break {
  border-top-width: 3px !important;
}

.at-a-glance-break-heading {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding-bottom: 7px !important;
  margin-bottom: 7px !important;
  border-bottom: 1px dashed rgba(48,95,114,.18) !important;
}

.at-a-glance-break-title {
  min-width: 110px !important;
  color: #244f63 !important;
  font-size: .78rem !important;
  font-weight: 950 !important;
  line-height: 1.2 !important;
  letter-spacing: .01em !important;
}

.at-a-glance-break-heading .compact-color-key {
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
}

.at-a-glance-break-heading .color-key-editor {
  left: auto !important;
  right: 0 !important;
}

.at-a-glance-category-rows {
  margin: 0 !important;
}

.detail-box .guideline-writing-caption {
  display: none !important;
}

@media print {
  .at-a-glance-category-break {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
  }
}


/* VERSION 2 REFINEMENT: Details plus button, static Other sequence field, and readable At-a-Glance sequence text. */
.multi-detail-heading {
  justify-content: flex-start !important;
  gap: 4px !important;
}

.tiny-add-detail-box {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  padding: 0 !important;
  margin-left: 1px !important;
  font-size: .86rem !important;
  line-height: 1 !important;
  border-radius: 50% !important;
}

.sequence-others-textarea,
.sequence-others-textarea:hover,
.sequence-others-textarea:focus,
.sequence-panel .sequence-others-textarea,
.sequence-panel .sequence-others-textarea:hover,
.sequence-panel .sequence-others-textarea:focus,
.ultra-compact-guideline .sequence-others-textarea,
.ultra-compact-guideline .sequence-others-textarea:hover,
.ultra-compact-guideline .sequence-others-textarea:focus {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;
  transform: none !important;
  transition: none !important;
  resize: none !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  box-shadow: none !important;
}

.tag-title-jump {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  text-align: left !important;
  min-height: 34px !important;
  white-space: normal !important;
}

.expanded-summary-sequence-code {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  flex-wrap: wrap !important;
  min-width: min(420px, 100%) !important;
  max-width: 100% !important;
  margin-left: 2px !important;
}

.summary-sequence-text {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  max-width: 260px !important;
  min-height: 22px !important;
  padding: 3px 7px !important;
  border-radius: 999px !important;
  background: var(--summary-sequence-highlight, rgba(248,252,253,.95)) !important;
  border: 1px solid rgba(48,95,114,.14) !important;
  color: #244f63 !important;
  font-size: .73rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.summary-sequence-text strong {
  font-weight: 950 !important;
  color: #1f4e5f !important;
  flex: 0 0 auto !important;
}

.summary-symbol-group {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
}

.guideline-item.guideline-row-hidden-by-focus,
.guideline-item[hidden].guideline-row-hidden-by-focus {
  display: none !important;
}


/* VERSION 2 MARKER REMOVAL: hide marker icon UI and reclaim layout space. */
.summary-outside-marker,
.section-marker-control,
.section-marker-popover-control,
.section-marker-button,
.section-marker-picker,
.sequence-marker-control,
.sequence-marker-select,
.sequence-marker-label,
.guideline-side-marker-control,
.details-marker-control,
.details-guideline-icon-select:not(.section-marker-select),
.result-marker {
  display: none !important;
}

.tag-title-row.summary-no-marker,
.tag-title-row.summary-marker-outside {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 26px 26px !important;
  gap: 5px !important;
  align-items: center !important;
  padding-left: 6px !important;
}

.summary-no-marker .tag-title-jump,
.summary-marker-outside .tag-title-jump {
  grid-column: 1 !important;
  width: 100% !important;
}

.category-title-line-no-marker,
.category-head .category-title-line-no-marker {
  grid-template-columns: 28px minmax(180px, 1fr) !important;
  gap: 6px !important;
}

.guideline-search-result {
  grid-template-columns: minmax(0, 1fr) !important;
}


/* VERSION 2 COLOR KEY MENU-ONLY LABELS: swatches stay on page, names stay in menu. */
.color-key-chip-label {
  display: none !important;
}

.color-key-chip {
  max-width: 18px !important;
  width: 18px !important;
  min-width: 18px !important;
  justify-content: center !important;
}

.color-key-chip-list {
  gap: 4px !important;
}


/* VERSION 2 COMPACT UTILITY LINKS: small link-like controls for backup/export, reset, links, and print. */
.utility-link-action,
button.utility-link-action,
#exportBtn.utility-link-action,
#backupReminderExport.utility-link-action,
#helpExportBackup.utility-link-action,
.chapter-safety-actions .chapter-backup-button,
.chapter-safety-actions .chapter-reset-button {
  appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  padding: 2px 5px !important;
  min-height: 18px !important;
  height: auto !important;
  border-radius: 4px !important;
  color: #305f72 !important;
  font-size: .72rem !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  letter-spacing: .01em !important;
}

.utility-link-action:hover,
button.utility-link-action:hover,
#exportBtn.utility-link-action:hover,
#backupReminderExport.utility-link-action:hover,
#helpExportBackup.utility-link-action:hover,
.chapter-safety-actions .chapter-backup-button:hover,
.chapter-safety-actions .chapter-reset-button:hover {
  background: rgba(48,95,114,.065) !important;
  box-shadow: none !important;
  transform: none !important;
}

.utility-link-action:focus-visible,
button.utility-link-action:focus-visible {
  outline: 2px solid rgba(48,95,114,.28) !important;
  outline-offset: 2px !important;
}

.chapter-safety-actions .chapter-reset-button,
button.utility-link-action.danger-soft {
  color: #9b2c2c !important;
}

.chapter-actions.chapter-safety-actions {
  gap: 5px !important;
  align-items: center !important;
}

.backup-reminder .utility-link-action,
.toolbar .utility-link-action,
.modal-actions .utility-link-action {
  white-space: nowrap !important;
}


/* VERSION 2 AT-A-GLANCE VALUE-ONLY SEQUENCE + DETAIL ICON UPDATE. */
.summary-sequence-value-only {
  gap: 0 !important;
  font-weight: 800 !important;
}

.summary-sequence-value-only strong,
.summary-sequence-text strong {
  display: none !important;
}

.summary-detail {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: .76rem !important;
  letter-spacing: -0.02em !important;
}


/* VERSION 2 AT-A-GLANCE INLINE DETAILS EDITOR: opens details in place instead of jumping to Guidelines. */
.ataglance-inline-details-editor {
  grid-column: 1 / -1 !important;
  margin: 4px 0 9px 10px !important;
  padding: 10px !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  border-left: 4px solid var(--tag-color, #305f72) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, #ffffff, #f8fcfd) !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .08) !important;
}

.ataglance-inline-details-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 8px !important;
}

.ataglance-inline-details-head strong {
  display: block !important;
  color: #244f63 !important;
  font-size: .86rem !important;
}

.ataglance-inline-details-head small {
  display: block !important;
  margin-top: 2px !important;
  color: #52606d !important;
  font-size: .72rem !important;
  font-weight: 750 !important;
}

.ataglance-detail-edit-list {
  display: grid !important;
  gap: 7px !important;
}

.ataglance-detail-edit-box {
  position: relative !important;
  display: grid !important;
  gap: 3px !important;
  margin: 0 !important;
}

.ataglance-detail-edit-box > span {
  color: #52606d !important;
  font-size: .68rem !important;
  font-weight: 850 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}

.ataglance-detail-textarea {
  width: 100% !important;
  min-height: 58px !important;
  padding: 8px 30px 8px 9px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  background: #fffdfa !important;
  color: #1f2933 !important;
  font-size: .88rem !important;
  line-height: 1.35 !important;
  resize: vertical !important;
}

.ataglance-delete-detail {
  position: absolute !important;
  top: 22px !important;
  right: 6px !important;
}

.ataglance-add-detail {
  margin-top: 8px !important;
}

.ataglance-close-details {
  flex: 0 0 auto !important;
}


/* VERSION 2 AT-A-GLANCE TOGGLE + SQUARE DETAIL/SEQUENCE REFINEMENT. */
.tag-title-row.summary-no-marker .tag-title-jump,
.tag-title-row.summary-marker-outside .tag-title-jump {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-areas:
    "title symbols"
    "sequence sequence" !important;
  align-items: start !important;
  gap: 4px 7px !important;
  min-height: 36px !important;
}

.tag-title-row.summary-no-marker .summary-tag-title-text,
.tag-title-row.summary-marker-outside .summary-tag-title-text {
  grid-area: title !important;
  width: 100% !important;
  min-width: 0 !important;
  margin-left: 0 !important;
}

.tag-title-row.summary-no-marker .summary-symbol-group,
.tag-title-row.summary-marker-outside .summary-symbol-group {
  grid-area: symbols !important;
  justify-self: end !important;
  align-self: start !important;
}

.tag-title-row.summary-no-marker .expanded-summary-sequence-code,
.tag-title-row.summary-no-marker .summary-sequence-code,
.tag-title-row.summary-marker-outside .expanded-summary-sequence-code,
.tag-title-row.summary-marker-outside .summary-sequence-code {
  grid-area: sequence !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 1px 0 0 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.tag-title-row.summary-no-marker .summary-sequence-text,
.tag-title-row.summary-marker-outside .summary-sequence-text {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 3px !important;
  background: var(--summary-sequence-highlight, rgba(48,95,114,.07)) !important;
  padding: 3px 6px !important;
  min-height: 20px !important;
  max-width: min(360px, 100%) !important;
  color: #1f2933 !important;
  font-size: .72rem !important;
  font-weight: 850 !important;
}

.summary-detail {
  width: auto !important;
  min-width: 0 !important;
  height: 18px !important;
  padding: 2px 5px !important;
  border-radius: 3px !important;
  border: 0 !important;
  background: #eaf7fb !important;
  color: #244f63 !important;
  font-size: .64rem !important;
  font-weight: 950 !important;
  letter-spacing: .03em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.ataglance-delete-detail {
  appearance: none !important;
  position: absolute !important;
  top: 22px !important;
  right: 6px !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #c62828 !important;
  font-size: 1rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

.ataglance-delete-detail:hover,
.ataglance-delete-detail:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  color: #8a1f1f !important;
}


/* VERSION 2 AT-A-GLANCE UNIFIED EXTRAS + OPEN FOCUS REFINEMENT. */
.tag-title-row.summary-no-marker .tag-title-jump,
.tag-title-row.summary-marker-outside .tag-title-jump {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "title"
    "extras" !important;
  justify-items: stretch !important;
  align-items: start !important;
  gap: 3px !important;
  min-height: 34px !important;
  padding-left: 7px !important;
}

.summary-extra-details-container {
  grid-area: extras !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 3px !important;
  width: 100% !important;
  margin: 2px 0 0 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
  text-align: left !important;
}

.summary-extra-details-container .summary-symbol-group,
.summary-extra-details-container .expanded-summary-sequence-code,
.summary-extra-details-container .summary-sequence-code {
  display: contents !important;
}

.tag-title-row.summary-no-marker .summary-symbol-group,
.tag-title-row.summary-marker-outside .summary-symbol-group,
.tag-title-row.summary-no-marker .expanded-summary-sequence-code,
.tag-title-row.summary-no-marker .summary-sequence-code,
.tag-title-row.summary-marker-outside .expanded-summary-sequence-code,
.tag-title-row.summary-marker-outside .summary-sequence-code {
  grid-area: auto !important;
  justify-self: start !important;
  align-self: start !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.tag-title-row.summary-no-marker .summary-sequence-text,
.tag-title-row.summary-marker-outside .summary-sequence-text,
.summary-extra-details-container .summary-symbol,
.summary-extra-details-container .summary-alert,
.summary-extra-details-container .summary-detail,
.summary-extra-details-container .summary-scenario {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 17px !important;
  height: auto !important;
  padding: 2px 4px !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 2px !important;
  background: var(--summary-sequence-highlight, rgba(48,95,114,.065)) !important;
  color: #1f2933 !important;
  font-size: .61rem !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: break-word !important;
  text-align: left !important;
}

.summary-extra-details-container .summary-alert-exception,
.summary-extra-details-container .summary-alert-exception-notice {
  background: #fff1e6 !important;
  color: #8a3434 !important;
}

.summary-extra-details-container .summary-alert-query {
  background: #eef4ff !important;
  color: #365f91 !important;
}

.summary-extra-details-container .summary-alert-note {
  background: #fff8d8 !important;
  color: #6b4e00 !important;
}

.summary-extra-details-container .summary-detail {
  background: #eaf7fb !important;
  color: #244f63 !important;
  text-transform: uppercase !important;
  letter-spacing: .025em !important;
}

.summary-extra-details-container .summary-scenario {
  background: #f2edff !important;
  color: #5b4b8a !important;
}

.tag-title-row.ataglance-row-editor-open {
  position: relative !important;
  background: linear-gradient(90deg, rgba(48,95,114,.12), rgba(255,255,255,.92)) !important;
  border-left: 5px solid var(--tag-color, #305f72) !important;
  border-radius: 8px 8px 0 0 !important;
  padding-left: 2px !important;
}

.tag-title-row.ataglance-row-editor-open .tag-title-jump {
  background: rgba(255,255,255,.78) !important;
  box-shadow: inset 0 0 0 1px rgba(48,95,114,.12) !important;
}

.tag-title-row.ataglance-row-editor-open + .ataglance-inline-details-editor {
  margin-top: 0 !important;
  margin-left: 0 !important;
  border-width: 2px !important;
  border-color: rgba(48,95,114,.35) !important;
  border-left: 5px solid var(--tag-color, #305f72) !important;
  border-radius: 0 0 12px 12px !important;
  background: linear-gradient(180deg, #f6fbfd, #ffffff) !important;
  box-shadow: 0 12px 26px rgba(15, 23, 42, .13) !important;
}

.tag-title-row.ataglance-row-editor-open + .ataglance-inline-details-editor .ataglance-inline-details-head {
  padding: 6px 8px !important;
  border-radius: 8px !important;
  background: rgba(48,95,114,.08) !important;
}

.tag-title-row.ataglance-row-editor-open + .ataglance-inline-details-editor .ataglance-inline-details-head strong::before {
  content: "Editing: " !important;
}


/* VERSION 2 AT-A-GLANCE FULL GUIDELINE EDITOR + INVISIBLE SEQUENCE VALUES. */
.tag-title-row.summary-no-marker,
.tag-title-row.summary-marker-outside {
  border-radius: 0 !important;
  border: 1px solid rgba(48,95,114,.16) !important;
  background: #ffffff !important;
  padding: 5px 5px 5px 7px !important;
}

.tag-title-row.summary-no-marker .tag-title-jump,
.tag-title-row.summary-marker-outside .tag-title-jump {
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.summary-extra-details-container .summary-sequence-text,
.tag-title-row.summary-no-marker .summary-sequence-text,
.tag-title-row.summary-marker-outside .summary-sequence-text {
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 5px 0 0 !important;
  min-height: 0 !important;
  font-size: .58rem !important;
  line-height: 1.1 !important;
}

.tag-title-row.ataglance-row-editor-open {
  border: 2px solid #1d5f75 !important;
  border-left: 9px solid var(--tag-color, #305f72) !important;
  background: #eef8fb !important;
  box-shadow: 0 0 0 3px rgba(48,95,114,.12), 0 10px 24px rgba(15,23,42,.12) !important;
}

.tag-title-row.ataglance-row-editor-open::after {
  content: "OPEN BELOW" !important;
  position: absolute !important;
  right: 36px !important;
  bottom: -13px !important;
  z-index: 3 !important;
  padding: 2px 7px !important;
  background: #1d5f75 !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  font-size: .58rem !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
}

.ataglance-full-guideline-editor {
  border: 3px solid #1d5f75 !important;
  border-left: 9px solid var(--tag-color, #305f72) !important;
  background: #ffffff !important;
  box-shadow: 0 16px 34px rgba(15,23,42,.18) !important;
}

.ataglance-strong-focus-head {
  background: #1d5f75 !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  padding: 8px 10px !important;
}

.ataglance-strong-focus-head strong,
.ataglance-strong-focus-head small {
  color: #ffffff !important;
}

.ataglance-full-editor-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin-top: 10px !important;
}

.ataglance-full-width {
  grid-column: 1 / -1 !important;
}

.ataglance-full-field,
.ataglance-full-section {
  display: grid !important;
  gap: 4px !important;
  padding: 8px !important;
  border: 1px solid rgba(48,95,114,.16) !important;
  border-radius: 0 !important;
  background: #fbfdfe !important;
}

.ataglance-full-field > span,
.ataglance-full-section-title {
  color: #244f63 !important;
  font-size: .66rem !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .055em !important;
}

.ataglance-full-field textarea,
.ataglance-full-field input,
.ataglance-sequence-field textarea,
.ataglance-sequence-field input {
  width: 100% !important;
  border-radius: 0 !important;
  border: 1px solid rgba(48,95,114,.22) !important;
  background: #fffdfa !important;
  padding: 7px !important;
  font-size: .82rem !important;
  line-height: 1.3 !important;
}

.ataglance-sequence-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

.ataglance-sequence-field {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

@media (max-width: 900px) {
  .ataglance-full-editor-grid,
  .ataglance-sequence-grid {
    grid-template-columns: 1fr !important;
  }
}

/* VERSION 2 AT-A-GLANCE RECTANGLE FINAL OVERRIDE. */
.ataglance-full-guideline-editor,
.tag-title-row.ataglance-row-editor-open + .ataglance-inline-details-editor.ataglance-full-guideline-editor {
  border-radius: 0 !important;
}


/* VERSION 2 AT-A-GLANCE GO CONTROL + LOWER GUIDELINE HIGHLIGHT. */
.summary-go {
  min-width: 34px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(29,95,117,.28) !important;
  background: #eef8fb !important;
  color: #1d5f75 !important;
  font-size: .66rem !important;
  font-weight: 950 !important;
  letter-spacing: .02em !important;
}

.summary-go:hover,
.summary-go:focus-visible {
  background: #1d5f75 !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 2px rgba(29,95,117,.18) !important;
}

.tag-title-row.ataglance-row-editor-open::after {
  content: none !important;
  display: none !important;
}

.guideline-item.guideline-row-go-highlight {
  outline: 4px solid rgba(29,95,117,.36) !important;
  outline-offset: 4px !important;
  box-shadow: 0 0 0 7px rgba(48,95,114,.12), 0 16px 34px rgba(15,23,42,.16) !important;
  background: linear-gradient(90deg, rgba(238,248,251,.96), #ffffff 60%) !important;
}

.guideline-item.guideline-row-go-highlight::before {
  content: "Start reading here" !important;
  position: absolute !important;
  top: -18px !important;
  left: 12px !important;
  z-index: 4 !important;
  padding: 2px 8px !important;
  background: #1d5f75 !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  font-size: .62rem !important;
  font-weight: 950 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

/* VERSION 2 AT-A-GLANCE GO HIGHLIGHT POSITION SAFETY. */
.guideline-item.guideline-row-go-highlight {
  position: relative !important;
}

/* VERSION 2 FINAL CODE SEQUENCE NO-HOVER-EXPANSION LOCK. */
.sequence-panel,
.sequence-panel:hover,
.sequence-panel:focus-within,
.sequence-panel .sequence-stack,
.sequence-panel .sequence-stack:hover,
.sequence-panel .sequence-stack:focus-within,
.sequence-panel .sequence-entry-highlight-wrap,
.sequence-panel .sequence-entry-highlight-wrap:hover,
.sequence-panel .sequence-entry-highlight-wrap:focus-within,
.ultra-compact-guideline .sequence-stack,
.ultra-compact-guideline .sequence-stack:hover,
.ultra-compact-guideline .sequence-stack:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap,
.ultra-compact-guideline .sequence-entry-highlight-wrap:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap:focus-within {
  transform: none !important;
  transition: none !important;
  z-index: auto !important;
  overflow: hidden !important;
  max-width: 100% !important;
}

.sequence-panel .sequence-stack-input,
.sequence-panel .sequence-stack-input:hover,
.sequence-panel .sequence-stack-input:focus,
.sequence-panel .sequence-stack input,
.sequence-panel .sequence-stack input:hover,
.sequence-panel .sequence-stack input:focus,
.sequence-panel .sequence-others-textarea,
.sequence-panel .sequence-others-textarea:hover,
.sequence-panel .sequence-others-textarea:focus,
.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack-input:hover,
.ultra-compact-guideline .sequence-stack-input:focus,
.ultra-compact-guideline .sequence-stack input,
.ultra-compact-guideline .sequence-stack input:hover,
.ultra-compact-guideline .sequence-stack input:focus,
.ultra-compact-guideline .sequence-others-textarea,
.ultra-compact-guideline .sequence-others-textarea:hover,
.ultra-compact-guideline .sequence-others-textarea:focus {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;
  transform: none !important;
  transition: none !important;
  z-index: auto !important;
  resize: none !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

.ataglance-sequence-field,
.ataglance-sequence-field:hover,
.ataglance-sequence-field:focus-within,
.ataglance-sequence-field input,
.ataglance-sequence-field input:hover,
.ataglance-sequence-field input:focus,
.ataglance-sequence-field textarea,
.ataglance-sequence-field textarea:hover,
.ataglance-sequence-field textarea:focus {
  transform: none !important;
  transition: none !important;
  z-index: auto !important;
  max-width: 100% !important;
  resize: none !important;
}


/* VERSION 2 AT-A-GLANCE SYMBOL SIZE + HIGHLIGHT TEXT COLOR WITHOUT CONTAINERS. */
.summary-extra-details-container .summary-sequence-text,
.tag-title-row.summary-no-marker .summary-sequence-text,
.tag-title-row.summary-marker-outside .summary-sequence-text {
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  color: #1f2933 !important;
  text-decoration: none !important;
  text-decoration-thickness: 0 !important;
  text-underline-offset: 0 !important;
}

.summary-extra-details-container .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-no-marker .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-marker-outside .summary-sequence-text.has-summary-sequence-highlight {
  background: transparent !important;
  border: 0 !important;
  box-shadow: inset 0 -3px 0 var(--summary-sequence-highlight, transparent) !important;
  color: color-mix(in srgb, var(--summary-sequence-highlight, #305f72) 72%, #14232d) !important;
  padding-bottom: 1px !important;
}

.summary-extra-details-container .summary-symbol,
.summary-extra-details-container .summary-alert,
.summary-extra-details-container .summary-detail,
.summary-extra-details-container .summary-scenario {
  min-width: 0 !important;
  min-height: 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 0 3px !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-size: .78rem !important;
  line-height: 1.05 !important;
  font-weight: 950 !important;
}

.summary-extra-details-container .summary-alert-exception,
.summary-extra-details-container .summary-alert-exception-notice { color: #a14a22 !important; }
.summary-extra-details-container .summary-alert-query { color: #365f91 !important; }
.summary-extra-details-container .summary-alert-note { color: #8a6500 !important; }
.summary-extra-details-container .summary-detail { color: #244f63 !important; }
.summary-extra-details-container .summary-scenario { color: #5b4b8a !important; }

.summary-tag-title-text {
  font-size: inherit !important;
}

/* VERSION 2 AT-A-GLANCE HIGHLIGHT ACCENT COMPATIBILITY OVERRIDE. */
.summary-extra-details-container .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-no-marker .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-marker-outside .summary-sequence-text.has-summary-sequence-highlight {
  color: #1f2933 !important;
  text-decoration-line: underline !important;
  text-decoration-color: var(--summary-sequence-highlight, transparent) !important;
  text-decoration-thickness: 3px !important;
  text-underline-offset: 2px !important;
  box-shadow: none !important;
}


/* VERSION 2 AT-A-GLANCE FULL HIGHLIGHT + MULTI-ROW TEXT + LARGER SYMBOLS. */
.summary-extra-details-container .summary-sequence-text,
.tag-title-row.summary-no-marker .summary-sequence-text,
.tag-title-row.summary-marker-outside .summary-sequence-text {
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 0 !important;
  padding: 1px 4px !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #1f2933 !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  text-decoration: none !important;
  line-height: 1.18 !important;
}

.summary-extra-details-container .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-no-marker .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-marker-outside .summary-sequence-text.has-summary-sequence-highlight {
  background: var(--summary-sequence-highlight, transparent) !important;
  color: #10232d !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

.summary-extra-details-container .summary-symbol,
.summary-extra-details-container .summary-alert,
.summary-extra-details-container .summary-detail,
.summary-extra-details-container .summary-scenario {
  font-size: 1.22rem !important;
  line-height: 1 !important;
  min-width: 1.05em !important;
  min-height: 1.05em !important;
  padding: 0 4px !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

textarea.auto-grow-textarea,
.guideline-label-textarea,
.inline-guideline-details,
.inline-guideline-scenario,
.guideline-cross-reference,
.guideline-tag-note,
.sequence-sub-entry,
.sequence-others-textarea,
.ataglance-full-field textarea,
.ataglance-detail-textarea {
  white-space: pre-wrap !important;
  overflow-wrap: break-word !important;
  overflow-y: hidden !important;
  resize: none !important;
  max-height: none !important;
}

textarea.auto-grow-textarea.textarea-default-collapsed,
.guideline-label-textarea.textarea-default-collapsed,
.inline-guideline-details.textarea-default-collapsed,
.inline-guideline-scenario.textarea-default-collapsed,
.guideline-cross-reference.textarea-default-collapsed,
.guideline-tag-note.textarea-default-collapsed,
.sequence-sub-entry.textarea-default-collapsed,
.sequence-others-textarea.textarea-default-collapsed {
  max-height: none !important;
}

.sequence-panel .sequence-others-textarea,
.sequence-panel .sequence-others-textarea:hover,
.sequence-panel .sequence-others-textarea:focus,
.ultra-compact-guideline .sequence-others-textarea,
.ultra-compact-guideline .sequence-others-textarea:hover,
.ultra-compact-guideline .sequence-others-textarea:focus {
  height: auto !important;
  min-height: 26px !important;
  max-height: none !important;
  white-space: pre-wrap !important;
  overflow-y: hidden !important;
  text-overflow: clip !important;
}

/* VERSION 2 ALL TEXT BOXES MULTI-ROW FINAL OVERRIDE. */
.ultra-compact-guideline textarea.auto-grow-textarea,
.ultra-compact-guideline textarea.auto-grow-textarea:hover,
.ultra-compact-guideline textarea.auto-grow-textarea:focus,
.ultra-compact-guideline textarea.auto-grow-textarea.textarea-default-collapsed,
.ultra-compact-guideline textarea.auto-grow-textarea.textarea-default-expanded,
.category textarea.auto-grow-textarea,
.category textarea.auto-grow-textarea:hover,
.category textarea.auto-grow-textarea:focus,
.category textarea.auto-grow-textarea.textarea-default-collapsed,
.category textarea.auto-grow-textarea.textarea-default-expanded,
.ataglance-full-guideline-editor textarea.auto-grow-textarea,
.ataglance-full-guideline-editor textarea.auto-grow-textarea:hover,
.ataglance-full-guideline-editor textarea.auto-grow-textarea:focus {
  max-height: none !important;
  white-space: pre-wrap !important;
  overflow-wrap: break-word !important;
  overflow-y: hidden !important;
  resize: none !important;
}

.ultra-compact-guideline .sequence-others-textarea,
.ultra-compact-guideline .sequence-others-textarea:hover,
.ultra-compact-guideline .sequence-others-textarea:focus,
.ultra-compact-guideline .sequence-others-textarea.textarea-default-collapsed,
.sequence-panel .sequence-others-textarea,
.sequence-panel .sequence-others-textarea:hover,
.sequence-panel .sequence-others-textarea:focus,
.sequence-panel .sequence-others-textarea.textarea-default-collapsed {
  height: auto !important;
  min-height: 26px !important;
  max-height: none !important;
  white-space: pre-wrap !important;
  overflow-y: hidden !important;
  text-overflow: clip !important;
}

/* VERSION 2 LOWER GUIDELINE GO HIGHLIGHT NO LABEL + CODE SEQUENCE CARD EXPANSION. */
.guideline-item.guideline-row-go-highlight::before {
  content: none !important;
  display: none !important;
}

.guideline-item,
.guideline-item.compact-guideline,
.guideline-item.ultra-compact-guideline,
.compact-guideline.ultra-compact-guideline,
.category-stack#guidelineTags .guideline-item,
.category-stack#guidelineTags .guideline-item.ultra-compact-guideline {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.guideline-item > .sequence-panel,
.compact-guideline > .sequence-panel,
.ultra-compact-guideline > .sequence-panel,
.compact-guideline.ultra-compact-guideline > .sequence-panel,
.guideline-item.ultra-compact-guideline > .sequence-panel,
.sequence-panel,
.sequence-panel:hover,
.sequence-panel:focus-within {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  align-self: stretch !important;
}

.sequence-panel .sequence-stack,
.sequence-panel .sequence-stack:hover,
.sequence-panel .sequence-stack:focus-within,
.ultra-compact-guideline .sequence-stack,
.ultra-compact-guideline .sequence-stack:hover,
.ultra-compact-guideline .sequence-stack:focus-within {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  align-items: stretch !important;
  align-content: start !important;
  grid-auto-rows: auto !important;
  row-gap: 4px !important;
}

.sequence-panel .sequence-entry-highlight-wrap,
.sequence-panel .sequence-entry-highlight-wrap:hover,
.sequence-panel .sequence-entry-highlight-wrap:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap,
.ultra-compact-guideline .sequence-entry-highlight-wrap:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap:focus-within {
  height: auto !important;
  min-height: 30px !important;
  max-height: none !important;
  overflow: visible !important;
  align-self: stretch !important;
  display: grid !important;
  grid-template-columns: minmax(54px, auto) minmax(0, 1fr) !important;
  align-items: start !important;
  column-gap: 4px !important;
}

.sequence-panel .sequence-stack-label,
.ultra-compact-guideline .sequence-stack-label {
  align-self: start !important;
  padding-top: 5px !important;
  line-height: 1.15 !important;
}

.sequence-panel .sequence-stack-input,
.sequence-panel .sequence-stack-input:hover,
.sequence-panel .sequence-stack-input:focus,
.sequence-panel .sequence-stack input,
.sequence-panel .sequence-stack input:hover,
.sequence-panel .sequence-stack input:focus,
.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack-input:hover,
.ultra-compact-guideline .sequence-stack-input:focus,
.ultra-compact-guideline .sequence-stack input,
.ultra-compact-guideline .sequence-stack input:hover,
.ultra-compact-guideline .sequence-stack input:focus {
  min-height: 28px !important;
  max-height: none !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  align-self: stretch !important;
}

.sequence-panel textarea.sequence-stack-input.sequence-others-textarea,
.sequence-panel textarea.sequence-stack-input.sequence-others-textarea:hover,
.sequence-panel textarea.sequence-stack-input.sequence-others-textarea:focus,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea:hover,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea:focus {
  height: auto !important;
  min-height: 42px !important;
  max-height: none !important;
  line-height: 1.25 !important;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  white-space: pre-wrap !important;
  overflow-wrap: break-word !important;
  overflow-y: hidden !important;
  text-overflow: clip !important;
  resize: none !important;
}

.guideline-item.guideline-row-collapsed .sequence-panel,
.guideline-item.guideline-row-collapsed .sequence-stack,
.guideline-item.guideline-row-collapsed .sequence-entry-highlight-wrap {
  overflow: hidden !important;
}


/* VERSION 2 AT-A-GLANCE GREEN LEFT GO SYMBOL BUTTON. */
.tag-title-row.summary-no-marker,
.tag-title-row.summary-marker-outside {
  align-items: stretch !important;
}

.tag-title-row .summary-go {
  order: -1 !important;
  flex: 0 0 32px !important;
  width: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  min-height: 28px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0 !important;
  border: 1px solid rgba(21,128,61,.48) !important;
  background: #16a34a !important;
  color: #ffffff !important;
  font-size: 1.02rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.14), 0 1px 2px rgba(21,128,61,.22) !important;
}

.tag-title-row .summary-go:hover,
.tag-title-row .summary-go:focus-visible {
  background: #15803d !important;
  border-color: #166534 !important;
  color: #ffffff !important;
  transform: none !important;
  box-shadow: 0 0 0 2px rgba(34,197,94,.24), inset 0 -1px 0 rgba(0,0,0,.18) !important;
}

.tag-title-row .summary-go:active {
  background: #166534 !important;
}


/* VERSION 2 AT-A-GLANCE ROUNDED LARGER HIGHLIGHTS + REFRESHED DETAIL/SCENARIO SYMBOLS. */
.summary-extra-details-container .summary-sequence-text,
.tag-title-row.summary-no-marker .summary-sequence-text,
.tag-title-row.summary-marker-outside .summary-sequence-text {
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 1px 3px 2px 0 !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  line-height: 1.25 !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
  box-decoration-break: clone !important;
  -webkit-box-decoration-break: clone !important;
}

.summary-extra-details-container .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-no-marker .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-marker-outside .summary-sequence-text.has-summary-sequence-highlight {
  background: var(--summary-sequence-highlight, #fef08a) !important;
  color: #10232d !important;
  border-radius: 999px !important;
  padding: 4px 10px !important;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.12), 0 1px 2px rgba(15,23,42,.08) !important;
  text-decoration: none !important;
}

.summary-extra-details-container .summary-symbol.summary-detail,
.summary-extra-details-container .summary-symbol.summary-scenario {
  font-size: 1.34rem !important;
  line-height: 1 !important;
  min-width: 1.12em !important;
  min-height: 1.12em !important;
  padding: 0 5px !important;
  vertical-align: middle !important;
}

.summary-extra-details-container .summary-symbol.summary-detail {
  color: #0f766e !important;
}

.summary-extra-details-container .summary-symbol.summary-scenario {
  color: #7c3aed !important;
}

/* VERSION 2 CODE SEQUENCE PICKER GAP RESTORE: keep fields directly beside highlight picker. */
.sequence-panel .sequence-entry-highlight-wrap,
.sequence-panel .sequence-entry-highlight-wrap:hover,
.sequence-panel .sequence-entry-highlight-wrap:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap,
.ultra-compact-guideline .sequence-entry-highlight-wrap:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap:focus-within {
  display: grid !important;
  grid-template-columns: 6px minmax(0, 1fr) !important;
  column-gap: 3px !important;
  row-gap: 0 !important;
  align-items: stretch !important;
  justify-items: stretch !important;
  justify-content: start !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 28px !important;
  max-height: none !important;
  overflow: visible !important;
}

.sequence-panel .sequence-entry-color-line,
.ultra-compact-guideline .sequence-entry-color-line {
  grid-column: 1 !important;
  width: 6px !important;
  min-width: 6px !important;
  max-width: 6px !important;
  margin: 0 !important;
  justify-self: start !important;
  align-self: stretch !important;
}

.sequence-panel .sequence-stack-input,
.sequence-panel .sequence-stack input,
.sequence-panel textarea.sequence-stack-input.sequence-others-textarea,
.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack input,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea {
  grid-column: 2 !important;
  margin-left: 0 !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.sequence-panel .sequence-entry-highlight-palette,
.sequence-panel .sequence-entry-highlight-wrap.show-sequence-entry-palette .sequence-entry-highlight-palette,
.ultra-compact-guideline .sequence-entry-highlight-palette,
.ultra-compact-guideline .sequence-entry-highlight-wrap.show-sequence-entry-palette .sequence-entry-highlight-palette {
  grid-column: 1 / -1 !important;
  left: 0 !important;
  top: calc(100% + 4px) !important;
}


/* VERSION 2 AT-A-GLANCE SMALL OUTSIDE-LEFT JUMP BUTTON. */
.tag-title-row.summary-no-marker,
.tag-title-row.summary-marker-outside {
  position: relative !important;
  overflow: visible !important;
  padding-left: 18px !important;
}

.tag-title-row.summary-no-marker .summary-go,
.tag-title-row.summary-marker-outside .summary-go {
  position: absolute !important;
  left: -3px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  order: -1 !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(22,101,52,.55) !important;
  background: #22c55e !important;
  color: #ffffff !important;
  font-size: .76rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  box-shadow: 0 1px 2px rgba(22,101,52,.22) !important;
  z-index: 3 !important;
}

.tag-title-row.summary-no-marker .summary-go:hover,
.tag-title-row.summary-no-marker .summary-go:focus-visible,
.tag-title-row.summary-marker-outside .summary-go:hover,
.tag-title-row.summary-marker-outside .summary-go:focus-visible {
  background: #16a34a !important;
  border-color: #166534 !important;
  color: #ffffff !important;
  transform: translateY(-50%) !important;
  box-shadow: 0 0 0 2px rgba(34,197,94,.22), 0 1px 2px rgba(22,101,52,.24) !important;
}

.tag-title-row.summary-no-marker .summary-go:active,
.tag-title-row.summary-marker-outside .summary-go:active {
  background: #15803d !important;
}

/* VERSION 2 AT-A-GLANCE SEQUENCE LEFT ALIGNMENT FIX. */
.summary-extra-details-container,
.tag-title-row.summary-no-marker,
.tag-title-row.summary-marker-outside {
  text-align: left !important;
}

.summary-extra-details-container .expanded-summary-sequence-code,
.summary-extra-details-container .summary-sequence-code,
.tag-title-row.summary-no-marker .expanded-summary-sequence-code,
.tag-title-row.summary-no-marker .summary-sequence-code,
.tag-title-row.summary-marker-outside .expanded-summary-sequence-code,
.tag-title-row.summary-marker-outside .summary-sequence-code {
  justify-content: flex-start !important;
  justify-items: start !important;
  align-items: flex-start !important;
  text-align: left !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
}

.summary-extra-details-container .summary-sequence-text,
.tag-title-row.summary-no-marker .summary-sequence-text,
.tag-title-row.summary-marker-outside .summary-sequence-text,
.summary-extra-details-container .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-no-marker .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-marker-outside .summary-sequence-text.has-summary-sequence-highlight {
  text-align: left !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  align-self: flex-start !important;
  margin-left: 0 !important;
  margin-right: 3px !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
}


/* VERSION 2 AT-A-GLANCE PER-GUIDELINE COLLAPSE. */
.tag-title-row.summary-no-marker .ataglance-collapse-toggle,
.tag-title-row.summary-marker-outside .ataglance-collapse-toggle {
  flex: 0 0 18px !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  padding: 0 !important;
  margin: 0 3px 0 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(48,95,114,.24) !important;
  background: #f7fbfc !important;
  color: #305f72 !important;
  font-size: .76rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

.tag-title-row.summary-no-marker .ataglance-collapse-toggle:hover,
.tag-title-row.summary-no-marker .ataglance-collapse-toggle:focus-visible,
.tag-title-row.summary-marker-outside .ataglance-collapse-toggle:hover,
.tag-title-row.summary-marker-outside .ataglance-collapse-toggle:focus-visible {
  background: #e8f4f7 !important;
  color: #1d5f75 !important;
  border-color: rgba(29,95,117,.42) !important;
  box-shadow: 0 0 0 2px rgba(29,95,117,.12) !important;
}

.tag-title-row.ataglance-row-collapsed {
  min-height: 26px !important;
  align-items: center !important;
}

.tag-title-row.ataglance-row-collapsed .tag-title-jump {
  min-height: 24px !important;
  align-items: center !important;
}

.tag-title-row.ataglance-row-collapsed .summary-extra-details-container,
.tag-title-row.ataglance-row-collapsed .summary-symbol-group,
.tag-title-row.ataglance-row-collapsed .summary-sequence-code,
.tag-title-row.ataglance-row-collapsed .expanded-summary-sequence-code {
  display: none !important;
}

.tag-title-row.ataglance-row-collapsed .summary-tag-title-text {
  display: inline !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}


/* VERSION 2 AT-A-GLANCE GO AS SLIM LEFT STRIP: less button-like, keeps tooltip/ARIA jump action. */
.tag-title-row.summary-no-marker,
.tag-title-row.summary-marker-outside {
  position: relative !important;
  overflow: visible !important;
  padding-left: 10px !important;
}

.tag-title-row.summary-no-marker .summary-go,
.tag-title-row.summary-marker-outside .summary-go {
  position: absolute !important;
  left: 0 !important;
  top: 3px !important;
  bottom: 3px !important;
  transform: none !important;
  order: -1 !important;
  flex: 0 0 5px !important;
  width: 5px !important;
  min-width: 5px !important;
  max-width: 5px !important;
  height: auto !important;
  min-height: 18px !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #22c55e !important;
  color: transparent !important;
  font-size: 0 !important;
  font-weight: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  box-shadow: inset 0 0 0 1px rgba(22,101,52,.35) !important;
  cursor: pointer !important;
  z-index: 3 !important;
}

.tag-title-row.summary-no-marker .summary-go::before,
.tag-title-row.summary-no-marker .summary-go::after,
.tag-title-row.summary-marker-outside .summary-go::before,
.tag-title-row.summary-marker-outside .summary-go::after {
  content: "" !important;
  display: none !important;
}

.tag-title-row.summary-no-marker .summary-go:hover,
.tag-title-row.summary-no-marker .summary-go:focus-visible,
.tag-title-row.summary-marker-outside .summary-go:hover,
.tag-title-row.summary-marker-outside .summary-go:focus-visible {
  background: #16a34a !important;
  border: 0 !important;
  color: transparent !important;
  transform: none !important;
  box-shadow: 0 0 0 2px rgba(34,197,94,.18), inset 0 0 0 1px rgba(22,101,52,.45) !important;
  outline: none !important;
}

.tag-title-row.summary-no-marker .summary-go:active,
.tag-title-row.summary-marker-outside .summary-go:active {
  background: #15803d !important;
  transform: none !important;
}


/* VERSION 2 AT-A-GLANCE GUIDELINE-LEVEL COLLAPSE LAYOUT: arrow belongs to title, details collapse as a group. */
.tag-title-row.summary-no-marker,
.tag-title-row.summary-marker-outside {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 2px 4px !important;
}

.tag-title-row.summary-no-marker .ataglance-guideline-title-line,
.tag-title-row.summary-marker-outside .ataglance-guideline-title-line {
  display: inline-flex !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 3px !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  min-width: 0 !important;
  text-align: left !important;
}

.tag-title-row.summary-no-marker .ataglance-guideline-title-button,
.tag-title-row.summary-marker-outside .ataglance-guideline-title-button {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: calc(100% - 24px) !important;
  min-height: 20px !important;
  padding: 0 2px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  text-align: left !important;
}

.tag-title-row.summary-no-marker .ataglance-guideline-title-only,
.tag-title-row.summary-marker-outside .ataglance-guideline-title-only {
  display: inline !important;
  min-width: 0 !important;
  text-align: left !important;
}

.tag-title-row.summary-no-marker .ataglance-guideline-details-button,
.tag-title-row.summary-marker-outside .ataglance-guideline-details-button {
  flex: 1 1 100% !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 2px 0 21px !important;
  margin: 0 !important;
  display: block !important;
  text-align: left !important;
}

.tag-title-row.summary-no-marker .ataglance-guideline-details-button:empty,
.tag-title-row.summary-marker-outside .ataglance-guideline-details-button:empty {
  display: none !important;
}

.tag-title-row.summary-no-marker .ataglance-guideline-details-button .summary-extra-details-container,
.tag-title-row.summary-marker-outside .ataglance-guideline-details-button .summary-extra-details-container {
  display: block !important;
  width: 100% !important;
  margin-top: 0 !important;
  text-align: left !important;
}

.tag-title-row.ataglance-row-collapsed {
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  min-height: 24px !important;
}

.tag-title-row.ataglance-row-collapsed .ataglance-guideline-title-line {
  flex: 1 1 auto !important;
  width: auto !important;
}

.tag-title-row.ataglance-row-collapsed .ataglance-guideline-details-button,
.tag-title-row.ataglance-row-collapsed + .ataglance-inline-details-editor,
.tag-title-row.ataglance-row-collapsed .summary-extra-details-container,
.tag-title-row.ataglance-row-collapsed .summary-symbol-group,
.tag-title-row.ataglance-row-collapsed .summary-sequence-code,
.tag-title-row.ataglance-row-collapsed .expanded-summary-sequence-code {
  display: none !important;
}

.tag-title-row.ataglance-row-collapsed .ataglance-guideline-title-button,
.tag-title-row.ataglance-row-collapsed .summary-tag-title-text {
  display: inline-flex !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 20px !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  text-align: left !important;
}


/* VERSION 2 GUIDELINE TEXTBOX AUTO-EXPAND + NO-JUMP TYPING FIX. */
.guideline-label-textarea,
.inline-guideline-details,
.inline-guideline-scenario,
.guideline-cross-reference,
.guideline-tag-note,
.sequence-sub-entry,
.ataglance-full-field textarea,
.ataglance-detail-textarea {
  box-sizing: border-box !important;
  overflow-y: hidden !important;
  resize: none !important;
  transition: box-shadow .14s ease, background .14s ease, border-color .14s ease !important;
  scrollbar-width: none !important;
}

.guideline-label-textarea::-webkit-scrollbar,
.inline-guideline-details::-webkit-scrollbar,
.inline-guideline-scenario::-webkit-scrollbar,
.guideline-cross-reference::-webkit-scrollbar,
.guideline-tag-note::-webkit-scrollbar,
.sequence-sub-entry::-webkit-scrollbar,
.ataglance-full-field textarea::-webkit-scrollbar,
.ataglance-detail-textarea::-webkit-scrollbar {
  display: none !important;
}

.guideline-tag-note.auto-grow-textarea,
.sequence-sub-entry.auto-grow-textarea,
.guideline-cross-reference.auto-grow-textarea,
.inline-guideline-details.auto-grow-textarea,
.inline-guideline-scenario.auto-grow-textarea,
.guideline-label-textarea.auto-grow-textarea,
.ataglance-full-field textarea.auto-grow-textarea,
.ataglance-detail-textarea.auto-grow-textarea {
  max-height: none !important;
  overflow-y: hidden !important;
  resize: none !important;
}

.guideline-tag-note.auto-grow-textarea.textarea-default-expanded,
.sequence-sub-entry.auto-grow-textarea.textarea-default-expanded,
.guideline-cross-reference.auto-grow-textarea.textarea-default-expanded,
.inline-guideline-details.auto-grow-textarea.textarea-default-expanded,
.inline-guideline-scenario.auto-grow-textarea.textarea-default-expanded,
.guideline-label-textarea.auto-grow-textarea.textarea-default-expanded {
  max-height: none !important;
  overflow-y: hidden !important;
}

.guideline-tag-note.auto-grow-textarea:focus,
.guideline-tag-note.auto-grow-textarea:hover,
.sequence-sub-entry.auto-grow-textarea:focus,
.sequence-sub-entry.auto-grow-textarea:hover,
.guideline-cross-reference.auto-grow-textarea:focus,
.guideline-cross-reference.auto-grow-textarea:hover,
.inline-guideline-details.auto-grow-textarea:focus,
.inline-guideline-details.auto-grow-textarea:hover,
.inline-guideline-scenario.auto-grow-textarea:focus,
.inline-guideline-scenario.auto-grow-textarea:hover,
.guideline-label-textarea.auto-grow-textarea:focus,
.guideline-label-textarea.auto-grow-textarea:hover {
  max-height: none !important;
  overflow-y: hidden !important;
  resize: none !important;
  background: #fffdfa !important;
  box-shadow: 0 0 0 1px rgba(48,95,114,.18) !important;
}

.guideline-tag-note.auto-grow-textarea.textarea-default-collapsed:focus,
.guideline-tag-note.auto-grow-textarea.textarea-default-collapsed:hover,
.sequence-sub-entry.auto-grow-textarea.textarea-default-collapsed:focus,
.sequence-sub-entry.auto-grow-textarea.textarea-default-collapsed:hover,
.guideline-cross-reference.auto-grow-textarea.textarea-default-collapsed:focus,
.guideline-cross-reference.auto-grow-textarea.textarea-default-collapsed:hover,
.inline-guideline-details.auto-grow-textarea.textarea-default-collapsed:focus,
.inline-guideline-details.auto-grow-textarea.textarea-default-collapsed:hover,
.inline-guideline-scenario.auto-grow-textarea.textarea-default-collapsed:focus,
.inline-guideline-scenario.auto-grow-textarea.textarea-default-collapsed:hover,
.guideline-label-textarea.auto-grow-textarea.textarea-default-collapsed:focus,
.guideline-label-textarea.auto-grow-textarea.textarea-default-collapsed:hover {
  max-height: none !important;
  overflow-y: hidden !important;
}


/* VERSION 2 AT-A-GLANCE REDESIGN: cleaner collapsible overview deck. */
.chapter-overview-panel.ataglance-redesign-panel {
  border: 1px solid rgba(48,95,114,.18) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #f8fcfd 0%, #ffffff 48%, #fffdfa 100%) !important;
  box-shadow: 0 14px 34px rgba(15,23,42,.07) !important;
  padding: 14px !important;
  display: grid !important;
  gap: 10px !important;
}

.ataglance-redesign-heading {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 0 0 9px !important;
  border-bottom: 1px solid rgba(48,95,114,.12) !important;
}

.ataglance-heading-copy h3 {
  margin: 0 !important;
  color: #173d4b !important;
  font-size: 1.02rem !important;
  letter-spacing: .01em !important;
}

.ataglance-heading-copy p {
  margin: 3px 0 0 !important;
  color: #5f7480 !important;
  font-size: .78rem !important;
  line-height: 1.35 !important;
}

.ataglance-section-toggle {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 28px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(29,95,117,.26) !important;
  background: #eef8fb !important;
  color: #1d5f75 !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

.ataglance-section-toggle span {
  font-size: .9rem !important;
  line-height: 1 !important;
}

.ataglance-section-toggle:hover,
.ataglance-section-toggle:focus-visible {
  background: #dff1f6 !important;
  border-color: rgba(29,95,117,.45) !important;
  box-shadow: 0 0 0 2px rgba(29,95,117,.12) !important;
}

.ataglance-section-summary {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  max-width: 100% !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  background: rgba(48,95,114,.07) !important;
  color: #395463 !important;
  font-size: .74rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

.ataglance-section-summary strong {
  color: #173d4b !important;
  font-weight: 950 !important;
  margin: 0 3px !important;
}

.ataglance-redesign-body {
  display: grid !important;
  gap: 10px !important;
}

.ataglance-redesign-panel .at-a-glance-category-break {
  border: 1px solid rgba(48,95,114,.14) !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: 0 6px 16px rgba(15,23,42,.045) !important;
  padding: 10px !important;
  margin: 0 !important;
}

.ataglance-redesign-panel .at-a-glance-category-break + .at-a-glance-category-break {
  margin-top: 0 !important;
}

.ataglance-redesign-panel .at-a-glance-break-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 0 8px !important;
  padding: 0 0 7px !important;
  border-bottom: 1px dashed rgba(48,95,114,.15) !important;
}

.ataglance-redesign-panel .at-a-glance-break-title {
  color: #213f4d !important;
  font-size: .84rem !important;
  font-weight: 950 !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
}

.ataglance-redesign-panel .at-a-glance-category-rows,
.ataglance-redesign-panel .tag-title-overview {
  display: grid !important;
  gap: 7px !important;
}

.ataglance-redesign-panel .tag-title-row.summary-no-marker,
.ataglance-redesign-panel .tag-title-row.summary-marker-outside {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 4px !important;
  padding: 8px 10px 8px 22px !important;
  border: 1px solid rgba(48,95,114,.12) !important;
  border-radius: 13px !important;
  background: linear-gradient(180deg, #ffffff, #fbfdfe) !important;
  box-shadow: 0 2px 8px rgba(15,23,42,.035) !important;
  overflow: visible !important;
}

.ataglance-redesign-panel .tag-title-row.summary-no-marker::before,
.ataglance-redesign-panel .tag-title-row.summary-marker-outside::before {
  content: "" !important;
  position: absolute !important;
  left: 13px !important;
  top: 8px !important;
  bottom: 8px !important;
  width: 4px !important;
  border-radius: 999px !important;
  background: var(--tag-color, #38bdf8) !important;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.08) !important;
}

.ataglance-redesign-panel .tag-title-row .summary-go {
  left: 5px !important;
  right: auto !important;
  top: 8px !important;
  bottom: 8px !important;
  width: 5px !important;
  min-width: 5px !important;
  max-width: 5px !important;
  height: auto !important;
  min-height: 18px !important;
  max-height: none !important;
  border-radius: 999px !important;
  background: #22c55e !important;
  opacity: .82 !important;
}

.ataglance-redesign-panel .tag-title-row .summary-go:hover,
.ataglance-redesign-panel .tag-title-row .summary-go:focus-visible {
  background: #16a34a !important;
  opacity: 1 !important;
  box-shadow: 0 0 0 2px rgba(34,197,94,.17) !important;
}

.ataglance-redesign-panel .ataglance-guideline-title-line {
  display: inline-flex !important;
  align-items: flex-start !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
}

.ataglance-redesign-panel .ataglance-collapse-toggle {
  flex: 0 0 20px !important;
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  margin: 0 !important;
  border-radius: 999px !important;
  background: #f1f8fa !important;
  color: #285d70 !important;
}

.ataglance-redesign-panel .ataglance-guideline-title-button,
.ataglance-redesign-panel .ataglance-guideline-details-button {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  text-align: left !important;
}

.ataglance-redesign-panel .summary-tag-title-text {
  color: #173d4b !important;
  font-size: .86rem !important;
  font-weight: 950 !important;
  line-height: 1.25 !important;
}

.ataglance-redesign-panel .ataglance-guideline-details-button {
  width: 100% !important;
  padding-left: 25px !important;
}

.ataglance-redesign-panel .summary-extra-details-container {
  display: grid !important;
  gap: 4px !important;
  margin-top: 2px !important;
  text-align: left !important;
}

.ataglance-redesign-panel .tag-title-row.ataglance-row-collapsed {
  min-height: 36px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  background: #ffffff !important;
}

.ataglance-redesign-panel .tag-title-row.ataglance-row-collapsed .ataglance-guideline-details-button,
.ataglance-redesign-panel .tag-title-row.ataglance-row-collapsed + .ataglance-inline-details-editor,
.ataglance-redesign-panel .tag-title-row.ataglance-row-collapsed .summary-extra-details-container,
.ataglance-redesign-panel .tag-title-row.ataglance-row-collapsed .summary-symbol-group,
.ataglance-redesign-panel .tag-title-row.ataglance-row-collapsed .summary-sequence-code,
.ataglance-redesign-panel .tag-title-row.ataglance-row-collapsed .expanded-summary-sequence-code {
  display: none !important;
}

.chapter-overview-panel.ataglance-section-collapsed {
  padding-bottom: 12px !important;
  background: linear-gradient(180deg, #f8fcfd, #ffffff) !important;
}

.chapter-overview-panel.ataglance-section-collapsed .ataglance-section-summary {
  background: #eef8fb !important;
}


/* VERSION 2 AT-A-GLANCE CARD-LEVEL COLLAPSE CORRECTION. */
.ataglance-card-collapse-mode .ataglance-section-toggle,
.ataglance-card-collapse-mode .ataglance-collapse-toggle {
  display: none !important;
}

.ataglance-card-collapse-mode .at-a-glance-break-heading {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  justify-content: stretch !important;
  gap: 7px !important;
}

.ataglance-card-collapse-mode .ataglance-card-collapse-toggle {
  grid-column: 1 !important;
  flex: 0 0 22px !important;
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 999px !important;
  border: 1px solid rgba(29,95,117,.26) !important;
  background: #eef8fb !important;
  color: #1d5f75 !important;
  font-size: .86rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

.ataglance-card-collapse-mode .ataglance-card-collapse-toggle:hover,
.ataglance-card-collapse-mode .ataglance-card-collapse-toggle:focus-visible {
  background: #dff1f6 !important;
  border-color: rgba(29,95,117,.45) !important;
  box-shadow: 0 0 0 2px rgba(29,95,117,.12) !important;
}

.ataglance-card-collapse-mode .at-a-glance-break-title {
  grid-column: 2 !important;
  min-width: 0 !important;
}

.ataglance-card-collapse-mode .ataglance-card-meta {
  grid-column: 3 !important;
  justify-self: end !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  background: rgba(48,95,114,.07) !important;
  color: #526b78 !important;
  font-size: .68rem !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}

.ataglance-card-collapse-mode .at-a-glance-break-heading .compact-color-key {
  grid-column: 1 / -1 !important;
  margin-top: 3px !important;
}

.ataglance-card-collapse-mode .at-a-glance-category-break.ataglance-card-collapsed {
  padding-bottom: 10px !important;
  background: linear-gradient(180deg, #ffffff, #f8fcfd) !important;
}

.ataglance-card-collapse-mode .at-a-glance-category-break.ataglance-card-collapsed .tag-title-overview,
.ataglance-card-collapse-mode .at-a-glance-category-break.ataglance-card-collapsed .at-a-glance-category-rows,
.ataglance-card-collapse-mode .at-a-glance-category-break.ataglance-card-collapsed .tag-title-row,
.ataglance-card-collapse-mode .at-a-glance-category-break.ataglance-card-collapsed .ataglance-inline-details-editor {
  display: none !important;
}

.ataglance-card-collapse-mode .tag-title-row.ataglance-row-collapsed .ataglance-guideline-details-button,
.ataglance-card-collapse-mode .tag-title-row.ataglance-row-collapsed .summary-extra-details-container,
.ataglance-card-collapse-mode .tag-title-row.ataglance-row-collapsed .summary-symbol-group,
.ataglance-card-collapse-mode .tag-title-row.ataglance-row-collapsed .summary-sequence-code,
.ataglance-card-collapse-mode .tag-title-row.ataglance-row-collapsed .expanded-summary-sequence-code {
  display: initial !important;
}

.ataglance-card-collapse-mode .tag-title-row.ataglance-row-collapsed {
  min-height: inherit !important;
}

/* ==========================================================================
   DAZZLE EDITION - COLOR BURST BACKGROUNDS + TASTEFUL GLOW
   Goal: vivid animated backdrop, but Guidelines + Details stay the focus.
   All burst effects are disabled for print further below.
   ========================================================================== */

:root {
  --dazzle-ink: #17222b;
  --dazzle-brand: #1f5f75;
  --dazzle-accent: #ff7a59;
  --dazzle-accent-2: #6a5cff;
  --dazzle-accent-3: #12c2c2;
  --dazzle-glass: rgba(255, 255, 255, .86);
  --dazzle-glass-strong: rgba(255, 255, 255, .95);
  --dazzle-line: rgba(31, 95, 117, .16);
  --dazzle-soft-shadow: 0 24px 60px rgba(24, 42, 66, .18);
}

/* Animated multi-color burst backdrop, fixed behind everything. */
body[data-desktop-app="true"] {
  background: #0d1626 !important;
  color: var(--dazzle-ink) !important;
  position: relative;
  isolation: isolate;
}

body[data-desktop-app="true"]::before {
  content: "";
  position: fixed;
  inset: -20vmax;
  z-index: -3;
  pointer-events: none;
  background:
    radial-gradient(42vmax 42vmax at 12% 8%, rgba(255, 122, 89, .55), transparent 60%),
    radial-gradient(46vmax 46vmax at 88% 6%, rgba(106, 92, 255, .52), transparent 62%),
    radial-gradient(50vmax 50vmax at 82% 92%, rgba(18, 194, 194, .5), transparent 60%),
    radial-gradient(44vmax 44vmax at 8% 88%, rgba(255, 199, 71, .5), transparent 60%),
    radial-gradient(60vmax 60vmax at 50% 50%, rgba(48, 95, 114, .35), transparent 70%),
    linear-gradient(135deg, #101a2e, #16283f 45%, #101a2e);
  background-size: 200% 200%, 200% 200%, 200% 200%, 200% 200%, 220% 220%, 100% 100%;
  filter: saturate(1.15);
  animation: dazzleBurstDrift 26s ease-in-out infinite alternate;
}

/* Soft floating light specks for a bit of sparkle. */
body[data-desktop-app="true"]::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background-image:
    radial-gradient(2px 2px at 20% 30%, rgba(255,255,255,.55), transparent),
    radial-gradient(2px 2px at 70% 20%, rgba(255,255,255,.4), transparent),
    radial-gradient(1.6px 1.6px at 40% 70%, rgba(255,255,255,.45), transparent),
    radial-gradient(1.6px 1.6px at 85% 65%, rgba(255,255,255,.35), transparent),
    radial-gradient(1.8px 1.8px at 30% 88%, rgba(255,255,255,.4), transparent);
  opacity: .5;
  animation: dazzleSparkle 9s ease-in-out infinite alternate;
}

@keyframes dazzleBurstDrift {
  0%   { background-position: 0% 0%, 100% 0%, 100% 100%, 0% 100%, 50% 50%, 0 0; }
  50%  { background-position: 60% 40%, 40% 60%, 40% 40%, 60% 60%, 55% 45%, 0 0; }
  100% { background-position: 100% 100%, 0% 100%, 0% 0%, 100% 0%, 45% 55%, 0 0; }
}

@keyframes dazzleSparkle {
  0%   { opacity: .28; transform: translateY(0); }
  100% { opacity: .6; transform: translateY(-8px); }
}

/* Slim gradient glow ribbon along the very top edge of the app shell. */
.app-shell {
  position: relative;
}
.app-shell::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--dazzle-accent), var(--dazzle-accent-2), var(--dazzle-accent-3), var(--dazzle-accent));
  background-size: 300% 100%;
  box-shadow: 0 0 22px rgba(106, 92, 255, .5);
  animation: dazzleRibbon 10s linear infinite;
  opacity: .9;
}
@keyframes dazzleRibbon {
  0% { background-position: 0% 0; }
  100% { background-position: 300% 0; }
}

/* Topbar: glassy plate with a subtle gradient wash so the brand pops. */
.topbar {
  background: linear-gradient(120deg, rgba(255,255,255,.14), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 20px;
  padding: 16px 20px;
  backdrop-filter: blur(10px) saturate(1.2);
  -webkit-backdrop-filter: blur(10px) saturate(1.2);
  box-shadow: 0 18px 44px rgba(9, 16, 30, .35);
}
.brand-block h1 {
  background: linear-gradient(92deg, #ffffff, #d7f4ff 45%, #ffd8c7);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: 0 2px 18px rgba(0,0,0,.25);
}
.brand-block p { color: rgba(255,255,255,.82) !important; }

.search {
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.5) !important;
  box-shadow: 0 8px 22px rgba(9,16,30,.25);
}

/* Content surfaces become bright readable glass panels ON TOP of the burst.
   This keeps Guidelines + Details crisp and high-contrast. */
.sidebar,
.content-panel,
.card,
.modal-card {
  background: var(--dazzle-glass-strong) !important;
  border: 1px solid rgba(255,255,255,.7) !important;
  box-shadow: var(--dazzle-soft-shadow) !important;
  backdrop-filter: blur(6px) saturate(1.05);
  -webkit-backdrop-filter: blur(6px) saturate(1.05);
}

.content-panel {
  position: relative;
  overflow: hidden;
}
/* Faint corner color-burst tint inside the main content panel (very subtle,
   never behind text blocks). */
.content-panel::before {
  content: "";
  position: absolute;
  top: -120px;
  right: -120px;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,122,89,.16), transparent 68%);
  pointer-events: none;
  z-index: 0;
}
.content-panel::after {
  content: "";
  position: absolute;
  bottom: -140px;
  left: -140px;
  width: 340px;
  height: 340px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(106,92,255,.14), transparent 68%);
  pointer-events: none;
  z-index: 0;
}
.content-panel > * { position: relative; z-index: 1; }

/* Sidebar chapter index: keep clean, add a gentle brand edge glow. */
.sidebar {
  border-left: 3px solid transparent !important;
  background-image:
    linear-gradient(var(--dazzle-glass-strong), var(--dazzle-glass-strong)),
    linear-gradient(180deg, var(--dazzle-accent), var(--dazzle-accent-2)) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
}

/* DAZZLE ACCENTS ON GUIDELINE CARDS + DETAILS (kept legible on white). */
.category,
.guideline-item,
.chapter-overview-panel,
.at-a-glance-category-break {
  position: relative;
}

/* Guideline main section cards: crisp white with a colored accent spine + hover lift. */
.category {
  background: #ffffff !important;
  border: 1px solid var(--dazzle-line) !important;
  border-radius: 16px !important;
  box-shadow: 0 14px 34px rgba(24, 42, 66, .12) !important;
  transition: transform .18s ease, box-shadow .22s ease !important;
}
.category::before {
  content: "";
  position: absolute;
  left: 0; top: 12px; bottom: 12px;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--dazzle-accent), var(--dazzle-accent-2), var(--dazzle-accent-3));
  opacity: .9;
}
.category:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 48px rgba(24, 42, 66, .2) !important;
}

/* Details / textareas stay clean and high-contrast for reading + typing. */
.inline-guideline-details,
.inline-guideline-scenario,
.guideline-cross-reference,
.guideline-tag-note,
.sequence-sub-entry,
.ataglance-detail-textarea,
.ataglance-full-field textarea {
  background: #ffffff !important;
  color: var(--dazzle-ink) !important;
}
.inline-guideline-details:focus,
.inline-guideline-scenario:focus,
.guideline-cross-reference:focus,
.guideline-tag-note:focus,
.sequence-sub-entry:focus,
.ataglance-detail-textarea:focus,
.ataglance-full-field textarea:focus {
  box-shadow: 0 0 0 2px rgba(106, 92, 255, .28), 0 8px 22px rgba(24,42,66,.12) !important;
  background: #fffdfb !important;
}

/* At-a-Glance redesign panel: light frosted deck with soft burst glow. */
.chapter-overview-panel.ataglance-redesign-panel {
  background: linear-gradient(180deg, #ffffff, #f6fbfd) !important;
  border: 1px solid rgba(255,255,255,.8) !important;
  box-shadow: 0 20px 48px rgba(24, 42, 66, .16) !important;
}
.ataglance-redesign-heading h3 {
  background: linear-gradient(92deg, var(--dazzle-brand), var(--dazzle-accent-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* At-a-Glance cards: white with animated gradient top edge on hover. */
.ataglance-card-collapse-mode .at-a-glance-category-break {
  background: #ffffff !important;
  border: 1px solid var(--dazzle-line) !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 26px rgba(24,42,66,.1) !important;
  overflow: hidden;
  transition: transform .16s ease, box-shadow .2s ease !important;
}
.ataglance-card-collapse-mode .at-a-glance-category-break::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--dazzle-accent), var(--dazzle-accent-2), var(--dazzle-accent-3), var(--dazzle-accent));
  background-size: 300% 100%;
  opacity: 0;
  transition: opacity .2s ease;
}
.ataglance-card-collapse-mode .at-a-glance-category-break:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(24,42,66,.18) !important;
}
.ataglance-card-collapse-mode .at-a-glance-category-break:hover::after {
  opacity: 1;
  animation: dazzleRibbon 6s linear infinite;
}

/* Primary buttons: gradient with shimmer sweep on hover.
   EXCLUDES all color controls and plain-word controls inside the cards
   (tab color swatches, highlight strip/swatches, B/I/U, Add, X, delete). */
button:not(.ghost):not(.secondary):not(.small):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.tag-strip-swatch):not(.main-section-collapse-toggle):not(.plain-empty-state):not(.ready-guideline-starter):not(.empty-guideline-item-prompt):not(.blank-guideline-entry):not(.utility-link-action):not(.text-action):not(.danger-text):not(.note-clear-button):not(.tiny-index-control):not(.tiny-marker):not(.icon-option):not(.guideline-search-result):not(.search-result-row):not(.mini-danger):not(.ataglance-delete-detail) {
  background: linear-gradient(120deg, var(--dazzle-brand), #2b7f9a) !important;
  position: relative;
  overflow: hidden;
}
button:not(.ghost):not(.secondary):not(.small):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.tag-strip-swatch):not(.main-section-collapse-toggle):not(.plain-empty-state):not(.ready-guideline-starter):not(.empty-guideline-item-prompt):not(.blank-guideline-entry):not(.utility-link-action):not(.text-action):not(.danger-text):not(.note-clear-button):not(.tiny-index-control):not(.tiny-marker):not(.icon-option):not(.guideline-search-result):not(.search-result-row):not(.mini-danger):not(.ataglance-delete-detail)::after {
  content: "";
  position: absolute;
  top: 0; left: -120%;
  width: 60%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.5), transparent);
  transform: skewX(-18deg);
  transition: left .55s ease;
}
button:not(.ghost):not(.secondary):not(.small):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.tag-strip-swatch):not(.main-section-collapse-toggle):not(.plain-empty-state):not(.ready-guideline-starter):not(.empty-guideline-item-prompt):not(.blank-guideline-entry):not(.utility-link-action):not(.text-action):not(.danger-text):not(.note-clear-button):not(.tiny-index-control):not(.tiny-marker):not(.icon-option):not(.guideline-search-result):not(.search-result-row):not(.mini-danger):not(.ataglance-delete-detail):hover::after {
  left: 130%;
}

/* The little "Go" / jump buttons get a warm gradient dot look. */
.summary-go {
  background: radial-gradient(circle at 35% 30%, #ffd08a, var(--dazzle-accent)) !important;
  box-shadow: 0 3px 10px rgba(255, 122, 89, .5) !important;
  border: none !important;
}
.summary-go:hover {
  box-shadow: 0 5px 16px rgba(255, 122, 89, .7) !important;
}

/* Card-level collapse toggle: glowing pill. */
.ataglance-card-collapse-mode .ataglance-card-collapse-toggle {
  background: linear-gradient(135deg, #eef8fb, #ffffff) !important;
  box-shadow: 0 2px 8px rgba(31,95,117,.2) !important;
}

/* Respect users who prefer reduced motion. */
@media (prefers-reduced-motion: reduce) {
  body[data-desktop-app="true"]::before,
  body[data-desktop-app="true"]::after,
  .app-shell::before,
  .ataglance-card-collapse-mode .at-a-glance-category-break:hover::after {
    animation: none !important;
  }
}

/* PRINT: kill the burst and glow so printed notes stay clean and legible. */
@media print {
  body[data-desktop-app="true"] { background: #ffffff !important; }
  body[data-desktop-app="true"]::before,
  body[data-desktop-app="true"]::after,
  .app-shell::before,
  .content-panel::before,
  .content-panel::after,
  .category::before,
  .ataglance-card-collapse-mode .at-a-glance-category-break::after {
    display: none !important;
  }
  .topbar { background: #fff !important; border-color: #ddd !important; box-shadow: none !important; }
  .brand-block h1 { color: #17222b !important; -webkit-text-fill-color: #17222b !important; }
}

/* ==========================================================================
   DAZZLE EDITION - TARGETED FIXES
   1) Color swatches/pickers were overridden by the dazzle button gradient.
   2) The dazzle shimmer ::after overlay was blocking picker clicks.
   3) At-a-Glance details Primary/Secondary/Tertiary/Others too close to left.
   4) At-a-Glance jump-to-guideline "Go" strip too thin to grab.
   ========================================================================== */

/* ---- FIX 1 & 2: restore all color swatches / color trigger controls ---- */
/* Kill the dazzle gradient + shimmer sweep on color controls so the real
   swatch color shows and clicks are not intercepted. */
.color-swatch,
.tag-strip-swatch,
.sequence-entry-highlight-swatch,
.sequence-entry-color-line,
.tag-color-strip,
.color-index-swatch,
.color-key-chip,
.recent-color-palette summary {
  background-image: none !important;
}

.color-swatch::after,
.tag-strip-swatch::after,
.sequence-entry-highlight-swatch::after,
.sequence-entry-color-line::after,
.tag-color-strip::after,
.color-index-swatch::after,
.recent-color-palette summary::after {
  content: none !important;
  display: none !important;
}

/* Re-apply the actual swatch colors that the dazzle gradient hid. */
.color-swatch { background: var(--swatch) !important; }
.tag-strip-swatch { background: var(--swatch) !important; }
.sequence-entry-highlight-swatch { background: var(--sequence-swatch) !important; }
.color-index-swatch { background: var(--swatch) !important; }
.tag-color-strip { background: var(--tag-color, #305f72) !important; }

/* Make sure the clear (x) swatch stays neutral/legible, not gradient. */
.sequence-entry-highlight-clear {
  background: #ffffff !important;
  color: #444 !important;
  background-image: none !important;
}
.sequence-entry-highlight-clear::after { content: none !important; }

/* Ensure the tag color picker + highlight palettes and their triggers are
   clickable and above the dazzle decorative layers. */
.tag-color-strip,
.sequence-entry-color-line,
.recent-color-palette summary {
  pointer-events: auto !important;
  position: relative !important;
  z-index: 5 !important;
}
.tag-strip-palette,
.sequence-entry-highlight-palette,
.color-swatch-menu,
.color-key-editor {
  z-index: 60 !important;
}

/* ---- FIX 3: space the Primary/Secondary/Tertiary/Others container away
   from the left margin inside the open guideline details editor. ---- */
.ataglance-full-guideline-editor .ataglance-full-editor-grid {
  padding-left: 16px !important;
  padding-right: 6px !important;
}
.ataglance-full-guideline-editor .ataglance-full-section {
  margin-left: 4px !important;
}
/* The Code Sequence block specifically gets a touch more breathing room. */
.ataglance-full-guideline-editor .ataglance-sequence-grid {
  padding-left: 6px !important;
}

/* ---- FIX 4: make the At-a-Glance jump-to-guideline "Go" strip thicker. ---- */
.tag-title-row.summary-no-marker .summary-go,
.tag-title-row.summary-marker-outside .summary-go {
  left: -6px !important;
  width: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(22,101,52,.6) !important;
  background: linear-gradient(180deg, #22c55e, #16a34a) !important;
  box-shadow: 0 2px 6px rgba(22,101,52,.35) !important;
  cursor: pointer !important;
}
.tag-title-row.summary-no-marker .summary-go:hover,
.tag-title-row.summary-marker-outside .summary-go:hover,
.tag-title-row.summary-no-marker .summary-go:focus-visible,
.tag-title-row.summary-marker-outside .summary-go:focus-visible {
  /* STATIC: no scale/grow on hover (kept flat to stop the jumpiness). */
  transform: translateY(-50%) !important;
  box-shadow: 0 1px 4px rgba(22,101,52,.4) !important;
}

/* Give the row a little more left padding so the thicker strip has room. */
.ataglance-card-collapse-mode .tag-title-row.summary-no-marker,
.ataglance-card-collapse-mode .tag-title-row.summary-marker-outside {
  padding-left: 26px !important;
}

/* ==========================================================================
   DAZZLE EDITION - FIXES ROUND 2
   A) Book cards (and other content) were getting clipped at the top because
      the dazzle content-panel used overflow:hidden for its corner glow.
      -> Stop clipping the panel; render the glow as contained background
         gradients (naturally clipped by the panel's rounded corners).
   B) Text sitting on shimmer / gradient areas must be white for readability.
   ========================================================================== */

/* ---- FIX A: no more clipping of book cards / content ---- */
.content-panel {
  overflow: visible !important;
  /* Contained color-burst glow drawn directly on the panel background,
     clipped cleanly by the rounded corners (no overflow:hidden needed). */
  background:
    radial-gradient(320px 320px at calc(100% + 40px) -40px, rgba(255,122,89,.14), transparent 68%),
    radial-gradient(340px 340px at -60px calc(100% + 60px), rgba(106,92,255,.12), transparent 68%),
    var(--dazzle-glass-strong) !important;
}
/* The old decorative circles are no longer needed and could cause clipping. */
.content-panel::before,
.content-panel::after {
  content: none !important;
  display: none !important;
}
/* Give the book grid a little breathing room from the top so nothing feels cut. */
.book-grid { margin-top: 22px !important; padding-top: 4px !important; }
.card { overflow: visible !important; }

/* ---- FIX B: white text on shimmer / gradient surfaces ---- */
/* Primary gradient buttons + their labels.
   EXCLUDES the plain-text card controls (Bold/Italic/Underline, Add, X,
   delete, color line, swatches) which must keep their own colors. */
button:not(.ghost):not(.secondary):not(.small):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.tag-strip-swatch):not(.main-section-collapse-toggle):not(.plain-empty-state):not(.ready-guideline-starter):not(.empty-guideline-item-prompt):not(.blank-guideline-entry):not(.utility-link-action):not(.text-action):not(.danger-text):not(.note-clear-button):not(.tiny-index-control):not(.tiny-marker):not(.icon-option):not(.guideline-search-result):not(.search-result-row):not(.mini-danger):not(.ataglance-delete-detail),
button:not(.ghost):not(.secondary):not(.small):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.tag-strip-swatch):not(.main-section-collapse-toggle):not(.plain-empty-state):not(.ready-guideline-starter):not(.empty-guideline-item-prompt):not(.blank-guideline-entry):not(.utility-link-action):not(.text-action):not(.danger-text):not(.note-clear-button):not(.tiny-index-control):not(.tiny-marker):not(.icon-option):not(.guideline-search-result):not(.search-result-row):not(.mini-danger):not(.ataglance-delete-detail) * {
  color: #ffffff !important;
}
/* The green gradient Go strips. */
.tag-title-row .summary-go,
.tag-title-row.summary-no-marker .summary-go,
.tag-title-row.summary-marker-outside .summary-go,
.summary-go {
  color: #ffffff !important;
}
/* Topbar sits on the dark burst -> keep its text/controls white. */
.topbar,
.topbar .brand-block p,
.topbar label,
.topbar .toolbar,
.topbar .toolbar * {
  color: #ffffff !important;
}
/* Ghost / secondary toolbar buttons on the dark topbar: readable white text
   with a translucent surface so they still look like buttons. */
.topbar button.ghost,
.topbar button.secondary {
  color: #ffffff !important;
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.35) !important;
}
.topbar button.ghost:hover,
.topbar button.secondary:hover {
  background: rgba(255,255,255,.24) !important;
}
/* Keep the search field text dark (it has a white field background). */
.topbar .search { color: var(--dazzle-ink) !important; }

/* Animated At-a-Glance card top ribbon is decorative only (no text), leave as is.
   Any content that sits ON a gradient header uses white for contrast. */
.ataglance-redesign-heading h3 { /* gradient text clip stays */ }

/* ==========================================================================
   DAZZLE EDITION - FIXES ROUND 3
   1) Slim the At-a-Glance Go strip (slim width, thicker than original dot).
   2) Space the Primary/Secondary/Tertiary/Others highlight items off the
      left edge of their container in the open guideline details editor.
   3) Color swatches STILL hidden: the dazzle gradient rule
      `button:not(.ghost):not(.secondary):not(.small)` has HIGHER specificity
      (three :not() = beats a single class), so source order did not help.
      -> Re-declare swatch backgrounds with equal/higher specificity.
   ========================================================================== */

/* ---- FIX 3 (colors): win the specificity battle against the dazzle gradient.
   Match/exceed the button:not():not():not() specificity so the real color shows. ---- */
button.color-swatch:not(.ghost):not(.secondary),
button.color-swatch:not(.ghost):not(.secondary):not(.small) {
  background: var(--swatch) !important;
  background-image: none !important;
}
button.tag-strip-swatch:not(.ghost):not(.secondary),
button.tag-strip-swatch:not(.ghost):not(.secondary):not(.small) {
  background: var(--swatch) !important;
  background-image: none !important;
}
button.sequence-entry-highlight-swatch:not(.ghost):not(.secondary),
button.sequence-entry-highlight-swatch:not(.ghost):not(.secondary):not(.small) {
  background: var(--sequence-swatch, #fffdfa) !important;
  background-image: none !important;
}
button.tag-color-strip:not(.ghost):not(.secondary),
button.tag-color-strip:not(.ghost):not(.secondary):not(.small) {
  background: var(--tag-color, #305f72) !important;
  background-image: none !important;
}
/* The color-index swatch is a <span>, but guard it anyway. */
.color-index-swatch { background: var(--swatch) !important; background-image: none !important; }
/* Clear (x) highlight button: neutral, not gradient. */
button.sequence-entry-highlight-clear:not(.ghost):not(.secondary):not(.small) {
  background: #ffffff !important;
  background-image: none !important;
  color: #9a3412 !important;
}
/* The recent-colors palette summary shows the current color; keep it real. */
.recent-color-palette summary { background: var(--current-color, #fff) !important; background-image: none !important; }

/* ---- FIX 1 (Go strip): keep the row's ORIGINAL 3-column grid intact so the
   guideline text never gets pushed off screen. The Go strip is an ABSOLUTELY
   positioned slim bar pinned to the left edge (inside the row's left padding),
   vertically centered and static. The row gets a little left padding so the
   text sits just to the right of the bar and stays fully visible. ---- */

.tag-title-row.summary-no-marker,
.tag-title-row.summary-marker-outside {
  /* original 3-column layout — do NOT add a Go column */
  grid-template-columns: minmax(0, 1fr) 26px 26px !important;
  column-gap: 5px !important;
  position: relative !important;
  padding-left: 18px !important;  /* room for the slim strip + a small gap */
}

/* The Go strip: slim, static, pinned to the left, vertically centered. */
.ataglance-card-collapse-mode .tag-title-row.summary-no-marker .summary-go,
.ataglance-card-collapse-mode .tag-title-row.summary-marker-outside .summary-go,
.tag-title-row.summary-no-marker .summary-go,
.tag-title-row.summary-marker-outside .summary-go {
  position: absolute !important;
  left: 4px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  border-radius: 5px !important;
  border: 1px solid rgba(22,101,52,.55) !important;
  background: linear-gradient(180deg, #22c55e, #16a34a) !important;
  box-shadow: 0 1px 3px rgba(22,101,52,.28) !important;
  font-size: 0 !important; /* hide any glyph so the slim bar stays clean */
  padding: 0 !important;
  transition: none !important;
  cursor: pointer !important;
  z-index: 3 !important;
}
/* STATIC: hover / focus / active must NOT change size or move the bar. */
.ataglance-card-collapse-mode .tag-title-row.summary-no-marker .summary-go:hover,
.ataglance-card-collapse-mode .tag-title-row.summary-marker-outside .summary-go:hover,
.tag-title-row.summary-no-marker .summary-go:hover,
.tag-title-row.summary-marker-outside .summary-go:hover,
.tag-title-row.summary-no-marker .summary-go:focus,
.tag-title-row.summary-marker-outside .summary-go:focus,
.tag-title-row.summary-no-marker .summary-go:focus-visible,
.tag-title-row.summary-marker-outside .summary-go:focus-visible,
.tag-title-row.summary-no-marker .summary-go:active,
.tag-title-row.summary-marker-outside .summary-go:active {
  position: absolute !important;
  left: 4px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 7px !important;
  min-width: 7px !important;
  max-width: 7px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  transition: none !important;
  background: linear-gradient(180deg, #16a34a, #15803d) !important;
  box-shadow: 0 1px 4px rgba(22,101,52,.4) !important;
}

/* Title line stays in the first content column (unchanged original layout). */
.summary-no-marker .tag-title-jump,
.summary-marker-outside .tag-title-jump,
.tag-title-row.summary-no-marker .ataglance-guideline-title-line,
.tag-title-row.summary-marker-outside .ataglance-guideline-title-line {
  grid-column: 1 !important;
  width: 100% !important;
}

/* ---- FIX 2 (spacing): push the highlighted Primary/Secondary/Tertiary/Others
   values off the left edge of their container. These are the .summary-sequence-text
   / sequence entry chips inside the At-a-Glance details area. ---- */
.ataglance-full-guideline-editor .ataglance-full-section .ataglance-sequence-grid {
  padding-left: 12px !important;
  padding-right: 6px !important;
}
.ataglance-full-guideline-editor .ataglance-sequence-field {
  margin-left: 6px !important;
}
/* Highlighted sequence chips in the At-a-Glance overview rows. */
.tag-title-row .summary-extra-details-container,
.tag-title-row .summary-sequence-code,
.tag-title-row .expanded-summary-sequence-code {
  padding-left: 8px !important;
}
.summary-extra-details-container .summary-sequence-text:first-child,
.tag-title-row .summary-sequence-text:first-child {
  margin-left: 6px !important;
}
/* The sequence entry highlight rows inside the details editor. */
.sequence-entry-highlight-wrap {
  margin-left: 6px !important;
}

/* =====================================================================
   FIXES ROUND 4 — Go bar alignment already handled above (FIX 1 rewrite).
   Below: tag color palette stability + Color Key close-on-outside-click.
   ===================================================================== */

/* --- Tag color palette: REBUILT to work exactly like the highlight picker.
   The palette now lives inside .tag-color-wrap (which holds the color-strip
   button) and is positioned with pure CSS `position: absolute` relative to
   that wrapper — no JavaScript geometry, no fixed positioning, no reflow math.
   This is the same, reliable approach the sequence highlight picker uses. --- */

/* The wrapper that contains the color-strip button IS the positioning anchor. */
.tag-color-wrap {
  position: relative !important;
  overflow: visible !important;
}

/* Hidden by default. */
.tag-color-wrap .tag-strip-palette {
  display: none !important;
  position: absolute !important;
  top: 0 !important;
  left: calc(100% + 8px) !important;   /* pop out to the RIGHT of the strip */
  right: auto !important;
  bottom: auto !important;
  z-index: 10000 !important;
  width: 300px !important;
  min-width: 300px !important;
  max-width: 300px !important;
  /* Let the box grow to fit ALL colors. A generous max-height + scroll is only
     a safety net for very short screens; normally the whole grid is shown. */
  height: auto !important;
  min-height: 0 !important;
  max-height: min(80vh, 640px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  padding: 12px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(48,95,114,.20) !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 18px 44px rgba(20,30,40,.28) !important;
}

/* Shown when the wrapper carries the open class (toggled in JS). */
.tag-color-wrap.show-tag-palette .tag-strip-palette {
  display: block !important;
}

/* If popping right would overflow the viewport edge, the guideline rows are
   wide; keep the popup inside by allowing it to sit just below the strip on
   very narrow widths. */
@media (max-width: 900px) {
  .tag-color-wrap .tag-strip-palette {
    left: 0 !important;
    top: calc(100% + 6px) !important;
    width: min(300px, calc(100vw - 40px)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 40px) !important;
  }
}

/* Swatch grid: all colors visible, wraps neatly (never a single cut-off row).
   Swatches use a FIXED height (not aspect-ratio) so empty color chips can never
   collapse to zero height and shrink the white background. */
.tag-color-wrap .tag-strip-swatch-list {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
  gap: 8px !important;
  align-content: start !important;
}
.tag-color-wrap .tag-strip-swatch {
  width: 100% !important;
  height: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  min-width: 0 !important;
  aspect-ratio: auto !important;
  border-radius: 8px !important;
  padding: 0 !important;
}

/* ============================================================
   FIX ROUND 6 (2026): Notes & Details STATIONARY on hover.
   The Notes (.guideline-tag-note) and Details (.inline-guideline-details)
   fields previously GREW on hover (height jumping to 82px/110px/140px),
   which reflowed the layout and felt "jumpy". These overrides pin the
   hover/focus dimensions to the resting size so they never move; text
   overflow simply scrolls inside the box. Intentionally last.
   ============================================================ */

/* Ultra-compact mode: keep resting 42px on hover/focus, scroll internally */
.ultra-compact-guideline .inline-guideline-details:hover,
.ultra-compact-guideline .inline-guideline-details:focus,
.ultra-compact-guideline .guideline-tag-note:hover,
.ultra-compact-guideline .guideline-tag-note:focus {
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  overflow-y: auto !important;
  transform: none !important;
  transition: background .12s ease, box-shadow .12s ease !important;
  z-index: 4 !important;
}

/* Base (non ultra-compact) fields: keep resting 38px, scroll internally */
.inline-guideline-details:hover,
.inline-guideline-details:focus,
.guideline-tag-note:hover,
.guideline-tag-note:focus {
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  overflow-y: auto !important;
  transform: none !important;
  transition: background .12s ease, box-shadow .12s ease !important;
}

/* Expanded (default-expanded) variants keep their expanded resting size, no jump */
.inline-guideline-details.textarea-default-expanded:hover,
.inline-guideline-details.textarea-default-expanded:focus,
.guideline-tag-note.textarea-default-expanded:hover,
.guideline-tag-note.textarea-default-expanded:focus {
  height: 100px !important;
  min-height: 100px !important;
  max-height: 100px !important;
  overflow-y: auto !important;
  transform: none !important;
}

/* Never allow a hover-driven transform/scale/translate to shift these */
.inline-guideline-details:hover,
.inline-guideline-details:focus,
.guideline-tag-note:hover,
.guideline-tag-note:focus,
.ultra-compact-guideline .inline-guideline-details:hover,
.ultra-compact-guideline .inline-guideline-details:focus,
.ultra-compact-guideline .guideline-tag-note:hover,
.ultra-compact-guideline .guideline-tag-note:focus {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  margin: 0 !important;
}

/* ============================================================
   Chapter title helper text ("Chapter One").
   Empty chapters (Books 2, 3, 4, and any newly created books) show a faint
   "Chapter One" hint. It behaves like a placeholder: as soon as the user
   clicks and types a chapter name, the hint disappears automatically — the
   user never has to delete it. Applies to both the big heading and the
   rename input field.
   ============================================================ */

/* Faint hint shown in the big chapter heading when no title is set yet. */
.chapter-title-wrap h2.chapter-heading-placeholder {
  color: #9aa7b1 !important;
  font-style: italic !important;
  opacity: .75 !important;
}

/* Styled placeholder inside the chapter rename inputs (chapter view + index). */
.chapter-title-wrap input::placeholder,
.chapter-index-main input::placeholder {
  color: #9aa7b1 !important;
  font-style: italic !important;
  opacity: 1 !important;
}

/* ============================================================
   FIX: Code Sequence container spacing restored.
   After Notes/Details stopped expanding on hover, the guideline row grid
   tightened and the Code Sequence block (Primary / Secondary / Tertiary /
   Others) ended up crowded and flush against the container edge. This block
   restores comfortable, even insets so the sequence fields sit neatly inside
   their panel again — WITHOUT re-introducing any hover growth.
   ============================================================ */

/* Give the sequence panel a small breathing margin from the row edge. */
.ultra-compact-guideline .sequence-panel {
  padding: 5px 6px !important;
  box-sizing: border-box !important;
}

/* The 4-column stack (Primary/Secondary/Tertiary/Others) sits comfortably
   inside the panel with even padding and gaps, not jammed to the edges. */
.ultra-compact-guideline .sequence-panel .sequence-stack,
.sequence-panel .sequence-stack {
  padding: 5px !important;
  gap: 6px !important;
  box-sizing: border-box !important;
  border-radius: 10px !important;
}

/* Each highlight wrap (color line + field) keeps a hair of separation so the
   fields don't touch each other or the panel border. */
.ultra-compact-guideline .sequence-entry-highlight-wrap {
  min-width: 0 !important;
}

/* CURRENT FIX: keep At-a-Glance Color Key menu from being clipped. */
.at-a-glance-board,
.at-a-glance-category-break,
.at-a-glance-break-heading,
.at-a-glance-category-rows,
.ataglance-category-card,
.overview-color-index,
.overview-color-index-section,
.overview-color-index.compact-color-key-row,
.overview-compact-color-key,
.category-color-index.compact-color-key {
  overflow: visible !important;
}

.overview-compact-color-key,
.at-a-glance-break-heading .compact-color-key {
  position: relative !important;
  z-index: 25 !important;
}

.overview-compact-color-key.color-key-open,
.at-a-glance-break-heading .compact-color-key.color-key-open {
  z-index: 20000 !important;
}

.overview-compact-color-key.color-key-open .color-key-editor,
.at-a-glance-break-heading .compact-color-key.color-key-open .color-key-editor {
  display: grid !important;
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: auto !important;
  right: 0 !important;
  z-index: 20001 !important;
  width: max-content !important;
  min-width: 220px !important;
  max-width: min(320px, calc(100vw - 48px)) !important;
  max-height: min(70vh, 420px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
  box-shadow: 0 20px 48px rgba(20,30,40,.28) !important;
}

/* CURRENT FIX: added Details delete buttons stay visible and clickable. */
.detail-box,
.guideline-writing-box.detail-box {
  position: relative !important;
  overflow: visible !important;
}

.detail-box .inline-guideline-details {
  padding-right: 30px !important;
}

.remove-detail-box,
.detail-box:hover .remove-detail-box,
.detail-box:focus-within .remove-detail-box,
.guideline-writing-box.detail-box:hover .remove-detail-box,
.guideline-writing-box.detail-box:focus-within .remove-detail-box {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  top: 4px !important;
  right: 4px !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 1002 !important;
  transform: none !important;
}

/* CURRENT FIX: placeholder styling for book names and New Guideline fields. */
.chapter-title-wrap input[data-action="rename-book"]::placeholder,
.guideline-label-textarea::placeholder {
  color: #8f9aa3 !important;
  font-style: italic !important;
  opacity: 1 !important;
}

/* CURRENT FIX: black-and-white palette for Query / Note / Exception icons. */
.summary-alert.summary-alert-query,
.summary-alert.summary-alert-note,
.summary-alert.summary-alert-exception,
.summary-alert.summary-alert-exception-notice,
.summary-extra-details-container .summary-alert-query,
.summary-extra-details-container .summary-alert-note,
.summary-extra-details-container .summary-alert-exception,
.summary-extra-details-container .summary-alert-exception-notice {
  color: #111111 !important;
  background: #ffffff !important;
  border: 1px solid #111111 !important;
  box-shadow: none !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 950 !important;
}

.icon-option,
.icon-option:hover,
.icon-option:focus-visible {
  color: #111111 !important;
  background: #ffffff !important;
  border-color: #111111 !important;
  box-shadow: none !important;
  filter: grayscale(1) contrast(1.08) !important;
}

.icon-option span {
  color: #111111 !important;
  filter: grayscale(1) contrast(1.2) !important;
}

/* CURRENT FIX: At-a-Glance click zones.
   - Main guideline body jumps to the guideline below.
   - Sequence bubble bar opens Guideline Quick Change.
   - The old green side Go control is removed. */
.tag-title-row.ataglance-row-main-jump,
.tag-title-row.summary-no-marker.ataglance-row-main-jump,
.tag-title-row.summary-marker-outside.ataglance-row-main-jump {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 6px !important;
  align-items: stretch !important;
  padding-left: 6px !important;
  cursor: default !important;
}

.tag-title-row.ataglance-row-main-jump .summary-go {
  display: none !important;
}

.ataglance-main-jump-button {
  grid-column: 1 !important;
  cursor: pointer !important;
  text-align: left !important;
  width: 100% !important;
  min-width: 0 !important;
}

.ataglance-main-jump-button:hover,
.ataglance-main-jump-button:focus-visible {
  background: rgba(248,252,253,.96) !important;
  border-color: rgba(17,17,17,.28) !important;
  box-shadow: inset 4px 0 0 var(--tag-color, #305f72) !important;
}

.ataglance-sequence-quick-change {
  grid-column: 2 !important;
  align-self: stretch !important;
  cursor: pointer !important;
  border: 1px solid rgba(17,17,17,.16) !important;
  background: #ffffff !important;
  min-width: 34px !important;
  padding: 3px 6px !important;
}

.ataglance-sequence-quick-change:hover,
.ataglance-sequence-quick-change:focus-visible {
  border-color: #111111 !important;
  box-shadow: 0 0 0 2px rgba(17,17,17,.12) !important;
}

.ataglance-sequence-quick-change .summary-extra-details-container,
.ataglance-sequence-quick-change .expanded-summary-sequence-code,
.ataglance-sequence-quick-change .summary-sequence-code {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  align-items: center !important;
}

.ataglance-main-jump-button .summary-alert-details-only {
  margin-top: 3px !important;
}

/* CURRENT FIX: At-a-Glance alert icons stack vertically and stay clear of sequence bubbles. */
.ataglance-main-jump-button .summary-alert-details-only,
.ataglance-main-jump-button .summary-alert-details-only .summary-symbol-group {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 3px !important;
  width: max-content !important;
  max-width: 28px !important;
  margin: 4px 0 0 0 !important;
  padding: 0 !important;
}

.ataglance-main-jump-button .summary-alert-details-only .summary-symbol,
.ataglance-main-jump-button .summary-alert-details-only .summary-alert,
.ataglance-main-jump-button .summary-alert-details-only .summary-detail,
.ataglance-main-jump-button .summary-alert-details-only .summary-scenario,
.summary-alert.summary-alert-query,
.summary-alert.summary-alert-note,
.summary-alert.summary-alert-exception,
.summary-alert.summary-alert-exception-notice {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  max-width: 16px !important;
  max-height: 16px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  font-size: .58rem !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

/* CURRENT FIX: give At-a-Glance sequence bubble strip more breathing room. */
.tag-title-row.ataglance-row-main-jump,
.tag-title-row.summary-no-marker.ataglance-row-main-jump,
.tag-title-row.summary-marker-outside.ataglance-row-main-jump {
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto) !important;
  column-gap: 10px !important;
}

.ataglance-sequence-quick-change {
  padding: 5px 10px 5px 14px !important;
  justify-self: end !important;
  min-width: 150px !important;
  max-width: min(430px, 48vw) !important;
  box-sizing: border-box !important;
}

.ataglance-sequence-quick-change .summary-extra-details-container,
.ataglance-sequence-quick-change .summary-sequence-trigger-only,
.ataglance-sequence-quick-change .expanded-summary-sequence-code,
.ataglance-sequence-quick-change .summary-sequence-code {
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 7px !important;
  padding-left: 4px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.ataglance-sequence-quick-change .summary-sequence-text,
.ataglance-sequence-quick-change .summary-sequence-value-only {
  margin-left: 0 !important;
  padding: 4px 8px !important;
  min-height: 22px !important;
  line-height: 1.18 !important;
}

/* CURRENT FIX: hide any remaining tiny add-detail control in guideline cards. */
.tiny-add-detail-box {
  display: none !important;
}

/* CURRENT FIX: final At-a-Glance row cleanup.
   Keep icons horizontal, text natural, and sequence bubbles left-aligned. */
.tag-title-row.ataglance-row-main-jump,
.tag-title-row.summary-no-marker.ataglance-row-main-jump,
.tag-title-row.summary-marker-outside.ataglance-row-main-jump {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  gap: 5px !important;
  align-items: start !important;
  justify-items: stretch !important;
  padding: 6px 7px !important;
}

.ataglance-main-jump-button {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-areas: "title icons" !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 5px 7px !important;
  text-align: left !important;
  box-sizing: border-box !important;
}

.ataglance-main-jump-button .ataglance-guideline-title-only,
.ataglance-main-jump-button .summary-tag-title-text {
  grid-area: title !important;
  min-width: 0 !important;
  width: 100% !important;
  text-align: left !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

.ataglance-main-jump-button .summary-alert-details-only,
.ataglance-main-jump-button .summary-alert-details-only .summary-symbol-group {
  grid-area: icons !important;
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ataglance-main-jump-button .summary-alert-details-only .summary-symbol,
.ataglance-main-jump-button .summary-alert-details-only .summary-alert,
.ataglance-main-jump-button .summary-alert-details-only .summary-detail,
.ataglance-main-jump-button .summary-alert-details-only .summary-scenario,
.summary-alert.summary-alert-query,
.summary-alert.summary-alert-note,
.summary-alert.summary-alert-exception,
.summary-alert.summary-alert-exception-notice {
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  min-height: 15px !important;
  max-width: 15px !important;
  max-height: 15px !important;
  font-size: .56rem !important;
  line-height: 1 !important;
  padding: 0 !important;
}

.ataglance-sequence-quick-change {
  grid-column: 1 !important;
  grid-row: 2 !important;
  justify-self: start !important;
  align-self: start !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 0 0 7px !important;
  padding: 4px 8px !important;
  box-sizing: border-box !important;
}

.ataglance-sequence-quick-change .summary-extra-details-container,
.ataglance-sequence-quick-change .summary-sequence-trigger-only,
.ataglance-sequence-quick-change .expanded-summary-sequence-code,
.ataglance-sequence-quick-change .summary-sequence-code {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 5px !important;
  width: auto !important;
  max-width: 100% !important;
  padding-left: 0 !important;
  margin: 0 !important;
}

.ataglance-sequence-quick-change .summary-sequence-text,
.ataglance-sequence-quick-change .summary-sequence-value-only {
  padding: 3px 7px !important;
  min-height: 20px !important;
  margin: 0 !important;
  line-height: 1.12 !important;
}

/* FINAL FIX: At-a-Glance collision guard.
   Reserve separate space for the tag color bar, guideline title, horizontal icons,
   and sequence bubbles so none of those elements sit on top of each other. */
.ataglance-redesign-panel .tag-title-row.ataglance-row-main-jump,
.ataglance-redesign-panel .tag-title-row.summary-no-marker.ataglance-row-main-jump,
.ataglance-redesign-panel .tag-title-row.summary-marker-outside.ataglance-row-main-jump {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  row-gap: 6px !important;
  column-gap: 0 !important;
  align-items: start !important;
  justify-items: stretch !important;
  padding: 8px 10px 8px 24px !important;
  min-width: 0 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

.ataglance-redesign-panel .tag-title-row.ataglance-row-main-jump::before,
.ataglance-redesign-panel .tag-title-row.summary-no-marker.ataglance-row-main-jump::before,
.ataglance-redesign-panel .tag-title-row.summary-marker-outside.ataglance-row-main-jump::before {
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  top: 9px !important;
  bottom: 9px !important;
  width: 4px !important;
  border-radius: 999px !important;
  background: var(--tag-color, #38bdf8) !important;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.08) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.ataglance-redesign-panel .ataglance-main-jump-button,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button {
  position: relative !important;
  z-index: 1 !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  grid-template-areas: "title icons" !important;
  align-items: start !important;
  justify-content: stretch !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 5px 6px !important;
  text-align: left !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.ataglance-redesign-panel .ataglance-main-jump-button .ataglance-guideline-title-only,
.ataglance-redesign-panel .ataglance-main-jump-button .summary-tag-title-text,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .ataglance-guideline-title-only,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-tag-title-text {
  position: static !important;
  grid-area: title !important;
  display: block !important;
  min-width: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  line-height: 1.25 !important;
}

.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only,
.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-symbol-group,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-alert-details-only,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-alert-details-only .summary-symbol-group {
  position: static !important;
  grid-area: icons !important;
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  width: max-content !important;
  min-width: max-content !important;
  max-width: max-content !important;
  margin: 1px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-symbol,
.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-alert,
.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-detail,
.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-scenario {
  position: static !important;
  flex: 0 0 15px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  min-height: 15px !important;
  max-width: 15px !important;
  max-height: 15px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

.ataglance-redesign-panel .ataglance-sequence-quick-change,
.tag-title-row.ataglance-row-main-jump .ataglance-sequence-quick-change {
  position: relative !important;
  z-index: 1 !important;
  grid-column: 1 !important;
  grid-row: 2 !important;
  justify-self: start !important;
  align-self: start !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: calc(100% - 6px) !important;
  margin: 0 0 0 6px !important;
  padding: 4px 8px !important;
  text-align: left !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.ataglance-redesign-panel .ataglance-sequence-quick-change .summary-extra-details-container,
.ataglance-redesign-panel .ataglance-sequence-quick-change .summary-sequence-trigger-only,
.ataglance-redesign-panel .ataglance-sequence-quick-change .expanded-summary-sequence-code,
.ataglance-redesign-panel .ataglance-sequence-quick-change .summary-sequence-code {
  position: static !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

/* Book deletion / zero-book library support */
.empty-index-note {
  color: #6b7280 !important;
  font-size: .82rem !important;
  font-style: italic !important;
  padding: 10px 8px !important;
}

.empty-book-card {
  border-style: dashed !important;
  background: linear-gradient(180deg, #ffffff, #f8fbfc) !important;
}

button.danger,
button.ghost.danger {
  color: #9f1239 !important;
  border-color: rgba(159,18,57,.32) !important;
}

button.danger:hover,
button.ghost.danger:hover,
button.danger:focus-visible,
button.ghost.danger:focus-visible {
  color: #881337 !important;
  border-color: rgba(159,18,57,.55) !important;
  background: rgba(255,241,242,.92) !important;
}

/* Compact book list and slim text-action controls */
.toolbar {
  gap: 6px !important;
}

.toolbar button,
.chapter-actions.compact-book-actions button,
.text-action {
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #305f72 !important;
  box-shadow: none !important;
  padding: 3px 7px !important;
  min-height: 0 !important;
  font-size: .84rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  transform: none !important;
}

.toolbar button:hover,
.toolbar button:focus-visible,
.chapter-actions.compact-book-actions button:hover,
.chapter-actions.compact-book-actions button:focus-visible,
.text-action:hover,
.text-action:focus-visible {
  background: rgba(48,95,114,.08) !important;
  color: #173d4b !important;
  box-shadow: none !important;
  transform: none !important;
  text-decoration: underline !important;
}

.toolbar .utility-link-action,
.toolbar button.ghost,
.toolbar button.secondary {
  border: 0 !important;
  background: transparent !important;
}

.compact-book-actions,
.chapter-actions.compact-book-actions {
  gap: 4px !important;
  align-items: center !important;
}

.book-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  gap: 10px !important;
  align-items: start !important;
  padding: 14px 16px !important;
}

.book-card-main {
  min-width: 0 !important;
}

.book-card-actions {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  white-space: nowrap !important;
}

.book-card-actions .text-action {
  font-size: .78rem !important;
  padding: 2px 5px !important;
}

.danger-text,
button.danger-text,
.book-card-actions .danger-text {
  color: #9f1239 !important;
}

.danger-text:hover,
button.danger-text:hover,
.danger-text:focus-visible,
button.danger-text:focus-visible {
  color: #881337 !important;
  background: rgba(255,241,242,.95) !important;
}

.chapter-title-wrap input[data-action="rename-book"]::placeholder {
  color: #8f9aa3 !important;
  font-style: italic !important;
  opacity: 1 !important;
}

/* FINAL FIX: At-a-Glance title-attached alert icons + accessible Quick Change helpers.
   Keep Exception / Query / Note icons next to the guideline title instead of in a far-right lane,
   and make Quick Change helper text subtle but visible. */
.ataglance-redesign-panel .ataglance-main-jump-button,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  align-content: flex-start !important;
  gap: 3px 7px !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  justify-self: start !important;
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  grid-auto-flow: row !important;
  padding: 5px 7px !important;
  text-align: left !important;
}

.ataglance-redesign-panel .ataglance-main-jump-button .ataglance-guideline-title-only,
.ataglance-redesign-panel .ataglance-main-jump-button .summary-tag-title-text,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .ataglance-guideline-title-only,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-tag-title-text {
  display: inline !important;
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  grid-area: auto !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  line-height: 1.25 !important;
}

.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-alert-details-only {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  grid-area: auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 0 0 2px !important;
  padding: 0 !important;
  vertical-align: baseline !important;
  align-self: center !important;
}

.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-symbol-group,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-alert-details-only .summary-symbol-group {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 3px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-symbol,
.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-alert,
.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-detail,
.ataglance-redesign-panel .ataglance-main-jump-button .summary-alert-details-only .summary-scenario,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-alert-details-only .summary-symbol,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-alert-details-only .summary-alert,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-alert-details-only .summary-detail,
.tag-title-row.ataglance-row-main-jump .ataglance-main-jump-button .summary-alert-details-only .summary-scenario {
  width: 17px !important;
  height: 17px !important;
  min-width: 17px !important;
  min-height: 17px !important;
  font-size: .67rem !important;
  line-height: 1 !important;
}

.ataglance-full-guideline-editor .ataglance-inline-details-head > div {
  display: grid !important;
  gap: 2px !important;
}

.ataglance-full-guideline-editor .ataglance-quick-change-hint {
  display: block !important;
  color: #5f7480 !important;
  font-size: .73rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.28 !important;
  margin-top: 1px !important;
  max-width: 62ch !important;
  text-transform: none !important;
}

.ataglance-full-guideline-editor .ataglance-full-field input::placeholder,
.ataglance-full-guideline-editor .ataglance-full-field textarea::placeholder,
.ataglance-full-guideline-editor .ataglance-sequence-field input::placeholder,
.ataglance-full-guideline-editor .ataglance-sequence-field textarea::placeholder,
.ataglance-full-guideline-editor .ataglance-detail-textarea::placeholder {
  color: #647782 !important;
  opacity: 1 !important;
  font-style: italic !important;
  font-weight: 600 !important;
}

.ataglance-full-guideline-editor .ataglance-full-field input:placeholder-shown,
.ataglance-full-guideline-editor .ataglance-full-field textarea:placeholder-shown,
.ataglance-full-guideline-editor .ataglance-detail-textarea:placeholder-shown {
  background: linear-gradient(180deg, #fffefa, #f8fcfd) !important;
  border-color: rgba(48,95,114,.28) !important;
}

.ataglance-full-guideline-editor .ataglance-full-field:focus-within,
.ataglance-full-guideline-editor .ataglance-detail-edit-box:focus-within {
  border-color: rgba(48,95,114,.48) !important;
  box-shadow: 0 0 0 2px rgba(48,95,114,.10) !important;
}

/* FINAL DISTRIBUTION UPDATE: no-key access + bottom copyright notice. */
.app-shell {
  min-height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
}

.app-shell .layout {
  flex: 1 1 auto !important;
}

.app-copyright {
  flex: 0 0 auto !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px 8px !important;
  margin: 8px auto 0 !important;
  padding: 8px 14px 10px !important;
  width: min(100%, 1180px) !important;
  color: #607884 !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
  line-height: 1.25 !important;
  text-align: center !important;
  border-top: 1px solid rgba(48,95,114,.12) !important;
}

.app-copyright-divider {
  color: rgba(48,95,114,.42) !important;
}

body.license-locked {
  overflow: auto !important;
}

body.license-locked .app-shell {
  filter: none !important;
  pointer-events: auto !important;
  user-select: auto !important;
}

body.license-locked .license-modal,
.license-modal.open {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

@media print {
  .app-copyright {
    color: #4b5563 !important;
    border-top: 1px solid #d1d5db !important;
    page-break-inside: avoid !important;
  }
}

/* FINAL LEGAL TERMS UPDATE: built-in EULA / disclaimer access. */
.terms-card {
  width: min(920px, calc(100vw - 28px)) !important;
  max-height: min(86vh, 860px) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.terms-head {
  display: flex !important;
  align-items: start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  border-bottom: 1px solid rgba(48,95,114,.14) !important;
  padding-bottom: 8px !important;
}

.terms-head h2 {
  margin: 1px 0 0 !important;
}

.terms-body {
  overflow: auto !important;
  padding: 2px 8px 2px 2px !important;
  color: #20313a !important;
  font-size: .88rem !important;
  line-height: 1.48 !important;
}

.terms-body h3 {
  margin: 14px 0 5px !important;
  color: #244f63 !important;
  font-size: .84rem !important;
  font-weight: 950 !important;
  letter-spacing: .045em !important;
  text-transform: uppercase !important;
}

.terms-body p {
  margin: 0 0 9px !important;
}

.footer-terms-link {
  border: 0 !important;
  background: transparent !important;
  color: #305f72 !important;
  font: inherit !important;
  font-weight: 900 !important;
  padding: 0 2px !important;
  text-decoration: underline !important;
  cursor: pointer !important;
}

.footer-terms-link:hover,
.footer-terms-link:focus-visible {
  color: #173d4b !important;
  outline: 2px solid rgba(48,95,114,.22) !important;
  outline-offset: 2px !important;
}

.app-legal-short {
  flex-basis: 100% !important;
  color: #6b7f88 !important;
  font-size: .68rem !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  max-width: 980px !important;
}

@media print {
  .terms-card {
    max-height: none !important;
    width: 100% !important;
  }
  .terms-body {
    overflow: visible !important;
    color: #111827 !important;
  }
}

/* Repeatable Guideline Details, Scenarios, Sequence entries, and Modifier controls. */
.repeatable-text-fieldset,
.repeatable-sequence-stack,
.modifier-panel {
  width: 100%;
}
.multi-detail-heading,
.sequence-repeat-heading,
.manual-modifier-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: #24586b;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.02em;
}
.tiny-add,
.tiny-delete {
  appearance: none;
  border: 0;
  background: transparent;
  color: #24586b;
  font-weight: 900;
  font-size: 17px;
  line-height: 1;
  padding: 1px 4px;
  cursor: pointer;
  border-radius: 4px;
}
.tiny-add:hover,
.tiny-add:focus {
  background: rgba(49, 151, 168, 0.12);
  color: #123947;
}
.tiny-delete {
  color: #9b2d30;
  font-size: 15px;
}
.tiny-delete:hover,
.tiny-delete:focus {
  background: rgba(185, 45, 50, 0.10);
}
.repeatable-text-box {
  position: relative;
  display: block;
  margin: 5px 0 8px;
}
.repeatable-text-box textarea,
.sequence-repeat-entry textarea,
.manual-modifier-row input {
  width: 100%;
  min-height: 38px;
  resize: none;
  overflow: hidden;
}
.inline-box-delete {
  position: absolute;
  top: 4px;
  right: 5px;
  z-index: 2;
}
.mini-text-toolbar {
  display: flex;
  gap: 4px;
  margin: 3px 0 4px;
}
.mini-format {
  border: 0;
  background: transparent;
  color: #24586b;
  border-radius: 0;
  min-width: 0;
  height: auto;
  padding: 0;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.mini-format.active,
.mini-format:hover,
.mini-format:focus {
  background: transparent;
  color: #123947;
}
.mini-format.active {
  text-decoration: underline;
  font-weight: 900;
}
.is-bold { font-weight: 800 !important; }
.is-italic { font-style: italic !important; }
.is-underline { text-decoration: underline !important; }
.is-highlighted-textbox {
  background: var(--field-highlight, #fff09a) !important;
}
.repeatable-sequence-stack {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.sequence-repeat-group {
  min-width: 0;
}
.sequence-repeat-entry {
  position: relative;
  margin-top: 5px;
  padding-right: 18px;
}
.sequence-repeat-entry .tiny-delete {
  position: absolute;
  top: 2px;
  right: 0;
}
.modifier-note-panel {
  display: block !important;
}
.guideline-note-label {
  display: block;
  width: 100%;
}
.modifier-panel {
  margin-top: 9px;
  padding: 10px;
  border: 1px solid rgba(36, 88, 107, 0.14);
  border-radius: 10px;
  background: rgba(247, 251, 252, 0.88);
}
.modifier-heading,
.manual-modifier-heading {
  margin-bottom: 6px;
}
.modifier-checkbox-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(58px, 1fr));
  gap: 5px 8px;
  margin-bottom: 9px;
}
.modifier-check {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 800;
  color: #24586b;
}
.manual-modifier-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 5px;
  align-items: center;
  margin-top: 5px;
}
.summary-alert-modifier {
  background: #6d5bd0 !important;
  color: #fff !important;
}
@media (max-width: 1100px) {
  .repeatable-sequence-stack { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .repeatable-sequence-stack { grid-template-columns: 1fr; }
}


/* Restored Guideline Card detail/scenario layout. */
.guideline-detail-scenario-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
  width: 100% !important;
}
.guideline-detail-scenario-grid .repeatable-text-fieldset {
  min-width: 0 !important;
  width: 100% !important;
}
.guideline-detail-scenario-grid .detail-repeat-fieldset {
  grid-column: 1 / -1 !important;
}
.guideline-detail-scenario-grid .scenario-repeat-fieldset {
  grid-column: 1 / -1 !important;
}
.tiny-add,
.tiny-delete,
.inline-box-delete {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  pointer-events: auto !important;
}
.tiny-add {
  color: #24586b !important;
}
.tiny-delete {
  color: #9b2d30 !important;
}
.summary-modifier-values {
  display: inline-flex !important;
  align-items: center !important;
  margin-left: 3px !important;
  padding: 1px 5px !important;
  border-radius: 999px !important;
  background: rgba(109, 91, 208, 0.12) !important;
  color: #443399 !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1.4 !important;
}
.single-manual-modifier-row {
  display: block !important;
}
.single-manual-modifier-row input {
  width: 100% !important;
}
@media (max-width: 900px) {
  .guideline-detail-scenario-grid {
    grid-template-columns: 1fr !important;
  }
  .guideline-detail-scenario-grid .detail-repeat-fieldset,
  .guideline-detail-scenario-grid .scenario-repeat-fieldset {
    grid-column: 1 !important;
  }
}


/* Plain, readable repeat controls for Detail, Scenario, and Other rows. */
.plain-repeat-controls .multi-detail-heading,
.plain-repeat-controls .sequence-repeat-heading {
  align-items: center !important;
  gap: 6px !important;
}
.plain-add-row,
.plain-delete-row {
  appearance: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 2px !important;
  margin: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  color: #365868 !important;
  font: 700 11px/1.25 Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  cursor: pointer !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}
.plain-add-row:hover,
.plain-add-row:focus,
.plain-delete-row:hover,
.plain-delete-row:focus {
  background: transparent !important;
  color: #111827 !important;
  outline: 1px dotted currentColor !important;
  outline-offset: 2px !important;
}
.plain-delete-row {
  color: #8a2d2d !important;
  font-weight: 700 !important;
}
.plain-repeat-box {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 6px 0 10px !important;
  display: block !important;
  position: relative !important;
}
.plain-row-label {
  display: block !important;
  margin: 0 0 2px !important;
  color: #667085 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.plain-repeat-box .mini-text-toolbar {
  margin: 0 0 3px !important;
  opacity: 0.72 !important;
}
.plain-repeat-box .mini-format {
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 3px !important;
  border-radius: 2px !important;
  font-size: 10px !important;
  line-height: 16px !important;
  background: #fff !important;
  color: #344054 !important;
  border: 1px solid #d0d5dd !important;
  box-shadow: none !important;
}
.plain-repeat-box textarea,
.plain-sequence-entry textarea {
  padding-right: 8px !important;
}
.plain-repeat-box .inline-box-delete {
  position: static !important;
  display: inline-block !important;
  margin-top: 2px !important;
  z-index: auto !important;
}
.plain-sequence-entry {
  padding-right: 0 !important;
  padding-bottom: 2px !important;
  margin-top: 6px !important;
}
.plain-sequence-entry .plain-delete-row {
  position: static !important;
  display: inline-block !important;
  margin-top: 2px !important;
}
.plain-sequence-entry .sequence-entry-color-line {
  width: 3px !important;
  opacity: 0.55 !important;
}
.sequence-repeat-group .plain-add-row {
  white-space: nowrap !important;
}


/* Exact simple no-dazzle controls for Details and Others. */
.simple-plus-add,
.simple-x-delete {
  appearance: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 3px !important;
  margin: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: auto !important;
  height: auto !important;
  color: #111 !important;
  font: 800 13px/1 Arial, sans-serif !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
.simple-plus-add:hover,
.simple-plus-add:focus,
.simple-x-delete:hover,
.simple-x-delete:focus {
  background: transparent !important;
  color: #000 !important;
  outline: 1px dotted #111 !important;
  outline-offset: 1px !important;
}
.simple-detail-heading {
  justify-content: flex-start !important;
  gap: 4px !important;
  color: #111 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}
.simple-detail-heading span::after {
  content: '' !important;
}
.simple-repeat-box {
  position: relative !important;
  display: block !important;
  margin: 5px 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.simple-box-line {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 4px !important;
  align-items: start !important;
}
.simple-box-line textarea {
  min-width: 0 !important;
}
.simple-box-line .simple-x-delete,
.simple-sequence-entry .simple-x-delete {
  align-self: start !important;
  margin-top: 5px !important;
}
.simple-sequence-controls .sequence-repeat-heading {
  justify-content: flex-start !important;
  color: #111 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}
.simple-sequence-controls .sequence-repeat-heading .plain-add-row,
.simple-sequence-controls .sequence-repeat-heading .tiny-add {
  display: none !important;
}
.simple-sequence-entry {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 4px !important;
  padding-right: 0 !important;
  margin-top: 5px !important;
}
.simple-sequence-entry .sequence-entry-color-line {
  position: absolute !important;
  left: -4px !important;
  top: 3px !important;
  width: 2px !important;
  height: calc(100% - 6px) !important;
  opacity: 0.45 !important;
}
.simple-sequence-entry textarea {
  grid-column: 1 !important;
  min-width: 0 !important;
}
.simple-sequence-entry .simple-x-delete {
  grid-column: 2 !important;
}
.other-plus-add {
  display: inline-block !important;
  margin: 2px 0 0 2px !important;
  font-size: 14px !important;
  line-height: 1 !important;
}
.others-repeat-group .other-plus-add + .other-plus-add {
  display: none !important;
}
.simple-detail-controls .plain-add-row,
.simple-detail-controls .plain-delete-row {
  display: none !important;
}
.simple-detail-controls .simple-plus-add,
.simple-detail-controls .simple-x-delete,
.simple-sequence-controls .simple-plus-add,
.simple-sequence-controls .simple-x-delete {
  display: inline-block !important;
}

/* Bigger black-and-white At-a-Glance summary icons. */
.summary-symbol,
.summary-detail,
.summary-scenario,
.summary-alert,
.summary-alert-note,
.summary-alert-query,
.summary-alert-exception,
.summary-alert-modifier,
.summary-alert-cross-reference {
  color: #000 !important;
  background: #fff !important;
  border: 1px solid #000 !important;
  box-shadow: none !important;
  filter: grayscale(1) contrast(1.15) !important;
}
.summary-symbol.summary-detail,
.summary-symbol.summary-scenario,
.summary-extra-details-container .summary-symbol.summary-detail,
.summary-extra-details-container .summary-symbol.summary-scenario,
.summary-extra-details-container .summary-detail,
.summary-extra-details-container .summary-scenario {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  font-size: 17px !important;
  line-height: 20px !important;
  color: #000 !important;
  background: #fff !important;
  border: 1px solid #000 !important;
}
.summary-symbol-group {
  gap: 4px !important;
}

/* Final no-dazzle guideline card cleanup: plain words, stable rows, simple + / X. */
.guideline-item .mini-text-toolbar.plain-word-toolbar,
.guideline-card .mini-text-toolbar.plain-word-toolbar,
.repeatable-text-fieldset .mini-text-toolbar.plain-word-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  align-items: center !important;
  padding: 0 0 4px !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.guideline-item .mini-format.plain-word-format,
.guideline-card .mini-format.plain-word-format,
.repeatable-text-fieldset .mini-format.plain-word-format {
  appearance: none !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 4px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #111 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  transform: none !important;
  transition: none !important;
  font: 700 12px/1.25 Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  text-transform: none !important;
}

.guideline-item .mini-format.plain-word-format:hover,
.guideline-item .mini-format.plain-word-format:focus,
.guideline-card .mini-format.plain-word-format:hover,
.guideline-card .mini-format.plain-word-format:focus,
.repeatable-text-fieldset .mini-format.plain-word-format:hover,
.repeatable-text-fieldset .mini-format.plain-word-format:focus {
  background: transparent !important;
  color: #000 !important;
  box-shadow: none !important;
  transform: none !important;
  outline: 1px dotted #111 !important;
  outline-offset: 1px !important;
}

.guideline-item .mini-format.plain-word-format.active,
.guideline-card .mini-format.plain-word-format.active,
.repeatable-text-fieldset .mini-format.plain-word-format.active {
  background: transparent !important;
  color: #000 !important;
  box-shadow: none !important;
  text-decoration: underline !important;
}

.no-sequence-titles .sequence-repeat-heading,
.simple-sequence-controls.no-sequence-titles .sequence-repeat-heading {
  display: none !important;
}

.guideline-item .sequence-repeat-group,
.guideline-card .sequence-repeat-group,
.sequence-panel .sequence-repeat-group {
  margin: 0 0 5px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.guideline-item .sequence-repeat-entry.simple-sequence-entry,
.guideline-card .sequence-repeat-entry.simple-sequence-entry,
.sequence-panel .sequence-repeat-entry.simple-sequence-entry {
  display: flex !important;
  align-items: flex-start !important;
  gap: 4px !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
}

.guideline-item .sequence-stack-input,
.guideline-item .sequence-stack-input:hover,
.guideline-item .sequence-stack-input:focus,
.guideline-card .sequence-stack-input,
.guideline-card .sequence-stack-input:hover,
.guideline-card .sequence-stack-input:focus,
.sequence-panel .sequence-stack-input,
.sequence-panel .sequence-stack-input:hover,
.sequence-panel .sequence-stack-input:focus,
.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack-input:hover,
.ultra-compact-guideline .sequence-stack-input:focus {
  transform: none !important;
  transition: none !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 6px 7px !important;
  margin: 0 !important;
  border: 1px solid rgba(31, 41, 51, .28) !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #111827 !important;
  box-shadow: none !important;
  outline-offset: 1px !important;
}

.guideline-item .sequence-stack-input:focus,
.guideline-card .sequence-stack-input:focus,
.sequence-panel .sequence-stack-input:focus,
.ultra-compact-guideline .sequence-stack-input:focus {
  outline: 1px solid #111 !important;
  border-color: #111 !important;
}

.guideline-item .simple-plus-add,
.guideline-item .simple-x-delete,
.guideline-card .simple-plus-add,
.guideline-card .simple-x-delete,
.sequence-panel .simple-plus-add,
.sequence-panel .simple-x-delete,
.repeatable-text-fieldset .simple-plus-add,
.repeatable-text-fieldset .simple-x-delete {
  appearance: none !important;
  display: inline-block !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 3px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #111 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
  transition: none !important;
  font: 800 13px/1 Arial, sans-serif !important;
  text-decoration: none !important;
  text-transform: none !important;
  cursor: pointer !important;
}

.guideline-item .simple-plus-add:hover,
.guideline-item .simple-plus-add:focus,
.guideline-item .simple-x-delete:hover,
.guideline-item .simple-x-delete:focus,
.guideline-card .simple-plus-add:hover,
.guideline-card .simple-plus-add:focus,
.guideline-card .simple-x-delete:hover,
.guideline-card .simple-x-delete:focus,
.sequence-panel .simple-plus-add:hover,
.sequence-panel .simple-plus-add:focus,
.sequence-panel .simple-x-delete:hover,
.sequence-panel .simple-x-delete:focus,
.repeatable-text-fieldset .simple-plus-add:hover,
.repeatable-text-fieldset .simple-plus-add:focus,
.repeatable-text-fieldset .simple-x-delete:hover,
.repeatable-text-fieldset .simple-x-delete:focus {
  background: transparent !important;
  color: #000 !important;
  box-shadow: none !important;
  transform: none !important;
  outline: 1px dotted #111 !important;
  outline-offset: 1px !important;
}

.sequence-panel .other-plus-add,
.guideline-item .other-plus-add,
.guideline-card .other-plus-add {
  display: inline-block !important;
  align-self: flex-start !important;
  margin: 0 0 2px 18px !important;
}

.guideline-item button:hover,
.guideline-item button:focus,
.guideline-card button:hover,
.guideline-card button:focus,
.repeatable-text-fieldset button:hover,
.repeatable-text-fieldset button:focus,
.sequence-panel button:hover,
.sequence-panel button:focus {
  transform: none !important;
  box-shadow: none !important;
}

/* VERSION 10: working yellow Detail/Scenario highlight, readable Add Note, and no page-jump focus styling. */
.inline-guideline-detail.is-highlighted-textbox,
.inline-guideline-details.is-highlighted-textbox,
.inline-guideline-scenario.is-highlighted-textbox,
.guideline-detail.is-highlighted-textbox,
.guideline-scenario.is-highlighted-textbox,
textarea.is-highlighted-textbox {
  background: var(--field-highlight, #fff09a) !important;
  background-color: var(--field-highlight, #fff09a) !important;
  box-shadow: inset 0 0 0 1px rgba(177, 131, 0, .35) !important;
}

.guideline-item .guideline-subnote-writing-stack,
.guideline-card .guideline-subnote-writing-stack,
.ultra-compact-guideline > .guideline-subnote-writing-stack,
.compact-guideline.ultra-compact-guideline > .guideline-subnote-writing-stack,
.guideline-item.ultra-compact-guideline > .guideline-subnote-writing-stack {
  width: 100% !important;
  max-width: none !important;
  display: block !important;
  grid-column: 1 / -1 !important;
  margin-top: 8px !important;
  padding: 0 !important;
  overflow: visible !important;
}

.guideline-item .guideline-tag-note-field,
.guideline-card .guideline-tag-note-field,
.guideline-item .modifier-note-panel,
.guideline-card .modifier-note-panel,
.ultra-compact-guideline .guideline-tag-note-field,
.ultra-compact-guideline .modifier-note-panel {
  width: 100% !important;
  max-width: none !important;
  display: block !important;
  margin: 8px 0 0 !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  background: #fff !important;
  border: 1px solid rgba(31, 41, 51, .22) !important;
  border-radius: 6px !important;
  overflow: visible !important;
}

.guideline-item .guideline-note-label,
.guideline-card .guideline-note-label,
.ultra-compact-guideline .guideline-note-label {
  width: 100% !important;
  max-width: none !important;
  display: block !important;
}

.guideline-item .guideline-tag-note,
.guideline-item .guideline-tag-note.textarea-default-collapsed,
.guideline-item .guideline-tag-note:hover,
.guideline-item .guideline-tag-note:focus,
.guideline-card .guideline-tag-note,
.guideline-card .guideline-tag-note.textarea-default-collapsed,
.guideline-card .guideline-tag-note:hover,
.guideline-card .guideline-tag-note:focus,
.ultra-compact-guideline .guideline-tag-note,
.ultra-compact-guideline .guideline-tag-note.textarea-default-collapsed,
.ultra-compact-guideline .guideline-tag-note:hover,
.ultra-compact-guideline .guideline-tag-note:focus {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 96px !important;
  max-height: none !important;
  display: block !important;
  box-sizing: border-box !important;
  white-space: pre-wrap !important;
  overflow-wrap: break-word !important;
  overflow-y: auto !important;
  resize: vertical !important;
  margin: 4px 0 0 !important;
  padding: 8px !important;
  transform: none !important;
  transition: none !important;
  background: #fffdfa !important;
  color: #111827 !important;
  border: 1px solid rgba(31, 41, 51, .28) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}

.guideline-item .sequence-stack-input,
.guideline-item .sequence-stack-input:hover,
.guideline-item .sequence-stack-input:focus,
.guideline-item .subnote-toggle,
.guideline-item .subnote-toggle:hover,
.guideline-item .subnote-toggle:focus-within,
.guideline-item .plain-word-format,
.guideline-item .plain-word-format:hover,
.guideline-item .plain-word-format:focus,
.sequence-panel .sequence-stack-input,
.sequence-panel .sequence-stack-input:hover,
.sequence-panel .sequence-stack-input:focus,
.sequence-panel .subnote-toggle,
.sequence-panel .subnote-toggle:hover,
.sequence-panel .subnote-toggle:focus-within,
.sequence-panel .plain-word-format,
.sequence-panel .plain-word-format:hover,
.sequence-panel .plain-word-format:focus {
  scroll-margin: 0 !important;
  transform: none !important;
  transition: none !important;
}

/* VERSION 11: one steady behavior for every guideline/card text box. No bounce, no hover resize, no click jump. */
.guideline-item textarea,
.guideline-item [contenteditable="true"].guideline-rich-textbox,
.guideline-card textarea,
.guideline-card [contenteditable="true"].guideline-rich-textbox,
.sequence-panel textarea,
.sequence-panel [contenteditable="true"].guideline-rich-textbox,
.repeatable-text-fieldset textarea,
.repeatable-text-fieldset [contenteditable="true"].guideline-rich-textbox,
.ultra-compact-guideline textarea,
.ultra-compact-guideline [contenteditable="true"].guideline-rich-textbox,
.guideline-item textarea:hover,
.guideline-item textarea:focus,
.guideline-item [contenteditable="true"].guideline-rich-textbox:hover,
.guideline-item [contenteditable="true"].guideline-rich-textbox:focus,
.guideline-card textarea:hover,
.guideline-card textarea:focus,
.guideline-card [contenteditable="true"].guideline-rich-textbox:hover,
.guideline-card [contenteditable="true"].guideline-rich-textbox:focus,
.sequence-panel textarea:hover,
.sequence-panel textarea:focus,
.sequence-panel [contenteditable="true"].guideline-rich-textbox:hover,
.sequence-panel [contenteditable="true"].guideline-rich-textbox:focus,
.repeatable-text-fieldset textarea:hover,
.repeatable-text-fieldset textarea:focus,
.repeatable-text-fieldset [contenteditable="true"].guideline-rich-textbox:hover,
.repeatable-text-fieldset [contenteditable="true"].guideline-rich-textbox:focus,
.ultra-compact-guideline textarea:hover,
.ultra-compact-guideline textarea:focus,
.ultra-compact-guideline [contenteditable="true"].guideline-rich-textbox:hover,
.ultra-compact-guideline [contenteditable="true"].guideline-rich-textbox:focus {
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  transition: border-color .12s ease, background-color .12s ease, outline-color .12s ease !important;
  animation: none !important;
  top: auto !important;
  left: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  box-shadow: none !important;
  scroll-margin: 0 !important;
}

.guideline-item .sequence-stack-input,
.guideline-item .sequence-stack-input:hover,
.guideline-item .sequence-stack-input:focus,
.sequence-panel .sequence-stack-input,
.sequence-panel .sequence-stack-input:hover,
.sequence-panel .sequence-stack-input:focus,
.ultra-compact-guideline .sequence-stack-input,
.ultra-compact-guideline .sequence-stack-input:hover,
.ultra-compact-guideline .sequence-stack-input:focus {
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  overflow-y: auto !important;
  resize: none !important;
  line-height: 1.35 !important;
  padding: 6px 7px !important;
  border-width: 1px !important;
  box-sizing: border-box !important;
}

.guideline-item .guideline-label-textarea,
.guideline-item .guideline-label-textarea:hover,
.guideline-item .guideline-label-textarea:focus,
.guideline-item .inline-guideline-details,
.guideline-item .inline-guideline-details:hover,
.guideline-item .inline-guideline-details:focus,
.guideline-item .inline-guideline-scenario,
.guideline-item .inline-guideline-scenario:hover,
.guideline-item .inline-guideline-scenario:focus,
.guideline-item .guideline-cross-reference,
.guideline-item .guideline-cross-reference:hover,
.guideline-item .guideline-cross-reference:focus,
.guideline-item .sequence-sub-entry,
.guideline-item .sequence-sub-entry:hover,
.guideline-item .sequence-sub-entry:focus {
  min-height: 38px !important;
  max-height: 140px !important;
  overflow-y: auto !important;
  resize: vertical !important;
  line-height: 1.35 !important;
  padding: 7px 8px !important;
  border-width: 1px !important;
  box-sizing: border-box !important;
}

.guideline-rich-textbox {
  width: 100% !important;
  min-height: 38px !important;
  max-height: 140px !important;
  overflow-y: auto !important;
  white-space: pre-wrap !important;
  overflow-wrap: break-word !important;
  background: #fff !important;
  color: #111827 !important;
  border: 1px solid rgba(31, 41, 51, .28) !important;
  border-radius: 4px !important;
  outline: none !important;
  cursor: text !important;
}

.guideline-rich-textbox:empty::before {
  content: attr(data-placeholder);
  color: #6b7280;
  pointer-events: none;
}

.guideline-rich-textbox:focus,
.guideline-rich-textbox:hover,
.sequence-stack-input:focus,
.sequence-stack-input:hover {
  background: #fffdfa !important;
  border-color: #111 !important;
  outline: 1px solid #111 !important;
  outline-offset: 1px !important;
}

/* V20: only real highlights are yellow. Spans whose background was
   cleared (transparent) are NOT repainted — highlight removal works. */
.guideline-rich-textbox mark,
.guideline-rich-textbox span[style*="background-color"]:not([style*="transparent"]):not([style*="rgba(0, 0, 0, 0)"]),
.guideline-rich-textbox .selected-detail-highlight {
  background-color: #fff09a !important;
  color: inherit !important;
  padding: 0 .02em !important;
}
.guideline-rich-textbox mark[style*="transparent"],
.guideline-rich-textbox span[style*="transparent"] {
  background-color: transparent !important;
  padding: 0 !important;
}

.guideline-item:hover,
.guideline-card:hover,
.sequence-repeat-entry:hover,
.sequence-entry-highlight-wrap:hover,
.simple-sequence-entry:hover {
  transform: none !important;
  translate: none !important;
  animation: none !important;
}


/* VERSION 13: clean card area, larger Details/Scenario editors, plain controls, slim steady sequence inputs. */
.guideline-item .repeatable-text-fieldset,
.guideline-card .repeatable-text-fieldset,
.ultra-compact-guideline .repeatable-text-fieldset,
.guideline-item .simple-detail-controls,
.guideline-card .simple-detail-controls,
.ultra-compact-guideline .simple-detail-controls {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 4px 0 !important;
  margin: 6px 0 !important;
  border-radius: 0 !important;
}

.guideline-item .simple-detail-heading,
.guideline-card .simple-detail-heading,
.ultra-compact-guideline .simple-detail-heading {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #111827 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  padding: 0 0 4px !important;
  margin: 0 !important;
  min-height: 0 !important;
}

.guideline-item .simple-plus-add,
.guideline-card .simple-plus-add,
.ultra-compact-guideline .simple-plus-add,
.guideline-item .simple-plus-add:hover,
.guideline-card .simple-plus-add:hover,
.ultra-compact-guideline .simple-plus-add:hover,
.guideline-item .simple-plus-add:focus,
.guideline-card .simple-plus-add:focus,
.ultra-compact-guideline .simple-plus-add:focus {
  appearance: none !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #111827 !important;
  display: inline !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 0 2px !important;
  margin: 0 0 0 6px !important;
  transform: none !important;
  translate: none !important;
  transition: none !important;
}

.guideline-item .mini-text-toolbar,
.guideline-card .mini-text-toolbar,
.ultra-compact-guideline .mini-text-toolbar,
.guideline-item .plain-word-toolbar,
.guideline-card .plain-word-toolbar,
.ultra-compact-guideline .plain-word-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 0 4px !important;
  margin: 0 !important;
  min-height: 0 !important;
}

.guideline-item .mini-format,
.guideline-card .mini-format,
.ultra-compact-guideline .mini-format,
.guideline-item .plain-word-format,
.guideline-card .plain-word-format,
.ultra-compact-guideline .plain-word-format,
.guideline-item .mini-format:hover,
.guideline-card .mini-format:hover,
.ultra-compact-guideline .mini-format:hover,
.guideline-item .plain-word-format:hover,
.guideline-card .plain-word-format:hover,
.ultra-compact-guideline .plain-word-format:hover,
.guideline-item .mini-format:focus,
.guideline-card .mini-format:focus,
.ultra-compact-guideline .mini-format:focus,
.guideline-item .plain-word-format:focus,
.guideline-card .plain-word-format:focus,
.ultra-compact-guideline .plain-word-format:focus {
  appearance: none !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #111827 !important;
  cursor: pointer !important;
  display: inline !important;
  font: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  outline: none !important;
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  transition: color .12s ease !important;
}

.guideline-item .mini-format.active,
.guideline-card .mini-format.active,
.ultra-compact-guideline .mini-format.active,
.guideline-item .plain-word-format.active,
.guideline-card .plain-word-format.active,
.ultra-compact-guideline .plain-word-format.active {
  color: #000 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

.guideline-item .repeatable-text-box,
.guideline-card .repeatable-text-box,
.ultra-compact-guideline .repeatable-text-box,
.guideline-item .simple-repeat-box,
.guideline-card .simple-repeat-box,
.ultra-compact-guideline .simple-repeat-box,
.guideline-item .simple-box-line,
.guideline-card .simple-box-line,
.ultra-compact-guideline .simple-box-line {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 8px !important;
  transform: none !important;
  transition: none !important;
}

.guideline-item .guideline-rich-textbox,
.guideline-card .guideline-rich-textbox,
.ultra-compact-guideline .guideline-rich-textbox,
.guideline-item .guideline-rich-textbox:hover,
.guideline-card .guideline-rich-textbox:hover,
.ultra-compact-guideline .guideline-rich-textbox:hover,
.guideline-item .guideline-rich-textbox:focus,
.guideline-card .guideline-rich-textbox:focus,
.ultra-compact-guideline .guideline-rich-textbox:focus {
  width: 100% !important;
  min-height: 112px !important;
  height: 112px !important;
  max-height: 220px !important;
  overflow-y: auto !important;
  resize: vertical !important;
  box-sizing: border-box !important;
  padding: 8px 9px !important;
  line-height: 1.35 !important;
  background: #fff !important;
  background-image: none !important;
  color: #111827 !important;
  border: 1px solid rgba(31, 41, 51, .32) !important;
  border-radius: 4px !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  transition: border-color .12s ease, background-color .12s ease !important;
}

.guideline-item .guideline-rich-textbox:hover,
.guideline-card .guideline-rich-textbox:hover,
.ultra-compact-guideline .guideline-rich-textbox:hover,
.guideline-item .guideline-rich-textbox:focus,
.guideline-card .guideline-rich-textbox:focus,
.ultra-compact-guideline .guideline-rich-textbox:focus {
  background: #fff !important;
  border-color: #111827 !important;
  outline: 1px solid #111827 !important;
  outline-offset: 1px !important;
}

.guideline-item .sequence-entry-highlight-wrap,
.guideline-card .sequence-entry-highlight-wrap,
.sequence-panel .sequence-entry-highlight-wrap,
.ultra-compact-guideline .sequence-entry-highlight-wrap,
.guideline-item .sequence-entry-highlight-wrap:hover,
.guideline-card .sequence-entry-highlight-wrap:hover,
.sequence-panel .sequence-entry-highlight-wrap:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap:hover,
.guideline-item .sequence-entry-highlight-wrap:focus-within,
.guideline-card .sequence-entry-highlight-wrap:focus-within,
.sequence-panel .sequence-entry-highlight-wrap:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap:focus-within {
  display: grid !important;
  grid-template-columns: 8px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 4px !important;
  min-height: 24px !important;
  height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  margin: 1px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: var(--sequence-entry-highlight, transparent) !important;
  background-image: none !important;
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  transition: none !important;
  overflow: visible !important;
}

.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight,
.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight:hover,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight:hover,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight:hover,
.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight:focus-within,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight:focus-within,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight:focus-within {
  background: var(--sequence-entry-highlight, #fff09a) !important;
  background-color: var(--sequence-entry-highlight, #fff09a) !important;
}

.guideline-item .sequence-entry-color-line,
.guideline-card .sequence-entry-color-line,
.sequence-panel .sequence-entry-color-line,
.ultra-compact-guideline .sequence-entry-color-line,
.guideline-item .sequence-entry-color-line:hover,
.guideline-card .sequence-entry-color-line:hover,
.sequence-panel .sequence-entry-color-line:hover,
.ultra-compact-guideline .sequence-entry-color-line:hover,
.guideline-item .sequence-entry-color-line:focus,
.guideline-card .sequence-entry-color-line:focus,
.sequence-panel .sequence-entry-color-line:focus,
.ultra-compact-guideline .sequence-entry-color-line:focus {
  width: 8px !important;
  min-width: 8px !important;
  max-width: 8px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 2px !important;
  background: var(--sequence-entry-highlight, rgba(31, 41, 51, .18)) !important;
  box-shadow: inset 0 0 0 1px rgba(31, 41, 51, .18) !important;
  transform: none !important;
  transition: none !important;
}

.guideline-item textarea.sequence-stack-input,
.guideline-card textarea.sequence-stack-input,
.sequence-panel textarea.sequence-stack-input,
.ultra-compact-guideline textarea.sequence-stack-input,
.guideline-item textarea.sequence-stack-input:hover,
.guideline-card textarea.sequence-stack-input:hover,
.sequence-panel textarea.sequence-stack-input:hover,
.ultra-compact-guideline textarea.sequence-stack-input:hover,
.guideline-item textarea.sequence-stack-input:focus,
.guideline-card textarea.sequence-stack-input:focus,
.sequence-panel textarea.sequence-stack-input:focus,
.ultra-compact-guideline textarea.sequence-stack-input:focus,
.guideline-item textarea.sequence-stack-input.sequence-others-textarea,
.guideline-card textarea.sequence-stack-input.sequence-others-textarea,
.sequence-panel textarea.sequence-stack-input.sequence-others-textarea,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea,
.guideline-item textarea.sequence-stack-input.sequence-others-textarea:hover,
.guideline-card textarea.sequence-stack-input.sequence-others-textarea:hover,
.sequence-panel textarea.sequence-stack-input.sequence-others-textarea:hover,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea:hover,
.guideline-item textarea.sequence-stack-input.sequence-others-textarea:focus,
.guideline-card textarea.sequence-stack-input.sequence-others-textarea:focus,
.sequence-panel textarea.sequence-stack-input.sequence-others-textarea:focus,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea:focus {
  width: 100% !important;
  min-width: 0 !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  padding: 2px 5px !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  font-size: 12px !important;
  overflow: hidden !important;
  resize: none !important;
  box-sizing: border-box !important;
  background: rgba(255, 255, 255, .72) !important;
  background-image: none !important;
  color: #111827 !important;
  border: 1px solid rgba(31, 41, 51, .24) !important;
  border-radius: 3px !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  top: auto !important;
  left: auto !important;
  transition: border-color .1s ease, background-color .1s ease !important;
}

.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input,
.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight:hover textarea.sequence-stack-input,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight:hover textarea.sequence-stack-input,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight:hover textarea.sequence-stack-input,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight:hover textarea.sequence-stack-input,
.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight:focus-within textarea.sequence-stack-input,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight:focus-within textarea.sequence-stack-input,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight:focus-within textarea.sequence-stack-input,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight:focus-within textarea.sequence-stack-input {
  background: color-mix(in srgb, var(--sequence-entry-highlight, #fff09a) 32%, #fff 68%) !important;
  background-color: color-mix(in srgb, var(--sequence-entry-highlight, #fff09a) 32%, #fff 68%) !important;
}

.guideline-item textarea.sequence-stack-input:hover,
.guideline-card textarea.sequence-stack-input:hover,
.sequence-panel textarea.sequence-stack-input:hover,
.ultra-compact-guideline textarea.sequence-stack-input:hover,
.guideline-item textarea.sequence-stack-input:focus,
.guideline-card textarea.sequence-stack-input:focus,
.sequence-panel textarea.sequence-stack-input:focus,
.ultra-compact-guideline textarea.sequence-stack-input:focus {
  border-color: #111827 !important;
  outline: 1px solid #111827 !important;
  outline-offset: 0 !important;
}

/* ============================================================
   VERSION 14 FINAL FIXES — this block is last in the file so it
   wins every cascade battle. Do not add rules after this block.
   ============================================================ */

/* 1) SEQUENCE ENTRIES: completely steady. Fixed 3-column grid:
      [color line] [textarea] [delete X]. The highlight palette is
      absolutely positioned so opening it NEVER reflows the row. */
.guideline-item .sequence-entry-highlight-wrap,
.guideline-card .sequence-entry-highlight-wrap,
.sequence-panel .sequence-entry-highlight-wrap,
.ultra-compact-guideline .sequence-entry-highlight-wrap,
.guideline-item .sequence-entry-highlight-wrap:hover,
.guideline-card .sequence-entry-highlight-wrap:hover,
.sequence-panel .sequence-entry-highlight-wrap:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap:hover,
.guideline-item .sequence-entry-highlight-wrap:focus-within,
.guideline-card .sequence-entry-highlight-wrap:focus-within,
.sequence-panel .sequence-entry-highlight-wrap:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap:focus-within,
.simple-sequence-entry,
.simple-sequence-entry:hover,
.simple-sequence-entry:focus-within {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 8px minmax(0, 1fr) 18px !important;
  grid-template-rows: 24px !important;
  grid-auto-rows: 0 !important;
  align-items: center !important;
  gap: 4px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  margin: 2px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  animation: none !important;
  transition: none !important;
  overflow: visible !important;
}

/* Parents must not clip the absolute palette. */
.sequence-stack,
.sequence-repeat-group,
.others-repeat-group,
.sequence-panel,
.simple-sequence-controls {
  overflow: visible !important;
}

/* Color line: stationary, column 1. */
.guideline-item .sequence-entry-color-line,
.guideline-card .sequence-entry-color-line,
.sequence-panel .sequence-entry-color-line,
.ultra-compact-guideline .sequence-entry-color-line,
.simple-sequence-entry .sequence-entry-color-line,
.guideline-item .sequence-entry-color-line:hover,
.guideline-card .sequence-entry-color-line:hover,
.sequence-panel .sequence-entry-color-line:hover,
.ultra-compact-guideline .sequence-entry-color-line:hover,
.simple-sequence-entry .sequence-entry-color-line:hover,
.guideline-item .sequence-entry-color-line:focus,
.guideline-card .sequence-entry-color-line:focus,
.sequence-panel .sequence-entry-color-line:focus,
.ultra-compact-guideline .sequence-entry-color-line:focus,
.simple-sequence-entry .sequence-entry-color-line:focus {
  position: static !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 8px !important;
  min-width: 8px !important;
  max-width: 8px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 2px !important;
  opacity: 1 !important;
  background: var(--sequence-entry-highlight, rgba(31, 41, 51, .18)) !important;
  box-shadow: inset 0 0 0 1px rgba(31, 41, 51, .22) !important;
  cursor: pointer !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
}

/* Textarea: fixed slim size, column 2, never grows or moves. */
.guideline-item textarea.sequence-stack-input,
.guideline-card textarea.sequence-stack-input,
.sequence-panel textarea.sequence-stack-input,
.ultra-compact-guideline textarea.sequence-stack-input,
.guideline-item textarea.sequence-stack-input:hover,
.guideline-card textarea.sequence-stack-input:hover,
.sequence-panel textarea.sequence-stack-input:hover,
.ultra-compact-guideline textarea.sequence-stack-input:hover,
.guideline-item textarea.sequence-stack-input:focus,
.guideline-card textarea.sequence-stack-input:focus,
.sequence-panel textarea.sequence-stack-input:focus,
.ultra-compact-guideline textarea.sequence-stack-input:focus {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  padding: 2px 6px !important;
  margin: 0 !important;
  line-height: 18px !important;
  font-size: 12px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  resize: none !important;
  box-sizing: border-box !important;
  background: #fff !important;
  background-image: none !important;
  color: #111827 !important;
  border: 1px solid rgba(31, 41, 51, .28) !important;
  border-radius: 3px !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  animation: none !important;
  transition: none !important;
  outline: none !important;
}
.guideline-item textarea.sequence-stack-input:focus,
.guideline-card textarea.sequence-stack-input:focus,
.sequence-panel textarea.sequence-stack-input:focus,
.ultra-compact-guideline textarea.sequence-stack-input:focus {
  border-color: #111827 !important;
  outline: 1px solid #111827 !important;
  outline-offset: 0 !important;
}

/* Highlighted rows keep their tint at all times, including hover. */
.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input,
.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input:hover,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input:hover,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input:hover,
.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input:focus,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input:focus,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input:focus,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight textarea.sequence-stack-input:focus {
  background: color-mix(in srgb, var(--sequence-entry-highlight, #fff09a) 38%, #fff 62%) !important;
  background-color: color-mix(in srgb, var(--sequence-entry-highlight, #fff09a) 38%, #fff 62%) !important;
}

/* 2) DELETE OTHER "X": pinned to column 3, always in the same
      place, always clickable. It never wraps or chases. */
.guideline-item .other-x-delete,
.guideline-card .other-x-delete,
.sequence-panel .other-x-delete,
.ultra-compact-guideline .other-x-delete,
.simple-sequence-entry .other-x-delete,
.guideline-item .other-x-delete:hover,
.guideline-card .other-x-delete:hover,
.sequence-panel .other-x-delete:hover,
.ultra-compact-guideline .other-x-delete:hover,
.simple-sequence-entry .other-x-delete:hover,
.guideline-item .other-x-delete:focus,
.guideline-card .other-x-delete:focus,
.sequence-panel .other-x-delete:focus,
.ultra-compact-guideline .other-x-delete:focus,
.simple-sequence-entry .other-x-delete:focus {
  position: static !important;
  grid-column: 3 !important;
  grid-row: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #111 !important;
  font: 800 13px/1 Arial, sans-serif !important;
  box-shadow: none !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
  cursor: pointer !important;
  z-index: 5 !important;
  pointer-events: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.guideline-item .other-x-delete:hover,
.guideline-card .other-x-delete:hover,
.sequence-panel .other-x-delete:hover,
.ultra-compact-guideline .other-x-delete:hover {
  color: #b00020 !important;
  outline: 1px dotted #111 !important;
  outline-offset: 1px !important;
}

/* 3) HIGHLIGHT PALETTE: absolutely positioned popover on top of
      everything — solid white, fully opaque, clearly selectable.
      Because it is absolute, opening it never moves the row. */
.sequence-entry-highlight-palette {
  display: none !important;
  position: absolute !important;
  left: 12px !important;
  top: 25px !important;
  z-index: 2147483000 !important;
  width: 184px !important;
  min-width: 184px !important;
  max-width: 184px !important;
  grid-template-columns: repeat(8, 18px) !important;
  gap: 4px !important;
  padding: 7px !important;
  box-sizing: border-box !important;
  border: 1px solid #111827 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  opacity: 1 !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .35) !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
  pointer-events: auto !important;
  visibility: visible !important;
}
.sequence-entry-highlight-wrap.show-sequence-entry-palette .sequence-entry-highlight-palette {
  display: grid !important;
}
/* Row showing its palette floats above sibling rows. */
.sequence-entry-highlight-wrap.show-sequence-entry-palette {
  z-index: 2147482999 !important;
}
.sequence-entry-highlight-swatch,
.sequence-entry-highlight-clear,
.sequence-entry-highlight-swatch:hover,
.sequence-entry-highlight-clear:hover {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  max-width: 18px !important;
  max-height: 18px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 1px solid rgba(15, 23, 42, .35) !important;
  border-radius: 4px !important;
  background: var(--sequence-swatch, #ffffff) !important;
  opacity: 1 !important;
  cursor: pointer !important;
  transform: none !important;
  transition: none !important;
  box-shadow: none !important;
}
.sequence-entry-highlight-swatch.selected,
.sequence-entry-highlight-clear.selected {
  outline: 2px solid #111827 !important;
  outline-offset: 1px !important;
}
.sequence-entry-highlight-clear {
  color: #111827 !important;
  font: 800 12px/1 Arial, sans-serif !important;
}

/* 4) BOLD / ITALIC / UNDERLINE: plain static words. No glass, no
      border, no background, no movement — ever. Like the + button. */
.mini-format,
.plain-word-format,
.mini-format:hover,
.plain-word-format:hover,
.mini-format:focus,
.plain-word-format:focus,
.mini-format:active,
.plain-word-format:active,
.mini-format.active,
.plain-word-format.active,
.guideline-item .mini-format,
.guideline-card .mini-format,
.ultra-compact-guideline .mini-format,
.repeatable-text-fieldset .mini-format,
.guideline-item .mini-format:hover,
.guideline-card .mini-format:hover,
.ultra-compact-guideline .mini-format:hover,
.repeatable-text-fieldset .mini-format:hover,
.guideline-item .mini-format:focus,
.guideline-card .mini-format:focus,
.ultra-compact-guideline .mini-format:focus,
.repeatable-text-fieldset .mini-format:focus,
.guideline-item .mini-format:active,
.guideline-card .mini-format:active,
.ultra-compact-guideline .mini-format:active,
.repeatable-text-fieldset .mini-format:active {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  color: #111827 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  outline: none !important;
  font: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  animation: none !important;
  transition: none !important;
  cursor: pointer !important;
}
.mini-format.active,
.plain-word-format.active,
.guideline-item .mini-format.active,
.guideline-card .mini-format.active,
.ultra-compact-guideline .mini-format.active,
.repeatable-text-fieldset .mini-format.active {
  color: #000 !important;
  font-weight: 900 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}
.mini-text-toolbar,
.plain-word-toolbar,
.mini-text-toolbar:hover,
.plain-word-toolbar:hover {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 0 3px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
}

/* 5) DETAILS & SCENARIO: full page width, stacked like Notes. */
.guideline-detail-scenario-grid {
  display: block !important;
  width: 100% !important;
}
.guideline-detail-scenario-grid .repeatable-text-fieldset,
.guideline-detail-scenario-grid .detail-repeat-fieldset,
.guideline-detail-scenario-grid .scenario-repeat-fieldset {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  grid-column: auto !important;
  margin: 8px 0 !important;
}
.guideline-detail-scenario-grid .guideline-rich-textbox,
.guideline-item .guideline-rich-textbox,
.guideline-card .guideline-rich-textbox,
.ultra-compact-guideline .guideline-rich-textbox {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
.guideline-detail-scenario-grid .simple-box-line {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 4px !important;
  width: 100% !important;
  align-items: start !important;
}

/* 6) COMMON MODIFIERS: collapsible panel opened by its checkbox. */
.subnote-toggle.common-modifiers-toggle {
  white-space: nowrap !important;
}
.modifier-panel.modifier-collapsible-panel {
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 8px 0 0 !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(31, 41, 51, .22) !important;
  border-radius: 6px !important;
  background: #fff !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.modifier-collapsible-panel .modifier-heading {
  color: #111827 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  margin: 0 0 6px !important;
}
.modifier-collapsible-panel .modifier-checkbox-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(58px, 1fr)) !important;
  gap: 3px 8px !important;
}
.modifier-collapsible-panel .modifier-check {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 12px !important;
  color: #111827 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 1px 0 !important;
  transform: none !important;
  transition: none !important;
}
.modifier-collapsible-panel .manual-modifier-list {
  margin-top: 8px !important;
}
.modifier-collapsible-panel .single-manual-modifier-row input {
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 4px 6px !important;
  border: 1px solid rgba(31, 41, 51, .28) !important;
  border-radius: 4px !important;
  background: #fff !important;
  font-size: 12px !important;
}

/* 7) FINAL ANTI-BOUNCE LOCK: nothing inside the sequence area may
      move, grow, animate, or transition for any reason. */
.sequence-panel *,
.sequence-panel *:hover,
.sequence-panel *:focus,
.sequence-panel *:focus-within {
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  animation: none !important;
  transition: none !important;
}

/* SPECIFICITY LOCK: beat older (0,3,0) flex rules on sequence rows. */
.guideline-item .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry,
.guideline-card .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry,
.sequence-panel .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry,
.ultra-compact-guideline .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry,
.guideline-item .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry:hover,
.guideline-card .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry:hover,
.sequence-panel .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry:hover,
.guideline-item .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry:focus-within,
.guideline-card .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry:focus-within,
.sequence-panel .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap.sequence-repeat-entry.simple-sequence-entry:focus-within {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 8px minmax(0, 1fr) 18px !important;
  grid-template-rows: 24px !important;
  grid-auto-rows: 0 !important;
  align-items: center !important;
  gap: 4px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
  margin: 2px 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
  overflow: visible !important;
}

/* Color line stays static inside the higher-specificity row too. */
.guideline-item .simple-sequence-entry .sequence-entry-color-line,
.guideline-card .simple-sequence-entry .sequence-entry-color-line,
.sequence-panel .simple-sequence-entry .sequence-entry-color-line,
.ultra-compact-guideline .simple-sequence-entry .sequence-entry-color-line {
  position: static !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 8px !important;
  min-width: 8px !important;
  max-width: 8px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  opacity: 1 !important;
  left: auto !important;
  top: auto !important;
}

/* Delete X stays in column 3 inside the higher-specificity row too. */
.guideline-item .simple-sequence-entry .simple-x-delete.other-x-delete,
.guideline-card .simple-sequence-entry .simple-x-delete.other-x-delete,
.sequence-panel .simple-sequence-entry .simple-x-delete.other-x-delete,
.ultra-compact-guideline .simple-sequence-entry .simple-x-delete.other-x-delete {
  position: static !important;
  grid-column: 3 !important;
  grid-row: 1 !important;
}

/* Textarea stays in column 2 inside the higher-specificity row too. */
.guideline-item .simple-sequence-entry textarea.sequence-stack-input,
.guideline-card .simple-sequence-entry textarea.sequence-stack-input,
.sequence-panel .simple-sequence-entry textarea.sequence-stack-input,
.ultra-compact-guideline .simple-sequence-entry textarea.sequence-stack-input {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

/* ============================================================
   VERSION 15 FIXES — final block, wins all cascade battles.
   1) Highlight palette behaves like the Tab color menu: floats
      above ALL content, never sits behind text containers, never
      cut off. Opens upward for bottom "Other" rows.
   2) Details and Scenario stretch fully across the Guideline
      Card, sitting under the New Guideline text area.
   ============================================================ */

/* --- 1) HIGHLIGHT PALETTE: top layer popover ---------------- */

/* No ancestor may clip the popover. */
.guideline-item,
.guideline-item.ultra-compact-guideline,
.compact-guideline.ultra-compact-guideline,
.guideline-writing-stack,
.guideline-subnote-writing-stack,
.sequence-panel,
.sequence-stack,
.sequence-repeat-group,
.others-repeat-group,
.simple-sequence-controls,
.category,
.category-stack {
  overflow: visible !important;
}

/* The row with an open palette rises above every sibling row and
   every text container — same layering trick as the tab menu. */
.sequence-entry-highlight-wrap.show-sequence-entry-palette {
  position: relative !important;
  z-index: 2147483200 !important;
}
/* Lift the whole ancestor chain of the open palette above
   neighbouring guideline cards and panels. */
.sequence-repeat-group:has(.show-sequence-entry-palette),
.sequence-stack:has(.show-sequence-entry-palette),
.sequence-panel:has(.show-sequence-entry-palette),
.guideline-item:has(.show-sequence-entry-palette),
.category:has(.show-sequence-entry-palette) {
  position: relative !important;
  z-index: 2147483100 !important;
  overflow: visible !important;
}

/* Palette box itself: solid white card above everything. */
.sequence-entry-highlight-palette {
  display: none !important;
  position: absolute !important;
  left: 12px !important;
  right: auto !important;
  top: calc(100% + 3px) !important;
  bottom: auto !important;
  z-index: 2147483300 !important;
  width: 184px !important;
  min-width: 184px !important;
  max-width: 184px !important;
  grid-template-columns: repeat(8, 18px) !important;
  gap: 4px !important;
  padding: 7px !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(48, 95, 114, 0.35) !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  opacity: 1 !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 18px 44px rgba(20, 30, 40, 0.30) !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
  pointer-events: auto !important;
  visibility: visible !important;
}
.sequence-entry-highlight-wrap.show-sequence-entry-palette .sequence-entry-highlight-palette {
  display: grid !important;
}

/* Bottom rows: open the menu UPWARD so it is never cut off. */
.sequence-entry-highlight-wrap.palette-open-up .sequence-entry-highlight-palette {
  top: auto !important;
  bottom: calc(100% + 3px) !important;
}

/* --- 2) DETAILS & SCENARIO: full width under New Guideline --- */

/* Writing stack becomes a single full-width column:
   [ New Guideline text area ]
   [ Details — full width     ]
   [ Scenario — full width    ] */
.ultra-compact-guideline > .guideline-writing-stack,
.compact-guideline.ultra-compact-guideline > .guideline-writing-stack,
.guideline-item.ultra-compact-guideline > .guideline-writing-stack,
.guideline-item > .guideline-writing-stack {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-rows: auto !important;
  gap: 6px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

/* Every direct child of the writing stack spans the full width. */
.guideline-item .guideline-writing-stack > * {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* The Details + Scenario container: stacked, full width. */
.guideline-detail-scenario-grid {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.guideline-detail-scenario-grid .repeatable-text-fieldset,
.guideline-detail-scenario-grid .detail-repeat-fieldset,
.guideline-detail-scenario-grid .scenario-repeat-fieldset {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  grid-column: auto !important;
  margin: 8px 0 !important;
}

/* Full-size editors stretched across the card. */
.guideline-item .guideline-rich-textbox,
.guideline-card .guideline-rich-textbox,
.ultra-compact-guideline .guideline-rich-textbox {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 128px !important;
  height: auto !important;
  max-height: 320px !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
}

/* Keep the [textbox][X] line full width. */
.guideline-detail-scenario-grid .simple-box-line {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 4px !important;
  width: 100% !important;
  align-items: start !important;
}

/* ============================================================
   VERSION 15.1 FIX — "+" (Add another Other row) collision.
   The highlight menu drops down at the LEFT edge below the row,
   which is exactly where the + button used to sit. Move the +
   to the RIGHT side of the Others group, clear of the palette,
   and hide it while a highlight menu is open in that group.
   ============================================================ */

.sequence-panel .other-plus-add,
.guideline-item .other-plus-add,
.guideline-card .other-plus-add,
.ultra-compact-guideline .other-plus-add,
.others-repeat-group .other-plus-add,
.sequence-panel .other-plus-add:hover,
.guideline-item .other-plus-add:hover,
.guideline-card .other-plus-add:hover,
.ultra-compact-guideline .other-plus-add:hover,
.others-repeat-group .other-plus-add:hover,
.sequence-panel .other-plus-add:focus,
.guideline-item .other-plus-add:focus,
.guideline-card .other-plus-add:focus,
.ultra-compact-guideline .other-plus-add:focus,
.others-repeat-group .other-plus-add:focus {
  display: block !important;
  width: max-content !important;
  min-width: 0 !important;
  margin: 3px 0 0 auto !important;   /* push to the right edge */
  padding: 0 4px !important;
  text-align: right !important;
  align-self: flex-end !important;
  justify-self: end !important;
  float: none !important;
  position: static !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
}

/* While a highlight menu is open in the Others group, take the +
   out of play entirely so the menu can never collide with it. */
.others-repeat-group:has(.show-sequence-entry-palette) .other-plus-add {
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ============================================================
   VERSION 16 FIXES (no build yet)
   1) Remove ALL "glass" and "shimmer" effects inside Guideline
      cards — no shimmer sweeps, no gradient washes, no blur
      glass, no glow tints, no hover lift inside the cards.
   2) "+" Add-Other button renamed to "Add" (JS) — style as a
      plain word.
   ============================================================ */

/* Kill the shimmer sweep overlay on every button inside the cards. */
.category button::after,
.guideline-item button::after,
.guideline-card button::after,
.ultra-compact-guideline button::after,
.sequence-panel button::after,
.category button::before,
.guideline-item button::before,
.guideline-card button::before,
.ultra-compact-guideline button::before,
.sequence-panel button::before {
  content: none !important;
  display: none !important;
  animation: none !important;
  transition: none !important;
}

/* Buttons inside the cards: flat, no gradient, no glass, no glow.
   EXCLUDES color controls (color line, swatches, tab strip) and the
   plain-word controls, which keep their own colors/transparency. */
.category button:not(.ghost):not(.secondary):not(.small):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.tag-strip-swatch),
.guideline-item button:not(.ghost):not(.secondary):not(.small):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.tag-strip-swatch),
.guideline-card button:not(.ghost):not(.secondary):not(.small):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.tag-strip-swatch),
.ultra-compact-guideline button:not(.ghost):not(.secondary):not(.small):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.tag-strip-swatch),
.sequence-panel button:not(.ghost):not(.secondary):not(.small):not(.sequence-entry-color-line):not(.sequence-entry-highlight-swatch):not(.sequence-entry-highlight-clear):not(.tag-color-strip):not(.mini-format):not(.plain-word-format):not(.simple-plus-add):not(.simple-x-delete):not(.other-plus-add):not(.other-x-delete):not(.compact-delete):not(.tag-strip-swatch) {
  background: #ffffff !important;
  background-image: none !important;
  overflow: visible !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Plain-word controls stay transparent (Add, X, Bold/Italic/Underline,
   color line, swatches keep their own colors). */
.guideline-item .simple-plus-add,
.guideline-item .other-plus-add,
.guideline-item .simple-x-delete,
.guideline-item .mini-format,
.guideline-card .simple-plus-add,
.guideline-card .other-plus-add,
.guideline-card .simple-x-delete,
.guideline-card .mini-format,
.sequence-panel .simple-plus-add,
.sequence-panel .other-plus-add,
.sequence-panel .simple-x-delete,
.ultra-compact-guideline .simple-plus-add,
.ultra-compact-guideline .other-plus-add,
.ultra-compact-guideline .simple-x-delete,
.ultra-compact-guideline .mini-format {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
.guideline-item .sequence-entry-color-line,
.guideline-card .sequence-entry-color-line,
.sequence-panel .sequence-entry-color-line,
.ultra-compact-guideline .sequence-entry-color-line {
  background: var(--sequence-entry-highlight, rgba(31, 41, 51, .18)) !important;
}
.guideline-item .sequence-entry-highlight-swatch,
.sequence-panel .sequence-entry-highlight-swatch {
  background: var(--sequence-swatch, #ffffff) !important;
}
.guideline-item .tag-color-strip,
.ultra-compact-guideline .tag-color-strip {
  background: var(--tag-color, #24586b) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* No glass blur or gradient wash anywhere inside the cards. */
.guideline-item,
.guideline-item *,
.guideline-card,
.guideline-card *,
.ultra-compact-guideline,
.ultra-compact-guideline *,
.sequence-panel,
.sequence-panel * {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Cards themselves: crisp flat white, no hover lift, no glow. */
.guideline-item,
.guideline-item:hover,
.guideline-card,
.guideline-card:hover,
.ultra-compact-guideline,
.ultra-compact-guideline:hover {
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
}

/* Category (main section) cards: flat, steady, no hover lift/glow,
   no gradient accent spine. */
.category,
.category:hover {
  background: #ffffff !important;
  background-image: none !important;
  box-shadow: 0 1px 3px rgba(24, 42, 66, .10) !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
}
.category::before,
.category::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

/* Sequence panel: flat too. */
.sequence-panel,
.sequence-panel:hover {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* "Add" plain word button under Others. */
.sequence-panel .other-plus-add,
.guideline-item .other-plus-add,
.guideline-card .other-plus-add,
.ultra-compact-guideline .other-plus-add,
.others-repeat-group .other-plus-add,
.sequence-panel .other-plus-add:hover,
.guideline-item .other-plus-add:hover,
.guideline-card .other-plus-add:hover,
.ultra-compact-guideline .other-plus-add:hover,
.others-repeat-group .other-plus-add:hover,
.sequence-panel .other-plus-add:focus,
.guideline-item .other-plus-add:focus,
.guideline-card .other-plus-add:focus,
.ultra-compact-guideline .other-plus-add:focus,
.others-repeat-group .other-plus-add:focus {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #111827 !important;
  font: 700 12px/1.2 Arial, sans-serif !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
.sequence-panel .other-plus-add:hover,
.guideline-item .other-plus-add:hover {
  text-decoration: underline !important;
  color: #000 !important;
}

/* ============================================================
   VERSION 16.1 FIXES (no build yet)
   1) Guideline delete: plain red text, no button chrome.
   2) Details/Scenario "seizure": collapsed boxes were expanding
      on hover, changing the box edge under the cursor and
      flickering in a loop. Boxes now hold ONE steady size in
      every state — collapsed, hover, focus.
   3) No hover expansion on Details/Scenario, ever.
   ============================================================ */

/* --- 1) DELETE AS PLAIN RED TEXT --------------------------- */
.guideline-item .compact-delete,
.guideline-card .compact-delete,
.ultra-compact-guideline .compact-delete,
.guideline-item .compact-delete:hover,
.guideline-card .compact-delete:hover,
.ultra-compact-guideline .compact-delete:hover,
.guideline-item .compact-delete:focus,
.guideline-card .compact-delete:focus,
.ultra-compact-guideline .compact-delete:focus,
.guideline-item button.small.danger.compact-delete,
.guideline-item button.small.danger.compact-delete:hover,
.guideline-item button.small.danger.compact-delete:focus {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 0 3px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  color: #c62828 !important;
  font: 800 14px/1 Arial, sans-serif !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  outline: none !important;
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
  cursor: pointer !important;
}
.guideline-item .compact-delete:hover,
.guideline-card .compact-delete:hover,
.ultra-compact-guideline .compact-delete:hover {
  color: #8e0000 !important;
  text-decoration: underline !important;
}

/* --- 2) + 3) DETAILS/SCENARIO: ONE STEADY SIZE --------------
   (V16.1 block — superseded by VERSION 19 block at end of file:
   boxes now show 2 rows minimum and grow with the text.) */
.guideline-item .guideline-rich-textbox,
.guideline-card .guideline-rich-textbox,
.ultra-compact-guideline .guideline-rich-textbox,
.repeatable-text-fieldset .guideline-rich-textbox,
.guideline-item .guideline-rich-textbox:hover,
.guideline-card .guideline-rich-textbox:hover,
.ultra-compact-guideline .guideline-rich-textbox:hover,
.repeatable-text-fieldset .guideline-rich-textbox:hover,
.guideline-item .guideline-rich-textbox:focus,
.guideline-card .guideline-rich-textbox:focus,
.ultra-compact-guideline .guideline-rich-textbox:focus,
.repeatable-text-fieldset .guideline-rich-textbox:focus,
.guideline-item .guideline-rich-textbox.textarea-default-collapsed,
.guideline-card .guideline-rich-textbox.textarea-default-collapsed,
.ultra-compact-guideline .guideline-rich-textbox.textarea-default-collapsed,
.repeatable-text-fieldset .guideline-rich-textbox.textarea-default-collapsed,
.guideline-item .guideline-rich-textbox.textarea-default-collapsed:hover,
.guideline-card .guideline-rich-textbox.textarea-default-collapsed:hover,
.ultra-compact-guideline .guideline-rich-textbox.textarea-default-collapsed:hover,
.repeatable-text-fieldset .guideline-rich-textbox.textarea-default-collapsed:hover,
.guideline-item .guideline-rich-textbox.textarea-default-collapsed:focus,
.guideline-card .guideline-rich-textbox.textarea-default-collapsed:focus,
.ultra-compact-guideline .guideline-rich-textbox.textarea-default-collapsed:focus,
.repeatable-text-fieldset .guideline-rich-textbox.textarea-default-collapsed:focus,
.guideline-item .guideline-rich-textbox.textarea-default-expanded,
.guideline-card .guideline-rich-textbox.textarea-default-expanded,
.ultra-compact-guideline .guideline-rich-textbox.textarea-default-expanded,
.repeatable-text-fieldset .guideline-rich-textbox.textarea-default-expanded,
.guideline-item [contenteditable="true"].guideline-rich-textbox,
.guideline-item [contenteditable="true"].guideline-rich-textbox:hover,
.guideline-item [contenteditable="true"].guideline-rich-textbox:focus {
  height: 128px !important;
  min-height: 128px !important;
  max-height: 128px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  resize: none !important;
  box-sizing: border-box !important;
  padding: 8px 9px !important;
  margin: 0 !important;
  line-height: 1.35 !important;
  background: #fff !important;
  background-image: none !important;
  color: #111827 !important;
  border: 1px solid rgba(31, 41, 51, .32) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  animation: none !important;
  transition: none !important;
  scroll-margin: 0 !important;
}
/* Focus keeps identical size — only the outline color changes. */
.guideline-item .guideline-rich-textbox:focus,
.guideline-card .guideline-rich-textbox:focus,
.ultra-compact-guideline .guideline-rich-textbox:focus,
.repeatable-text-fieldset .guideline-rich-textbox:focus {
  border-color: #111827 !important;
  outline: 1px solid #111827 !important;
  outline-offset: 0 !important;
}
/* Hover changes NOTHING: no outline, no background shift, no size. */
.guideline-item .guideline-rich-textbox:hover:not(:focus),
.guideline-card .guideline-rich-textbox:hover:not(:focus),
.ultra-compact-guideline .guideline-rich-textbox:hover:not(:focus),
.repeatable-text-fieldset .guideline-rich-textbox:hover:not(:focus) {
  border-color: rgba(31, 41, 51, .32) !important;
  outline: none !important;
  background: #fff !important;
}
/* The wrapping label/box also never moves on hover. */
.guideline-item .repeatable-text-box,
.guideline-item .simple-repeat-box,
.guideline-item .repeatable-text-box:hover,
.guideline-item .simple-repeat-box:hover,
.guideline-item .simple-box-line,
.guideline-item .simple-box-line:hover {
  transform: none !important;
  translate: none !important;
  animation: none !important;
  transition: none !important;
  min-height: 0 !important;
  max-height: none !important;
  box-shadow: none !important;
}

/* ============================================================
   VERSION 17 FIXES — final block.
   1) Bold / Italic / Underline words: BLACK text, always visible,
      no dotted outlines in any state.
   2) Sequence highlight strip visible again and matching the
      picked color; palette swatches show their real colors.
   ============================================================ */

/* --- 1) B/I/U: black words, no dotted outline ever ---------- */
.mini-format,
.plain-word-format,
.mini-format:hover,
.plain-word-format:hover,
.mini-format:focus,
.plain-word-format:focus,
.mini-format:focus-visible,
.plain-word-format:focus-visible,
.mini-format:active,
.plain-word-format:active,
.mini-format.active,
.plain-word-format.active,
.guideline-item .mini-format,
.guideline-item .mini-format:hover,
.guideline-item .mini-format:focus,
.guideline-item .mini-format:focus-visible,
.guideline-item .mini-format:active,
.guideline-card .mini-format,
.guideline-card .mini-format:hover,
.guideline-card .mini-format:focus,
.repeatable-text-fieldset .mini-format,
.repeatable-text-fieldset .mini-format:hover,
.repeatable-text-fieldset .mini-format:focus,
.ultra-compact-guideline .mini-format,
.ultra-compact-guideline .mini-format:hover,
.ultra-compact-guideline .mini-format:focus {
  color: #000000 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
.mini-format.active,
.plain-word-format.active,
.guideline-item .mini-format.active,
.guideline-card .mini-format.active,
.repeatable-text-fieldset .mini-format.active,
.ultra-compact-guideline .mini-format.active {
  color: #000000 !important;
  font-weight: 900 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  outline: none !important;
}

/* --- 2) Highlight strip + swatches: real colors visible ------ */
.guideline-item .sequence-entry-color-line,
.guideline-card .sequence-entry-color-line,
.sequence-panel .sequence-entry-color-line,
.ultra-compact-guideline .sequence-entry-color-line,
.simple-sequence-entry .sequence-entry-color-line,
.guideline-item .sequence-entry-color-line:hover,
.guideline-card .sequence-entry-color-line:hover,
.sequence-panel .sequence-entry-color-line:hover,
.ultra-compact-guideline .sequence-entry-color-line:hover,
.simple-sequence-entry .sequence-entry-color-line:hover,
.guideline-item .sequence-entry-color-line:focus,
.guideline-card .sequence-entry-color-line:focus,
.sequence-panel .sequence-entry-color-line:focus,
.ultra-compact-guideline .sequence-entry-color-line:focus,
.simple-sequence-entry .sequence-entry-color-line:focus {
  background: var(--sequence-entry-highlight, rgba(31, 41, 51, .28)) !important;
  background-color: var(--sequence-entry-highlight, rgba(31, 41, 51, .28)) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 1px rgba(31, 41, 51, .35) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.sequence-entry-highlight-palette .sequence-entry-highlight-swatch,
.sequence-entry-highlight-palette .sequence-entry-highlight-swatch:hover,
.sequence-entry-highlight-palette .sequence-entry-highlight-swatch:focus,
.guideline-item .sequence-entry-highlight-swatch,
.guideline-item .sequence-entry-highlight-swatch:hover,
.sequence-panel .sequence-entry-highlight-swatch,
.sequence-panel .sequence-entry-highlight-swatch:hover {
  background: var(--sequence-swatch, #ffffff) !important;
  background-color: var(--sequence-swatch, #ffffff) !important;
  background-image: none !important;
  opacity: 1 !important;
  filter: none !important;
  visibility: visible !important;
}
.sequence-entry-highlight-palette .sequence-entry-highlight-clear,
.guideline-item .sequence-entry-highlight-clear,
.sequence-panel .sequence-entry-highlight-clear {
  background: #ffffff !important;
  color: #111827 !important;
}

/* Tab color strip keeps its picked color too. */
.guideline-item .tag-color-strip,
.ultra-compact-guideline .tag-color-strip,
.guideline-item .tag-color-strip:hover,
.ultra-compact-guideline .tag-color-strip:hover {
  background: var(--tag-color, #24586b) !important;
  background-color: var(--tag-color, #24586b) !important;
  background-image: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* ============================================================
   VERSION 18 FIXES — final block.
   1) Tab color menu swatches show their real colors again.
   2) Highlight strip = the exact picked highlight color
      (neutral gray when none picked, never dazzle blue).
   3) B/I/U and "+" : simple black functional text, no blue box.
   ============================================================ */

/* --- 1) Tab color swatches: real colors, high specificity ---- */
.guideline-item .tag-color-wrap .tag-strip-palette .tag-strip-swatch,
.ultra-compact-guideline .tag-color-wrap .tag-strip-palette .tag-strip-swatch,
.tag-color-wrap .tag-strip-palette .tag-strip-swatch,
.guideline-item .tag-color-wrap .tag-strip-palette .tag-strip-swatch:hover,
.ultra-compact-guideline .tag-color-wrap .tag-strip-palette .tag-strip-swatch:hover,
.tag-color-wrap .tag-strip-palette .tag-strip-swatch:hover,
.guideline-item .tag-color-wrap .tag-strip-palette .tag-strip-swatch:focus,
.tag-color-wrap .tag-strip-palette .tag-strip-swatch:focus {
  background: var(--swatch) !important;
  background-color: var(--swatch) !important;
  background-image: none !important;
  opacity: 1 !important;
  filter: none !important;
  visibility: visible !important;
  box-shadow: none !important;
}

/* --- 2) Highlight strip matches the picked color -------------- */
/* No highlight picked: neutral gray strip (visible, clickable). */
.guideline-item .sequence-entry-highlight-wrap:not(.has-sequence-entry-highlight) .sequence-entry-color-line,
.guideline-card .sequence-entry-highlight-wrap:not(.has-sequence-entry-highlight) .sequence-entry-color-line,
.sequence-panel .sequence-entry-highlight-wrap:not(.has-sequence-entry-highlight) .sequence-entry-color-line,
.ultra-compact-guideline .sequence-entry-highlight-wrap:not(.has-sequence-entry-highlight) .sequence-entry-color-line,
.guideline-item .sequence-entry-highlight-wrap:not(.has-sequence-entry-highlight) .sequence-entry-color-line:hover,
.sequence-panel .sequence-entry-highlight-wrap:not(.has-sequence-entry-highlight) .sequence-entry-color-line:hover {
  background: rgba(31, 41, 51, .30) !important;
  background-color: rgba(31, 41, 51, .30) !important;
  background-image: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}
/* Highlight picked: the strip is EXACTLY that color. */
.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight .sequence-entry-color-line,
.guideline-card .sequence-entry-highlight-wrap.has-sequence-entry-highlight .sequence-entry-color-line,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight .sequence-entry-color-line,
.ultra-compact-guideline .sequence-entry-highlight-wrap.has-sequence-entry-highlight .sequence-entry-color-line,
.guideline-item .sequence-entry-highlight-wrap.has-sequence-entry-highlight .sequence-entry-color-line:hover,
.sequence-panel .sequence-entry-highlight-wrap.has-sequence-entry-highlight .sequence-entry-color-line:hover {
  background: var(--sequence-entry-highlight) !important;
  background-color: var(--sequence-entry-highlight) !important;
  background-image: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: inset 0 0 0 1px rgba(31, 41, 51, .30) !important;
}

/* --- 3) B/I/U and "+": simple black text, NO blue box --------- */
button.mini-format,
button.plain-word-format,
button.simple-plus-add,
button.other-plus-add,
button.mini-format:hover,
button.plain-word-format:hover,
button.simple-plus-add:hover,
button.other-plus-add:hover,
button.mini-format:focus,
button.plain-word-format:focus,
button.simple-plus-add:focus,
button.other-plus-add:focus,
button.mini-format:focus-visible,
button.simple-plus-add:focus-visible,
button.mini-format:active,
button.simple-plus-add:active,
button.mini-format.active {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  color: #000000 !important;
  position: static !important;
  overflow: visible !important;
}
button.mini-format::before,
button.mini-format::after,
button.plain-word-format::before,
button.plain-word-format::after,
button.simple-plus-add::before,
button.simple-plus-add::after,
button.other-plus-add::before,
button.other-plus-add::after {
  content: none !important;
  display: none !important;
}
button.mini-format.active {
  font-weight: 900 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}

/* ============================================================
   VERSION 19 FIXES — final block.
   1) Guideline Quick Change removed (JS) — kill leftover editor
      and its trigger styling risk; At a Glance rows only jump.
   2) Details / Scenario boxes: show at least 2 rows at all
      times, then GROW automatically as more text is entered.
      No fixed 128px height. No hover/focus size change.
   3) Smaller text size inside Details / Scenario areas.
   Later rules with equal specificity win, so this block
   supersedes the V16.1 fixed-height lock above.
   ============================================================ */

/* Hide any leftover quick-change editor shell, just in case. */
.ataglance-inline-details-editor,
.ataglance-full-guideline-editor {
  display: none !important;
}

/* 2-row minimum, auto-grow. Same selectors as the old fixed
   lock so this later block overrides it in every state. */
.guideline-item .guideline-rich-textbox,
.guideline-card .guideline-rich-textbox,
.ultra-compact-guideline .guideline-rich-textbox,
.repeatable-text-fieldset .guideline-rich-textbox,
.guideline-item .guideline-rich-textbox:hover,
.guideline-card .guideline-rich-textbox:hover,
.ultra-compact-guideline .guideline-rich-textbox:hover,
.repeatable-text-fieldset .guideline-rich-textbox:hover,
.guideline-item .guideline-rich-textbox:focus,
.guideline-card .guideline-rich-textbox:focus,
.ultra-compact-guideline .guideline-rich-textbox:focus,
.repeatable-text-fieldset .guideline-rich-textbox:focus,
.guideline-item .guideline-rich-textbox.textarea-default-collapsed,
.guideline-card .guideline-rich-textbox.textarea-default-collapsed,
.ultra-compact-guideline .guideline-rich-textbox.textarea-default-collapsed,
.repeatable-text-fieldset .guideline-rich-textbox.textarea-default-collapsed,
.guideline-item .guideline-rich-textbox.textarea-default-collapsed:hover,
.guideline-card .guideline-rich-textbox.textarea-default-collapsed:hover,
.ultra-compact-guideline .guideline-rich-textbox.textarea-default-collapsed:hover,
.repeatable-text-fieldset .guideline-rich-textbox.textarea-default-collapsed:hover,
.guideline-item .guideline-rich-textbox.textarea-default-collapsed:focus,
.guideline-card .guideline-rich-textbox.textarea-default-collapsed:focus,
.ultra-compact-guideline .guideline-rich-textbox.textarea-default-collapsed:focus,
.repeatable-text-fieldset .guideline-rich-textbox.textarea-default-collapsed:focus,
.guideline-item .guideline-rich-textbox.textarea-default-expanded,
.guideline-card .guideline-rich-textbox.textarea-default-expanded,
.ultra-compact-guideline .guideline-rich-textbox.textarea-default-expanded,
.repeatable-text-fieldset .guideline-rich-textbox.textarea-default-expanded,
.guideline-item [contenteditable="true"].guideline-rich-textbox,
.guideline-item [contenteditable="true"].guideline-rich-textbox:hover,
.guideline-item [contenteditable="true"].guideline-rich-textbox:focus,
.guideline-card [contenteditable="true"].guideline-rich-textbox,
.guideline-card [contenteditable="true"].guideline-rich-textbox:hover,
.guideline-card [contenteditable="true"].guideline-rich-textbox:focus,
.repeatable-text-fieldset [contenteditable="true"].guideline-rich-textbox,
.repeatable-text-fieldset [contenteditable="true"].guideline-rich-textbox:hover,
.repeatable-text-fieldset [contenteditable="true"].guideline-rich-textbox:focus,
.ultra-compact-guideline [contenteditable="true"].guideline-rich-textbox,
.ultra-compact-guideline [contenteditable="true"].guideline-rich-textbox:hover,
.ultra-compact-guideline [contenteditable="true"].guideline-rich-textbox:focus {
  /* At least 2 rows visible: 2 lines @ 12px * 1.4 + padding. */
  height: auto !important;
  min-height: 50px !important;
  max-height: none !important;
  overflow-y: hidden !important;
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  resize: none !important;
  box-sizing: border-box !important;
  padding: 7px 8px !important;
  margin: 0 !important;
  /* 3) Smaller text in Details / Scenario. */
  font-size: 12px !important;
  line-height: 1.4 !important;
  white-space: pre-wrap !important;
  overflow-wrap: break-word !important;
  background: #fff !important;
  background-image: none !important;
  color: #111827 !important;
  border: 1px solid rgba(31, 41, 51, .32) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  translate: none !important;
  scale: 1 !important;
  animation: none !important;
  transition: none !important;
  scroll-margin: 0 !important;
}
/* Focus: identical size, only the outline color marks focus. */
.guideline-item .guideline-rich-textbox:focus,
.guideline-card .guideline-rich-textbox:focus,
.ultra-compact-guideline .guideline-rich-textbox:focus,
.repeatable-text-fieldset .guideline-rich-textbox:focus {
  border-color: #111827 !important;
  outline: 1px solid #111827 !important;
  outline-offset: 0 !important;
}
/* Hover changes NOTHING — no size shift, no outline, no color. */
.guideline-item .guideline-rich-textbox:hover:not(:focus),
.guideline-card .guideline-rich-textbox:hover:not(:focus),
.ultra-compact-guideline .guideline-rich-textbox:hover:not(:focus),
.repeatable-text-fieldset .guideline-rich-textbox:hover:not(:focus) {
  border-color: rgba(31, 41, 51, .32) !important;
  outline: none !important;
  background: #fff !important;
}
/* Placeholder text matches the smaller size. */
.guideline-rich-textbox:empty::before {
  font-size: 12px !important;
  line-height: 1.4 !important;
}

/* ======================================================================
   VERSION 21 — CPT FEATURES (final block, wins by cascade order).
   Flat, plain, print-friendly. No glass, no shimmer, nothing moves
   or resizes on hover. Functional word-buttons are plain black text.
   ====================================================================== */

/* --- Sequence panel header: badges + Copy word-button --- */
.sequence-panel-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}
.sequence-type-badges {
  display: inline-flex;
  gap: 4px;
  margin-left: 6px;
  vertical-align: middle;
}
.code-type-badge {
  display: inline-block;
  font-size: 9.5px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .04em;
  padding: 3px 6px;
  border-radius: 3px;
  border: 1px solid rgba(31, 41, 51, .35);
  background: #fff;
  color: #1f2933;
  text-transform: uppercase;
  white-space: nowrap;
}
.code-type-badge-cpt { background: #eef4fb; border-color: #9db8d6; color: #24425f; }
.code-type-badge-cptii { background: #eefaf1; border-color: #9ccfae; color: #24593a; }
.code-type-badge-cptiii { background: #f6effb; border-color: #c2a3d9; color: #4d2f66; }
.code-type-badge-hcpcs { background: #fdf4e7; border-color: #dcb98a; color: #6b4a1d; }
.code-type-badge-icd10 { background: #f4f5f7; border-color: #b5bcc4; color: #33404d; }
.code-type-badge-empty { border: none; background: transparent; padding: 3px 0; min-width: 34px; }

/* Copy — plain black functional word, like B / I / U / + details */
.copy-sequence-link,
.copy-sequence-link:hover,
.copy-sequence-link:focus,
.copy-sequence-link:active {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  color: #111827 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 0 2px !important;
  margin: 0 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}
.copy-sequence-link:hover { text-decoration: underline !important; }

/* --- CPT sequence section: sits directly NEXT TO the ICD Code Sequence stack,
   matching its style exactly (no extra borders/margins). --- */
.cpt-sequence-section {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}
.cpt-sequence-header {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: #3b4754;
  margin: 0 0 4px 0;
}

/* --- Format validation flag: subtle, static (nothing moves) --- */
.cpt-format-flag,
textarea.cpt-format-flag,
input.cpt-format-flag {
  border-bottom: 2px solid #c25b4e !important;
  background-image: none !important;
}

/* --- Second toggle row (CPT Sequence / Bundling / Global Period) --- */
.cpt-toggle-row {
  margin-top: 2px;
  padding-top: 2px;
}
.cpt-toggle-row .subnote-toggle { font-size: 11px; }

/* --- Bundling / Global bottom subnote fields (match Exception/Query) --- */
.bottom-bundling-field > span,
.bottom-global-period-field > span {
  font-weight: 700;
}

/* --- E/M quick reference card --- */
.em-reference-shell,
.cpt-library-shell {
  margin: 10px 0;
  border: 1px solid rgba(31, 41, 51, .28);
  border-radius: 6px;
  background: #fff;
  padding: 8px 10px;
  box-shadow: none !important;
}
.em-reference-toggle,
.cpt-library-toggle,
.em-reference-toggle:hover,
.cpt-library-toggle:hover,
.em-reference-toggle:focus,
.cpt-library-toggle:focus,
.em-reference-toggle:active,
.cpt-library-toggle:active {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  color: #111827 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 2px 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
  text-align: left !important;
  width: 100% !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}
.em-reference-card,
.cpt-library-card {
  margin-top: 8px;
  border-top: 1px solid rgba(31, 41, 51, .18);
  padding-top: 8px;
}
.em-reference-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.em-reference-table th,
.em-reference-table td {
  border: 1px solid rgba(31, 41, 51, .28);
  padding: 4px 8px;
  text-align: left;
  background: #fff;
  color: #1f2933;
}
.em-reference-table th {
  background: #f4f5f7;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.em-reference-mdm {
  margin-top: 8px;
  font-size: 12px;
  color: #1f2933;
}
.em-reference-mdm ul {
  margin: 4px 0 0 18px;
  padding: 0;
}
.em-reference-mdm li { margin: 2px 0; }
.em-reference-note {
  margin: 8px 0 0 0;
  font-size: 11.5px;
  color: #33404d;
}
.em-reference-footnote {
  margin: 4px 0 0 0;
  font-size: 10.5px;
  color: #5a6772;
  font-style: italic;
}

/* --- CPT library --- */
.cpt-library-note {
  margin: 0 0 6px 0;
  font-size: 11.5px;
  color: #33404d;
}
.cpt-library-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.cpt-library-search {
  flex: 0 1 240px;
  font-size: 12px;
  padding: 4px 8px;
  border: 1px solid rgba(31, 41, 51, .32);
  border-radius: 4px;
  background: #fff;
  color: #1f2933;
}
.cpt-library-search:focus {
  outline: 1px solid #111827;
  outline-offset: 0;
  border-color: #111827;
}
.cpt-library-add,
.cpt-library-add:hover,
.cpt-library-add:focus,
.cpt-library-add:active {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  color: #111827 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 0 2px !important;
  cursor: pointer !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}
.cpt-library-add:hover { text-decoration: underline !important; }
.cpt-library-rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cpt-library-row {
  display: grid;
  grid-template-columns: 92px 52px 1fr 1fr 24px;
  gap: 6px;
  align-items: center;
}
.cpt-library-row input[type="text"] {
  font-size: 12px;
  padding: 4px 6px;
  border: 1px solid rgba(31, 41, 51, .32);
  border-radius: 4px;
  background: #fff;
  color: #1f2933;
  width: 100%;
  box-sizing: border-box;
}
.cpt-library-row input[type="text"]:focus {
  outline: 1px solid #111827;
  outline-offset: 0;
  border-color: #111827;
}
.cpt-library-code {
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.cpt-library-delete {
  justify-self: center;
}
.plain-empty-state {
  font-size: 12px;
  color: #5a6772;
  padding: 6px 2px;
}

/* Print: keep cards flat and readable; hide interactive-only affordances */
@media print {
  .em-reference-shell,
  .cpt-library-shell { border-color: #999; }
  .copy-sequence-link,
  .cpt-library-add,
  .cpt-library-delete,
  .cpt-library-search { display: none !important; }
}

/* ============================================================
   V22 FIX PACK 2026-07-01
   1) CPT / Procedure code stack: fully usable, styled EXACTLY like the
      ICD Code Sequence stack, and sits directly NEXT TO it (side by side).
   2) All button/control text black and visible (delete symbols keep red).
   3) Bottom subnote labels (Exception / Query / Bundling / Global) all the
      same weight as the Global Period label.
   ============================================================ */

/* ---- 1) CPT stack next to the Code Sequence stack ---- */

/* IMPORTANT: the card's own grid (color / writing / delete rows with the
   sequence row below) is NOT touched. The Code Sequence row already spans
   the full card width, so both stacks fit side by side on the LEFT with the
   toggles beside them, and the writing boxes keep their normal full-width
   layout across the page. */

/* Panel with CPT open: ICD stack | CPT stack | toggle table, all left-aligned. */
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel,
.compact-guideline.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel,
.guideline-item.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel {
  max-width: none !important;
  grid-template-columns: minmax(170px, 240px) minmax(170px, 240px) minmax(0, 1fr) !important;
  justify-content: start !important;
  gap: 6px !important;
}

.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-stack {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

.ultra-compact-guideline .cpt-sequence-section {
  grid-column: 2 !important;
  grid-row: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
  overflow: visible !important;
}

.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-subnote-toggles.clean-control-table {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

/* The CPT stack inherits the exact ICD stack look: same single-column layout,
   same paddings, gaps, and input styling (it uses the same classes). */
.ultra-compact-guideline .cpt-sequence-section .sequence-stack,
.sequence-panel .cpt-sequence-section .sequence-stack {
  width: 100% !important;
  min-width: 0 !important;
  grid-template-columns: 1fr !important;
  gap: 3px !important;
  overflow: visible !important;
}

/* Make sure nothing covers the CPT fields: the section and its rows sit
   above decorative layers and accept pointer events. */
.cpt-sequence-section,
.cpt-sequence-section .sequence-stack,
.cpt-sequence-section .sequence-entry-highlight-wrap,
.cpt-sequence-section .sequence-stack-input,
.cpt-sequence-section .other-plus-add {
  pointer-events: auto !important;
}
.cpt-sequence-section {
  position: relative !important;
  z-index: 2 !important;
}

/* Narrow windows: stack CPT below the ICD stack instead of beside it. */
@media (max-width: 1120px) {
  .ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel,
  .compact-guideline.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel,
  .guideline-item.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel {
    grid-template-columns: 1fr !important;
  }
  .ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-stack {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  .ultra-compact-guideline .cpt-sequence-section {
    grid-column: 1 !important;
    grid-row: 2 !important;
  }
  .ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-subnote-toggles.clean-control-table {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
}

/* ---- 2) Visible BLACK text on all plain controls (delete symbols stay red) ---- */

/* Section minimize / expand pill: black + / - glyph on a white pill. */
button.main-section-collapse-toggle,
button.main-section-collapse-toggle:hover,
button.main-section-collapse-toggle:focus,
button.main-section-collapse-toggle:focus-visible,
button.main-section-collapse-toggle:active,
.main-section-collapse-toggle,
.main-section-collapse-toggle * {
  color: #111111 !important;
  background: #ffffff !important;
  background-image: none !important;
  text-shadow: none !important;
}

/* "Add a new detail row" / "No guideline rows yet" / "Click here to type a
   new Guideline" starters: black text on their light background. */
button.ready-guideline-starter,
button.ready-guideline-starter:hover,
button.ready-guideline-starter:focus,
button.ready-guideline-starter:focus-visible,
button.empty-guideline-item-prompt,
button.empty-guideline-item-prompt:hover,
button.empty-guideline-item-prompt:focus,
button.empty-guideline-item-prompt:focus-visible,
button.blank-guideline-entry,
button.blank-guideline-entry:hover,
button.blank-guideline-entry:focus,
button.blank-guideline-entry:focus-visible,
.plain-empty-state,
.plain-empty-state *,
.ready-guideline-starter,
.ready-guideline-starter *,
.empty-guideline-item-prompt,
.empty-guideline-item-prompt *,
.blank-guideline-entry,
.blank-guideline-entry * {
  color: #111111 !important;
  background-image: none !important;
  text-shadow: none !important;
}

/* At-a-Glance card collapse toggle and other small ghost toggles: black text. */
button.ataglance-card-collapse-toggle,
button.ataglance-card-collapse-toggle:hover,
button.ataglance-card-collapse-toggle:focus,
button.color-key-toggle,
button.color-key-toggle:hover,
button.color-key-toggle:focus {
  color: #111111 !important;
}

/* Plain word controls inside cards (Copy, E/M reference, CPT library, Add Code):
   black text, never white. */
.copy-sequence-link,
.em-reference-toggle,
.cpt-library-toggle,
.cpt-library-add,
.copy-sequence-link:hover,
.em-reference-toggle:hover,
.cpt-library-toggle:hover,
.cpt-library-add:hover,
.copy-sequence-link:focus,
.em-reference-toggle:focus,
.cpt-library-toggle:focus,
.cpt-library-add:focus {
  color: #111111 !important;
}

/* Sequence "Add" controls (ICD Others + CPT Others): black text. */
.sequence-panel .simple-plus-add,
.sequence-panel .other-plus-add,
.ultra-compact-guideline .simple-plus-add,
.ultra-compact-guideline .other-plus-add,
.sequence-panel .simple-plus-add:hover,
.sequence-panel .other-plus-add:hover,
.ultra-compact-guideline .simple-plus-add:hover,
.ultra-compact-guideline .other-plus-add:hover {
  color: #111111 !important;
}

/* Delete symbols stay red and visible (explicitly re-asserted). */
.simple-x-delete,
.other-x-delete,
.inline-box-delete,
.cpt-library-delete,
.simple-x-delete:hover,
.other-x-delete:hover,
.inline-box-delete:hover,
.cpt-library-delete:hover {
  color: #c62828 !important;
}
button.compact-delete,
button.compact-delete:hover,
.note-clear-button,
.note-clear-button:hover,
.mini-danger,
.mini-danger:hover,
.ataglance-delete-detail,
.ataglance-delete-detail:hover {
  color: #8a3434 !important;
}

/* ---- 3) Bottom subnote labels: all the SAME weight as Global Period ---- */
.bottom-subnote-field,
.ultra-compact-guideline .bottom-subnote-field {
  font-weight: 700 !important;
}
.bottom-subnote-field > span,
.ultra-compact-guideline .bottom-subnote-field > span,
.bottom-exception-field > span,
.bottom-query-provider-field > span,
.bottom-bundling-field > span,
.bottom-global-period-field > span,
.guideline-tag-note-field > span {
  font-weight: 700 !important;
  color: #111111 !important;
}

/* ============================================================
   V23 FIX PACK 2026-07-01
   1) Writing boxes (Guideline / Details / Scenario) back across the page
      (card-level column override removed above; sequence layout now lives
      entirely inside the sequence panel row).
   2) Code Sequence + CPT stacks lined to the LEFT of the card.
   3) Highlight color menu always ABOVE the sequence text.
   4) Add Note area: no delete button (removed from the app code).
   ============================================================ */

/* ---- 3) Highlight menu above the text, always ---- */

/* The open row keeps its layering even while hovered or focused
   (these states previously reverted z-index/overflow and let the
   text rows paint on top of the menu). */
.guideline-item .sequence-entry-highlight-wrap.show-sequence-entry-palette,
.sequence-panel .sequence-entry-highlight-wrap.show-sequence-entry-palette,
.ultra-compact-guideline .sequence-entry-highlight-wrap.show-sequence-entry-palette,
.guideline-item .sequence-entry-highlight-wrap.show-sequence-entry-palette:hover,
.sequence-panel .sequence-entry-highlight-wrap.show-sequence-entry-palette:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap.show-sequence-entry-palette:hover,
.guideline-item .sequence-entry-highlight-wrap.show-sequence-entry-palette:focus-within,
.sequence-panel .sequence-entry-highlight-wrap.show-sequence-entry-palette:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap.show-sequence-entry-palette:focus-within {
  position: relative !important;
  z-index: 2147483200 !important;
  overflow: visible !important;
  transform: none !important;
}

/* While a menu is open, every other sequence text field in that panel
   drops to the bottom layer so nothing can sit on top of the menu. */
.sequence-panel:has(.show-sequence-entry-palette) .sequence-entry-highlight-wrap:not(.show-sequence-entry-palette),
.sequence-panel:has(.show-sequence-entry-palette) .sequence-entry-highlight-wrap:not(.show-sequence-entry-palette):hover,
.sequence-panel:has(.show-sequence-entry-palette) .sequence-entry-highlight-wrap:not(.show-sequence-entry-palette):focus-within,
.sequence-panel:has(.show-sequence-entry-palette) .sequence-entry-highlight-wrap:not(.show-sequence-entry-palette) .sequence-stack-input,
.sequence-panel:has(.show-sequence-entry-palette) .sequence-entry-highlight-wrap:not(.show-sequence-entry-palette) .sequence-stack-input:hover,
.sequence-panel:has(.show-sequence-entry-palette) .sequence-entry-highlight-wrap:not(.show-sequence-entry-palette) .sequence-stack-input:focus {
  z-index: 0 !important;
}

/* If the menu opens inside the CPT stack, lift the CPT section itself so the
   ICD stack's text cannot cover it (and vice versa stays safe: the ICD open
   row's own layer already beats the CPT section's resting layer). */
.cpt-sequence-section:has(.show-sequence-entry-palette) {
  z-index: 2147483150 !important;
}

/* Every ancestor between the open row and the card stays unclipped. */
.sequence-stack:has(.show-sequence-entry-palette),
.sequence-repeat-group:has(.show-sequence-entry-palette),
.cpt-sequence-section:has(.show-sequence-entry-palette),
.sequence-panel:has(.show-sequence-entry-palette),
.guideline-item:has(.show-sequence-entry-palette) {
  overflow: visible !important;
}

/* ---- 2) Stacks lined to the LEFT of the card ---- */
.ultra-compact-guideline > .sequence-panel,
.compact-guideline.ultra-compact-guideline > .sequence-panel,
.guideline-item.ultra-compact-guideline > .sequence-panel {
  justify-self: stretch !important;
  justify-content: start !important;
  justify-items: start !important;
}
.ultra-compact-guideline > .sequence-panel > .sequence-stack,
.ultra-compact-guideline .cpt-sequence-section {
  justify-self: stretch !important;
}

/* ---- 4) Note area: hide any leftover clear/delete control ---- */
.guideline-tag-note-field .note-clear-button,
.modifier-note-panel .note-clear-button,
.note-clear-button {
  display: none !important;
}

/* ============================================================
   V24 FEATURE PACK 2026-07-01
   1) At-a-Glance highlight matches the LIGHT fill used in the Code
      Sequence fields (same color-mix recipe), so text stays readable.
   2) Multiple notes: extra Note rows + plain Add / X controls.
   3) DO NOT rows: deep red, easy-to-read text; repeatable.
   4) At-a-Glance icons: red no-symbol for DO NOT, green "1st" for
      Code First / Principal (always first in the icon list).
   ============================================================ */

/* ---- 1) Light At-a-Glance highlight (matches sequence fields) ---- */
.summary-extra-details-container .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-no-marker .summary-sequence-text.has-summary-sequence-highlight,
.tag-title-row.summary-marker-outside .summary-sequence-text.has-summary-sequence-highlight,
.summary-sequence-text.has-summary-sequence-highlight,
.summary-sequence-part.has-summary-sequence-highlight {
  background: color-mix(in srgb, var(--summary-sequence-highlight, #fff09a) 38%, #fff 62%) !important;
  background-color: color-mix(in srgb, var(--summary-sequence-highlight, #fff09a) 38%, #fff 62%) !important;
  color: #10232d !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--summary-sequence-highlight, #fff09a) 55%, rgba(15,23,42,.12)) !important;
  text-decoration: none !important;
}

/* ---- 2) Extra notes ---- */
.guideline-tag-note-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 4px !important;
}
.guideline-tag-note-field .guideline-note-label {
  grid-column: 1 !important;
  width: 100% !important;
}
.guideline-tag-note-field .extra-note-delete {
  grid-column: 2 !important;
  align-self: center !important;
  color: #c62828 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.guideline-tag-note-field .add-extra-note {
  grid-column: 1 / -1 !important;
  justify-self: start !important;
  color: #111111 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 2px 4px !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}
.extra-note-label { margin-top: 4px !important; }

/* ---- 3) DO NOT rows: deep red, readable ---- */
.guideline-do-not-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 4px !important;
  width: 100% !important;
}
.guideline-do-not-field .do-not-label {
  grid-column: 1 !important;
  display: block !important;
  width: 100% !important;
  margin-top: 4px !important;
}
.guideline-do-not-field .do-not-label > span {
  color: #9f1239 !important;
  font-weight: 800 !important;
  font-size: .72rem !important;
  letter-spacing: .04em !important;
}
.guideline-do-not-field .guideline-do-not-entry,
.guideline-do-not-field .guideline-do-not-entry:hover,
.guideline-do-not-field .guideline-do-not-entry:focus {
  display: block !important;
  width: 100% !important;
  min-height: 30px !important;
  padding: 5px 8px !important;
  border: 1px solid rgba(159, 18, 57, .45) !important;
  border-radius: 8px !important;
  background: #fff5f5 !important;
  color: #9f1239 !important;
  font-weight: 700 !important;
  box-sizing: border-box !important;
  resize: none !important;
}
.guideline-do-not-field .do-not-delete {
  grid-column: 2 !important;
  align-self: center !important;
  color: #c62828 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.guideline-do-not-field .add-do-not {
  grid-column: 1 / -1 !important;
  justify-self: start !important;
  color: #9f1239 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 2px 4px !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}

/* DO NOT checkbox label in the toggle table: deep red so it's obvious. */
.subnote-toggle.do-not-toggle {
  color: #9f1239 !important;
  font-weight: 800 !important;
}

/* ---- 4) At-a-Glance icons ---- */
/* Red no-symbol for DO NOT: stays red (grayscale filter removed). */
.summary-alert.summary-alert-do-not,
.summary-extra-details-container .summary-alert-do-not,
.summary-alert-do-not {
  color: #ffffff !important;
  background: #c62828 !important;
  border: 1px solid #9f1239 !important;
  filter: none !important;
  font-weight: 900 !important;
}
/* Green "1st" for Code First / Principal: stays green, listed first. */
.summary-alert.summary-alert-code-first,
.summary-extra-details-container .summary-alert-code-first,
.summary-alert-code-first {
  color: #ffffff !important;
  background: #15803d !important;
  border: 1px solid #14532d !important;
  filter: none !important;
  font-weight: 900 !important;
}
/* Both use the same round chip sizing as the other alert symbols. */
.summary-alert.summary-alert-do-not,
.summary-alert.summary-alert-code-first {
  width: auto !important;
  min-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;
  padding: 0 4px !important;
  border-radius: 999px !important;
  font-size: .58rem !important;
  line-height: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ============================================================
   V25 FIX PACK 2026-07-01
   1) Slightly larger guideline writing text and checkbox labels.
   2) Code Sequence / CPT Sequence textareas grow only from content lines.
   3) CPT sequence displays under ICD sequence in At-a-Glance.
   4) CPT helper labels use CPT Code wording.
   ============================================================ */

/* ---- 1) Slightly larger text in guideline text boxes ---- */
.guideline-label-textarea,
.guideline-detail-fieldset textarea,
.scenario-exception-fieldset textarea,
.guideline-tag-note,
.guideline-do-not-entry,
.sequence-sub-entry,
.guideline-writing-stack textarea,
.guideline-subnote-writing-stack textarea,
.ultra-compact-guideline .guideline-label-textarea,
.ultra-compact-guideline .inline-guideline-details,
.ultra-compact-guideline .inline-guideline-scenario,
.ultra-compact-guideline .guideline-writing-stack textarea,
.ultra-compact-guideline .guideline-subnote-writing-stack textarea {
  font-size: 13.5px !important;
  line-height: 1.28 !important;
}

/* ---- 2) Slightly larger checkbox/toggle labels in the Guideline area ---- */
.sequence-subnote-toggles .subnote-toggle,
.ultra-compact-guideline .sequence-subnote-toggles .subnote-toggle,
.ultra-compact-guideline .sequence-toggle-cell .subnote-toggle,
.cpt-toggle-row .subnote-toggle {
  font-size: 12px !important;
  line-height: 1.2 !important;
  min-height: 26px !important;
  padding: 4px 7px !important;
}
.subnote-toggle.do-not-toggle {
  font-size: 12.5px !important;
  line-height: 1.22 !important;
}

/* Make DO NOT input a little roomier so it no longer feels tight. */
.guideline-do-not-field .guideline-do-not-entry,
.guideline-do-not-field .guideline-do-not-entry:hover,
.guideline-do-not-field .guideline-do-not-entry:focus {
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  min-height: 34px !important;
  padding: 6px 9px !important;
}
.guideline-do-not-field .do-not-label > span {
  font-size: .78rem !important;
  line-height: 1.2 !important;
}

/* ---- 3) Sequence textareas grow ONLY by typed content/new lines ---- */
.sequence-panel textarea.sequence-stack-input,
.sequence-panel textarea.sequence-stack-input:hover,
.sequence-panel textarea.sequence-stack-input:focus,
.ultra-compact-guideline textarea.sequence-stack-input,
.ultra-compact-guideline textarea.sequence-stack-input:hover,
.ultra-compact-guideline textarea.sequence-stack-input:focus,
.sequence-panel textarea.sequence-stack-input.sequence-others-textarea,
.sequence-panel textarea.sequence-stack-input.sequence-others-textarea:hover,
.sequence-panel textarea.sequence-stack-input.sequence-others-textarea:focus,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea:hover,
.ultra-compact-guideline textarea.sequence-stack-input.sequence-others-textarea:focus {
  min-height: 26px !important;
  height: auto !important;
  max-height: none !important;
  line-height: 1.24 !important;
  font-size: 12.5px !important;
  overflow-y: hidden !important;
  white-space: pre-wrap !important;
  resize: none !important;
  transform: none !important;
  min-width: 0 !important;
  width: 100% !important;
}
.sequence-panel textarea.sequence-stack-input:hover,
.sequence-panel textarea.sequence-stack-input:focus,
.ultra-compact-guideline textarea.sequence-stack-input:hover,
.ultra-compact-guideline textarea.sequence-stack-input:focus {
  box-shadow: none !important;
  transform: none !important;
}

/* Let row wrappers and groups grow vertically with multi-line sequence text. */
.sequence-panel .sequence-entry-highlight-wrap,
.sequence-panel .sequence-entry-highlight-wrap:hover,
.sequence-panel .sequence-entry-highlight-wrap:focus-within,
.ultra-compact-guideline .sequence-entry-highlight-wrap,
.ultra-compact-guideline .sequence-entry-highlight-wrap:hover,
.ultra-compact-guideline .sequence-entry-highlight-wrap:focus-within,
.sequence-repeat-entry,
.sequence-repeat-group,
.others-repeat-group {
  height: auto !important;
  min-height: 26px !important;
  max-height: none !important;
  align-items: stretch !important;
  overflow: visible !important;
}

/* ---- 4) CPT sequence appears under ICD sequence in At-a-Glance ---- */
.summary-sequence-stack-ataglance {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 3px !important;
  width: 100% !important;
  min-width: 0 !important;
}
.summary-sequence-stack-ataglance .summary-sequence-code,
.summary-sequence-stack-ataglance .summary-cpt-sequence-code,
.summary-sequence-stack-ataglance .summary-icd-sequence-code {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 3px !important;
  width: 100% !important;
  min-width: 0 !important;
}
.summary-cpt-sequence-code {
  margin-top: 1px !important;
}
.summary-cpt-sequence-text::before {
  content: "CPT ";
  font-weight: 800 !important;
}

/* ============================================================
   V27 FIX PACK 2026-07-08
   Give Code Sequence and CPT Code Sequence more horizontal room.
   The checkbox/toggle controls are compacted and shifted right so
   the two sequence text stacks do not squeeze or stack unnecessarily.
   ============================================================ */

/* CPT open: wider ICD stack | wider CPT stack | compact controls on the right. */
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel,
.compact-guideline.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel,
.guideline-item.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel {
  display: grid !important;
  grid-template-columns: minmax(230px, 1.35fr) minmax(230px, 1.35fr) minmax(170px, .8fr) !important;
  column-gap: 8px !important;
  row-gap: 4px !important;
  align-items: start !important;
  justify-content: stretch !important;
  justify-items: stretch !important;
  width: 100% !important;
  max-width: none !important;
}

/* Keep both sequence stacks stretched inside their wider columns. */
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-stack,
.ultra-compact-guideline .cpt-sequence-section,
.ultra-compact-guideline .cpt-sequence-section .sequence-stack,
.sequence-panel .cpt-sequence-section .sequence-stack {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-self: stretch !important;
}

/* Squeeze the Guideline checkbox/toggle area to the right to free code width. */
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-subnote-toggles.clean-control-table,
.compact-guideline.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-subnote-toggles.clean-control-table,
.guideline-item.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-subnote-toggles.clean-control-table {
  width: 100% !important;
  min-width: 160px !important;
  max-width: 210px !important;
  justify-self: end !important;
  align-self: start !important;
  gap: 3px !important;
  padding-left: 2px !important;
}

.ultra-compact-guideline:has(.cpt-sequence-section) .sequence-subnote-toggles.clean-control-table .subnote-toggle,
.compact-guideline.ultra-compact-guideline:has(.cpt-sequence-section) .sequence-subnote-toggles.clean-control-table .subnote-toggle,
.guideline-item.ultra-compact-guideline:has(.cpt-sequence-section) .sequence-subnote-toggles.clean-control-table .subnote-toggle,
.ultra-compact-guideline:has(.cpt-sequence-section) .cpt-toggle-row .subnote-toggle {
  font-size: 11.5px !important;
  line-height: 1.15 !important;
  min-height: 24px !important;
  padding: 3px 5px !important;
  gap: 3px !important;
  white-space: normal !important;
}

/* The DO NOT toggle can remain readable while still taking less horizontal room. */
.ultra-compact-guideline:has(.cpt-sequence-section) .subnote-toggle.do-not-toggle {
  font-size: 12px !important;
  line-height: 1.15 !important;
}

/* Only when the available card width is genuinely narrow should CPT move below ICD. */
@media (max-width: 900px) {
  .ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel,
  .compact-guideline.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel,
  .guideline-item.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-stack {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  .ultra-compact-guideline .cpt-sequence-section {
    grid-column: 1 !important;
    grid-row: 2 !important;
  }
  .ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-subnote-toggles.clean-control-table {
    grid-column: 1 !important;
    grid-row: 3 !important;
    max-width: none !important;
    justify-self: stretch !important;
  }
}

/* ============================================================
   V28 FIX PACK 2026-07-08
   1) Even spacing/cushion between repeated Other rows (ICD + CPT).
   2) Spacing between stacked multiple Notes so they don't collide.
   3) DO NOT checkbox icon spaced away from the checkbox box.
   4) At-a-Glance redesign: clean flat rows, no nested-bubble look.
   ============================================================ */

/* ---- 1) Even cushion between Other rows in Code Sequence and CPT ---- */
.sequence-panel .others-repeat-group,
.ultra-compact-guideline .others-repeat-group,
.cpt-sequence-section .others-repeat-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding-top: 2px !important;
}
.sequence-panel .others-repeat-group > .sequence-repeat-entry,
.ultra-compact-guideline .others-repeat-group > .sequence-repeat-entry,
.cpt-sequence-section .others-repeat-group > .sequence-repeat-entry {
  margin: 0 !important;
}
/* Add a little breathing room above the Add button under Others. */
.sequence-panel .others-repeat-group > .other-plus-add,
.ultra-compact-guideline .others-repeat-group > .other-plus-add,
.cpt-sequence-section .others-repeat-group > .other-plus-add {
  margin-top: 2px !important;
}
/* Give every sequence group in the stack even vertical rhythm. */
.repeatable-sequence-stack {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.repeatable-sequence-stack > .sequence-repeat-group {
  margin: 0 !important;
}

/* ---- 2) Spacing between multiple Notes so they don't collide ---- */
.guideline-tag-note-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
.guideline-tag-note-field .guideline-note-label {
  margin: 0 !important;
}
.guideline-tag-note-field .extra-note-label {
  margin-top: 2px !important;
}
/* Keep the delete X for extra notes from crowding the note text. */
.guideline-tag-note-field .extra-note-delete {
  margin-top: 2px !important;
}

/* ---- 3) DO NOT: space the ⃠ icon away from the checkbox ---- */
.subnote-toggle.do-not-toggle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
}
.subnote-toggle.do-not-toggle input[type="checkbox"] {
  margin: 0 4px 0 0 !important;
  flex: 0 0 auto !important;
}
/* Also space the DO NOT label symbol inside the field rows. */
.guideline-do-not-field .do-not-label > span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  letter-spacing: .01em !important;
}
/* Even spacing between repeated DO NOT rows. */
.guideline-do-not-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

/* ============================================================
   V29 SUGGESTIONS (EMAIL ME) FEATURE 2026-07-08
   Clean, friendly suggestion modal: name, email, large box.
   Sends via the user's own email app (mailto).
   ============================================================ */
.suggest-card {
  max-width: 560px !important;
  width: min(560px, 94vw) !important;
}
.suggest-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 4px !important;
}
.suggest-head .eyebrow {
  margin: 0 !important;
  font-size: .72rem !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: #3b7d97 !important;
  font-weight: 800 !important;
}
.suggest-head h2 {
  margin: 2px 0 0 0 !important;
}
.suggest-intro {
  margin: 4px 0 12px 0 !important;
  font-size: .9rem !important;
  line-height: 1.5 !important;
  color: #33404d !important;
}
.suggest-card .modal-label {
  display: block !important;
  margin: 0 0 12px 0 !important;
  font-weight: 700 !important;
  font-size: .82rem !important;
  color: #1f2933 !important;
}
.suggest-card .modal-input {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin-top: 5px !important;
  padding: 9px 11px !important;
  font-size: .92rem !important;
  border: 1px solid rgba(31, 41, 51, .32) !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #111827 !important;
  font-weight: 500 !important;
}
.suggest-card .modal-input:focus {
  outline: 2px solid #3b7d97 !important;
  outline-offset: 0 !important;
  border-color: #3b7d97 !important;
}
.suggest-textarea {
  min-height: 150px !important;
  resize: vertical !important;
  line-height: 1.45 !important;
  font-family: inherit !important;
}
.suggest-note {
  min-height: 18px !important;
  margin: 0 0 6px 0 !important;
  font-size: .82rem !important;
  font-weight: 600 !important;
  color: var(--do-not-red) !important;
}
.suggest-privacy {
  display: block !important;
  margin-top: 10px !important;
  font-size: .74rem !important;
  line-height: 1.4 !important;
  color: #5a6772 !important;
}

/* ============================================================
   V30 AT-A-GLANCE — FRESH REDESIGN 2026-07-08
   A calm, single-column "index card" list. Everything is
   LEFT-ANCHORED and flows top-to-bottom inside one card:
     Line 1: guideline title (bold) + small marker tags
     Line 2+: code chips (ICD row, then CPT row), left aligned.
   No two-column split, no centered/floating code, no corner drift.
   ============================================================ */

/* Card list rhythm. */
.at-a-glance-category-rows {
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
  padding: 4px 0 2px 0 !important;
  margin: 0 !important;
}

/* Each guideline = one flat card, stacked vertically, full width, left aligned. */
.at-a-glance-category-rows .tag-title-row.summary-no-marker,
.at-a-glance-category-rows .tag-title-row.summary-marker-outside {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #ffffff !important;
  border: 1px solid rgba(31, 41, 51, .14) !important;
  border-left: 5px solid var(--tag-color, #3b7d97) !important;
  border-radius: 9px !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05) !important;
  overflow: hidden !important;
  transition: box-shadow .12s ease, border-color .12s ease !important;
}
.at-a-glance-category-rows .tag-title-row.summary-no-marker:hover,
.at-a-glance-category-rows .tag-title-row.summary-marker-outside:hover {
  border-color: rgba(31, 41, 51, .28) !important;
  box-shadow: 0 3px 9px rgba(15, 23, 42, .10) !important;
}

/* Both inner buttons: full-width, transparent, LEFT aligned, stacked. */
.at-a-glance-category-rows .tag-title-row .tag-title-jump,
.at-a-glance-category-rows .tag-title-row .ataglance-main-jump-button,
.at-a-glance-category-rows .tag-title-row .ataglance-sequence-quick-change {
  display: flex !important;
  width: 100% !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  margin: 0 !important;
  text-align: left !important;
  justify-content: flex-start !important;
  align-items: center !important;
  min-height: 0 !important;
}

/* Line 1 — title + markers on one wrapping row, left anchored, vertically centered. */
.at-a-glance-category-rows .tag-title-row .ataglance-main-jump-button {
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px 10px !important;
  padding: 11px 13px 9px 13px !important;
}

/* Line 2 — code sequence, left anchored, its own subtle strip. */
.at-a-glance-category-rows .tag-title-row .ataglance-sequence-quick-change {
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 9px 13px 11px 13px !important;
  border-top: 1px dashed rgba(31, 41, 51, .12) !important;
  background: #f8fafb !important;
}

/* Title text: the clear primary line, left aligned, no bubble, top of the card. */
.at-a-glance-category-rows .summary-tag-title-text {
  display: inline !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  color: #16232b !important;
  font-size: .95rem !important;
  font-weight: 750 !important;
  line-height: 1.32 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}
.at-a-glance-category-rows .ataglance-guideline-title-only {
  display: inline !important;
  flex: 1 1 240px !important;
  min-width: 0 !important;
  text-align: left !important;
}

/* Alert/marker container: inline right after the title, flat, left flow. */
.at-a-glance-category-rows .summary-extra-details-container,
.at-a-glance-category-rows .summary-alert-details-only {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}
.at-a-glance-category-rows .summary-symbol-group {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Marker tags: small uniform flat chips, meaningful colors kept. */
.at-a-glance-category-rows .summary-symbol,
.at-a-glance-category-rows .summary-alert {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 21px !important;
  height: 21px !important;
  padding: 0 7px !important;
  border-radius: 6px !important;
  border: 1px solid rgba(31, 41, 51, .16) !important;
  background: #eef2f4 !important;
  color: #33404d !important;
  font-size: .69rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  letter-spacing: .01em !important;
}
.at-a-glance-category-rows .summary-alert-do-not      { background:var(--do-not-soft-bg) !important; border-color:var(--do-not-soft-border) !important; color:var(--do-not-red) !important; }
.at-a-glance-category-rows .summary-alert-code-first  { background:#e9f6ee !important; border-color:#9ccfae !important; color:#1a7a3f !important; }
.at-a-glance-category-rows .summary-alert-exception,
.at-a-glance-category-rows .summary-alert-exception-notice { background:#fff4e8 !important; border-color:#e2bd8f !important; color:#9b5a00 !important; }
.at-a-glance-category-rows .summary-alert-query       { background:#eef4ff !important; border-color:#a9c2ea !important; color:#365f91 !important; }
.at-a-glance-category-rows .summary-alert-note        { background:#fff9db !important; border-color:#dcc98a !important; color:#6b4e00 !important; }
.at-a-glance-category-rows .summary-alert-modifier    { background:#f1eefb !important; border-color:#c3b4e6 !important; color:#4b3a86 !important; }
.at-a-glance-category-rows .summary-detail,
.at-a-glance-category-rows .summary-scenario          { background:#eef2f4 !important; border-color:#bcc7cf !important; color:#40525d !important; }
.at-a-glance-category-rows .summary-modifier-values {
  font-size:.7rem !important; font-weight:700 !important; color:#4b3a86 !important; margin-left:1px !important;
}

/* Code sequence: LEFT-anchored, ICD row then CPT row, evenly spaced chips. */
.at-a-glance-category-rows .summary-sequence-trigger-only,
.at-a-glance-category-rows .ataglance-sequence-quick-change .summary-extra-details-container {
  display: flex !important;
  width: 100% !important;
  justify-content: flex-start !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
}
.at-a-glance-category-rows .summary-sequence-stack-ataglance {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
}
.at-a-glance-category-rows .expanded-summary-sequence-code,
.at-a-glance-category-rows .summary-sequence-code,
.at-a-glance-category-rows .summary-icd-sequence-code,
.at-a-glance-category-rows .summary-cpt-sequence-code {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}
.at-a-glance-category-rows .summary-sequence-text {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  max-width: 100% !important;
  min-height: 21px !important;
  padding: 3px 10px !important;
  border-radius: 6px !important;
  background: var(--summary-sequence-highlight, #eef3f5) !important;
  border: 1px solid rgba(48, 95, 114, .18) !important;
  color: #21414f !important;
  font-size: .73rem !important;
  font-weight: 700 !important;
  line-height: 1.18 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  box-shadow: none !important;
}
.at-a-glance-category-rows .summary-sequence-text.has-summary-sequence-highlight {
  background: color-mix(in srgb, var(--summary-sequence-highlight, #fff09a) 38%, #fff 62%) !important;
  border-color: color-mix(in srgb, var(--summary-sequence-highlight, #fff09a) 55%, rgba(15,23,42,.14)) !important;
  color: #10232d !important;
}
.at-a-glance-category-rows .summary-sequence-text strong {
  font-weight: 900 !important;
  color: #1f4e5f !important;
  flex: 0 0 auto !important;
}
/* Small flat CPT prefix so the CPT row reads clearly under ICD. */
.at-a-glance-category-rows .summary-cpt-sequence-code::before {
  content: "CPT" !important;
  display: inline-flex !important;
  align-items: center !important;
  height: 21px !important;
  padding: 0 6px !important;
  border-radius: 6px !important;
  background: var(--cpt-badge-bg) !important; /* dark yellow */
  color: var(--cpt-badge-fg) !important;      /* dark text for contrast on yellow */
  font-size: .62rem !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  flex: 0 0 auto !important;
}
/* Turn off the older per-chip CPT text prefix so we don't double-label. */
.at-a-glance-category-rows .summary-cpt-sequence-text::before {
  content: none !important;
}
/* Small flat ICD prefix so the ICD row is clearly labeled (only rendered
   when the user has actually filled primary/secondary/tertiary/other). */
.at-a-glance-category-rows .summary-icd-sequence-code::before {
  content: "ICD" !important;
  display: inline-flex !important;
  align-items: center !important;
  height: 21px !important;
  padding: 0 6px !important;
  border-radius: 6px !important;
  background: var(--icd-badge-bg) !important; /* orange */
  color: var(--icd-badge-fg) !important;      /* white text reads well on orange */
  font-size: .62rem !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  flex: 0 0 auto !important;
}
/* Guard against any older per-chip ICD text prefix double-labeling. */
.at-a-glance-category-rows .summary-icd-sequence-text::before {
  content: none !important;
}

/* ============================================================
   V32 — CPT ALWAYS-ON + REORDERED CONTROLS + RED DO NOT
   2026-07-08
   - CPT Code Sequence is always visible, matching the ICD
     Code Sequence in height & width (even 3-column layout:
     ICD stack | CPT stack | checkbox controls on the right).
   - Checkbox order: Code First / DO NOT / Add Note /
     Query Provider / Modifiers / Exception / Bundling / Global.
   - DO NOT toggle is styled red so it stands out.
   ============================================================ */

/* Panel header spans the full width above both sequence stacks. */
.sequence-panel.sequence-panel-dual-cpt > .sequence-panel-header,
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-panel-header {
  grid-column: 1 / -1 !important;
  grid-row: 1 !important;
}

/* Explicit grid placement so header row is separate from the code row. */
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel {
  grid-template-rows: auto auto !important;
}
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-stack {
  grid-column: 1 !important;
  grid-row: 2 !important;
}
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .cpt-sequence-section {
  grid-column: 2 !important;
  grid-row: 2 !important;
}
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-subnote-toggles.clean-control-table {
  grid-column: 3 !important;
  grid-row: 2 !important;
}

/* CPT heading matches the ICD "Code Sequence" label look. */
.cpt-sequence-section .cpt-sequence-heading {
  display: block !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
  color: #1f2933 !important;
  letter-spacing: .01em !important;
  margin: 0 0 5px 0 !important;
  white-space: nowrap !important;
  min-height: 20px !important;
}
/* Nudge the ICD stack down so its first field lines up with CPT's
   first field (CPT has a heading line; ICD's label lives in the header). */
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-stack {
  margin-top: 25px !important;
}

/* Make ICD and CPT stacks identical in width behavior and field sizing. */
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-stack,
.ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .cpt-sequence-section .sequence-stack {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}
.ultra-compact-guideline:has(.cpt-sequence-section) .sequence-stack .sequence-stack-input {
  min-height: 30px !important;
  box-sizing: border-box !important;
}

/* Right-hand controls: a single tidy column of checkboxes. */
.sequence-panel.sequence-panel-dual-cpt .sequence-subnote-toggles.clean-control-table {
  display: flex !important;
  flex-direction: column !important;
}
.sequence-panel.sequence-panel-dual-cpt .sequence-subnote-toggles .sequence-toggle-cell {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  width: 100% !important;
}
.sequence-panel.sequence-panel-dual-cpt .sequence-subnote-toggles .subnote-toggle {
  width: 100% !important;
  justify-content: flex-start !important;
}

/* DO NOT toggle stands out in red. */
.sequence-panel.sequence-panel-dual-cpt .subnote-toggle.do-not-toggle {
  color: var(--do-not-red) !important;
  font-weight: 800 !important;
}
.sequence-panel.sequence-panel-dual-cpt .subnote-toggle.do-not-toggle .do-not-toggle-label {
  color: var(--do-not-red) !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
}
.sequence-panel.sequence-panel-dual-cpt .subnote-toggle.do-not-toggle input[type="checkbox"] {
  accent-color: var(--do-not-red) !important;
}

/* On genuinely narrow cards, stack the three areas top-to-bottom. */
@media (max-width: 900px) {
  .ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-stack {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin-top: 0 !important;
  }
  .ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .cpt-sequence-section {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
  .ultra-compact-guideline:has(.cpt-sequence-section) > .sequence-panel > .sequence-subnote-toggles.clean-control-table {
    grid-column: 1 !important;
    grid-row: 4 !important;
  }
}

/* ============================================================
   DO NOT label spacing fix (web edition)
   The source label text uses a combining enclosing character
   (U+20E0) that overlaps the following letter, so the symbol
   and the words "DO NOT" collide. We hide the raw glyph text
   and rebuild the label cleanly with a proper icon + spacing.
   ============================================================ */
.do-not-toggle .do-not-toggle-label {
  font-size: 0 !important;          /* hide the broken combining glyph text */
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  line-height: 1 !important;
}
.do-not-toggle .do-not-toggle-label::before {
  content: "\1F6AB" !important;     /* clean 🚫 no-entry icon */
  font-size: .82rem !important;
  line-height: 1 !important;
  display: inline-block !important;
}
.do-not-toggle .do-not-toggle-label::after {
  content: "DO NOT" !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  line-height: 1 !important;
  display: inline-block !important;
}
/* Keep the red color harmony inside the CPT sequence panel too */
.sequence-panel.sequence-panel-dual-cpt .do-not-toggle .do-not-toggle-label::after {
  color: var(--do-not-red) !important;
}

/* Same fix for the DO NOT entry-field label ("⃠ DO NOT") */
.guideline-do-not-field .do-not-label > span {
  font-size: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  line-height: 1 !important;
}
.guideline-do-not-field .do-not-label > span::before {
  content: "\1F6AB" !important;
  font-size: .78rem !important;
  line-height: 1 !important;
  display: inline-block !important;
}
.guideline-do-not-field .do-not-label > span::after {
  content: "DO NOT" !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  line-height: 1 !important;
  color: #9f1239 !important;
  display: inline-block !important;
}