/* ---------- Palette: edit these to re-theme ---------- */
  :root { --paper:#EEEEEC; --panel:#E2E2DF; --ink:#16171A; --mute:#6B6D72; --line:#CFCFCB; --accent:#2F4BFF;
          box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px); }
  @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --paper:#151618; --panel:#212225; --ink:#EEEEEC; --mute:#9A9CA1; --line:#34363A; --accent:#7C8DFF; } }
  :root[data-theme="dark"] { --paper:#151618; --panel:#212225; --ink:#EEEEEC; --mute:#9A9CA1; --line:#34363A; --accent:#7C8DFF; }
  html { scroll-behavior:smooth; scroll-padding-top:calc(72px + env(safe-area-inset-top,0px)); }
  body { background:var(--paper); color:var(--ink); -webkit-font-smoothing:antialiased; }
  :focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
  .ulink { background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat; transition:background-size .35s ease; }
  .ulink:hover, .ulink:focus-visible { background-size:100% 1px; }
  .card .thumb { transition:transform .7s cubic-bezier(.2,.7,.2,1); }
  .card:hover .thumb, .card:focus-visible .thumb { transform:scale(1.04); }
  .card.hide { display:none; }
  /* Fade when switching between the grid and a project view (answers a click) */
  @keyframes vin { from { opacity:0; transform:translateY(10px); } }
  .view-in { animation:vin .5s cubic-bezier(.2,.7,.2,1); }
  @keyframes turn { to { transform:rotateY(360deg); } }
  .orb { transform-style:preserve-3d; animation:turn 22s linear infinite; }
  @media (prefers-reduced-motion: reduce) { .orb, .view-in { animation:none; } html { scroll-behavior:auto; } .card .thumb { transition:none; } }