.cg-example-gallery{padding:20px 7vw 60px;color:var(--cg-paper)}.cg-example-intro{max-width:700px;margin:0 0 42px}.cg-example-overline{font:12px/1.5 monospace;letter-spacing:.15em;margin:0 0 22px}.cg-example-intro h2{font:300 clamp(34px,4.5vw,66px)/1.05 Larken,Georgia,serif;letter-spacing:-.035em;margin:0 0 22px}.cg-example-intro>p:last-child{font-size:17px;line-height:1.6;max-width:540px;opacity:.8}.cg-example-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 28px}.cg-example-card{min-width:0}.cg-example-open{position:relative;display:block;width:100%;padding:0;overflow:hidden;border:1px solid var(--cg-rule);border-radius:0;background:var(--cg-black);color:var(--cg-paper);cursor:pointer;text-align:left}.cg-example-open img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:contain;transition:transform .55s cubic-bezier(.2,.7,.2,1)}.cg-example-open:hover img{transform:scale(1.025)}.cg-example-action{display:block;padding:16px 18px;border-top:1px solid var(--cg-rule);font-size:14px}.cg-example-open:focus-visible{outline:2px solid var(--cg-blue);outline-offset:5px}.cg-example-caption{display:flex;gap:20px;align-items:baseline;justify-content:space-between;padding:17px 0}.cg-example-caption h3{font-weight:400;font-size:19px;margin:0}.cg-example-caption>span{font:11px/1.4 monospace;white-space:nowrap;text-transform:uppercase;opacity:.65}.cg-preview-viewer{position:fixed;inset:18px;width:calc(100% - 36px);height:calc(100dvh - 36px);max-width:none;max-height:none;padding:0;margin:0;border:1px solid var(--cg-rule);border-radius:9px;background:var(--cg-black);color:var(--cg-paper);overflow:hidden;overscroll-behavior:contain}.cg-preview-viewer::backdrop{background:color-mix(in srgb,var(--cg-black) 92%,transparent)}.cg-preview-viewer[open]{display:flex;flex-direction:column;animation:cg-preview-in .22s ease-out}.cg-preview-bar{display:flex;align-items:center;gap:25px;flex-shrink:0;padding:16px 20px;border-bottom:1px solid var(--cg-rule);min-height:78px}.cg-preview-heading{min-width:0;margin-right:auto}.cg-preview-kind{display:block;font:10px/1.4 monospace;letter-spacing:.1em;text-transform:uppercase;opacity:.6;margin-bottom:5px}.cg-preview-title{margin:0;font:400 17px/1.3 var(--font);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cg-preview-sizes{display:flex;gap:8px}.cg-preview-bar button{font-size:13px;border:1px solid var(--cg-rule);border-radius:6px;background:transparent;color:var(--cg-paper);padding:10px 13px;cursor:pointer;white-space:nowrap}.cg-preview-bar button[aria-pressed=true]{background:var(--cg-navy)}.cg-preview-viewport{display:flex;flex:1;min-height:0;justify-content:center;overflow:hidden;background:var(--cg-black)}.cg-preview-frame{height:100%;width:100%;border:0;background:var(--cg-paper)}.cg-preview-viewer[data-width=phone] .cg-preview-frame{width:min(375px,100%)}.cg-category-controls[hidden]{display:none}.cg-category-controls{position:fixed;z-index:32;left:50%;bottom:86px;transform:translateX(-50%);display:flex;align-items:stretch;width:min(500px,calc(100% - 36px));color:var(--cg-paper);background:color-mix(in srgb,var(--cg-black) 88%,transparent);border:1px solid var(--cg-rule);border-radius:7px}.cg-category-controls button{border:0;color:inherit;background:transparent;cursor:pointer}.cg-category-arrow{width:58px;flex-shrink:0;font:400 28px/1 var(--font)}.cg-category-open{display:grid;grid-template-columns:1fr auto;flex:1;min-width:0;gap:8px 16px;padding:13px 8px;font-size:17px;text-align:left}.cg-category-open small{font:10px/1.7 monospace;opacity:.6}.cg-category-open-text{grid-column:1/-1;font:10px/1.4 monospace;text-transform:uppercase;letter-spacing:.08em;opacity:.7}.cg-preview-open .cg-tools,.cg-preview-open .cg-category-controls{visibility:hidden}.cg-preview-open body>canvas,.cg-preview-open #gl{pointer-events:none}@keyframes cg-preview-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}@media(max-width:767px){.cg-example-gallery{padding:0 22px 40px}.cg-example-grid{grid-template-columns:1fr;gap:28px}.cg-example-intro{margin-bottom:28px}.cg-example-intro h2{font-size:37px}.cg-example-intro>p:last-child{font-size:15px}.cg-example-caption{gap:12px}.cg-example-caption h3{font-size:17px}.cg-example-caption>span{font-size:9px}.cg-preview-viewer{inset:0;width:100%;height:100dvh;border:0;border-radius:0}.cg-preview-bar{gap:10px;padding:12px;min-height:76px}.cg-preview-title{font-size:13px;max-width:205px}.cg-preview-bar button{font-size:11px;padding:9px 10px}.cg-preview-sizes{display:none}.cg-category-controls{bottom:78px}.cg-category-arrow{width:45px}.cg-category-open{font-size:15px;gap:5px 10px}.cg-category-open-text{font-size:9px}}@media(prefers-reduced-motion:reduce){.cg-preview-viewer[open]{animation:none}.cg-example-open img{transition:none}}

/* Keep navigation at the sides of the screen; the lower caption has no repeated arrows. */
.cg-category-controls .cg-category-arrow{position:fixed;top:calc(-50dvh + 93px);height:48px;width:48px;padding:0;overflow:hidden;opacity:0;pointer-events:auto}.cg-category-controls .cg-category-arrow:first-child{left:calc(50% - 44vw)}.cg-category-controls .cg-category-arrow:last-child{right:calc(50% - 44vw)}.cg-category-controls .cg-category-arrow:focus-visible{opacity:1;background:var(--cg-black);outline:2px solid var(--cg-blue);border-radius:6px}.cg-category-controls .cg-category-open{padding-inline:20px}@media(max-width:767px){.cg-category-controls .cg-category-arrow{top:calc(-50dvh + 97px);width:40px;height:40px}.cg-category-controls .cg-category-arrow:first-child{left:-4px}.cg-category-controls .cg-category-arrow:last-child{right:-4px}}
.cg-work-gallery #cta-dock{visibility:hidden;pointer-events:none}
@media(max-width:767px){
.cg-category-controls{left:18px;right:18px;width:auto;transform:none;margin:0}
.cg-category-controls .cg-category-arrow{top:50dvh;transform:translateY(-50%);opacity:1;width:40px;height:40px;border:1px solid var(--cg-rule);border-radius:50%;background:var(--cg-black);color:var(--cg-paper);font-size:23px}
.cg-category-controls .cg-category-arrow:first-child{left:3px}.cg-category-controls .cg-category-arrow:last-child{right:3px}
}
.cg-work-gallery #open-hint{display:none!important}

/* Mobile: one large display, one set of controls, no camera flight. */
@media(max-width:767px){
  .cg-category-controls{top:calc(50dvh + 132px);bottom:auto;left:17px;right:17px;min-height:65px;display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;background:var(--cg-black);border-color:var(--cg-rule)}
  .cg-category-controls .cg-category-arrow{position:static;transform:none;width:44px;height:44px;opacity:1;font-size:25px;border:0;border-radius:6px;box-shadow:none;filter:none;background:transparent}
  .cg-category-controls .cg-category-open{padding:12px 8px;font-size:16px;gap:5px 8px}.cg-category-open small{font-size:10px}.cg-category-open-text{font-size:9px}
  #project{transition:opacity .24s cubic-bezier(.2,.65,.3,1)}
  #project.open #project-content{animation:cg-mobile-detail-in .24s cubic-bezier(.2,.65,.3,1)}
  @keyframes cg-mobile-detail-in{from{transform:translateY(6px)}to{transform:none}}
}
@media(max-width:767px) and (prefers-reduced-motion:reduce){#project{transition:none}#project.open #project-content{animation:none}}

/* A category headline above the projected display, in the site's existing serif. */
.cg-category-heading[hidden]{display:none}
.cg-category-heading{position:fixed;z-index:32;left:7vw;top:25dvh;width:86vw;margin:0;transform:translateY(-100%);color:var(--cg-paper);font:300 clamp(36px,4vw,58px)/1.08 Larken,Georgia,serif;letter-spacing:-.045em;pointer-events:none}
.cg-category-heading>span{display:block}
.cg-preview-open .cg-category-heading{visibility:hidden}
.cg-category-arrow{transition:color .2s ease,background-color .2s ease}
.cg-category-arrow:hover{color:var(--cg-blue)}
.cg-category-arrow:active{background:color-mix(in srgb,var(--cg-paper) 10%,transparent)}
.cg-category-controls button:focus-visible{outline:2px solid var(--cg-blue);outline-offset:3px}
@media(max-width:767px){.cg-category-heading{font-size:clamp(30px,9.4vw,40px);line-height:1.12}}
@media(prefers-reduced-motion:reduce){.cg-category-arrow{transition:none}}