/* Font import for Old Standard TT (Didot-style Greek) + Cardo + JetBrains Mono */
@import url('https://fonts.googleapis.com/css2?family=Old+Standard+TT:ital,wght@0,400;0,700;1,400&family=Cardo:ital,wght@0,400;0,700;1,400&family=JetBrains+Mono:wght@400;600&display=swap');

/* Greek-glyph polish: nudge Cardo Greek slightly lower for descender clarity */
.greek, [lang="grc"], [lang="el"] {
  font-feature-settings: "kern" 1, "liga" 1;
}

/* PROIEL tree visualisation - inherits Lavidas typography */
.proiel-tree {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.85rem;
  line-height: 1.9;
  margin: 1rem 0;
}
.proiel-tree .pt-node {
  display: flex;
  gap: 14px;
  align-items: baseline;
  padding: 1px 0;
}
.proiel-tree .pt-node[data-depth="0"]::before { content: "• "; color: #777; }
.proiel-tree .pt-node[data-depth="1"]::before,
.proiel-tree .pt-node[data-depth="2"]::before,
.proiel-tree .pt-node[data-depth="3"]::before,
.proiel-tree .pt-node[data-depth="4"]::before { content: "└─ "; color: #777; }
.proiel-tree .pt-id { color: #777; min-width: 28px; }
.proiel-tree .pt-rel { color: #111; font-style: italic; min-width: 72px; }
.proiel-tree .pt-form { font-family: "Old Standard TT", serif; font-size: 1.1rem; color: #111; min-width: 90px; }
.proiel-tree .pt-lemma { font-family: "Old Standard TT", serif; font-style: italic; color: #444; min-width: 80px; }
.proiel-tree .pt-pos { color: #777; font-size: 0.78em; min-width: 40px; }
.proiel-tree .pt-feat { color: #777; font-size: 0.78em; max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Citation block: monospace DOI with subtle frame */
.citation-block {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.85rem;
  border-left: 2px solid #aaa;
  padding: 0.6rem 0 0.6rem 1rem;
  margin: 1.2rem 0;
  color: #333;
}

/* Hide colored Quarto announcement / callout backgrounds */
.callout.callout-note, .callout.callout-tip, .callout.callout-important,
.callout.callout-warning, .callout.callout-caution {
  background: transparent !important;
  border-left: 2px solid #aaa !important;
}
.callout-header { background: transparent !important; }

/* ============================================================
   PROIEL sample blocks (samples.qmd)
   .proiel-tree    -- ASCII-art dependency tree, monospaced
   .proiel-arg     -- argument-structure frame table
   .proiel-xml     -- raw PROIEL XML 2.0 code block
   .proiel-key     -- legend block (italic serif)
   ============================================================ */

.proiel-tree pre,
.proiel-tree code {
  font-family: "JetBrains Mono", "DejaVu Sans Mono", monospace !important;
  font-size: 0.92rem !important;
  line-height: 1.6 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 2px solid #aaa !important;
  border-radius: 0 !important;
  padding: 0.8rem 0 0.8rem 1rem !important;
  margin: 0.4rem 0 1rem 0 !important;
  white-space: pre !important;
  color: #111 !important;
  overflow-x: auto;
}

.proiel-arg table {
  font-family: "Old Standard TT", "Cardo", Georgia, serif !important;
  font-size: 0.95rem !important;
  border-collapse: collapse !important;
  width: 100%;
  margin: 0.4rem 0 1.2rem 0 !important;
}
.proiel-arg th {
  text-align: left;
  border-bottom: 2px solid #aaa;
  padding: 0.4rem 0.6rem;
  font-weight: 600;
  font-style: normal;
  color: #111;
}
.proiel-arg td {
  border-bottom: 1px solid #ddd;
  padding: 0.4rem 0.6rem;
  color: #111;
}
.proiel-arg tr:last-child td { border-bottom: 1px solid #aaa; }

.proiel-xml pre,
.proiel-xml code {
  font-family: "JetBrains Mono", "DejaVu Sans Mono", monospace !important;
  font-size: 0.82rem !important;
  line-height: 1.45 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 2px solid #aaa !important;
  border-radius: 0 !important;
  padding: 0.6rem 0 0.6rem 1rem !important;
  margin: 0.4rem 0 1.2rem 0 !important;
  white-space: pre !important;
  color: #222 !important;
  overflow-x: auto;
  letter-spacing: -0.01em;
}

.proiel-key {
  font-style: italic;
  color: #555;
  font-size: 0.92rem;
  border-left: 2px solid #aaa;
  padding: 0.4rem 0 0.4rem 1rem;
  margin: 1rem 0;
}

/* Section separators on samples.qmd: replace default hr with thin double rule */
.quarto-document-content hr {
  border: 0;
  border-top: 1px solid #aaa;
  margin: 2.4rem 0;
}

/* ============================================================
   AthDGC PROIEL house-style review format (samples.qmd)
   ------------------------------------------------------------
   .proiel-frame       -- argument-structure synopsis table
   .proiel-review      -- token-by-token review table
   .proiel-tree-color  -- compact dependency overview, colored
   .proiel-legend      -- relation-colour legend strip
   .rel.rel-<NAME>     -- colored relation label, used inline

   Colour palette (Lavidasized academic, subdued; no neon, no
   AI-block fills, only ink-with-hue):
     pred       deep burgundy (the verb anchors the clause)
     sub        deep navy     (primary core argument)
     obj        teal          (secondary core argument)
     iobj       plum
     obl        sage          (oblique / agent / instrument)
     atr        ochre         (adnominal modifier)
     adv        warm ochre    (adverbial)
     voc        amber         (discourse: addressee)
     aux        gray          (auxiliary / article)
     xcomp/comp dusty plum    (embedded clause)
     coord      neutral grey  (coordination)
   ============================================================ */

.rel {
  font-style: italic;
  font-family: 'Old Standard TT', Cardo, Georgia, serif;
  letter-spacing: 0.01em;
}
.rel-pred   { color: #6b2c2c; }
.rel-sub    { color: #1f3050; }
.rel-obj    { color: #2c5d5d; }
.rel-iobj   { color: #5a3d6b; }
.rel-obl    { color: #3d5a3d; }
.rel-atr    { color: #7d5a2c; }
.rel-adv    { color: #8a6d2c; }
.rel-voc    { color: #a06a1c; }
.rel-aux    { color: #777777; }
.rel-xcomp,
.rel-comp   { color: #6b3d5d; }
.rel-coord  { color: #555555; }

/* .tk -- token form inside the colored tree, slightly bolder Old Standard TT */
.proiel-tree-color .tk {
  font-family: 'Old Standard TT', Cardo, Georgia, serif;
  font-weight: 600;
  color: #111;
}

.proiel-tree-color pre {
  font-family: 'JetBrains Mono', 'DejaVu Sans Mono', monospace !important;
  font-size: 0.92rem !important;
  line-height: 1.7 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 2px solid #aaa !important;
  border-radius: 0 !important;
  padding: 0.7rem 0 0.7rem 1rem !important;
  margin: 0.5rem 0 1.2rem 0 !important;
  white-space: pre !important;
  color: #111 !important;
  overflow-x: auto;
}
.proiel-tree-color pre .tk,
.proiel-tree-color pre .rel {
  font-family: 'Old Standard TT', Cardo, Georgia, serif !important;
  font-size: 1.02rem;
}
.proiel-tree-color pre .rel {
  font-weight: 600;
  font-style: italic;
}

/* .proiel-frame -- argument-structure synopsis */
.proiel-frame table {
  font-family: 'Old Standard TT', Cardo, Georgia, serif !important;
  font-size: 1.0rem !important;
  border-collapse: collapse !important;
  width: 100%;
  margin: 0.4rem 0 1.4rem 0;
}
.proiel-frame th,
.proiel-frame td {
  text-align: left;
  border-bottom: 1px solid #ddd;
  padding: 0.45rem 0.7rem;
  vertical-align: top;
  color: #111;
}
.proiel-frame tr:first-child td:first-child,
.proiel-frame tr:first-child th:first-child {
  border-bottom: 2px solid #aaa;
}
.proiel-frame tr:last-child td { border-bottom: 1px solid #aaa; }

/* .proiel-review -- the token-by-token review table */
.proiel-review table {
  font-family: 'Old Standard TT', Cardo, Georgia, serif !important;
  font-size: 0.96rem !important;
  border-collapse: collapse !important;
  width: 100%;
  margin: 0.4rem 0 1.4rem 0;
}
.proiel-review th {
  text-align: left;
  border-bottom: 2px solid #aaa;
  padding: 0.45rem 0.55rem;
  font-weight: 600;
  font-style: normal;
  font-size: 0.86rem;
  color: #555;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.proiel-review td {
  border-bottom: 1px solid #ddd;
  padding: 0.42rem 0.55rem;
  vertical-align: top;
  color: #111;
}
.proiel-review tr:last-child td { border-bottom: 1px solid #aaa; }
.proiel-review td:nth-child(1) {  /* # */
  color: #888;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.86rem;
}
.proiel-review td:nth-child(5) {  /* morphology */
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.86rem;
  color: #444;
}
.proiel-review td:nth-child(6) {  /* head ref */
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.86rem;
  color: #444;
}

/* .proiel-legend -- horizontal strip of relation labels */
.proiel-legend {
  font-size: 0.92rem;
  line-height: 1.9;
  border-left: 2px solid #aaa;
  padding: 0.5rem 0 0.5rem 1rem;
  margin: 0.6rem 0 1.4rem 0;
  color: #444;
}
.proiel-legend .rel {
  display: inline-block;
  padding: 0 0.1rem;
}

/* ============================================================
   Valency frame (samples.qmd / .valency-frame)
   Predicate-argument display: voice/aspect/mood tags, slot table,
   linear-bracketed form. Used for the Iliad 1.1 review demo.
   ============================================================ */
.valency-frame {
  border-left: 2px solid #aaa;
  padding: 0.6rem 0 0.4rem 1.1rem;
  margin: 0.5rem 0 1.6rem 0;
}
.vf-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.6rem;
  margin-bottom: 0.7rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #ddd;
}
.vf-pred {
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-size: 1.5rem;
  font-weight: 700;
  color: #6b2c2c;
  letter-spacing: 0.01em;
}

/* ============================================================
   One-glance PROIEL card (samples.qmd / .one-glance)
   Simplest possible viz: one row per token in reading order
   with id, form, head pointer, coloured relation. Five columns,
   monospaced for the numeric cells, Old Standard TT for forms.
   ============================================================ */
.one-glance {
  border-left: 2px solid #aaa;
  padding: 0.6rem 0 0.4rem 1.1rem;
  margin: 0.5rem 0 1.6rem 0;
}
.og {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-size: 1.0rem;
  line-height: 1.55;
}
.og-head, .og-row {
  display: grid;
  grid-template-columns: 2.2rem 8rem 1fr 5.5rem;
  gap: 0.7rem;
  align-items: baseline;
  padding: 0.32rem 0.1rem;
  border-bottom: 1px solid #eee;
}
.og-head {
  border-bottom: 2px solid #aaa;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.74rem;
  letter-spacing: 0.06em;
  color: #555;
  font-weight: 600;
  text-transform: uppercase;
}
.og-row:last-child { border-bottom: 1px solid #aaa; }
.og-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.86rem;
  color: #888;
  text-align: right;
}
.og-tk {
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-size: 1.1rem;
  color: #111;
}
.og-pointer {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.86rem;
  color: #555;
}
.og-rel {
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-style: italic;
  font-weight: 600;
}
.og-root .og-pointer {
  font-style: italic;
  color: #777;
}
.og-relhead { font-family: inherit; }

@media (max-width: 640px) {
  .og-head, .og-row {
    grid-template-columns: 1.6rem 1fr 4.5rem;
  }
  .og-pointer { grid-column: 1 / -1; padding-left: 1.6rem; }
}
.vf-lemma {
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-size: 0.95rem;
  font-style: italic;
  color: #555;
}
.vf-tags {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-left: auto;
}
.vf-tag {
  display: inline-block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.74rem;
  letter-spacing: 0.03em;
  padding: 0.1rem 0.5rem;
  border: 1px solid #aaa;
  color: #333;
  background: transparent;
  white-space: nowrap;
}
.vf-tag.vf-pos    { border-color: #6b2c2c; color: #6b2c2c; }
.vf-tag.vf-voice  { border-color: #2c5d5d; color: #2c5d5d; }
.vf-tag.vf-aspect { border-color: #3d5a3d; color: #3d5a3d; }
.vf-tag.vf-mood   { border-color: #7d5a2c; color: #7d5a2c; }
.vf-tag.vf-pn     { border-color: #555;    color: #444; }

.vf-slots { display: flex; flex-direction: column; gap: 0.35rem; }
.vf-slot {
  display: grid;
  grid-template-columns: 4rem minmax(0, 1fr) 9rem 9rem;
  gap: 0.6rem;
  align-items: baseline;
  padding: 0.25rem 0 0.25rem 0;
  border-bottom: 1px solid #eee;
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-size: 0.98rem;
}
.vf-slot:last-child { border-bottom: 0; }
.vf-rel { font-weight: 600; }
.vf-filler { color: #111; }
.vf-implicit { color: #888; font-style: italic; }
.vf-morph {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.84rem;
  color: #444;
}
.vf-role {
  font-style: italic;
  color: #6b2c2c;
  font-size: 0.92rem;
  text-align: right;
}

.vf-bracket {
  margin-top: 0.7rem;
  padding: 0.5rem 0 0 0;
  border-top: 1px solid #ddd;
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-size: 1.0rem;
  color: #222;
  line-height: 1.7;
  overflow-x: auto;
}
.vf-bracket sub { font-size: 0.75em; vertical-align: sub; }

/* Narrow viewport: collapse the 4-col slot grid into stacked lines */
@media (max-width: 720px) {
  .vf-slot {
    grid-template-columns: 4rem minmax(0, 1fr);
  }
  .vf-slot .vf-morph,
  .vf-slot .vf-role {
    grid-column: 2;
    text-align: left;
  }
}

/* ============================================================
   Integrated linguist dashboard (samples.qmd / .linguist-dashboard)
   Five-row panel combining morphology + PROIEL syntax +
   information structure + argument structure + LightSIDE-AthDGC
   feature strings. Extra simple, scan-in-seconds.
   ============================================================ */
.linguist-dashboard {
  border-left: 2px solid #aaa;
  padding: 0.6rem 0 0.4rem 1.1rem;
  margin: 0.5rem 0 1.6rem 0;
}
.ld {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-size: 0.98rem;
  line-height: 1.55;
}
.ld-row {
  display: grid;
  grid-template-columns: 11rem minmax(0, 1fr);
  gap: 0.8rem;
  align-items: baseline;
  padding: 0.5rem 0;
  border-bottom: 1px solid #eee;
}
.ld-row:last-child { border-bottom: 0; }
.ld-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.74rem;
  letter-spacing: 0.06em;
  color: #555;
  font-weight: 600;
  text-transform: uppercase;
  padding-top: 0.15rem;
}
/* Row-specific left-border accent in muted Lavidasized palette */
.ld-row.ld-morph    { border-left: 2px solid #1f3050; padding-left: 0.5rem; }
.ld-row.ld-syntax   { border-left: 2px solid #6b2c2c; padding-left: 0.5rem; }
.ld-row.ld-info     { border-left: 2px solid #a06a1c; padding-left: 0.5rem; }
.ld-row.ld-args     { border-left: 2px solid #2c5d5d; padding-left: 0.5rem; }
.ld-row.ld-features { border-left: 2px solid #777777; padding-left: 0.5rem; }

.ld-row .ld-label   { padding-left: 0; }

.ld-body { color: #111; }
.ld-tk {
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-weight: 600;
  color: #111;
}
.ld-sep {
  color: #999;
  margin: 0 0.25rem;
}
.ld-pill {
  display: inline-block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.74rem;
  padding: 0.05rem 0.45rem;
  border: 1px solid #aaa;
  color: #333;
  background: transparent;
  margin: 0 0.1rem;
  white-space: nowrap;
}
.ld-mono {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.82rem;
  color: #444;
}
.ld-em { font-style: italic; font-weight: 600; }
.ld-arrow {
  font-family: 'JetBrains Mono', monospace;
  color: #555;
  margin: 0 0.2rem;
}
.ld-trend {
  font-style: italic;
  color: #555;
  font-size: 0.86rem;
}

/* Narrow viewport: stack label above content */
@media (max-width: 720px) {
  .ld-row {
    grid-template-columns: 1fr;
    gap: 0.2rem;
  }
}

/* ============================================================
   Generative-grammar projection (.gen-tree)
   Thematic-role flow (.theta-flow)
   Both SVG; thin rules only; no boxes / fills.
   ============================================================ */
.gen-tree, .theta-flow {
  border-left: 2px solid #aaa;
  padding: 0.6rem 0 0.4rem 1.1rem;
  margin: 0.5rem 0 1.6rem 0;
}
.gen-tree svg, .theta-flow svg {
  display: block;
  width: 100%;
  height: auto;
  max-width: 760px;
}
.gen-tree svg { max-height: 420px; }
.theta-flow svg { max-height: 260px; }

@media (max-width: 720px) {
  .gen-tree svg, .theta-flow svg { max-height: none; }
}

/* ============================================================
   Chain comparison table (.chain-grid)
   Side-by-side parallel-tree comparison for retelling +
   retranslation reception chains.
   ============================================================ */
.chain-grid {
  border-left: 2px solid #aaa;
  padding: 0.6rem 0 0.4rem 1.1rem;
  margin: 0.5rem 0 1.6rem 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
}
.chain-grid .chain-node {
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-size: 0.94rem;
  line-height: 1.5;
}
.chain-grid .chain-node h4 {
  font-family: 'Old Standard TT', 'Cardo', Georgia, serif;
  font-size: 1.0rem;
  font-weight: 600;
  font-style: italic;
  color: #6b2c2c;
  border-bottom: 1px solid #aaa;
  padding-bottom: 0.25rem;
  margin: 0 0 0.5rem 0;
}
.chain-grid .chain-tree {
  font-family: 'JetBrains Mono', 'DejaVu Sans Mono', monospace;
  font-size: 0.78rem;
  line-height: 1.45;
  white-space: pre;
  background: transparent;
  border-left: 1px solid #ddd;
  padding: 0.4rem 0 0.4rem 0.6rem;
  margin: 0.3rem 0;
  overflow-x: auto;
}
.chain-grid .chain-gloss {
  font-style: italic;
  color: #555;
  font-size: 0.86rem;
  margin-top: 0.3rem;
}
@media (max-width: 720px) {
  .chain-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   LightSIDE-AthDGC workflow SVG (.lightside-flow)
   ============================================================ */
.lightside-flow {
  border-left: 2px solid #aaa;
  padding: 0.6rem 0 0.4rem 1.1rem;
  margin: 0.5rem 0 1.6rem 0;
}
.lightside-flow svg {
  display: block;
  width: 100%;
  height: auto;
  max-width: 760px;
  max-height: 240px;
}
@media (max-width: 720px) {
  .lightside-flow svg { max-height: none; }
}