/*
 * A little light between the sheets.
 * The drawing and its geometry remain the foreground; these quiet materials
 * sit underneath it. No animated blur, noise, or extra cards.
 */
body.sketch-home,
body.business-page {
  --paper: #f3f3eb;
  --ink: #30392c;
  --sage: #63755a;
  --accent: #a58c59;
  --line: #aeb8a13d;
  --atelier-edge: #fffff8c4;
  --atelier-shadow: #4c5a3e12;
  --atelier-reading: #fdfdf5eb;
  --atelier-chrome: #f8f9f1ed;
  --atelier-field: #fffff8b3;
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  background-color: #eeeee5;
  background-image:
    radial-gradient(ellipse at 84% 16%, #afbea078, transparent 48%),
    radial-gradient(ellipse at 7% 64%, #b9aa8b30, transparent 44%),
    linear-gradient(126deg, #fffff8a8 3%, #eceee226 57%, #dfe5d670);
  color: var(--ink);
}

/* Fine contours are seen through the vellum rather than laid over the ink. */
body.sketch-home::before,
body.business-page::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background-image:
    url('/orbital-vellum.svg'),
    linear-gradient(112deg, transparent 23%, #fffef652 23.05%, #fffef614 53%, transparent 53.05%);
  background-size: cover;
  background-position: 65% 40%;
  background-repeat: no-repeat;
}

/* A broad single folio keeps the whole page open, not divided into cards. */
body.sketch-home::after,
body.business-page::after {
  content: '';
  position: absolute;
  inset: 113px 2.6% 27px;
  z-index: -1;
  pointer-events: none;
  border: 1px solid var(--atelier-edge);
  border-right-color: #a9b39735;
  border-bottom-color: #a9b39740;
  border-radius: 16px;
  background: linear-gradient(120deg, #fffef5b8 3%, #fffff451 53%, #f7faee2e);
  box-shadow: 0 22px 65px -35px #46543b27, inset 0 1px 0 #ffffffd9;
  transform: none;
  transform-origin: center;
}

/* The original mark is untouched. Only the air around the threshold changes. */
body.sketch-home .header,
body.business-page .business-header {
  background: linear-gradient(110deg, #fffffa9c, var(--atelier-chrome));
  border-bottom-color: #8d9c7b37;
  box-shadow: 0 1px 0 #fffffa9c, 0 9px 28px -26px #52614466;
}

body.sketch-home .sk-dock {
  border-radius: 16px;
  border-color: #a0ac9066;
  background: linear-gradient(120deg, #fffff7f0, var(--atelier-chrome));
  box-shadow: 0 12px 36px -18px #42533840, inset 0 1px 0 #ffffffeb;
}
body.sketch-home .sk-dock button { border-radius: 10px; }

/* Select reading and working surfaces receive a denser, legible inner sheet. */
body.business-page .panel,
body.business-page .profile-block-editor,
body.business-page .resource-dialog,
body.business-page .profile-gallery,
body.sketch-home .sk-detail,
body.commission-world .brief-sheet:not([data-chapter='0']) {
  background: linear-gradient(125deg, #fffff9ed, var(--atelier-reading));
  border-color: #a9b69761;
  box-shadow: 0 20px 56px -39px #4256385c, inset 0 1px 0 #ffffffde;
}

/* Reading stays editorial: a single wash across the spread, without a box. */
body.profile-world .atlas-reading {
  background: linear-gradient(110deg, #fffff818, #fffff88c 45%, #fffff825);
  border-top-color: #9cab884c;
  box-shadow: inset 0 1px 0 #fffff8ab;
}
body.collection-world .filter-bar,
body.commission-world .brief-index,
body.studio-world .workspace-tabs {
  background: linear-gradient(100deg, #fffff73d, #fffff785 60%, #fffff725);
  border-color: #9cab884c;
  box-shadow: inset 0 1px 0 #ffffff99;
}

/* Useful controls retain their familiar 16 px corners and graphite contrast. */
body.business-page input:not([type=radio]):not([type=checkbox]),
body.business-page textarea,
body.business-page select {
  border-radius: 16px;
  background: var(--atelier-field);
  border-color: #9eae8f91;
  box-shadow: inset 0 1px 0 #ffffffdb, 0 2px 7px #4e5d4004;
  color: var(--ink);
}
body.business-page input:not([type=radio]):not([type=checkbox]):focus,
body.business-page textarea:focus,
body.business-page select:focus {
  background: #fffff8e8;
  border-color: #63755a;
  box-shadow: 0 0 0 4px #63755a13, inset 0 1px 0 white;
}
body.business-page .quiet-button {
  background: #fffff55c;
  border-color: #a1af9166;
  box-shadow: inset 0 1px 0 #ffffff9c;
}
body.business-page .quiet-button:hover { background: #fffff5a6; }
body.studio-world .workspace-save { background: #f9faf0e8; }
body.studio-world .inbox-item,
body.studio-world .resource-edit-item { background: #fffff773; }

/* The drawn paper can reveal a trace of its neighbouring contour. */
body.sketch-home .sk-living-drawing .paper,
body.sketch-home .service-sketch .paper,
body.business-page .sketch-art .paper,
body.business-page .service-sketch .paper,
body.business-page .liberty-page-sketch .paper { fill: #fffff5bd; }
body.profile-world .atlas-node { background: #fafbf2c9; }
body.profile-world .atlas-nodes.many .atlas-node { background: transparent; }
body.collection-world .resource-cover { background-color: #e6eadb70; }

/* Full-screen drawing keeps the same light, independent of the page behind. */
body.sketch-home .sk-room {
  background:
    radial-gradient(ellipse at 82% 27%, #b8c5a544, transparent 56%),
    linear-gradient(120deg, #f7f8f0, #ecefe2);
}
body.sketch-home .sk-room-header,
body.sketch-home .sk-room-controls { background: #fffff68c; }

/* A small number of static surfaces use blur; unsupported browsers stay clear. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body.sketch-home,
  body.business-page {
    --atelier-reading: #fdfdf5ba;
    --atelier-chrome: #f8f9f17a;
  }
  body.sketch-home .header,
  body.business-page .business-header {
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
  }
  body.sketch-home .sk-dock {
    background: linear-gradient(120deg, #fffff7b8, #f7f9ed8c);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
  }
  body.business-page .resource-dialog,
  body.business-page .profile-gallery,
  body.sketch-home .sk-detail,
  body.commission-world .brief-sheet:not([data-chapter='0']) {
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
  }
}

@media (max-width: 650px) {
  body.sketch-home::before,
  body.business-page::before {
    background-image:
      url('/orbital-vellum.svg'),
      linear-gradient(112deg, transparent 17%, #fffef652 17.12%, #fffef614 72%, transparent 72.12%);
    background-position: 67% 35%;
  }
  body.sketch-home::after,
  body.business-page::after {
    inset: 94px 12px 16px;
    border-radius: 16px;
    transform: none;
    background: linear-gradient(120deg, #fffef5a8, #fffff43d 70%);
  }
  body.sketch-home .sk-dock { box-shadow: 0 8px 27px -13px #42533838, inset 0 1px 0 #ffffffeb; }
}

@media (prefers-reduced-transparency: reduce) {
  body.sketch-home,
  body.business-page {
    --atelier-reading: #fafbf2;
    --atelier-chrome: #f8f9f0;
    --atelier-field: #fffff7;
    background: #f3f4eb;
  }
  body.sketch-home::before,
  body.business-page::before { display: none; }
  body.sketch-home::after,
  body.business-page::after { background: #f8f9f0; }
  body.sketch-home .header,
  body.business-page .business-header,
  body.sketch-home .sk-dock,
  body.business-page .resource-dialog,
  body.business-page .profile-gallery,
  body.sketch-home .sk-detail,
  body.commission-world .brief-sheet:not([data-chapter='0']) {
    background: #f8f9f0;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  body.profile-world .atlas-node { background: #f8f9f0; }
  body.profile-world .atlas-nodes.many .atlas-node { background: transparent; }
}

@media (prefers-reduced-motion: reduce) {
  body.sketch-home::before,
  body.sketch-home::after,
  body.business-page::before,
  body.business-page::after { transform: none; }
}

@media print {
  body.sketch-home,
  body.business-page { background: white; }
  body.sketch-home::before,
  body.sketch-home::after,
  body.business-page::before,
  body.business-page::after { display: none; }
}