/* Carried over from docs/mockups/questlog-mockup.html (v8, approved 2026-10-15) as written. */
*{box-sizing:border-box}
html{background:var(--stone)}
body{
  background:
    radial-gradient(ellipse 120% 90% at 50% 35%, transparent 35%, #000000d9 100%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .5 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='104'><rect width='240' height='104' fill='%23090605'/><rect x='3' y='3' width='114' height='46' rx='4' fill='%232b231c'/><rect x='123' y='3' width='114' height='46' rx='5' fill='%23241d17'/><rect x='-57' y='55' width='114' height='46' rx='4' fill='%23302720'/><rect x='63' y='55' width='114' height='46' rx='6' fill='%23221b15'/><rect x='183' y='55' width='114' height='46' rx='4' fill='%23302720'/><rect x='3' y='3' width='114' height='6' rx='3' fill='%23ffffff08'/><rect x='63' y='55' width='114' height='6' rx='3' fill='%23ffffff06'/></svg>"),
    var(--stone);
  color:var(--parch);
  font-family:var(--f-body); font-size:17px; line-height:1.5;
  min-height:100vh;
  padding-block:var(--s6) var(--s7);
  padding-left:max(16px, env(safe-area-inset-left,0px));
  padding-right:max(16px, env(safe-area-inset-right,0px));
}