@font-face{font-family:Bricolage;src:url('assets/fonts/bricolage-latin.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap}
@font-face{font-family:Public;src:url('assets/fonts/public-sans-latin.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root{--paper:oklch(93.2% .018 86);--ink:oklch(25% .025 49);--muted:oklch(47% .025 49);--accent:oklch(49% .16 29);--line:oklch(76% .025 86);--space-sm:12px;--space-md:24px;--space-lg:48px;--space-xl:96px;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Public,sans-serif;line-height:1.6}a{color:inherit;text-underline-offset:5px}button,input{font:inherit}button,a,label{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a:focus-visible,button:focus-visible,input:focus-visible,.button:has(+input:focus-visible){outline:3px solid var(--accent);outline-offset:5px}button:hover,a:hover{color:var(--accent)}.wrap{width:min(1360px,calc(100% - 96px));margin-inline:auto}.masthead{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:28px;border-bottom:1px solid var(--line)}.brand{display:grid;grid-template-columns:42px auto;column-gap:12px;align-items:center;font:800 30px/.95 Bricolage,sans-serif;letter-spacing:-1px;text-decoration:none}.brand img{grid-row:span 2}.brand span{font:500 10px/1.8 Public,sans-serif;letter-spacing:2px;margin-top:5px}nav{display:flex;gap:32px;font-size:14px}nav a{text-decoration:none}.intro{display:grid;grid-template-columns:1fr 290px;gap:48px;align-items:end;padding-block:64px 56px}.eyebrow{font-size:11px;font-weight:650;letter-spacing:1.6px;margin:0 0 20px}h1,h2{font-family:Bricolage,sans-serif;letter-spacing:-.065em;font-weight:650}h1{font-size:clamp(60px,7.8vw,116px);line-height:.92;margin:0}h1 em{font-style:normal;color:var(--accent)}.intro-note{padding-bottom:8px}.intro-note p{font-size:16px;margin:16px 0 0}.intro-note .small,.small{font-size:12px;color:var(--muted);max-width:65ch}.rosette{font-size:70px;line-height:.6;color:var(--accent)}.workbench{background:oklch(88.5% .024 86);padding-block:36px 24px}.bench-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:24px}.bench-heading h2{font-size:30px;letter-spacing:-.045em;margin:0}.bench-heading .eyebrow{margin:0}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 272px;gap:36px;align-items:start}.picture{margin:0;min-width:0}.canvas-wrap{aspect-ratio:3/2;position:relative;overflow:hidden;background:var(--ink)}.canvas-wrap img,.canvas-wrap canvas{width:100%;height:100%;object-fit:cover;display:block}.canvas-wrap [hidden]{display:none}figcaption{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px;padding-top:12px;color:var(--muted)}figcaption button{font-size:12px}.controls{display:flex;flex-direction:column;gap:24px}fieldset{border:0;margin:0;padding:0;min-width:0}legend,.slider label{font-size:13px;font-weight:650;padding:0;margin-bottom:10px}.segments{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.segments button{border:1px solid var(--line);background:transparent;padding:5px;font:600 28px Bricolage,sans-serif;min-height:48px}.segments button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}.hint{font-size:11px;color:var(--muted);margin:8px 0 0;min-height:18px}.slider label{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.slider output{font-weight:450;font-variant-numeric:tabular-nums}input[type=range]{width:100%;margin:0;accent-color:var(--accent);min-height:28px;cursor:pointer}.actions{display:flex;flex-direction:column;gap:12px;padding-top:4px}.button{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:48px;padding:12px 16px;background:var(--accent);border:1px solid var(--accent);color:var(--paper);text-decoration:none;font-size:13px;font-weight:600;cursor:pointer}.button:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}.text-button,figcaption button{border:0;padding:0;min-height:32px;background:transparent;color:inherit;text-align:left;text-decoration:underline;text-underline-offset:4px}.file-input{position:absolute;width:1px;height:1px;opacity:0}.visual-note{font-size:10px;color:var(--muted);max-width:100ch;margin:18px 0 0}.camera{display:grid;grid-template-columns:1fr 1fr;gap:96px;padding-block:88px}h2{font-size:clamp(40px,4.6vw,64px);line-height:1; margin:0 0 24px}.lead{font-size:18px;max-width:35ch}.camera-copy{padding-top:32px}.camera-copy p{max-width:62ch;font-size:14px}.camera-copy .button{display:inline-flex;margin-block:12px;gap:32px}.camera-copy .small{font-size:12px}footer{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);padding-block:24px 36px;font-size:11px}footer span{font-weight:650;letter-spacing:1px}.skip{position:fixed;left:12px;top:-100px;z-index:5;background:var(--paper);padding:12px}.skip:focus{top:12px}
.camera{row-gap:40px}.camera-gallery{grid-column:1/-1}.camera-gallery h3{font:600 30px/1.1 Bricolage,sans-serif;letter-spacing:-.04em;margin:0 0 20px}.camera-shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.camera-shot{margin:0;min-width:0}.camera-shot a{display:block}.camera-shot img{display:block;width:100%;height:auto;aspect-ratio:3/2;border:1px solid var(--line)}.camera-shot figcaption{display:block}.camera-gallery>.small{margin:20px 0 0}
@media(min-width:1400px){.controls{gap:28px}}
@media(max-width:1000px){.wrap{width:calc(100% - 48px)}.intro{grid-template-columns:1fr 240px;gap:24px}.workspace{grid-template-columns:minmax(0,1fr) 240px;gap:24px}.controls{gap:16px}.camera{gap:48px}.intro-note p{font-size:14px}}
@media(max-width:740px){.wrap{width:calc(100% - 32px)}.masthead{padding-block:20px}.brand{font-size:25px;grid-template-columns:34px auto}.brand img{width:34px;height:34px}nav{gap:16px;font-size:11px}.intro{grid-template-columns:1fr;padding-block:40px 32px;gap:24px}h1{font-size:clamp(56px,11.8vw,86px)}.intro-note{display:flex;align-items:center;gap:20px}.intro-note p{margin:0;font-size:13px}.intro-note .small{display:none}.rosette{font-size:52px}.eyebrow{font-size:9px;letter-spacing:1px}.workbench{padding-top:24px}.bench-heading h2{font-size:24px}.bench-heading .eyebrow{display:none}.workspace{grid-template-columns:1fr;gap:24px}.controls{display:grid;grid-template-columns:1fr 1fr;gap:24px 20px}.actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8px 20px}.actions .button{grid-row:span 2}.controls>p{grid-column:1/-1;margin:0}.visual-note{font-size:9px}.camera{grid-template-columns:1fr;padding-block:48px;gap:8px}.camera-copy{padding-top:0}footer{align-items:start;flex-wrap:wrap;gap:8px}footer p{margin:0}footer a{margin-left:auto}figcaption{font-size:10px}figcaption button{font-size:11px;min-height:44px}.canvas-wrap{margin-inline:-16px}}
@media(max-width:740px){.camera-gallery{margin-top:24px}.camera-shots{grid-template-columns:1fr}.camera-gallery h3{font-size:26px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.setup,.faq{display:grid;grid-template-columns:1fr 1fr;gap:96px;padding-block:64px;border-top:1px solid var(--line)}.install-steps{margin:0 0 24px;padding-left:22px;font-size:14px}.install-steps li{padding-left:8px;margin-bottom:20px}.install-steps strong{display:block}.install-steps code{overflow-wrap:anywhere;font-size:12px}.setup>div>a{font-size:13px}.faq-items details{border-bottom:1px solid var(--line)}.faq-items summary{cursor:pointer;font-size:16px;font-weight:600;padding:20px 24px 20px 0}.faq-items p{font-size:14px;max-width:62ch;margin:0 0 24px}.faq-items summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.related{padding-block:64px 80px;border-top:1px solid var(--line)}.related h2{font-size:clamp(36px,4.6vw,56px)}.related>p:not(.eyebrow){max-width:64ch}.related .small{font-size:12px}
@media(max-width:1000px){.setup,.faq{gap:48px}}
@media(max-width:740px){.setup,.faq{grid-template-columns:1fr;gap:16px;padding-block:40px}.related{padding-block:40px 48px}.masthead{flex-wrap:wrap;gap:16px}nav{flex-wrap:wrap}.faq-items summary{font-size:15px}.camera-shot figcaption{min-height:0}}