/* Design History Museum, shared theme.
   Tokens and type for index.html, eras.html and book.html, drawn from Rohan
   Kartik's portfolio system (page palette, Sharpener colour ramps, golden
   ratio type). Every page links this file with a relative path, so the site
   still opens straight off the disk.

   Fonts: pf-marlet-display and urw-form are Typekit faces locked to the
   portfolio domain, so they are named first only for machines that have them
   installed. Playfair Display (700, the only weight Marlet ships) and DM Sans
   are what actually renders. Noto Sans Bengali covers local-language names.
   Offline, the stacks fall through to system faces. */
@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&family=DM+Sans:wght@400;500;600&family=Noto+Sans+Bengali:wght@400;600;700&display=swap");

/* Rohan's Typekit faces, same files and URLs as rohankartik.com. Served with
   open CORS, so they load here too. Google faces below stay as fallbacks. */
@font-face {
  font-family: "pf-marlet-display";
  src: url("https://use.typekit.net/af/378378/0000000000000000774f2ae2/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),
       url("https://use.typekit.net/af/378378/0000000000000000774f2ae2/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),
       url("https://use.typekit.net/af/378378/0000000000000000774f2ae2/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 700;
  font-stretch: normal;
}
@font-face {
  font-family: "urw-form";
  src: url("https://use.typekit.net/af/45ecb0/00000000000000007735a7e3/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),
       url("https://use.typekit.net/af/45ecb0/00000000000000007735a7e3/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),
       url("https://use.typekit.net/af/45ecb0/00000000000000007735a7e3/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
  font-stretch: normal;
}
@font-face {
  font-family: "urw-form";
  src: url("https://use.typekit.net/af/2686e6/00000000000000007735a7ee/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff2"),
       url("https://use.typekit.net/af/2686e6/00000000000000007735a7ee/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff"),
       url("https://use.typekit.net/af/2686e6/00000000000000007735a7ee/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 500;
  font-stretch: normal;
}
@font-face {
  font-family: "urw-form";
  src: url("https://use.typekit.net/af/63a8e1/00000000000000007735a815/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),
       url("https://use.typekit.net/af/63a8e1/00000000000000007735a815/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),
       url("https://use.typekit.net/af/63a8e1/00000000000000007735a815/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 700;
  font-stretch: normal;
}

:root{
  color-scheme:light;
  /* page palette, light */
  --bg:#FAFAF7;        /* page-bg */
  --panel:#FFFFFF;     /* page-card */
  --elev:#FFFFFF;      /* page-elev */
  --ink:#1B0E2A;       /* page-fg */
  --muted:#5C4F6B;     /* page-fg-soft */
  --faint:#786582;     /* sh-dark-800 */
  --line:#E8E3DC;      /* page-line */
  --hair:#F1EEEA;      /* page-line, 60% over card */
  --accent:#B166FF;    /* lavender-400: fills, borders, focus */
  --accent-ink:#5C3585;/* lavender-700: accent as text */
  --accent-soft:#F6EEFF;/* lavender-100 */
  --on-accent:#1B0E2A; /* text on an accent fill */
  --shade:27,14,42;    /* ink as rgb, for shadows */

  /* evidence: semantic, never the accent */
  --known:#006D3C;     /* sh-green-1900 */
  --told:#0C6C8F;      /* sh-blue-1800 */
  --guessed:#6B6B6B;   /* gray-600 */

  /* type */
  --font-display:"pf-marlet-display","Playfair Display",ui-serif,Georgia,Cambria,"Times New Roman",serif;
  --font-body:"urw-form","DM Sans",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,"SF Mono","Cascadia Code","Fira Code","Roboto Mono",monospace;
  /* object names: display face for Latin, Indic script faces for the rest */
  --font-script:"pf-marlet-display","Playfair Display","Noto Sans Bengali","Noto Serif Devanagari","Nirmala UI","Kohinoor Bangla",ui-serif,Georgia,serif;
  --weight-display:700; /* the only weight pf-marlet-display ships */

  /* golden ratio scale (base 16) plus the portfolio's practical fillers */
  --text-2xs:12px; --text-sm:14px; --text-base:17.5px; --text-md:20px; --text-lg:24px;
  --text-11:13px; --text-13:15px; --text-14:16px; --text-15:17px;
  --text-role-title:clamp(28px,3.4vw,36px);
  --text-role-sub:clamp(20px,2.2vw,26px);

  --tracking-snug:-.015em;
  --tracking-wide:.04em;
  --tracking-wider:.08em;
  --tracking-caps:.12em;
}
:root[data-theme="dark"]{
  --bg:#0F0517; --panel:#1A0B28; --elev:#221034;
  --ink:#F6EEFF; --muted:#B6A8C7; --faint:#978AA0;
  --line:#2A1339; --hair:#221034;
  --accent:#B166FF; --accent-ink:#DFC1FF; --accent-soft:#2A0D3D; --on-accent:#1B0E2A;
  --shade:0,0,0;
  --known:#26D888; --told:#48C5F2; --guessed:#888888;
}
