/*
 * WordPress-only additions. The locked stylesheets beside this file are never edited; this file
 * only covers markup that WordPress produces and the mockups didn't have.
 */

/* If scripts are off, the page still gets the day colours (the page script normally sets them). */
body:not([data-palette]){--ink:#2a2a20;--soft:#62604f;--accent:#b4532a;--hi:#f0d99a;
  --n1:#d9e4cc;--n2:#f3d9b8;--n3:#e7e8c7;--n4:#f0d99a;--lines:#e5e4d8;
  --ta:rgba(80,115,70,.4);--tb:rgba(214,120,55,.44);--tc:rgba(212,165,50,.48);--paper:#f7f5ee;--dot:#dcdccf}

/* The Currently card is a synced pattern, so its bold words arrive as <strong>, not <b>. */
.now li strong{font-weight:700;color:var(--ink);margin-right:4px}

/* A long note's fade was written for the mockup's one long note (colour 3). Every long note fades into its own colour. */
.long.n1 .clip::after{background:linear-gradient(transparent,var(--n1))}
.long.n2 .clip::after{background:linear-gradient(transparent,var(--n2))}
.long.n4 .clip::after{background:linear-gradient(transparent,var(--n4))}

/* A video note plays the real video where the mockup showed a still. */
.bigvid .frame{aspect-ratio:16/9}
.bigvid .frame.is-vertical{aspect-ratio:9/16;max-height:80vh;margin-inline:auto}
.bigvid .frame iframe,.bigvid .frame video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.vid .frame:not(:has(img)){aspect-ratio:9/12;background:#111}

/* Pictures placed inside an essay or a long note. */
.body .wp-block-image,.sheet .wp-block-image{margin:1.6em 0}
.body .wp-block-image img,.sheet .wp-block-image img{max-width:100%;height:auto}
.body .wp-block-image figcaption{font-family:'Caveat',cursive;font-size:22px;text-align:center;color:var(--page-soft,var(--soft))}