/* ============================================================================
   Shared Tufte design system for the discovery dashboard.

   Cream paper, near-black ink, one rust accent, Palatino serif, old-style
   figures, thin rules instead of boxes. Linked by every page; page-specific
   styles live in their own stylesheet (index.css / grid.css / lineage.css).
   Adapted from the FMDiscovery dashboard's shared visual system.
   ========================================================================== */
:root{
  --paper:#fffff8;        /* Tufte cream            */
  --ink:#111111;          /* near-black body text   */
  --muted:#6b6a60;        /* warm gray — secondary  */
  --faint:#9b998c;        /* fainter — captions     */
  --rule:#d9d5c3;         /* warm hairline          */
  --rule-soft:#ece9da;    /* fainter hairline       */
  --accent:#8c2f1f;       /* ET rust-red, sparingly */
  --ochre:#8a6a1e;        /* secondary data tint    */
  --disc:#b9b6a6;         /* discarded marks        */
  --serif:"Palatino","Palatino Linotype","Book Antiqua","URW Palladio L",Georgia,serif;
  --mono:ui-monospace,"SF Mono",Menlo,monospace;
}
*{box-sizing:border-box;}
html{background:var(--paper);}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:18px/1.6 var(--serif);
  font-feature-settings:"onum" 1,"liga" 1;   /* old-style figures, ligatures */
  -webkit-font-smoothing:antialiased;
}

/* ---- shared page header + nav ------------------------------------------- */
.dash-head{max-width:66.67vw;margin:0 auto;padding:48px 0 6px;}
.eyebrow{font:italic 16px/1 var(--serif);color:var(--accent);letter-spacing:.01em;margin-bottom:13px;}
.dash-head h1{font-weight:400;font-size:34px;line-height:1.12;letter-spacing:-.01em;margin:0 0 8px;}
.dash-head .sub{color:var(--muted);font-style:italic;font-size:18px;margin:0 0 10px;max-width:64ch;}
/* page navigation — a horizontal bar at the top of the centred measure, in
   normal flow above the content so it never overlaps it. The research views
   sit after a quiet divider, set off from the three main pages. */
.nav{display:flex;flex-wrap:wrap;align-items:center;gap:7px 16px;
     margin:0 0 24px;padding-bottom:12px;border-bottom:1px solid var(--rule);
     font:14px/1.3 var(--serif);}
.nav a{color:var(--accent);text-decoration:none;white-space:nowrap;
       border-bottom:1px solid transparent;}
.nav a:hover{border-bottom-color:var(--accent);}
.nav .nav-here{color:var(--ink);cursor:default;}  /* current page — shown & marked active, not a link */
.nav-div{flex:0 0 auto;width:1px;height:15px;background:var(--rule);margin:0 2px;}  /* main | research */

/* shared lead-in on the research pages — ties each back to the restaurant and the
   problem. Outer box matches the header measure so its left edge lines up. */
.research-intro{max-width:66.67vw;margin:0 auto;padding:2px 0 22px;}
.research-intro p{margin:0;max-width:74ch;font:italic 16px/1.6 var(--serif);
                  color:var(--muted);text-wrap:pretty;}
.research-intro a{font-style:normal;color:var(--accent);text-decoration:none;
                  border-bottom:1px solid transparent;}
.research-intro a:hover{border-bottom-color:var(--accent);}

.empty{padding:28px 0;color:var(--muted);font-style:italic;}

/* ---- shared site footer — workshop attribution + credit, on every page --- */
.site-footer{max-width:66.67vw;margin:64px auto 40px;padding-top:16px;
             border-top:1px solid var(--rule);
             font:italic 14px/1.7 var(--serif);color:var(--faint);
             text-align:center;text-wrap:pretty;}
.site-footer a{font-style:normal;color:var(--accent);text-decoration:none;
               border-bottom:1px solid transparent;}
.site-footer a:hover{border-bottom-color:var(--accent);}
.site-footer .foot-sep{color:var(--rule);margin:0 5px;}
.site-footer .foot-love{color:var(--accent);font-style:normal;}
