/* Doodle page (vision §E6): the artwork page layout (painting.css, linked first) plus the doodle's
   own panel: "No. 150 of 274", mood and styles, "Ask about this doodle" and the AI Studio link. */
@layer pages {
  .doodle__tags {
    display: grid;
    gap: var(--space-1);
    margin: 0;
    font-size: var(--step--1);
  }
  .doodle__tags > div { display: flex; flex-wrap: wrap; gap: 0 var(--space-3); align-items: baseline; }
  .doodle__tags dt {
    min-inline-size: 4.5rem;
    font: 600 var(--step--2)/1.6 var(--font-ui);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink-2);
  }
  .doodle__tags dd { margin: 0; color: var(--ink); }

  .doodle__more {
    display: grid;
    justify-items: start;
    gap: var(--space-5);
    padding-block-start: var(--space-2);
  }
  .doodle__studio {
    display: grid;
    justify-items: start;
    gap: var(--space-2);
  }
  .doodle__ai { display: inline-flex; flex-wrap: wrap; align-items: baseline; }

  /* A sheet of paper, not a stretched canvas: a slightly softer contact shadow. */
  .artwork--doodle .artwork__img { box-shadow: 0 1px 1px var(--hang-contact-color); }

  /* No print options here, so the wall under the sheet already leaves a generous pause before the
     strip: a full section gap on top of it would read as an empty screen. */
  @media (min-width: 1024px) {
    .artwork--doodle .artwork__stage { padding-block-end: var(--space-6); }
    .artwork--doodle .artwork__more { padding-block-start: var(--space-6); }
  }
}
