/* Sacred Tongues — shared design tokens and layout.
   One base; the accent swaps by <html data-lang="hebrew|greek">. */
:root {
  --paper: #F6F1E7; --panel: #FFFCF5; --line: #DDD4C4; --muted: #6E655A; --ink: #1E1A15;
  --gold: #B8903A; --soft: #EFE8DA;
  --heb: #A8431F; --heb-deep: #7E2F13; --heb-soft: #F1DED2;
  --grk: #1F3F7A; --grk-deep: #132A55; --grk-soft: #D9E1F0;
  --accent: var(--gold); --accent-deep: #8F6E26; --accent-soft: var(--soft); --accent-ink: #fff;
  --ok: #2F6B3A; --bad: #9A2F2F;
}
html[data-lang="hebrew"] { --accent: var(--heb); --accent-deep: var(--heb-deep); --accent-soft: var(--heb-soft); }
html[data-lang="greek"]  { --accent: var(--grk); --accent-deep: var(--grk-deep); --accent-soft: var(--grk-soft); }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #15120E; --panel: #1E1A14; --line: #2F2920; --muted: #9C9385; --ink: #EDE5D6; --soft: #26211A;
    --heb: #E08A5C; --heb-deep: #F0A880; --heb-soft: #3A2317;
    --grk: #7FA3E6; --grk-deep: #A4BFF0; --grk-soft: #1A2740;
    --gold: #D1AB58; --accent-ink: #15120E; --ok: #7FC48F; --bad: #E07B7B;
  }
  :root:not([data-theme="light"]) html[data-lang] { }
}
html[data-theme="dark"] {
  --paper: #15120E; --panel: #1E1A14; --line: #2F2920; --muted: #9C9385; --ink: #EDE5D6; --soft: #26211A;
  --heb: #E08A5C; --heb-deep: #F0A880; --heb-soft: #3A2317;
  --grk: #7FA3E6; --grk-deep: #A4BFF0; --grk-soft: #1A2740;
  --gold: #D1AB58; --accent-ink: #15120E; --ok: #7FC48F; --bad: #E07B7B;
}

* { box-sizing: border-box; }
html, body { margin: 0; background: var(--paper); color: var(--ink); font: 17px/1.55 "Source Serif 4", Georgia, "Times New Roman", serif; }
a { color: var(--accent); }
.heb { font-family: "Noto Serif Hebrew", "SBL Hebrew", "Ezra SIL", serif; direction: rtl; unicode-bidi: isolate; }
.grk { font-family: "Gentium Plus", "Noto Serif", "Source Serif 4", serif; }

/* ---- site chrome ---- */
.site-header { display: flex; align-items: center; gap: 14px; padding: 12px 20px; border-bottom: 1px solid var(--line); background: var(--panel); }
.site-header .brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); font-weight: 600; letter-spacing: .02em; white-space: nowrap; }
.site-header .brand img { width: 34px; height: 34px; border-radius: 50%; }
.site-header nav { margin-left: auto; display: flex; gap: 4px; flex-wrap: wrap; }
.site-header nav a { text-decoration: none; color: var(--muted); padding: 6px 10px; border-radius: 8px; font-size: .95rem; }
.site-header nav a:hover { background: var(--soft); color: var(--ink); }
.site-header nav a.on { color: var(--accent); font-weight: 600; }
.lang-pill { font-size: .72rem; text-transform: uppercase; letter-spacing: .14em; color: var(--accent); border: 1px solid var(--accent); border-radius: 999px; padding: 2px 9px; }

.site-footer { border-top: 1px solid var(--line); padding: 26px 20px 34px; color: var(--muted); font-size: .9rem; display: flex; flex-wrap: wrap; gap: 10px 28px; align-items: center; }
.site-footer a { color: var(--muted); }
.site-footer .njp { margin-left: auto; }
.site-footer .rule { width: 100%; height: 1px; background: var(--gold); opacity: .5; margin: -4px 0 4px; }

.wrap { max-width: 1040px; margin: 0 auto; padding: 32px 20px; }
.hub-head { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; margin-bottom: 8px; }
.hub-head h1 { margin: 0; font-size: 2rem; font-weight: 600; }
.hub-head .script { font-size: 2.6rem; color: var(--accent); line-height: 1; }
.lede { color: var(--muted); max-width: 60ch; margin: 0 0 28px; }

.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 22px; text-decoration: none; color: var(--ink); display: flex; flex-direction: column; gap: 6px; position: relative; }
a.card:hover { border-color: var(--accent); }
.card h3 { margin: 0; font-size: 1.15rem; }
.card p { margin: 0; color: var(--muted); font-size: .95rem; }
.card .tag { position: absolute; top: 14px; right: 14px; font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; padding: 2px 8px; }
.card.live .tag { color: var(--accent); border-color: var(--accent); }
.card.soon { opacity: .75; }

.btn { font: inherit; padding: 10px 18px; border-radius: 9px; border: 1px solid var(--line); background: var(--panel); color: var(--ink); cursor: pointer; text-decoration: none; display: inline-block; }
.btn.primary { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.btn:disabled { opacity: .5; cursor: default; }

h2.section { font-size: .8rem; text-transform: uppercase; letter-spacing: .14em; color: var(--muted); margin: 34px 0 12px; font-weight: 600; }
table.plain { width: 100%; border-collapse: collapse; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; font-size: .95rem; }
table.plain th, table.plain td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
table.plain th { font-size: .75rem; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); font-weight: 600; background: var(--soft); }
.muted { color: var(--muted); }
.small { font-size: .9rem; }

@media (max-width: 640px) { .hub-head h1 { font-size: 1.6rem; } .wrap { padding: 24px 16px; } .site-footer .njp { margin-left: 0; } }