.arthurian-timeline-root {
  --at-background: #d9dfd0;
  --at-foreground: #29352c;
  --at-card: #f2eee6;
  --at-primary: #a8443f;
  --at-secondary: #bdcbae;
  --at-muted: #d0d8ca;
  --at-muted-text: #526257;
  --at-border: #94a28f;
  --at-parchment: #eadbd5;
  --at-early: #5e805f;
  --at-chronicle: #b84f46;
  --at-romance: #4f7f62;
  --at-grail: #c06959;
  --at-english: #963f43;
  --at-modern: #52715b;
  --at-line: #607965;
  position: relative;
  left: 50%;
  width: min(1760px, calc(100vw - 24px));
  max-width: none !important;
  margin: 0 0 2rem;
  transform: translateX(-50%);
  color: var(--at-foreground);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  text-align: left;
}

.arthurian-timeline-root *,
.arthurian-timeline-root *::before,
.arthurian-timeline-root *::after { box-sizing: border-box; }

.arthurian-timeline-root button,
.arthurian-timeline-root input,
.arthurian-timeline-root select { font: inherit; }

.arthurian-timeline-loading,
.at-error {
  border: 1px solid #94a28f;
  border-radius: 18px;
  padding: 2rem;
  background: #f2eee6;
  color: #29352c;
  text-align: center;
}

.at-shell {
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--at-border) 78%, transparent);
  border-radius: 28px;
  padding: 20px;
  background-color: var(--at-background);
  background-image:
    radial-gradient(circle at 10% 0%, rgba(255, 250, 245, .84), transparent 30rem),
    radial-gradient(circle at 88% 18%, rgba(168, 68, 63, .20), transparent 32rem),
    linear-gradient(135deg, rgba(211, 224, 207, .94), rgba(236, 215, 210, .76));
  box-shadow: 0 28px 100px rgba(74, 54, 51, .18);
}

.at-brandbar { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.at-sigil {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--at-primary) 55%, transparent);
  border-radius: 50% 50% 42% 58%;
  background: color-mix(in srgb, var(--at-primary) 10%, var(--at-card));
  color: var(--at-primary);
  font: 700 22px/1 Georgia, serif;
  transform: rotate(-8deg);
}
.at-brand-title { font-family: Georgia, "Times New Roman", serif; font-size: clamp(22px, 3vw, 34px); font-weight: 700; letter-spacing: -.03em; }
.at-intro { max-width: 850px; margin: 0 0 18px; color: var(--at-muted-text); font-size: 14px; line-height: 1.7; }

.at-primer {
  display: grid;
  grid-template-columns: auto repeat(3, minmax(0, 1fr));
  align-items: center;
  gap: 20px;
  margin: 0 0 14px;
  border: 1px solid color-mix(in srgb, var(--at-border) 78%, transparent);
  border-radius: 22px;
  padding: 14px 18px;
  background: color-mix(in srgb, var(--at-card) 62%, transparent);
}
.at-primer h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 20px; line-height: 1.2; letter-spacing: -.02em; }
.at-primer p { margin: 0; color: var(--at-muted-text); font-size: 12px; line-height: 1.65; }
.at-primer strong { color: var(--at-foreground); }

.at-controls { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 10px; }
.at-search-wrap { position: relative; width: min(100%, 360px); }
.at-search-icon { position: absolute; left: 14px; top: 50%; z-index: 1; transform: translateY(-52%); color: var(--at-muted-text); font-size: 21px; }
.at-search,
.at-tradition-select {
  height: 44px;
  margin: 0 !important;
  border: 1px solid color-mix(in srgb, var(--at-border) 80%, transparent) !important;
  border-radius: 999px !important;
  background: var(--at-card) !important;
  color: var(--at-foreground) !important;
  box-shadow: 0 2px 8px rgba(41, 53, 44, .05);
  outline: none;
  font-size: 14px;
}
.at-search { width: 100%; padding: 0 16px 0 42px !important; }
.at-tradition-select { min-width: 180px; padding: 0 38px 0 16px !important; }
.at-search:focus,
.at-tradition-select:focus { border-color: var(--at-primary) !important; box-shadow: 0 0 0 3px rgba(168, 68, 63, .16); }
.at-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.at-trace { display: flex; align-items: center; gap: 7px; margin: 0 0 12px; overflow-x: auto; padding-bottom: 3px; scrollbar-width: thin; }
.at-trace-label { flex: none; margin-right: 2px; color: var(--at-muted-text); font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.at-chip,
.at-character-list button,
.at-related-list button {
  border: 1px solid var(--at-border) !important;
  background: color-mix(in srgb, var(--at-card) 75%, transparent) !important;
  color: var(--at-foreground) !important;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
}
.at-chip { flex: none; min-height: 32px; border-radius: 999px !important; padding: 5px 12px !important; font-size: 12px; line-height: 1.2; }
.at-chip:hover,
.at-character-list button:hover,
.at-related-list button:hover { border-color: var(--at-primary) !important; }
.at-chip.is-active,
.at-character-list button.is-active { border-color: var(--at-primary) !important; background: var(--at-primary) !important; color: white !important; }

.at-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--at-border) 80%, transparent);
  border-radius: 28px;
  background: var(--at-card);
  box-shadow: 0 24px 70px rgba(74, 54, 51, .16);
}

.at-graph-panel {
  position: relative;
  min-width: 0;
  min-height: 640px;
  overflow: hidden;
  background-color: #c3ceb8;
  background-image:
    radial-gradient(circle at 18% 24%, rgba(250, 247, 237, .76), transparent 19rem),
    radial-gradient(circle at 82% 70%, rgba(168, 68, 63, .20), transparent 22rem),
    radial-gradient(rgba(67, 105, 75, .22) .7px, transparent .8px);
  background-size: auto, auto, 21px 21px;
}
.at-graph-toolbar {
  position: absolute;
  inset: 0 0 auto;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 52px;
  gap: 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--at-border) 50%, transparent);
  padding: 9px 16px;
  background: color-mix(in srgb, var(--at-card) 90%, transparent);
  backdrop-filter: blur(12px);
}
.at-count { margin: 0; color: var(--at-muted-text); font-size: 12px; }
.at-count strong { color: var(--at-foreground); }
.at-zoom-controls { display: flex; align-items: center; gap: 2px; }
.at-zoom-controls button {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--at-foreground) !important;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}
.at-zoom-controls button:hover { background: var(--at-muted) !important; }
.at-zoom-value { width: 42px; color: var(--at-muted-text); font-size: 10px; text-align: center; font-variant-numeric: tabular-nums; }
.at-graph-scroll { position: absolute; inset: 0; overflow: auto; padding-top: 52px; scrollbar-color: #879c86 transparent; scrollbar-width: thin; }
.at-network-svg { display: block; width: 1840px; height: 590px; max-width: none !important; }
.at-zoom-layer { transition: transform 180ms ease; }
.at-graph-grid line { stroke: #95a28f; stroke-width: 1; stroke-dasharray: 2 10; }
.at-timeline-axis line { stroke: #58735d; stroke-width: 1.2; opacity: .84; }
.at-timeline-axis text { fill: #3f5745; font-size: 11px; font-weight: 780; letter-spacing: .04em; }
.at-era-bands text { fill: #526653; font-size: 11px; font-weight: 750; letter-spacing: .13em; }
.at-arrow-head { fill: var(--at-line); }
.at-edge { fill: none; stroke: var(--at-line); stroke-width: 1.2; opacity: .5; transition: opacity 180ms ease, stroke 180ms ease, stroke-width 180ms ease; }
.at-edge.tradition { stroke-dasharray: 4 6; }
.at-edge.resonance { stroke-dasharray: 1 7; }
.at-edge.is-related { stroke: var(--at-primary); stroke-width: 2.1; opacity: .95; }
.at-edge.is-muted { opacity: .08; }
.at-node { cursor: pointer; outline: none; transition: opacity 180ms ease; }
.at-node-hit { fill: transparent; pointer-events: all; }
.at-node-disc { stroke-width: 1.5; fill-opacity: .20; }
.at-node-core { stroke: none; }
.at-node-halo { fill: none; stroke-width: 1.7; stroke-dasharray: 3 5; opacity: .85; animation: at-spin 18s linear infinite; transform-origin: center; }
.at-node:hover .at-node-disc,
.at-node:focus .at-node-disc,
.at-node.is-active .at-node-disc { fill-opacity: .96; }
.at-node.is-related .at-node-disc { fill-opacity: .48; }
.at-node.is-muted { opacity: .13; }
.at-node-date { fill: #354b3a; font-size: 10.5px; font-weight: 750; letter-spacing: .04em; }
.at-node-title { color: #29352c; font: 720 12px/1.15 Inter, ui-sans-serif, system-ui, sans-serif; text-align: center; }
.at-early { fill: var(--at-early); stroke: var(--at-early); background: var(--at-early); }
.at-chronicle { fill: var(--at-chronicle); stroke: var(--at-chronicle); background: var(--at-chronicle); }
.at-romance { fill: var(--at-romance); stroke: var(--at-romance); background: var(--at-romance); }
.at-grail { fill: var(--at-grail); stroke: var(--at-grail); background: var(--at-grail); }
.at-english { fill: var(--at-english); stroke: var(--at-english); background: var(--at-english); }
.at-modern { fill: var(--at-modern); stroke: var(--at-modern); background: var(--at-modern); }

.at-dossier {
  max-height: 640px;
  overflow-y: auto;
  border-left: 1px solid var(--at-border);
  padding: 28px;
  background-image: radial-gradient(circle at 94% 10%, rgba(168, 68, 63, .18), transparent 18rem), linear-gradient(145deg, rgba(242, 238, 230, .98), rgba(224, 225, 207, .95));
  scrollbar-color: #879c86 transparent;
  scrollbar-width: thin;
}
.at-selected-label { display: flex; align-items: center; gap: 8px; color: #8f3f3b; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.at-dot { display: inline-block; width: 8px; height: 8px; flex: none; border-radius: 50%; }
.at-dossier h2 { margin: 12px 0 0; color: var(--at-foreground); font-family: Georgia, "Times New Roman", serif; font-size: 30px; line-height: 1; letter-spacing: -.035em; }
.at-byline { margin: 9px 0 0; color: var(--at-muted-text); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.at-entry-copy { margin-top: 20px; }
.at-entry-copy p { margin: 0 0 15px; color: color-mix(in srgb, var(--at-foreground) 92%, transparent); font-size: 14px; line-height: 1.75; }
.at-quote-card { margin-top: 24px; border: 1px solid color-mix(in srgb, var(--at-border) 72%, transparent); border-radius: 22px; padding: 19px; background: color-mix(in srgb, var(--at-card) 58%, transparent); }
.at-quote-card blockquote { margin: 0; border: 0; padding: 0; color: var(--at-foreground); font: 500 20px/1.42 Georgia, "Times New Roman", serif; }
.at-quote-note { margin: 8px 0 0; color: var(--at-muted-text); font-size: 10px; line-height: 1.55; }
.at-small-heading { margin: 19px 0 7px; font-size: 12px; font-weight: 800; }
.at-character-list,
.at-related-list { display: flex; flex-wrap: wrap; gap: 6px; }
.at-character-list button { border-radius: 999px !important; padding: 5px 9px !important; font-size: 11px; line-height: 1.2; }
.at-related-list button { border-radius: 8px !important; padding: 6px 9px !important; font-size: 11px; line-height: 1.25; }
.at-source-link { display: inline-flex; margin-top: 20px; color: var(--at-primary) !important; font-size: 12px; font-weight: 750; text-decoration: none !important; }
.at-source-link:hover { text-decoration: underline !important; }

.at-category-guide { margin-top: 15px; border: 1px solid color-mix(in srgb, var(--at-border) 80%, transparent); border-radius: 24px; padding: 20px; background: color-mix(in srgb, var(--at-card) 84%, transparent); }
.at-category-guide > h2,
.at-sources h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 22px; line-height: 1.2; letter-spacing: -.025em; }
.at-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.at-category-grid article { border: 1px solid color-mix(in srgb, var(--at-border) 70%, transparent); border-radius: 16px; padding: 14px; background: color-mix(in srgb, var(--at-card) 60%, transparent); }
.at-category-name { display: flex; align-items: center; gap: 8px; }
.at-category-name h3 { margin: 0; color: var(--at-foreground); font-size: 14px; }
.at-category-grid p { margin: 7px 0 0; color: var(--at-muted-text); font-size: 12px; line-height: 1.6; }

.at-sources { display: grid; grid-template-columns: .8fr 1.2fr; gap: 30px; margin-top: 35px; border-top: 1px solid var(--at-border); padding: 28px 4px 6px; }
.at-sources > div > p { max-width: 600px; margin: 10px 0 0; color: var(--at-muted-text); font-size: 13px; line-height: 1.7; }
.at-source-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.at-source-grid a { display: flex; flex-direction: column; border: 1px solid color-mix(in srgb, var(--at-border) 72%, transparent); border-radius: 14px; padding: 13px; background: color-mix(in srgb, var(--at-card) 65%, transparent); color: var(--at-foreground) !important; text-decoration: none !important; }
.at-source-grid a:hover { border-color: var(--at-primary); }
.at-source-grid strong { font-size: 13px; }
.at-source-grid span { margin-top: 4px; color: var(--at-muted-text); font-size: 11px; line-height: 1.55; }

@keyframes at-spin { to { transform: rotate(360deg); } }

@media (max-width: 1179px) {
  .at-workspace { grid-template-columns: minmax(0, 1fr); }
  .at-dossier { max-height: none; border-top: 1px solid var(--at-border); border-left: 0; }
}

@media (max-width: 900px) {
  .at-primer { grid-template-columns: 1fr; gap: 7px; }
  .at-primer p { padding-left: 0; }
  .at-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .at-sources { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .arthurian-timeline-root { width: min(100%, calc(100vw - 12px)); }
  .at-shell { border-radius: 18px; padding: 12px; }
  .at-brand-title { font-size: 23px; }
  .at-controls { flex-direction: column; }
  .at-search-wrap,
  .at-tradition-select { width: 100%; }
  .at-graph-panel { min-height: 620px; }
  .at-network-svg { width: 1650px; height: 590px; }
  .at-count span { display: none; }
  .at-dossier { padding: 21px 17px; }
  .at-category-grid,
  .at-source-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .at-node-halo { animation: none; }
  .at-zoom-layer,
  .at-edge,
  .at-node { transition: none; }
}

/* Space-theme bridge: the timeline keeps its map layout but inherits the
   personal site's dark, lavender, rose, and teal visual language. */
.arthurian-timeline-root {
  --at-background: #0a0a25;
  --at-foreground: #f2efff;
  --at-card: #151538;
  --at-card-soft: #1c1b48;
  --at-primary: #e77fa6;
  --at-secondary: #5eead4;
  --at-muted: #262554;
  --at-muted-text: #b8b0d5;
  --at-border: #514f88;
  --at-line: #8d83c7;
  --at-early: #71c9ba;
  --at-chronicle: #e5a078;
  --at-romance: #d0a5ef;
  --at-grail: #f1c66f;
  --at-english: #ed8fa9;
  --at-modern: #a39bff;
  color: var(--at-foreground);
  font-family: Nunito, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.arthurian-timeline-loading,
.at-error { border-color: var(--at-border); background: var(--at-card); color: var(--at-foreground); }
.at-shell {
  position: relative;
  border-color: color-mix(in srgb, var(--at-border) 82%, transparent);
  background-color: var(--at-background);
  background-image:
    radial-gradient(circle at 8% 0%, rgba(119, 104, 255, .30), transparent 28rem),
    radial-gradient(circle at 92% 17%, rgba(231, 127, 166, .22), transparent 30rem),
    radial-gradient(circle at 35% 72%, rgba(94, 234, 212, .10), transparent 25rem),
    radial-gradient(rgba(220, 213, 255, .26) .65px, transparent .8px),
    linear-gradient(145deg, #10102f, #0a0a25 65%, #151038);
  background-size: auto, auto, auto, 25px 25px, auto;
  box-shadow: 0 28px 100px rgba(4, 3, 22, .55);
}
.at-shell::after {
  position: absolute;
  top: 50px;
  right: 4%;
  width: 160px;
  height: 160px;
  border: 1px solid rgba(231, 127, 166, .23);
  border-radius: 50%;
  box-shadow: 0 0 0 15px rgba(231, 127, 166, .05), 0 0 0 33px rgba(94, 234, 212, .04);
  content: "";
  pointer-events: none;
}
.at-brandbar,
.at-intro,
.at-primer,
.at-controls,
.at-trace { position: relative; z-index: 1; }
.at-sigil { border-color: color-mix(in srgb, var(--at-secondary) 70%, transparent); background: rgba(94, 234, 212, .10); color: var(--at-secondary); font-family: "Cormorant Garamond", Georgia, serif; box-shadow: 0 0 18px rgba(94, 234, 212, .22); }
.at-brand-title,
.at-primer h2,
.at-dossier h2,
.at-quote-card blockquote,
.at-category-guide > h2,
.at-sources h2 { font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif; }
.at-intro,
.at-primer p { color: var(--at-muted-text); }
.at-primer { border-color: color-mix(in srgb, var(--at-border) 78%, transparent); background: rgba(21, 21, 56, .70); box-shadow: inset 0 1px rgba(255, 255, 255, .04); }
.at-primer strong { color: var(--at-foreground); }
.at-search,
.at-tradition-select { border-color: color-mix(in srgb, var(--at-border) 80%, transparent) !important; background: rgba(21, 21, 56, .94) !important; color: var(--at-foreground) !important; box-shadow: 0 4px 18px rgba(4, 3, 22, .20); }
.at-search:focus,
.at-tradition-select:focus { border-color: var(--at-secondary) !important; box-shadow: 0 0 0 3px rgba(94, 234, 212, .18); }
.at-chip,
.at-character-list button,
.at-related-list button { border-color: var(--at-border) !important; background: rgba(21, 21, 56, .72) !important; color: var(--at-foreground) !important; }
.at-chip:hover,
.at-character-list button:hover,
.at-related-list button:hover { border-color: var(--at-secondary) !important; }
.at-chip.is-active,
.at-character-list button.is-active { border-color: var(--at-secondary) !important; background: var(--at-secondary) !important; color: #10102f !important; }
.at-workspace { position: relative; z-index: 1; border-color: color-mix(in srgb, var(--at-border) 80%, transparent); background: #0e0e2c; box-shadow: 0 24px 70px rgba(4, 3, 22, .36); }
.at-graph-panel { background-color: #0e0e2c; background-image: radial-gradient(circle at 18% 24%, rgba(111, 98, 255, .18), transparent 19rem), radial-gradient(circle at 82% 70%, rgba(231, 127, 166, .14), transparent 22rem), radial-gradient(rgba(220, 213, 255, .22) .65px, transparent .8px), linear-gradient(145deg, #111139, #0c0c29 72%); background-size: auto, auto, 21px 21px, auto; }
.at-graph-toolbar { border-bottom-color: color-mix(in srgb, var(--at-border) 50%, transparent); background: rgba(14, 14, 44, .82); }
.at-count,
.at-zoom-value { color: var(--at-muted-text); }
.at-count strong { color: var(--at-foreground); }
.at-zoom-controls button { color: var(--at-foreground) !important; }
.at-zoom-controls button:hover { background: rgba(94, 234, 212, .14) !important; }
.at-graph-scroll { scrollbar-color: #605a9b transparent; }
.at-graph-grid line { stroke: #34345f; }
.at-timeline-axis line { stroke: #aaa1e8; }
.at-timeline-axis text { fill: #ded8ff; }
.at-era-bands text { fill: #aaa1db; }
.at-edge { stroke: var(--at-line); }
.at-edge.is-related { stroke: var(--at-primary); filter: drop-shadow(0 0 4px rgba(231, 127, 166, .45)); }
.at-node-date { fill: #e5ddff; }
.at-node-title { color: #f2efff; font-family: Nunito, ui-sans-serif, system-ui, sans-serif; text-shadow: 0 1px 8px rgba(4, 3, 22, .9); }
.at-node-title-left { text-align: right; }
.at-dossier { border-left-color: var(--at-border); background-image: radial-gradient(circle at 94% 10%, rgba(231, 127, 166, .18), transparent 18rem), linear-gradient(145deg, rgba(22, 22, 56, .98), rgba(12, 12, 39, .98)); scrollbar-color: #605a9b transparent; }
.at-selected-label { color: var(--at-secondary); }
.at-dossier h2 { color: var(--at-foreground); }
.at-byline { color: var(--at-muted-text); }
.at-fact-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: 18px; }
.at-fact-grid div { border: 1px solid rgba(81, 79, 136, .72); border-radius: 12px; padding: 9px 10px; background: rgba(21, 21, 56, .65); }
.at-fact-grid span { display: block; color: var(--at-muted-text); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.at-fact-grid strong { display: block; margin-top: 3px; color: var(--at-foreground); font-size: 11px; line-height: 1.25; }
.at-entry-copy p { color: #e1dcf6; }
.at-quote-card { border-color: color-mix(in srgb, var(--at-border) 72%, transparent); background: rgba(21, 21, 56, .64); }
.at-quote-card blockquote { color: var(--at-foreground); }
.at-quote-note { color: var(--at-muted-text); }
.at-small-heading { color: var(--at-secondary); }
.at-category-guide { position: relative; z-index: 1; border-color: color-mix(in srgb, var(--at-border) 80%, transparent); background: rgba(21, 21, 56, .76); }
.at-category-guide > h2,
.at-sources h2 { color: var(--at-foreground); }
.at-category-grid article,
.at-source-grid a { border-color: color-mix(in srgb, var(--at-border) 70%, transparent); background: rgba(13, 13, 42, .72); }
.at-category-grid p,
.at-sources > div > p,
.at-source-grid span { color: var(--at-muted-text); }
.at-category-name h3,
.at-source-grid a { color: var(--at-foreground) !important; }
.at-source-grid a:hover { border-color: var(--at-secondary); box-shadow: 0 0 18px rgba(94, 234, 212, .12); }
.at-sources { position: relative; z-index: 1; border-top-color: var(--at-border); }
.at-reading-links { display: flex; flex-wrap: wrap; gap: 6px; }
.at-reading-link { display: inline-flex; border: 1px solid rgba(231, 127, 166, .52); border-radius: 999px; padding: 6px 10px; background: rgba(231, 127, 166, .11); color: #ffd6e6 !important; font-size: 11px; font-weight: 750; line-height: 1.2; text-decoration: none !important; }
.at-reading-link:hover { border-color: var(--at-secondary); background: rgba(94, 234, 212, .12); color: #e5fffa !important; }

/* The graph is intentionally wider than the card: horizontal scrolling keeps
   dates legible instead of compressing late works into the medieval cluster. */
.at-network-svg { width: 2480px; height: 1320px; }

.at-figure-guide {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(210px, .7fr) minmax(0, 1.3fr);
  gap: 22px;
  margin-top: 15px;
  border: 1px solid color-mix(in srgb, var(--at-border) 80%, transparent);
  border-radius: 24px;
  padding: 24px;
  background: rgba(21, 21, 56, .76);
}
.at-section-kicker { margin: 0 0 8px; color: var(--at-secondary); font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.at-figure-guide h2 { margin: 0; color: var(--at-foreground); font: 400 28px/1.05 "Cormorant Garamond", Georgia, serif; }
.at-figure-guide-intro > p:last-child { margin: 14px 0 0; color: var(--at-muted-text); font-size: 13px; line-height: 1.65; }
.at-character-browser { min-width: 0; }
.at-character-picker { display: flex; flex-wrap: wrap; gap: 7px; }
.at-character-tab { border: 1px solid var(--at-border) !important; border-radius: 999px !important; padding: 7px 11px !important; background: rgba(13, 13, 42, .72) !important; color: var(--at-foreground) !important; cursor: pointer; font-size: 11px; line-height: 1.1; transition: border-color 180ms ease, background 180ms ease, transform 180ms ease; }
.at-character-tab:hover { transform: translateY(-1px); border-color: var(--at-secondary) !important; }
.at-character-tab.is-active { border-color: var(--at-secondary) !important; background: var(--at-secondary) !important; color: #10102f !important; }
.at-character-detail { margin-top: 13px; border: 1px solid color-mix(in srgb, var(--at-border) 70%, transparent); border-radius: 18px; padding: 17px; background: rgba(13, 13, 42, .72); }
.at-character-heading h3 { margin: 0; color: var(--at-foreground); font: 400 29px/1 "Cormorant Garamond", Georgia, serif; }
.at-character-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 15px 0 0; }
.at-character-facts div { border: 1px solid rgba(81, 79, 136, .72); border-radius: 11px; padding: 9px 10px; background: rgba(21, 21, 56, .62); }
.at-character-facts dt { color: var(--at-muted-text); font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.at-character-facts dd { margin: 4px 0 0; color: var(--at-foreground); font-size: 12px; line-height: 1.4; }
.at-character-copy { margin-top: 15px; }
.at-character-copy p { margin: 0 0 12px; color: #e1dcf6; font-size: 13px; line-height: 1.7; }
.at-character-copy p:last-child { margin-bottom: 0; }

@media (max-width: 640px) {
  .at-fact-grid { grid-template-columns: 1fr; }
  .at-figure-guide { grid-template-columns: 1fr; padding: 18px; }
  .at-character-facts { grid-template-columns: 1fr; }
  .at-network-svg { width: 2480px; height: 1320px; }
}