:root { --backdrop:#171614; --ink:#f3efe7; --muted:#aaa49b; --paper:#f7f7f4; }
*,*::before,*::after { box-sizing:border-box; }
[hidden] { display:none !important; }
html { width:100%; min-height:100%; overflow-x:hidden; overflow-y:auto; }
body { width:100%; min-height:100%; margin:0; overflow-x:hidden; overflow-y:auto; background:var(--backdrop); color:var(--ink); font-family:'IBM Plex Mono',ui-monospace,monospace; font-style:normal; font-weight:200; text-align:center; text-transform:lowercase; transition:background-color .5s ease; -webkit-font-smoothing:antialiased; }
.lagos-room .love-letter,
.lagos-room .love-letter h1,
.lagos-room .love-letter p,
.lagos-room .love-letter button,
.lagos-room .love-letter span { text-transform:lowercase; }
.aog-room { --backdrop:#f6f3ec; --ink:#171614; --muted:#625e57; }
.aog-room .exit-arrow,.aog-room .room-sound-toggle,.aog-room .room-menu-toggle { color:#171614; }
.aog-room.nav-open .room-menu-toggle { color:#fff; }
.aog-room .wordmark { background:transparent; box-shadow:none; }
.aog-room .love-letter { grid-template-rows:minmax(0,1fr) 280px; padding-top:88px; }
.aog-room .artwork-stage { min-height:0; padding-top:16px; }
.aog-room .artwork-image { box-shadow:0 46px 96px rgba(23,22,20,.42),0 22px 44px rgba(23,22,20,.32),0 7px 16px rgba(23,22,20,.2); transform:translateY(-7px); }
.aog-room .artwork-image { width:auto; height:min(44dvh,440px); max-height:none; object-fit:contain; }
.wearable-preview { position:relative; width:auto; height:min(44dvh,440px); max-width:min(70vw,520px); max-height:none; aspect-ratio:1; filter:drop-shadow(0 46px 48px rgba(23,22,20,.4)) drop-shadow(0 18px 22px rgba(23,22,20,.28)); transform:translateY(-7px); }
.aog-room .love-letter:has(.artwork-variants:not([hidden])) .artwork-image { height:min(44dvh,440px); max-height:none; }
.aog-room .love-letter:has(.artwork-variants:not([hidden])) .wearable-preview { height:min(44dvh,440px); max-height:none; }
.love-letter.has-plain-frame .artwork-stage::before {
  display:none;
}
.love-letter.has-plain-frame.format-canvas .artwork-stage::before {
  display:none;
}
.love-letter.has-plain-frame.frame-walnut { --frame-color:#5b3824; --frame-line:#d9b88d; }
.love-letter.has-plain-frame.frame-black { --frame-color:#14110e; --frame-line:#e9e0d2; }
.love-letter.has-plain-frame.frame-white { --frame-color:#f7f5ef; --frame-line:#bdb8ae; }
.love-letter.has-plain-frame { --frame-color:#f7f5ef; --frame-line:#bdb8ae; }
.love-letter.has-plain-frame .artwork-image {
  position:relative;
  z-index:1;
  max-width:min(42vw,380px);
  max-height:min(34dvh,340px);
  padding:clamp(18px,2.2vw,30px);
  border:clamp(11px,1.35vw,20px) solid var(--frame-color,#171411);
  outline:1px solid color-mix(in srgb,var(--frame-line,#fffdfa) 64%,transparent);
  outline-offset:calc(clamp(11px,1.35vw,20px) * -1);
  background:#f8f3e9;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb,var(--frame-line,#fffdfa) 72%,transparent),
    inset 0 0 0 4px rgba(255,255,255,.42),
    0 18px 48px rgba(23,20,17,.18),
    0 3px 8px rgba(23,20,17,.12);
}
.love-letter.has-plain-frame.format-canvas .artwork-image {
  max-width:min(48vw,460px);
  max-height:min(38dvh,380px);
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  box-shadow:0 16px 42px rgba(23,20,17,.16);
}

/* Wall finish belongs to the artwork preview, not the purchase controls. */
.artwork-stage { position:relative; }
.artwork-stage > .background-options { width:auto; margin:0; display:flex; place-items:center; }
.artwork-stage > .background-options .background-option { width:30px; min-width:30px; height:30px; padding:0; border-radius:50%; }
.artwork-stage > .background-options .background-option[data-background="light"] { background:#f4eee2; }
.artwork-stage > .background-options .background-option[data-background="dark"] { background:#171411; }
.artwork-stage > .background-options .background-option.is-selected { outline:2px solid currentColor; outline-offset:3px; }
.artwork-stage > .background-options {
  position:relative;
  top:auto;
  left:auto;
  z-index:4;
  justify-content:center;
  margin:0 auto 14px;
  transform:none;
  flex:0 0 auto;
}
.product-promise { margin:14px 0 0; color:#5d554c; font-size:.72rem; line-height:1.5; }
.wearable-shirt { display:block; width:100%; height:100%; object-fit:contain; }
.wearable-art { position:absolute; top:25%; left:37%; width:26%; height:42%; object-fit:contain; mix-blend-mode:screen; }
button { font:inherit; font-style:normal; font-weight:200; }
.exit-arrow { position:fixed; top:18px; left:20px; z-index:40; display:grid; width:36px; height:36px; place-items:center; border:0; background:transparent; box-shadow:none; color:#fff; font-size:22px; line-height:1; text-decoration:none; transition:transform .2s ease; }
.exit-arrow:hover,.exit-arrow:focus-visible { transform:translate(-2px,-2px); }
.floating-nav { position:fixed; top:18px; left:50%; z-index:40; transform:translateX(-50%); }
.room-sound-toggle { position:fixed; top:20px; right:20px; z-index:42; width:34px; height:34px; display:grid; place-items:center; padding:7px; border:0; background:transparent; box-shadow:none; color:#fff; cursor:pointer; }
.room-sound-toggle svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.room-sound-toggle:hover,.room-sound-toggle:focus-visible { transform:scale(1.05); }
.room-menu-toggle { position:fixed; top:20px; right:20px; z-index:72; display:grid; width:34px; height:34px; padding:0; place-items:center; border:0; background:transparent; color:#fff; box-shadow:none; cursor:pointer; font-size:24px; line-height:1; }
.room-sound-toggle:has(~ .room-menu-toggle),body:has(.room-menu-toggle) .room-sound-toggle { right:64px; }
.room-menu { position:fixed; inset:0 0 0 auto; z-index:71; width:min(520px,100%); padding:34px clamp(26px,6vw,72px); background:#171614; color:#fff; box-shadow:-18px 0 52px rgba(0,0,0,.34); transform:translateX(100%); transition:transform .6s cubic-bezier(.76,0,.24,1); }
.room-menu.is-open { transform:none; }
.room-menu-close { float:right; border:0; background:transparent; color:#fff; cursor:pointer; font:inherit; }
.room-menu nav { clear:both; display:flex; flex-direction:column; padding-top:14vh; text-align:left; }
.room-menu nav a { padding:16px 0; color:#fff; font-size:clamp(1.1rem,3vw,2rem); text-decoration:none; }
.room-menu .partner-menu{border:0;color:inherit}
.room-menu .partner-menu summary{padding:16px 0;list-style:none;cursor:pointer;font-size:clamp(1.1rem,3vw,2rem)}
.room-menu .partner-menu summary::-webkit-details-marker{display:none}
.room-menu .partner-menu summary::after{content:" +";font-weight:300}
.room-menu .partner-menu[open] summary::after{content:" -"}
.room-menu .partner-menu div{display:grid;margin:4px 0 0 clamp(14px,3vw,34px)}
.room-menu nav .partner-menu a{padding:10px 0;font-size:clamp(.72rem,1.28vw,1.02rem);line-height:1.35;opacity:.78}
.room-menu nav .partner-menu a:hover,.room-menu nav .partner-menu a:focus-visible{opacity:1}
.wordmark { display:block; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; color:#171614; font-family:'IBM Plex Mono',monospace; font-size:1.65rem; font-style:normal; font-weight:500; line-height:1; letter-spacing:.005em; text-decoration:none; }
.wordmark span { color:#d94a3d; }
.love-letter { display:grid; grid-template-rows:auto auto; gap:clamp(18px,3vh,30px); width:min(100% - 40px,820px); min-height:100dvh; margin:0 auto; padding:72px 0 clamp(30px,5vh,56px); overflow:visible; }
.love-letter.is-empty { grid-template-rows:1fr; place-items:center; }
.love-letter.is-empty .artwork-details { align-self:center; }
.love-letter.is-empty .artwork-prose { opacity:.55; }
.artwork-stage { position:relative; z-index:1; display:flex; min-height:0; flex-direction:column; align-items:center; justify-content:flex-start; }
.artwork-image { display:block; width:auto; max-width:min(78vw,680px); max-height:min(52dvh,560px); border:0; border-radius:0; background:transparent; box-shadow:0 16px 42px rgba(0,0,0,.18); object-fit:contain; opacity:1; filter:blur(0); transform:scale(1); transition:opacity .62s ease,filter .62s ease,transform .72s cubic-bezier(.22,.61,.36,1); }

/* The same approved frame, constrained when it is used inside collection cards. */
.city-card .love-letter,
.mini .love-letter,
.feature .love-letter { display:block; width:100%; min-height:0; margin:0; padding:0; }
.city-card .artwork-stage,
.mini .artwork-stage,
.feature .artwork-stage { width:100%; height:100%; min-height:0; }
.city-card .artwork-stage { aspect-ratio:1 / 1; }
.mini .artwork-stage { aspect-ratio:1.65 / 1; }
.feature .artwork-stage { aspect-ratio:1.15 / 1; }
.city-card .artwork-image,
.mini .artwork-image,
.feature .artwork-image { width:100%; height:100%; max-width:none; max-height:none; object-fit:cover; }
.r3-room .artwork-stage { isolation:isolate; padding:clamp(24px,4vh,44px) clamp(28px,5vw,58px); overflow:hidden; border-radius:32px; }
.r3-room .artwork-stage::before { content:""; position:absolute; inset:clamp(18px,3vh,34px) clamp(24px,4vw,48px); z-index:-2; border-radius:32px; background-image:var(--artwork-image); background-position:center; background-repeat:no-repeat; background-size:contain; opacity:.2; filter:blur(28px); transform:scale(1.04); }
.r3-room .artwork-stage::after { content:""; position:absolute; inset:clamp(12px,2vh,26px) clamp(18px,3vw,38px); z-index:-1; border-radius:32px; background:radial-gradient(ellipse at center,transparent 46%,color-mix(in srgb,var(--backdrop) 76%,transparent) 100%); box-shadow:inset 0 0 34px color-mix(in srgb,var(--backdrop) 82%,transparent); pointer-events:none; }
.r3-room .artwork-image { max-width:min(66vw,520px); max-height:min(46dvh,490px); padding:clamp(10px,1.8vh,20px); border-radius:26px; box-shadow:0 24px 58px rgba(0,0,0,.34); filter:drop-shadow(0 26px 42px rgba(0,0,0,.58)) drop-shadow(0 7px 14px rgba(0,0,0,.42)); }
.next-work { position:fixed; top:50%; right:20px; z-index:45; width:48px; height:48px; padding:0; border:0; background:transparent; color:var(--ink); box-shadow:none; cursor:pointer; font-size:32px; line-height:1; transform:translateY(-50%); transition:transform .2s ease; }
.next-work:hover,.next-work:focus-visible { transform:translateY(-50%) translateX(4px); }
.artwork-details { position:relative; z-index:2; width:min(100%,620px); margin:0 auto; text-align:center; opacity:1; filter:blur(0); transform:translateY(0); transition:opacity .52s ease,filter .52s ease,transform .62s cubic-bezier(.22,.61,.36,1); }
.aog-room .artwork-details { position:relative; }
.artwork-kicker { margin:0 0 12px; color:var(--muted); font-size:11px; letter-spacing:.14em; }
.love-letter.is-editorial { display:block; overflow-y:auto; padding:86px 24px 56px; }
.love-letter.is-editorial .artwork-stage { min-height:58px; }
.love-letter.is-editorial .artwork-details { width:min(100%,760px); }
.love-letter.is-editorial .artwork-prose { max-width:64ch; font-size:clamp(11px,1.5vw,14px); line-height:1.75; }
.love-letter.is-changing .artwork-image { opacity:0; filter:blur(9px); transform:scale(.985); }
.love-letter.is-changing .artwork-details { opacity:0; filter:blur(5px); transform:translateY(8px); }
.intermission-note { margin:0 0 7px; color:var(--muted); font-size:9px; letter-spacing:.08em; }
.artwork-details h1 { margin:0; font-size:clamp(18px,2.4vw,25px); font-weight:500; line-height:1.25; }
.artwork-variants { display:flex; width:max-content; margin:7px auto 0; gap:5px; }
.aog-room .artwork-variants { position:absolute; top:32px; left:50%; z-index:2; margin:0; transform:translateX(-50%); }
.artwork-variant { min-width:34px; padding:4px 8px; border:0; border-radius:999px; background:#d8d1c6; color:#4f4a43; box-shadow:0 5px 13px rgba(23,22,20,.14); cursor:pointer; font-size:8px; }
.artwork-variant.is-selected { background:#171614; color:#fff; box-shadow:0 7px 17px rgba(23,22,20,.28); }
.frame-options,.background-options { display:grid; width:min(100%,460px); margin:18px auto 0; gap:10px; place-items:start; }
.background-options { margin-top:9px; }
.artwork-stage > .background-options { position:relative; top:auto; left:auto; z-index:4; display:flex; width:auto; margin:0 auto 58px; transform:none; }
.frame-options-label { display:block; color:#171411; font-size:12px; font-weight:500; line-height:1.25; text-transform:lowercase; }
.background-options-label { color:#5f584f; font-size:12px; line-height:1.25; }
.frame-option-pills,.background-option-pills { display:flex; width:max-content; max-width:100%; flex-wrap:wrap; justify-content:flex-start; gap:12px; }
.frame-option,.background-option { position:relative; min-width:48px; width:48px; height:48px; padding:0; flex:0 0 auto; border:1px solid rgba(23,20,17,.16); border-radius:50%; background:#fffdfa; color:#171411; box-shadow:none; cursor:pointer; font-size:0; line-height:1.2; }
.frame-option::before,.background-option::before { display:none; }
.frame-option::after {
  content:"";
  display:inline-block;
  width:12px;
  height:12px;
  flex:0 0 12px;
  background:transparent;
  border:1px solid rgba(23,20,17,.16);
  mask:none;
  -webkit-mask:none;
}
.frame-option[data-frame="white"]::after,.frame-option[data-frame="0"]::after { background:#fffdfa; }
.frame-option[data-frame="black"]::after,.frame-option[data-frame="1"]::after { background:#171411; }
.frame-option[data-frame="walnut"]::after,.frame-option[data-frame="2"]::after { background:#76543d; }
.frame-option.is-selected,.background-option.is-selected { border-color:#171411; background:#fffdfa; color:#171411; box-shadow:0 0 0 2px #f5f2eb,0 0 0 3px #171411; }
.artwork-stage > .background-options .background-option { width:14px; min-width:14px; height:14px; padding:0; border-radius:50%; }
.artwork-stage > .background-options .background-option[data-background="light"] { background:#f4eee2; }
.artwork-stage > .background-options .background-option[data-background="dark"] { background:#171411; }
.artwork-stage > .background-options .background-option.is-selected { outline:1px solid currentColor; outline-offset:2px; }
.artwork-stage > .background-options .background-option-pills { gap:12px; }
.artwork-prose { max-width:58ch; margin:10px auto 0; color:var(--muted); font-size:clamp(10px,1.25vh,13px); line-height:1.55; white-space:pre-line; }
.audio-button { display:grid; width:38px; height:38px; margin:18px auto 0; padding:0 0 0 2px; place-items:center; border:1px solid rgba(255,255,255,.22); border-radius:50%; background:#171614; color:#fff; cursor:pointer; font-size:12px; line-height:1; }
.audio-button.is-playing { padding-left:0; font-size:10px; }
.aog-room .prose-audio-row { display:grid; grid-template-columns:27px minmax(0,1fr) 27px; width:min(100%,440px); margin:9px auto 0; align-items:center; gap:8px; }
.aog-room .love-letter:not(.is-editorial) .prose-audio-row { height:109px; }
.aog-room .prose-audio-row::before { content:""; width:27px; height:1px; }
.aog-room .prose-audio-row .artwork-prose { grid-column:2; width:100%; margin:0; justify-self:center; text-align:center; }
.aog-room .prose-audio-row .audio-button { grid-column:3; width:27px; height:27px; margin:0; padding:0 0 0 1px; border:1px solid rgba(23,22,20,.58); background:transparent; color:#171614; box-shadow:none; font-size:8px; }
.aog-room .prose-audio-row .audio-button.is-playing { padding-left:0; font-size:7px; }
.size-pills { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; width:min(100%,560px); margin:14px auto 0; }
.size-pills.is-grouped { display:grid; grid-template-columns:repeat(2,max-content); justify-content:center; gap:12px; width:max-content; max-width:100%; }
.format-group { display:grid; gap:6px; }
.format-group-label { margin:0; color:var(--muted); font-size:10px; line-height:1.35; }
.format-group-pills { display:grid; grid-template-columns:repeat(2,58px); gap:6px; }
.size-pills:has(.size-pill:only-child) { grid-template-columns:minmax(0,1fr); width:min(100%,260px); }
.size-pills.is-static { display:grid; grid-template-columns:minmax(0,1fr); width:min(100%,260px); margin-top:13px; }
.single-format { margin:0; color:var(--muted); font-size:11px; line-height:1.4; }
.size-pill { display:flex; min-height:58px; min-width:0; align-items:center; justify-content:center; gap:7px; padding:10px 12px; border:1px solid rgba(23,20,17,.28); border-radius:0; background:#fffdfa; color:#171411; box-shadow:none; cursor:pointer; font-size:11px; line-height:1.2; white-space:normal; }
.size-pill span { color:inherit; opacity:.78; font-size:12px; }
.size-pill.is-selected { border-color:#171411; background:#fffdfa; color:#171411; box-shadow:inset 0 0 0 1px #171411; }
.product-promise { margin:12px 0 0; color:#686158; font-size:12px; line-height:1.4; text-align:center; }
.add-to-cart,.checkout-button { margin-top:14px; padding:13px 22px; border:1px solid #171411; border-radius:999px; background:#171411; color:#fffdfa; box-shadow:none; cursor:pointer; font-size:14px; }
.floating-cart { position:fixed; top:18px; right:20px; z-index:50; width:min(340px,calc(100% - 40px)); max-height:calc(100dvh - 36px); padding:12px 14px; overflow:hidden; border:0; border-radius:18px; background:var(--paper); color:#171614; box-shadow:0 14px 38px rgba(0,0,0,.28); text-align:left; }
.cart-summary { display:flex; width:100%; justify-content:space-between; padding:9px 12px; border:0; border-radius:999px; background:#171614; color:#fff; cursor:pointer; font-size:12px; }
.cart-drawer { padding-top:16px; }
.cart-items { display:grid; gap:10px; max-height:min(38dvh,260px); overflow:auto; overscroll-behavior:contain; }
.cart-item { display:grid; grid-template-columns:1fr auto; gap:8px 16px; color:#77736d; font-size:10px; line-height:1.45; }
.cart-item strong { color:#171614; font-weight:200; }
.cart-item button { grid-column:2; padding:0; border:0; background:transparent; color:#77736d; cursor:pointer; }
.checkout-button { width:100%; margin-top:18px; background:#171614; color:var(--paper); }
.checkout-button:disabled { opacity:.45; cursor:wait; }
.cart-status { min-height:1.4em; margin:10px 0 0; font-size:10px; opacity:.68; }
:focus-visible { outline:2px solid #b65b43; outline-offset:4px; }
.collection-entrance { position:fixed; inset:0; z-index:100; display:grid; place-items:center; overflow:hidden; background:#0d0d0c; color:#fff; opacity:1; transition:opacity .8s ease,visibility .8s ease; }
.collection-entrance.is-leaving { opacity:0; visibility:hidden; pointer-events:none; }
.collection-entrance::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.58)); }
.entrance-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.62; filter:saturate(.72) brightness(.72); transform:scale(1.01); }
.collection-entrance--gods .entrance-image,.collection-entrance--r3 .entrance-image { object-fit:contain; opacity:.72; filter:none; }
.collection-entrance--gods { place-items:center; overflow:hidden; }
.collection-entrance--gods::after { background:radial-gradient(circle at center,rgba(0,0,0,.18),rgba(0,0,0,.56)); transition:background 3.8s ease; }
.collection-entrance--gods.sound-has-entered::after { background:radial-gradient(circle at center,rgba(0,0,0,.62),rgba(0,0,0,.82)); }
.collection-entrance--gods .entrance-image { position:absolute; width:100%; height:100%; object-position:center; opacity:.96; transform:scale(1.025); transition:opacity 3.8s ease,transform 12s cubic-bezier(.2,.65,.3,1),filter 3.8s ease; }
.collection-entrance--gods.sound-has-entered .entrance-image { opacity:.34; filter:brightness(.55); transform:scale(1); }
.entrance-copy--gods { display:grid; width:100%; height:100%; padding:clamp(44px,7vh,78px) clamp(34px,8vw,120px); place-items:center; }
.gods-typed { width:min(82vw,760px); min-height:min(72vh,620px); margin:0; display:grid; place-content:center; color:rgba(255,255,255,0); font-size:clamp(10px,1.12vw,15px) !important; line-height:1.58 !important; letter-spacing:.025em; white-space:pre-line; text-align:center; text-transform:lowercase; text-shadow:0 2px 20px rgba(0,0,0,.96); transition:color 1.6s ease; }
.collection-entrance--gods.is-typing .gods-typed { color:rgba(255,255,255,.94); }
.entrance-arrow { display:grid; width:58px; height:58px; margin:34px 0 0; padding:0; place-items:center; border:0; border-radius:0; background:transparent; box-shadow:none; font-size:32px; line-height:1; }
.collection-entrance--gods .entrance-arrow { position:fixed; right:clamp(28px,5vw,72px); bottom:28px; z-index:3; margin:0; }
.collection-entrance--gods .entrance-proceed { position:fixed; bottom:24px; left:50%; z-index:3; margin:0; padding:7px 12px; border:0; border-radius:999px; background:#a89d8c; color:#171614; box-shadow:0 8px 22px rgba(0,0,0,.28); font-size:8px; letter-spacing:.04em; transform:translateX(-50%); }
.collection-entrance--gods .entrance-proceed.is-pulsing { animation:gods-proceed-pulse 1.3s ease-in-out 3; }
.collection-entrance--gods .entrance-skip { position:fixed; right:clamp(22px,4vw,54px); bottom:24px; z-index:3; padding:7px 10px; border:0; background:transparent; color:rgba(255,255,255,.68); cursor:pointer; font-size:8px; letter-spacing:.04em; opacity:0; transform:translateY(4px); transition:opacity .8s ease,transform .8s ease,color .2s ease; }
.collection-entrance--gods .entrance-skip.is-visible { opacity:1; transform:none; }
.collection-entrance--gods .entrance-skip:hover,.collection-entrance--gods .entrance-skip:focus-visible { color:#fff; }
@keyframes gods-proceed-pulse { 0%,100% { opacity:.62; transform:translateX(-50%) scale(.94); box-shadow:0 6px 18px rgba(0,0,0,.22); } 50% { opacity:1; transform:translateX(-50%) scale(1.05); box-shadow:0 10px 30px rgba(168,157,140,.42); } }
body.is-entering > .exit-arrow,body.is-entering > .floating-nav,body.is-entering > .room-sound-toggle,body.is-entering > .room-menu-toggle { opacity:0; pointer-events:none; }
.collection-entrance--lagos .entrance-image { object-fit:contain; opacity:.78; filter:saturate(.8) brightness(.78); }
.entrance-copy { position:relative; z-index:1; width:min(90vw,680px); padding:28px; text-align:center; text-shadow:0 2px 22px rgba(0,0,0,.9); }
.entrance-copy h1 { margin:8px 0 12px; font-size:clamp(1.05rem,1.8vw,1.65rem); font-weight:500; line-height:1.35; letter-spacing:0; }
.entrance-copy p { margin:0; font-size:clamp(10px,1.2vw,14px); line-height:1.65; }
.entrance-kicker { letter-spacing:.08em; }
.entrance-button { margin-top:26px; padding:12px 20px; border:1px solid rgba(255,255,255,.42); border-radius:999px; background:#171614; color:#fff; cursor:pointer; font-size:11px; box-shadow:0 12px 32px rgba(0,0,0,.34); }
.collection-entrance--gods .entrance-arrow { border:0; border-radius:0; background:transparent; box-shadow:none; }
.collection-entrance--lagos .entrance-button { background:#39785c; border-color:#39785c; color:#fff; }
.collection-entrance--lagos .entrance-button:hover,.collection-entrance--lagos .entrance-button:focus-visible { background:#4b8d6e; border-color:#4b8d6e; }
.collection-entrance--lagos::after { background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.5)); }
.entrance-copy--lagos { align-self:end; padding-bottom:clamp(58px,11vh,120px); }
.entrance-typing { min-height:1.15em; color:#39ff78; font-size:clamp(1.05rem,1.8vw,1.65rem) !important; letter-spacing:0 !important; text-shadow:0 4px 32px rgba(0,0,0,.9); }
.entrance-typing::after { content:""; display:inline-block; width:.55ch; height:.85em; margin-left:.12em; border-right:2px solid currentColor; vertical-align:-.06em; animation:entrance-caret .72s steps(1) infinite; }
@keyframes entrance-caret { 50% { opacity:0; } }
@media(max-width:760px) {
  .floating-nav { top:12px; }
  .exit-arrow { top:12px; left:12px; }
  .room-sound-toggle { top:13px; right:12px; }
  .room-menu-toggle { top:13px; right:12px; }
  body:has(.room-menu-toggle) .room-sound-toggle { right:56px; }
  .love-letter { width:min(100% - 32px,820px); padding:34px 0 12px; gap:8px; }
  .artwork-stage { width:100%; min-width:0; min-height:0; padding:24px 0 0; overflow:visible; }
  .artwork-stage { margin-bottom:50px; }
  .artwork-stage > .background-options { width:max-content; max-width:calc(100% - 24px); flex-wrap:nowrap; gap:8px; margin-bottom:40px; }
  .artwork-stage > .background-options .background-option-pills { gap:10px; }
  .artwork-stage > .background-options .background-options-label { font-size:10px; white-space:nowrap; }
  .aog-room .artwork-stage { padding-right:0; }
  .aog-room .love-letter { grid-template-rows:minmax(0,1fr) 246px; padding-top:82px; gap:9px; }
  .aog-room .artwork-stage { min-height:0; padding:12px 0 0; }
  .artwork-image { max-width:calc(100% - 10px); max-height:44dvh; border-radius:0; }
  .aog-room .artwork-image { width:auto; height:min(46dvh,420px); max-width:min(64vw,430px); max-height:none; transform:translateY(-3px); }
  .aog-room .wearable-preview { width:auto; height:min(46dvh,420px); max-width:min(60vw,440px); max-height:none; transform:translateY(-3px); }
  .aog-room .love-letter:has(.artwork-variants:not([hidden])) .artwork-image { height:min(46dvh,420px); max-height:none; }
  .aog-room .love-letter:has(.artwork-variants:not([hidden])) .wearable-preview { height:min(46dvh,420px); max-height:none; }
  .love-letter.has-plain-frame .artwork-image {
    max-width:min(72vw,320px);
    max-height:min(30dvh,280px);
  }
  .love-letter.has-plain-frame.format-canvas .artwork-image {
    max-width:min(78vw,360px);
    max-height:min(34dvh,310px);
  }
  .r3-room .artwork-stage { padding:24px 30px; border-radius:24px; }
  .r3-room .artwork-image { max-width:100%; max-height:42dvh; padding:12px; border-radius:22px; }
  /* Keep artwork navigation outside the framed image on narrow screens. */
  .next-work {
    position:absolute;
    top:auto;
    right:0;
    bottom:-50px;
    width:44px;
    height:44px;
    transform:none;
  }
  .next-work:hover,
  .next-work:focus-visible { transform:translateX(4px); }
  .artwork-details h1 { font-size:16px; }
  .artwork-prose { margin-top:8px; font-size:9px; line-height:1.45; }
  .aog-room .artwork-details { width:min(94%,520px); }
  .aog-room .artwork-variants { margin-top:5px; gap:4px; }
  .aog-room .artwork-variants { top:24px; margin:0; }
  .aog-room .artwork-variant { min-width:30px; padding:3px 7px; font-size:7px; }
  .aog-room .frame-options { margin-top:6px; gap:3px; }
  .aog-room .frame-options-label { font-size:8px; }
  .aog-room .frame-option { min-width:50px; padding:15px 7px 4px; font-size:7px; }
  .aog-room .frame-option::before { width:28px; height:8px; border-width:3px; }
  .aog-room .artwork-prose { max-width:44ch; margin-top:5px; font-size:8px; line-height:1.28; }
  .aog-room .prose-audio-row { width:94%; margin-top:5px; gap:7px; }
  .aog-room .love-letter:not(.is-editorial) .prose-audio-row { height:80px; }
  .aog-room .prose-audio-row .audio-button { width:23px; height:23px; margin:0; font-size:7px; }
  .size-pills { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; width:100%; }
  .size-pills.is-grouped { grid-template-columns:repeat(2,max-content); gap:8px; }
  .format-group { gap:4px; }
  .format-group-pills { grid-template-columns:repeat(2,50px); gap:4px; }
  .aog-room .size-pills.is-grouped { width:max-content; max-width:100%; margin-top:7px; gap:8px; }
  .aog-room .format-group { gap:3px; }
  .aog-room .format-group-label { font-size:8px; line-height:1.2; }
  .aog-room .format-group-pills { gap:4px; }
  .size-pill { width:100%; padding:7px 12px; font-size:11px; }
  .aog-room .size-pill { padding:4px 6px; font-size:7px; }
  .add-to-cart { margin-top:9px; padding:9px 16px; font-size:10px; }
  .aog-room .add-to-cart { margin-top:7px; padding:7px 13px; font-size:8px; }
  .floating-cart { top:58px; right:12px; width:min(142px,calc(100% - 92px)); padding:5px 6px; border-radius:12px; box-shadow:0 8px 22px rgba(0,0,0,.2); }
  .floating-cart .cart-summary { padding:6px 8px; font-size:8px; }
  .floating-cart:has(.cart-drawer:not([hidden])) { width:calc(100% - 24px); }
  .floating-cart:has(.cart-drawer:not([hidden])) { padding:10px 12px; border-radius:16px; }
  .collection-entrance--gods { display:grid; }
  .collection-entrance--gods .entrance-image { position:absolute; width:100%; height:100%; }
  .entrance-copy--gods { width:100%; margin:0; padding:52px 24px 66px; }
  .gods-typed { width:92vw; min-height:74vh; font-size:clamp(9px,2.5vw,12px) !important; line-height:1.5 !important; }
  .collection-entrance--gods .entrance-arrow { right:18px; bottom:18px; margin:0; }
  .collection-entrance--gods .entrance-proceed { bottom:18px; }
  .collection-entrance--gods .entrance-skip { right:14px; bottom:18px; }
}

/* light collection rooms */
:root {
  --backdrop:#f5f2eb;
  --ink:#171411;
  --muted:#686158;
  --paper:#fffdfa;
}
body,
.lagos-room,
.clay-room,
.r3-room,
.aog-room {
  background:#f5f2eb;
  color:#171411;
}
.exit-arrow,
.room-sound-toggle,
.room-menu-toggle,
.next-work {
  color:#171411;
}
.wordmark {
  background:rgba(245,242,235,.86);
  color:#171411;
}
.room-menu {
  background:#f5f2eb;
  color:#171411;
  border-left:1px solid rgba(23,20,17,.14);
}
.room-menu-close,
.room-menu nav a {
  color:#171411;
}
.room-menu-toggle[aria-expanded="true"],
body.nav-open .room-menu-toggle {
  color:#171411;
}
.artwork-prose,
.intermission-note,
.frame-options-label,
.background-options-label,
.format-group-label,
.single-format {
  color:#686158;
}
.artwork-variant,
.frame-option,
.background-option {
  background:#fffdfa;
  color:#171411;
  box-shadow:0 6px 18px rgba(23,20,17,.12);
}
.artwork-variant.is-selected,
.frame-option.is-selected,
.background-option.is-selected,
.size-pill,
.add-to-cart,
.checkout-button,
.cart-summary {
  background:#171411;
  color:#fffdfa;
}
.size-pill {
  border-color:rgba(23,20,17,.18);
  box-shadow:0 9px 22px rgba(23,20,17,.12);
}
.size-pill.is-selected {
  background:#171411;
  border-color:#171411;
}
.audio-button {
  border-color:rgba(23,20,17,.18);
  background:#fffdfa;
  color:#171411;
}
.collection-entrance {
  background:#f5f2eb;
  color:#171411;
}
.collection-entrance::after {
  background:linear-gradient(180deg,rgba(245,242,235,.08),rgba(245,242,235,.58));
}
.collection-entrance--gods::after {
  background:radial-gradient(circle at center,rgba(245,242,235,.18),rgba(245,242,235,.64));
}
.collection-entrance--gods.sound-has-entered::after {
  background:radial-gradient(circle at center,rgba(245,242,235,.62),rgba(245,242,235,.86));
}
.gods-typed,
.collection-entrance--gods.is-typing .gods-typed {
  color:#171411;
  text-shadow:none;
}
.collection-entrance--gods .entrance-skip {
  color:#5f584f;
}
.entrance-copy {
  text-shadow:none;
}
.entrance-typing {
  color:#39785c;
  text-shadow:none;
}
body.product-bg-dark,
body.product-bg-dark.lagos-room,
body.product-bg-dark.clay-room,
body.product-bg-dark.r3-room,
body.product-bg-dark.aog-room {
  --backdrop:#171411;
  --ink:#f7f3ea;
  --muted:#b9b0a2;
  --paper:#23201c;
  background:#171411;
  color:#f7f3ea;
}
body.product-bg-dark .exit-arrow,
body.product-bg-dark .room-sound-toggle,
body.product-bg-dark .room-menu-toggle,
body.product-bg-dark .next-work {
  color:#f7f3ea;
}
body.product-bg-dark .wordmark {
  background:transparent;
  color:#171614;
  box-shadow:none;
}
body.product-bg-dark .artwork-prose,
body.product-bg-dark .intermission-note,
body.product-bg-dark .frame-options-label,
body.product-bg-dark .background-options-label,
body.product-bg-dark .format-group-label,
body.product-bg-dark .single-format {
  color:#b9b0a2;
}
body.product-bg-dark .artwork-variant,
body.product-bg-dark .frame-option,
body.product-bg-dark .background-option,
body.product-bg-dark .audio-button {
  background:#2b2620;
  color:#f7f3ea;
  box-shadow:0 8px 20px rgba(0,0,0,.24);
}
body.product-bg-dark .artwork-variant.is-selected,
body.product-bg-dark .frame-option.is-selected,
body.product-bg-dark .background-option.is-selected,
body.product-bg-dark .size-pill,
body.product-bg-dark .add-to-cart,
body.product-bg-dark .checkout-button,
body.product-bg-dark .cart-summary {
  background:#f7f3ea;
  color:#171411;
}
body.product-bg-dark .size-pill {
  border-color:rgba(247,243,234,.2);
  box-shadow:0 10px 24px rgba(0,0,0,.28);
}
body.product-bg-dark .size-pill.is-selected {
  background:#5e8f73;
  border-color:#5e8f73;
  color:#fff;
}
body.product-bg-dark .floating-cart {
  background:#23201c;
  color:#f7f3ea;
}
body.product-bg-dark .cart-item,
body.product-bg-dark .cart-item button {
  color:#b9b0a2;
}
body.product-bg-dark .cart-item strong {
  color:#f7f3ea;
}
body.product-bg-dark .room-menu {
  background:#171411;
  color:#f7f3ea;
  border-left-color:rgba(247,243,234,.14);
}
body.product-bg-dark .room-menu-close,
body.product-bg-dark .room-menu nav a,
body.product-bg-dark.nav-open .room-menu-toggle {
  color:#f7f3ea;
}
@media(max-height:700px) {
  .love-letter { padding-top:54px; gap:9px; }
  .artwork-image { max-height:43dvh; }
  .artwork-details h1 { font-size:15px; }
  .artwork-prose { margin-top:6px; font-size:9px; line-height:1.4; }
  .size-pills { margin-top:9px; }
  .size-pill { padding-block:6px; font-size:8px; }
  .add-to-cart { margin-top:8px; padding-block:8px; font-size:9px; }
}
@media(prefers-reduced-motion:reduce) { .next-work,.artwork-image,.artwork-details,.collection-entrance { transition:none; } .entrance-typing::after,.collection-entrance--gods .entrance-proceed.is-pulsing { animation:none; } }

/* product detail layout */
.lagos-room .love-letter,
.clay-room .love-letter,
.aog-room .love-letter,
.r3-room .love-letter {
  width:min(100% - 56px,1180px);
  min-height:100svh;
  grid-template-columns:minmax(280px,560px) minmax(280px,420px);
  grid-template-rows:auto;
  gap:clamp(34px,5vw,82px);
  align-items:center;
  justify-content:center;
  padding:clamp(90px,12vh,132px) 0 clamp(48px,8vh,90px);
}
.lagos-room .artwork-stage,
.clay-room .artwork-stage,
.aog-room .artwork-stage,
.r3-room .artwork-stage {
  min-height:0;
  padding:0;
  place-items:center;
}
.lagos-room .artwork-details,
.clay-room .artwork-details,
.aog-room .artwork-details,
.r3-room .artwork-details {
  width:100%;
  margin:0;
  text-align:left;
}
.lagos-room .artwork-details h1,
.clay-room .artwork-details h1,
.aog-room .artwork-details h1,
.r3-room .artwork-details h1 {
  color:#171411;
  font-size:clamp(1.15rem,1.55vw,1.55rem);
  font-weight:500;
  line-height:1.25;
  letter-spacing:0;
}
.lagos-room .artwork-prose,
.clay-room .artwork-prose,
.aog-room .artwork-prose,
.r3-room .artwork-prose {
  max-width:44ch;
  margin:14px 0 0;
  color:#3f3932;
  font-size:clamp(.78rem,.92vw,.9rem);
  font-weight:400;
  line-height:1.65;
}
.lagos-room .audio-button,
.clay-room .audio-button,
.aog-room .audio-button,
.r3-room .audio-button {
  margin:20px 0 0;
}
.lagos-room .frame-options,
.lagos-room .background-options,
.clay-room .frame-options,
.clay-room .background-options,
.aog-room .frame-options,
.aog-room .background-options,
.r3-room .frame-options,
.r3-room .background-options {
  width:100%;
  margin:20px 0 0;
  justify-items:start;
  place-items:start;
}
.lagos-room .frame-options-label,
.lagos-room .background-options-label,
.clay-room .frame-options-label,
.clay-room .background-options-label,
.aog-room .frame-options-label,
.aog-room .background-options-label,
.r3-room .frame-options-label,
.r3-room .background-options-label,
.lagos-room .format-group-label,
.clay-room .format-group-label,
.aog-room .format-group-label,
.r3-room .format-group-label {
  color:#4c453d;
  font-weight:400;
}
.lagos-room .frame-option,
.lagos-room .background-option,
.clay-room .frame-option,
.clay-room .background-option,
.aog-room .frame-option,
.aog-room .background-option,
.r3-room .frame-option,
.r3-room .background-option,
.lagos-room .size-pill,
.clay-room .size-pill,
.aog-room .size-pill,
.r3-room .size-pill {
  font-weight:400;
}
.lagos-room .size-pills,
.clay-room .size-pills,
.aog-room .size-pills,
.r3-room .size-pills {
  width:min(100%,440px);
  margin:22px 0 0;
}
.lagos-room .size-pills.is-grouped,
.clay-room .size-pills.is-grouped,
.aog-room .size-pills.is-grouped,
.r3-room .size-pills.is-grouped {
  justify-content:start;
  margin-left:0;
}
.lagos-room .add-to-cart,
.clay-room .add-to-cart,
.aog-room .add-to-cart,
.r3-room .add-to-cart {
  margin-top:18px;
}
.love-letter.has-plain-frame .artwork-image {
  max-width:min(100%,460px);
  max-height:min(68svh,620px);
  padding:clamp(20px,2.4vw,34px);
  border:clamp(12px,1.35vw,20px) solid var(--frame-color,#171411);
  background:#f8f3e9;
}
.love-letter.has-plain-frame.format-canvas .artwork-image {
  max-width:min(100%,560px);
  max-height:min(70svh,640px);
}
.wearable-preview {
  max-width:min(100%,520px);
  height:min(58svh,560px);
}
.next-work {
  right:clamp(18px,3vw,44px);
}
body.product-bg-dark.lagos-room .artwork-prose,
body.product-bg-dark.clay-room .artwork-prose,
body.product-bg-dark.aog-room .artwork-prose,
body.product-bg-dark.r3-room .artwork-prose,
body.product-bg-dark .product-promise {
  color:#b9b0a2;
}
body.product-bg-dark.lagos-room .artwork-details h1,
body.product-bg-dark.clay-room .artwork-details h1,
body.product-bg-dark.aog-room .artwork-details h1,
body.product-bg-dark.r3-room .artwork-details h1 {
  color:#f7f3ea;
}
@media(max-width:860px) {
  .lagos-room .love-letter,
  .clay-room .love-letter,
  .aog-room .love-letter,
  .r3-room .love-letter {
    width:min(100% - 32px,560px);
    min-height:auto;
    grid-template-columns:1fr;
    gap:26px;
    padding:76px 0 54px;
  }
  .lagos-room .artwork-details,
  .clay-room .artwork-details,
  .aog-room .artwork-details,
  .r3-room .artwork-details {
    text-align:center;
  }
  .lagos-room .artwork-prose,
  .clay-room .artwork-prose,
  .aog-room .artwork-prose,
  .r3-room .artwork-prose {
    margin-inline:auto;
  }
  .lagos-room .audio-button,
  .clay-room .audio-button,
  .aog-room .audio-button,
  .r3-room .audio-button {
    margin-inline:auto;
  }
  .lagos-room .frame-options,
  .lagos-room .background-options,
  .clay-room .frame-options,
  .clay-room .background-options,
  .aog-room .frame-options,
  .aog-room .background-options,
  .r3-room .frame-options,
  .r3-room .background-options {
    justify-items:center;
    place-items:center;
  }
  .lagos-room .size-pills,
  .clay-room .size-pills,
  .aog-room .size-pills,
  .r3-room .size-pills {
    margin-inline:auto;
  }
  .love-letter.has-plain-frame .artwork-image {
    width:auto;
    max-width:100%;
    max-height:42dvh;
    padding:clamp(16px,4vw,24px);
  }
  .lagos-room .artwork-details,
  .clay-room .artwork-details,
  .aog-room .artwork-details,
  .r3-room .artwork-details { width:100%; min-width:0; }
  .lagos-room .artwork-prose,
  .clay-room .artwork-prose,
  .aog-room .artwork-prose,
  .r3-room .artwork-prose { max-width:100%; padding:0 8px; }
  .product-promise { max-width:100%; padding:0 8px; font-size:10px; }
}