/* Lamp & Light — design tokens (Warm Parchment)
   Canonical values. See ../DESIGN.md for the rules that govern them. */

:root {
  /* ---- Brand ---------------------------------------------------------- */
  --ll-gold:        #CCB259;  /* THE brand gold, straight from the artwork. Fills only. */
  --ll-gold-ink:    #7E6426;  /* Gold as TEXT on parchment. #CCB259 is 1.9:1 — unusable. */
  --ll-gold-wash:   rgba(204, 178, 89, 0.13);  /* tinted surface, e.g. the streak pill */
  --ll-gold-edge:   rgba(204, 178, 89, 0.35);  /* border on a tinted surface */
  --ll-gold-mark:   rgba(204, 178, 89, 0.28);  /* text highlight behind scripture */

  /* Highlight colours. Defined once: the swatch you pick and the mark you get are
     the same value, so a preview can never drift from the result. All three stay
     inside the brand — a warm gold, a deeper amber, a neutral grey — and all keep
     ink text above 4.5:1 when laid over parchment. */
  --ll-hl-gold:     rgba(204, 178, 89, 0.45);   /* pale warm gold — the brand tint */
  --ll-hl-yellow:   rgba(247, 222, 42, 0.48);   /* highlighter yellow: the one people reach
                                                   for first, and the only saturated colour
                                                   the app uses */
  --ll-hl-amber:    rgba(150, 96, 30, 0.34);    /* deeper, browner — a different hue, not
                                                   just a darker gold, or the two read alike */
  --ll-hl-grey:     rgba(46, 42, 34, 0.18);     /* neutral */

  /* Selection, which is not a highlight: it is what you have hold of before you
     decide anything, so it is ink and never gold — gold is the mark that results.
     Two parts, because one of them has to survive a highlight sitting underneath
     it: a tint for plain text, and a dotted rule under the words that reads on
     top of any of the colours above. */
  --ll-select-tint: rgba(46, 42, 34, 0.10);
  --ll-select-rule: rgba(46, 42, 34, 0.55);

  /* Pen colours for the margin — what an Apple Pencil writes with. Three, and
     none of them gold: gold reports state in this app and never carries anything
     else. They are stored by name and resolved at paint time, so a page written
     on parchment still reads on black. Rust is the danger button's red, warmed
     for handwriting; blue is the only cool colour the app has, and is here
     because a second pen that is only a second brown is not a second pen. */
  --ll-nib-ink:     #2E2A22;
  --ll-nib-rust:    #9B3B2E;
  --ll-nib-blue:    #35506E;

  --ll-black:       #000000;  /* brand ground for the primary lockup. Not a UI color. */

  /* ---- Surfaces ------------------------------------------------------- */
  --ll-parchment:   #FAF6EE;  /* app background */
  --ll-card:        #FFFDF8;  /* raised surface */
  --ll-border:      #EDE3CC;  /* card + divider hairline */
  --ll-rule:        #E4D9C0;  /* heavier rule, inactive ladder segment, control edge */

  /* ---- Inverted surfaces ---------------------------------------------
     The podcast card and the verse action bar sit "opposite" the page. In a dark
     theme they must stay dark rather than flipping to cream, so they get their
     own tokens instead of borrowing --ll-ink. */
  --ll-inverse:      #2E2A22;
  --ll-on-inverse:   #FAF6EE;

  /* Reading text size, set from Settings. */
  --ll-verse-size:   16.5px;

  /* ---- Ink ------------------------------------------------------------ */
  --ll-ink:         #2E2A22;  /* primary text, and every button fill */
  --ll-muted:       #6B6656;  /* secondary text, scripture quotation */
  --ll-faint:       #8A8064;  /* labels, metadata */
  --ll-dim:         #B8AF9A;  /* inactive nav, disabled, future dates */

  /* ---- Type ----------------------------------------------------------- */
  --ll-font-display: 'Newsreader', Georgia, 'Times New Roman', serif;
  --ll-font-ui:      'Work Sans', system-ui, -apple-system, sans-serif;
  --ll-font-brand:   'Area Extended', 'Jost', system-ui, sans-serif;

  --ll-size-title:   27px;   /* screen title, Newsreader 600 */
  --ll-size-heading: 20px;   /* card / section heading, Newsreader 600 */
  --ll-size-verse:   16.5px; /* scripture body, Newsreader 400 */
  --ll-size-body:    13px;
  --ll-size-sub:     11.5px;
  --ll-size-label:   10px;   /* brand face, uppercase, 0.2em tracked */

  --ll-leading-verse: 1.72;
  --ll-leading-body:  1.55;
  --ll-track-label:   0.2em;

  /* ---- Shape ---------------------------------------------------------- */
  --ll-radius-card:  18px;
  --ll-radius-inset: 14px;   /* stat tiles, plan rows */
  --ll-radius-cell:  7px;    /* calendar day */
  --ll-radius-pill:  999px;  /* every button and chip */
  --ll-hit:          44px;   /* minimum touch target. Never smaller. */

  /* ---- Spacing -------------------------------------------------------- */
  --ll-gap-screen:   18px;   /* between blocks on a screen */
  --ll-gap-stack:    10px;   /* between cards in a stack */
  --ll-gap-card:     9px;    /* inside a card */
  --ll-pad-screen:   28px 20px 12px;
  --ll-pad-card:     16px 18px;
}

/* Paper: the same design with the warmth taken out, for readers who find cream heavy. */
[data-theme="paper"] {
  --ll-parchment: #FFFFFF;
  --ll-card:      #FBFAF8;
  --ll-border:    #E8E6E1;
  --ll-rule:      #DEDBD4;
  --ll-gold-ink:  #7A6023;
}

/* Night uses the logo's own black, not an invented navy. */
[data-theme="night"] {
  --ll-parchment: #000000;
  --ll-card:      #131211;
  --ll-border:    #2A2724;
  --ll-rule:      #38342E;
  --ll-ink:       #F4EFE4;
  --ll-muted:     #B5AE9D;
  --ll-faint:     #8C8778;
  --ll-dim:       #5C5749;
  --ll-gold-ink:  #CCB259;  /* on black the brand gold IS the readable one */

  /* The three pens again, lifted off black. Ink follows the body text; the other
     two keep their hue rather than becoming two pale greys. */
  --ll-nib-ink:   #F4EFE4;
  --ll-nib-rust:  #D9705C;
  --ll-nib-blue:  #7FA8D4;

  /* Inverted surfaces stay dark; they lift off the page instead of flipping. */
  --ll-inverse:    #1F1D1B;
  --ll-on-inverse: #F4EFE4;

  /* Selection is ink on parchment and parchment on ink — the same idea, inverted,
     rather than a grey that would vanish into black. */
  --ll-select-tint: rgba(244, 239, 228, 0.13);
  --ll-select-rule: rgba(244, 239, 228, 0.62);

  /* Highlights need more presence over black than over cream. */
  --ll-hl-gold:    rgba(204, 178, 89, 0.30);
  --ll-hl-yellow:  rgba(247, 222, 42, 0.28);
  --ll-hl-amber:   rgba(196, 132, 46, 0.28);
  --ll-hl-grey:    rgba(244, 239, 228, 0.13);
}