:root { --paper:#d9d6ce; --ink:#171916; --muted:#62645e; --line:rgba(23,25,22,.2); --accent:#363d34; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px Arial,Helvetica,sans-serif; }
button,a { font:inherit; }
button { color:inherit; }
::selection { background:#2e352d; color:#f4f2ec; }
.site-header { min-height:78px; padding:0 3.2vw; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.wordmark { color:var(--ink); text-decoration:none; text-transform:uppercase; letter-spacing:-.045em; font-size:clamp(17px,1.55vw,24px); font-weight:700; }
.edition,.eyebrow { margin:0; text-transform:uppercase; letter-spacing:.12em; font-size:10px; line-height:1.4; }
.edition { color:var(--muted); }
.hero { min-height:calc(100svh - 78px); display:grid; grid-template-columns:minmax(320px,.82fr) minmax(480px,1.18fr); border-bottom:1px solid var(--line); }
.intro { padding:clamp(48px,6vw,94px) 4vw 44px 3.2vw; display:flex; flex-direction:column; border-right:1px solid var(--line); }
.intro h1 { max-width:760px; margin:24px 0 0; font-size:clamp(48px,6vw,100px); font-weight:400; line-height:.92; letter-spacing:-.065em; }
.lead { max-width:520px; margin:40px 0 56px; color:#343631; font-size:clamp(18px,1.45vw,24px); line-height:1.35; letter-spacing:-.02em; }
.primary-action { min-height:56px; width:max-content; padding:0 22px; border:0; border-radius:0; display:inline-flex; align-items:center; gap:13px; background:var(--accent); color:#f3f1eb; cursor:pointer; font-size:13px; }
.primary-action:hover { background:#20251f; }
.primary-action.compact { min-height:48px; }
.action-note { max-width:430px; margin:13px 0 42px; color:var(--muted); font-size:10px; line-height:1.45; }
.steps { list-style:none; margin:auto 0 0; padding:0; border-top:1px solid var(--line); }
.steps li { min-height:49px; display:grid; grid-template-columns:54px 1fr; align-items:center; border-bottom:1px solid var(--line); font-size:13px; }
.steps li span { font:10px Consolas,monospace; color:var(--muted); }
.steps li p { margin:0; }
.viewer-column { min-width:0; padding:3.2vw; display:flex; }
.viewer-shell { position:relative; width:100%; min-height:640px; overflow:hidden; background:#c8c5bd; }
.viewer-shell::after { content:''; position:absolute; inset:0; pointer-events:none; border:1px solid rgba(23,25,22,.12); }
.viewer-meta { position:absolute; z-index:3; inset:18px 20px auto; display:flex; justify-content:space-between; color:rgba(23,25,22,.62); font:10px/1.3 Consolas,monospace; text-transform:uppercase; letter-spacing:.08em; pointer-events:none; }
.model-viewer { display:block; width:100%; height:100%; min-height:640px; --poster-color:#c8c5bd; --progress-bar-color:#3c433a; }
.camera-float { position:absolute; z-index:4; left:50%; bottom:28px; min-height:52px; padding:0 22px; transform:translateX(-50%); border:0; background:var(--accent); color:#f3f1eb; cursor:pointer; white-space:nowrap; font-size:13px; }
.ar-button { position:absolute; z-index:4; left:50%; bottom:28px; min-height:52px; padding:0 22px; transform:translateX(-50%); border:0; border-radius:0; display:inline-flex; align-items:center; gap:12px; background:var(--accent); color:#f3f1eb; cursor:pointer; white-space:nowrap; font-size:13px; transition:background .2s ease,transform .2s ease; }
.ar-button:hover { background:#20251f; transform:translateX(-50%) translateY(-2px); }
.ar-button:focus-visible { outline:2px solid #fff; outline-offset:-4px; }
.ar-mark { font-size:21px; line-height:1; }
.viewer-caption { position:absolute; z-index:3; left:20px; bottom:15px; max-width:280px; margin:0; color:var(--muted); font-size:10px; line-height:1.35; pointer-events:none; }
.gallery { padding:clamp(72px,8vw,130px) 3.2vw; border-bottom:1px solid var(--line); }
.gallery-heading { display:grid; grid-template-columns:1fr 2.4fr 1fr; gap:4vw; align-items:end; margin-bottom:54px; }
.gallery-heading h2 { margin:0; font-size:clamp(38px,5vw,78px); line-height:.95; font-weight:400; letter-spacing:-.055em; }
.text-action { justify-self:end; border:0; border-bottom:1px solid currentColor; padding:0 0 5px; background:none; cursor:pointer; font-size:12px; }
.gallery-grid { min-height:240px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.gallery-empty { grid-column:1/-1; margin:0; display:grid; place-items:center; border:1px solid var(--line); color:var(--muted); font-size:13px; }
.gallery-item { aspect-ratio:4/5; margin:0; overflow:hidden; background:#bdbab2; }
.gallery-item img { width:100%; height:100%; display:block; object-fit:cover; }
.statement { padding:clamp(72px,9vw,150px) 3.2vw; display:grid; grid-template-columns:1fr 2.4fr 1fr; gap:4vw; border-bottom:1px solid var(--line); }
.statement-copy { margin:0; max-width:900px; font-size:clamp(30px,4.2vw,70px); line-height:1.03; letter-spacing:-.05em; }
.statement-note { align-self:end; max-width:210px; margin:0; color:var(--muted); font-size:13px; line-height:1.45; }
footer { min-height:82px; padding:0 3.2vw; display:flex; align-items:center; justify-content:space-between; gap:24px; text-transform:uppercase; font-size:10px; letter-spacing:.09em; }

.camera-open { overflow:hidden; }
.camera-studio { position:fixed; z-index:100; inset:0; width:100%; height:100dvh; overflow:hidden; background:#171916; color:#fff; touch-action:none; }
.camera-studio[hidden] { display:none; }
#camera-video { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
#camera-canvas { position:absolute; inset:0; width:100%; height:100%; display:block; touch-action:none; }
.camera-topbar { position:absolute; z-index:4; top:0; left:0; right:0; padding:max(16px,env(safe-area-inset-top)) 18px 0; display:grid; grid-template-columns:48px 1fr 48px; gap:12px; align-items:start; pointer-events:none; }
.round-control { width:44px; height:44px; border:1px solid rgba(255,255,255,.4); border-radius:50%; background:rgba(18,20,18,.54); color:#fff; font-size:25px; cursor:pointer; pointer-events:auto; backdrop-filter:blur(12px); }
.camera-instruction { justify-self:center; padding:9px 15px; border-radius:2px; display:flex; flex-direction:column; align-items:center; gap:3px; background:rgba(18,20,18,.54); backdrop-filter:blur(12px); text-align:center; }
.camera-instruction strong { font-size:12px; font-weight:600; }
.camera-instruction span { color:rgba(255,255,255,.7); font-size:9px; }
.camera-size { justify-self:end; display:grid; place-items:center; width:44px; height:44px; border:1px solid rgba(255,255,255,.4); border-radius:50%; background:rgba(18,20,18,.54); font:9px Consolas,monospace; backdrop-filter:blur(12px); }
.camera-permission { position:absolute; z-index:6; inset:0; padding:32px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; background:#242722; color:#f3f1eb; }
.camera-permission[hidden] { display:none; }
.camera-permission h2 { margin:18px 0 22px; font-size:clamp(45px,12vw,80px); line-height:.92; font-weight:400; letter-spacing:-.06em; }
.camera-permission > p:not(.eyebrow):not(.camera-error) { max-width:440px; margin:0 0 30px; color:#c8c9c3; line-height:1.45; }
.light-action { min-height:54px; padding:0 22px; border:0; background:#f0eee8; color:#1d201c; cursor:pointer; }
.upload-background { margin-top:18px; border-bottom:1px solid rgba(255,255,255,.45); padding-bottom:4px; color:#d6d7d1; font-size:11px; cursor:pointer; }
.upload-background input { position:absolute; width:1px; height:1px; opacity:0; }
.camera-error { max-width:520px; min-height:18px; margin:18px 0 0; color:#ffb7a6; font-size:12px; }
.object-controls { position:absolute; z-index:5; left:50%; bottom:calc(112px + env(safe-area-inset-bottom)); transform:translateX(-50%); display:flex; overflow:hidden; border:1px solid rgba(255,255,255,.3); background:rgba(18,20,18,.56); backdrop-filter:blur(12px); }
.object-controls button { min-width:46px; height:42px; padding:0 13px; border:0; border-right:1px solid rgba(255,255,255,.18); background:transparent; color:#fff; cursor:pointer; font-size:15px; }
.object-controls button:nth-child(3) { font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.object-controls button:last-child { border-right:0; }
.camera-bottom { position:absolute; z-index:5; left:0; right:0; bottom:0; min-height:98px; padding:0 22px max(12px,env(safe-area-inset-bottom)); display:grid; grid-template-columns:1fr 84px 1fr; align-items:center; gap:18px; background:linear-gradient(transparent,rgba(0,0,0,.62)); pointer-events:none; }
.camera-bottom > span { color:rgba(255,255,255,.68); font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.camera-bottom > span:first-child { text-align:right; }
.shutter { width:76px; height:76px; border:2px solid #fff; border-radius:50%; display:grid; place-items:center; background:rgba(0,0,0,.15); cursor:pointer; pointer-events:auto; }
.shutter span { width:60px; height:60px; border-radius:50%; background:#fff; transition:transform .12s ease; }
.shutter:active span { transform:scale(.9); }
.photo-review { width:min(1080px,calc(100% - 28px)); max-width:none; max-height:calc(100dvh - 28px); padding:0; border:0; background:#dedbd3; color:var(--ink); }
.photo-review::backdrop { background:rgba(12,14,12,.78); backdrop-filter:blur(6px); }
.photo-review[open] { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr); }
.review-frame { min-height:68dvh; background:#111; }
.review-frame img { width:100%; height:100%; display:block; object-fit:contain; }
.review-copy { padding:clamp(28px,4vw,58px); display:flex; flex-direction:column; justify-content:center; }
.review-copy h2 { margin:16px 0; font-size:clamp(40px,5vw,68px); line-height:.95; font-weight:400; letter-spacing:-.055em; }
.review-copy > p:not(.eyebrow):not(.publish-status) { color:var(--muted); line-height:1.45; }
.review-actions { margin-top:32px; display:flex; flex-wrap:wrap; gap:8px; }
.secondary-action { min-height:48px; padding:0 17px; border:1px solid var(--line); display:inline-flex; align-items:center; justify-content:center; background:transparent; color:var(--ink); text-decoration:none; cursor:pointer; font-size:12px; }
.publish-status { min-height:18px; margin:15px 0 0; color:var(--muted); font-size:11px; }
.publish-note { margin:14px 0 0; color:var(--muted); font-size:10px; line-height:1.4; }
@media (max-width:900px) {
  .site-header { min-height:64px; padding:0 20px; } .edition { text-align:right; }
  .hero { display:flex; flex-direction:column; } .intro { padding:42px 20px 30px; border-right:0; }
  .intro h1 { font-size:clamp(48px,14vw,76px); } .lead { margin:30px 0 44px; } .steps { margin-top:0; }
  .viewer-column { padding:20px; border-top:1px solid var(--line); } .viewer-shell,.model-viewer { min-height:min(136vw,680px); }
  .statement { padding:76px 20px; grid-template-columns:1fr; gap:28px; } .statement-copy { font-size:clamp(34px,10vw,58px); } .statement-note { margin-top:28px; }
  .gallery { padding:76px 20px; } .gallery-heading { grid-template-columns:1fr; gap:20px; } .text-action { justify-self:start; }
  .gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .photo-review[open] { grid-template-columns:1fr; overflow:auto; } .review-frame { min-height:52dvh; } .review-copy { padding:28px 20px; }
  footer { padding:0 20px; }
}
@media (max-width:520px) {
  .wordmark { font-size:16px; } .edition { max-width:130px; font-size:8px; } .viewer-column { padding:0; }
  .viewer-shell::after { border-left:0; border-right:0; } .viewer-caption { display:none; }
  .ar-button { bottom:20px; width:calc(100% - 40px); justify-content:center; }
  .primary-action { width:100%; justify-content:center; } .camera-float { bottom:20px; width:calc(100% - 40px); }
  .gallery-grid { grid-template-columns:1fr; }
  .camera-topbar { grid-template-columns:44px 1fr 44px; padding-left:12px; padding-right:12px; } .camera-instruction span { display:none; }
  .object-controls { bottom:calc(104px + env(safe-area-inset-bottom)); } .object-controls button { min-width:42px; padding:0 10px; }
  .camera-bottom { grid-template-columns:1fr 72px 1fr; } .shutter { width:68px; height:68px; } .shutter span { width:54px; height:54px; }
  .review-actions { display:grid; grid-template-columns:1fr 1fr; } .review-actions .primary-action { grid-column:1/-1; }
  footer { align-items:flex-start; flex-direction:column; justify-content:center; gap:6px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .ar-button { transition:none; } }