/* E and F share the page; only the photographic ribbon material changes. */
.remix-material .header .main-nav>.button { background:#ddf200; color:#20201f; }
.remix-material .header .main-nav>.button:hover { background:#e8fa3e; }
.remix-material .proof-panel .section-heading h2.proof-label {
  font:14px/1.5 Space,sans-serif;
  letter-spacing:.035em;
  margin:0;
  white-space:normal;
}
.remix-material .proof-panel .section-heading>p { color:var(--blue); font-style:italic; }
.remix-painted .proof-panel .section-heading>.proof-quote { color:var(--ink); }
.remix-painted .proof-attribution { color:#858078; font-size:13px; font-style:normal; white-space:nowrap; }
.remix-material .work-gallery { --gallery-height:clamp(430px,35vw,595px); }

/* The transparent source texture extends past the viewport on both sides. */
.remix-material .ticker {
  --ribbon-image:url('assets/ribbon-tape-v18.webp');
  --ribbon-filter:drop-shadow(0 2px 2px #5e4b291b);
  isolation:isolate;
  overflow:visible;
  background:transparent;
  border:0;
  margin-inline:0;
  padding-block:22px;
  transform:rotate(-1.1deg);
}
.remix-painted .ticker { --ribbon-image:url('assets/ribbon-paint-v18.webp'); --ribbon-filter:none; }
.remix-material .ticker:before {
  content:"";
  position:absolute;
  inset:-55% -40px;
  z-index:-1;
  background:var(--ribbon-image) center / 100% 100% no-repeat;
  filter:var(--ribbon-filter);
  pointer-events:none;
}
.remix-material .ticker>div { padding-inline:var(--gutter); width:100%; overflow:hidden; }
.remix-material .ticker>div>* { flex-shrink:0; }
.remix-material .ticker>div>span { font-size:.968em; }
/* All four phrases stay visible: the type scales down until the row fits (it fits at 31px from ~1240px). */
@media(min-width:761px) and (max-width:1240px) {
  .remix-material .ticker>div { font-size:min(31px,2.4vw); }
}
@media(max-width:760px) {
  .remix-material .ticker { padding-block:18px; }
  /* Phones: two rows (two phrases each) on the same painted stroke; the row-end asterisks drop out. */
  .remix-material .ticker>div { flex-wrap:wrap; justify-content:space-between; gap:2px 12px; font-size:min(24px,calc((100vw - 68px) * .0715)); }
  .remix-material .ticker>div>span { font-size:.96em; }
  .remix-material .ticker>div>:nth-child(4n) { display:none; }
  .remix-material .ticker>div>:nth-child(n+5) { order:2; }
  .remix-material .ticker>div::after { content:""; order:1; flex-basis:100%; height:0; }
  .remix-material .proof-panel .section-heading h2.proof-label { font-size:12px; }
  .remix-material .work-gallery { --gallery-height:320px; }
}
@media(max-width:360px) { .remix-material .work-gallery { --gallery-height:280px; } }
