@font-face{font-family:Fraunces;font-style:normal;font-weight:300 500;font-display:swap;src:url(/c/3d-material-finish-switcher/fonts/fraunces-latin-48282a41.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter;font-style:normal;font-weight:400 500;font-display:swap;src:url(/c/3d-material-finish-switcher/fonts/inter-latin-c9407645.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*{margin:0;padding:0;box-sizing:border-box}:root{--ink: #f2eee6;--ink-dim: #a29a8c;--paper: #0b0a09;--rule: rgba(242, 238, 230, .16);--accent: #c9a227}html,body{height:100%}body{background:var(--paper);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}canvas{display:block}::selection{background:var(--accent);color:var(--paper)}.stage{position:relative;width:100%;height:100svh;background:radial-gradient(120% 90% at 50% 30%,#1a1713,#0b0a09 70%);overflow:hidden;touch-action:pan-y}.stage__poster,.stage canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.stage__poster{transition:opacity .7s ease}.stage.is-live .stage__poster{opacity:0}.stage__fallback{position:absolute;left:50%;bottom:12%;transform:translate(-50%);margin:0;padding:8px 14px;border:1px solid var(--rule);border-radius:999px;background:#0b0a0999;color:var(--ink-dim);font-size:12px;letter-spacing:.02em;backdrop-filter:blur(6px)}.ui{position:absolute;inset:0;z-index:2;display:grid;grid-template-rows:auto 1fr auto;padding:clamp(18px,3vw,36px);pointer-events:none}.ui a,.ui button{pointer-events:auto}.ui__bar{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.wordmark{display:block;color:var(--ink);font-family:Fraunces,Georgia,serif;font-size:clamp(20px,2.4vw,28px);font-weight:500;letter-spacing:.01em;line-height:1;text-decoration:none}.wordmark__sub{display:block;margin-top:6px;color:var(--ink-dim);font-family:Inter,sans-serif;font-size:11px;font-weight:400;letter-spacing:.14em;text-transform:uppercase}.nav{display:flex;gap:clamp(14px,2vw,28px)}.nav a{color:var(--ink-dim);font-size:13px;letter-spacing:.04em;text-decoration:none;transition:color .2s ease}.nav a:hover{color:var(--ink)}.headline{align-self:end;grid-row:2;font-family:Fraunces,Georgia,serif;font-size:clamp(38px,8vw,104px);font-weight:300;line-height:.95;letter-spacing:-.02em;pointer-events:none;text-shadow:0 2px 28px rgba(11,10,9,.75)}.headline__line{display:block}.headline__line--muted{color:var(--ink-dim);font-size:.36em;letter-spacing:.02em;margin-top:.5em}.foot{grid-row:3;display:grid;grid-template-columns:1fr auto;align-items:end;gap:16px 20px;margin-top:20px}.spec{grid-column:1;max-width:34ch;border-top:1px solid var(--rule);padding-top:12px}.spec__no{color:var(--ink-dim);font-size:11px;letter-spacing:.14em;text-transform:uppercase}.spec__name{margin-top:8px;font-family:Fraunces,Georgia,serif;font-size:22px;font-weight:500}.spec__meta{margin-top:8px;color:var(--ink-dim);font-size:13px;line-height:1.5}.finishes{grid-column:1;display:flex;flex-wrap:wrap;gap:10px}.finish{display:inline-flex;align-items:center;gap:10px;padding:9px 16px 9px 10px;border:1px solid var(--rule);border-radius:999px;background:#f2eee60a;color:var(--ink-dim);font:inherit;font-size:13px;letter-spacing:.02em;cursor:pointer;transition:color .24s ease,border-color .24s ease,background-color .24s ease}.finish:hover{color:var(--ink);border-color:#f2eee657}.finish[aria-pressed=true]{color:var(--paper);background:var(--ink);border-color:var(--ink)}.finish__chip{width:16px;height:16px;border-radius:50%;border:1px solid rgba(11,10,9,.25);background:var(--chip, #888);box-shadow:inset 0 1px 2px #ffffff80}.hint{grid-column:2;grid-row:2;display:flex;align-items:center;gap:8px;padding-bottom:10px;color:var(--ink-dim);font-size:12px;letter-spacing:.06em}.hint__dot{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:hint-pulse 2.4s ease-in-out infinite}.hint__text--touch{display:none}@keyframes hint-pulse{0%,to{opacity:.25;transform:scale(.7)}50%{opacity:1;transform:scale(1)}}@media(max-width:900px){.foot{grid-template-columns:1fr;gap:12px}.hint{grid-column:1;grid-row:auto;padding-bottom:0}.nav__optional{display:none}.headline{align-self:end;margin-bottom:4px}}@media(pointer:coarse){.hint__text--pointer{display:none}.hint__text--touch{display:inline}}@media(prefers-reduced-motion:reduce){.hint__dot{animation:none;opacity:.8}.stage__poster,.finish{transition:none}}