@import url("cursor.css?v=gesture-chapters-2");
@font-face{font-family:'Fragment Mono';src:url('assets/fragment-mono-regular.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-024F,U+2000-206F,U+2190-21FF,U+2212}
@font-face{font-family:MiSans;src:url('assets/misans-web-062ca1cc3324.woff2') format('woff2');font-weight:400;font-display:swap}
/* Shared typography; source artwork and its text scale together. */
:root {
  --case-font:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --weight-body:400;
  --weight-title:500;
  --weight-meta:400;
  --surround:#fff;
  --surround-ink:#000;
  --chrome-muted:#737373;
  --chrome-line:#e8e8e8;
  --chrome-hover:#f5f5f5;
  --chrome-font:'Fragment Mono','MiSans',monospace;
  --chrome-gutter:clamp(64px,5.556vw,80px);
  --chrome-height:80px;
  --chrome-type:13px;
}
html[data-project="insta"] {
  --surround:#000;
  --surround-ink:#fff;
  --chrome-muted:#aaa;
  --chrome-line:#333;
  --chrome-hover:#1a1a1a;
}
html,body.portfolio-case { background:var(--surround); }
html { scrollbar-color:var(--chrome-muted) var(--surround); }
.portfolio-case {
  --content-factor:.9;
  --canvas-width:calc(987.428571px * var(--content-factor));
  --reading-width:calc(864px * var(--content-factor));
  --art-scale:.462857143;
  font-family:var(--case-font); font-weight:var(--weight-body); color:var(--surround-ink);
}
.portfolio-case .composition {
  font-family:var(--case-font);
  /* Unitless zoom works without CSS length / length typed arithmetic. */
  zoom:var(--composition-fit,var(--art-scale));
}
.composition-window { overflow:hidden; }
.portfolio-case .composition-window.is-enlarged .composition { zoom:var(--art-scale); }
/* The native reminder uses the same reduction, including inherited size tokens. */
.portfolio-case .reminder-case {
  --scale:calc(.9 * var(--content-factor));
  --content:calc(960px * var(--scale));
  --title:calc(22px * var(--scale));
  --text:calc(16px * var(--scale));
}
.portfolio-case h1,.portfolio-case h2,.portfolio-case h3,.portfolio-case strong,.portfolio-case b {
  font-weight:var(--weight-title);
}
.portfolio-case .portfolio-footer {
  font-weight:var(--weight-meta);
}
/* Chapter grounds stay inside the fixed canvas, leaving one continuous margin. */
.chapter:not(.approved-reminder) { width:var(--canvas-width); max-width:100%; margin-inline:auto; }
.chapter.light,.chapter.approved-reminder { color:#000; }
.portfolio-header {
  background:var(--surround); color:var(--surround-ink); border-color:var(--chrome-line);
}
.portfolio-footer { color:var(--chrome-muted); }
.portfolio-footer { border:0; justify-content:center; font:400 var(--chrome-type)/20px var(--chrome-font); }
.portfolio-case a:focus-visible { outline-color:currentColor; }
.portfolio-case .skip-link { background:var(--surround); color:var(--surround-ink); }
/* Match the outer site's quiet, edge-aligned masthead. */
.portfolio-header { border:0; font:400 var(--chrome-type)/20px var(--chrome-font); }
.header-inner { width:auto; height:var(--chrome-height); min-height:0; margin:0 var(--chrome-gutter); gap:24px; }
.case-back { width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; margin-left:-11px; color:var(--surround-ink); }
.case-back svg { transition:transform 180ms; }
.case-back:hover svg { transform:translateX(-3px); }
.portfolio-header a:hover { text-decoration:none; }
.portfolio-header a:focus-visible { outline:1px solid currentColor; outline-offset:2px; }
.chapter,.composition-window { scroll-margin-top:var(--chrome-height); }
.portfolio-case ::selection { background:var(--surround-ink); color:var(--surround); }
@media(max-width:960px) {
  :root { --chrome-gutter:clamp(24px,5vw,48px); --chrome-height:72px; }
  .header-inner { gap:20px; }
}
/* Feedback 705:27703: same dimensions for cards in each annotated group. */
.composition :is([data-node-id="694:104541"],[data-node-id="694:104546"],[data-node-id="694:104551"]) { width:840px; height:360px; }
.composition :is([data-node-id="694:104541"],[data-node-id="694:104546"],[data-node-id="694:104551"]) > p { width:100%; min-width:0; white-space:normal; }
.composition [data-node-id="694:104541"] { left:975px; }
.composition [data-node-id="694:104551"] { left:105px; top:910px; }
.composition :is([data-node-id="694:105112"],[data-node-id="694:105120"],[data-node-id="694:105128"]) { width:1113px; height:300px; }
.composition :is([data-node-id="694:105112"],[data-node-id="694:105120"],[data-node-id="694:105128"]) > p { width:100%; white-space:normal; }
.composition [data-node-id="694:105120"] { top:2072px; }
.composition [data-node-id="694:105128"] { top:2420px; }
.composition [data-node-id="694:105125"] { top:2099px; }
.composition [data-node-id="694:105126"] { top:2240.83px; }
.composition [data-node-id="694:105133"] { top:2447px; }
.composition [data-node-id="694:105134"] { top:2588.83px; }
@media(max-width:760px) {
  .portfolio-case .reminder-case { --scale:.9; --title:calc(20px * var(--scale)); --text:calc(15px * var(--scale)); }
}
@media(prefers-reduced-motion:reduce) {
  .case-back svg { transition:none; }
}