/* Looseleaf paper finish, scoped Astro adaptation. PREVIEW ONLY.
 * Copyright (c) 2026 Looseleaf contributors — MIT: /licenses/looseleaf.txt
 * Original paperBackground / ll-paper layering and native fibre/relief/cloud tiles.
 * See /assets/looseleaf/PROVENANCE.txt. No fonts, scripts or React UI imported.
 */
body.paper-preview {
  --paper-stock: #f8f5ee;
  --paper-pad: #f8f2de;
  --paper-shade: #ece6da;
  --paper-fibre: url("/assets/looseleaf/fibre.webp");
  --paper-relief: url("/assets/looseleaf/relief.png");
  --paper-cloud: url("/assets/looseleaf/cloud.png");
  --paper-grain: var(--paper-fibre), var(--paper-relief), var(--paper-cloud);
  --paper-grain-size: 240px 240px, 192px 192px, 720px 720px;
  background-color: var(--paper-pad);
  background-image: linear-gradient(#f8f2de40, #ece6da40), var(--paper-grain);
  background-size: 100% 100%, var(--paper-grain-size);
  background-repeat: no-repeat, repeat, repeat, repeat;
}
/* The sheet is behind real content; no overlay or pointer interception. */
body.paper-preview > main {
  position: relative;
  isolation: isolate;
}
body.paper-preview > main::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  border-radius: 3px;
  background-color: var(--paper-stock);
  background-image: linear-gradient(#f8f5ee8c, #f8f5ee8c), var(--paper-grain), linear-gradient(135deg, #ffffff61, #fff0 42%, rgb(58 44 30 / .035));
  background-size: 100% 100%, var(--paper-grain-size), 100% 100%;
  background-repeat: no-repeat, repeat, repeat, repeat, no-repeat;
  box-shadow: 0 1px 1.5px rgb(58 44 30 / .12), 0 2px 5px -1px rgb(58 44 30 / .07), 0 12px 22px -8px rgb(58 44 30 / .10);
}
/* Existing illustrations, spacing and typography stay intact. */
body.paper-preview :is(.box, .cards a, .h2-pick, .h2-tcard, .gloss-line, .start-pack-bar, .start-pack-footer-link, .start-hub-card) {
  background-color: var(--paper-stock);
  background-image: linear-gradient(#f8f5eec4, #f8f5eec4), var(--paper-grain);
  background-size: 100% 100%, var(--paper-grain-size);
  background-repeat: no-repeat, repeat, repeat, repeat;
  border-color: #ddd3c2;
  box-shadow: 0 1px 2px rgb(58 44 30 / .035);
}
body.paper-preview .start-pack-footer { background-color: var(--paper-shade); }
body.paper-preview > header.site,
body.paper-preview > footer { border-color: #dcd0b9; }
@media (max-width: 520px) {
  body.paper-preview > main::before { border-radius: 0; box-shadow: none; }
}
@media print {
  body.paper-preview { background: #fff !important; }
  body.paper-preview > main::before { background: none !important; box-shadow: none !important; }
  body.paper-preview :is(.box, .cards a, .h2-pick, .h2-tcard, .gloss-line, .start-pack-bar, .start-pack-footer, .start-pack-footer-link, .start-hub-card) { background: #fff !important; box-shadow: none !important; }
}
@media (forced-colors: active) {
  body.paper-preview, body.paper-preview > main::before { background: Canvas !important; box-shadow: none; }
  body.paper-preview :is(.box, .cards a, .h2-pick, .h2-tcard, .gloss-line, .start-pack-bar, .start-pack-footer, .start-pack-footer-link, .start-hub-card) { background: Canvas !important; box-shadow: none; }
}